@font-face{font-family:Averia;src:url(../dolce-traccia/dialogue/AveriaSansLibre-Regular.ttf)}
:root{color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#0c0c12;color:#e8e1d6}body{font:23px/1.65 Georgia,"Times New Roman",serif}.shell{width:min(1100px,100%);height:100dvh;margin:0 auto;padding:12px 14px max(14px,env(safe-area-inset-bottom));display:flex;flex-direction:column;justify-content:flex-end;gap:18px}#journal{min-height:0;overflow:auto;scrollbar-width:none;-ms-overflow-style:none;text-align:left;padding:20px 8px;flex:1;overflow-anchor:none;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}#lines:empty{display:none}.line{margin:0 0 20px;white-space:pre-wrap;overflow-wrap:anywhere}.line:last-child{margin-bottom:0}.line img{display:block;max-width:100%;max-height:400px;object-fit:contain;margin:16px auto}#command-form{flex:none;margin:0}input{display:block;width:100%;border:1px solid #61566a;border-radius:2px;background:#14121b;color:inherit;padding:13px 16px;font:21px/1.4 Georgia,"Times New Roman",serif;outline:none}input:focus{border-color:#ab97bd}input::placeholder{color:#93889d}input:disabled{opacity:.5}#status{font:13px/1.4 system-ui;text-align:center;color:#cab895}#status[hidden]{display:none}#status a{color:inherit}.sr-only{position:absolute;width:1px;height:1px;clip:rect(0,0,0,0);overflow:hidden}@media(max-width:600px){body{font-size:21px}.shell{padding:8px 10px max(10px,env(safe-area-inset-bottom));gap:14px}.line img{max-height:280px}}
.line img[hidden]{display:none}

.cards{display:block;width:min(360px,100%);height:auto;margin:16px auto}.cards[hidden]{display:none}

*{scrollbar-width:none}*::-webkit-scrollbar{display:none;width:0;height:0}

#lines{display:flex;flex-direction:column;justify-content:flex-end;min-height:100%;gap:24px}.line{flex:none;width:100%;margin:0}.line[hidden]{display:none}
.word-enter{display:inline-block;animation:word-wave .6s ease-out both}
@keyframes word-wave{from{opacity:0;filter:blur(2px);transform:translateY(12px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.word-enter{animation:none}}

.line.command{background:#242030;border-left:2px solid #76618c;border-radius:3px;padding:10px 14px;color:#d9cce8;font-size:.94em}

#name-intro{position:fixed;inset:0 0 110px;display:flex;align-items:center;justify-content:center;padding:24px;pointer-events:none}
#name-intro[hidden]{display:none}
#name-question{width:100%;margin:0;text-align:center;font:400 clamp(38px,6.5vw,92px)/1.2 Georgia,"Times New Roman",serif;letter-spacing:.025em;color:#ece7f3;text-shadow:0 0 22px #c4aad94a,0 0 60px #8c6bb333;animation:ghost-question 1.6s ease-out both}
.choosing-name #journal{visibility:hidden}
@keyframes ghost-question{from{opacity:0;filter:blur(10px);transform:translateY(10px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#name-question{animation:none}}


#command-form,.command-input{position:relative}
.command-input input{position:relative;z-index:1;background:transparent}
.command-input{background:#14121b;border-radius:2px}
#command-suggestion{position:absolute;inset:0;overflow:hidden;white-space:pre;padding:13px 16px;border:1px solid transparent;pointer-events:none;font:21px/1.4 Georgia,"Times New Roman",serif;z-index:2;color:#857e8e}
#command-suggestion[hidden]{display:none}#suggestion-prefix{color:transparent}


@media(pointer:coarse){#suggestion-text{pointer-events:auto;touch-action:manipulation}}

.command-input input{padding-right:58px}
#command-suggestion{right:48px}
#command-confirm{position:absolute;right:5px;top:50%;transform:translateY(-50%);z-index:3;display:grid;place-items:center;width:42px;height:42px;padding:0;border:0;border-radius:3px;background:transparent;color:#bca6ce;cursor:pointer;touch-action:manipulation}
#command-confirm svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#command-confirm:hover,#command-confirm:focus-visible{background:#372c40;color:#f0e7f7}#command-confirm:disabled{opacity:.35;cursor:default}

#hint-overlay{position:fixed;inset:0 0 110px;z-index:20;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .65s ease;pointer-events:none;isolation:isolate}
#hint-overlay[hidden]{display:none}#hint-overlay.visible{opacity:1}
.hint-cloud{position:absolute;inset:-12% -7%;z-index:-1;background:radial-gradient(ellipse at 42% 52%,#000f 0%,#000e 24%,#000b 43%,#0003 62%,transparent 78%),radial-gradient(ellipse at 65% 43%,#000d,transparent 64%);filter:blur(28px);transform:scale(.96);transition:transform 1.8s ease-out}
#hint-overlay.visible .hint-cloud{transform:scale(1.04)}
#hint-text{margin:0;text-align:center;white-space:pre-wrap;overflow-wrap:anywhere;overflow:auto;pointer-events:auto;font-family:Georgia,"Times New Roman",serif;line-height:1.38;font-weight:400;letter-spacing:.015em;color:#eee8f4;text-shadow:0 0 18px #d1bbeb55,0 0 48px #b499ce33;opacity:0;filter:blur(7px);transform:translateY(8px);transition:opacity 1.1s ease,filter 1.4s ease,transform 1.4s ease-out}
#hint-overlay.visible #hint-text{opacity:1;filter:blur(0);transform:translateY(0)}
.line.hint{color:#d5c5e2;border-left:2px solid #756384;padding-left:14px}
@media(prefers-reduced-motion:reduce){#hint-overlay,#hint-text,.hint-cloud{transition:none}}

html,body{height:100%;overflow:hidden;overscroll-behavior:none}
.shell{position:fixed;top:var(--visible-top,0px);left:50%;transform:translateX(-50%);height:var(--visible-height,100dvh);max-height:var(--visible-height,100dvh);margin:0}
#journal{touch-action:pan-y;overscroll-behavior-y:contain}
.keyboard-open .shell{padding-bottom:10px}
#name-intro,#hint-overlay{top:var(--visible-top,0px);bottom:auto;height:max(80px,calc(var(--visible-height,100dvh) - 110px))}
@media(pointer:coarse){#command-confirm{display:none}.command-input input{padding-right:16px}#command-suggestion{right:0}}

#command-confirm{display:none}.command-input input{padding-right:16px}#command-suggestion{right:0}

@font-face{font-family:"Forgotten Futurist";src:url("./fonts/forgotten-futurist-regular.otf") format("opentype");font-style:normal;font-weight:400;font-display:swap}
.line.command,#command,#command-suggestion{font-family:"Forgotten Futurist",sans-serif;font-weight:400}

#name-question{text-shadow:0 0 3px #f3eaff99,0 0 12px #d6b8ff99,0 0 28px #b28bdd70,0 0 60px #8b5fc83d}

.line.command{background:none;border-left:0;border-radius:3px;padding:10px 14px;color:#fda089;text-align:center;font:700 22px/1.85 "Forgotten Futurist",Georgia,sans-serif;filter:drop-shadow(5px 5px 5px rgb(255 0 0))}

.reply-text strong,#hint-text strong{font-weight:700}.reply-text em,#hint-text em{font-style:italic}.reply-text code,#hint-text code{font-family:ui-monospace,monospace;font-size:.9em;background:#ffffff0b;padding:0 .15em;border-radius:2px}
.adventure-ended #command-form{display:none}
#ending-scene{position:fixed;inset:0;top:var(--visible-top,0px);height:var(--visible-height,100dvh);z-index:15;display:grid;align-items:center;overflow:auto;padding:clamp(24px,7vw,90px);background:#0b0c10;color:#e8e2d8;cursor:pointer;outline:none;scrollbar-width:none}
#ending-scene::-webkit-scrollbar{display:none}
.ending-bubble{width:100%;max-width:1000px;margin:auto;font:clamp(21px,2.1vw,27px)/1.8 Georgia,serif;white-space:pre-wrap}
.ending-slash{position:absolute;left:8%;top:50%;width:84%;height:5px;background:white;transform:rotate(-27deg);box-shadow:0 0 8px #fff,0 0 22px #b7deff,0 0 45px #75bfff;animation:ending-slash .65s ease-out both;pointer-events:none}
@keyframes ending-slash{0%{clip-path:inset(0 100% 0 0);opacity:0}12%{opacity:1}38%{clip-path:inset(-50px -50px -50px -50px);opacity:1}100%{clip-path:inset(-50px -50px -50px -50px);opacity:0}}
@media(prefers-reduced-motion:reduce){.ending-slash{animation:none;opacity:.5}}
#ending-scene.ending-blinded{background:#fff;color:#151515}
.ending-effects{position:fixed;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.ending-bubble{position:relative;z-index:1;will-change:transform,filter}
.ending-preview-back{position:fixed;bottom:max(20px,env(safe-area-inset-bottom));left:24px;z-index:5;border:1px solid #5a5966;background:#191b23;color:#d8d3c9;padding:10px 16px;border-radius:4px;font:15px Georgia;cursor:pointer}
.ending-preview-back:disabled{opacity:.3;cursor:default}
.ending-star-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.ending-effects{z-index:3}
#ending-scene.ending-star-active .ending-bubble{max-height:calc(var(--visible-height,100dvh) - 180px);overflow:auto;scrollbar-width:none}
/* Reserve the completed sentence from its first fragment, keeping it vertically centered. */
#ending-scene{align-items:center}
.ending-bubble{margin:auto;align-self:center}
.ending-reserve{visibility:hidden;pointer-events:none}
.ending-live{position:absolute;inset:0}
#ending-scene.ending-closing .ending-bubble{filter:blur(18px);opacity:0;transition:filter 1.1s ease,opacity 1.1s ease}
#ending-scene.ending-thanks{background:#ef963f;color:#15120f;padding:clamp(24px,6vw,80px);align-items:center;transition:background 1.2s ease,color .8s ease}
.ending-feedback{max-width:800px;width:100%;margin:auto;animation:ending-thanks-in 1s ease both;font:clamp(19px,2vw,24px)/1.5 Georgia,serif}
.ending-feedback h1{font:400 clamp(36px,5vw,64px)/1.2 Georgia,serif;margin:0 0 32px;text-align:center}
.ending-feedback form{display:grid;gap:16px}
.ending-feedback textarea{width:100%;border:1px solid #17120f80;background:#fff3da60;color:#15120f;border-radius:4px;padding:14px;resize:vertical;min-height:100px;max-height:35vh;font:18px/1.5 Georgia,serif}
.ending-feedback button{justify-self:end;border:1px solid #21180e;background:#21180e;color:#ffe6c2;font:18px Georgia;padding:10px 24px;border-radius:4px;cursor:pointer}
.ending-feedback button:disabled{opacity:.5;cursor:default}
.ending-feedback-status{font:16px/1.4 Georgia;min-height:1.4em;margin:0}
.ending-discord{display:flex;align-items:center;justify-content:center;gap:14px;color:inherit;text-decoration:none;font:17px/1.5 Georgia;text-align:center;margin-top:50px}
.ending-discord:hover{text-decoration:underline}.ending-discord svg{width:30px;height:30px;flex:none}
@keyframes ending-thanks-in{from{opacity:0;filter:blur(5px)}to{opacity:1;filter:blur(0)}}
@media(max-height:600px){.ending-feedback h1{margin-bottom:18px}.ending-discord{margin-top:20px}}
@media(prefers-reduced-motion:reduce){#ending-scene.ending-closing .ending-bubble,#ending-scene.ending-thanks{transition:none}.ending-feedback{animation:none}}
