:root{--bg-color: #0a0a0a;--text-color: #f0f0f0;--accent-color: #ffffff;--font-main: "Helvetica Neue", Helvetica, Arial, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-main);overflow:hidden;width:100vw;height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:fixed;top:0;left:0}#root{width:100%;height:100%}.app-container{width:100%;height:100%;position:relative;display:flex;justify-content:center;align-items:center}.intro-screen,.end-screen{text-align:center;z-index:10;background:#000000bf;padding:2rem;border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 8px 32px #0000004d;will-change:opacity,transform;max-width:90%;margin:0 auto}h1{font-weight:100;letter-spacing:.5em;margin-bottom:1rem;font-size:1.5rem;text-transform:uppercase}p{font-weight:300;letter-spacing:.1em;margin-bottom:2rem;color:#888;font-size:.9rem}button{background:transparent;border:1px solid var(--accent-color);color:var(--accent-color);padding:.875rem 2rem;font-family:var(--font-main);font-size:.85rem;letter-spacing:.2em;cursor:pointer;transition:all .35s cubic-bezier(.16,1,.3,1);text-transform:uppercase}button:hover{background:var(--accent-color);color:var(--bg-color);border-color:var(--accent-color)}button:active{transform:scale(.98);transition:transform .1s cubic-bezier(.16,1,.3,1)}.room{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;background-color:#0a0a0a;z-index:1;backface-visibility:hidden;-webkit-backface-visibility:hidden;contain:layout style;transform:translateZ(0);-webkit-transform:translate3d(0,0,0)}.room-background{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat;transform-origin:center center;will-change:auto;opacity:1;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;backface-visibility:hidden;-webkit-backface-visibility:hidden;animation-fill-mode:both;contain:strict;isolation:isolate;transform:translateZ(0);-webkit-transform:translate3d(0,0,0);z-index:0}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle,transparent 45%,rgba(0,0,0,.7) 120%);pointer-events:none;opacity:.5;contain:strict;z-index:1}.room{opacity:1;transition:opacity .5s cubic-bezier(.16,1,.3,1);will-change:auto}.room-enter{animation:roomEnter .6s cubic-bezier(.16,1,.3,1) forwards}.room-enter .room-background{animation:backgroundEnter .6s cubic-bezier(.16,1,.3,1) forwards}.room:not(.room-enter) .room-background{animation:breathe 30s ease-in-out infinite alternate;animation-fill-mode:both}.room-exit{animation:roomExit .3s cubic-bezier(.4,0,.2,1) forwards}.room-exit .room-background{animation:backgroundExit .3s cubic-bezier(.4,0,.2,1) forwards}.room-exit .content-layer{opacity:0;transform:translateY(10px) translateZ(0);transition:opacity .4s cubic-bezier(.4,0,.2,1),transform .4s cubic-bezier(.4,0,.2,1)}@keyframes roomEnter{0%{opacity:0}to{opacity:1}}@keyframes roomExit{0%{opacity:1}to{opacity:0}}@keyframes backgroundEnter{0%{opacity:0;transform:scale(1.02) translateZ(0)}to{opacity:1;transform:scale(1) translateZ(0)}}@keyframes backgroundExit{0%{opacity:1;transform:scale(1) translateZ(0)}to{opacity:0;transform:scale(1.02) translateZ(0)}}@keyframes breathe{0%{transform:scale(1) translateZ(0)}to{transform:scale(1.02) translateZ(0)}}.content-layer{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:5;will-change:opacity;opacity:0;pointer-events:none;transition:opacity .45s cubic-bezier(.16,1,.3,1);contain:layout style;transform:translateZ(0);-webkit-transform:translate3d(0,0,0);isolation:isolate}.content-layer.visible{opacity:1;pointer-events:auto}.content-layer.hidden{opacity:0;pointer-events:none}.question-container{background:#0a0a0aeb;padding:2rem;border:1px solid rgba(255,255,255,.06);max-width:900px;width:90%;text-align:center;box-shadow:0 20px 60px #0006,0 0 0 1px #ffffff05 inset;opacity:0;transform:translateY(15px) translateZ(0);will-change:opacity,transform;transition:opacity .5s cubic-bezier(.16,1,.3,1) .1s,transform .5s cubic-bezier(.16,1,.3,1) .1s;contain:layout style paint;transform-origin:center center;backface-visibility:hidden;-webkit-backface-visibility:hidden;isolation:isolate;position:relative;z-index:10}.content-layer.visible .question-container{opacity:1;transform:translateY(0) translateZ(0)}.question-text{font-size:1.5rem;font-weight:200;margin-bottom:2.5rem;line-height:1.4;letter-spacing:-.01em;opacity:0;transform:translateY(8px);transition:opacity .5s cubic-bezier(.16,1,.3,1) .2s,transform .5s cubic-bezier(.16,1,.3,1) .2s}.content-layer.visible .question-text{opacity:1;transform:translateY(0)}.options-grid{display:grid;grid-template-columns:1fr;gap:1rem;opacity:0;transform:translateY(10px);transition:opacity .5s cubic-bezier(.16,1,.3,1) .3s,transform .5s cubic-bezier(.16,1,.3,1) .3s}.content-layer.visible .options-grid{opacity:1;transform:translateY(0)}.option-btn{width:100%;padding:1.25rem;border:1px solid rgba(255,255,255,.12);background:#ffffff05;color:#e8e8e8;transition:all .35s cubic-bezier(.16,1,.3,1);font-size:.9rem;letter-spacing:.05em;text-transform:uppercase;position:relative;overflow:hidden}.option-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.05),transparent);transition:left .6s cubic-bezier(.16,1,.3,1)}.option-btn:hover:before{left:100%}.option-btn:hover{border-color:#ffffff4d;background:#ffffff14;color:#fff;transform:translateY(-2px);box-shadow:0 8px 24px #0003}.option-btn:active{transform:translateY(0);transition:transform .15s cubic-bezier(.16,1,.3,1)}.fade-in{animation:fadeIn 1.2s cubic-bezier(.16,1,.3,1) forwards}.hidden{opacity:0;pointer-events:none;transition:opacity .4s cubic-bezier(.16,1,.3,1)}@keyframes fadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.door-transition{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;pointer-events:none;overflow:hidden;perspective:2000px;isolation:isolate;contain:layout style;visibility:hidden}.door-transition.door-visible{visibility:visible}.door-transition.door-hidden{visibility:hidden}.door-transition.door-closed{pointer-events:none}.door-left,.door-right{position:absolute;top:0;height:100%;width:50%;background:#0a0a0a;border:1px solid rgba(255,255,255,.03);will-change:transform;display:flex;align-items:center;justify-content:center;transform-style:preserve-3d;transform:translate(0) rotateY(0)}.door-left{left:0;transform-origin:left center;border-right:1px solid rgba(255,255,255,.05);box-shadow:4px 0 20px #00000080,inset -2px 0 10px #0000004d}.door-right{right:0;transform-origin:right center;border-left:1px solid rgba(255,255,255,.05);box-shadow:-4px 0 20px #00000080,inset 2px 0 10px #0000004d}.door-transition.door-closed .door-left,.door-transition.door-closed .door-right{transform:translate(0) rotateY(0)}.door-transition.door-closing .door-left{transform:translate(0) rotateY(0);animation:doorLeftClose .8s cubic-bezier(.16,1,.3,1) forwards}.door-transition.door-closing .door-right{transform:translate(0) rotateY(0);animation:doorRightClose .8s cubic-bezier(.16,1,.3,1) forwards}.door-transition.door-closed-new-room .door-left,.door-transition.door-closed-new-room .door-right{transform:translate(0) rotateY(0);animation:none}.door-transition.door-open .door-left{transform:translate(-100%) rotateY(-90deg)}.door-transition.door-open .door-right{transform:translate(100%) rotateY(90deg)}.door-transition.door-opening .door-left{transform:translate(0) rotateY(0);animation:doorLeftOpen .8s cubic-bezier(.16,1,.3,1) forwards}.door-transition.door-opening .door-right{transform:translate(0) rotateY(0);animation:doorRightOpen .8s cubic-bezier(.16,1,.3,1) forwards}@keyframes doorLeftClose{0%{transform:translate(-100%) rotateY(-90deg)}to{transform:translate(0) rotateY(0)}}@keyframes doorRightClose{0%{transform:translate(100%) rotateY(90deg)}to{transform:translate(0) rotateY(0)}}@keyframes doorLeftOpen{0%{transform:translate(0) rotateY(0)}to{transform:translate(-100%) rotateY(-90deg)}}@keyframes doorRightOpen{0%{transform:translate(0) rotateY(0)}to{transform:translate(100%) rotateY(90deg)}}.next-room-preview{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:center;transform:scale(1);z-index:-1;filter:brightness(.7) contrast(1.1)}.door-transition.door-closed-new-room .next-room-preview{transform:scale(1);filter:brightness(.6) contrast(1.1)}.door-transition.door-opening .next-room-preview{transform:scale(1);filter:brightness(.7) contrast(1.1);transition:filter .7s cubic-bezier(.16,1,.3,1)}.door-transition.door-open .next-room-preview{transform:scale(1);filter:brightness(1) contrast(1)}@keyframes roomPreviewFadeIn{0%{transform:scale(1.02)}to{transform:scale(1)}}.door-handle{width:8px;height:60px;background:linear-gradient(180deg,#ffffff26,#ffffff14,#ffffff26);border-radius:4px;box-shadow:0 0 10px #ffffff1a,inset 0 0 5px #0000004d}.door-handle-left{margin-right:auto;margin-left:80%}.door-handle-right{margin-left:auto;margin-right:80%}.door-transition.walking-through .next-room-preview{transform:scale(1.05);filter:brightness(.9) contrast(1.05);transition:transform .8s cubic-bezier(.4,0,.2,1),filter .8s cubic-bezier(.4,0,.2,1)}.room-preview-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at center,transparent 30%,rgba(0,0,0,.4) 100%);pointer-events:none}@media(min-width:768px){.intro-screen,.end-screen{padding:3rem;max-width:600px}h1{font-size:1.75rem;letter-spacing:.4em}p{font-size:1rem;margin-bottom:2.5rem}button{padding:1rem 2.5rem;font-size:.9rem}.question-container{padding:3rem}.question-text{font-size:1.75rem;margin-bottom:3rem}.options-grid{grid-template-columns:1fr 1fr;gap:1.25rem}.option-btn{padding:1.5rem;font-size:.95rem}}@media(min-width:1024px){.intro-screen,.end-screen{padding:4rem;max-width:700px}h1{font-size:2rem;letter-spacing:.5em}p{font-size:1rem;margin-bottom:3rem}button{padding:1rem 3rem;font-size:.9rem}.question-container{padding:4rem}.question-text{font-size:2rem;margin-bottom:4rem}.options-grid{gap:1.5rem}.option-btn{font-size:1rem}}@media(min-width:1440px){.question-container{max-width:1000px}}@media(max-width:480px){.intro-screen,.end-screen{padding:1.5rem;max-width:95%}h1{font-size:1.25rem;letter-spacing:.3em;margin-bottom:.75rem}p{font-size:.85rem;margin-bottom:1.5rem}button{padding:.75rem 1.5rem;font-size:.8rem;letter-spacing:.15em}.question-container{padding:1.5rem;width:95%}.question-text{font-size:1.25rem;margin-bottom:2rem}.options-grid{gap:.875rem}.option-btn{padding:1rem;font-size:.85rem}}@media(max-width:768px)and (orientation:landscape){.intro-screen,.end-screen{padding:1.5rem 2rem}h1{font-size:1.5rem;margin-bottom:.5rem}p{margin-bottom:1.5rem}.question-container{padding:2rem}.question-text{font-size:1.5rem;margin-bottom:2rem}.options-grid{grid-template-columns:1fr 1fr;gap:1rem}}
