@font-face{font-family:MiSans;src:url('assets/MiSans-Regular.woff2')}@font-face{font-family:MiSans;src:url('assets/MiSans-Bold.woff2');font-weight:700}
:root{color-scheme:dark;--ease:cubic-bezier(.2,.75,.2,1);font-family:MiSans,sans-serif;color:#fff;background:#080e19}*{box-sizing:border-box}body{margin:0;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;padding:0;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid white;outline-offset:7px}button:disabled{opacity:.3;cursor:default}button:active:not(:disabled){filter:brightness(.85)}[hidden]{display:none!important}h1,p{margin:0}#stage{position:absolute;width:1672px;height:941px;overflow:hidden;isolation:isolate;transform-origin:top left;background:#162e51}#scene,#shade{position:absolute;inset:0;z-index:-2}#scene img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}#shade{z-index:-1;background:linear-gradient(90deg,rgba(4,14,35,.28),transparent 59%);pointer-events:none}#stage[data-role=opc] #shade,#stage[data-role=operator] #shade{background:linear-gradient(90deg,rgba(5,15,35,.12),transparent 50%)}header{position:absolute;left:75px;right:60px;top:30px;height:42px;display:flex;align-items:center;gap:38px;z-index:8}#brand{font-size:30px;font-weight:700;letter-spacing:-1px}header i{height:24px;width:1px;background:#abbdd078}nav{display:flex;align-items:center;gap:55px;font-size:24px;color:#d4ddeb}nav button.current{color:#fff;position:relative}nav button.current:after{content:'';position:absolute;bottom:-10px;left:0;width:44px;height:3px;background:white;border-radius:2px}#settings{margin-left:auto;font-size:19px;border:1px solid #ffffff50;border-radius:50%;height:31px;width:31px;opacity:0;transition:opacity .2s}header:hover #settings,#settings:focus-visible{opacity:.9}#home,#support{position:absolute;inset:0}
#roles{position:absolute;left:75px;top:132px;display:flex;gap:15px;align-items:start} .role-card{width:130px;text-align:center;position:relative;transition:transform 340ms var(--ease);transform-origin:top center}.role-cover{height:132px;width:130px;display:block;position:relative;border-radius:7px;overflow:hidden;box-shadow:0 0 0 1px #ffffff45;transition:transform 340ms var(--ease),box-shadow 340ms var(--ease)}.role-cover img{position:absolute;max-width:none;pointer-events:none}.role-card.selected .role-cover{transform:scale(1.12);box-shadow:0 0 0 2px #fff,0 0 0 5px #ffffff38,0 0 24px #c5dcff60}.role-card.selected{margin-right:8px}.role-card span.label{display:block;margin-top:14px;white-space:nowrap;font-size:23px}.role-card.selected .label{transform:translateY(5px)}.role-card:focus{outline:none}.role-card:focus-visible .role-cover{box-shadow:0 0 0 3px white,0 0 0 7px #ffffff50}
#hero{position:absolute;left:75px;top:365px;width:825px;text-shadow:0 2px 10px #09101b50}#eyebrow{font-size:24px;margin-bottom:18px}#headline{font-size:70px;line-height:1.17;letter-spacing:1px;font-weight:700;white-space:pre-line}#tags{font-size:26px;letter-spacing:5px;margin-top:20px}.pill{background:#fff;color:#111a2d;border-radius:42px;height:61px;padding:0 38px;font-size:23px;font-weight:700;display:inline-flex;gap:32px;align-items:center;justify-content:center;box-shadow:0 0 16px #ffffff20;transition:transform 180ms var(--ease),box-shadow 180ms} .pill:hover,.pill:focus-visible{box-shadow:0 0 0 5px #ffffff25,0 0 35px #ffffff40;transform:scale(1.025)}.pill span{font-size:32px;font-weight:400}#enter{margin-top:36px}
.support-heading{position:absolute;left:75px;top:215px}.support-heading h1{font-size:72px;line-height:1.2;letter-spacing:1px}.support-heading p{font-size:38px;margin-top:8px}.rail-label{position:absolute;left:75px;top:442px;font-size:25px}#rail-window{position:absolute;inset:474px 0 86px 0;overflow:hidden}#rail{display:flex;gap:22px;position:absolute;left:72px;top:18px;transition:transform 340ms var(--ease);align-items:center}.activity{width:306px;height:336px;flex:0 0 auto;position:relative;text-align:left;border-radius:18px;transition:transform 340ms var(--ease),box-shadow 340ms var(--ease);border:1px solid #ffffffa0;box-shadow:0 10px 24px #0003;isolation:isolate}.activity .art{position:absolute;inset:0;overflow:hidden;border-radius:17px;z-index:-1;background:#233b57}.activity .art img{position:absolute;max-width:none}.activity .label{position:absolute;bottom:17px;left:21px;right:16px;font-size:25px;font-weight:700;text-shadow:0 2px 8px #000}.activity:after{content:'';position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#080e19dd);z-index:-1;border-radius:0 0 17px 17px}.activity.selected{transform:scale(1.045);box-shadow:0 0 0 3px #fff,0 0 0 8px #ffffff50,0 12px 32px #09132166;z-index:2}.activity:focus{outline:none}.activity:focus-visible{box-shadow:0 0 0 3px #fff,0 0 0 8px #ffffff50}.activity img.generic{width:100%;height:100%;object-fit:cover;object-position:76% center;filter:brightness(.95)}
#detail{position:absolute;left:75px;top:128px;width:1522px;height:666px;border:1.5px solid #d8eaffbb;border-radius:18px;box-shadow:inset 0 0 45px #b3cfff10;overflow:hidden;background:linear-gradient(90deg,#14274326,transparent 65%)}.circle{position:absolute;right:24px;top:20px;width:52px;height:52px;border-radius:50%;border:1px solid #ffffff40;background:#ffffff0c;font-size:42px;font-weight:400;line-height:1;z-index:5}.circle:hover{background:#ffffff20}.detail-copy{position:absolute;left:62px;top:80px;width:650px}.detail-copy #status{border:1px solid #adc3ea66;border-radius:30px;padding:8px 24px;font-size:19px;display:inline-block;background:#4c6a9940}.detail-copy #detail-name{margin-top:45px;font-size:23px;letter-spacing:2px}.detail-copy h1{font-size:70px;line-height:1.19;white-space:pre-line;margin-top:18px;letter-spacing:1px}.detail-copy #detail-tags{font-size:25px;margin-top:22px;letter-spacing:3px;max-width:650px}.detail-copy .pill{margin-top:48px;height:70px}.gateway .detail-copy h1{font-size:76px}.gateway .detail-copy{width:690px}
#story{position:absolute;left:75px;top:128px;width:1522px;height:666px;border:1px solid #c3d9fba0;border-radius:18px;overflow:hidden;background:#13253bed;box-shadow:0 25px 80px #0006}.story-copy{position:relative;z-index:2;width:990px;padding:50px 60px}#story-kicker{font-size:20px;color:#c1d2ee;margin-bottom:15px}#story-title{font-size:51px;line-height:1.22}#story-body{font-size:25px;line-height:1.6;margin-top:23px;max-width:820px}#steps{display:flex;margin-top:33px;gap:22px}#steps div{flex:1;padding:15px 0;border-top:1px solid #adc4df50;font-size:24px}#steps em{display:block;font-style:normal;color:#a3b9d6;font-size:16px;margin-bottom:10px}#outcome{font-size:24px;margin-top:20px;color:#d6e6fe}#boundary{font-size:18px;line-height:1.5;color:#c3cddd;margin-top:15px;max-width:800px}#story-back{margin-top:25px;height:54px;font-size:21px}#story-art{position:absolute;inset:0 0 0 55%;background-size:auto 100%;background-position:78% center;mask-image:linear-gradient(90deg,transparent,#000 50%);opacity:.7}.task-switch{display:flex;gap:10px;margin-top:20px}.task-switch button{border:1px solid #99b7e260;border-radius:25px;padding:10px 20px;font-size:21px}.task-switch button.selected{background:#fff;color:#14243c}.task-result{margin-top:19px;padding:15px 0;font-size:24px;color:#d4e7ff}#story.gateway-story .story-copy{padding-top:38px}#story.gateway-story #story-body{font-size:23px}#story.gateway-story #steps{margin-top:15px}#story.gateway-story #boundary{margin-top:10px}
footer{position:absolute;left:50px;right:60px;bottom:28px;display:flex;align-items:center;justify-content:space-between;font-size:18px;z-index:10}footer>span{color:#ffffff80;font-size:16px}footer>div{display:flex;align-items:center;gap:15px}footer button{height:32px;display:inline-flex;align-items:center;gap:12px}footer button b{font-size:29px;font-weight:400}footer #prev,footer #next{font-size:29px}footer #confirm{margin-left:22px}footer #back{margin-left:18px}#help{position:absolute;inset:130px 160px;background:#14263bf5;border:1px solid #bdcfeb80;border-radius:24px;z-index:30;padding:65px 70px;box-shadow:0 0 0 2000px #040c1ac4}#help h1{font-size:51px}#help>p{font-size:28px;margin:20px 0;color:#c5d8ee}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin:40px 0 25px}.help-grid b{font-size:28px}.help-grid p{font-size:22px;line-height:1.8}#help #pad-status{font-size:20px}.help-buttons{display:flex;gap:20px;margin:20px 0}#help small{color:#b6c3d6;font-size:17px}.outline{border:1px solid #ffffff80;border-radius:35px;padding:0 26px;font-size:23px}#toast{position:absolute;bottom:95px;left:50%;transform:translateX(-50%);padding:14px 24px;background:#102039ed;border:1px solid #c4d4f26b;border-radius:16px;opacity:0;pointer-events:none;z-index:40;font-size:21px;transition:opacity .2s}#toast.show{opacity:1}.sr-only{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}.flying-card{position:absolute;z-index:20;pointer-events:none;overflow:hidden;border-radius:18px;transform-origin:top left;border:2px solid #fff;background:#1d334f}.flying-card .art{position:absolute;inset:0;overflow:hidden}.flying-card img{position:absolute;max-width:none}.flying-card .label{display:none}
#roles{left:83px}.role-card,.role-cover{width:120px}.role-card.selected,.role-card.selected .role-cover{width:130px}#headline{font-size:66px;line-height:1.22}#tags{margin-top:16px}.pill{padding:0 32px;gap:25px;font-size:22px}.activity:after{inset:220px 0 0;background:linear-gradient(transparent 0%,#101723 57%)}#stage:not([data-level=home]) nav{gap:22px}
#story{background:#13253b}#rail-window{overflow:clip}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}
