*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;background:#09251f;color:#edf9f3;font-family:'Segoe UI',Arial,sans-serif;min-height:100dvh;display:flex;flex-direction:column}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,summary{touch-action:manipulation}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #b4ffcf;outline-offset:5px}[hidden]{display:none!important}.ambient{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1}.halo{position:absolute;border-radius:50%;filter:blur(80px);opacity:.23}.halo-one{width:600px;height:600px;top:-290px;right:-130px;background:#03c38d;animation:drift 18s ease-in-out infinite alternate}.halo-two{width:450px;height:450px;bottom:-260px;left:10%;background:#35da9b;animation:drift 22s ease-in-out infinite alternate-reverse}.grid-lines{position:absolute;inset:0;background-image:linear-gradient(#80efc406 1px,transparent 1px),linear-gradient(90deg,#80efc406 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(120deg,black,transparent 80%)}.floating{position:absolute;color:#85e9ba22;animation:float 9s ease-in-out infinite;font-size:48px}.shape-one{left:5%;top:44%}.shape-two{right:5%;bottom:18%;animation-delay:-3s}.shape-three{left:48%;top:18%;animation-delay:-5s}.access-header,.access-footer{display:flex;align-items:center;justify-content:space-between;padding:28px clamp(24px,6vw,96px);gap:20px}.access-brand{display:flex;align-items:center;gap:12px}.access-brand img{width:46px;height:46px;object-fit:contain}.access-brand>span{font-size:29px;font-weight:750;letter-spacing:-1px}.access-brand small{display:block;font-size:10px;font-weight:400;letter-spacing:1.3px;color:#94b9aa}.header-tag{font-size:11px;color:#b0cebf;border:1px solid #80cdaa26;padding:10px 15px;border-radius:30px;display:flex;align-items:center;gap:9px}.header-tag i{width:6px;height:6px;background:#63e9ac;border-radius:50%;box-shadow:0 0 12px #63e9ac80}main{width:100%;max-width:1440px;margin:auto;padding:30px clamp(24px,6vw,96px)}.welcome-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(40px,8vw,120px);align-items:center}.intro-label,.step-label{font-size:10px;font-weight:650;letter-spacing:2px;color:#a4c5b6}.intro-label{display:flex;align-items:center;gap:10px}.intro-label>span{height:1px;width:28px;background:#61e6ab}h1{font-size:clamp(46px,5.7vw,80px);line-height:1.04;letter-spacing:-3.5px;margin:24px 0;font-weight:750}em{font-style:normal;color:#6bf0b6}.welcome-lead{max-width:400px;font-size:16px;line-height:1.75;color:#a8c2b5}.quest-orbit{position:relative;width:275px;height:180px;margin:26px 0 0 30px}.orbit-ring{position:absolute;width:230px;height:135px;left:0;top:8px;border:1px solid #77efb929;border-radius:50%;transform:rotate(-24deg)}.ring-two{transform:rotate(27deg);width:245px;height:90px;top:35px}.quest-gem{position:absolute;left:74px;top:0;width:105px;filter:drop-shadow(0 20px 28px #02b88430);animation:float 7s ease-in-out infinite}.quest-gem svg{width:100%}.orbit-token{display:grid;place-items:center;position:absolute;width:43px;height:43px;border-radius:14px;background:#17493b;border:1px solid #69e7ac40;color:#93f2c4;box-shadow:0 10px 28px #0002;animation:float 6s ease-in-out infinite}.token-star{top:55px;left:0;font-size:25px;animation-delay:-3s}.token-check{right:16px;top:13px;font-size:20px}.orbit-caption{position:absolute;bottom:0;left:39px;font-size:10px;letter-spacing:1.2px;color:#719f88}.access-choices{background:linear-gradient(145deg,#174335ab,#102e27d9);border:1px solid #7ac59f30;border-radius:32px;padding:clamp(24px,3.1vw,44px);box-shadow:0 25px 80px #02170f55;backdrop-filter:blur(18px)}.choices-heading h2{font-size:28px;letter-spacing:-.9px;margin:14px 0 8px}.choices-heading p{font-size:13px;color:#a5bdae;margin:0 0 30px}.access-choice{display:flex;align-items:center;gap:16px;border-radius:20px;padding:23px 18px;transition:transform .2s,border-color .2s,box-shadow .2s;min-height:100px;margin:14px 0}.access-choice:hover{transform:translateY(-4px);box-shadow:0 10px 28px #0002}.student-choice{background:linear-gradient(115deg,#79f0b6,#37dca0);color:#073b29;border:1px solid #a3ffd0}.staff-choice{background:#123b30;border:1px solid #85caa349}.staff-choice:hover{border-color:#86e8b8}.choice-icon{width:44px;flex:0 0 44px;height:44px;border-radius:13px;background:#063e2810;display:grid;place-items:center}.staff-choice .choice-icon{background:#80edb510;color:#8ff3c0}.choice-icon svg{width:28px;height:28px}.choice-text{flex:1}.choice-text strong{display:block;font-size:18px;letter-spacing:-.4px}.choice-text small{display:block;font-size:11px;margin-top:6px;line-height:1.5;opacity:.8}.choice-arrow{font-size:24px}.access-note{display:flex;align-items:center;justify-content:center;text-align:center;gap:12px;border-top:1px solid #7dae951f;margin-top:26px;padding-top:16px;color:#88ab98}.access-note>span{font-size:24px}.access-note p{font-size:11px;line-height:1.7;margin:0}.access-footer{color:#699480;font-size:10px;letter-spacing:.5px;padding-top:28px;padding-bottom:24px}.scan-card{max-width:510px;margin:0 auto;background:#14372d;border:1px solid #78ac913b;border-radius:30px;padding:30px;box-shadow:0 25px 80px #02170f55}.back-access{display:block;font-size:12px;color:#b0cebf;margin-bottom:26px}.scan-card h1{font-size:36px;letter-spacing:-1.4px;margin:18px 0}.scan-card>p{font-size:13px;color:#acc8b8;line-height:1.6}.camera-frame{position:relative;aspect-ratio:4/3;border-radius:22px;overflow:hidden;background:#061b15;border:1px solid #72dcab55;margin-top:24px}.camera-frame video{width:100%;height:100%;object-fit:cover}#camera-idle{position:absolute;inset:0;display:grid;place-items:center;color:#66dca7}#camera-idle svg{width:100px;height:100px}.scanner-line{position:absolute;left:10%;right:10%;height:2px;background:#7affb9;box-shadow:0 0 14px #77ffd0;animation:scan 2.8s ease-in-out infinite}#scan-status{min-height:40px}.camera-actions{display:flex;gap:10px;flex-wrap:wrap}.access-button,.outline-button{border-radius:13px;min-height:46px;padding:13px 20px;font-weight:650;font-size:13px;cursor:pointer}.access-button{border:0;background:#77edb5;color:#083c29}.outline-button{border:1px solid #669b80;background:transparent;color:#c5efda}.access-button:disabled{opacity:.5;cursor:wait}.privacy-note{font-size:10px!important;color:#81a994!important}.manual-access{border-top:1px solid #759a852e;padding-top:18px;margin-top:20px;font-size:12px}.manual-access summary{cursor:pointer;color:#b6d1c2;min-height:35px}.manual-access label{display:block;margin:16px 0 8px}.manual-access input{display:block;width:100%;padding:12px;background:#0a281e;color:white;border:1px solid #6a9b7e;border-radius:10px;margin-bottom:12px}.upload-qr input{font-size:11px}.access-message{padding:15px;background:#592d2a;color:#ffded7;border:1px solid #a66b5c;border-radius:14px;max-width:650px;margin:0 auto 20px}@keyframes float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-13px) rotate(4deg)}}@keyframes drift{to{transform:translate(-60px,70px) scale(1.12)}}@keyframes scan{0%,100%{top:18%}50%{top:82%}}@media(max-width:850px){.welcome-layout{grid-template-columns:1fr;gap:26px;max-width:570px;margin:auto}.welcome-copy{text-align:center}.intro-label{justify-content:center}h1{font-size:58px}.welcome-lead{margin:auto;max-width:430px}.quest-orbit{display:none}.access-choices{padding:28px}.access-header{padding:22px 26px}.header-tag{font-size:10px}.welcome-layout .access-note{display:none}main{padding-top:16px;padding-bottom:20px}.choices-heading{text-align:center}}@media(max-width:480px){.header-tag{display:none}.access-header{padding:20px 24px}.access-brand>span{font-size:25px}h1{font-size:46px;letter-spacing:-2px}.intro-label{font-size:8px;letter-spacing:1.5px}.welcome-lead{font-size:13px}.access-choices{padding:22px;border-radius:24px}.choices-heading h2{font-size:23px}.access-choice{padding:18px 13px;gap:10px}.choice-text strong{font-size:16px}.access-footer{padding:20px 24px}.access-footer span:last-child{display:none}.scan-card{padding:22px}.scan-card h1{font-size:30px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.access-choice:hover{transform:none}}
