:root{--ink:#0f1a19;--ink-2:#172624;--ink-3:#22332f;--jade:#6f9893;--jade-deep:#3d5f5b;--mist:#d9e3df;--paper:#efe7d9;--paper-dim:#c9c0b1;--dusk:#eeb186;--dusk-glow:#f7d9b8;--seal:#c23b2b;--seal-deep:#8f2618;--gold:#d9b26a;--violet:#a9a3c2;--bg:var(--ink);--surface:#121f1dc7;--surface-solid:#16231f;--line:#d9e3df24;--line-strong:#d9e3df47;--text:#e8e4da;--text-dim:#a9b5b0;--text-faint:#7b8a85;--accent:var(--dusk);--font-display:"Cormorant", "Times New Roman", serif;--font-body:"Literata", Georgia, serif;--font-brush:"Ma Shan Zheng", "STKaiti", "KaiTi", serif;--radius:14px;--radius-sm:9px;--shadow:0 18px 50px #00000059;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-theme=day]{--bg:#e9e2d4;--surface:#f4eee2d6;--surface-solid:#f3ede1;--line:#1e2c2924;--line-strong:#1e2c294d;--text:#1c2826;--text-dim:#4d5d59;--text-faint:#7a8784;--accent:#b5603a;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;font-size:17px;line-height:1.65}button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--dusk);outline-offset:3px;border-radius:6px}.app{isolation:isolate;max-width:640px;min-height:100%;margin:0 auto;position:relative}.landscape{z-index:-1;pointer-events:none;position:fixed;inset:0;overflow:hidden}.backdrop-img{object-fit:cover;object-position:center 30%;width:100%;height:100%;transition:opacity 1.4s;animation:40s ease-in-out infinite alternate breathe;position:absolute;inset:0}.backdrop-img.out{opacity:0}.landscape.dim .backdrop-img{filter:saturate(.9)brightness(.62)}.mist-band{background:radial-gradient(#f0ece447,#0000 70%);height:22%;animation:50s linear infinite alternate drift;position:absolute;bottom:18%;left:-50%;right:-50%}@keyframes breathe{0%{transform:scale(1.02)}to{transform:scale(1.09)translateY(-1.5%)}}.landscape .veil{background:linear-gradient(#0f1a199e 0%,#0f1a192e 30%,#0f1a1914 48%,#0f1a19db 100%);position:absolute;inset:0}:root[data-theme=day] .landscape .veil{background:linear-gradient(#e9e2d400 0%,#e9e2d440 45%,#e9e2d4e6 100%)}.landscape.flash:after{content:"";background:#e9f1ff;animation:.9s ease-out flash;position:absolute;inset:0}@keyframes drift{0%{transform:translate(-8%)}to{transform:translate(8%)}}@keyframes birds{0%{transform:translate(110%)}to{transform:translate(-60%,-40px)}}@keyframes flash{0%{opacity:.95}12%{opacity:.1}22%{opacity:.7}to{opacity:0}}.display{font-family:var(--font-display);letter-spacing:.01em;font-weight:600;line-height:1.05}.brush{font-family:var(--font-brush);font-weight:400}.eyebrow{font-family:var(--font-body);letter-spacing:.18em;text-transform:uppercase;color:var(--text-faint);font-size:12px}.dim{color:var(--text-dim)}.faint{color:var(--text-faint)}.home{min-height:100dvh;padding:calc(var(--safe-top) + 28px) 22px calc(var(--safe-bottom) + 24px);grid-template-rows:1fr auto;display:grid}.home-hero{grid-template-columns:1fr auto;align-items:start;gap:8px;display:grid;position:relative}.home-title{color:var(--paper);text-shadow:0 2px 30px #00000059;margin:0;font-size:clamp(52px,15vw,84px);font-weight:500;line-height:.95}:root[data-theme=day] .home-title{color:var(--ink);text-shadow:none}.home-sub{text-shadow:0 1px 12px #000000b3;max-width:22ch;color:var(--text-dim);margin:12px 0 0;font-style:italic;color:var(--paper)!important}.vertical-han{writing-mode:vertical-rl;font-family:var(--font-brush);color:var(--paper);opacity:.92;text-shadow:0 6px 40px #eeb18659;margin-top:-6px;font-size:clamp(64px,18vw,104px);line-height:1}:root[data-theme=day] .vertical-han{color:var(--ink)}.home-actions{gap:12px;display:grid}.seal-btn{background:var(--seal);color:#fbeee2;width:100%;min-height:60px;font-family:var(--font-display);letter-spacing:.04em;box-shadow:inset 0 0 0 2px #fbeee238, inset 0 0 0 5px var(--seal), inset 0 0 0 6px #fbeee259, 0 12px 30px #c23b2b59;border:none;border-radius:6px;justify-content:center;align-items:center;gap:14px;padding:14px 20px;font-size:24px;font-weight:700;transition:transform .16s,box-shadow .16s;display:inline-flex;position:relative}.seal-btn:hover{transform:translateY(-1px)}.seal-btn:active{transform:translateY(1px)scale(.995)}.seal-btn .han{font-family:var(--font-brush);opacity:.9;font-size:28px;font-weight:400}.seal-btn[disabled]{opacity:.55;cursor:default}.ghost-btn{border-radius:var(--radius-sm);border:1px solid var(--line-strong);background:var(--surface);-webkit-backdrop-filter:blur(10px);text-align:left;justify-content:space-between;align-items:center;gap:12px;min-height:48px;padding:10px 16px;display:flex}.ghost-btn:hover{border-color:var(--dusk)}.ghost-btn small{color:var(--text-faint);font-size:13px;display:block}.row{align-items:center;gap:10px;display:flex}.row.wrap{flex-wrap:wrap}.spread{justify-content:space-between}.link-btn{color:var(--text-dim);text-underline-offset:4px;text-decoration:underline;-webkit-text-decoration-color:var(--line-strong);text-decoration-color:var(--line-strong);background:0 0;border:none;padding:6px 4px;font-size:15px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow)}.screen{min-height:100dvh;padding:calc(var(--safe-top) + 16px) 16px calc(var(--safe-bottom) + 20px);flex-direction:column;gap:14px;display:flex}.screen-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.screen-title{margin:0;font-size:34px}.icon-btn{border:1px solid var(--line-strong);background:var(--surface);border-radius:50%;flex:none;place-items:center;width:44px;height:44px;font-size:18px;display:grid}.fate{padding:24px 20px}.fate-line{border-bottom:1px solid var(--line);opacity:0;grid-template-columns:7.5em 1fr;gap:10px;padding:11px 0;animation:.52s cubic-bezier(.2,.7,.2,1) forwards rise;display:grid;transform:translateY(8px)}.fate-line dt{color:var(--text-faint);font-size:14px}.fate-line dd{margin:0}.fate-destiny{text-align:center;opacity:0;margin-top:22px;animation:.7s cubic-bezier(.3,1.6,.4,1) forwards stamp}.fate-destiny .name{font-family:var(--font-display);color:var(--dusk-glow);font-size:40px;font-weight:700}:root[data-theme=day] .fate-destiny .name{color:var(--seal-deep)}@keyframes rise{to{opacity:1;transform:none}}@keyframes stamp{0%{opacity:0;transform:scale(1.6)rotate(-4deg)}to{opacity:1;transform:none}}.setup-grid{gap:14px;display:grid}.field label{color:var(--text-faint);margin-bottom:6px;font-size:13px;display:block}.input{border-radius:var(--radius-sm);border:1px solid var(--line-strong);width:100%;min-height:48px;color:var(--text);font:inherit;background:#0000002e;padding:10px 14px}:root[data-theme=day] .input{background:#ffffff80}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{border:1px solid var(--line-strong);background:0 0;border-radius:999px;min-height:38px;padding:8px 13px;font-size:14px}.chip[aria-pressed=true]{background:var(--paper);color:var(--ink);border-color:var(--paper)}.life{grid-template-rows:auto 1fr auto;height:100dvh;display:grid}.status{padding:calc(var(--safe-top) + 10px) 14px 10px;background:linear-gradient(#0f1a19eb,#0f1a198c 80%,#0000);gap:8px;display:grid}:root[data-theme=day] .status{background:linear-gradient(#e9e2d4f2,#e9e2d499 80%,#0000)}.status-top{justify-content:space-between;align-items:baseline;gap:10px;display:flex}.status-name{font-family:var(--font-display);font-size:24px;font-weight:700;line-height:1.1}.status-realm{color:var(--dusk);white-space:nowrap;font-size:14px}:root[data-theme=day] .status-realm{color:var(--seal-deep)}.meters{color:var(--text-dim);grid-template-columns:repeat(3,1fr);gap:10px;font-size:12px;display:grid}.meter{gap:4px;display:grid}.meter .bar{background:var(--line);border-radius:3px;height:3px;overflow:hidden}.meter .bar i{background:var(--jade);height:100%;transition:width .6s;display:block}.meter.hp .bar i{background:var(--seal)}.meter.age .bar i{background:var(--gold)}.tabs{scrollbar-width:none;gap:6px;display:flex;overflow-x:auto}.tab{border:1px solid var(--line);color:var(--text-dim);background:0 0;border-radius:999px;flex:none;min-height:32px;padding:5px 11px;font-size:13px}.story{scroll-behavior:smooth;padding:10px 16px 28px;overflow-y:auto;-webkit-mask-image:linear-gradient(#0000 0,#000 22px calc(100% - 30px),#0000);mask-image:linear-gradient(#0000 0,#000 22px calc(100% - 30px),#0000)}.fact{margin:0 0 22px;animation:.7s both ink-in}.fact-meta{color:var(--text-faint);align-items:baseline;gap:8px;margin-bottom:2px;font-size:12.5px;display:flex}.fact-meta .age{font-family:var(--font-display);color:var(--dusk);font-size:19px;font-weight:700}:root[data-theme=day] .fact-meta .age{color:var(--seal-deep)}.fact h3{font-family:var(--font-display);margin:0 0 4px;font-size:23px;font-weight:700;line-height:1.2}.fact p{white-space:pre-line;margin:0 0 8px}.fact .choice{color:var(--text-dim);border-left:2px solid var(--seal);margin:8px 0;padding-left:10px;font-style:italic}.fact.retreat p,.fact.minor p{color:var(--text-dim);font-size:15px}.fact.retreat h3,.fact.minor h3{color:var(--text-dim);font-size:18px}.fact.volume{text-align:center;padding:18px 0 8px}.fact.volume h3{color:var(--dusk-glow);font-size:30px}:root[data-theme=day] .fact.volume h3{color:var(--seal-deep)}.fact.volume .rule{background:var(--line-strong);width:60px;height:1px;margin:10px auto}.fact.ending h3{color:var(--seal);font-size:32px}.fact .media{border-radius:var(--radius-sm);aspect-ratio:4/3;object-fit:cover;background:var(--ink-3);width:100%;margin:6px 0 10px;display:block}.deltas{flex-wrap:wrap;gap:6px;display:flex}.delta{border:1px solid var(--line);color:var(--text-dim);border-radius:999px;padding:2px 8px;font-size:12px}.delta.up{color:#a8d1c9;border-color:#6f989380}.delta.down{color:#f0a597;border-color:#c23b2b80}:root[data-theme=day] .delta.up{color:#2f6b61}:root[data-theme=day] .delta.down{color:#9a2a1c}@keyframes ink-in{0%{opacity:0;filter:blur(6px);transform:translateY(6px)}to{opacity:1;filter:none;transform:none}}.dock{padding:12px 14px calc(var(--safe-bottom) + 12px);background:linear-gradient(#0000,#0f1a19f5 30%)}:root[data-theme=day] .dock{background:linear-gradient(#0000,#e9e2d4f7 30%)}.pending{gap:10px;max-height:62dvh;padding:16px;animation:.5s both ink-in;display:grid;overflow-y:auto}.pending-title{font-family:var(--font-display);margin:0;font-size:26px;line-height:1.15}.pending-text{white-space:pre-line;margin:0}.choices{gap:8px;display:grid}.choice-btn{text-align:left;border-radius:var(--radius-sm);border:1px solid var(--line-strong);background:#00000029;gap:2px;min-height:52px;padding:12px 14px;transition:border-color .15s,background .15s,transform .12s;display:grid}:root[data-theme=day] .choice-btn{background:#ffffff73}.choice-btn:hover:not([disabled]){border-color:var(--dusk)}.choice-btn:active:not([disabled]){transform:scale(.99)}.choice-btn[disabled]{opacity:.45;cursor:default}.choice-btn[aria-pressed=true]{border-color:var(--seal);background:#c23b2b24}.choice-btn .t{font-weight:600}.choice-btn .h{color:var(--text-dim);font-size:13.5px}.choice-btn .meta{color:var(--text-faint);gap:8px;font-size:12px;display:flex}.risk{align-items:center;gap:3px;display:inline-flex}.risk i{background:var(--line-strong);border-radius:50%;width:6px;height:6px}.risk i.on{background:var(--seal)}.free{gap:8px;display:flex}.free .input{min-height:46px}.controls{justify-content:space-between;align-items:center;gap:8px;display:flex}.speed{border:1px solid var(--line);background:var(--surface);border-radius:999px;gap:4px;padding:3px;display:flex}.speed button{min-height:34px;color:var(--text-dim);background:0 0;border:none;border-radius:999px;padding:6px 12px;font-size:13px}.speed button[aria-pressed=true]{background:var(--paper);color:var(--ink)}.writing{color:var(--text-dim);align-items:center;gap:10px;font-style:italic;display:flex}.ink-drop{background:var(--paper);border-radius:50%;width:14px;height:14px;animation:1.4s ease-in-out infinite drop}@keyframes drop{0%,to{opacity:.4;transform:scale(.6)}50%{opacity:1;transform:scale(1.1)}}.pending.trial{background:linear-gradient(#280e0ce0,#121f1de6);border-color:#c23b2b73}:root[data-theme=day] .pending.trial{background:linear-gradient(#fae6dcf2,#f4eee2f2)}.pending.demon .pending-text{font-style:italic}.odds{font-family:var(--font-display);color:var(--dusk-glow);font-size:30px;font-weight:700}.sheet-backdrop{z-index:20;background:#050a098c;animation:.2s fade;position:fixed;inset:0}.sheet{z-index:21;max-width:640px;max-height:86dvh;padding:18px 18px calc(var(--safe-bottom) + 24px);background:var(--surface-solid);border:1px solid var(--line);border-radius:20px 20px 0 0;margin:0 auto;animation:.28s cubic-bezier(.2,.8,.2,1) slide;position:fixed;bottom:0;left:0;right:0;overflow-y:auto}.sheet h2{font-family:var(--font-display);margin:0 0 12px;font-size:30px}@keyframes fade{0%{opacity:0}}@keyframes slide{0%{opacity:0;transform:translateY(40px)}}.list{gap:10px;display:grid}.card{border-radius:var(--radius-sm);border:1px solid var(--line);background:#0000001f;padding:12px 14px}:root[data-theme=day] .card{background:#fff6}.card h4{font-family:var(--font-display);margin:0;font-size:21px}.card .sub{color:var(--text-faint);font-size:13px}.card.dead{opacity:.55}.affinity{background:var(--line);border-radius:4px;height:4px;margin:8px 0;position:relative}.affinity i{border-radius:4px;position:absolute;top:0;bottom:0;left:50%}.kv{grid-template-columns:auto 1fr;gap:4px 14px;font-size:15px;display:grid}.kv dt{color:var(--text-faint)}.kv dd{margin:0}.axis{gap:4px;margin-bottom:12px;display:grid}.axis .labels{color:var(--text-faint);justify-content:space-between;font-size:12.5px;display:flex}.axis .track{background:linear-gradient(90deg, var(--seal), var(--line) 50%, var(--jade));border-radius:6px;height:6px;position:relative}.axis .track i{background:var(--paper);border-radius:2px;width:4px;height:16px;position:absolute;top:-5px;transform:translate(-50%)}.scroll-wrap{scroll-snap-type:x mandatory;border:1px solid var(--line);color:#1f2a28;box-shadow:var(--shadow);background:linear-gradient(#efe6d4,#e5d9c2);border-radius:8px;gap:0;display:flex;overflow-x:auto}.scroll-panel{scroll-snap-align:center;border-right:1px dashed #1f2a282e;flex:none;grid-template-rows:auto 1fr auto;gap:10px;width:min(78vw,360px);min-height:380px;padding:18px 18px 22px;display:grid}.scroll-panel .age{font-family:var(--font-display);color:#8f2618;font-size:22px;font-weight:700}.scroll-panel h4{font-family:var(--font-display);margin:0;font-size:24px}.scroll-panel p{margin:0;font-size:15px}.scroll-panel .vignette{border-radius:6px;height:140px;overflow:hidden}.poem{font-family:var(--font-display);white-space:pre-line;text-align:center;font-size:22px;font-style:italic;line-height:1.5}.seal-stamp{background:var(--seal);color:#fbeee2;width:64px;height:64px;font-family:var(--font-brush);border-radius:6px;place-items:center;font-size:30px;line-height:1;display:inline-grid;transform:rotate(-4deg);box-shadow:inset 0 0 0 3px #fbeee259}.toast{left:50%;bottom:calc(var(--safe-bottom) + 24px);z-index:50;border-radius:var(--radius-sm);background:var(--paper);max-width:calc(100vw - 32px);color:var(--ink);box-shadow:var(--shadow);padding:12px 16px;font-size:15px;animation:.3s ink-in;position:fixed;transform:translate(-50%)}.toast a{color:var(--seal-deep);font-weight:600}.empty{text-align:center;color:var(--text-dim);padding:30px 10px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}.backdrop-img,.mist-band{animation:none!important}}@media (width>=700px){body{font-size:18px}.screen,.home{padding-left:28px;padding-right:28px}}.fact .scene{aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-sm);width:100%;box-shadow:var(--shadow);margin:8px 0 10px;display:block}.card-art{aspect-ratio:3/4;object-fit:cover;border-radius:var(--radius-sm);width:100%;display:block}.path-choice{grid-template-columns:72px 1fr;align-items:center;gap:12px;display:grid}.path-choice img{object-fit:cover;border-radius:6px;width:72px;height:96px}.fate-art{width:min(62%,260px);box-shadow:var(--shadow);border-radius:10px;margin:6px auto 12px}.scroll-panel .vignette{object-fit:cover;width:100%;height:160px}
