@import "https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600&family=Playfair+Display:ital,wght@0,600;1,600&display=swap";*{box-sizing:border-box}html,body,#experience{width:100%;height:100%;margin:0;overflow:hidden}body{color:#f4f0e6;background:#101917;font-family:DM Sans,sans-serif}canvas{width:100%;height:100%;image-rendering:pixelated;filter:brightness(.7)saturate(.78)sepia(.3)contrast(1.12);display:block}#atmosphere-filter{z-index:25000;pointer-events:none;opacity:.58;background-blend-mode:overlay;mix-blend-mode:hard-light;background-color:#0000005c;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.3' numOctaves='5' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E"),repeating-linear-gradient(0deg,#ffffff14 0 1px,#0000 1px 3px);background-size:120px 120px,100% 3px;animation:.14s steps(2,end) infinite tv-static;position:fixed;inset:0}@keyframes tv-static{0%{background-position:0 0,0 0}25%{background-position:31px -18px,0 1px}50%{background-position:-22px 27px,0 -1px}75%{background-position:16px 41px,0 2px}to{background-position:-37px -29px,0 0}}.panel{z-index:2;text-align:center;background:radial-gradient(circle at 50% 35%,#28483966,#0000 45%),#101917;place-content:center;justify-items:center;gap:16px;padding:24px;transition:opacity .45s,visibility .45s;display:grid;position:fixed;inset:0}.panel h1{letter-spacing:-.04em;max-width:620px;margin:0;font:600 clamp(2.6rem,7vw,5.5rem)/.98 Playfair Display,serif}.panel p{color:#c5cec5;max-width:510px;margin:0;font-size:1rem;line-height:1.65}.eyebrow{letter-spacing:.2em;font:500 .72rem/1 DM Mono,monospace;color:#c9d592!important}.progress{background:#ffffff29;width:min(320px,75vw);height:2px;margin-top:8px;overflow:hidden}.progress i{background:#c9d592;width:0;height:100%;transition:width .2s;display:block}.hidden{opacity:0;visibility:hidden;pointer-events:none}#start{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#09110d7a}.instructions{margin-top:7px!important}kbd{color:#edf1df;border:1px solid #e8f0d659;border-bottom-width:2px;border-radius:4px;min-width:1.55em;margin:0 .1em;padding:.14em .35em;font:.75em DM Mono,monospace;display:inline-grid}button{color:#172118;cursor:pointer;letter-spacing:.07em;text-transform:uppercase;background:#c9d592;border:1px solid #c9d592;border-radius:0;margin-top:12px;padding:14px 21px;font:600 .8rem DM Mono,monospace;transition:transform .2s,background .2s}button:hover{background:#e1e8b7;transform:translateY(-2px)}#hud{z-index:1;pointer-events:none;transition:opacity .25s;position:fixed;inset:0}.brand-mark{width:92px;height:auto;position:absolute;top:24px;left:28px}#exit-button{color:#fff;pointer-events:auto;background:#0f19148c;border-color:#ffffff59;margin:0;padding:10px 13px;font-size:.68rem;position:absolute;top:13px;right:18px}#exit-button span{color:#c9d592}.crosshair,.crosshair:after{content:"";background:#ffffffc7;width:11px;height:1px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.crosshair:after{transform:translate(-50%,-50%)rotate(90deg)}.crt{opacity:.14;pointer-events:none;mix-blend-mode:multiply;background:repeating-linear-gradient(0deg,#08110f57 0 1px,#0000 1px 3px);position:absolute;inset:0}@media (width<=600px){.brand-mark{top:17px;left:17px}#exit-button{top:8px;right:8px}}#photo-number{letter-spacing:8px;color:#e8e4d8;z-index:9999;pointer-events:none;text-shadow:0 0 5px #e8e4d8b3,0 0 15px #e8e4d859;background:0 0;padding:20px;font-family:Courier New,monospace;font-size:110px;font-weight:700;display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}#keypad-screen{z-index:10000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#050505d1;justify-content:center;align-items:center;display:none;position:fixed;inset:0}#keypad-panel{color:#e8e4d8;text-align:center;background:linear-gradient(135deg,#242424,#111);border:2px solid #555;width:280px;padding:28px 26px 24px;font-family:Courier New,monospace;box-shadow:inset 0 0 0 1px #090909,inset 0 0 30px #000c,0 12px 40px #000000e6}#keypad-panel h2{letter-spacing:4px;color:#d8d5ca;text-shadow:1px 1px 2px #000;margin:0 0 18px;font-family:Courier New,monospace;font-size:18px;font-weight:700}#keypad-display{color:#e8e4d8;letter-spacing:6px;background:#080808;border:1px solid #555;justify-content:center;align-items:center;height:42px;margin-bottom:18px;font-family:Courier New,monospace;font-size:24px;display:flex;box-shadow:inset 0 0 12px #000000e6}#keypad-buttons{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}#keypad-buttons button{color:#e8e4d8;cursor:pointer;background:linear-gradient(145deg,#3a3a3a,#191919);border:1px solid #555;border-radius:2px;height:52px;font-family:Courier New,monospace;font-size:20px;font-weight:700;transition:transform 50ms,background 50ms;box-shadow:inset 0 1px #ffffff14,inset 0 -2px 4px #000c,0 2px 3px #000c}#keypad-buttons button:hover{background:linear-gradient(145deg,#444,#202020)}#keypad-buttons button:active{background:linear-gradient(145deg,#151515,#303030);transform:translateY(2px);box-shadow:inset 0 2px 5px #000000e6}#keypad-back{color:#d8d5ca;letter-spacing:3px;cursor:pointer;background:#151515;border:1px solid #555;border-radius:1px;margin-top:18px;padding:9px 24px;font-family:Courier New,monospace;font-size:12px}#keypad-message{color:#d8d5ca;letter-spacing:2px;min-height:24px;margin-top:14px;font-family:Courier New,monospace;font-size:13px}#keypad-back:hover{background:#292929}#intro-screen{z-index:20000;pointer-events:auto;background:#000;justify-content:center;align-items:center;display:flex;position:fixed;inset:0;overflow:hidden}#intro-gif{object-fit:contain;width:100%;height:100%;position:absolute}#enter-button{color:#c9d592;cursor:pointer;z-index:20001;background:#000c;border:1px solid #c9d592;padding:14px 40px;font-family:DM Mono,monospace;font-size:18px;position:absolute;bottom:40px;left:50%;transform:translate(-50%)}#enter-button:hover{color:#101917;background:#c9d592}#loading-screen{z-index:26000;color:#c9d592;letter-spacing:.16em;background:#000;place-items:center;font:500 clamp(1rem,4vw,1.4rem) DM Mono,monospace;display:none;position:fixed;inset:0}.loading-content{text-align:center}.loading-movement-hint{letter-spacing:.12em;margin:1rem 0 0;font-size:.62em}.keyboard-keys{vertical-align:middle;grid-template-columns:repeat(3,1.8em);gap:.35em;margin:0 .35em;display:inline-grid}.keyboard-keys .key-w{grid-area:1/2}.keyboard-keys .key-a{grid-area:2/1}.keyboard-keys .key-s{grid-area:2/2}.keyboard-keys .key-d{grid-area:2/3}.keyboard-keys kbd{color:#e1e8b7;min-width:1.8em;height:1.8em;font:inherit;letter-spacing:0;background:#c9d59214;border:1px solid #c9d592cc;border-bottom-width:3px;border-radius:2px;place-items:center;margin:0;padding:0;display:inline-grid}#loading-screen.visible{display:grid}.loading-label:after{content:"";text-align:left;width:1.7em;animation:1.1s step-end infinite loading-ellipsis;display:inline-block}@keyframes loading-ellipsis{0%,20%{content:""}40%{content:"."}60%{content:".."}80%,to{content:"..."}}#mobile-controls{z-index:5000;pointer-events:none;display:none;position:fixed;inset:0}#joystick{pointer-events:auto;touch-action:none;background:#00000040;border:2px solid #ffffff59;border-radius:50%;width:110px;height:110px;position:absolute;bottom:30px;left:25px}#joystick-knob{background:#ffffff73;border-radius:50%;width:45px;height:45px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#look-area{display:none}@media (width<=768px){#mobile-controls{display:block}#look-area{pointer-events:auto;touch-action:none;width:55%;height:100%;display:block;position:absolute;top:0;right:0}}#photo-phrase{color:#d8d8d8;text-align:center;z-index:9999;pointer-events:none;text-shadow:2px 2px 3px #000000e6,-1px -1px 2px #0009;background:0 0;width:90%;max-width:1000px;padding:20px;font-family:Georgia,serif;font-size:32px;line-height:1.5;display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}#wrong-pin-flash{opacity:0;pointer-events:none;z-index:30000;background:#96000073;position:fixed;inset:0}#wrong-pin-flash.flash{animation:.35s ease-out wrongPinFlash}#access-granted-flash,#pixel-transition,#ending-screen{position:fixed;inset:0}#access-granted-flash{z-index:30001;opacity:0;pointer-events:none;background:#65ff91}#access-granted-flash.flash{animation:2s ease-out accessGrantedFlash}@keyframes accessGrantedFlash{0%,78%{opacity:.78}to{opacity:0}}#pixel-transition{z-index:30002;visibility:hidden;pointer-events:none;grid-template-rows:repeat(16,1fr);grid-template-columns:repeat(24,1fr);display:grid}#pixel-transition.active{visibility:visible}.ending-pixel{opacity:0;background:#000}#pixel-transition.active .ending-pixel{animation:.45s steps(2,end) forwards pixelFadeIn;animation-delay:var(--pixel-delay)}@keyframes pixelFadeIn{to{opacity:1}}#ending-screen{z-index:30003;visibility:hidden;opacity:0;color:#eef6e6;background:#000;place-items:center;padding:28px;transition:opacity .2s;display:grid}#ending-screen.visible{visibility:visible;opacity:1}.ending-content{width:min(100%,720px)}#ending-message{letter-spacing:.025em;min-height:2.2em;margin:0 0 28px;font:500 clamp(1.15rem,3vw,1.85rem)/1.45 DM Mono,monospace}.ending-cursor{color:#8effa4;margin-left:.12em;animation:.8s step-end infinite cursorBlink;display:inline-block}@keyframes cursorBlink{50%{opacity:0}}#ending-video{width:min(100%,560px);animation:.45s ease-out both endingVideoIn}.unlock-panel{background:#0c120dd1;border:1px solid #8effa46b;width:min(100%,430px);padding:24px;animation:.35s ease-out both endingVideoIn}.unlock-panel h2{letter-spacing:.09em;margin:0;font:500 clamp(1rem,3vw,1.3rem)/1.2 DM Mono,monospace}.unlock-panel p{color:#c7d6c6;margin:12px 0 18px}.unlock-panel form{gap:10px;display:flex}.unlock-panel input{color:#eef6e6;background:#050705;border:1px solid #eef6e673;border-radius:0;flex:1;min-width:0;padding:12px;font:400 .9rem DM Mono,monospace}.unlock-panel button{margin:0;padding:12px 16px}@media (width<=480px){.unlock-panel form{flex-direction:column}}#ending-video iframe{aspect-ratio:16/9;border:1px solid #8effa473;width:100%;display:block}@keyframes endingVideoIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes wrongPinFlash{0%{opacity:0}25%{opacity:1}to{opacity:0}}#keypad-panel.shake{animation:.35s keypadShake}@keyframes keypadShake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}
