.divination-page { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.divination-switch { position: relative; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; padding: 5px; border-radius: 999px; background: #ececef; box-shadow: inset 0 2px 4px rgba(36,35,33,.06); }
.divination-switch button { padding: 10px 14px; border: 0; border-radius: 999px; background: transparent; color: var(--ink-2); cursor: pointer; font-size: var(--fs-caption); font-weight: 600; transition: color .25s ease, background .35s cubic-bezier(.4, 1.25, .6, 1), box-shadow .35s ease, transform .35s cubic-bezier(.4, 1.25, .6, 1); }
.divination-switch button.is-active { background: #fff; color: var(--ink-1); box-shadow: 0 4px 10px rgba(36,35,33,.12), 0 1px 2px rgba(36,35,33,.06); transform: scale(1.02); }
.divination-screen { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.divination-screen[hidden] { display: none; }
.subpage-head { display: grid; gap: 5px; }
.subpage-head h2 { margin: 0; font-size: var(--fs-title); }
.subpage-head p { margin: 0; color: var(--color-muted); font-size: var(--fs-caption); line-height: 1.5; }
.back-link { justify-self: start; padding: 0; border: 0; background: transparent; color: var(--color-accent); cursor: pointer; font-size: var(--fs-caption); font-weight: 650; }
.today-tools { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.divination-page > .section-heading { margin-top: 8px; }
.divination-page > .section-heading:first-of-type { margin-top: 0; }
.method-grid { scroll-margin-top: 12px; }
.method-panel { scroll-margin-top: 12px; }
.divination-date { color: var(--color-muted); font-size: var(--fs-caption); line-height: 1.5; text-align: right; }
.divination-date span { font-size: var(--fs-caption); }
.section-heading { display: flex; align-items: baseline; justify-content: space-between; margin-top: 3px; }
.section-heading strong { font-size: var(--fs-lead); }
.section-heading span { color: var(--color-muted); font-size: var(--fs-caption); }
.detail-label { color: var(--color-accent); font-size: var(--fs-caption); font-weight: 700; letter-spacing: 1px; }
.today-hexagram-card { display: flex; flex-direction: column; gap: 10px; padding: 13px; background: #fff; border-color: rgba(36,35,33,.1); }
.today-hexagram-card__heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.today-hexagram-card__heading h2 { margin: 5px 0 0; color: #3b2e2b; font-size: var(--fs-heading); font-weight: 650; }
.today-hexagram-card__hint { color: #9a8179; font-size: var(--fs-caption); white-space: nowrap; }
.today-hexagram-pair { display: grid; grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1fr); align-items: stretch; gap: 6px; }
.today-hexagram-stack { display: flex; flex-direction: column; gap: 6px; }
.today-hexagram-arrow--down { flex-direction: row; justify-content: center; }
.today-hexagram-arrow--down i { font-size: var(--fs-body); }
.today-hexagram-mini { min-width: 0; padding: 12px 14px; border: 1px solid rgba(36,35,33,.1); border-radius: 17px; background: #fff; }
.today-hexagram-mini__body { display: grid; grid-template-columns: 1fr 3fr; gap: 14px; align-items: center; }
.today-hexagram-mini__figure { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.today-hexagram-mini__label { color: var(--color-accent); font-size: var(--fs-caption); font-weight: 700; }
.today-hexagram-mini__figure .yao-lines { display: grid; gap: 6px; width: 100%; }
.today-hexagram-mini__figure .yao-line { height: 9px; }
.today-hexagram-mini__figure .yao-line i { height: 9px; top: 0; }
.today-hexagram-mini__info h3 { margin: 0 0 6px; color: #3b2e2b; font-size: var(--fs-heading); font-weight: 650; }
.today-hexagram-mini.is-changing .today-hexagram-mini__info h3 { color: #514a46; }
.today-hexagram-mini__info p { margin: 0; color: #776762; font-size: var(--fs-caption); line-height: 1.55; }
.today-hexagram-mini.is-changing { border-color: rgba(36,35,33,.08); background: #fafafa; }
.today-hexagram-mini__head { display: flex; align-items: center; justify-content: space-between; gap: 6px; color: var(--color-accent); font-size: var(--fs-caption); font-weight: 700; }
.today-hexagram-mini.is-changing .today-hexagram-mini__head { color: #756762; }
.today-hexagram-mini__head small { color: var(--color-muted); font-size: var(--fs-caption); font-weight: 400; }
.yao-lines { display: grid; gap: 4px; }
.yao-line { display: flex; align-items: center; gap: 8%; height: 8px; }
.yao-line .yao-half { display: block; flex: 1; border-radius: 99px; background: #514944; height: 100%; }
.yao-line .yao-gap { width: 8%; height: 100%; flex-shrink: 0; }
.yao-line.is-moving .yao-half { background: var(--accent); }
.today-hexagram-mini h3 { margin: 0 0 6px; color: #3b2e2b; font-size: var(--fs-heading); font-weight: 650; }
.today-hexagram-mini.is-changing h3 { color: #514a46; }
.today-hexagram-mini p { margin: 9px 0 0; color: #776762; font-size: var(--fs-caption); line-height: 1.5; }
.today-hexagram-mini .trigram-pair { display: flex; flex-wrap: wrap; gap: 4px; color: #806f69; font-size: var(--fs-caption); }
.today-hexagram-mini .trigram-pair span { padding: 3px 5px; border-radius: 99px; background: rgba(36,35,33,.06); }
.today-hexagram-arrow { display: flex; flex-direction: column; align-items: center; gap: 2px; color: var(--ink-2, #6f6963); font-size: var(--fs-micro); text-align: center; }
.today-hexagram-arrow strong { font-size: var(--fs-caption); }
.today-hexagram-arrow i { font-size: var(--fs-heading); font-style: normal; }
.today-hexagram-summary { display: grid; gap: 7px; padding-top: 10px; border-top: 1px solid rgba(36,35,33,.08); }
.reading-row { padding: 8px 11px; border-radius: 12px; background: rgba(255,255,255,.7); }
.reading-row strong { display: block; color: #4b3b37; font-size: var(--fs-caption); }
.reading-row p { margin: 5px 0 0; color: #776762; font-size: var(--fs-caption); line-height: 1.6; }
.detail-link { justify-self: start; padding: 0; border: 0; background: transparent; color: var(--color-accent); cursor: pointer; font-size: var(--fs-caption); font-weight: 650; }
.detail-link b { margin-left: 3px; font-size: var(--fs-heading); font-weight: 400; vertical-align: -1px; }
.hexagram-detail { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; max-height: 0; overflow: hidden; opacity: 0; transition: max-height .35s ease, opacity .25s ease, padding-top .35s ease; }
.hexagram-detail.is-open { max-height: 520px; padding-top: 13px; border-top: 1px solid rgba(36,35,33,.08); opacity: 1; }
.detail-block { padding: 10px; border-radius: 13px; background: rgba(255,255,255,.72); }
.detail-block strong { display: block; margin-bottom: 5px; color: #4b3b37; font-size: var(--fs-caption); }
.detail-block p { margin: 0; color: #776762; font-size: var(--fs-caption); line-height: 1.55; }
.save-learning { grid-column: 1 / -1; justify-self: start; padding: 8px 11px; border: 0; border-radius: 99px; background: #f5f5f7; color: var(--ink-1, #242321); cursor: pointer; font-size: var(--fs-caption); font-weight: 650; }
.method-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }
.method-card { position: relative; display: flex; flex-direction: column; align-items: flex-start; min-height: 87px; padding: 12px 9px; border: 1px solid var(--color-border); text-align: left; cursor: pointer; transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease; }
.method-card strong { color: var(--color-text); font-size: 16px; font-weight: 700; }
.method-card span { margin-top: 7px; color: var(--color-muted); font-size: 12px; line-height: 1.35; }
.method-card b { position: absolute; right: 8px; bottom: 7px; color: var(--color-muted); font-size: var(--fs-body); font-weight: 400; }
.method-card:hover, .method-card.is-active { border-color: rgba(36,35,33,.2); background: #f5f5f7; box-shadow: 0 8px 18px rgba(44,38,32,.08); transform: translateY(-2px); }
.method-card.is-active strong, .method-card.is-active b { color: var(--color-accent); }
.method-panel { padding: 14px; background: rgba(255,255,255,.88); }
.method-panel__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.method-panel__top div { display: flex; flex-direction: column; gap: 3px; }
.method-panel__top strong { font-size: var(--fs-lead); }
.method-panel__top span, .method-panel p { color: var(--color-muted); font-size: var(--fs-caption); }
.method-panel p { margin: 10px 0 0; line-height: 1.5; }
.method-run { padding: 7px 11px; border: 0; border-radius: 99px; background: var(--color-accent); color: #fff; cursor: pointer; font-size: var(--fs-caption); font-weight: 650; }
.method-panel__time, .coin-toss-row { display: flex; gap: 7px; margin-top: 12px; }
.method-panel__time span, .coin-toss-row i { flex: 1; padding: 8px 5px; border-radius: 9px; background: #f5f5f7; color: #6d6d72; font-size: var(--fs-caption); font-style: normal; text-align: center; }
.coin-mode-switch { display: flex; gap: 4px; margin-top: 12px; padding: 3px; border-radius: 10px; background: #f0f0f2; }
.coin-mode-switch button { flex: 1; padding: 7px; border: 0; border-radius: 8px; background: transparent; color: var(--color-muted); cursor: pointer; font-size: var(--fs-caption); }
.coin-mode-switch button.is-active { background: #fff; color: var(--color-accent); box-shadow: 0 2px 6px rgba(35,35,42,.1); }
.coin-mode-hint, .manual-coins small { display: block; margin-top: 8px; color: var(--color-muted); font-size: var(--fs-micro); }
.coin-toss-button { margin-top: 10px; }
.coin-toss-list, .liuren-steps, .liuren-prompts { display: grid; gap: 7px; margin-top: 10px; }
.coin-toss-item { display: grid; grid-template-columns: 45px 1fr auto; align-items: center; gap: 7px; padding: 7px 8px; border-radius: 10px; background: #f7f7f8; color: #776762; font-size: var(--fs-caption); }
.coin-toss-item > span { display: flex; gap: 4px; }
.coin-toss-item i { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: #fff; color: var(--accent); font-style: normal; font-size: var(--fs-micro); }
.coin-toss-item small { color: var(--color-muted); font-size: var(--fs-micro); }
.liuren-outcome > strong { display: block; color: var(--color-accent); font-size: var(--fs-lead); }
.liuren-outcome > span { color: #776762; font-size: var(--fs-caption); }
.liuren-steps { grid-template-columns: repeat(3, 1fr); }
.liuren-steps div { padding: 8px; border-radius: 10px; background: #f7f7f8; }
.liuren-steps small, .liuren-steps b { display: block; }
.liuren-steps small { color: var(--color-muted); font-size: var(--fs-micro); }
.liuren-steps b { margin-top: 4px; color: #514944; font-size: var(--fs-caption); }
.liuren-prompts p { margin: 0; }
.manual-coins { display: grid; gap: 5px; margin-top: 12px; color: var(--color-muted); font-size: var(--fs-caption); }
.manual-coins input, .lookup-toolbar input { min-width: 0; border: 1px solid var(--color-border); border-radius: 9px; padding: 8px 9px; background: #fff; color: var(--color-text); outline: none; font: inherit; }
.method-panel__result { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--color-border); color: var(--color-muted); font-size: var(--fs-caption); }
.method-panel__result strong { margin-right: 6px; color: var(--color-accent); font-size: var(--fs-caption); }
.method-result-chain { display: flex; align-items: center; gap: 8px; }
.method-result-chain span { color: #776762; }
.coin-outcome__main strong { display: block; margin-bottom: 4px; color: var(--color-accent); font-size: var(--fs-body); }
.coin-outcome__main span { color: #776762; font-size: var(--fs-caption); }
.coin-outcome__main p, .coin-advanced p { margin: 7px 0 0; color: #776762; font-size: var(--fs-caption); line-height: 1.5; }
.coin-advanced { margin-top: 10px; padding: 8px 10px; border-radius: 10px; background: #f7f7f8; }
.coin-advanced summary { color: #6d6d72; cursor: pointer; font-size: var(--fs-caption); }
.coin-advanced b { color: #514944; }
.lookup-entry, .learning-entry { display: flex; flex-direction: column; gap: 9px; padding: 14px; }
.lookup-entry-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.lookup-entry-head h2 { margin: 4px 0 3px; font-size: var(--fs-heading); }
.lookup-entry-head p { margin: 0; color: var(--color-muted); font-size: var(--fs-caption); line-height: 1.45; }
.lookup-open { flex: 0 0 auto; padding: 8px 10px; border: 0; border-radius: 99px; background: var(--accent-bg); color: var(--accent); cursor: pointer; font-size: var(--fs-caption); font-weight: 650; }
.lookup-open b { margin-left: 3px; font-size: var(--fs-body); font-weight: 400; }
.lookup-body { display: none; }
.lookup-body.is-open { display: flex; flex-direction: column; gap: 9px; padding-top: 12px; border-top: 1px solid var(--color-border); }
.lookup-categories { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.lookup-category { display: flex; flex-direction: column; gap: 5px; padding: 10px 7px; border: 1px solid var(--color-border); border-radius: 14px; background: rgba(255,255,255,.78); color: var(--color-text); cursor: pointer; text-align: left; transition: transform .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease; }
.lookup-category strong { font-size: var(--fs-caption); }
.lookup-category span { color: var(--color-muted); font-size: var(--fs-micro); }
.lookup-category.is-active, .lookup-category:hover { border-color: rgba(185,79,73,.25); background: #f5f5f7; box-shadow: 0 6px 14px rgba(44,38,32,.07); transform: translateY(-2px); }
.lookup-category.is-active strong { color: var(--color-accent); }
.lookup-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--color-muted); font-size: var(--fs-caption); }
.lookup-toolbar label { display: flex; gap: 4px; }
.lookup-toolbar input { width: 105px; padding: 7px 8px; font-size: var(--fs-caption); }
.lookup-toolbar button { border: 0; border-radius: 8px; padding: 7px 9px; background: var(--accent-bg); color: var(--accent); cursor: pointer; font-size: var(--fs-caption); }
.hexagram-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; }
.hexagram-list__item { display: flex; align-items: center; gap: 7px; min-height: 44px; padding: 7px 9px; border: 1px solid rgba(227,227,232,.9); border-radius: 12px; background: rgba(255,255,255,.72); color: var(--color-text); cursor: pointer; text-align: left; }
.hexagram-list__item > span:not(.hexagram-list__figure) { color: var(--color-muted); font-size: var(--fs-micro); }
.hexagram-list__item strong { flex: 1; font-size: var(--fs-caption); font-weight: 600; }
.hexagram-list__item b { color: var(--color-muted); font-size: var(--fs-body); font-weight: 400; }
.hexagram-list__figure { display: flex; align-items: center; width: 23px; flex: 0 0 23px; }
.hexagram-list__figure .yao-lines { width: 22px; gap: 2px; }
.hexagram-list__figure .yao-line { height: 3px; gap: 2px; }
.lookup-detail { display: none; padding: 14px; }
.lookup-detail.is-open { display: block; }
.lookup-detail__hero { display: flex; align-items: center; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--color-border); }
.lookup-detail__hero .yao-lines { flex: 0 0 40px; }
.lookup-detail__hero h3 { margin: 0 0 4px; font-size: var(--fs-heading); }
.lookup-detail__hero span { color: var(--color-muted); font-size: var(--fs-caption); }
.lookup-detail__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 12px; }
.lookup-detail__grid article { padding: 9px; border-radius: 11px; background: #f7f7f8; }
.lookup-detail__grid strong { display: block; margin-bottom: 5px; color: #4b3b37; font-size: var(--fs-caption); }
.lookup-detail__grid p { margin: 0; color: var(--color-muted); font-size: var(--fs-caption); line-height: 1.5; }
.yao-detail { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--color-border); }
.yao-detail summary { color: var(--color-accent); cursor: pointer; font-size: var(--fs-caption); font-weight: 650; }
.yao-detail__list { display: grid; gap: 6px; margin-top: 8px; }
.yao-detail__list article { padding: 8px 9px; border-radius: 9px; background: #f7f7f8; }
.yao-detail__list strong { display: block; margin-bottom: 4px; color: #4b3b37; font-size: var(--fs-caption); }
.yao-detail__list p, .yao-detail__list small { margin: 0; color: var(--color-muted); font-size: var(--fs-caption); line-height: 1.5; }
.yao-detail__list small { display: block; margin-top: 3px; color: #9a8179; }
.reading-detail { display: grid; max-height: none; padding-top: 12px; opacity: 1; overflow: visible; }
.shared-hexagram-detail { grid-column: 1 / -1; }
.result-detail { margin-top: 12px; }
.result-detail.is-collapsed { display: none; }
.result-detail.is-open { display: block; max-height: none; padding-top: 12px; border-top: 1px solid var(--color-border); opacity: 1; }
.result-detail .shared-hexagram-detail { padding-top: 12px; border-top: 1px solid var(--color-border); }
.coin-complete { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 10px; padding: 10px; border-radius: 11px; background: #f5f5f7; }
.coin-complete strong { color: var(--color-accent); font-size: var(--fs-caption); }
.coin-complete span { color: var(--color-muted); font-size: var(--fs-micro); }
.coin-complete button { margin-left: auto; }
.coin-process-details { margin-top: 10px; }
.coin-process-details summary { color: var(--color-accent); cursor: pointer; font-size: var(--fs-caption); }
.coin-process-details .coin-toss-list { margin-top: 8px; }
.coin-process { display: grid; gap: 6px; margin-bottom: 12px; }
.learning-record-list { display: grid; gap: 8px; }
.learning-record { padding: 12px; border-radius: 12px; background: #f7f7f8; }
.learning-record__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.learning-record__head strong { display: block; color: #4b3b37; font-size: var(--fs-caption); }
.learning-record__head span { display: block; margin-top: 4px; color: var(--color-muted); font-size: var(--fs-micro); }
.learning-record__meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; color: #776762; font-size: var(--fs-micro); }
.learning-record > p { margin: 7px 0 0; color: #776762; font-size: var(--fs-caption); line-height: 1.5; }
.record-open, .record-save, .record-cancel, .record-delete { padding: 5px 8px; border: 0; border-radius: 8px; cursor: pointer; font-size: var(--fs-micro); }
.record-open, .record-save { background: var(--accent-bg); color: var(--accent); }
.record-cancel { background: #ecebed; color: #6d6d72; }
.record-delete { background: transparent; color: var(--accent); }
.learning-record__editor { display: none; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px solid #e6e3e1; }
.learning-record.is-editing .learning-record__editor { display: grid; }
.learning-record__editor label { display: grid; gap: 5px; color: #6d6d72; font-size: var(--fs-micro); }
.learning-record__editor textarea { min-height: 72px; resize: vertical; border: 1px solid var(--color-border); border-radius: 9px; padding: 8px; background: #fff; color: var(--color-text); font: inherit; font-size: var(--fs-caption); }
.learning-record__editor > div { display: flex; gap: 6px; }
.learning-empty { padding: 16px; text-align: center; }
.learning-empty strong { color: #4b3b37; font-size: var(--fs-caption); }
.learning-empty p { margin: 6px 0 0; }
@media (max-width: 380px) {
  .today-hexagram-card { padding: 12px; }
  .today-hexagram-card__heading { align-items: flex-start; flex-direction: column; }
  .today-hexagram-pair { grid-template-columns: 1fr; }
  .today-hexagram-arrow { flex-direction: row; justify-content: center; transform: none; }
  .today-hexagram-mini { min-height: 122px; }
  .hexagram-detail, .lookup-detail__grid { grid-template-columns: 1fr; }
  .method-grid, .lookup-categories, .today-tools { grid-template-columns: 1fr 1fr; }
  .lookup-toolbar { align-items: flex-start; flex-direction: column; }
  .lookup-toolbar label { width: 100%; }
  .lookup-toolbar input { flex: 1; width: auto; }
}

/* ===== 卦象详情新页面（独立路由 divination-detail） ===== */
.hex-detail-page { gap: 14px; }
.hex-detail-header { align-items: center; gap: 14px; margin-bottom: 14px; }
.hex-detail-head-right { display: flex; flex-direction: column; gap: 2px; }
.hex-detail-head-right .page-title { font-size: var(--fs-title); }
.back-circle { flex: 0 0 auto; width: 40px; height: 40px; border: 0; border-radius: 50%; background: #fff; color: var(--ink-1); font-size: 24px; line-height: 1; cursor: pointer; box-shadow: 0 2px 8px rgba(36,35,33,.1); display: grid; place-items: center; transition: transform .18s cubic-bezier(.34,1.4,.64,1), opacity .18s ease; }
.back-circle:active { transform: scale(.92); opacity: .85; }
.hex-detail-block { display: flex; flex-direction: column; gap: 6px; padding: 14px 15px; }
.hex-detail-hero { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: center; }
.hex-detail-figure { padding: 16px 20px; border: 1px solid var(--color-border); border-radius: 16px; background: #fff; }
.hex-detail-figure .yao-lines { gap: 8px; }
.hex-detail-figure .yao-line { height: 10px; width: 90px; }
.hex-detail-hero-text h2 { margin: 0 0 4px; color: var(--ink-1); font-size: var(--fs-title); font-weight: 700; }
.hex-detail-hero-text p { margin: 0 0 4px; color: var(--ink-2); font-size: var(--fs-body); line-height: 1.5; }
.hex-detail-hero-meaning { margin-top: 6px; color: var(--ink-3) !important; font-size: var(--fs-caption) !important; line-height: 1.6 !important; }
.hex-detail-aspects { background: #2a2724; border: 0; gap: 10px; }
.hex-aspect { padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.hex-aspect:last-child { border-bottom: 0; }
.hex-aspect strong { display: block; color: #fff; font-size: var(--fs-caption); margin-bottom: 3px; }
.hex-aspect p { margin: 0; color: rgba(255,255,255,.65); font-size: var(--fs-caption); line-height: 1.55; }
.hex-detail-label { color: var(--ink-3); font-size: var(--fs-micro); font-weight: 700; letter-spacing: 1.5px; margin-bottom: 6px; }
.hex-detail-text { font-size: var(--fs-body); line-height: 1.7; }

/* ===== 按钮按压反馈 · 类 iOS ===== */
.divination-switch button, .method-run, .detail-link, .lookup-category, .hexagram-list__item, .back-detail, .coin-mode-switch button {
  transition: transform .18s cubic-bezier(.34, 1.4, .64, 1), opacity .18s ease;
}
.divination-switch button:active, .method-run:active, .lookup-category:active, .hexagram-list__item:active, .back-detail:active {
  transform: scale(.96);
  opacity: .88;
}
.divination-switch button.is-active:active {
  transform: scale(.98);
}
.method-run { box-shadow: 0 4px 14px rgba(185, 79, 73, .28); }
.method-run:active { box-shadow: 0 2px 8px rgba(185, 79, 73, .22); }