/* Calmer page composition; game, account and purchase state are unchanged. */
:root { --calm-line:#d6d9cc; --calm-muted:#536352; }
.site-header { gap:1.25rem; }
.site-header nav { gap:1.1rem; }
.site-header nav a { min-height:44px; display:inline-flex; align-items:center; }
.site-header .brand-name small { letter-spacing:.15em; }
.page-heading { padding:48px 0 28px; max-width:820px; }
.page-heading h1 { font-size:clamp(2.5rem,4.5vw,3.7rem); line-height:1.08; }
.page-heading p { max-width:650px; font-size:1rem; }
.section-head { margin-top:44px; margin-bottom:22px; }
.section-head h2 { font-size:1.8rem; }
.calm-hero { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center; padding:52px 0 36px; }
.calm-hero h1 { font-size:clamp(2.9rem,5.2vw,4.9rem); line-height:1.04; max-width:590px; margin:22px 0; }
.calm-hero .hero-copy { padding:0; }
.calm-hero .hero-copy .muted { max-width:420px; font-size:1.12rem; }
.calm-hero .fine { margin-top:20px; }
.calm-hero-art { text-align:center; background:#f1eee4; border-radius:12px; padding:26px; }
.calm-hero-art img { display:block; width:100%; height:310px; object-fit:contain; mix-blend-mode:multiply; }
.calm-hero-art p { margin:14px 0 0; font:1.3rem Georgia,serif; }
.calm-hero-art em { display:block; margin-top:5px; font-size:.9rem; color:var(--calm-muted); }
.pathway-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin:28px 0 12px; }
.pathway { display:block; padding:26px; background:#fffdf7; border:1px solid var(--calm-line); border-radius:8px; color:inherit; text-decoration:none; box-shadow:none; }
a.pathway:hover { border-color:#7c8f73; background:#fafaf3; }
.pathway h2 { font:1.65rem/1.2 Georgia,serif; margin:12px 0; }
.pathway h2 span { float:right; font:1.3rem sans-serif; }
.pathway p { color:var(--calm-muted); line-height:1.6; margin:0; max-width:470px; font-size:.95rem; }
.pathway .button { margin-top:20px; }
.specimen-card { box-shadow:none; }
.specimen-card .copy { padding:22px; }
.resume-card { box-shadow:none; margin:20px 0 28px; }
.pack-overview { margin:0 0 24px; padding:20px 24px; border:1px solid var(--calm-line); background:#f1f3e9; }
.pack-overview p { margin:8px 0 0; }
.calm-modes { grid-template-columns:1fr 1fr; gap:20px; }
.calm-modes .mode-card { display:flex; flex-direction:column; align-items:flex-start; padding:26px; min-height:190px; box-shadow:none; border-radius:8px; border:1px solid var(--calm-line); text-align:left; }
.calm-modes .mode-card h2 { font:1.9rem/1.2 Georgia,serif; margin:0 0 12px; }
.calm-modes .mode-card p { color:var(--calm-muted); font-size:1rem; margin:0 0 26px; line-height:1.6; max-width:440px; }
.mode-hint { margin-top:auto; width:100%; color:#27533e; font-size:.8rem; line-height:1.5; }
.mode-hint span { float:right; font-size:1.1rem; }
.paper-action { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:26px 0; margin-top:20px; border-top:1px solid var(--calm-line); }
.paper-action h2 { font:1.45rem Georgia,serif; margin:0 0 8px; }
.paper-action p { color:var(--calm-muted); font-size:.9rem; margin:0; max-width:540px; }
.paper-action button { flex-shrink:0; }
.quiet-details { border-top:1px solid var(--calm-line); margin:20px 0; font-size:.9rem; color:var(--calm-muted); }
.quiet-details summary { cursor:pointer; min-height:48px; padding:15px 0; color:#344334; font-weight:600; }
.quiet-details p { line-height:1.7; max-width:760px; }
.quiet-details summary:focus-visible { outline:3px solid #947045; outline-offset:4px; }
.catalog-tools { display:grid; grid-template-columns:2fr 1fr; gap:20px; }
.catalog-tools label { display:grid; gap:8px; font-size:.85rem; color:#344334; font-weight:600; }
.catalog-tools input,.catalog-tools select { width:100%; font-size:16px; min-height:48px; }
#catalog-more { margin-top:22px; }
.page-note { margin-top:28px; max-width:810px; line-height:1.8; }
.calm-book-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
.book-tile { min-width:0; }
.book-cover-link { display:block; padding:14px; background:#efeee5; border-radius:6px; }
.book-cover-link img { display:block; width:100%; height:235px; object-fit:contain; }
.book-tile h3 { font:1.45rem Georgia,serif; margin:16px 0 8px; }
.text-link { display:inline-flex; align-items:center; min-height:44px; font-size:.9rem; }
.shop-card-section { margin-top:32px; }
.shop-card-section .pathway { max-width:660px; }
.planned-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; padding:10px 0 24px; }
.planned-product h3 { font:1.35rem Georgia,serif; margin:0; }
.planned-product p { font-size:.9rem; }
.progress-summary { display:flex; gap:70px; border-bottom:1px solid var(--calm-line); padding:14px 0 28px; }
.progress-summary div { display:grid; gap:8px; }
.progress-summary strong { font:3rem Georgia,serif; }
.progress-summary span { font-size:.85rem; color:var(--calm-muted); }
.history-row { padding:20px 0; }
.history-row span { font-size:.8rem; }
/* Library covers are owned artwork—not public thumbnails of private decks. */
.library-intro { display:block; padding:40px 0 26px; }
.library-intro h1 { font-size:clamp(2.5rem,4.5vw,3.7rem); margin:14px 0; }
.library-intro p { max-width:650px; margin:0; }
.library-grid { display:block; padding-top:24px; }
.owned-pack-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.owned-pack { display:flex; flex-direction:column; padding:0; margin:0; gap:0; border:1px solid var(--calm-line); background:#fffdf7; border-radius:8px; overflow:hidden; }
.owned-pack > div:not(.pack-jacket) { padding:24px; }
.pack-jacket { aspect-ratio:auto; height:275px; border:0; border-bottom:1px solid var(--calm-line); border-radius:0; padding:0; box-shadow:none; background:radial-gradient(ellipse at center,#fffef8 30%,#e4ecdb); justify-content:flex-start; text-decoration:none; }
a.pack-jacket:hover { background:radial-gradient(ellipse at center,#fffef8 30%,#dce8ce); }
.library-page a.pack-jacket:focus-visible { outline-offset:-4px; }
.pack-jacket::before { content:none; }
.pack-jacket .cover-brand { position:absolute; top:16px; left:18px; font-size:.6rem; letter-spacing:.12em; color:#344334; }
.pack-jacket img { width:100%; height:100%; object-fit:contain; padding:40px 24px 44px; mix-blend-mode:multiply; }
.pack-jacket .cover-caption { position:absolute; bottom:0; left:0; right:0; display:flex; align-items:center; justify-content:space-between; padding:13px 18px; background:#344334; color:#f4f0e4; font:1rem Georgia,serif; }
.pack-jacket .cover-caption small { font:.6rem sans-serif; letter-spacing:.12em; }
.pack-jacket .cover-placeholder { margin:auto; font:1.9rem Georgia,serif; padding:40px 15px; }
.owned-pack h3 { font-size:1.65rem; line-height:1.2; }
.owned-pack p { margin:10px 0; }
.owned-pack .pack-detail { font-size:.73rem!important; }
.library-section-heading { margin-bottom:14px; }
.member-line { margin-bottom:24px; }
.library-sidebar { margin:26px 0 0; }
.library-sidebar .claim-panel { max-width:680px; }
.library-sidebar .sidebar-note { max-width:680px; padding:0; }
.library-explainer { display:block; padding:0; margin:26px 0 40px; }
.library-explainer summary { font-size:.9rem; }
button,.button,select,input { min-height:44px; }
input { font-size:16px; }
@media (max-width:1000px) {
  .site-header { flex-wrap:wrap; }
  .site-header nav { order:3; width:100%; justify-content:center; }
  .site-header .guide-link { margin-left:auto; }
  .calm-hero { gap:2rem; }
  .calm-book-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:650px) {
  .site-header { padding:16px 6% 8px; gap:10px; }
  .site-header nav { flex-wrap:wrap; justify-content:flex-start; gap:2px 20px; padding-bottom:4px; }
  .site-header nav a { white-space:nowrap; flex-shrink:0; font-size:.83rem; }
  .site-header .guide-link { font-size:.72rem; padding:0; }
  .site-header .brand-name { font-size:1.2rem; }
  .site-header .brand-name small { font-size:.5rem; }
  .site-header .brand-leaf { width:24px; }
  .page-heading { padding-top:32px; }
  .calm-hero { grid-template-columns:1fr; gap:22px; padding:32px 0 20px; }
  .calm-hero h1 { font-size:2.8rem; margin:16px 0; }
  .calm-hero .hero-copy .muted { font-size:1rem; }
  .calm-hero-art { padding:18px; }
  .calm-hero-art img { height:225px; }
  .hero-actions { gap:10px; }
  .pathway-grid,.calm-modes,.planned-grid,.owned-pack-grid { grid-template-columns:1fr; gap:16px; }
  .pathway { padding:22px; }
  .calm-modes .mode-card { min-height:165px; padding:24px; }
  .calm-modes .mode-card h2 { font-size:1.6rem; }
  .paper-action { align-items:flex-start; flex-direction:column; gap:16px; }
  .pack-overview { padding:18px; }
  .catalog-tools { grid-template-columns:1fr; gap:16px; }
  .book-cover-link { padding:10px; }
  .book-cover-link img { height:180px; }
  .calm-book-grid { gap:16px; }
  .book-tile h3 { font-size:1.3rem; }
  .progress-summary { gap:40px; }
  .progress-summary strong { font-size:2.5rem; }
  .library-intro { padding:30px 0 24px; }
  .library-intro h1 { font-size:2.8rem; }
  .pack-jacket { height:250px; }
  .pack-jacket .cover-caption small { font-size:.55rem; }
  .owned-pack > div:not(.pack-jacket) { padding:22px; }
  .section-head { flex-wrap:wrap; gap:12px; margin-top:32px; }
}
@media (max-width:360px) {
  .site-header .guide-link { width:100%; min-height:32px; margin:0; }
  .calm-hero h1 { font-size:2.45rem; }
  .book-cover-link img { height:145px; }
}

/* Purchased sessions share the library's quiet, specimen-led visual language. */
.store-study-menu{max-width:1156px;margin:auto;color:#173e37}
.store-study-breadcrumb{display:flex;justify-content:space-between;gap:20px;align-items:center;border-bottom:1px solid #d3d9cb;padding:4px 0 22px;font-size:12px}
.store-study-breadcrumb span{font-size:9px;letter-spacing:.17em}
.store-study-heading{display:grid;grid-template-columns:1.2fr 1fr;gap:35px;align-items:center;padding:48px 0;border-bottom:1px solid #d3d9cb}
.store-study-heading h1{font-size:clamp(34px,4.1vw,55px);line-height:1.08;letter-spacing:-.045em;margin:15px 0 18px;max-width:22ch}
.store-study-heading p{font-size:14px;color:#56675e;margin:0 0 18px}.store-study-heading .text-link{font-size:12px}
.store-study-specimens{display:flex;align-items:center;gap:12px;background:radial-gradient(ellipse,#e0e8d9,transparent 70%);padding:28px 0}
.store-study-specimens figure{margin:0;min-width:0;flex:1;text-align:center}.store-study-specimens img{width:100%;height:140px;object-fit:contain;mix-blend-mode:multiply}.store-study-specimens figcaption{font-size:10px;line-height:1.5;color:#56675e;margin-top:10px}
.store-study-section{display:flex;align-items:baseline;justify-content:space-between;gap:25px;padding:30px 0 22px}.store-study-section h2{font:32px/1.15 Georgia,serif;letter-spacing:-.025em;margin:0}.store-study-section p{font-size:12px;color:#56675e;max-width:35ch;margin:0}
.store-study-modes{gap:18px}.store-study-modes .mode-card{min-height:210px;padding:25px;border:1px solid #d3d9cb;border-radius:7px;background:#fcfbf5;position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left}
.store-study-modes .mode-card:first-child{background:#e7eddf;border-color:#bcccb4}.store-study-modes .mode-card:hover{background:#edf2e6;border-color:#668570;transform:translateY(-2px)}
.store-study-modes .mode-card h2{font:28px Georgia,serif;letter-spacing:-.03em;margin:13px 0 10px}.store-study-modes .mode-card p{font-size:13px;line-height:1.6;max-width:40ch;color:#56675e;margin:0 0 20px}.store-study-modes .mode-hint{font-size:11px;margin-top:auto;width:100%}.store-mode-number{font:italic 16px Georgia,serif;color:#9a4b2e}
.store-study-menu .quiet-details{font-size:12px}.store-study-menu .quiet-details summary{font-size:13px}.store-study-modes button:disabled{opacity:.55;cursor:not-allowed}
@media(max-width:700px){.store-study-heading{grid-template-columns:1fr;padding:30px 0 22px;gap:10px}.store-study-heading h1{font-size:39px}.store-study-specimens{padding:10px 0}.store-study-specimens img{height:95px}.store-study-section{flex-direction:column;gap:10px}.store-study-section h2{font-size:27px}.store-study-modes .mode-card{min-height:205px;padding:22px}.store-study-breadcrumb span{font-size:8px;max-width:15ch;text-align:right}}

.study-setup{margin:24px 0 18px;padding:clamp(22px,3vw,34px);border:1px solid #cbd5c5;border-radius:12px;background:#fcfbf5;color:#173e37}
.study-setup-heading h2{font:clamp(27px,3vw,36px)/1.15 Georgia,serif;letter-spacing:-.025em;margin:8px 0}
.study-setup-heading p{color:#536352;line-height:1.55;margin:0;max-width:68ch}
.study-mode-fieldset{border:0;margin:24px 0 0;padding:0;min-width:0}
.study-mode-fieldset legend{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}
.study-mode-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.study-mode-option{display:grid;grid-template-columns:22px minmax(0,1fr);gap:4px 12px;align-content:start;min-height:116px;padding:16px 18px;border:1px solid #d3d9cb;border-radius:8px;background:#fffdf8;cursor:pointer}
.study-mode-option:hover{border-color:#668570;background:#f7f9f3}
.study-mode-option:has(input:checked){border-color:#35624e;background:#edf3e8;box-shadow:inset 0 0 0 1px #35624e}
.study-mode-option:has(input:disabled){opacity:.58;cursor:not-allowed}
.study-mode-option:focus-within{outline:3px solid #947045;outline-offset:2px}
.study-mode-radio{appearance:none;width:20px;height:20px;min-height:0;margin:2px 0 0;border:2px solid #587766;border-radius:50%;background:#fff;flex:none}
.study-mode-radio:checked{border:6px solid #28563f}
.study-mode-radio:focus{outline:0}
.study-mode-copy{display:grid;gap:5px;min-width:0}
.study-mode-copy strong{font:21px/1.2 Georgia,serif}
.study-mode-copy span{font-size:13px;line-height:1.45;color:#536352}
.study-mode-option small{grid-column:2;color:#35624e;font-size:11px;font-weight:600}
.study-setup-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid #d3d9cb;margin-top:22px;padding-top:20px}
.study-setup-footer p{margin:0;color:#536352;font-size:12px}
.study-setup-footer button{min-height:48px;padding-inline:24px}
.round-mode-switch{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;border-bottom:1px solid #d3d9cb;margin:-4px 0 20px;padding:0 0 16px}
.round-mode-switch>span{font-size:12px;font-weight:700;color:#536352}
.round-mode-switch>div{display:flex;flex-wrap:wrap;gap:7px}
.round-mode-switch button{min-height:40px;padding:7px 11px;border:1px solid #b9c6b5;border-radius:99px;background:#fffdf8;color:#28533e;font-size:12px}
.round-mode-switch button:hover:not(:disabled){background:#edf3e8;border-color:#35624e}
.round-mode-switch button:disabled{background:#e8f0e2;border-color:#35624e;color:#173e37;opacity:1;cursor:default}
.round-mode-switch button:focus-visible{outline:3px solid #947045;outline-offset:2px}
/* Images keep their reserved frame during both network waits and recovery. */
#app img[hidden]{display:none!important}
#app .study-image-pending{background:#e8eddf;border-radius:8px}
#app .study-image-retry{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;margin:0 auto;padding:12px;color:#304638;background:#f6f8ef;border:1px solid #b9c9b0;border-radius:8px;font:14px/1.4 system-ui}
#app .matching-grid+.study-image-retry{margin:12px 0}
.round-mode-switch button,.round-exit{min-height:44px}
@media(max-width:650px){.study-setup{padding:18px}.study-mode-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.study-mode-option{min-height:144px;padding:12px;grid-template-columns:18px minmax(0,1fr);gap:4px 7px}.study-mode-radio{width:18px;height:18px}.study-mode-copy strong{font-size:17px}.study-mode-copy span{font-size:12px}.study-mode-option small{font-size:11px}.study-setup-footer{align-items:stretch;flex-direction:column}.study-setup-footer button{width:100%}.round-mode-switch>span{width:100%}}
@media(max-width:340px){.study-mode-list{grid-template-columns:1fr}.study-mode-option{min-height:0}}
.discovery-study .loading{max-width:1000px;margin:auto;padding:64px 0 36px}
.discovery-study .loading h1{font-size:clamp(32px,4vw,50px);margin:10px 0}
.discovery-study .loading p{color:#536352;line-height:1.55}
.study-loading-shell{display:grid;grid-template-columns:1fr 1.1fr;gap:24px;margin-top:30px}
.study-loading-image{min-height:250px;border:1px solid #d3d9cb;border-radius:10px;background:#e9eee4}
.study-loading-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.study-loading-choices span{display:block;min-height:116px;border:1px solid #d3d9cb;border-radius:8px;background:#f0f3ea}
@media(max-width:650px){.discovery-study .loading{padding:40px 0 24px}.study-loading-shell{grid-template-columns:1fr;gap:14px}.study-loading-image{min-height:170px}.study-loading-choices span{min-height:82px}}
