/* Art direction: therapeutic conversation deck → warm, calm, tactile. Parchment + forest teal + terracotta. Fraunces + DM Sans. */
:root,[data-theme=light]{--bg:#f4efe6;--surface:#fbf8f1;--surface2:#fffdf9;--offset:#e9e1d4;--text:#242b27;--muted:#59645e;--faint:#747d77;--inverse:#fffdf9;--primary:#235f58;--primary-hover:#184b46;--accent:#a44e38;--accent-hi:#f1ddd6;--border:color-mix(in oklab,var(--text) 14%,transparent);--divider:color-mix(in oklab,var(--text) 10%,transparent);--shadow:0 1px 2px rgba(48,39,28,.07),0 12px 32px rgba(48,39,28,.09);--display:'Fraunces',Georgia,serif;--body:'DM Sans','Helvetica Neue',sans-serif;--r-sm:.375rem;--r-md:.6rem;--r-lg:.9rem;--r-xl:1.25rem;--ease:180ms cubic-bezier(.16,1,.3,1);--xs:clamp(.75rem,.7rem + .25vw,.875rem);--sm:clamp(.875rem,.8rem + .35vw,1rem);--base:clamp(1rem,.95rem + .25vw,1.125rem);--lg:clamp(1.125rem,1rem + .75vw,1.5rem);--xl:clamp(1.5rem,1.2rem + 1.25vw,2.25rem)}
[data-theme=dark]{--bg:#171b19;--surface:#202522;--surface2:#272e2a;--offset:#303832;--text:#eef0ed;--muted:#bdc5bf;--faint:#9ca69f;--inverse:#14201d;--primary:#78b8ac;--primary-hover:#9bcfc5;--accent:#df846a;--accent-hi:#4b312a;--border:color-mix(in oklab,var(--text) 16%,transparent);--divider:color-mix(in oklab,var(--text) 12%,transparent);--shadow:0 1px 1px rgba(0,0,0,.3),0 16px 34px rgba(0,0,0,.32)}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{min-height:100dvh;background:var(--bg);color:var(--text);font:var(--base)/1.55 var(--body);-webkit-font-smoothing:antialiased}button,select{font:inherit;color:inherit}button{cursor:pointer}.skip{position:absolute;left:-999px;top:8px}.skip:focus{left:8px;z-index:99;background:var(--surface);padding:12px;border-radius:var(--r-md)}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.app{max-width:1180px;margin:auto;padding:20px 20px 64px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 0 26px}.brand{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.01em}.brand svg{width:38px;height:38px;color:var(--primary)}.icon-btn{width:44px;height:44px;display:grid;place-items:center;background:var(--surface);border:1px solid var(--border);border-radius:50%;transition:background var(--ease),transform var(--ease)}.icon-btn:hover{background:var(--offset)}.icon-btn:active{transform:scale(.95)}.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);gap:clamp(28px,5vw,72px);align-items:center;padding:24px 0 44px}.eyebrow{font-size:var(--xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}.hero h1{font:600 var(--xl)/1.12 var(--display);max-width:18ch;margin-bottom:16px}.hero p{color:var(--muted);max-width:59ch}.hero-art{height:270px;border-radius:var(--r-xl);background:var(--surface) url('./assets/card-spots.png') center/cover no-repeat;border:1px solid var(--border);box-shadow:var(--shadow);position:relative;overflow:hidden}.hero-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,color-mix(in oklab,var(--surface) 30%,transparent),transparent)}.guide{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--divider);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;margin-bottom:44px}.guide article{background:var(--surface);padding:20px}.step{display:block;color:var(--accent);font-size:var(--xs);font-weight:700;letter-spacing:.08em;margin-bottom:6px}.guide h2{font-size:var(--base);margin-bottom:5px}.guide p{font-size:var(--sm);color:var(--muted)}.deck-area{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;align-items:start}.stage{background:color-mix(in oklab,var(--primary) 5%,var(--surface));border:1px solid var(--border);border-radius:var(--r-xl);padding:clamp(20px,4vw,44px);min-height:540px;display:grid;place-items:center}.card-wrap{perspective:1000px;width:min(100%,560px)}.prompt-card{position:relative;min-height:390px;padding:30px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden;isolation:isolate;transition:transform 300ms cubic-bezier(.16,1,.3,1),opacity 180ms}.prompt-card.changing{transform:rotateY(8deg) translateY(6px);opacity:.3}.card-art{position:absolute;right:-34px;bottom:-22px;width:250px;height:165px;background:url('./assets/card-spots.png') var(--pos,center)/610px auto no-repeat;opacity:.18;filter:saturate(.8);z-index:-1;transform:rotate(-3deg)}.card-top{display:flex;justify-content:space-between;gap:12px;align-items:center}.category{display:inline-flex;align-items:center;gap:8px;font-size:var(--xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--primary)}.dot{width:8px;height:8px;background:var(--accent);border-radius:50%}.number{font-size:var(--xs);color:var(--faint);font-variant-numeric:tabular-nums}.prompt{font:500 clamp(1.55rem,4vw,2.25rem)/1.22 var(--display);max-width:19ch;margin:auto 0}.follow{padding-top:16px;border-top:1px solid var(--divider);color:var(--muted);font-size:var(--sm)}.controls{display:flex;gap:12px;margin-top:18px}.btn{min-height:48px;border:1px solid transparent;border-radius:var(--r-md);padding:11px 18px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:background var(--ease),transform var(--ease),border-color var(--ease)}.btn:active{transform:translateY(1px)}.primary{background:var(--primary);color:var(--inverse);flex:1}.primary:hover{background:var(--primary-hover)}.secondary{background:var(--surface);border-color:var(--border)}.secondary:hover{background:var(--offset)}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:22px;position:sticky;top:20px}.panel h2{font:600 var(--lg)/1.2 var(--display);margin-bottom:10px}.panel>p{font-size:var(--sm);color:var(--muted);margin-bottom:20px}.field{display:grid;gap:7px;margin-bottom:18px}.field label{font-size:var(--xs);font-weight:700;text-transform:uppercase;letter-spacing:.08em}.field select{width:100%;min-height:46px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--r-md);padding:9px 12px}.timer{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:15px;background:var(--offset);border-radius:var(--r-md);margin:18px 0}.time{font:600 1.8rem/1 var(--display);font-variant-numeric:tabular-nums}.timer small{display:block;font-size:var(--xs);color:var(--muted);margin-top:4px}.timer button{min-width:44px;min-height:44px;border:1px solid var(--border);background:var(--surface);border-radius:50%;font-weight:700}.print-btn{width:100%}.tip{font-size:var(--xs);color:var(--muted);padding-top:18px;border-top:1px solid var(--divider)}.tip strong{color:var(--text)}.note{margin-top:38px;padding:20px 22px;border-radius:var(--r-lg);background:var(--accent-hi);font-size:var(--sm);color:var(--text)}.print-deck{display:none}.print-card{position:relative;overflow:hidden}.print-card .mini-art{position:absolute;right:-17mm;bottom:-9mm;width:57mm;height:38mm;background:url('./assets/card-spots.png') center/cover no-repeat;opacity:.12}.pcat{font-size:8pt;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:#235f58}.pnum{float:right;color:#777;font-size:8pt}.ptext{font:500 14pt/1.25 var(--display);margin-top:10mm;max-width:46mm}.pfollow{position:absolute;left:7mm;right:7mm;bottom:6mm;border-top:.3mm solid #d9d1c4;padding-top:3mm;font-size:7.5pt;color:#5c625e}
@media(max-width:820px){.hero{grid-template-columns:1fr}.hero-art{height:210px}.deck-area{grid-template-columns:1fr}.panel{position:static}.guide{grid-template-columns:1fr}.stage{min-height:auto}.prompt-card{min-height:370px}.controls{flex-wrap:wrap}.secondary{flex:1}}
@media(max-width:480px){.app{padding-inline:14px}.topbar{padding-bottom:12px}.brand span{font-size:var(--sm)}.hero{padding-top:16px}.hero-art{display:none}.stage{padding:14px}.prompt-card{padding:22px;min-height:390px}.prompt{font-size:1.6rem}.controls .btn{width:100%;flex-basis:100%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media print{@page{size:A4 portrait;margin:8mm}body{background:#fff;color:#242b27;-webkit-print-color-adjust:exact;print-color-adjust:exact}.app{display:none}.print-deck{display:grid;grid-template-columns:repeat(2,1fr);gap:5mm}.print-card{height:85mm;border:.35mm dashed #958f85;border-radius:3mm;padding:7mm;background:#fffdf9;break-inside:avoid;page-break-inside:avoid}.print-card:nth-child(4n+1),.print-card:nth-child(4n+4){background:#f8f3ea}}
