:root{--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--surface-page:#f4f1ea;--surface-raised:#fffdf8;--surface-raised-soft:#fffdf8eb;--surface-inset:#efe9dd;--surface-sunken:#e7e0d2;--surface-overlay:#f4f1eadb;--surface-overlay-solid:#efe9dd;--surface-dashed:#fbfaf7;--scrim:#1c1a1673;--ink-primary:#1c1a16;--ink-secondary:#403a31;--ink-muted:#6f675c;--ink-faint:#928876;--ink-inverse:#fffaf0;--border-hairline:#3a30211a;--border-soft:#3a302124;--border-strong:#3a302138;--fill-faint:#3a302114;--accent:#14b8a6;--accent-ink:#0f766e;--accent-deep:#0b5b54;--accent-on:#04302e;--accent-tint:#e6f5f2;--accent-ring:#14b8a66b;--accent-grad-top:#107d72;--accent-grad-bottom:#0a554f;--accent-grad-hover:#0d6b62;--accent-bubble:#d7f2ed;--accent-bubble-ink:#134e4a;--note-bg:#f3eee2;--note-border:#3a302129;--note-ink:#51483e;--espresso:#2a2017;--espresso-ink:#fdf6ea;--cat-narrative-tint:#e4f4f0;--cat-narrative-ink:#0f6d65;--cat-narrative-edge:#0f766e33;--cat-dialogue-tint:#fbeccc;--cat-dialogue-ink:#8a5a14;--cat-dialogue-edge:#8a5a1433;--cat-situation-tint:#e8eafb;--cat-situation-ink:#4a4f9c;--cat-situation-edge:#4a4f9c33;--cat-opinion-tint:#f9e4ea;--cat-opinion-ink:#9c3a51;--cat-opinion-edge:#9c3a5133;--r-xs:6px;--r-sm:8px;--r-md:12px;--r-lg:16px;--r-xl:22px;--r-pill:999px;--shadow-1:0 1px 2px #342d230f, 0 1px 0 #ffffffb3 inset;--shadow-2:0 1px 0 #ffffffd9 inset, 0 6px 16px #342d2314, 0 2px 5px #342d230f;--shadow-3:0 1px 0 #ffffffe6 inset, 0 18px 40px #342d2324, 0 6px 14px #342d2314;--shadow-inset:inset 0 1px 3px #342d231a;--hl-inset:inset 0 1px 0 #ffffffd9;--hl-soft:inset 0 1px 0 #ffffff2e;--sp-2xs:2px;--sp-xs:6px;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--sp-7:48px;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--fs-base:16px;--text-overline:.7rem;--text-h1:clamp(1.85rem, 1.45rem + 2.4vw, 2.6rem);--text-prompt:clamp(1.6rem, 1.18rem + 2.5vw, 2.3rem);--text-body:clamp(1rem, .96rem + .3vw, 1.06rem);--text-label:.9rem;--text-label-caps:.78rem;--text-caption:.8rem;--lh-tight:1.04;--lh-snug:1.12;--lh-base:1.5;--lh-body:1.68;--lh-relaxed:1.72;--tracking-tight:-.02em;--tracking-snug:-.015em;--tracking-caps:.06em;--tracking-overline:.12em;--measure-answer:62ch;--dur-fast:.16s;--dur-base:.26s;--dur-flip:.42s;--ease-out:cubic-bezier(.22, .61, .36, 1);--ease-settle:cubic-bezier(.34, 1.2, .64, 1);color:var(--ink-primary);background:var(--surface-page);font-family:var(--font-sans);font-feature-settings:"cv02", "cv03", "cv04", "cv11";font-optical-sizing:auto;font-size:var(--fs-base);font-weight:var(--weight-regular);line-height:var(--lh-base);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}@supports (font-variation-settings:normal){:root{--font-sans:"Inter var", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}}@media (prefers-reduced-motion:reduce){:root{--dur-fast:0s;--dur-base:0s;--dur-flip:0s}}*,:before,:after{box-sizing:border-box}html,body{background:var(--surface-page)}body{min-width:320px;min-height:100vh;color:var(--ink-primary);overscroll-behavior-y:none;margin:0}button{border-radius:var(--r-md);font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform var(--dur-fast) var(--ease-settle), box-shadow var(--dur-fast) ease, background-color var(--dur-fast) ease, border-color var(--dur-fast) ease, color var(--dur-fast) ease;border:0}button:active{transform:translateY(1px)scale(.985)}button:focus-visible{outline:3px solid var(--accent-ring);outline-offset:2px}h1,h2,p{overflow-wrap:anywhere;margin-top:0}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-shell{width:min(100%,560px);min-height:100vh;padding:max(var(--sp-4), env(safe-area-inset-top)) var(--sp-4) max(var(--sp-4), env(safe-area-inset-bottom));margin:0 auto}.app-header{justify-content:space-between;align-items:flex-end;gap:var(--sp-4);padding:var(--sp-xs) var(--sp-2xs) var(--sp-5);display:flex}.eyebrow{margin:0 0 var(--sp-1);color:var(--ink-muted);font-size:var(--text-overline);font-weight:var(--weight-medium);letter-spacing:var(--tracking-overline);text-transform:uppercase}h1{color:var(--ink-primary);font-size:var(--text-h1);font-weight:var(--weight-bold);letter-spacing:var(--tracking-tight);line-height:var(--lh-tight);margin-bottom:0}.header-right{align-items:flex-end;gap:var(--sp-2);flex-direction:column;display:flex}.fusklapp-btn{align-items:center;gap:var(--sp-1);padding:7px var(--sp-3);border:1px solid var(--cat-narrative-edge);border-radius:var(--r-pill);background:var(--accent-tint);color:var(--accent-ink);font-size:var(--text-caption);font-weight:var(--weight-semibold);white-space:nowrap;box-shadow:var(--shadow-1);display:inline-flex}.fusklapp-btn:hover{background:var(--surface-raised);border-color:var(--accent-ink)}.total-badge{min-width:66px;padding:var(--sp-2) var(--sp-3);border:1px solid var(--border-hairline);border-radius:var(--r-md);background:var(--surface-raised);text-align:right;box-shadow:var(--shadow-1);display:grid}.total-badge strong{color:var(--ink-primary);font-size:1.1rem;font-weight:var(--weight-bold);font-variant-numeric:tabular-nums;line-height:1}.total-badge span{color:var(--ink-muted);font-size:.72rem;font-weight:var(--weight-medium)}.filter-bar{margin:0 calc(-1 * var(--sp-4)) var(--sp-3);padding:0 var(--sp-4) var(--sp-1);scrollbar-width:none;scroll-snap-type:x proximity;gap:7px;scroll-padding-inline-end:28px;display:flex;overflow-x:auto}.filter-bar::-webkit-scrollbar{display:none}.filter-bar:after{content:"";flex:0 0 var(--sp-4)}.filter-pill{align-items:center;gap:var(--sp-2);min-height:40px;padding:0 var(--sp-3);border:1px solid var(--border-hairline);border-radius:var(--r-pill);background:var(--surface-raised-soft);color:var(--ink-muted);font-size:var(--text-label);font-weight:var(--weight-semibold);white-space:nowrap;scroll-snap-align:start;box-shadow:var(--hl-inset);flex:none;display:inline-flex}.filter-pill:hover{border-color:var(--border-strong);background:var(--surface-raised);box-shadow:var(--shadow-1);transform:translateY(-1px)}.filter-pill strong{min-width:22px;padding:var(--sp-2xs) var(--sp-xs);border-radius:var(--r-pill);background:var(--fill-faint);color:var(--ink-muted);font-size:.72rem;font-weight:var(--weight-semibold);font-variant-numeric:tabular-nums;text-align:center}.filter-pill.active{border-color:var(--espresso);background:var(--espresso);color:var(--espresso-ink);font-weight:var(--weight-bold);box-shadow:var(--shadow-2)}.filter-pill.active strong{background:var(--accent);color:var(--accent-on)}.practice-card{padding:var(--sp-4);border:1px solid var(--border-soft);border-radius:var(--r-xl);background:var(--surface-raised-soft);box-shadow:var(--shadow-1)}.card-topline{justify-content:space-between;align-items:center;gap:var(--sp-3);display:flex}.category{padding:5px var(--sp-3);border-radius:var(--r-pill);font-size:var(--text-label-caps);font-weight:var(--weight-medium);letter-spacing:var(--tracking-caps);white-space:nowrap}.category-narrative{background:var(--cat-narrative-tint);color:var(--cat-narrative-ink)}.category-dialogue{background:var(--cat-dialogue-tint);color:var(--cat-dialogue-ink)}.category-situation{background:var(--cat-situation-tint);color:var(--cat-situation-ink)}.category-opinion{background:var(--cat-opinion-tint);color:var(--cat-opinion-ink)}.card-tags{align-items:center;gap:var(--sp-2);min-width:0;display:flex}.level-badge{padding:3px var(--sp-2);border-radius:var(--r-pill);font-size:.7rem;font-weight:var(--weight-bold);letter-spacing:.04em;border:1px solid #0000;flex:none;align-items:center;display:inline-flex}.level-b1{background:var(--accent-tint);color:var(--accent-ink)}.level-b2{background:var(--surface-sunken);border-color:var(--border-soft);color:var(--ink-secondary)}.card-actions{justify-content:flex-end;align-items:center;gap:var(--sp-2);min-width:0;display:flex}.card-actions button{min-height:32px;padding:0 var(--sp-3);border-radius:var(--r-sm);background:var(--fill-faint);color:var(--ink-secondary);font-size:var(--text-label-caps);font-weight:var(--weight-semibold)}.card-actions button:hover{background:var(--surface-sunken)}.progress-count{color:var(--ink-muted);font-size:var(--text-caption);font-weight:var(--weight-medium);font-variant-numeric:tabular-nums;white-space:nowrap}.progress-track{height:6px;margin-top:var(--sp-3);border-radius:var(--r-pill);background:var(--fill-faint);box-shadow:var(--shadow-inset);overflow:hidden}.progress-track span{border-radius:inherit;background:linear-gradient(90deg, var(--accent), var(--accent-deep));height:100%;transition:width var(--dur-base) var(--ease-out);display:block}.flip-scene{margin-top:var(--sp-4);perspective:1400px;position:relative}.flip-inner{border-radius:var(--r-xl);width:100%;min-height:320px;transform-style:preserve-3d;transition:transform var(--dur-flip) var(--ease-out), box-shadow var(--dur-base) ease;box-shadow:var(--shadow-2);will-change:transform;position:relative;transform:rotateY(0)}.flip-inner.is-flipped{transform:rotateY(180deg)}.flip-inner.is-flipping{box-shadow:var(--shadow-3)}.flip-inner.is-hinting{animation:flip-peek 1.1s var(--ease-settle) .6s 1}@keyframes flip-peek{0%,to{transform:rotateY(0)}55%{transform:rotateY(-14deg)}}.flip-face{border-radius:var(--r-xl);background:var(--surface-inset);backface-visibility:hidden;flex-direction:column;padding:0;display:flex;position:absolute;inset:0}.flip-back{transform:rotateY(180deg)}.face-content{padding:var(--sp-4);flex-direction:column;flex:1;display:flex;position:relative}.flip-front .face-content{-webkit-user-select:none;user-select:none}.flip-trigger{z-index:2;border-radius:var(--r-xl);cursor:pointer;background:0 0;border:0;position:absolute;inset:0}.flip-trigger:focus-visible{outline:3px solid var(--accent-ring);outline-offset:4px}.card-number{margin:0 0 var(--sp-3);color:var(--ink-muted);font-size:var(--text-caption);font-weight:var(--weight-medium);letter-spacing:var(--tracking-caps);font-variant-numeric:tabular-nums}.prompt-text{max-width:100%;color:var(--ink-primary);font-size:var(--text-prompt);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-snug);line-height:var(--lh-snug);text-wrap:balance;overflow-wrap:anywhere;margin-bottom:0}.duration{align-items:center;gap:var(--sp-xs);margin:var(--sp-4) 0 0;padding:var(--sp-xs) var(--sp-3);border-radius:var(--r-pill);background:var(--accent-tint);color:var(--accent-ink);font-size:var(--text-caption);font-weight:var(--weight-semibold);display:inline-flex}.duration:before{content:"";border-radius:var(--r-pill);background:var(--accent-ink);width:6px;height:6px}.flip-hint{padding-top:var(--sp-5);color:var(--ink-faint);font-size:.82rem;font-weight:var(--weight-semibold);align-items:center;gap:7px;margin-top:auto;display:inline-flex}.flip-hint:before{content:"";border-radius:var(--r-pill);background:var(--accent-tint);width:14px;height:14px;box-shadow:inset 0 0 0 2px var(--cat-narrative-edge)}.answer-heading{justify-content:space-between;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4);color:var(--ink-primary);font-size:var(--text-label-caps);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-caps);text-transform:uppercase;display:flex}.answer-heading button{border-radius:var(--r-sm);background:var(--fill-faint);min-width:68px;min-height:34px;color:var(--ink-secondary);font-size:.82rem;font-weight:var(--weight-semibold)}.answer-heading button:hover{background:var(--surface-sunken)}.answer-actions{align-items:center;gap:var(--sp-2);display:flex}.answer-actions button{text-transform:none;letter-spacing:0}.level-toggle{min-width:0}.answer-heading .level-toggle.is-on{background:var(--accent-tint);border:1px solid var(--cat-narrative-edge);color:var(--accent-ink)}.answer-heading{flex-wrap:wrap}.answer-actions{flex-wrap:wrap;justify-content:flex-end}.edited-chip{padding:3px var(--sp-2);border-radius:var(--r-pill);background:var(--cat-opinion-tint);color:var(--cat-opinion-ink);font-size:.68rem;font-weight:var(--weight-bold);letter-spacing:.04em;text-transform:none;align-items:center;display:inline-flex}.answer-editor-wrap{gap:var(--sp-2);flex-direction:column;display:flex}.answer-editor{width:100%;min-height:168px;padding:var(--sp-3);border:1px solid var(--border-strong);border-radius:var(--r-md);background:var(--surface-raised);color:var(--ink-primary);font-family:inherit;font-size:var(--text-body);line-height:var(--lh-body);resize:none;max-height:48vh;overflow-y:auto}.answer-editor:focus-visible{outline:3px solid var(--accent-ring);outline-offset:2px}.editor-hint{color:var(--ink-muted);font-size:var(--text-caption);margin:0;line-height:1.5}.editor-hint code{border-radius:var(--r-xs);background:var(--fill-faint);padding:1px 5px;font-size:.85em}.editor-actions{gap:var(--sp-2);margin-top:var(--sp-1);flex-wrap:wrap;display:flex}.editor-actions button{min-height:40px;padding:0 var(--sp-4);border-radius:var(--r-md);background:var(--fill-faint);color:var(--ink-secondary);font-size:var(--text-label);font-weight:var(--weight-semibold)}.editor-actions .edit-save{background:linear-gradient(180deg, var(--accent-grad-top), var(--accent-grad-bottom));color:var(--ink-inverse);font-weight:var(--weight-bold);box-shadow:var(--shadow-1), var(--hl-soft)}.editor-actions .edit-reset{color:var(--cat-opinion-ink);margin-left:auto}.answer-prose{max-width:var(--measure-answer);color:var(--ink-secondary);font-size:var(--text-body);font-weight:var(--weight-regular);line-height:var(--lh-body)}.answer-prose p{margin-bottom:var(--sp-3);overflow-wrap:anywhere}.answer-prose p:last-child{margin-bottom:0}.dialogue-note{margin:0 0 var(--sp-3);border:1px solid var(--note-border);border-left:3px solid var(--accent-ink);border-radius:var(--r-sm);background:var(--note-bg);color:var(--note-ink);padding:11px 13px;font-size:.92rem;line-height:1.55}.dialogue-note p{margin:0 0 var(--sp-2)}.dialogue-note p:last-child{margin:0}.dialogue-thread{flex-direction:column;gap:10px;width:100%;display:flex}.dialogue-turn{flex-direction:column;max-width:78%;display:flex}.dialogue-turn.is-other{align-self:flex-start;align-items:flex-start}.dialogue-turn.is-self{align-self:flex-end;align-items:flex-end}.dialogue-turn.is-grouped{margin-top:-5px}.dialogue-speaker{margin:0 0 var(--sp-1);font-size:var(--text-caption);font-weight:var(--weight-medium);letter-spacing:.02em}.is-other .dialogue-speaker{color:var(--ink-muted)}.is-self .dialogue-speaker{color:var(--accent-ink)}.dialogue-bubble{font-size:.98rem;font-weight:var(--weight-regular);overflow-wrap:anywhere;margin:0;padding:10px 13px;line-height:1.55}.is-other .dialogue-bubble{background:var(--surface-raised);color:var(--ink-secondary);border:1px solid var(--border-soft);border-radius:var(--r-lg) var(--r-lg) var(--r-lg) var(--r-xs)}.is-self .dialogue-bubble{background:var(--accent-bubble);color:var(--accent-bubble-ink);border:1px solid var(--cat-narrative-edge);border-radius:var(--r-lg) var(--r-lg) var(--r-xs) var(--r-lg)}.is-other.is-grouped .dialogue-bubble{border-top-left-radius:var(--r-xs)}.is-self.is-grouped .dialogue-bubble{border-top-right-radius:var(--r-xs)}@media (width<=360px){.dialogue-turn{max-width:84%}.dialogue-bubble{padding:9px 11px;font-size:.95rem}}.controls{gap:var(--sp-2);margin:var(--sp-4) calc(-1 * var(--sp-4)) 0;padding:11px var(--sp-4) max(11px, env(safe-area-inset-bottom));border-top:1px solid var(--border-hairline);background:var(--surface-overlay);-webkit-backdrop-filter:blur(20px)saturate(1.05);backdrop-filter:blur(20px)saturate(1.05);grid-template-columns:.9fr 1.35fr .9fr;display:grid;position:sticky;bottom:0}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.controls{background:var(--surface-overlay-solid)}}.controls button{min-height:50px;padding:0 var(--sp-2);border:1px solid var(--border-hairline);border-radius:var(--r-md);background:var(--surface-raised);color:var(--ink-secondary);font-size:var(--text-label);font-weight:var(--weight-semibold);box-shadow:var(--shadow-1);justify-content:center;align-items:center;gap:7px;display:flex}.controls button:hover{border-color:var(--border-strong)}.controls .primary{background:linear-gradient(180deg, var(--accent-grad-top), var(--accent-grad-bottom));color:var(--ink-inverse);font-weight:var(--weight-bold);box-shadow:var(--shadow-2), var(--hl-soft);border:0}.controls .primary:hover{background:linear-gradient(180deg, var(--accent-ink), var(--accent-grad-hover))}.controls .primary:active{box-shadow:var(--shadow-1), var(--hl-soft)}.empty-state{min-height:40vh;color:var(--ink-muted);font-weight:var(--weight-medium);place-items:center;display:grid}.guide-overlay{z-index:50;padding:max(var(--sp-5), env(safe-area-inset-top)) var(--sp-2) 0;background:var(--scrim);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:guide-fade var(--dur-base) var(--ease-out);justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.guide-sheet{border:1px solid var(--border-soft);border-radius:var(--r-xl) var(--r-xl) 0 0;background:var(--surface-page);width:min(100%,560px);max-height:94vh;box-shadow:var(--shadow-3);animation:guide-rise var(--dur-base) var(--ease-out);flex-direction:column;display:flex;overflow:hidden}.guide-head{justify-content:space-between;align-items:flex-start;gap:var(--sp-3);padding:var(--sp-4);border-bottom:1px solid var(--border-hairline);background:var(--surface-raised);display:flex}.guide-eyebrow{margin:0 0 var(--sp-1);color:var(--ink-primary);font-size:var(--text-label);font-weight:var(--weight-bold);letter-spacing:var(--tracking-caps);text-transform:uppercase}.guide-intro{max-width:42ch;color:var(--ink-muted);font-size:var(--text-caption);margin:0;line-height:1.5}.guide-close{min-height:36px;padding:0 var(--sp-3);border-radius:var(--r-pill);background:var(--fill-faint);color:var(--ink-secondary);font-size:var(--text-caption);font-weight:var(--weight-semibold);flex:none}.guide-close:hover{background:var(--surface-sunken)}.guide-body{padding:var(--sp-2) var(--sp-4) max(var(--sp-5), env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch;overscroll-behavior:contain;overflow-y:auto}.guide-section{padding:var(--sp-4) 0;border-bottom:1px solid var(--border-hairline)}.guide-section:last-child{border-bottom:0}.guide-section-title{align-items:baseline;gap:var(--sp-2);margin:0 0 var(--sp-3);color:var(--ink-primary);font-size:1.02rem;font-weight:var(--weight-bold);letter-spacing:var(--tracking-snug);flex-wrap:wrap;display:flex}.guide-section-hint{color:var(--ink-muted);font-size:var(--text-caption);font-weight:var(--weight-medium);letter-spacing:0}.guide-items{gap:var(--sp-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.guide-item{gap:var(--sp-3);align-items:baseline;display:flex}.guide-label{min-width:74px;max-width:92px;padding:3px var(--sp-2);border-radius:var(--r-sm);background:var(--fill-faint);color:var(--ink-secondary);font-size:.72rem;font-weight:var(--weight-semibold);text-align:center;flex:none}.guide-item-text{flex-direction:column;gap:2px;min-width:0;display:flex}.guide-sv{color:var(--ink-primary);font-size:.95rem;font-weight:var(--weight-medium);overflow-wrap:anywhere;line-height:1.5}.guide-note{color:var(--ink-muted);font-size:var(--text-caption);line-height:1.45}@keyframes guide-fade{0%{opacity:0}to{opacity:1}}@keyframes guide-rise{0%{transform:translateY(16px)}to{transform:translateY(0)}}@media (width>=700px){.guide-overlay{padding:var(--sp-5);align-items:center}.guide-sheet{border-radius:var(--r-xl)}.app-shell{padding-top:var(--sp-6)}.practice-card{padding:var(--sp-5)}.controls{border-top:0;margin-inline:0;padding-inline:0}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}button:active,.filter-pill:hover{transform:none}.flip-inner,.flip-inner.is-flipped{transition:none;transform:none}.flip-inner.is-hinting{animation:none}.flip-back{transform:none}.flip-face{backface-visibility:visible;transition:opacity .12s}.flip-face[aria-hidden=true]{opacity:0;pointer-events:none}.flip-face[aria-hidden=false]{opacity:1}}