LOADING THE 3:05 BELL…
Bus
#1 · 04
Spaces left: —
Status
—
Waiting at the bay
— waiting
LMB / SPACE — SHOVE RMB / CTRL — BRACE SHIFT — RUN F — COOK
E — SIT DOWN
#keys span.ready { background:rgba(255,60,60,.22); border-color:#ff6b5a; color:#ffb3a8; font-weight:700; } #keys span.spent { opacity:.38; } #cross { position:absolute; top:50%; left:50%; width:4px; height:4px; margin:-2px 0 0 -2px; border-radius:50%; background:rgba(255,255,255,.75); box-shadow:0 0 4px rgba(0,0,0,.9); transition:width .12s, height .12s, margin .12s, background .12s, border-color .12s, box-shadow .12s; border:0 solid transparent; box-sizing:border-box; } #cross.near { width:16px; height:16px; margin:-8px 0 0 -8px; background:transparent; border-width:2px; border-color:rgba(255,255,255,.65); } #cross.tap { width:34px; height:34px; margin:-17px 0 0 -17px; background:rgba(255,210,63,.16); border-width:3px; border-color:#ffd23f; box-shadow:0 0 16px rgba(255,210,63,.75), inset 0 0 10px rgba(255,210,63,.4); } #tapHint { position:absolute; top:50%; left:50%; transform:translate(-50%,26px); z-index:13; font-size:14px; font-weight:900; letter-spacing:2.4px; color:#ffd23f; white-space:nowrap; text-shadow:0 2px 10px rgba(0,0,0,.95); opacity:0; transition:opacity .12s; pointer-events:none; } #tapHint small { display:block; font-size:9px; font-weight:700; letter-spacing:2px; color:#e6eefa; opacity:.75; margin-top:3px; } #tapHint.dim { color:#c3d2e6; } #vig { position:absolute; inset:0; opacity:0; transition:opacity .12s; background:radial-gradient(ellipse at center, rgba(255,0,0,0) 42%, rgba(210,20,20,.55) 100%); } #dirArrow { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-size:13px; font-weight:700; color:#ffd23f; text-shadow:0 2px 8px #000; opacity:0; transition:opacity .2s; } /* ---------- Overlays ---------- */ /* start + results: school colours — green first, red and white after it */ .over { position:fixed; inset:0; z-index:20; display:flex; align-items:center; justify-content:center; background:radial-gradient(ellipse at 50% 30%, rgba(14,52,32,.94), rgba(4,10,7,.97)); pointer-events:auto; } .card { width:min(760px,92vw); max-height:92vh; overflow:auto; background:rgba(8,18,12,.90); border:1px solid rgba(46,160,90,.42); border-radius:18px; padding:22px 26px; box-shadow:0 30px 90px rgba(0,0,0,.65), inset 0 1px 0 rgba(255,255,255,.05); } h1 { font-size:38px; font-weight:900; letter-spacing:-1px; line-height:1; color:#ffffff; } #gameTitle { font-size:clamp(34px,7.2vw,58px); letter-spacing:-2px; text-transform:none; } h1 em { font-style:normal; color:#2fae63; } .tag { color:#9fd8b6; font-size:13px; letter-spacing:3.4px; text-transform:uppercase; margin-bottom:8px; } .blurb { color:#e6f2ea; font-size:14px; line-height:1.55; margin:11px 0 14px; } .grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(178px,1fr)); gap:8px; margin-bottom:16px; } .cell { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.09); border-radius:11px; padding:9px 11px; } .cell b { display:block; font-size:12px; letter-spacing:1.6px; color:#2fae63; text-transform:uppercase; margin-bottom:4px; } .cell span { font-size:12px; color:#dcebe2; line-height:1.45; } kbd { background:#22304a; border:1px solid #3d5075; border-bottom-width:2px; border-radius:5px; padding:1px 6px; font-family:inherit; font-size:12px; font-weight:700; } button { pointer-events:auto; font:inherit; font-weight:800; font-size:17px; letter-spacing:.4px; padding:12px 30px; border:0; border-radius:11px; cursor:pointer; background:#1f8f4d; color:#ffffff; box-shadow:0 8px 26px rgba(31,143,77,.42); transition:transform .1s, filter .1s; } button:hover { transform:translateY(-2px); filter:brightness(1.07); } button.ghost { background:rgba(255,255,255,.1); color:#fff; box-shadow:none; margin-left:10px; } .hidden { display:none !important; } #resultCard h1 { font-size:38px; } #rTag { color:#e03a2a; } #auraBox { background:linear-gradient(135deg, rgba(47,174,99,.15), rgba(47,174,99,.04)); border:1px solid rgba(47,174,99,.40); border-radius:14px; padding:14px 18px; margin:16px 0 6px; } .auraTop { display:flex; align-items:baseline; justify-content:space-between; } .auraTop span { font-size:12px; letter-spacing:4px; color:#9fd8b6; font-weight:700; } .auraTop b { font-size:46px; font-weight:900; color:#ffffff; line-height:1; text-shadow:0 4px 22px rgba(47,174,99,.45); } #auraList { margin-top:9px; border-top:1px solid rgba(255,255,255,.10); padding-top:8px; } .auraRow { display:flex; justify-content:space-between; font-size:13px; color:#e6f2ea; padding:2px 0; } .auraRow i { font-style:normal; color:#a9c6b6; } .auraRow b { color:#3ddc84; font-weight:700; } .auraRow.mult b { color:#ffffff; } .auraRow.none i, .auraRow.none b { color:#5f7a6b; } .stats { display:flex; gap:22px; flex-wrap:wrap; margin:14px 0 18px; } .stat b { display:block; font-size:30px; font-weight:900; color:#2fae63; } .stat span { font-size:11px; letter-spacing:2px; text-transform:uppercase; color:#9fd8b6; } .foot { margin-top:14px; font-size:12px; color:#7fa08c; } #hallHud { position:fixed; top:14px; left:14px; z-index:12; min-width:210px; } #hallCapWrap { position:fixed; left:50%; bottom:96px; transform:translateX(-50%); z-index:12; width:min(760px,88vw); text-align:center; pointer-events:none; } #hallCapWrap.hi { bottom:auto; top:92px; } #hallWho { font-size:11px; letter-spacing:3.4px; color:#ffd23f; text-transform:uppercase; margin-bottom:5px; text-shadow:0 2px 8px #000; } #hallCap { font-size:24px; font-weight:700; color:#fff; line-height:1.35; text-shadow:0 3px 16px rgba(0,0,0,.95); } #hallSit { position:fixed; left:50%; top:58%; transform:translateX(-50%); z-index:12; opacity:0; transition:opacity .12s; font-size:14px; font-weight:800; letter-spacing:2px; color:#10151f; background:#ffd23f; padding:7px 16px; border-radius:8px; pointer-events:none; } #hallHint { position:fixed; left:50%; top:34%; transform:translateX(-50%); z-index:13; text-align:center; background:rgba(8,14,26,.82); border:1px solid rgba(255,210,63,.4); border-radius:14px; padding:18px 30px; box-shadow:0 20px 60px rgba(0,0,0,.6); pointer-events:none; } #hallHint b { display:block; font-size:26px; font-weight:900; color:#ffd23f; margin-bottom:8px; } #hallHint div { font-size:16px; color:#e6eefa; } #hallHint small { display:block; margin-top:9px; font-size:11px; color:#8fa3c0; letter-spacing:1.4px; } #phoneCard { position:fixed; left:50%; top:30%; transform:translateX(-50%); z-index:13; text-align:center; background:rgba(8,14,26,.86); border:1px solid rgba(255,90,74,.55); border-radius:14px; padding:16px 28px; box-shadow:0 20px 60px rgba(0,0,0,.65); pointer-events:none; animation:jumpPunch .18s ease-out; } #phoneCard b { display:block; font-size:26px; font-weight:900; color:#ff8a7a; margin-bottom:6px; } #phoneCard div { font-size:17px; color:#e6eefa; } #clapWrap { position:fixed; left:50%; bottom:64px; transform:translateX(-50%); z-index:12; width:min(320px,60vw); height:9px; border-radius:6px; background:rgba(8,14,26,.7); border:1px solid rgba(255,255,255,.18); overflow:hidden; } #clapFill { display:block; height:100%; width:0%; background:linear-gradient(90deg,#ffd23f,#ff8a3d); transition:width .05s; } #drowse { position:fixed; inset:0; z-index:11; opacity:0; pointer-events:none; transition:opacity .12s; background:radial-gradient(ellipse at center, rgba(0,0,0,0) 3%, rgba(0,0,0,1) 66%); } #jumpFx { position:fixed; inset:0; z-index:14; pointer-events:none; opacity:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; padding-top:16vh; text-align:center; background:radial-gradient(ellipse at center, rgba(180,0,0,.10) 20%, rgba(150,0,0,.72) 100%); } #jumpBig { font-size:82px; font-weight:900; letter-spacing:-2px; color:#fff; text-shadow:0 0 26px rgba(255,40,40,.95), 0 6px 26px rgba(0,0,0,.9); animation:jumpPunch .22s ease-out; } #jumpWhy { margin-top:6px; font-size:19px; font-weight:700; color:#ffd7d0; text-shadow:0 3px 14px rgba(0,0,0,.9); } @keyframes jumpPunch { from { transform:scale(2.3); opacity:0; } to { transform:scale(1); opacity:1; } } #fade { position:fixed; inset:0; background:#05070c; opacity:0; pointer-events:none; transition:opacity .34s ease; z-index:25; } #detOver { position:fixed; left:50%; top:26px; transform:translateX(-50%); z-index:12; pointer-events:none; text-align:center; } #detCard { background:rgba(8,14,26,.72); border:1px solid rgba(255,255,255,.16); border-radius:14px; padding:14px 26px; backdrop-filter:blur(8px); box-shadow:0 18px 50px rgba(0,0,0,.5); } .detTag { font-size:10px; letter-spacing:3px; text-transform:uppercase; color:#8fa3c0; } .detTitle { font-size:34px; font-weight:900; letter-spacing:2px; color:#ff5a4a; line-height:1.1; } .detSub { font-size:12px; color:#c3d2e6; margin-top:2px; } .detClock { font-size:52px; font-weight:900; color:#ffd23f; line-height:1.05; margin-top:6px; } .detClock em { font-style:normal; font-size:20px; color:#8fa3c0; margin-left:3px; } .detFoot { font-size:11px; color:#6f829c; margin-top:4px; letter-spacing:.4px; } #lunchStock { position:fixed; right:18px; top:104px; z-index:12; pointer-events:none; background:rgba(8,14,26,.72); border:1px solid rgba(255,255,255,.14); border-radius:12px; padding:12px 14px 10px; backdrop-filter:blur(8px); min-width:212px; } #lunchStock .lsTag { font-size:9px; letter-spacing:3px; text-transform:uppercase; color:#8fa3c0; margin-bottom:7px; } .lsRow { display:flex; align-items:center; gap:8px; margin-bottom:6px; } .lsRow i { font-style:normal; font-size:12px; color:#e6eefa; flex:1; white-space:nowrap; } .lsRow b { font-size:13px; font-weight:900; color:#ffd23f; min-width:20px; text-align:right; } .lsRow .lsBar { width:56px; height:5px; border-radius:4px; background:rgba(255,255,255,.13); overflow:hidden; } .lsRow .lsBar u { display:block; height:100%; background:#ffd23f; } .lsRow.out i { color:#6b7a8f; text-decoration:line-through; } .lsRow.out b { color:#ff5a4a; } .lsRow.out .lsBar u { background:#ff5a4a; } .lsRow.gold b, .lsRow.gold .lsBar u { color:#ff9f1c; background:#ff9f1c; } .lsRow.gold b { background:none; } #lunchCard { position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); z-index:16; text-align:center; background:rgba(10,16,28,.9); border:1px solid rgba(255,210,63,.45); border-radius:18px; padding:16px 22px 18px; box-shadow:0 26px 80px rgba(0,0,0,.7); pointer-events:none; animation:jumpPunch .26s ease-out; } #lunchCard img { width:290px; border-radius:12px; display:block; } #lunchCard .lcName { font-size:22px; font-weight:900; color:#fff; margin-top:12px; } #lunchCard .lcPrice { font-size:13px; color:#8fa3c0; margin-top:1px; } #lunchCard .lcTag { font-size:19px; font-weight:900; color:#ffd23f; margin-top:8px; } #lunchCard .lcPos { font-size:10px; letter-spacing:2.6px; text-transform:uppercase; color:#8fa3c0; margin-top:8px; } #bigKeys { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:26px 0 24px; } #bigKeys .bk { background:rgba(47,174,99,.10); border:1px solid rgba(47,174,99,.38); border-radius:14px; padding:16px 10px 13px; text-align:center; } #bigKeys .bk b { display:block; font-size:29px; font-weight:900; letter-spacing:1px; color:#3ddc84; line-height:1.05; white-space:nowrap; text-shadow:0 3px 14px rgba(0,0,0,.7); } #bigKeys .bk span { display:block; margin-top:7px; font-size:13px; font-weight:800; letter-spacing:2.2px; color:#ffffff; text-transform:uppercase; } @media (max-width:900px){ #bigKeys { grid-template-columns:repeat(2,1fr); } #bigKeys .bk b { font-size:24px; } } /* the two assembly keys — a third of the screen, no panel behind them */ #keyCue { position:fixed; left:50%; bottom:25%; transform:translateX(-50%); z-index:13; width:33vw; min-width:300px; display:flex; flex-direction:column; gap:10px; pointer-events:none; } #keyCue .kcRow { display:flex; gap:14px; } #keyCue .kcTitle { text-align:center; font-size:22px; font-weight:900; letter-spacing:8px; color:#ff3b2f; text-shadow:0 0 18px rgba(255,59,47,.65), 0 2px 12px rgba(0,0,0,.95); } #keyCue.low { bottom:7.5%; } /* clear of the stamina bar */ /* the exam paper needs the middle of the screen, so the keys go down the side */ #keyCue.side { left:16px; bottom:16px; transform:none; width:auto !important; min-width:0; gap:6px; } #keyCue.side .kcRow { gap:8px; } #keyCue.side .kcTitle { font-size:12px; letter-spacing:4px; text-align:left; } #keyCue.side .kc { width:58px; padding:6px 4px 5px; } #keyCue.side .kc b { font-size:22px; } #keyCue.side .kc span { font-size:9px; letter-spacing:1px; } #keyCue.low .kc { padding:9px 6px 8px; } #keyCue.low .kc b { font-size:27px; } #keyCue.low .kc span { font-size:11px; letter-spacing:2px; } #keys { display:none; } #hallHud, #hudLeft, #hudRight { display:none !important; } #sceneTitle { position:fixed; top:22px; left:50%; transform:translateX(-50%); z-index:12; pointer-events:none; color:#fff; font-size:34px; font-weight:900; letter-spacing:3px; text-shadow:0 2px 18px rgba(0,0,0,.85), 0 0 42px rgba(0,0,0,.6); white-space:nowrap; } #keyCue .kc { flex:1; text-align:center; border-radius:16px; padding:14px 6px 12px; background:rgba(12,18,30,.34); border:2px solid rgba(255,255,255,.34); box-shadow:0 10px 34px rgba(0,0,0,.45); } #keyCue .kc b { display:block; font-size:46px; font-weight:900; line-height:1; color:#ffd23f; text-shadow:0 3px 16px rgba(0,0,0,.9); } #keyCue .kc span { display:block; margin-top:6px; font-size:15px; font-weight:900; letter-spacing:3px; color:#fff; text-transform:uppercase; text-shadow:0 2px 10px rgba(0,0,0,.9); } #sleepCue { position:fixed; left:50%; top:15%; transform:translateX(-50%); z-index:13; text-align:center; pointer-events:none; } #sleepCue b { display:block; font-size:40px; font-weight:900; letter-spacing:5px; color:#ffd23f; text-shadow:0 0 24px rgba(0,0,0,.95), 0 4px 18px rgba(0,0,0,.95); } #sleepCue span { display:block; margin-top:6px; font-size:15px; font-weight:800; letter-spacing:1.6px; color:#fff; text-shadow:0 2px 12px rgba(0,0,0,.95); } #cookedOver { position:fixed; inset:0; z-index:42; display:flex; align-items:center; justify-content:center; pointer-events:none; background:rgba(0,0,0,.28); } #cookedOver span { font-size:clamp(56px,15vw,190px); font-weight:900; letter-spacing:14px; color:#e2231a; text-shadow:0 0 40px rgba(226,35,26,.55), 0 6px 26px rgba(0,0,0,.9); animation:cookedIn .5s ease-out; } @keyframes cookedIn { from { transform:scale(2.2); opacity:0 } to { transform:scale(1); opacity:1 } } #tieOver { position:fixed; left:50%; top:27%; transform:translateX(-50%); z-index:42; text-align:center; pointer-events:none; } #tieOver b { display:block; font-size:clamp(30px,6vw,62px); font-weight:900; letter-spacing:6px; color:#ffd23f; text-shadow:0 0 34px rgba(255,210,63,.6), 0 4px 20px rgba(0,0,0,.9); } #tieOver span { display:block; margin-top:8px; font-size:14px; letter-spacing:3px; font-weight:700; color:#eaf3ec; text-shadow:0 2px 10px #000; } #mobileOver { z-index:60; background:radial-gradient(ellipse at 50% 34%, #0d2b1c, #040a07 70%); } #mobileOver .card { max-width:min(560px,92vw); background:rgba(6,16,10,.98); } #mobileOver h1 { font-size:clamp(30px,9vw,52px); margin-bottom:14px; } #mobText { font-size:clamp(15px,4.2vw,19px); line-height:1.55; color:#dfe9e2; } #mobText b { color:#2fae63; font-weight:900; letter-spacing:1px; } #mobFoot { margin-top:18px; font-size:clamp(12px,3.4vw,15px); font-weight:700; letter-spacing:1px; color:#e2504f; } #ridePrompt { position:fixed; left:50%; bottom:12%; transform:translateX(-50%); z-index:14; text-align:center; pointer-events:none; background:rgba(8,14,26,.66); border:1px solid rgba(255,210,63,.45); border-radius:18px; padding:16px 34px 18px; backdrop-filter:blur(8px); box-shadow:0 18px 54px rgba(0,0,0,.6); } #ridePrompt b { display:inline-block; font-size:34px; font-weight:900; color:#0b1018; background:#ffd23f; border-radius:11px; min-width:56px; padding:4px 14px; line-height:1.25; box-shadow:0 5px 18px rgba(255,210,63,.45); } #ridePrompt .rpTitle { margin-top:11px; font-size:20px; font-weight:900; letter-spacing:2.6px; color:#fff; } #ridePrompt .rpSub { margin-top:5px; font-size:12px; font-weight:700; letter-spacing:1.4px; color:#a9bcd6; } #auraList { max-height:min(44vh, 400px); overflow-y:auto; } .auraRow u { display:inline-block; min-width:52px; text-align:right; font-style:normal; text-decoration:none; font-size:12px; font-weight:800; color:#ffffff; margin-left:10px; } .auraRow.bad b { color:#e03a2a; } .auraRow em { font-style:normal; color:#9fd8b6; font-size:11px; font-weight:800; } #gradeRow { display:flex; align-items:center; justify-content:space-between; margin-top:12px; padding-top:12px; border-top:1px solid rgba(255,255,255,.14); } #gradeRow span { font-size:10px; letter-spacing:3px; color:#9fd8b6; } .grade { font-size:30px; font-weight:900; letter-spacing:1px; } h1.grade { font-size:52px; letter-spacing:-0.5px; margin-bottom:2px; } .grade.gNot { color:#e03a2a; } .grade.gAch { color:#ffffff; } .grade.gMer { color:#8fe0ac; } .grade.gExc { color:#3ddc84; } .grade.gSch { color:#2fae63; text-shadow:0 0 26px rgba(61,220,132,.85); } #loadNote { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; background:#0a0f18; color:#8fa3c0; font-size:15px; letter-spacing:2px; z-index:30; }
LOADING THE 3:05 BELL…
Bus
#1 · 04
Spaces left: —
Status
—
Waiting at the bay
— waiting
LMB / SPACE — SHOVE RMB / CTRL — BRACE SHIFT — RUN F — COOK
E — SIT DOWN