:root{--bg: #07080f;--bg-card: rgba(12, 14, 28, .9);--text: #d0d4e8;--text-dim: rgba(208, 212, 232, .5);--cyan: #00e5ff;--purple: #b388ff;--gold: #ffd54f;--coral: #ff5252;--green: #69f0ae;--border: rgba(255, 255, 255, .08);--glow-cyan: 0 0 20px rgba(0, 229, 255, .3);--glow-purple: 0 0 20px rgba(179, 136, 255, .3);--glow-gold: 0 0 20px rgba(255, 213, 79, .3)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;line-height:1.6;overflow:hidden}.title-screen{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,rgba(0,229,255,.06),transparent 60%),radial-gradient(ellipse at 30% 70%,rgba(179,136,255,.04),transparent 50%),var(--bg);opacity:0;transition:opacity 1s ease}.title-screen.visible{opacity:1}.title-particles .particle{position:absolute;width:3px;height:3px;background:var(--cyan);border-radius:50%;opacity:0;animation:particleFloat 4s ease-in-out infinite}@keyframes particleFloat{0%,to{opacity:0;transform:translateY(0) scale(.5)}50%{opacity:.7;transform:translateY(-30px) scale(1)}}.title-content{text-align:center;z-index:1;opacity:0;transform:translateY(20px);transition:all .8s ease}.title-content.ready{opacity:1;transform:translateY(0)}.title-logo{font-size:clamp(3rem,10vw,5rem);font-weight:800;letter-spacing:.08em;margin-bottom:.25rem}.title-echo{color:var(--cyan);text-shadow:var(--glow-cyan)}.title-verse{color:var(--purple);text-shadow:var(--glow-purple)}.title-subtitle{font-size:clamp(.9rem,3vw,1.2rem);color:var(--text-dim);letter-spacing:.15em;text-transform:uppercase;margin-bottom:2rem}.title-tagline{margin-bottom:2.5rem}.title-tagline p{color:var(--text-dim);font-size:.95rem;margin-bottom:.3rem}.btn-start{position:relative;background:transparent;border:1.5px solid var(--cyan);color:var(--cyan);font-size:1.1rem;font-weight:600;padding:.9rem 2.5rem;border-radius:6px;cursor:pointer;overflow:hidden;transition:all .3s ease;text-transform:uppercase;letter-spacing:.1em}.btn-start:hover{background:#00e5ff1a;box-shadow:var(--glow-cyan);transform:translateY(-2px)}.btn-glow{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent,rgba(0,229,255,.1),transparent);transform:translate(-100%);animation:btnGlow 3s ease-in-out infinite}@keyframes btnGlow{0%{transform:translate(-100%)}50%{transform:translate(100%)}to{transform:translate(100%)}}.title-footer{margin-top:2rem}.title-footer p{font-size:.8rem;color:var(--text-dim)}.game-container{height:100%;display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 0%,rgba(0,229,255,.03),transparent 50%),var(--bg)}.game-error{height:100%;display:flex;align-items:center;justify-content:center;color:var(--coral)}.game-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.25rem;border-bottom:1px solid var(--border);background:#07080fcc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);flex-shrink:0}.header-left{display:flex;align-items:center;gap:.75rem;min-width:0}.chapter-badge{font-size:.65rem;text-transform:uppercase;letter-spacing:.15em;color:var(--cyan);border:1px solid rgba(0,229,255,.3);padding:.15rem .5rem;border-radius:3px;flex-shrink:0}.scene-title{font-size:1rem;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-toggle{background:transparent;border:1px solid var(--border);color:var(--text-dim);padding:.4rem;border-radius:6px;cursor:pointer;transition:all .2s;flex-shrink:0}.status-toggle:hover{color:var(--cyan);border-color:var(--cyan)}.game-content{flex:1;overflow-y:auto;padding:1.25rem;scroll-behavior:smooth}.game-content::-webkit-scrollbar{width:4px}.game-content::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:2px}.character-tag{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem;padding:.5rem .75rem;background:#b388ff14;border:1px solid rgba(179,136,255,.2);border-radius:6px}.char-name{font-weight:600;color:var(--purple);font-size:.85rem}.char-title{font-size:.75rem;color:var(--text-dim)}.char-mood{font-size:.7rem;color:var(--text-dim);font-style:italic;margin-left:auto}.narrative{opacity:0;transform:translateY(10px);transition:all .5s ease;margin-bottom:1.5rem}.narrative.visible{opacity:1;transform:translateY(0)}.narrative p{font-size:1rem;line-height:1.75;color:var(--text);margin-bottom:1rem;opacity:0;animation:fadeSlideIn .4s ease forwards}.narrative p em{color:var(--cyan);font-style:italic}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.echo-trigger-btn{display:flex;align-items:center;gap:.6rem;margin:0 auto 1.5rem;background:#ffd54f14;border:1.5px solid rgba(255,213,79,.4);color:var(--gold);padding:.65rem 1.5rem;border-radius:6px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s;animation:echoPulse 2s ease-in-out infinite}.echo-trigger-btn:hover{background:#ffd54f26;box-shadow:var(--glow-gold)}.echo-trigger-icon{display:flex}@keyframes echoPulse{0%,to{box-shadow:0 0 #ffd54f33}50%{box-shadow:0 0 20px 4px #ffd54f26}}.choices{opacity:0;transform:translateY(15px);transition:all .5s ease}.choices.visible{opacity:1;transform:translateY(0)}.choice-btn{display:flex;align-items:flex-start;gap:.75rem;width:100%;background:#ffffff08;border:1px solid var(--border);color:var(--text);padding:.85rem 1rem;border-radius:8px;cursor:pointer;text-align:left;font-size:.9rem;line-height:1.5;transition:all .2s;margin-bottom:.6rem;opacity:0;animation:fadeSlideIn .3s ease forwards}.choice-btn:hover{background:#00e5ff0f;border-color:#00e5ff4d;transform:translate(4px)}.choice-marker{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border-radius:4px;background:#00e5ff1a;color:var(--cyan);font-weight:700;font-size:.75rem;flex-shrink:0;margin-top:.1rem}.choice-text{flex:1}.choice-effects{display:flex;gap:.3rem;flex-shrink:0}.stat-chip{font-size:.6rem;padding:.15rem .4rem;border-radius:3px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.stat-chip.empathy{background:#4fc3f726;color:#4fc3f7}.stat-chip.courage{background:#ff8a6526;color:#ff8a65}.stat-chip.cunning{background:#ce93d826;color:#ce93d8}.echo-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#000000f2;opacity:0;transition:opacity .6s ease;cursor:pointer}.echo-overlay.enter{opacity:0}.echo-overlay.show{opacity:1}.echo-overlay.exit{opacity:0;transition:opacity .6s ease}.echo-vignette{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,transparent 30%,rgba(0,0,0,.8) 100%);pointer-events:none}.echo-scanlines{position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(255,213,79,.02) 2px,rgba(255,213,79,.02) 4px);pointer-events:none;animation:scanlineMove 8s linear infinite}@keyframes scanlineMove{0%{transform:translateY(0)}to{transform:translateY(100px)}}.echo-content{max-width:32rem;width:90%;max-height:80vh;overflow-y:auto;padding:2rem;position:relative;z-index:1;opacity:0;transform:scale(.95);transition:all .5s ease}.echo-content.visible{opacity:1;transform:scale(1)}.echo-content::-webkit-scrollbar{width:4px}.echo-content::-webkit-scrollbar-thumb{background:#ffd54f4d;border-radius:2px}.echo-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.echo-icon{color:var(--gold);animation:echoRotate 4s linear infinite}@keyframes echoRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.echo-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:var(--gold);opacity:.7}.echo-object{font-size:1.1rem;font-weight:700;color:var(--gold);text-shadow:var(--glow-gold)}.echo-divider{height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:1rem 0;opacity:.4}.echo-owner{font-size:.8rem;color:var(--text-dim);font-style:italic;margin-bottom:1rem}.echo-memory p{font-size:.95rem;line-height:1.8;color:var(--text);margin-bottom:.8rem;opacity:0;animation:fadeSlideIn .5s ease forwards}.echo-dismiss{display:block;margin:1.5rem auto 0;background:transparent;border:1px solid rgba(255,213,79,.4);color:var(--gold);padding:.6rem 1.5rem;border-radius:6px;cursor:pointer;font-size:.85rem;transition:all .2s}.echo-dismiss:hover{background:#ffd54f1a;box-shadow:var(--glow-gold)}.status-panel{position:fixed;top:0;right:-320px;width:300px;height:100%;background:var(--bg-card);border-left:1px solid var(--border);z-index:50;overflow-y:auto;padding:1.25rem;transition:right .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.status-panel.open{right:0}.status-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem}.status-header h2{font-size:1.1rem;font-weight:700;color:var(--cyan)}.status-close{background:transparent;border:none;color:var(--text-dim);font-size:1.5rem;cursor:pointer;padding:0 .25rem;line-height:1}.status-close:hover{color:var(--text)}.status-section{margin-bottom:1.25rem}.status-section h3{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:var(--text-dim);margin-bottom:.6rem;padding-bottom:.3rem;border-bottom:1px solid var(--border)}.stat-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem}.stat-label{font-size:.8rem;font-weight:600;width:4.5rem;flex-shrink:0}.stat-bar-bg{flex:1;height:6px;background:#ffffff0f;border-radius:3px;overflow:hidden}.stat-bar-fill{height:100%;border-radius:3px;transition:width .5s ease}.stat-value{font-size:.8rem;font-weight:700;width:1.5rem;text-align:right}.rel-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:.35rem}.rel-name{font-size:.85rem;font-weight:500}.rel-hearts{display:flex;gap:.15rem}.heart{font-size:.8rem;color:#ffffff26}.heart.filled{color:var(--coral)}.echo-list{display:flex;flex-wrap:wrap;gap:.35rem}.echo-badge{font-size:.7rem;padding:.2rem .5rem;background:#ffd54f1a;border:1px solid rgba(255,213,79,.3);border-radius:4px;color:var(--gold);text-transform:capitalize}.inventory-list{display:flex;flex-wrap:wrap;gap:.35rem}.inventory-item{font-size:.7rem;padding:.2rem .5rem;background:#69f0ae1a;border:1px solid rgba(105,240,174,.3);border-radius:4px;color:var(--green);text-transform:capitalize}.decision-list{list-style:none}.decision-list li{font-size:.75rem;color:var(--text-dim);padding:.2rem 0;text-transform:capitalize}.decision-list li:before{content:"•";color:var(--purple);margin-right:.4rem}.status-scenes{font-size:.8rem;color:var(--text-dim)}.end-screen{height:100%;overflow-y:auto;position:relative;opacity:0;transition:opacity 1s ease}.end-screen.visible{opacity:1}.end-particles .particle{position:absolute;width:3px;height:3px;border-radius:50%;opacity:0;animation:particleFloat 4s ease-in-out infinite}.end-particles .particle:nth-child(odd){background:var(--cyan)}.end-particles .particle:nth-child(2n){background:var(--purple)}.end-content{position:relative;z-index:1;max-width:36rem;margin:0 auto;padding:2rem 1.25rem 3rem}.end-badge{display:block;text-align:center;font-size:clamp(1.5rem,5vw,2.5rem);font-weight:800;letter-spacing:.05em;margin-bottom:2rem}.end-badge.truth{color:var(--cyan);text-shadow:var(--glow-cyan)}.end-badge.guardian{color:var(--green);text-shadow:0 0 20px rgba(105,240,174,.3)}.end-badge.shadow{color:var(--purple);text-shadow:var(--glow-purple)}.end-narrative p{font-size:.95rem;line-height:1.75;color:var(--text);margin-bottom:.8rem;opacity:0;animation:fadeSlideIn .4s ease forwards}.ending-label{font-size:1rem;font-weight:700;color:var(--gold);text-align:center;margin:1.5rem 0;text-shadow:var(--glow-gold)}.end-stats{margin:2rem 0;padding:1.25rem;background:#ffffff08;border:1px solid var(--border);border-radius:8px}.end-stats h3{text-align:center;font-size:.8rem;text-transform:uppercase;letter-spacing:.15em;color:var(--text-dim);margin-bottom:1rem}.end-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;margin-bottom:1rem}.end-stat{text-align:center}.end-stat-val{display:block;font-size:1.5rem;font-weight:800;color:var(--cyan)}.end-stat-label{font-size:.6rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim)}.end-attributes{display:flex;justify-content:center;gap:1.5rem}.attr{font-size:.8rem;font-weight:600}.end-replay{display:block;margin:2rem auto 0}@media(max-width:480px){.game-content{padding:1rem}.choice-btn{padding:.75rem;font-size:.85rem}.choice-effects{display:none}.end-stat-grid{grid-template-columns:repeat(2,1fr)}.status-panel{width:260px;right:-280px}}