:root{--bg-parchment:#f6f3eb;--bg-parchment-dark:#ebe6d8;--color-ink:#2c2924;--color-ink-muted:#5e5950;--color-green-retro:#274c35;--color-green-glow:#386f4f;--color-orange-sunset:#e76f51;--color-orange-glow:#f4a261;--color-border:#dfd8c8;--color-danger:#c94a29;--color-danger-glow:#e06d53;--glass-bg:#ebe6d8a6;--glass-border:#dfd8c8cc;--box-shadow-retro:0 8px 24px #2c292414;--box-shadow-inset:inset 0 2px 4px #2c29240a;--border-radius-retro:12px;--font-family-serif:"Noto Serif SC", "Georgia", serif;--font-family-sans:"Outfit", "Segoe UI", system-ui, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:#e5dfd3;background-image:radial-gradient(var(--bg-parchment) 1px, transparent 0), radial-gradient(var(--bg-parchment) 1px, transparent 0);color:var(--color-ink);font-family:var(--font-family-serif);-webkit-font-smoothing:antialiased;background-position:0 0,12px 12px;background-size:24px 24px;justify-content:center;align-items:center;height:100vh;display:flex;overflow:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--color-ink-muted)}#game-app{background-color:var(--bg-parchment);border:1px solid var(--color-border);border-radius:var(--border-radius-retro);flex-direction:column;width:96vw;max-width:1400px;height:94vh;display:flex;position:relative;overflow:hidden;box-shadow:0 16px 48px #2c292426}.game-header{border-bottom:1px solid var(--color-border);background-color:var(--bg-parchment-dark);z-index:10;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.logo-area{align-items:center;gap:12px;display:flex}.hourglass-icon{font-size:28px;animation:4s ease-in-out infinite rotateHourglass}.game-title{font-family:var(--font-family-serif);color:var(--color-green-retro);letter-spacing:1px;font-size:22px;font-weight:700}.game-title small{font-family:var(--font-family-sans);color:var(--color-ink-muted);background:#2c29240d;border-radius:10px;margin-left:8px;padding:2px 8px;font-size:13px;font-weight:400}.header-actions{gap:12px;display:flex}.game-container{flex:1;height:calc(100% - 70px);display:flex;overflow:hidden}.story-panel{border-right:1px solid var(--color-border);background-color:var(--bg-parchment);flex-direction:column;width:60%;display:flex;position:relative}.npc-stage-wrapper{background-image:linear-gradient(#ebe6d866 0%,#0000 100%);border-bottom:1px solid #dfd8c880;padding:20px}.npc-stage{justify-content:space-around;align-items:flex-end;gap:10px;height:180px;display:flex}.npc-slot{opacity:.5;filter:grayscale(40%);flex-direction:column;flex:1;align-items:center;transition:all .3s cubic-bezier(.25,.8,.25,1);display:flex;transform:translateY(10px)}.npc-slot.active{opacity:1;filter:grayscale(0%);transform:translateY(0)}.npc-sprite-container{justify-content:center;align-items:flex-end;width:100px;height:120px;display:flex;position:relative}.npc-sprite{width:100%;height:100%;transition:transform .3s}.npc-slot.active .npc-sprite{animation:3s ease-in-out infinite alternate npcBreath}.npc-info{text-align:center;width:100%;margin-top:10px}.npc-name{font-family:var(--font-family-serif);color:var(--color-ink);font-size:14px;font-weight:700}.npc-name small{color:var(--color-ink-muted);font-size:11px;font-weight:400}.npc-meta{justify-content:center;align-items:center;gap:6px;margin-top:4px;display:flex}.npc-badge{font-family:var(--font-family-sans);border:1px solid var(--color-border);border-radius:4px;padding:1px 6px;font-size:10px}.emotion-badge{background-color:var(--bg-parchment-dark)}.emotion-happy{color:#385723;background-color:#e2f0d9;border-color:#c5e0b4}.emotion-angry{color:#c00000;background-color:#fce4d6;border-color:#f8cbad}.emotion-sad{color:#455a64;background-color:#eceff1;border-color:#cfd8dc}.emotion-surprised{color:#7f6000;background-color:#fff2cc;border-color:#ffe599}.emotion-neutral{color:#595959;background-color:#f2f2f2;border-color:#d9d9d9}.npc-affinity{font-family:var(--font-family-sans);color:var(--color-orange-sunset);font-size:11px;font-weight:600}.placeholder-mother,.placeholder-classmate,.placeholder-friend{border:2px solid var(--bg-parchment);background-position:50%;background-size:cover;border-radius:45% 45% 0 0;width:90px;height:110px;box-shadow:0 4px 12px #2c29241a}.dialogue-box{flex-direction:column;flex:1;padding:24px 30px;display:flex;position:relative;overflow:hidden}.age-banner{font-family:var(--font-family-sans);color:var(--color-green-retro);letter-spacing:1px;background-color:#274c3514;border-radius:20px;align-self:flex-start;margin-bottom:16px;padding:4px 12px;font-size:12px;font-weight:600}.dialogue-scroll-area{letter-spacing:.5px;color:var(--color-ink);flex:1;padding-right:10px;font-size:16px;line-height:1.8;overflow-y:auto}.story-paragraph{white-space:pre-wrap;margin-bottom:16px;animation:.4s fadeIn}.story-paragraph.npc-speech{border-left:3px solid var(--color-green-retro);background-color:#ebe6d866;border-radius:8px;padding:12px 18px}.story-paragraph.npc-speech .speaker-name{color:var(--color-green-retro);margin-bottom:4px;margin-right:8px;font-size:14px;font-weight:700;display:block}.loading-text:after{content:"...";animation:1.5s infinite dots}.stats-bar{background-color:var(--bg-parchment-dark);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);justify-content:space-between;gap:20px;padding:12px 30px;display:flex}.stat-item{flex:1;align-items:center;gap:10px;display:flex}.stat-label{font-family:var(--font-family-serif);width:50px;color:var(--color-ink-muted);font-size:13px;font-weight:700}.stat-track{height:8px;box-shadow:var(--box-shadow-inset);background-color:#2c292414;border-radius:4px;flex:1;overflow:hidden}.stat-fill{background-image:linear-gradient(to right, var(--color-orange-glow), var(--color-orange-sunset));border-radius:4px;height:100%;transition:width .8s cubic-bezier(.25,.8,.25,1)}.stat-val{font-family:var(--font-family-sans);text-align:right;width:24px;color:var(--color-ink);font-size:13px;font-weight:600}.interaction-control{background-color:var(--bg-parchment);flex-direction:column;gap:14px;padding:20px 30px 24px;display:flex}.options-container{flex-direction:column;gap:10px;display:flex}.option-btn{width:100%;font-family:var(--font-family-serif);color:var(--color-ink);background-color:var(--bg-parchment-dark);border:1px solid var(--color-border);text-align:left;cursor:pointer;border-radius:8px;padding:12px 18px;font-size:15px;line-height:1.5;transition:all .25s;box-shadow:0 2px 4px #2c292405}.option-btn:hover:not(:disabled){background-color:var(--color-green-retro);color:var(--bg-parchment);border-color:var(--color-green-retro);transform:translateY(-1px);box-shadow:0 4px 8px #274c3526}.option-btn:disabled,.option-btn.locked{opacity:.5;cursor:not-allowed}.ai-loading-card{background:linear-gradient(135deg, #274c351f, #e76f511a), var(--bg-parchment-dark);border:1px solid #274c353d;border-radius:10px;align-items:center;gap:16px;min-height:92px;padding:18px 20px;display:flex;position:relative;overflow:hidden;box-shadow:0 8px 20px #2c292414}.ai-loading-card:before{content:"";background:linear-gradient(90deg,#0000,#ffffff6b,#0000);animation:2.2s ease-in-out infinite loadingSheen;position:absolute;inset:0;transform:translate(-120%)}.ai-loading-orb{z-index:1;background-color:var(--bg-parchment);border:1px solid #274c3540;border-radius:50%;flex:0 0 48px;place-items:center;width:48px;height:48px;font-size:24px;animation:1.6s ease-in-out infinite loadingPulse;display:grid;position:relative;box-shadow:0 0 0 6px #274c350f}.ai-loading-copy{z-index:1;flex-direction:column;flex:1;gap:6px;min-width:0;display:flex;position:relative}.ai-loading-copy strong{font-family:var(--font-family-serif);color:var(--color-green-retro);font-size:16px}.ai-loading-text,.ai-loading-copy small{font-family:var(--font-family-sans);color:var(--color-ink-muted)}.ai-loading-text{font-size:13px}.ai-loading-text:after{content:"";animation:1.5s infinite dots}.ai-loading-copy small{font-size:11px}.ai-loading-bar{width:100%;height:8px;box-shadow:var(--box-shadow-inset);background-color:#2c292414;border-radius:999px;margin:2px 0;overflow:hidden}.ai-loading-bar span{border-radius:inherit;background-image:linear-gradient(90deg, var(--color-orange-glow), var(--color-orange-sunset), var(--color-green-glow));width:38%;height:100%;animation:1.5s ease-in-out infinite loadingBar;display:block}.custom-input-area{gap:12px;display:flex}#input-custom-action{font-family:var(--font-family-serif);background-color:var(--bg-parchment-dark);border:1px solid var(--color-border);color:var(--color-ink);border-radius:8px;flex:1;padding:12px 16px;font-size:14px;transition:all .3s}#input-custom-action:focus{border-color:var(--color-green-glow);background-color:var(--bg-parchment);outline:none;box-shadow:0 0 0 3px #274c351a}#input-custom-action:disabled{opacity:.5;cursor:not-allowed}.submit-btn{font-family:var(--font-family-sans);color:var(--bg-parchment);background-color:var(--color-orange-sunset);cursor:pointer;border:none;border-radius:8px;padding:12px 24px;font-size:14px;font-weight:600;transition:all .25s;box-shadow:0 4px 12px #e76f5133}.submit-btn:hover:not(:disabled){background-color:#d85c3e;transform:translateY(-1px);box-shadow:0 6px 16px #e76f514d}.submit-btn:disabled{background-color:var(--color-border);color:var(--color-ink-muted);cursor:not-allowed;box-shadow:none}.tree-panel{background-color:var(--bg-parchment-dark);flex-direction:column;width:40%;display:flex;position:relative}.panel-header{border-bottom:1px solid var(--color-border);background-color:#dfd8c84d;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.panel-title{font-family:var(--font-family-serif);color:var(--color-green-retro);font-size:15px;font-weight:700}.panel-title small{font-family:var(--font-family-sans);color:var(--color-ink-muted);font-size:11px;font-weight:400}.canvas-container{cursor:grab;flex:1;position:relative;overflow:hidden}.canvas-container:active{cursor:grabbing}#tree-canvas{width:100%;height:100%;display:block;position:absolute;top:0;left:0}.tree-zoom-controls{z-index:5;flex-direction:column;gap:6px;display:flex;position:absolute;bottom:20px;right:20px}.zoom-btn{background-color:var(--bg-parchment);border:1px solid var(--color-border);width:36px;height:36px;color:var(--color-ink);font-family:var(--font-family-sans);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;font-size:18px;font-weight:600;transition:all .2s;display:flex;box-shadow:0 4px 8px #2c29240f}.zoom-btn:hover{background-color:var(--color-green-retro);color:var(--bg-parchment);border-color:var(--color-green-retro)}.retro-btn,.retro-btn-primary{font-family:var(--font-family-sans);cursor:pointer;border-radius:6px;padding:8px 16px;font-size:13px;font-weight:600;transition:all .25s}.retro-btn{background-color:var(--bg-parchment);border:1px solid var(--color-border);color:var(--color-ink);box-shadow:0 2px 4px #2c292405}.retro-btn:hover{background-color:#2c29240d}.retro-btn-primary{background-color:var(--color-green-retro);border:1px solid var(--color-green-retro);color:var(--bg-parchment);box-shadow:0 2px 6px #274c3526}.retro-btn-primary:hover{background-color:var(--color-green-glow);border-color:var(--color-green-glow);box-shadow:0 4px 12px #274c3540}.danger-btn-sm{font-family:var(--font-family-sans);color:var(--color-danger);border:1px solid var(--color-danger);cursor:pointer;background-color:#0000;border-radius:4px;padding:4px 10px;font-size:11px;font-weight:600;transition:all .2s}.danger-btn-sm:hover{color:var(--bg-parchment);background-color:var(--color-danger)}.modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;opacity:1;background-color:#2c292480;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .3s;display:flex;position:absolute;top:0;left:0}.modal-backdrop.hidden{opacity:0;display:none!important}.retro-modal{background-color:var(--bg-parchment);border:1px solid var(--color-border);border-radius:var(--border-radius-retro);flex-direction:column;width:90%;max-width:500px;animation:.3s cubic-bezier(.34,1.56,.64,1) modalScaleUp;display:flex;box-shadow:0 24px 64px #2c292433}.modal-title{border-bottom:1px solid var(--color-border);font-family:var(--font-family-serif);color:var(--color-green-retro);padding:20px 24px;font-size:18px;font-weight:700}.modal-title.danger{color:var(--color-danger)}.modal-body{max-height:60vh;padding:24px;overflow-y:auto}.modal-footer{border-top:1px solid var(--color-border);background-color:var(--bg-parchment-dark);border-radius:0 0 var(--border-radius-retro) var(--border-radius-retro);justify-content:flex-end;gap:12px;padding:16px 24px;display:flex}.form-group{margin-bottom:16px}.form-group.hidden{display:none}.form-group label{font-family:var(--font-family-sans);color:var(--color-ink-muted);margin-bottom:6px;font-size:13px;font-weight:600;display:block}.form-control{width:100%;font-family:var(--font-family-sans);background-color:var(--bg-parchment-dark);border:1px solid var(--color-border);color:var(--color-ink);border-radius:6px;padding:10px 14px;font-size:14px;transition:all .25s}.form-control:focus{border-color:var(--color-green-glow);background-color:var(--bg-parchment);outline:none}.security-tip{font-family:var(--font-family-sans);color:var(--color-ink-muted);border-left:2px solid var(--color-green-retro);background-color:#274c350d;border-radius:6px;margin-top:14px;padding:10px 14px;font-size:11px;line-height:1.5}.save-actions-grid{grid-template-columns:1fr 1fr;gap:16px;margin-top:20px;display:grid}.save-card{border:1px dashed var(--color-border);background-color:var(--bg-parchment-dark);border-radius:8px;flex-direction:column;justify-content:space-between;gap:12px;padding:16px;display:flex}.save-card h4{font-family:var(--font-family-serif);color:var(--color-ink);font-size:14px}.save-card p{font-family:var(--font-family-sans);color:var(--color-ink-muted);font-size:11px;line-height:1.5}.w-full{width:100%}.save-status-info{background-color:var(--bg-parchment-dark);font-family:var(--font-family-sans);border-radius:8px;justify-content:space-between;padding:12px 16px;font-size:13px;display:flex}.rewind-node-info{background-color:var(--bg-parchment-dark);font-family:var(--font-family-sans);border-radius:8px;margin-top:14px;padding:16px;font-size:13px;line-height:1.6}.warning-text{color:var(--color-danger);margin-top:10px;font-size:12px}.danger-btn{background-color:var(--color-danger);border-color:var(--color-danger)}.danger-btn:hover{background-color:#a83a1d;border-color:#a83a1d;box-shadow:0 4px 12px #c94a2940}@keyframes rotateHourglass{0%{transform:rotate(0)}45%{transform:rotate(0)}55%{transform:rotate(180deg)}to{transform:rotate(180deg)}}@keyframes npcBreath{0%{transform:translateY(0)}to{transform:translateY(-5px)}}@keyframes dots{0%{content:"."}33%{content:".."}66%{content:"..."}}@keyframes loadingSheen{0%{transform:translate(-120%)}55%{transform:translate(120%)}to{transform:translate(120%)}}@keyframes loadingPulse{0%,to{transform:scale(1)rotate(0);box-shadow:0 0 0 6px #274c350f}50%{transform:scale(1.08)rotate(180deg);box-shadow:0 0 0 12px #e76f5114}}@keyframes loadingBar{0%{transform:translate(-110%)}50%{transform:translate(82%)}to{transform:translate(230%)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes modalScaleUp{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}#time-travel-overlay{z-index:9999;pointer-events:none;background-color:#0000;width:100%;height:100%;transition:background-color .5s;position:absolute;top:0;left:0}#time-travel-overlay.active{animation:1.8s cubic-bezier(.77,0,.175,1) forwards timeTravelVortex}@keyframes timeTravelVortex{0%{-webkit-backdrop-filter:blur(0px) rotate(0deg) scale(1) invert(0%);backdrop-filter:blur(0px) rotate(0deg) scale(1) invert(0%);background-color:#2c292400}30%{-webkit-backdrop-filter:blur(6px) rotate(45deg) scale(1.1) invert(10%);backdrop-filter:blur(6px) rotate(45deg) scale(1.1) invert(10%);background-color:#274c3540}50%{-webkit-backdrop-filter:blur(16px) rotate(-180deg) scale(.8) invert(100%) grayscale(80%);backdrop-filter:blur(16px) rotate(-180deg) scale(.8) invert(100%) grayscale(80%);background-color:#e76f5166}75%{-webkit-backdrop-filter:blur(10px) rotate(90deg) scale(1.2) invert(30%);backdrop-filter:blur(10px) rotate(90deg) scale(1.2) invert(30%);background-color:#2c2924a6}to{-webkit-backdrop-filter:blur(0px) rotate(0deg) scale(1) invert(0%);backdrop-filter:blur(0px) rotate(0deg) scale(1) invert(0%);background-color:#2c292400}}@media (width<=900px){body{align-items:flex-start;height:auto;min-height:100dvh;overflow:auto}#game-app{border-left:none;border-right:none;border-radius:0;width:100%;height:auto;min-height:100dvh;overflow:visible}.game-header{flex-wrap:wrap;gap:12px;padding:12px 14px;position:sticky;top:0}.logo-area{flex:1;min-width:0}.hourglass-icon{font-size:24px}.game-title{font-size:18px;line-height:1.2}.game-title small{width:fit-content;margin:4px 0 0;font-size:11px;display:block}.header-actions{justify-content:stretch;width:100%}.header-actions button{flex:1;min-height:42px}.game-container{flex-direction:column;height:auto;min-height:0;overflow:visible}.story-panel,.tree-panel{width:100%}.story-panel{border-right:none;border-bottom:1px solid var(--color-border)}.npc-stage-wrapper{padding:12px 10px 10px}.npc-stage{gap:4px;height:130px}.npc-sprite-container{width:72px;height:88px}.npc-info{margin-top:6px}.npc-name{font-size:12px}.npc-name small{font-size:10px;display:block}.npc-meta{flex-wrap:wrap;gap:4px}.npc-badge,.npc-affinity{font-size:10px}.dialogue-box{min-height:42vh;padding:18px 16px}.dialogue-scroll-area{max-height:48vh;padding-right:6px;font-size:15px;line-height:1.75}.stats-bar{flex-direction:column;gap:10px;padding:12px 16px}.stat-label{width:64px}.interaction-control{gap:12px;padding:16px}.option-btn{min-height:48px;padding:12px 14px;font-size:14px}.ai-loading-card{gap:12px;min-height:104px;padding:16px}.ai-loading-orb{flex-basis:42px;width:42px;height:42px;font-size:22px}.ai-loading-copy strong{font-size:15px}.custom-input-area{flex-direction:column;gap:10px}#input-custom-action,.submit-btn{width:100%;min-height:46px}.tree-panel{min-height:420px}.panel-header{align-items:flex-start;gap:10px;padding:12px 14px}.panel-title{font-size:14px;line-height:1.35}.panel-title small{margin-top:2px;display:block}.danger-btn-sm{white-space:nowrap;min-height:36px}.canvas-container{min-height:360px}.tree-zoom-controls{bottom:14px;right:14px}.modal-backdrop{align-items:flex-start;padding:16px;position:fixed;overflow-y:auto}.retro-modal{width:100%;max-width:520px;max-height:calc(100dvh - 32px);margin:auto 0}.modal-title{padding:16px;font-size:17px}.modal-body{max-height:calc(100dvh - 170px);padding:16px}.modal-footer{flex-wrap:wrap;padding:12px 16px}.modal-footer button{flex:1;min-width:120px;min-height:42px}.save-actions-grid{grid-template-columns:1fr}.save-status-info{display:block}.save-status-info p+p{margin-top:6px}}@media (width<=480px){.game-header{padding:10px}.game-title{font-size:16px}.header-actions{gap:8px}.retro-btn,.retro-btn-primary{padding-left:10px;padding-right:10px;font-size:12px}.npc-stage{height:112px}.npc-sprite-container{width:58px;height:72px}.npc-name{font-size:11px}.npc-meta{display:none}.dialogue-box{min-height:46vh;padding:16px 12px}.dialogue-scroll-area{max-height:52vh;font-size:14px}.ai-loading-card{align-items:flex-start}.stats-bar,.interaction-control{padding-left:12px;padding-right:12px}.panel-header{flex-direction:column}.danger-btn-sm{width:100%}.tree-panel{min-height:380px}.canvas-container{min-height:320px}}