:root{color:#f5f1ea;background:#0f0f10;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{color:#f5f1ea;background:radial-gradient(circle,#1a1a1a 0%,#0b0b0b 40%,#050505 70%,#000 100%);min-height:100vh}#app{min-height:100vh}.screen{text-align:center;place-items:center;min-height:100vh;padding:32px 24px;display:grid}.content{width:min(100%,760px);margin:0 auto}.gate-card{isolation:isolate;width:min(100%,700px);margin:0 auto;position:relative}.gate-glow{filter:blur(18px);z-index:-1;pointer-events:none;background:radial-gradient(circle,#ffffff13,#0000 62%);border-radius:50%;width:420px;height:420px;position:absolute;inset:auto 50% 18%;transform:translate(-50%)}.eyebrow{letter-spacing:.24em;text-transform:uppercase;opacity:.62;margin:0 0 14px;font-size:.78rem}.main-text{letter-spacing:-.055em;text-wrap:balance;margin:0;font-size:clamp(2.8rem,7vw,5.8rem);font-weight:650;line-height:.98}.gate-title{max-width:12ch;margin-left:auto;margin-right:auto}.sub-text{opacity:.76;text-wrap:balance;max-width:560px;margin:18px auto 0;font-size:1.05rem;line-height:1.6}.gate-form{justify-items:center;row-gap:18px;margin-top:34px;display:grid}.secret-input{color:#f5f1ea;text-align:center;-webkit-backdrop-filter:blur(8px);background:#ffffff09;border:1px solid #ffffff1f;border-radius:20px;outline:none;width:min(100%,620px);height:64px;padding:0 22px;font-size:1.05rem;transition:border-color .22s,background .22s,box-shadow .22s,transform .22s}.secret-input::placeholder{color:#f5f1ea47}.secret-input:focus{background:#ffffff0d;border-color:#ffffff3d;box-shadow:0 0 0 6px #ffffff09}.enter-button{color:#111;cursor:pointer;background:#f1ede6;border:none;font-size:1rem;font-weight:650;transition:transform .18s,opacity .18s,box-shadow .18s}.gate-button{border-radius:18px;width:min(100%,220px);height:58px;padding:0 24px}.enter-button:hover{opacity:.98;transform:translateY(-1px);box-shadow:0 10px 30px #0003}.feedback{color:#d3a6a6;min-height:24px;margin:14px 0 0;font-size:.95rem}.hint-text{letter-spacing:.2em;text-transform:uppercase;opacity:.4;margin:18px 0 0;font-size:.78rem}.row{justify-content:space-between;align-items:center;gap:32px;width:min(100%,980px);display:flex}.left,.right{letter-spacing:-.05em;margin:0;font-size:clamp(2.2rem,6vw,5.2rem);font-weight:650;line-height:1}.chat{text-align:left;flex-direction:column;align-items:flex-start;gap:14px;width:min(100%,680px);display:flex}.chat-line{color:#f5f1ea;background:#ffffff0b;border:1px solid #ffffff0f;border-radius:16px;max-width:100%;margin:0;padding:12px 16px;font-size:1rem;line-height:1.45}@media (width<=700px){.screen{padding:24px 18px}.main-text{font-size:clamp(2.2rem,10vw,4rem)}.sub-text{font-size:.98rem}.secret-input{border-radius:18px;width:100%;height:58px}.gate-button{border-radius:16px;width:min(100%,180px);height:54px}.row{flex-direction:column;gap:18px}.gate-glow{width:320px;height:320px}.bridge-screen{cursor:pointer}.bridge-content{width:min(100%,760px)}.bridge-title{max-width:11ch;margin-left:auto;margin-right:auto}.bridge-hint{margin-top:24px}.pp-scene{width:100%;height:100%;position:relative}.pp-left{text-align:left;max-width:420px;position:absolute;top:40%;left:8%;transform:translateY(-50%)}.pp-right{text-align:right;max-width:420px;position:absolute;top:60%;right:8%;transform:translateY(-50%)}.pp-bottom{text-align:center;position:absolute;bottom:12%;left:50%;transform:translate(-50%)}.pp-label{letter-spacing:.2em;opacity:.6;font-size:.9rem}.pp-text{font-size:clamp(2.5rem,4vw,4.5rem);font-weight:600;line-height:1}.pp-final-top{opacity:.6;font-size:.9rem}.pp-final-bottom{font-size:clamp(3rem,6vw,5.5rem);font-weight:700}.pp-hint{opacity:.4;margin-top:12px;font-size:.8rem}}#music-toggle{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#f5f1ea;cursor:pointer;opacity:.4;z-index:999;background:#ffffff14;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-size:18px;transition:all .3s;display:flex;position:fixed;bottom:20px;right:20px}#music-toggle:hover{opacity:1}#music-toggle.active{opacity:1;animation:2.5s ease-in-out infinite pulseMusic;box-shadow:0 0 12px #ffffff40}@keyframes pulseMusic{0%,to{box-shadow:0 0 8px #ffffff26}50%{box-shadow:0 0 16px #ffffff59}}
