:root{color-scheme:light dark;--bg:#f4f5f2;--surface:#fff;--surface2:#f8f9f6;--ink:#18211e;--muted:#65716c;--line:#dfe5df;--accent:#087e65;--accent-soft:#e3f3ed;--danger:#b6433b;--warning:#9b6916;--shadow:0 8px 28px #1b2a2010;--radius:14px;--focus:#35a98c;font:15px/1.5 system-ui,-apple-system,'Segoe UI',sans-serif} @media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#101715;--surface:#18211e;--surface2:#1e2a26;--ink:#ecf2ef;--muted:#a0ada7;--line:#33413b;--accent:#64c6a9;--accent-soft:#203c33;--danger:#ff8279;--warning:#efc471;--shadow:0 8px 28px #0004;--focus:#7be2c2}} :root[data-theme="dark"]{--bg:#101715;--surface:#18211e;--surface2:#1e2a26;--ink:#ecf2ef;--muted:#a0ada7;--line:#33413b;--accent:#64c6a9;--accent-soft:#203c33;--danger:#ff8279;--warning:#efc471;--shadow:0 8px 28px #0004;--focus:#7be2c2;color-scheme:dark}:root[data-theme="light"]{color-scheme:light} *{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}button,input,select{font:inherit}button{cursor:pointer}.loading{padding:4rem;text-align:center;color:var(--muted)}.shell{min-height:100vh;display:grid;grid-template-columns:230px minmax(0,1fr);max-width:1600px;margin:auto}.sidebar{padding:27px 18px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:26px;background:var(--surface)}.brand{display:flex;align-items:center;gap:12px;padding:0 8px;color:var(--ink);text-decoration:none;font:700 18px 'Space Grotesk',sans-serif}.brandmark{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--accent);color:#fff;font-size:20px}.nav{display:grid;gap:5px}.nav button{border:0;background:transparent;color:var(--muted);text-align:left;padding:11px 12px;border-radius:10px}.nav button:hover,.nav button.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.sidebar-foot{margin-top:auto;display:grid;gap:9px}.theme{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:13px;padding:0 7px}.main{padding:34px clamp(18px,4vw,56px);min-width:0}.topline{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:30px}.eyebrow{color:var(--muted);font-size:13px}.title{font:600 clamp(27px,4vw,34px)/1.2 'Space Grotesk',sans-serif;letter-spacing:-.6px;margin:4px 0}.subtitle{color:var(--muted);margin:7px 0 0}.userchip{border:1px solid var(--line);border-radius:999px;background:var(--surface);padding:8px 13px;color:var(--muted)}.content{display:grid;gap:22px}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.panel,.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.stat{padding:18px 20px}.stat label{display:block;color:var(--muted);font-size:13px}.stat strong{display:block;font:600 27px 'Space Grotesk',sans-serif;margin-top:8px}.panel{padding:20px}.panel h2{font:600 18px 'Space Grotesk',sans-serif;margin:0}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:17px}.muted{color:var(--muted)}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.button{border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);padding:9px 13px;font-weight:600}.button:hover{border-color:var(--accent);color:var(--accent)}.button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.button.danger{color:var(--danger)}.button.small{padding:6px 9px;font-size:13px}.field{display:grid;gap:6px;min-width:0}.field label{font-size:13px;color:var(--muted);font-weight:600}.field input,.field select{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:9px;padding:10px 11px;min-width:0;width:100%}.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.form .wide{grid-column:1/-1}.form-actions{grid-column:1/-1;display:flex;justify-content:flex-end;align-items:center;gap:9px}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;min-width:600px}th{font-size:12px;color:var(--muted);font-weight:600;padding:9px 10px;border-bottom:1px solid var(--line)}td{padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:middle}tr:last-child td{border-bottom:0}.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:99px;background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:600}.badge.gray{background:var(--surface2);color:var(--muted)}.badge.warn{background:#f6edda;color:var(--warning)}.empty{padding:30px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:11px}.empty strong{display:block;color:var(--ink);font-weight:600;margin-bottom:4px}.notice{padding:12px 14px;border-radius:9px;background:var(--accent-soft);color:var(--accent)}.error{padding:11px 13px;border-radius:9px;background:color-mix(in srgb,var(--danger) 12%,transparent);color:var(--danger)}.hidden{display:none!important}.login{min-height:100vh;display:grid;place-items:center;padding:20px}.loginbox{width:min(440px,100%);background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:30px;box-shadow:var(--shadow)}.loginbox .brand{padding:0;margin-bottom:25px}.loginbox h1{font:600 26px 'Space Grotesk',sans-serif;margin:0}.loginbox p{color:var(--muted);margin:7px 0 22px}.toast{position:fixed;right:20px;bottom:20px;background:var(--ink);color:var(--surface);padding:12px 17px;border-radius:10px;box-shadow:var(--shadow);z-index:20}.mobilebar{display:none}dialog{width:min(580px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:16px;padding:22px;box-shadow:var(--shadow)}dialog::backdrop{background:#0008}dialog h2{font:600 20px 'Space Grotesk',sans-serif;margin:0 0 18px} @media(max-width:900px){.shell{grid-template-columns:1fr}.sidebar{position:sticky;top:0;z-index:3;display:block;padding:12px 16px;border-right:0;border-bottom:1px solid var(--line)}.brand{display:inline-flex}.nav{display:flex;overflow:auto;margin-top:10px}.nav button{white-space:nowrap}.sidebar-foot{position:absolute;right:14px;top:13px;margin:0}.sidebar-foot .theme{display:none}.main{padding-top:25px}.stats{grid-template-columns:repeat(2,1fr)}} @media(max-width:600px){.main{padding:20px 14px}.topline{align-items:flex-start}.grid2{grid-template-columns:1fr}.stats{gap:9px}.stat{padding:14px}.stat strong{font-size:23px}.userchip{font-size:12px}.form{grid-template-columns:1fr}.form .wide,.form-actions{grid-column:1}.panel{padding:15px}.panel-head{align-items:flex-start}.button{padding:9px 11px}} button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--focus);outline-offset:2px} @media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}} .booking-box{width:min(900px,100%)}.business-address{color:var(--ink)!important;font-weight:550;margin-bottom:4px!important}.draft-notice{padding:9px 12px;border-left:3px solid var(--warning);background:var(--surface2);font-size:13px}.floorplan-wrap{width:100%;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--surface2)}.floorplan{position:relative;width:100%;min-height:260px;max-height:540px;background-image:linear-gradient(90deg,color-mix(in srgb,var(--line) 28%,transparent) 1px,transparent 1px),linear-gradient(color-mix(in srgb,var(--line) 28%,transparent) 1px,transparent 1px);background-size:5% 5%;border:12px solid var(--line);border-radius:12px}.map-station{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;border:2px solid #287558;border-radius:10px;background:#dff4e8;color:#143d2c;padding:5px;font-size:clamp(11px,2vw,15px);line-height:1.2;overflow:hidden}.map-station span{font-weight:500}.map-station.booked,.station-option.booked{border-color:#727b82;background:#e8ebed;color:#343b40}.map-station.occupied,.station-option.occupied{border-color:#8c4f13;background:#ffedca;color:#5a340a}.map-station.unavailable,.station-option.unavailable{border-color:#9b4444;background:#f7dddd;color:#572222}.map-station.selected,.station-option.selected{outline:4px solid #1766c2;outline-offset:2px;background:#dcebff;color:#102c54;border-color:#185fb0}.station-legend{display:flex;flex-wrap:wrap;gap:8px 16px;margin:12px 0;color:var(--muted);font-size:13px}.station-legend span{display:inline-flex;align-items:center;gap:6px}.legend-swatch{width:14px;height:14px;border:1px solid #287558;border-radius:4px;background:#dff4e8}.legend-swatch.selected{background:#dcebff;border-color:#185fb0}.legend-swatch.booked{background:#e8ebed;border-color:#727b82}.legend-swatch.occupied{background:#ffedca;border-color:#8c4f13}.legend-swatch.unavailable{background:#f7dddd;border-color:#9b4444}.accessible-station-list{border:0;padding:0;margin:12px 0}.accessible-station-list legend{font-weight:600;margin-bottom:8px}.station-list{display:flex;flex-wrap:wrap;gap:8px}.station-option{border:1px solid #287558;border-radius:8px;background:#dff4e8;color:#143d2c;padding:8px 11px}.station-option:disabled,.map-station:disabled{cursor:not-allowed;opacity:.88}.station-option.selected{outline:3px solid #185fb0;outline-offset:1px}.booking-summary{padding:12px;border:1px solid var(--line);border-radius:9px;background:var(--surface);font-size:14px;font-weight:550}.map-position-fields{display:grid;grid-template-columns:repeat(4,minmax(75px,1fr));gap:8px;align-items:end}@media(max-width:600px){.booking-box{padding:18px}.floorplan{min-height:210px;border-width:8px}.map-station{border-radius:7px;padding:2px;font-size:10px}.map-position-fields{grid-template-columns:repeat(2,minmax(85px,1fr))}} /* Virtual Escape gaming lounge visual system */ :root{color-scheme:dark;--bg:#090b12;--surface:#111520;--surface2:#171d2a;--ink:#f4f6ff;--muted:#9ca6bb;--line:#283044;--accent:#b9ff45;--accent-soft:#24331a;--danger:#ff777f;--warning:#ffca6b;--shadow:0 18px 50px #0005;--radius:16px;--focus:#c5ff62;font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif} :root[data-theme="light"]{color-scheme:light;--bg:#f4f5f8;--surface:#fff;--surface2:#f4f5f8;--ink:#171b28;--muted:#626c7e;--line:#dce0e9;--accent:#537d10;--accent-soft:#edf5df;--danger:#b32636;--warning:#98620d;--shadow:0 12px 34px #15203b10;--focus:#537d10} body{background:radial-gradient(ellipse at 70% -10%,#242037 0,transparent 38%),var(--bg);color:var(--ink)} .brand{font-family:ui-sans-serif,system-ui,sans-serif;letter-spacing:.04em}.brandmark{background:linear-gradient(145deg,#d1ff77,#96e321);color:#111520;box-shadow:0 0 24px #b9ff4530;font-weight:800}.sidebar{background:color-mix(in srgb,var(--surface) 94%,transparent);border-color:var(--line)}.nav button{min-height:44px;transition:background .18s ease,color .18s ease,transform .18s ease}.nav button:hover{transform:translateX(2px)}.nav button.active{background:linear-gradient(100deg,var(--accent-soft),transparent);box-shadow:inset 2px 0 var(--accent)}.main{max-width:1500px}.eyebrow{text-transform:uppercase;letter-spacing:.09em;font-size:11px;font-weight:700}.title,.panel h2,.stat strong,.loginbox h1{font-family:ui-sans-serif,system-ui,sans-serif;letter-spacing:-.035em}.title{font-weight:750}.panel,.stat,.loginbox{background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 98%,white 2%),var(--surface));border-color:var(--line);box-shadow:var(--shadow)}.panel{border-radius:16px}.stat{border-radius:15px;position:relative;overflow:hidden}.stat:after{content:"";position:absolute;right:-25px;top:-35px;width:80px;height:80px;border-radius:50%;background:var(--accent);opacity:.05;filter:blur(5px)}.stat strong{color:var(--ink)}.button{min-height:42px;border-radius:10px;transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}.button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 7px 20px #0002}.button:active:not(:disabled){transform:translateY(0) scale(.985)}.button.primary{background:var(--accent);border-color:var(--accent);color:#14190d;font-weight:750}.button.primary:hover{background:#ceff7a;color:#14190d}.field input,.field select,input,select,textarea{accent-color:var(--accent)}.badge{background:var(--accent-soft);color:var(--accent)}.userchip{background:var(--surface2)}.tablewrap{border-radius:10px}th{text-transform:uppercase;letter-spacing:.07em}.toast{border:1px solid var(--line);background:#1b2030;color:#f5f6fb}.login{background:radial-gradient(ellipse at 50% 0,#252239 0,transparent 42%),var(--bg)} /* Public landing page */ .landing-page{--bg:#090b12;--surface:#111520;--surface2:#171d2a;--ink:#f4f6ff;--muted:#9ca6bb;--line:#283044;--accent:#b9ff45;--accent-soft:#24331a;--danger:#ff777f;background:radial-gradient(ellipse at 75% -10%,#29233d 0,transparent 38%),#090b12;color:#f4f6ff;min-height:100vh}.landing-page a{color:inherit;text-decoration:none}.landing-nav{height:78px;max-width:1240px;margin:auto;padding:0 28px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12}.landing-brand{display:flex;align-items:center;gap:11px;font-size:13px;letter-spacing:.12em;font-weight:600}.landing-brand b{color:var(--accent)}.landing-brand .brandmark{width:38px;height:38px}.landing-nav nav{display:flex;align-items:center;gap:26px;color:#aeb5c6;font-size:13px}.landing-nav nav>a:not(.button):hover,.landing-footer>a:hover{color:var(--accent)}.landing-nav .button{font-size:12px}.landing-nav .button.small{min-height:38px}.landing-page main{max-width:1240px;margin:auto;padding:0 28px}.hero{min-height:565px;display:grid;grid-template-columns:1.03fr .97fr;align-items:center;gap:20px;padding:48px 0 34px}.hero-copy{position:relative;z-index:1}.hero-copy .eyebrow{color:#b5bdcf;display:flex;align-items:center;gap:9px}.hero-copy .eyebrow i,.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 13px var(--accent)}.hero h1{font-size:clamp(55px,8vw,96px);line-height:.94;letter-spacing:-.075em;margin:26px 0 20px;font-weight:800}.hero h1 em{font-style:normal;color:var(--accent)}.hero-copy>p{max-width:470px;color:#aab2c4;font-size:16px;line-height:1.75}.hero-actions{display:flex;align-items:center;gap:24px;margin:30px 0 38px}.button.big{min-height:52px;padding:0 21px;font-size:14px}.text-link{font-weight:650;font-size:13px;color:#e6e9f1;display:inline-flex;align-items:center;gap:9px}.text-link:hover{color:var(--accent)}.hero-meta{display:flex;gap:27px;color:#8690a4;font-size:11px;text-transform:uppercase;letter-spacing:.06em}.hero-meta span{display:grid;gap:3px}.hero-meta b{color:#f3f4fa;font-size:14px;letter-spacing:0;text-transform:none}.hero-art{height:430px;position:relative;isolation:isolate;display:grid;place-items:center;overflow:hidden;border:1px solid #ffffff12;border-radius:28px;background:radial-gradient(ellipse at 55% 47%,#302a43 0,#161722 48%,#10121a 76%);box-shadow:0 30px 80px #0005}.art-glow{position:absolute;width:340px;height:340px;border-radius:50%;background:#b9ff4512;filter:blur(55px)}.art-grid{position:absolute;inset:0;opacity:.18;background-image:linear-gradient(#aab2c418 1px,transparent 1px),linear-gradient(90deg,#aab2c418 1px,transparent 1px);background-size:40px 40px;mask-image:linear-gradient(transparent,#000 25%,#000 75%,transparent)}.art-ring{position:absolute;width:340px;height:340px;border:1px solid #c9ff4924;border-radius:50%}.ring-two{width:420px;height:420px;border-color:#c9ff4912}.art-mark{width:min(80%,410px);color:#c4ff59;filter:drop-shadow(0 0 28px #b9ff4540);z-index:1}.art-tag{position:absolute;z-index:2;color:#a3adc0;font-size:9px;letter-spacing:.16em;line-height:1.6}.art-tag strong{font-size:13px;color:#f3f5fb}.tag-top{right:10%;top:17%}.tag-bottom{left:9%;bottom:12%;display:flex;align-items:center;gap:9px}.hero-art-caption{position:absolute;right:9%;bottom:12%;text-align:right;color:#858ea1;font-size:9px;letter-spacing:.18em;line-height:1.6}.hero-art-caption b{color:#e9e9f1;font-size:12px}.quick-strip{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #ffffff12;border-bottom:1px solid #ffffff12;padding:22px 5px;margin-bottom:15px}.quick-strip>div{display:flex;align-items:center;gap:13px;padding:4px 22px;border-right:1px solid #ffffff12}.quick-strip>div:first-child{padding-left:10px}.quick-strip>div:last-child{border-right:0}.strip-icon{width:35px;height:35px;border:1px solid #ffffff20;border-radius:10px;display:grid;place-items:center;color:var(--accent);font-size:19px}.quick-strip b,.quick-strip small{display:block}.quick-strip b{font-size:12px}.quick-strip small{color:#8e97aa;font-size:10px;margin-top:3px}.landing-section{padding:88px 0 35px;scroll-margin-top:20px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:25px}.section-heading .eyebrow,.closing-cta .eyebrow{color:var(--accent)}.section-heading h2,.closing-cta h2{font-size:clamp(28px,4vw,43px);letter-spacing:-.055em;line-height:1.1;margin:9px 0;font-weight:750}.section-heading p,.closing-cta p{margin:0;color:#98a2b5;font-size:13px}.availability-control{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin:24px 0 15px;padding:14px;border-radius:13px;background:#121622;border:1px solid #ffffff12}.availability-control label{font-size:11px;color:#b8c0cf;font-weight:650}.availability-control input{width:215px;background:#0c0f17;color:#eef0f8;border:1px solid #33394b;border-radius:9px;min-height:42px;padding:0 10px}.availability-control .muted{font-size:11px;margin-left:auto}.station-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;transition:opacity .2s ease}.station-cards.is-loading{opacity:.55;pointer-events:none}.station-card{position:relative;overflow:hidden;min-height:192px;padding:17px;border-radius:14px;border:1px solid #ffffff13;background:linear-gradient(145deg,#171b29,#10131c);animation:card-arrive .35s both;animation-delay:calc(var(--card-index,0)*35ms)}.station-card:after{content:"";position:absolute;right:-33px;top:-42px;width:110px;height:110px;border-radius:50%;background:#b9ff4510;filter:blur(15px)}.station-card.available{border-color:#b9ff4538}.station-card.booked,.station-card.occupied,.station-card.unavailable{opacity:.75}.station-card-head{display:flex;justify-content:space-between;gap:8px;align-items:center}.station-glyph{font:700 10px ui-monospace,monospace;letter-spacing:.1em;color:#aab3c5;border:1px solid #ffffff1a;padding:6px 8px;border-radius:7px}.availability-pill{display:inline-flex;align-items:center;gap:6px;font-size:9px;color:#bbc4d3;white-space:nowrap}.availability-pill i{width:6px;height:6px;border-radius:50%;background:#798397}.availability-pill.available i{background:var(--accent);box-shadow:0 0 8px var(--accent)}.availability-pill.occupied i{background:#ffb64f}.availability-pill.booked i{background:#aaa6ff}.station-card h3{font-size:20px;letter-spacing:-.04em;margin:17px 0 4px}.station-card p{font-size:10px;color:#939db0;margin:0 0 15px}.button.station-cta{position:relative;z-index:1;min-height:35px;padding:6px 9px;font-size:10px;background:#1a2030;color:#eef1f8;border-color:#ffffff18}.station-card.available .station-cta:hover{border-color:var(--accent);color:var(--accent)}.station-cta:disabled{cursor:default;opacity:.65}.availability-empty{grid-column:1/-1;color:#98a2b5;font-size:12px}.empty-state{grid-column:1/-1;padding:28px 20px;text-align:center;color:#9ca6bb;border:1px dashed #333b4e;border-radius:12px;font-size:12px}.empty-state strong{display:block;color:#edf0f8;font-size:14px;margin-bottom:5px}.error-state{display:grid;justify-items:center;gap:10px}.loading-card{color:#9ca6bb}.package-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.package-card{padding:19px 18px;border:1px solid #ffffff15;border-radius:15px;background:linear-gradient(145deg,#171b29,#10131c);animation:card-arrive .35s both;animation-delay:calc(var(--card-index,0)*35ms)}.package-card.featured{border-color:#b9ff4570;box-shadow:inset 0 0 32px #b9ff4509,0 12px 35px #0003}.package-card-top{height:24px;display:flex;justify-content:space-between;align-items:center}.package-mark{font:700 10px ui-monospace,monospace;color:#8993a8}.package-tag{color:var(--accent);font-size:8px;letter-spacing:.1em}.package-card h3{font-size:21px;margin:20px 0 1px;letter-spacing:-.035em}.package-players{font-size:10px;color:#929caf;margin:0}.package-price{display:flex;align-items:baseline;gap:7px;margin:21px 0 0}.package-price strong{font-size:28px;letter-spacing:-.05em}.package-price span{color:#9ba4b5;font-size:10px}.package-offer{min-height:29px;color:#b9ff45;font-size:9px;margin:3px 0 17px}.package-offer.muted{color:#8b95a9}.package-link{border-top:1px solid #ffffff16;padding-top:12px;display:flex;justify-content:space-between;font-size:10px;color:#eef0f7}.package-link:hover{color:var(--accent)}.package-note{font-size:10px;color:#727d92;margin-top:13px}.closing-cta{margin:80px 0 58px;padding:30px 34px;border-radius:18px;border:1px solid #b9ff452a;background:radial-gradient(ellipse at 80% 30%,#b9ff4513,transparent 35%),linear-gradient(110deg,#171b28,#11141d);display:flex;align-items:center;justify-content:space-between;gap:20px}.closing-cta h2{margin:8px 0}.landing-footer{max-width:1240px;margin:auto;padding:22px 28px 30px;border-top:1px solid #ffffff14;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#9da6b8;font-size:10px}.landing-footer address{font-style:normal;line-height:1.7}.landing-footer>a:last-child{font-size:11px} /* Booking and operations */ .booking-box{width:min(920px,100%);padding:clamp(20px,4vw,38px);border-radius:22px}.booking-box>h1{font-size:clamp(30px,5vw,43px);letter-spacing:-.055em;margin-bottom:8px}.booking-box>p{margin-bottom:14px}.booking-progress{display:flex;list-style:none;gap:0;margin:23px 0;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--surface2);overflow:hidden}.booking-progress li{flex:1;display:flex;align-items:center;gap:9px;padding:11px 14px;color:var(--muted);font-size:11px;border-right:1px solid var(--line)}.booking-progress li:last-child{border:0}.booking-progress li b{color:var(--muted);font:700 10px ui-monospace,monospace}.booking-progress li[aria-current="step"]{color:var(--ink);background:linear-gradient(90deg,var(--accent-soft),transparent)}.booking-progress li[aria-current="step"] b{color:var(--accent)}.booking-box .field input,.booking-box .field select{min-height:48px}.booking-box .button{min-height:48px}.booking-box .button.small{min-height:38px}.station-picker{padding:18px;border:1px solid var(--line);border-radius:15px;background:var(--surface2)}.station-picker .panel-head{align-items:center}.station-picker .panel-head h2{font-size:18px}.station-picker .panel-head .muted{font-size:11px}.draft-notice{color:#f3c46e;background:#f3c46e0d;border-color:#f3c46e66;border-radius:0 8px 8px 0}.floorplan-wrap{border-color:#30394b;background:#101520}.floorplan{min-height:300px;max-height:490px;background-color:#101520;background-image:linear-gradient(90deg,#ffffff09 1px,transparent 1px),linear-gradient(#ffffff09 1px,transparent 1px);border-color:#252d3d}.map-station{border-color:#9eff3e;background:#aefb4b;color:#10160a;font-weight:700;box-shadow:0 0 22px #a8f13d24;transition:filter .16s ease,transform .16s ease,box-shadow .16s ease}.map-station.available:hover{filter:brightness(1.1);transform:scale(1.025);box-shadow:0 0 30px #a8f13d58}.map-station.booked,.station-option.booked{border-color:#69758b;background:#252c3b;color:#bdc7d9;box-shadow:none}.map-station.occupied,.station-option.occupied{border-color:#f2a842;background:#382819;color:#ffd38f;box-shadow:none}.map-station.unavailable,.station-option.unavailable{border-color:#9b5661;background:#342127;color:#ffc0c1;box-shadow:none}.map-station.selected,.station-option.selected{outline:3px solid #c5ff62;outline-offset:3px;background:#eaffbd;color:#10160a;border-color:#fff;box-shadow:0 0 34px #b9ff4580}.map-station:disabled{opacity:1}.legend-swatch.available{background:#aefb4b;border-color:#9eff3e}.legend-swatch.selected{background:#eaffbd;border-color:#fff}.legend-swatch.booked{background:#252c3b;border-color:#69758b}.legend-swatch.occupied{background:#382819;border-color:#f2a842}.legend-swatch.unavailable{background:#342127;border-color:#9b5661}.station-legend{font-size:10px}.station-option{min-height:44px;background:#171d2a;color:var(--ink);border-color:#333c50}.booking-summary{background:#0b0e16;border-color:#343d50;line-height:1.7}.business-address{padding:10px 12px;border-radius:9px;background:#151a26;font-size:12px}.booking-box .notice{background:#1b2730;color:#c7d7dc}.booking-box .button.primary{background:var(--accent);color:#11170b}.admin-floorplan{min-height:260px}.layout-editor{background:var(--surface2)}.session-overrun{font-variant-numeric:tabular-nums} @keyframes card-arrive{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}} @media(max-width:900px){.hero{min-height:490px;grid-template-columns:1fr 1fr}.hero-art{height:360px}.station-cards,.package-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.landing-section{padding-top:68px}} @media(max-width:600px){.landing-nav{height:66px;padding:0 17px}.landing-nav nav{gap:7px}.landing-nav nav>a:not(.button){display:none}.landing-nav .button{font-size:10px;padding:7px 9px;min-height:38px}.landing-nav nav .button.small{display:none}.landing-brand{font-size:10px;gap:8px}.landing-brand .brandmark{width:34px;height:34px}.landing-page main{padding:0 17px}.hero{padding:42px 0 22px;grid-template-columns:1fr;gap:27px;min-height:unset}.hero h1{font-size:clamp(54px,16vw,76px);margin:21px 0 15px}.hero-copy>p{font-size:14px;max-width:380px}.hero-actions{margin:24px 0 25px;gap:17px}.hero-meta{gap:15px;font-size:9px}.hero-meta b{font-size:12px}.hero-art{height:260px;border-radius:19px}.art-mark{width:270px}.art-ring{width:230px;height:230px}.ring-two{width:300px;height:300px}.tag-top{right:8%;top:12%}.tag-bottom{left:7%;bottom:8%}.hero-art-caption{right:7%;bottom:8%}.quick-strip{padding:12px 0;grid-template-columns:1fr;gap:7px}.quick-strip>div,.quick-strip>div:first-child{border:0;padding:5px 2px}.strip-icon{width:31px;height:31px}.quick-strip small{display:inline;margin-left:7px}.quick-strip b{display:inline}.landing-section{padding:54px 0 22px}.section-heading{align-items:flex-start;margin-bottom:19px}.section-heading h2,.closing-cta h2{font-size:29px}.section-heading p{font-size:11px}.section-heading>.text-link{font-size:10px;white-space:nowrap;margin-top:19px}.section-heading>.button{font-size:10px;padding:8px}.availability-control{padding:11px;gap:8px}.availability-control label{width:100%}.availability-control input{flex:1;width:auto;min-width:0;font-size:12px}.availability-control .button{font-size:10px;padding:8px}.availability-control .muted{width:100%;margin:0}.station-cards,.package-cards{gap:8px}.station-card{min-height:170px;padding:12px}.station-card h3{font-size:17px;margin-top:14px}.availability-pill{font-size:8px}.station-card p{font-size:9px;min-height:27px}.button.station-cta{width:100%;justify-content:center;font-size:9px}.package-card{padding:15px 12px}.package-card h3{font-size:18px;margin-top:16px}.package-price{margin-top:16px}.package-price strong{font-size:24px}.package-tag{font-size:7px}.package-offer{font-size:8px}.closing-cta{margin:49px 0 35px;padding:21px 18px;align-items:flex-start;flex-direction:column}.closing-cta h2{margin-top:7px}.closing-cta p{font-size:11px}.closing-cta .button{width:100%;justify-content:center}.landing-footer{padding:19px 17px 25px;align-items:flex-start;flex-wrap:wrap}.landing-footer address{order:3;width:100%}.booking-box{padding:20px 15px;border-radius:16px}.booking-box>p{font-size:12px}.booking-progress li{justify-content:center;padding:10px 6px;gap:6px;font-size:10px}.booking-progress li b{font-size:9px}.station-picker{padding:12px}.station-picker .panel-head{display:block}.station-picker .panel-head .muted{display:block;margin-top:4px}.floorplan{min-height:230px;max-height:330px;border-width:7px}.map-station{font-size:9px;gap:2px}.map-station span{font-size:8px}.station-legend{gap:7px 11px}.station-option{flex:1 1 44%;font-size:11px}.booking-box .form-actions{gap:8px}.booking-box .form-actions .button{flex:1;padding:8px;font-size:11px}} @media(prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}.station-card,.package-card{animation:none!important}.button,.map-station,.nav button{transition:none!important}} @media(max-width:600px){ .landing-page,.booking-box{max-width:100%;overflow-x:clip} .landing-nav{width:100%;min-width:0;padding:0 14px;gap:8px} .landing-nav nav{min-width:0;gap:0} .landing-nav nav .button.primary{min-width:0;white-space:nowrap;padding:7px 10px;font-size:9px} .hero-copy{min-width:0}.hero h1{font-size:clamp(43px,13vw,62px);letter-spacing:-.075em} .login{display:block;width:100%;padding:12px} .booking-box{width:100%;max-width:920px;margin:0 auto;min-width:0} .booking-box .form,.booking-box .station-picker,.booking-box .booking-progress{min-width:0;max-width:100%} } @media(max-width:900px){.shell{grid-template-columns:minmax(0,1fr);width:100%;min-width:0}.sidebar,.main{width:100%;min-width:0}.nav{width:100%;max-width:100%;min-width:0}.main{overflow-x:clip}} :root[data-theme="dark"]{color-scheme:dark;--bg:#090b12;--surface:#111520;--surface2:#171d2a;--ink:#f4f6ff;--muted:#9ca6bb;--line:#283044;--accent:#b9ff45;--accent-soft:#24331a;--danger:#ff777f;--warning:#ffca6b;--shadow:0 18px 50px #0005;--radius:16px;--focus:#c5ff62} .game-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px;border:1px solid #ffffff12;border-radius:12px;background:#121622;margin-bottom:15px}.game-controls label{font-size:11px;color:#b8c0cf}.game-controls input,.game-controls select{background:#0c0f17;color:#eef0f8;border:1px solid #33394b;border-radius:9px;min-height:40px;padding:0 10px}.game-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.game-card{overflow:hidden;border:1px solid #ffffff14;border-radius:14px;background:linear-gradient(145deg,#171b29,#10131c);transition:transform .18s,border-color .18s}.game-card:hover{transform:translateY(-3px);border-color:#b9ff4570}.game-card img{width:100%;height:210px;object-fit:cover;background:#171d2a}.game-card>div{padding:14px}.game-card .eyebrow{font-size:9px;color:var(--accent)}.game-card h3{margin:5px 0;font-size:17px}.game-card p{margin:0;color:#98a2b5;font-size:11px}.lookup-result{width:100%;flex-basis:100%}.lookup-card{padding:14px;border:1px solid #b9ff4544;border-radius:10px;color:#dce2ed;line-height:1.8}.lookup-card strong{color:var(--accent)}.nearby-slots{margin-top:10px}.nearby-slots small{display:block;margin:8px 0;color:var(--muted)}.slot-options{display:flex;flex-wrap:wrap;gap:6px}.slot-options .button{min-height:36px;font-size:11px}.slot-busy{opacity:.58}.game-admin-row{padding:10px 0;border-bottom:1px solid var(--line)}.game-admin-row img{width:56px;height:64px;object-fit:cover;border-radius:7px}.game-admin-row span{display:grid;gap:3px;flex:1}.game-admin-row small{color:var(--muted)} @media(max-width:900px){.game-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.game-cards{gap:8px}.game-card img{height:150px}.game-controls input{flex:1;min-width:120px}.slot-options .button{flex:1 1 42%}}.growth-list{padding-left:20px;line-height:1.8;color:var(--ink)}.growth-list li{margin:8px 0}.growth-checklist{display:grid;gap:12px}.growth-checklist label{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid var(--line);border-radius:9px}.growth-checklist input{margin-top:4px;accent-color:var(--accent)} .landing-page .form-panel{max-width:850px;padding:20px;border:1px solid #ffffff14;border-radius:15px;background:linear-gradient(145deg,#171b29,#10131c)}.landing-page .form-panel .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.landing-page .form-panel .wide,.landing-page .form-panel .form-actions{grid-column:1/-1}.landing-page .form-panel .field input,.landing-page .form-panel .field select,.landing-page .form-panel .field textarea{background:#0c0f17;color:#eef0f8;border:1px solid #33394b;border-radius:9px;padding:11px;min-height:42px}.landing-page .form-panel .form-actions{justify-content:flex-start;flex-wrap:wrap}.landing-page .form-panel .form-actions .muted{font-size:11px;max-width:500px}.success-message{color:#b9ff45;font-size:13px}.landing-page .error-state{color:#ffaaaa;font-size:13px}@media(max-width:600px){.landing-page .form-panel{padding:13px}.landing-page .form-panel .form-grid{grid-template-columns:1fr}.landing-page .form-panel .wide,.landing-page .form-panel .form-actions{grid-column:1}} .game-readiness{display:inline-block;margin-top:7px;color:#b9ff45;font-size:10px;letter-spacing:.02em}.game-admin-row select{max-width:190px;min-height:36px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:0 8px} /* Customer experience: clean typography, clear hierarchy, and accessible theme contrast. */ .hero-rotator{min-height:78px;max-width:570px}.hero-rotator p{max-width:470px;margin:0;color:#aab2c4;font-size:16px;line-height:1.75;transition:opacity .2s ease,transform .2s ease}.hero-rotator p.is-changing{opacity:.2;transform:translateY(4px)}.hero-rotator-controls{display:flex;align-items:center;gap:8px;margin-top:6px;color:var(--muted);font:10px ui-monospace,monospace}.hero-rotator-controls button{width:30px;height:30px;border:1px solid #ffffff20;border-radius:50%;background:transparent;color:var(--ink)}.hero-rotator-controls button:hover{border-color:var(--accent);color:var(--accent)}.hero-scene{position:absolute;z-index:2;inset:12%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:var(--accent);text-shadow:0 0 30px #b9ff4520}.scene-kicker,.scene-subtitle{font-size:9px;letter-spacing:.2em;color:#bec5d2}.scene-title{font-size:clamp(36px,6vw,70px);line-height:.8;letter-spacing:-.09em;color:#eef1f8}.scene-title em{font-style:normal;color:var(--accent)}.scene-bars{height:35px;display:flex;align-items:end;gap:5px;margin-top:24px}.scene-bars i{width:7px;border-radius:4px;background:var(--accent);height:25%;animation:equalize .9s ease-in-out infinite alternate}.scene-bars i:nth-child(2){height:85%;animation-delay:.2s}.scene-bars i:nth-child(3){height:50%;animation-delay:.4s}.scene-bars i:nth-child(4){height:70%;animation-delay:.1s}@keyframes equalize{to{height:90%}}.offer-callout{display:flex;align-items:center;gap:13px;padding:13px 16px;margin:0 0 15px;border:1px solid #b9ff4533;border-radius:12px;background:linear-gradient(100deg,#b9ff4510,transparent);color:var(--muted);font-size:12px;line-height:1.65}.offer-callout p{margin:0}.offer-callout strong{color:var(--ink);font-size:14px}.offer-icon{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:50%;background:#b9ff4518;color:var(--accent);font-size:21px}.package-card.group-value{border-color:#b9ff454d}.package-card.group-value .package-tag{color:var(--accent)}.package-offer.group-note{color:var(--accent)}.game-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:16px 0 10px}.game-section-head h3{font-size:14px;margin:0}.game-card .game-art-placeholder,.game-art-placeholder{height:210px;padding:18px;display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(ellipse at 75% 20%,#b9ff4522,transparent 45%),linear-gradient(140deg,#242b3d,#10131c);color:var(--ink)}.game-art-placeholder span,.game-art-placeholder small{font:9px ui-monospace,monospace;letter-spacing:.13em;color:var(--accent)}.game-art-placeholder strong{max-width:95%;font-size:clamp(16px,2vw,22px);line-height:1.1;letter-spacing:-.04em}.game-readiness{display:block;color:var(--muted);font-size:10px;line-height:1.5}.game-players{display:block;color:var(--muted);font-size:10px;margin-top:4px}.game-picker{padding:18px;border:1px solid var(--line);border-radius:15px;background:var(--surface2)}.game-choice-options{display:flex;flex-wrap:wrap;gap:12px;margin:10px 0}.game-choice-options label{display:flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid var(--line);border-radius:9px;color:var(--ink)}.booking-game-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.booking-game-card{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:11px;background:var(--surface);cursor:pointer;transition:border-color .15s,transform .15s}.booking-game-card:hover{border-color:var(--accent);transform:translateY(-2px)}.booking-game-card.selected{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 25%,transparent)}.booking-game-card>input{position:absolute;opacity:0;width:1px;height:1px}.booking-game-card:focus-within{outline:2px solid var(--focus);outline-offset:2px}.booking-game-card .game-art-placeholder{height:120px}.booking-game-copy{display:grid;gap:4px;padding:10px}.booking-game-copy strong{font-size:12px}.booking-game-copy small{color:var(--muted);font-size:10px;line-height:1.45}.game-selection-notice{font-size:11px;color:var(--muted);line-height:1.5}.booking-top-actions{display:flex;justify-content:space-between;margin-bottom:14px}.theme-toggle{display:inline-flex;align-items:center;gap:6px}.game-edit-form{padding:14px 0;border-bottom:1px solid var(--line);display:grid;gap:12px}.game-edit-form .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.game-edit-form .form-grid>label{display:grid;gap:5px;color:var(--muted);font-size:12px}.game-edit-form input,.game-edit-form select{min-width:0;padding:8px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink)}.game-form-actions{display:flex;gap:8px}.game-edit-form fieldset{display:flex;flex-wrap:wrap;gap:12px;border:1px solid var(--line);border-radius:8px;padding:10px}.game-edit-form fieldset label{font-size:12px}.booking-box .game-controls{background:var(--surface);border-color:var(--line)}.booking-box .game-controls input,.booking-box .game-controls select{background:var(--surface);color:var(--ink);border-color:var(--line)}.booking-box .business-address,.booking-box .booking-summary{background:var(--surface);color:var(--ink);border-color:var(--line)}.booking-box .draft-notice{line-height:1.5} :root[data-theme="light"] .landing-page{--landing-panel:#fff;--landing-ink:#17211d;--landing-muted:#59665f;--landing-line:#dce4de;background:#f6f8f5;color:#17211d}.landing-page{background:var(--bg);color:var(--ink)}:root[data-theme="light"] .landing-page .hero-copy>p,:root[data-theme="light"] .landing-page .hero-rotator p,:root[data-theme="light"] .section-heading p,:root[data-theme="light"] .closing-cta p{color:var(--landing-muted)}:root[data-theme="light"] .landing-page .landing-nav,:root[data-theme="light"] .landing-footer{border-color:var(--landing-line)}:root[data-theme="light"] .landing-page .landing-nav a,:root[data-theme="light"] .landing-page .landing-footer a{color:var(--landing-ink)}:root[data-theme="light"] .landing-page .hero-art,:root[data-theme="light"] .landing-page .closing-cta{background-color:#edf3ed;border-color:#d5e1d7;color:#258063}:root[data-theme="light"] .landing-page .hero-art .scene-title{color:#17211d}:root[data-theme="light"] .landing-page .hero-art .scene-kicker,:root[data-theme="light"] .landing-page .hero-art .scene-subtitle{color:#526159}:root[data-theme="light"] .landing-page .quick-strip{border-color:var(--landing-line)}:root[data-theme="light"] .landing-page .quick-strip small{color:var(--landing-muted)}:root[data-theme="light"] .landing-page .availability-control,:root[data-theme="light"] .landing-page .game-controls{background:#fff;border-color:var(--landing-line)}:root[data-theme="light"] .landing-page .availability-control input,:root[data-theme="light"] .landing-page .game-controls input,:root[data-theme="light"] .landing-page .game-controls select{background:#fff;color:#17211d;border-color:#c8d2ca}:root[data-theme="light"] .landing-page .station-card,:root[data-theme="light"] .landing-page .package-card,:root[data-theme="light"] .landing-page .game-card{background:linear-gradient(145deg,#fff,#f3f6f2);border-color:#dce4de;color:#17211d}:root[data-theme="light"] .landing-page .station-card p,:root[data-theme="light"] .landing-page .package-players,:root[data-theme="light"] .landing-page .package-price span,:root[data-theme="light"] .landing-page .package-note,:root[data-theme="light"] .landing-page .game-card p{color:#59665f}:root[data-theme="light"] .landing-page .package-link{border-color:#dce4de;color:#17211d}:root[data-theme="light"] .landing-page .station-cta{background:#f2f5f2;color:#17211d;border-color:#d4ddd5}:root[data-theme="light"] .landing-page .game-art-placeholder{background:radial-gradient(ellipse at 75% 20%,#53a88230,transparent 45%),linear-gradient(140deg,#e3eee6,#f7f8f5);color:#17211d}:root[data-theme="light"] .landing-page .game-art-placeholder small{color:#637268}:root[data-theme="light"] .landing-page .offer-callout{background:#edf4eb;border-color:#cbdcbc}:root[data-theme="light"] .landing-page .offer-callout strong{color:#17211d}:root[data-theme="light"] .booking-box .station-picker,:root[data-theme="light"] .booking-box .game-picker{background:#f8faf8}:root[data-theme="light"] .booking-box .floorplan-wrap,:root[data-theme="light"] .booking-box .floorplan{background-color:#edf2ed;border-color:#d1dbd2}:root[data-theme="light"] .booking-box .station-option{background:#fff;color:#17211d;border-color:#cbd5cd}:root[data-theme="light"] .booking-box .map-station.booked,:root[data-theme="light"] .booking-box .station-option.booked{background:#e0e5ea;color:#3c4752}:root[data-theme="light"] .booking-box .map-station.occupied,:root[data-theme="light"] .booking-box .station-option.occupied{background:#fff0d7;color:#68481c}:root[data-theme="light"] .booking-box .map-station.unavailable,:root[data-theme="light"] .booking-box .station-option.unavailable{background:#f5e2e3;color:#742f38}:root[data-theme="light"] .booking-box .map-station.selected,:root[data-theme="light"] .booking-box .station-option.selected{background:#e4f6c8;color:#182211} @media(max-width:700px){.booking-game-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-art .art-tag,.hero-art-caption{font-size:8px}}@media(max-width:460px){.booking-game-cards{grid-template-columns:1fr}.game-card .game-art-placeholder,.game-art-placeholder{height:155px}.game-section-head{align-items:flex-start;flex-direction:column}.game-edit-form .form-grid{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.hero-rotator p,.scene-bars i,.booking-game-card,.game-card,.game-card:hover{transition:none!important;animation:none!important;transform:none!important}} :root[data-theme="light"] .landing-page .hero-copy .eyebrow{color:#526159}:root[data-theme="light"] .landing-page .hero-meta{color:#59665f}:root[data-theme="light"] .landing-page .hero-meta b{color:#17211d} .game-library-section{grid-column:1/-1;min-width:0}.game-library-section>h3{font-size:14px;margin:4px 0 10px;color:var(--ink)}#game-cards:has(.game-library-section){grid-template-columns:1fr} @media(max-width:600px){.landing-nav{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;overflow:hidden}.landing-brand{min-width:0;white-space:nowrap}.landing-nav nav{min-width:0;justify-self:end;flex:0 1 auto}.landing-nav nav .button.primary{max-width:100%;font-size:9px;padding:7px 8px}.hero-art{width:100%;min-width:0}.hero-rotator,.hero-rotator p{width:100%;max-width:100%;min-width:0}.hero-copy{width:100%;min-width:0}} @media(max-width:600px){.landing-nav{position:relative;display:flex;justify-content:space-between;width:100%;min-width:0;overflow:hidden}.landing-nav nav{position:absolute;top:14px;right:14px;display:flex;width:max-content;justify-content:flex-end}.landing-brand{flex:0 1 auto}.hero{grid-template-columns:minmax(0,1fr);min-width:0}.hero-copy{min-width:0;width:100%}.hero-rotator,.hero-rotator p{min-width:0;max-width:100%;width:100%}.hero-art{min-width:0;width:100%;max-width:100%;justify-self:stretch}} /* Apply the selected theme to all page surfaces, including gaming panels that intentionally use fixed dark colors in the default dark theme. */ :root[data-theme="light"] body{background:radial-gradient(ellipse at 70% -10%,#e8eee9 0,transparent 42%),var(--bg);color:var(--ink)} :root[data-theme="light"] .landing-page{--bg:#f6f8f5;--surface:#fff;--surface2:#eef2ee;--ink:#17211d;--muted:#59665f;--line:#dce4de;--accent:#537d10;--accent-soft:#edf5df;background:radial-gradient(ellipse at 75% -10%,#e6eee7 0,transparent 38%),var(--bg);color:var(--ink)} :root[data-theme="light"] .landing-nav nav{color:#59665f} :root[data-theme="light"] .landing-page .hero-art,:root[data-theme="light"] .landing-page .closing-cta{background:linear-gradient(145deg,#fff,#edf3ed);border-color:#d5e1d7;color:#258063} :root[data-theme="light"] .landing-page .hero-art .scene-title{color:#17211d} :root[data-theme="light"] .landing-page .hero-art .scene-kicker,:root[data-theme="light"] .landing-page .hero-art .scene-subtitle{color:#526159} :root[data-theme="light"] .landing-page .hero-rotator p,:root[data-theme="light"] .landing-page .hero-copy>p,:root[data-theme="light"] .landing-page .section-heading p,:root[data-theme="light"] .landing-page .closing-cta p{color:#59665f} :root[data-theme="light"] .landing-page .hero-meta,:root[data-theme="light"] .landing-page .quick-strip small{color:#59665f} :root[data-theme="light"] .landing-page .quick-strip,:root[data-theme="light"] .landing-page .landing-nav,:root[data-theme="light"] .landing-page .landing-footer{border-color:#dce4de} :root[data-theme="light"] .landing-page .availability-control,:root[data-theme="light"] .landing-page .game-controls{background:#fff;border-color:#dce4de;color:#17211d} :root[data-theme="light"] .landing-page .availability-control input,:root[data-theme="light"] .landing-page .game-controls input,:root[data-theme="light"] .landing-page .game-controls select{background:#fff;color:#17211d;border-color:#c8d2ca} :root[data-theme="light"] .landing-page .station-card,:root[data-theme="light"] .landing-page .package-card,:root[data-theme="light"] .landing-page .game-card{background:linear-gradient(145deg,#fff,#f3f6f2);border-color:#dce4de;color:#17211d} :root[data-theme="light"] .landing-page .station-card p,:root[data-theme="light"] .landing-page .package-players,:root[data-theme="light"] .landing-page .package-price span,:root[data-theme="light"] .landing-page .package-note,:root[data-theme="light"] .landing-page .game-card p{color:#59665f} :root[data-theme="light"] .landing-page .package-link,:root[data-theme="light"] .landing-page .station-cta{background:#f2f5f2;border-color:#d4ddd5;color:#17211d} :root[data-theme="light"] .landing-page .game-art-placeholder{background:radial-gradient(ellipse at 75% 20%,#53a88230,transparent 45%),linear-gradient(140deg,#e3eee6,#f7f8f5);color:#17211d} :root[data-theme="light"] .landing-page .game-art-placeholder small{color:#637268} :root[data-theme="light"] .landing-page .offer-callout{background:#edf4eb;border-color:#cbdcbc;color:#59665f} :root[data-theme="light"] .landing-page .offer-callout strong{color:#17211d} :root[data-theme="light"] .landing-page .form-panel{background:linear-gradient(145deg,#fff,#f3f6f2);border-color:#dce4de} :root[data-theme="light"] .landing-page .form-panel input,:root[data-theme="light"] .landing-page .form-panel select,:root[data-theme="light"] .landing-page .form-panel textarea{background:#fff;color:#17211d;border-color:#c8d2ca} :root[data-theme="light"] .landing-page .success-message{color:#37680b} :root[data-theme="light"] .booking-box{background:linear-gradient(145deg,#fff,#f7f9f6);color:#17211d} :root[data-theme="light"] .booking-box .station-picker,:root[data-theme="light"] .booking-box .game-picker{background:#f8faf8;border-color:#dce4de} :root[data-theme="light"] .booking-box .floorplan-wrap,:root[data-theme="light"] .booking-box .floorplan{background-color:#edf2ed;border-color:#d1dbd2} :root[data-theme="light"] .booking-box .floorplan{background-image:linear-gradient(90deg,#17211d0a 1px,transparent 1px),linear-gradient(#17211d0a 1px,transparent 1px)} :root[data-theme="light"] .booking-box .station-option{background:#fff;color:#17211d;border-color:#cbd5cd} :root[data-theme="light"] .booking-box .map-station.booked,:root[data-theme="light"] .booking-box .station-option.booked{background:#e0e5ea;color:#3c4752;border-color:#aab4c0} :root[data-theme="light"] .booking-box .map-station.occupied,:root[data-theme="light"] .booking-box .station-option.occupied{background:#fff0d7;color:#68481c;border-color:#d7a758} :root[data-theme="light"] .booking-box .map-station.unavailable,:root[data-theme="light"] .booking-box .station-option.unavailable{background:#f5e2e3;color:#742f38;border-color:#d6a3a7} :root[data-theme="light"] .booking-box .map-station.selected,:root[data-theme="light"] .booking-box .station-option.selected{background:#e4f6c8;color:#182211;border-color:#8bb844} :root[data-theme="light"] .booking-box .booking-summary,:root[data-theme="light"] .booking-box .business-address{background:#f1f4f1;color:#17211d;border-color:#dce4de} :root[data-theme="light"] .booking-box .notice{background:#e7f1ed;color:#245d4a} :root[data-theme="light"] .booking-box .draft-notice{background:#fff8e8;color:#77551a} :root[data-theme="light"] .booking-box .game-controls{background:#fff;border-color:#dce4de} :root[data-theme="light"] .booking-box .game-controls input,:root[data-theme="light"] .booking-box .game-controls select{background:#fff;color:#17211d;border-color:#c8d2ca} :root[data-theme="light"] .booking-box .game-art-placeholder{background:linear-gradient(140deg,#e3eee6,#f7f8f5);color:#17211d} :root[data-theme="light"] .booking-box .game-art-placeholder small{color:#637268} :root[data-theme="light"] .game-controls{background:#fff;border-color:#dce4de;color:#17211d} :root[data-theme="light"] .game-controls label,:root[data-theme="light"] .game-readiness{color:#526159} :root[data-theme="light"] .game-controls input,:root[data-theme="light"] .game-controls select{background:#fff;color:#17211d;border-color:#c8d2ca} :root[data-theme="light"] .game-card{background:linear-gradient(145deg,#fff,#f3f6f2);border-color:#dce4de;color:#17211d} :root[data-theme="light"] .game-art-placeholder{background:radial-gradient(ellipse at 75% 20%,#53a88230,transparent 45%),linear-gradient(140deg,#e3eee6,#f7f8f5);color:#17211d} :root[data-theme="light"] .game-art-placeholder small{color:#637268} :root[data-theme="light"] .form-panel{background:linear-gradient(145deg,#fff,#f3f6f2);border-color:#dce4de} :root[data-theme="light"] .form-panel input,:root[data-theme="light"] .form-panel select,:root[data-theme="light"] .form-panel textarea{background:#fff;color:#17211d;border-color:#c8d2ca} :root[data-theme="light"] .lookup-card{background:#f4f7f4;border-color:#b7ca9d;color:#253126} :root[data-theme="light"] .success-message{color:#37680b} @media(max-width:900px){.sidebar-foot{position:static;display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-top:8px}.sidebar-foot .theme{display:flex;gap:9px}.sidebar-foot .button{min-height:36px}} /* Supplied shop-plan concept: rooms at the rear and middle, with the lobby and entrance at the frontage. Station buttons remain availability controls. */ .floorplan-wrap{padding:12px;background:#0b1015} .floorplan{width:min(100%,390px);height:auto;min-height:0;max-height:none;aspect-ratio:147/320;margin:0 auto;overflow:hidden;border:8px solid #36414a;border-radius:10px;background-color:#c6c2b5;background-image:linear-gradient(90deg,#28303918 1px,transparent 1px),linear-gradient(#28303918 1px,transparent 1px);background-size:20px 20px;box-shadow:inset 0 0 0 3px #8e8c80,0 10px 30px #0003} .plan-depth-label,.plan-walkway,.plan-zone,.plan-entry{position:absolute;display:grid;place-items:center;pointer-events:none;text-align:center;font-size:clamp(8px,1.8vw,11px);font-weight:800;letter-spacing:.08em;line-height:1.3} .plan-depth-label{left:4%;right:4%;top:1.3%;height:3%;color:#35404a;font-size:8px} .plan-walkway{left:36%;top:5%;width:28%;height:91%;border-left:2px dashed #7b817e;border-right:2px dashed #7b817e;background:linear-gradient(90deg,#c9c6bb,#dedbd1 50%,#c9c6bb);color:#4c5355;writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:.16em} .plan-zone{top:70%;height:26%;border:2px solid #6a5844;border-radius:8px;background:linear-gradient(145deg,#45382d,#756046);color:#fff6e6;box-shadow:inset 0 0 0 4px #b6955b55} .plan-reception{left:2%;width:31%}.plan-waiting{right:2%;width:31%;background:linear-gradient(145deg,#3d4146,#687078)} .plan-entry{left:41%;bottom:0;width:18%;height:5%;color:#fff;background:#b73a35;border-radius:5px 5px 0 0;font-size:8px} .plan-entry span{font-size:16px;line-height:1} .map-station{border:3px solid #d6cdb9;border-radius:10px;background:linear-gradient(145deg,#263442,#101923);color:#f6f4ec;box-shadow:0 5px 16px #0005,inset 0 0 0 3px #ffffff12;font-size:clamp(10px,2vw,14px);gap:7px} .map-station::before{content:"▣ DISPLAY";font-size:9px;letter-spacing:.12em;color:#b9ff45} .map-station::after{content:"SEATING · PS5";font-size:8px;letter-spacing:.08em;color:#c3ccda} .map-station .room-label{font-size:10px;letter-spacing:.13em;color:#c5d0df} .map-station.available{border-color:#8ed641;background:linear-gradient(145deg,#263d29,#14231b)} .map-station.booked,.map-station.occupied,.map-station.unavailable{box-shadow:none} .map-station.selected{background:linear-gradient(145deg,#eaffbd,#c2ef84);color:#17220d;border-color:#638f25} .map-station.selected .room-label,.map-station.selected::before,.map-station.selected::after{color:#344b20} .open-days{border:0;padding:0;margin:0}.open-days legend{font-size:13px;color:var(--muted);font-weight:600;margin-bottom:6px}.open-days .row{gap:8px}.open-days .row label{display:flex;align-items:center;gap:4px;border:1px solid var(--line);border-radius:8px;padding:5px 8px;font-size:12px}.open-days input{accent-color:var(--accent)} :root[data-theme="light"] .floorplan-wrap{background:#e8ede8} :root[data-theme="light"] .floorplan{background-color:#d7d6cb;border-color:#b6beb6;box-shadow:inset 0 0 0 3px #aab2a9,0 8px 24px #17211d18} :root[data-theme="light"] .plan-depth-label{color:#35404a} :root[data-theme="light"] .plan-walkway{background:linear-gradient(90deg,#d6d4c8,#eeece1 50%,#d6d4c8);color:#424a49;border-color:#91978d} :root[data-theme="light"] .map-station{background:linear-gradient(145deg,#304353,#182633);color:#f6f4ec} @media(max-width:600px){.floorplan-wrap{padding:8px}.floorplan{width:min(100%,350px);border-width:6px}.plan-depth-label{font-size:7px}.plan-walkway{font-size:8px}.map-station{border-width:2px;border-radius:7px;gap:4px;font-size:10px}.map-station::before,.map-station::after{font-size:7px}.map-station .room-label{font-size:8px}} /* Booking flow clarity and touch-friendly time selection */ .booking-intro{grid-column:1/-1;display:grid;gap:4px;padding:12px 14px;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:10px;background:var(--surface2);line-height:1.45}.booking-intro strong{font-size:14px}.booking-intro span{font-size:12px;color:var(--muted)}.booking-summary-sticky{position:sticky;top:8px;z-index:4;box-shadow:0 8px 24px #0002}.booking-box #start-date,.booking-box #start-time{width:100%;min-height:50px}.booking-box .form-actions button:disabled{opacity:.55;cursor:not-allowed}.booking-game-card{min-height:180px}.booking-box .field small{line-height:1.45} @media(max-width:600px){.booking-summary-sticky{position:static}.booking-intro{padding:11px}.booking-game-card{min-height:150px}} /* Lounge-control skin: game HUD cues for staff, with business data kept real. */ .brand-caption{display:block;margin-top:2px;color:var(--muted);font:700 8px/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:.19em} .shell{position:relative;isolation:isolate;background:radial-gradient(ellipse at 80% -15%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 38%),var(--bg)} .shell::before{position:fixed;inset:0;z-index:-1;pointer-events:none;content:"";opacity:.18;background-image:linear-gradient(color-mix(in srgb,var(--line) 22%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--line) 22%,transparent) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,#000,transparent 76%)} .sidebar{position:relative;z-index:1;backdrop-filter:blur(16px)} .nav button{position:relative;overflow:hidden}.nav button.active::after{position:absolute;right:12px;top:50%;width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent);content:"";transform:translateY(-50%)} .topline{align-items:flex-start}.topline>div{min-width:0}.topline .eyebrow{display:flex;align-items:center;gap:7px;max-width:min(76vw,850px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .status-dot,.chip-live i{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:#9ee64a;box-shadow:0 0 11px #9ee64a99} .userchip{display:flex;align-items:center;gap:9px;white-space:nowrap;font-size:12px}.user-name{font-weight:700;color:var(--ink)}.chip-role{font-size:10px;text-transform:uppercase;letter-spacing:.08em}.chip-live{display:flex;align-items:center;gap:6px;border-left:1px solid var(--line);padding-left:10px;font-size:11px;color:var(--ink)} .stat{transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.stat:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 48%,var(--line));box-shadow:0 12px 34px color-mix(in srgb,var(--accent) 10%,transparent),var(--shadow)} .stat::before{position:absolute;left:0;top:16px;bottom:16px;width:2px;border-radius:2px;background:var(--accent);opacity:.65;content:""}.stat strong{font-variant-numeric:tabular-nums}.panel{transition:border-color .2s ease,box-shadow .2s ease}.panel:focus-within{border-color:color-mix(in srgb,var(--accent) 35%,var(--line))} .staff-auth{position:relative;overflow:hidden}.staff-auth::before,.staff-auth::after{position:fixed;z-index:-1;pointer-events:none;content:"";border:1px solid color-mix(in srgb,var(--accent) 13%,transparent);border-radius:50%;aspect-ratio:1}.staff-auth::before{width:min(76vw,720px);right:-22vw;top:-32vw}.staff-auth::after{width:min(52vw,480px);right:-11vw;top:-20vw;border-style:dashed;opacity:.7}.staff-auth .loginbox{position:relative;overflow:hidden}.staff-auth .loginbox::before{display:block;margin:0 0 16px;color:var(--accent);font:800 9px/1 ui-sans-serif,system-ui,sans-serif;letter-spacing:.2em;content:"VIRTUAL ESCAPE / STAFF ACCESS"}.staff-auth .loginbox .brand{display:none}.staff-auth .loginbox .button.primary{min-height:48px;box-shadow:0 0 25px color-mix(in srgb,var(--accent) 18%,transparent)} .field input:focus,.field select:focus,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid color-mix(in srgb,var(--accent) 75%,white);outline-offset:2px} .button:focus-visible,.nav button:focus-visible{outline:2px solid var(--accent);outline-offset:3px} @media(max-width:900px){.userchip{gap:6px}.topline .eyebrow{max-width:65vw}} @media(max-width:600px){.topline{align-items:flex-start;flex-direction:column}.topline .eyebrow{max-width:calc(100vw - 36px)}.userchip{flex-wrap:wrap}.chip-live{padding-left:7px}.brand-caption{letter-spacing:.13em}.staff-auth::before{width:100vw;right:-65vw;top:-35vw}.staff-auth::after{width:72vw;right:-45vw;top:-20vw}} @media(prefers-reduced-motion:reduce){.stat,.panel,.nav button{transition:none!important}.stat:hover{transform:none}} /* Higher-contrast light theme and consistent logo, alignment, and theme controls. */ :root[data-theme="light"]{--bg:#f3f6fb;--surface:#fff;--surface2:#e9eef5;--ink:#141923;--muted:#465366;--line:#b8c3d1;--accent:#4c7900;--accent-soft:#e5f2c7;--danger:#a52c37;--warning:#795000;--shadow:0 8px 26px #19263d16;--focus:#6d35c4;color-scheme:light} :root[data-theme="light"] body{background:#f3f6fb;color:#141923} :root[data-theme="light"] .landing-page{--bg:#f6f8fc;--surface:#fff;--surface2:#edf1f7;--ink:#161b25;--muted:#465366;--line:#c3ccd8;--accent:#527f08;--accent-soft:#e5f2c7;--landing-panel:#fff;--landing-ink:#161b25;--landing-muted:#465366;--landing-line:#c3ccd8;background:radial-gradient(ellipse at 75% -10%,#e7e1f6 0,transparent 39%),#f6f8fc;color:#161b25} :root[data-theme="light"] .landing-page .landing-nav,:root[data-theme="light"] .landing-page .landing-footer{border-color:#c3ccd8} :root[data-theme="light"] .landing-page .hero-rotator p,:root[data-theme="light"] .landing-page .hero-copy>p,:root[data-theme="light"] .landing-page .section-heading p,:root[data-theme="light"] .landing-page .closing-cta p,:root[data-theme="light"] .landing-page .quick-strip small{color:#465366} :root[data-theme="light"] .landing-page .hero-art,:root[data-theme="light"] .landing-page .closing-cta{background:linear-gradient(145deg,#fff,#eff3f8);border-color:#c3ccd8;color:#3d791e} :root[data-theme="light"] .landing-page .hero-art .scene-title{color:#161b25}:root[data-theme="light"] .landing-page .hero-art .scene-kicker,:root[data-theme="light"] .landing-page .hero-art .scene-subtitle{color:#465366} :root[data-theme="light"] .landing-page .station-card,:root[data-theme="light"] .landing-page .package-card,:root[data-theme="light"] .landing-page .game-card{background:linear-gradient(145deg,#fff,#f3f6fa);border-color:#c3ccd8;color:#161b25} :root[data-theme="light"] .landing-page .station-card p,:root[data-theme="light"] .landing-page .package-players,:root[data-theme="light"] .landing-page .package-price span,:root[data-theme="light"] .landing-page .package-note,:root[data-theme="light"] .landing-page .game-card p,:root[data-theme="light"] .landing-page .game-readiness{color:#465366} :root[data-theme="light"] .landing-page .package-link,:root[data-theme="light"] .landing-page .station-cta{background:#edf1f7;border-color:#c3ccd8;color:#161b25} :root[data-theme="light"] .landing-page .package-card.group-value{border-color:#6d9c24;box-shadow:0 7px 25px #709c2720} :root[data-theme="light"] .landing-page .package-card.group-value .package-tag,:root[data-theme="light"] .landing-page .package-offer{color:#416a00} :root[data-theme="light"] .landing-page .offer-callout{background:#edf5df;border-color:#b4ca8f;color:#36472a} :root[data-theme="light"] .landing-page .offer-callout strong{color:#182313} :root[data-theme="light"] .landing-page .availability-control,:root[data-theme="light"] .landing-page .game-controls,:root[data-theme="light"] .landing-page .form-panel{background:#fff;border-color:#c3ccd8;color:#161b25} :root[data-theme="light"] .landing-page .availability-control input,:root[data-theme="light"] .landing-page .game-controls input,:root[data-theme="light"] .landing-page .game-controls select,:root[data-theme="light"] .landing-page .form-panel input,:root[data-theme="light"] .landing-page .form-panel select,:root[data-theme="light"] .landing-page .form-panel textarea{background:#fff;color:#161b25;border-color:#aab6c6} :root[data-theme="light"] .landing-page .game-art-placeholder{background:radial-gradient(ellipse at 75% 20%,#719c3240,transparent 45%),linear-gradient(140deg,#e4eaf2,#f6f8fc);color:#161b25} .theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:8px 12px}.sidebar-foot .theme-toggle{width:100%}.landing-brand .ve-logo{width:76px;height:48px;object-fit:contain;flex:0 0 auto}.landing-footer .landing-brand .ve-logo{width:68px;height:43px}.brand .ve-logo{width:45px;height:30px;object-fit:contain;flex:0 0 auto}.staff-auth{isolation:isolate}.staff-auth .loginbox .brand{display:flex;align-items:center;margin-bottom:24px}.packages-section .section-heading{display:grid;justify-items:center;text-align:center;gap:18px}.packages-section .section-heading>div{max-width:720px}.packages-section .section-heading>.button{justify-self:center;min-width:190px}.closing-cta{display:grid;justify-items:center;gap:20px;text-align:center}.closing-cta>div{max-width:700px}.closing-cta>.button{justify-self:center;min-width:220px}.hero{align-items:center}.hero-art{align-self:center;min-width:0}.landing-page img{max-width:100%}.landing-page .game-card>img{width:100%;height:210px;object-fit:cover;border-radius:10px 10px 0 0}.landing-page .game-card>div:not(.game-art-placeholder){padding:12px}.landing-page .station-card,.landing-page .package-card,.landing-page .game-card{min-width:0}.landing-page .package-card h3,.landing-page .game-card h3{overflow-wrap:anywhere} @media(max-width:700px){.packages-section .section-heading{gap:14px}.packages-section .section-heading>.button{width:min(100%,320px)}.closing-cta{padding:25px 18px}.landing-brand .ve-logo{width:56px;height:39px}.landing-nav{align-items:center}.landing-nav nav{gap:9px}} @media(max-width:460px){.landing-brand .ve-logo{width:46px;height:34px}.landing-brand{gap:6px!important}.landing-nav nav .button.primary{max-width:128px;white-space:nowrap;overflow:hidden}.sidebar-foot{right:8px!important;gap:5px!important}.sidebar-foot .theme-toggle,.sidebar-foot #logout{min-height:34px;padding:6px 8px;font-size:11px}} @media(max-width:700px){.login{display:block;width:100%;padding:12px}.booking-box{width:100%;max-width:920px;margin:0 auto;min-width:0}} /* Cinematic hero motion: ambient energy, never a blocker for booking. */ .hero-art{--hero-accent:#b9ff45;isolation:isolate;transform:translateZ(0);transition:box-shadow .35s ease,border-color .35s ease} .hero-art::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:conic-gradient(from 0deg,transparent 0 68%,#b9ff4530 76%,#b9ff45b0 82%,#c15bff90 87%,transparent 96%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.55;pointer-events:none;z-index:1;animation:portal-spin 18s linear infinite} .hero-art::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(180deg,transparent 0%,#b9ff4500 44%,#b9ff4510 50%,#b9ff4500 56%,transparent 100%);transform:translateY(-110%);animation:hero-scan 8s cubic-bezier(.45,0,.55,1) infinite} .hero-art .art-grid{z-index:0;background-position:0 0;animation:grid-drift 48s linear infinite} .hero-art .art-glow{z-index:0;animation:glow-breathe 5.5s ease-in-out infinite alternate} .hero-art .art-ring{z-index:1;animation:ring-breathe 6s ease-in-out infinite alternate} .hero-art .ring-two{animation-delay:-3s} .hero-scene{position:relative;z-index:2;display:grid;justify-items:center;text-align:center;max-width:90%;animation:scene-float 6s ease-in-out infinite} .scene-kicker,.scene-subtitle{color:#c3ccdc;font-size:clamp(8px,1vw,11px);letter-spacing:.2em;line-height:1.5} .scene-title{display:block;color:#f4f6ff;font-size:clamp(47px,6vw,82px);font-weight:850;letter-spacing:-.075em;line-height:.82;margin:.16em 0 .11em;text-shadow:0 4px 24px #0008} .scene-title em{font-style:normal;color:var(--hero-accent);text-shadow:0 0 26px #b9ff4540} .scene-subtitle{margin-top:4px} .scene-bars{display:flex;align-items:center;gap:5px;height:42px;margin-top:22px;color:var(--hero-accent)} .scene-bars i{display:block;width:9px;height:35%;border-radius:8px;background:currentColor;box-shadow:0 0 15px #b9ff4570;animation:eq-pulse 1.1s ease-in-out infinite alternate} .scene-bars i:nth-child(2){height:72%;animation-delay:-.65s}.scene-bars i:nth-child(3){height:100%;animation-delay:-.2s}.scene-bars i:nth-child(4){height:58%;animation-delay:-.8s} .hero-art .art-tag,.hero-art-caption{z-index:3} .hero-art .tag-top{animation:tag-arrive .8s .12s both}.hero-art .tag-bottom{animation:tag-arrive .8s .38s both}.hero-art-caption{animation:tag-arrive .8s .52s both} .hero-art:hover{border-color:#b9ff4545;box-shadow:0 30px 90px #0007,0 0 42px #b9ff4512} .landing-page .button.primary{box-shadow:0 0 0 0 #b9ff4500;transition:transform .2s ease,box-shadow .2s ease,filter .2s ease} .landing-page .button.primary:hover{transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 8px 30px #b9ff4530} .landing-page .station-card,.landing-page .package-card,.landing-page .game-card{transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease} .landing-page .station-card:hover,.landing-page .package-card:hover,.landing-page .game-card:hover{transform:translateY(-4px);border-color:#b9ff4555;box-shadow:0 14px 36px #0003} @keyframes portal-spin{to{transform:rotate(1turn)}} @keyframes hero-scan{0%,18%{transform:translateY(-110%);opacity:0}25%{opacity:.8}58%{opacity:.45}72%,100%{transform:translateY(110%);opacity:0}} @keyframes grid-drift{to{background-position:40px 40px}} @keyframes glow-breathe{from{transform:scale(.88);opacity:.55}to{transform:scale(1.12);opacity:1}} @keyframes ring-breathe{from{transform:scale(.97);opacity:.68}to{transform:scale(1.025);opacity:1}} @keyframes scene-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}} @keyframes eq-pulse{from{transform:scaleY(.62);opacity:.72}to{transform:scaleY(1);opacity:1}} @keyframes tag-arrive{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}} @media(max-width:600px){.hero-art::after{animation-duration:11s}.scene-bars{margin-top:15px}.hero-art .art-ring{max-width:86vw;max-height:86vw}} @media(prefers-reduced-motion:reduce){.hero-art::before,.hero-art::after,.hero-art .art-grid,.hero-art .art-glow,.hero-art .art-ring,.hero-scene,.scene-bars i,.hero-art .tag-top,.hero-art .tag-bottom,.hero-art-caption{animation:none!important}.landing-page .button.primary,.landing-page .station-card,.landing-page .package-card,.landing-page .game-card{transition:none!important}.landing-page .station-card:hover,.landing-page .package-card:hover,.landing-page .game-card:hover,.landing-page .button.primary:hover{transform:none}} /* A deliberate pearl-and-ink light theme with clear surfaces and brand contrast. */ :root[data-theme="light"] { color-scheme: light; --bg: #f2f5fa; --surface: #ffffff; --surface2: #f7f9fc; --ink: #182237; --muted: #53617a; --line: #d8e0ec; --accent: #42670d; --accent-soft: #eaf4d8; --danger: #a92c3b; --warning: #815500; --shadow: 0 12px 34px #24355512; --focus: #7048c8; } :root[data-theme="light"] body { background: radial-gradient(ellipse at 12% 0%, #e5eafd 0, transparent 38%), radial-gradient(ellipse at 92% 12%, #e6f3e7 0, transparent 34%), var(--bg); color: var(--ink); } :root[data-theme="light"] .shell { background: transparent; } :root[data-theme="light"] .sidebar { background: #fff; border-color: #d8e0ec; box-shadow: 6px 0 28px #25375108; } :root[data-theme="light"] .nav button { color: #53617a; } :root[data-theme="light"] .nav button:hover, :root[data-theme="light"] .nav button.active { color: #36580a; background: linear-gradient(90deg, #eaf4d8, #f3f8e9); } :root[data-theme="light"] .nav button.active { box-shadow: inset 3px 0 #8abd2e; } :root[data-theme="light"] .main { color: #182237; } :root[data-theme="light"] .eyebrow, :root[data-theme="light"] .subtitle, :root[data-theme="light"] .muted { color: #53617a; } :root[data-theme="light"] .panel, :root[data-theme="light"] .stat, :root[data-theme="light"] dialog, :root[data-theme="light"] .loginbox { background: linear-gradient(145deg, #fff, #fbfcff); border-color: #d8e0ec; box-shadow: 0 12px 34px #24355510; } :root[data-theme="light"] .stat:after { background: #94c83c; opacity: .12; } :root[data-theme="light"] .stat strong, :root[data-theme="light"] .panel h2, :root[data-theme="light"] .title { color: #182237; } :root[data-theme="light"] .userchip { background: #f7f9fc; border-color: #d8e0ec; color: #46546d; } :root[data-theme="light"] .button { color: #24314a; background: #fff; border-color: #cbd5e3; } :root[data-theme="light"] .button:hover:not(:disabled) { color: #2f4d0a; border-color: #8eae56; background: #f7faef; box-shadow: 0 7px 20px #24355512; } :root[data-theme="light"] .button.primary, :root[data-theme="light"] .landing-page .button.primary { color: #17220c; border-color: #a5d943; background: linear-gradient(135deg, #d1f77b, #b4e955); box-shadow: 0 7px 20px #80a83c28; } :root[data-theme="light"] .button.primary:hover:not(:disabled), :root[data-theme="light"] .landing-page .button.primary:hover { color: #17220c; background: linear-gradient(135deg, #dcff91, #c2f361); } :root[data-theme="light"] .field input, :root[data-theme="light"] .field select, :root[data-theme="light"] input, :root[data-theme="light"] select, :root[data-theme="light"] textarea { color: #182237; background-color: #fff; border-color: #bdc9da; } :root[data-theme="light"] input::placeholder, :root[data-theme="light"] textarea::placeholder { color: #6a778e; opacity: 1; } :root[data-theme="light"] button:focus-visible, :root[data-theme="light"] input:focus-visible, :root[data-theme="light"] select:focus-visible, :root[data-theme="light"] textarea:focus-visible, :root[data-theme="light"] a:focus-visible { outline-color: #7048c8; } :root[data-theme="light"] table { color: #25314a; } :root[data-theme="light"] th { color: #45546d; border-color: #d8e0ec; } :root[data-theme="light"] td { border-color: #e4e9f1; } :root[data-theme="light"] tbody tr:hover { background: #f5f8fc; } :root[data-theme="light"] .badge { color: #36580a; background: #eaf4d8; } :root[data-theme="light"] .badge.gray { color: #53617a; background: #edf1f6; } :root[data-theme="light"] .badge.warn { color: #754d00; background: #fff2d3; } :root[data-theme="light"] .notice { color: #285f4c; background: #e8f4ed; } :root[data-theme="light"] .error { color: #942635; background: #fbeaec; } :root[data-theme="light"] .empty { color: #53617a; border-color: #bac7d8; background: #fbfcfe; } :root[data-theme="light"] .empty strong { color: #182237; } :root[data-theme="light"] .toast { color: #f9fbff; background: #202a3d; border-color: #36445d; } :root[data-theme="light"] .login { background: transparent; } :root[data-theme="light"] .loginbox .brand-caption { color: #53617a; } /* The landing page keeps its dark portal as a deliberate cinematic focal point. */ :root[data-theme="light"] .landing-page { --bg: #f2f5fa; --surface: #fff; --surface2: #f7f9fc; --ink: #182237; --muted: #53617a; --line: #d8e0ec; --accent: #42670d; --accent-soft: #eaf4d8; background: radial-gradient(ellipse at 12% 0%, #e4e9fa 0, transparent 36%), radial-gradient(ellipse at 94% 16%, #e2f0e5 0, transparent 31%), #f2f5fa; color: #182237; } :root[data-theme="light"] .landing-page .landing-nav, :root[data-theme="light"] .landing-page .landing-footer, :root[data-theme="light"] .landing-page .quick-strip { border-color: #d8e0ec; } :root[data-theme="light"] .landing-page .landing-nav nav, :root[data-theme="light"] .landing-page .landing-footer, :root[data-theme="light"] .landing-page .hero-copy .eyebrow, :root[data-theme="light"] .landing-page .hero-meta, :root[data-theme="light"] .landing-page .quick-strip small, :root[data-theme="light"] .landing-page .hero-rotator p, :root[data-theme="light"] .landing-page .hero-copy > p, :root[data-theme="light"] .landing-page .section-heading p, :root[data-theme="light"] .landing-page .closing-cta p { color: #53617a; } :root[data-theme="light"] .landing-page .hero-meta b { color: #182237; } :root[data-theme="light"] .landing-page .hero-art { color: #f4f6ff; border-color: #394157; background: radial-gradient(ellipse at 55% 46%, #292b3d 0, #151824 51%, #0d1018 78%); box-shadow: 0 28px 70px #17243c28, 0 0 0 6px #fff9; } :root[data-theme="light"] .landing-page .hero-art .scene-title { color: #f4f6ff; } :root[data-theme="light"] .landing-page .hero-art .scene-kicker, :root[data-theme="light"] .landing-page .hero-art .scene-subtitle { color: #c5cede; } :root[data-theme="light"] .landing-page .hero-art .art-tag { color: #c5cede; } :root[data-theme="light"] .landing-page .hero-art .art-tag strong, :root[data-theme="light"] .landing-page .hero-art-caption b { color: #f4f6ff; } :root[data-theme="light"] .landing-page .station-card, :root[data-theme="light"] .landing-page .package-card, :root[data-theme="light"] .landing-page .game-card, :root[data-theme="light"] .landing-page .availability-control, :root[data-theme="light"] .landing-page .game-controls, :root[data-theme="light"] .landing-page .form-panel { color: #182237; background: linear-gradient(145deg, #fff, #f9fbfe); border-color: #d8e0ec; box-shadow: 0 10px 28px #2435550c; } :root[data-theme="light"] .landing-page .station-card:hover, :root[data-theme="light"] .landing-page .package-card:hover, :root[data-theme="light"] .landing-page .game-card:hover { border-color: #a8c77a; box-shadow: 0 16px 34px #24355518; } :root[data-theme="light"] .landing-page .station-card p, :root[data-theme="light"] .landing-page .package-players, :root[data-theme="light"] .landing-page .package-price span, :root[data-theme="light"] .landing-page .package-note, :root[data-theme="light"] .landing-page .game-card p, :root[data-theme="light"] .landing-page .game-readiness, :root[data-theme="light"] .landing-page .game-controls label { color: #53617a; } :root[data-theme="light"] .landing-page .package-price strong, :root[data-theme="light"] .landing-page .package-card h3, :root[data-theme="light"] .landing-page .game-card h3 { color: #182237; } :root[data-theme="light"] .landing-page .package-card.group-value { border-color: #a4c56b; background: linear-gradient(145deg, #fff, #f5f9e9); box-shadow: 0 12px 32px #638d1a1a; } :root[data-theme="light"] .landing-page .package-card.group-value .package-tag, :root[data-theme="light"] .landing-page .package-offer { color: #41640d; } :root[data-theme="light"] .landing-page .package-link, :root[data-theme="light"] .landing-page .station-cta { color: #26344b; background: #f1f4f8; border-color: #d8e0ec; } :root[data-theme="light"] .landing-page .offer-callout { color: #34442b; background: linear-gradient(110deg, #eef6df, #f7faef); border-color: #cbdcab; } :root[data-theme="light"] .landing-page .offer-callout strong { color: #1e2a16; } :root[data-theme="light"] .landing-page .availability-control input, :root[data-theme="light"] .landing-page .game-controls input, :root[data-theme="light"] .landing-page .game-controls select, :root[data-theme="light"] .landing-page .form-panel input, :root[data-theme="light"] .landing-page .form-panel select, :root[data-theme="light"] .landing-page .form-panel textarea { color: #182237; background: #fff; border-color: #bdc9da; } :root[data-theme="light"] .landing-page .closing-cta { color: #f4f6ff; background: radial-gradient(ellipse at 82% 25%, #b9ff4520, transparent 34%), linear-gradient(115deg, #202638, #121721); border-color: #536440; box-shadow: 0 18px 40px #1c27401c; } :root[data-theme="light"] .landing-page .closing-cta h2 { color: #f4f6ff; } :root[data-theme="light"] .landing-page .closing-cta p { color: #c4ccdb; } :root[data-theme="light"] .landing-page .game-art-placeholder { color: #182237; background: radial-gradient(ellipse at 75% 20%, #a7cc5c35, transparent 45%), linear-gradient(140deg, #e8edf6, #f8fafc); } :root[data-theme="light"] .landing-page .game-art-placeholder small { color: #53617a; } :root[data-theme="light"] .landing-page .success-message { color: #315e0b; } /* Booking states stay vivid, distinct, and legible in the light palette. */ :root[data-theme="light"] .booking-box { color: #182237; background: linear-gradient(145deg, #fff, #fafbfe); border-color: #d8e0ec; box-shadow: 0 20px 60px #1d2a4317; } :root[data-theme="light"] .booking-progress { background: #f7f9fc; border-color: #d8e0ec; } :root[data-theme="light"] .booking-progress li { border-color: #d8e0ec; } :root[data-theme="light"] .booking-progress li[aria-current="step"] { background: linear-gradient(90deg, #eaf4d8, #f9fbf4); } :root[data-theme="light"] .booking-progress li[aria-current="step"] b { color: #42670d; } :root[data-theme="light"] .booking-box .station-picker, :root[data-theme="light"] .booking-box .game-picker, :root[data-theme="light"] .booking-box .game-controls { background: #f7f9fc; border-color: #d8e0ec; } :root[data-theme="light"] .booking-box .floorplan-wrap { background: #e9edf4; border-color: #cbd5e3; } :root[data-theme="light"] .booking-box .floorplan { background-color: #f8fafc; background-image: linear-gradient(90deg, #26344b0d 1px, transparent 1px), linear-gradient(#26344b0d 1px, transparent 1px); border-color: #cbd5e3; box-shadow: inset 0 0 0 3px #e5eaf1; } :root[data-theme="light"] .booking-box .map-station.available, :root[data-theme="light"] .booking-box .station-option.available { color: #20350d; background: linear-gradient(145deg, #e9f8d2, #d8f0ae); border-color: #91bc4d; } :root[data-theme="light"] .booking-box .map-station.booked, :root[data-theme="light"] .booking-box .station-option.booked { color: #46546a; background: #e8edf4; border-color: #b5c0cf; } :root[data-theme="light"] .booking-box .map-station.occupied, :root[data-theme="light"] .booking-box .station-option.occupied { color: #70420b; background: #fff1d8; border-color: #dfad58; } :root[data-theme="light"] .booking-box .map-station.unavailable, :root[data-theme="light"] .booking-box .station-option.unavailable { color: #7d303d; background: #fbeaec; border-color: #dba7ae; } :root[data-theme="light"] .booking-box .map-station.selected, :root[data-theme="light"] .booking-box .station-option.selected { color: #1e2c12; background: linear-gradient(145deg, #d8f69c, #c3ed72); border-color: #719b2d; outline-color: #42670d; box-shadow: 0 0 0 3px #42670d20, 0 0 24px #7da83e34; } :root[data-theme="light"] .booking-box .booking-summary, :root[data-theme="light"] .booking-box .business-address { color: #24314a; background: #f2f5f9; border-color: #d8e0ec; } :root[data-theme="light"] .booking-box .notice { color: #285f4c; background: #e8f4ed; } :root[data-theme="light"] .booking-box .draft-notice { color: #704e0c; background: #fff5df; border-color: #edcc7b; } :root[data-theme="light"] .booking-box .game-card { color: #182237; background: #fff; border-color: #d8e0ec; } :root[data-theme="light"] .booking-box .game-controls input, :root[data-theme="light"] .booking-box .game-controls select { color: #182237; background: #fff; border-color: #bdc9da; } :root[data-theme="light"] .booking-box .game-art-placeholder { color: #182237; background: linear-gradient(140deg, #e8edf6, #f8fafc); } :root[data-theme="light"] .booking-box .game-art-placeholder small { color: #53617a; } :root[data-theme="light"] .booking-box .success-message { color: #315e0b; } /* Keep game preferences available without making them a required booking step. */ .optional-games { padding: 0; overflow: hidden; } .optional-games > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 17px; cursor: pointer; font-weight: 700; list-style: none; } .optional-games > summary::-webkit-details-marker { display: none; } .optional-games > summary::after { content: "+"; color: var(--accent); font-size: 20px; line-height: 1; } .optional-games[open] > summary { border-bottom: 1px solid var(--line); } .optional-games[open] > summary::after { content: "−"; } .optional-games > summary small { margin-left: auto; color: var(--muted); font-weight: 500; } .optional-game-content { padding: 4px 16px 16px; } .optional-game-content > p:first-child { margin-top: 8px; font-size: 13px; } .hero-lede { max-width: 470px; color: #aab2c4; font-size: 16px; line-height: 1.75; } @media(max-width:600px){.optional-games>summary{padding:13px 14px}.optional-game-content{padding:3px 12px 12px}.hero-lede{font-size:14px;max-width:380px}} /* Re-center the hero composition and give the primary action its own clear line. */ .landing-page .hero-copy { display:grid; justify-items:center; text-align:center; } .landing-page .hero-copy .eyebrow { justify-content:center; } .landing-page .hero-copy > p { margin-inline:auto; } .landing-page .hero-meta { justify-content:center; flex-wrap:wrap; } .landing-page .hero-actions { width:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; } .landing-page .hero-actions .button.big { width:min(100%, 276px); min-width:220px; justify-content:center; text-align:center; } .landing-page .hero-art::before { content:none; } .landing-page .hero-scene { width:100%; max-width:100%; margin:0 auto; padding-inline:clamp(16px, 4vw, 42px); justify-items:center; text-align:center; } .landing-page .scene-title { width:100%; font-size:clamp(40px, 5vw, 74px); line-height:.86; letter-spacing:-.065em; text-align:center; } .landing-page .scene-title em { display:block; white-space:nowrap; } .landing-page .scene-bars { justify-self:center; } @media(max-width:600px) { .landing-page .scene-title { font-size:clamp(34px, 9vw, 54px); } .landing-page .hero-meta { gap:12px 20px; } .landing-page .hero-actions { margin-top:22px; } } @media(prefers-reduced-motion:reduce){.package-card,.station-card,.game-card,.button{transition:none!important}} .auth-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:20px}.auth-top .brand{margin:0!important}.auth-top .theme-toggle{width:auto} /* Keep the homepage split hero; center only the animated banner and main CTA. */ .landing-page .hero-copy { display:block; text-align:left; } .landing-page .hero-copy .eyebrow { justify-content:flex-start; } .landing-page .hero-copy > p { margin-inline:0; } .landing-page .hero-meta { justify-content:flex-start; } .landing-page .hero-actions { width:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; } .landing-page .hero-actions .button.big { width:min(100%, 276px); min-width:220px; justify-content:center; text-align:center; } .landing-page .hero-scene { justify-items:center; text-align:center; } .landing-page .scene-title { text-align:center; } /* Supplied Virtual Escape wordmark */ .landing-brand{gap:0}.landing-brand .ve-logo{display:block;width:clamp(170px,18vw,235px);height:auto;object-fit:contain;flex:0 1 auto}.landing-footer .landing-brand .ve-logo{width:min(190px,100%);height:auto}.brand .ve-logo{display:block;width:min(210px,100%);height:auto;object-fit:contain;flex:0 1 auto}.sidebar>.brand{width:100%;padding:0 2px;gap:0;flex-direction:column;align-items:flex-start}.sidebar>.brand .ve-logo{width:min(190px,100%)}.sidebar>.brand .brand-caption{font-size:10px;letter-spacing:.12em;color:var(--muted);margin-top:-5px}.loginbox .brand .ve-logo{width:min(240px,100%)}.auth-top .brand .ve-logo{width:min(190px,100%)}@media(max-width:700px){.landing-brand .ve-logo{width:clamp(145px,34vw,205px)}.landing-footer .landing-brand .ve-logo{width:min(170px,100%)}.sidebar>.brand{width:auto;max-width:170px;vertical-align:middle}.sidebar>.brand .ve-logo{width:160px}.sidebar>.brand .brand-caption{display:none}.auth-top .brand .ve-logo{width:150px}} .landing-nav .landing-brand .ve-logo{width:min(210px,35vw);max-height:62px;height:auto;object-fit:contain} .landing-page .hero-art .art-glow{left:var(--pointer-x,50%);top:var(--pointer-y,50%);transition:left .24s ease,top .24s ease} .availability-date-control{display:grid;grid-template-columns:minmax(0,215px);align-items:end;gap:10px;width:215px;min-width:215px} .availability-date-control>label{grid-column:1/-1} .availability-date-control>input{min-width:0} #check-availability{align-self:flex-end} .availability-shortcuts{display:flex;gap:6px} .availability-shortcuts .button{min-height:40px;padding:7px 12px} .availability-summary{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 15px;margin:0 0 14px;border:1px solid #b9ff4528;border-radius:12px;background:linear-gradient(100deg,#b9ff450d,#151923);color:#aab4c8;font-size:12px} .availability-summary strong{color:var(--ink);font-size:14px} .availability-summary .live-dot{flex:0 0 8px} #station-cards.is-loading{opacity:.58;filter:saturate(.75);transition:opacity .2s ease,filter .2s ease} #station-cards:not(.is-loading) .station-card{animation:card-arrive .45s both;animation-delay:calc(var(--card-index,0)*55ms)} .reveal-ready .landing-section.reveal-target{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.25,1)} .reveal-ready .landing-section.reveal-target.is-visible{opacity:1;transform:translateY(0)} :root[data-theme="light"] .availability-summary{background:linear-gradient(100deg,#eff6e6,#fff);border-color:#c9d9b0;color:#53617a} :root[data-theme="light"] .availability-summary strong{color:#182237} @media(max-width:700px){.availability-date-control{grid-template-columns:1fr;min-width:0;width:100%}.availability-date-control>label{grid-column:auto}.availability-control{align-items:stretch}.availability-control>#check-availability{width:100%}.availability-shortcuts .button{flex:1}} @media(prefers-reduced-motion:reduce){.reveal-ready .landing-section.reveal-target,.reveal-ready .landing-section.reveal-target.is-visible{opacity:1;transform:none;transition:none}.landing-page .hero-art .art-glow{transition:none}#station-cards:not(.is-loading) .station-card{animation:none}} .landing-page .hero-art::before{content:""} .home-floorplan-wrap{padding:12px} .floorplan-instruction{margin:0 0 10px;color:var(--muted);font-size:12px} .home-floorplan{min-height:470px;max-height:760px;border-color:#566044;background-color:#111720;background-image:linear-gradient(90deg,#dce7d10a 1px,transparent 1px),linear-gradient(#dce7d10a 1px,transparent 1px);box-shadow:inset 0 0 45px #0003} .home-floorplan .map-station{z-index:2;text-decoration:none} .home-floorplan a.map-station{cursor:pointer} .home-floorplan a.map-station:hover{filter:brightness(1.08);transform:scale(1.035);box-shadow:0 0 32px #b9ff4566} .home-floorplan a.map-station:focus-visible{outline:3px solid #fff;outline-offset:3px;z-index:4} .home-floorplan .plan-zone,.home-floorplan .plan-walkway,.home-floorplan .plan-entry,.home-floorplan .plan-depth-label{pointer-events:none} .station-list-heading{margin:25px 0 12px;font-size:16px} .availability-shortcuts [aria-pressed="true"]{border-color:var(--accent);color:var(--accent);box-shadow:0 0 18px #b9ff4520} .availability-summary .live-dot{animation:live-signal 2.2s ease-in-out infinite} @keyframes live-signal{50%{box-shadow:0 0 20px var(--accent);transform:scale(1.25)}} @media(max-width:700px){.home-floorplan-wrap{padding:8px}.home-floorplan{min-height:390px;border-width:7px}.floorplan-instruction{font-size:11px}} @media(prefers-reduced-motion:reduce){.availability-summary .live-dot{animation:none}} .booking-honeypot{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;white-space:nowrap!important} /* Purple is a secondary brand accent; green remains the primary action and availability color. */ :root{--accent-purple:#bd91ff;--accent-purple-strong:#d5b7ff;--accent-purple-soft:#211a30;--accent-purple-line:#bd91ff55;--focus:#d0adff} :root[data-theme="light"]{--accent-purple:#6840a2;--accent-purple-strong:#59328e;--accent-purple-soft:#f0eafb;--accent-purple-line:#7952ae55;--focus:#7144ad} body{background-image:radial-gradient(ellipse at 82% -12%,color-mix(in srgb,var(--accent-purple) 8%,transparent),transparent 34%),radial-gradient(ellipse at 70% -10%,#242037 0,transparent 38%)} :root[data-theme="light"] body{background-image:radial-gradient(ellipse at 82% -12%,#e9e0f5 0,transparent 34%)} .button:not(.primary):hover:not(:disabled){border-color:var(--accent-purple);color:var(--accent-purple)} .nav button.active{box-shadow:inset 2px 0 var(--accent-purple),0 0 24px color-mix(in srgb,var(--accent-purple) 7%,transparent)} .nav button:hover:not(.active){color:var(--accent-purple)} .panel:focus-within{border-color:color-mix(in srgb,var(--accent-purple) 35%,var(--line));box-shadow:0 0 0 1px color-mix(in srgb,var(--accent-purple) 15%,transparent),var(--shadow)} :root[data-theme="dark"] .staff-auth::after{border-color:color-mix(in srgb,var(--accent-purple) 20%,transparent)} :root[data-theme="light"] .staff-auth::after{border-color:color-mix(in srgb,var(--accent-purple) 24%,transparent)} .landing-page{background-image:radial-gradient(ellipse at 91% 5%,color-mix(in srgb,var(--accent-purple) 10%,transparent),transparent 31%),radial-gradient(ellipse at 75% -10%,#29233d 0,transparent 38%),#090b12} :root[data-theme="light"] .landing-page{background-image:radial-gradient(ellipse at 91% 5%,#e8e0f3 0,transparent 31%),radial-gradient(ellipse at 12% 0%,#e4e9fa 0,transparent 36%),radial-gradient(ellipse at 94% 16%,#e2f0e5 0,transparent 31%),#f2f5fa} .landing-page .hero-art .ring-two{border-color:color-mix(in srgb,var(--accent-purple) 30%,transparent)} .landing-page .hero-art .art-glow{background:radial-gradient(circle,color-mix(in srgb,var(--accent-purple) 18%,transparent),transparent 68%)} .landing-page .landing-nav nav>a:not(.button):hover,.landing-page .text-link:hover,.landing-page .package-link:hover,.landing-page .landing-footer>a:hover{color:var(--accent-purple)} .landing-page .game-card .eyebrow,.landing-page .game-card-tags{color:var(--accent-purple)} .landing-page .game-card:hover,.landing-page .package-card:hover,.landing-page .station-card:hover{border-color:color-mix(in srgb,var(--accent-purple) 45%,var(--line));box-shadow:0 14px 36px color-mix(in srgb,var(--accent-purple) 12%,transparent)} .landing-page .package-card.group-value:hover{border-color:var(--accent-purple);box-shadow:0 14px 38px color-mix(in srgb,var(--accent-purple) 18%,transparent)} .landing-page .availability-summary{border-color:color-mix(in srgb,var(--accent-purple) 28%,transparent);background:linear-gradient(100deg,color-mix(in srgb,var(--accent-purple) 8%,transparent),#151923)} :root[data-theme="light"] .landing-page .availability-summary{background:linear-gradient(100deg,#f1ebf8,#fff);border-color:#d7c8e9} .home-floorplan a.map-station.available:hover{border-color:var(--accent-purple);box-shadow:0 0 32px color-mix(in srgb,var(--accent-purple) 48%,transparent)} .booking-progress li[aria-current="step"]{box-shadow:inset 0 -2px var(--accent-purple)} .booking-progress li[aria-current="step"] b{color:var(--accent-purple)} .booking-box .map-station.selected,.booking-box .station-option.selected{outline-color:var(--accent-purple);box-shadow:0 0 24px color-mix(in srgb,var(--accent-purple) 40%,transparent)} :root[data-theme="light"] .booking-box .map-station.selected,:root[data-theme="light"] .booking-box .station-option.selected{outline-color:var(--accent-purple);box-shadow:0 0 18px color-mix(in srgb,var(--accent-purple) 22%,transparent)} .landing-page .hero-art{background-image:radial-gradient(ellipse at 84% 16%,color-mix(in srgb,var(--accent-purple) 18%,transparent),transparent 41%),radial-gradient(ellipse at 55% 47%,#302a43 0,#161722 48%,#10121a 76%)} :root[data-theme="light"] .landing-page .hero-art{background-image:radial-gradient(ellipse at 84% 16%,color-mix(in srgb,var(--accent-purple) 26%,transparent),transparent 42%),radial-gradient(ellipse at 55% 46%,#292b3d 0,#151824 51%,#0d1018 78%)} html{scroll-behavior:smooth;scroll-padding-top:24px} .loading-screen{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at 50% 42%,#171b28 0,#0b0d14 62%,#08090e 100%);transition:opacity .42s ease,visibility .42s ease} .loading-screen::before,.loading-screen::after{position:absolute;content:"";width:min(72vw,620px);aspect-ratio:1;border:1px solid #b9ff4517;border-radius:50%;pointer-events:none;animation:loader-orbit 12s linear infinite} .loading-screen::after{width:min(54vw,450px);border-color:#bd91ff26;border-style:dashed;animation-direction:reverse;animation-duration:19s} .loading-screen.is-hidden{opacity:0;visibility:hidden;pointer-events:none} .loading-screen-card{position:relative;z-index:1;width:min(420px,100%);display:grid;justify-items:center;gap:18px;padding:42px 28px;border:1px solid #ffffff18;border-radius:24px;background:linear-gradient(145deg,#151923ed,#0f1119ed);box-shadow:0 24px 90px #0008,0 0 60px #bd91ff0b;text-align:center;overflow:hidden} .loading-screen-card::before{position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,#b9ff45aa,#bd91ffbb,transparent);content:""} .loading-orbit{position:absolute;top:24px;width:88px;height:88px;border:1px solid #bd91ff45;border-radius:50%;animation:loader-pulse 2s ease-in-out infinite} .loading-orbit::before,.loading-orbit::after{position:absolute;inset:9px;border:1px solid #b9ff4538;border-radius:50%;content:""} .loading-orbit::after{inset:20px;border-style:dashed;border-color:#bd91ff60;animation:loader-orbit 8s linear infinite} .loading-orbit span{position:absolute;top:-3px;left:50%;width:7px;height:7px;border-radius:50%;background:#b9ff45;box-shadow:0 0 14px #b9ff45;transform:translateX(-50%)} .loading-logo{position:relative;width:min(260px,82%);height:74px;margin-top:36px;object-fit:contain} .loading-title{color:#eef0f8;font:700 11px/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:.2em} .loading-meter{width:min(230px,85%);height:3px;overflow:hidden;border-radius:9px;background:#ffffff18} .loading-meter i{display:block;width:42%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#b9ff45,#bd91ff);box-shadow:0 0 12px #bd91ff;animation:loader-progress 1.35s ease-in-out infinite} .loading-screen-card p{margin:0;color:#9ca6bb;font-size:12px} @keyframes loader-progress{0%{transform:translateX(-110%)}100%{transform:translateX(350%)}} @keyframes loader-orbit{to{transform:rotate(360deg)}} @keyframes loader-pulse{50%{transform:scale(1.08);opacity:.65}} @media(prefers-reduced-motion:reduce){.loading-screen,.loading-orbit,.loading-orbit::after,.loading-meter i,.loading-screen::before,.loading-screen::after{animation:none!important;transition:none!important}.loading-screen{opacity:0;visibility:hidden}} @media(max-width:600px){ .landing-nav{height:auto;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;gap:10px;padding:12px 14px;overflow:visible} .landing-nav .landing-brand{justify-self:center;min-width:0;max-width:100%} .landing-nav .landing-brand .ve-logo{width:clamp(145px,48vw,190px);max-height:48px} .landing-nav nav{position:static;inset:auto;display:flex;width:100%;min-width:0;justify-content:center;align-items:center;gap:clamp(3px,2vw,10px);overflow:visible} .landing-nav nav>a:not(.button){display:grid;place-items:center;flex:1 1 0;min-width:0;min-height:44px;padding:10px 4px;text-align:center;white-space:nowrap;font-size:clamp(12px,3.5vw,13px)} .landing-nav nav .theme-toggle{flex:0 0 auto;min-height:44px;padding:7px 10px;white-space:nowrap} } /* Complete light palette: pearl surfaces, ink text, with green and purple brand accents. */ :root[data-theme="light"] .landing-page{ --bg:#f4f5fa;--surface:#fff;--surface2:#f7f7fb;--ink:#1a2030;--muted:#566176;--line:#d9dce7; --accent:#47730d;--accent-soft:#eaf3dc; background:radial-gradient(ellipse at 12% 0%,#e7e9f8 0,transparent 36%),radial-gradient(ellipse at 92% 10%,#e5f0e7 0,transparent 32%),#f4f5fa; color:#1a2030 } :root[data-theme="light"] .landing-page .hero-art{ --hero-accent:#47730d; color:#1a2030;border-color:#d7d9e5; background:radial-gradient(ellipse at 82% 18%,#dfd3f233 0,transparent 38%),radial-gradient(ellipse at 23% 82%,#dff0d833 0,transparent 42%),linear-gradient(145deg,#fff,#f0f1f8); box-shadow:0 24px 64px #27334c20,0 0 0 5px #ffffffc9 } :root[data-theme="light"] .landing-page .hero-art .scene-title{color:#1a2030;text-shadow:none} :root[data-theme="light"] .landing-page .hero-art .scene-title em{color:#47730d;text-shadow:0 2px 0 #47730d18} :root[data-theme="light"] .landing-page .hero-art .scene-kicker,:root[data-theme="light"] .landing-page .hero-art .scene-subtitle{color:#566176} :root[data-theme="light"] .landing-page .hero-art .art-tag,:root[data-theme="light"] .landing-page .hero-art-caption{color:#566176} :root[data-theme="light"] .landing-page .hero-art .art-tag strong,:root[data-theme="light"] .landing-page .hero-art-caption b{color:#1a2030} :root[data-theme="light"] .landing-page .hero-art .art-grid{opacity:.3;background-image:linear-gradient(#59627c12 1px,transparent 1px),linear-gradient(90deg,#59627c12 1px,transparent 1px)} :root[data-theme="light"] .landing-page .hero-art .art-ring{border-color:#47730d2b} :root[data-theme="light"] .landing-page .hero-art .ring-two{border-color:#7952ae42} :root[data-theme="light"] .landing-page .hero-art .art-glow{background:radial-gradient(circle,#bd91ff30 0,#b9ff4517 42%,transparent 72%);filter:blur(38px)} :root[data-theme="light"] .landing-page .hero-art::after{background:linear-gradient(180deg,transparent 0%,#7952ae00 44%,#7952ae12 50%,#7952ae00 56%,transparent 100%)} :root[data-theme="light"] .landing-page .hero-art:hover{border-color:#9a7ac5;box-shadow:0 26px 72px #27334c24,0 0 34px #7952ae16,0 0 0 5px #ffffffc9} :root[data-theme="light"] .landing-page .closing-cta{color:#1a2030;background:radial-gradient(ellipse at 84% 22%,#bd91ff20 0,transparent 34%),linear-gradient(115deg,#fff,#f0f2f8);border-color:#d3d4e2;box-shadow:0 14px 38px #27334c10} :root[data-theme="light"] .landing-page .closing-cta h2{color:#1a2030} :root[data-theme="light"] .landing-page .closing-cta p{color:#566176} :root[data-theme="light"] .landing-page .closing-cta .eyebrow{color:#47730d} :root[data-theme="light"] .landing-page .availability-summary{color:#566176;background:linear-gradient(100deg,#f0ebf7,#fff);border-color:#d9cce9} :root[data-theme="light"] .landing-page .availability-summary strong{color:#1a2030} :root[data-theme="light"] .floorplan-wrap{background:#f0f1f7;border-color:#d8dce6} :root[data-theme="light"] .floorplan{background-color:#f7f6f1;border-color:#c9ccd3;box-shadow:inset 0 0 0 3px #e3e2dc,0 8px 24px #27334c12} :root[data-theme="light"] .plan-depth-label{color:#374052} :root[data-theme="light"] .plan-walkway{background:linear-gradient(90deg,#e7e5dc,#f7f6ef 50%,#e7e5dc);color:#424a57;border-color:#aab0b8} :root[data-theme="light"] .plan-zone{color:#354052;background:linear-gradient(145deg,#f5f3eb,#ebe8dc);border-color:#c9c2b2;box-shadow:inset 0 0 0 3px #ffffffa8} :root[data-theme="light"] .plan-waiting{background:linear-gradient(145deg,#efedf7,#e5e2f0);border-color:#c6bfd8} :root[data-theme="light"] .map-station{color:#263247;background:linear-gradient(145deg,#fff,#eef1f6);border-color:#c3cbd7;box-shadow:0 4px 14px #27334c18,inset 0 0 0 2px #ffffffb0} :root[data-theme="light"] .map-station .room-label,:root[data-theme="light"] .map-station::after{color:#566176} :root[data-theme="light"] .map-station::before{color:#47730d} :root[data-theme="light"] .map-station.available{color:#233814;background:linear-gradient(145deg,#eff9df,#e1f1c8);border-color:#88ad51} :root[data-theme="light"] .map-station.booked{color:#3e4a5d;background:linear-gradient(145deg,#edf0f5,#e3e7ed);border-color:#b7c0ce} :root[data-theme="light"] .map-station.occupied{color:#65450e;background:linear-gradient(145deg,#fff5df,#f8e9c8);border-color:#d8b46b} :root[data-theme="light"] .map-station.unavailable{color:#713744;background:linear-gradient(145deg,#fceef0,#f4dfe3);border-color:#d5a6af} :root[data-theme="light"] .map-station.selected{color:#1e2b12;background:linear-gradient(145deg,#e6f6c8,#d5eea9);border-color:#6f9c32;box-shadow:0 0 0 3px #47730d20,0 5px 16px #27334c18} :root[data-theme="light"] .map-station.selected .room-label,:root[data-theme="light"] .map-station.selected::before,:root[data-theme="light"] .map-station.selected::after{color:#344b20} :root[data-theme="light"] .toast{color:#20283a;background:#fff;border:1px solid #d8dce7;box-shadow:0 12px 34px #27334c20} :root[data-theme="light"] .loading-screen{background:radial-gradient(ellipse at 50% 45%,#fff 0,#f0eff8 64%,#e8edf4 100%)} :root[data-theme="light"] .loading-screen::before{border-color:#47730d22} :root[data-theme="light"] .loading-screen::after{border-color:#7952ae35} :root[data-theme="light"] .loading-screen-card{background:linear-gradient(145deg,#ffffffef,#f6f5f9ef);border-color:#d8d8e5;box-shadow:0 24px 70px #27334c18,0 0 50px #7952ae0c} :root[data-theme="light"] .loading-title{color:#1a2030} :root[data-theme="light"] .loading-screen-card p{color:#566176} /* Keep the hero copy left-aligned; center only the brand animation and booking CTA. */ .landing-page .hero-copy{display:block;text-align:left} .landing-page .hero-copy .eyebrow{justify-content:flex-start} .landing-page .hero-copy>p{margin-inline:0} .landing-page .hero-meta{justify-content:flex-start} .landing-page .hero-actions{width:100%;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:12px} .landing-page .hero-actions .button.big{align-self:auto;width:auto;min-width:220px;margin:0;justify-content:center} .landing-page .hero-actions .text-link{align-self:auto} .packages-section .section-heading{width:100%;justify-items:start;text-align:left} .packages-section .section-heading>div{width:100%;max-width:none} .landing-page .hero-art{display:grid;place-items:center} .landing-page .hero-scene{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;padding:0 clamp(16px,4vw,42px);box-sizing:border-box;display:grid;align-content:center;justify-items:center;text-align:center;pointer-events:none} .landing-page .scene-title{display:grid;width:fit-content;max-width:100%;justify-items:center;margin:.16em 0 .11em;text-align:center} .landing-page .scene-title>span,.landing-page .scene-title>em{display:block;max-width:100%;text-align:center} /* Use the supplied shop-layout image beneath live station controls. */ .home-floorplan{height:auto;min-height:0;max-height:none}.home-floorplan,.booking-box #floorplan{background-image:url('/layout.png')!important;background-position:center;background-repeat:no-repeat;background-size:100% 100%;background-color:#101720} .home-floorplan .map-station,.booking-box #floorplan .map-station{justify-content:flex-end;padding:5px 4px 10%;border-color:#b9ff45;background:linear-gradient(180deg,#07101808 28%,#07101828 54%,#071018e8 100%)!important;color:#fff;text-shadow:0 1px 5px #000;box-shadow:0 2px 12px #0008,inset 0 0 0 1px #ffffff55} .home-floorplan .map-station::before,.home-floorplan .map-station::after,.booking-box #floorplan .map-station::before,.booking-box #floorplan .map-station::after{content:none} .home-floorplan .map-station .room-label,.booking-box #floorplan .map-station .room-label{color:#e8edf3;font-size:clamp(9px,1.5vw,12px)} .home-floorplan .map-station.booked,.booking-box #floorplan .map-station.booked{border-color:#c7cbd1;background:linear-gradient(180deg,#12182008 26%,#12182032 54%,#151a20eb 100%)!important;color:#fff} .home-floorplan .map-station.occupied,.booking-box #floorplan .map-station.occupied{border-color:#ffbd59;background:linear-gradient(180deg,#16100808 26%,#16100838 54%,#281909ed 100%)!important;color:#fff} .home-floorplan .map-station.unavailable,.booking-box #floorplan .map-station.unavailable{border-color:#ff767f;background:linear-gradient(180deg,#1a080908 26%,#1a080938 54%,#2c1114ed 100%)!important;color:#fff} .home-floorplan .map-station.selected,.booking-box #floorplan .map-station.selected{outline:3px solid #c18aff;outline-offset:2px;border-color:#c18aff;background:linear-gradient(180deg,#100b1908 26%,#100b1938 54%,#21152fed 100%)!important;color:#fff} /* Bring the purple brand accent forward throughout the light theme. */ :root[data-theme="light"] .landing-page{background-image:radial-gradient(ellipse at 10% 5%,#e9e0f5 0,transparent 40%),radial-gradient(ellipse at 90% 12%,#e7e1f2 0,transparent 36%),radial-gradient(ellipse at 88% 78%,#e7edf8 0,transparent 35%),#f4f5fa} :root[data-theme="light"] .landing-page .section-heading .eyebrow,:root[data-theme="light"] .landing-page .closing-cta .eyebrow,:root[data-theme="light"] .landing-page .text-link{color:var(--accent-purple)} :root[data-theme="light"] .landing-page .landing-nav nav>a:not(.button):hover,:root[data-theme="light"] .landing-page .landing-footer>a:hover,:root[data-theme="light"] .landing-page .package-link:hover{color:var(--accent-purple-strong)} :root[data-theme="light"] .landing-page .availability-control{border-color:#d3c6e5;box-shadow:0 6px 22px #6840a20b} :root[data-theme="light"] .landing-page .availability-control label{color:#6840a2} :root[data-theme="light"] .landing-page .package-card,:root[data-theme="light"] .landing-page .game-card{border-color:#d9d1e6} :root[data-theme="light"] .landing-page .package-card.group-value{border-color:#c5d1ac} :root[data-theme="light"] .landing-page .package-card.group-value .package-tag{color:#59328e;background:#f0eafb;border:1px solid #d8c9eb;border-radius:999px;padding:3px 7px} :root[data-theme="light"] .landing-page .package-card:hover,:root[data-theme="light"] .landing-page .game-card:hover{border-color:#9b7bc0;box-shadow:0 14px 36px #6840a21a} :root[data-theme="light"] .landing-page .package-card.group-value:hover{border-color:#6840a2} :root[data-theme="light"] .landing-page .availability-summary{background:linear-gradient(105deg,#efe8f7,#fff 66%);border-color:#cdbce2} :root[data-theme="light"] .landing-page .availability-summary .live-dot{background:var(--accent-purple);box-shadow:0 0 12px #6840a266} :root[data-theme="light"] .landing-page .button.primary{box-shadow:0 5px 16px #6840a222} :root[data-theme="light"] .landing-page .button.primary:hover{box-shadow:0 7px 22px #6840a244} :root[data-theme="light"] .booking-box .booking-progress{background:#f2edf8;border-color:#d9cde8} :root[data-theme="light"] .booking-box .booking-progress li[aria-current="step"]{background:linear-gradient(90deg,#ece3f6,#f8f5fb);color:#3b2853} :root[data-theme="light"] .booking-box .booking-progress li[aria-current="step"] b{color:#6840a2} :root[data-theme="light"] .booking-box .station-picker{border-color:#d8cbe8;box-shadow:0 5px 20px #6840a20a} :root[data-theme="light"] .booking-box .station-option.selected{background:#f0eafb;color:#39264f;border-color:#6840a2} :root[data-theme="light"] .booking-box .map-station.selected{border-color:#bd91ff;outline-color:#6840a2;box-shadow:0 0 0 3px #6840a222,0 0 22px #6840a233} :root[data-theme="light"] .panel{border-color:#d8d4e3} :root[data-theme="light"] .panel:focus-within{border-color:#9b7bc0;box-shadow:0 0 0 2px #6840a21b,var(--shadow)} :root[data-theme="light"] button:focus-visible,:root[data-theme="light"] input:focus-visible,:root[data-theme="light"] select:focus-visible,:root[data-theme="light"] textarea:focus-visible,:root[data-theme="light"] a:focus-visible{outline-color:#6840a2} :root[data-theme="light"] .landing-page .section-heading h2{position:relative;padding-bottom:10px} :root[data-theme="light"] .landing-page .section-heading h2::after{position:absolute;left:14px;bottom:0;width:56px;height:3px;border-radius:99px;background:linear-gradient(90deg,#6840a2,#bd91ff);box-shadow:0 2px 8px #6840a233;content:""} /* Readable gaming-style type scale: bold display titles, clear labels, no microcopy. */ .landing-page .eyebrow{font-size:12px;font-weight:750;letter-spacing:.12em} .landing-page .section-heading h2{font-weight:800;letter-spacing:-.045em} .landing-page .hero-meta{font-size:12px} .landing-page .package-tag{font-size:10px;font-weight:800;letter-spacing:.06em} .landing-page .package-players{font-size:12px} .landing-page .package-offer{font-size:11px;line-height:1.4} .landing-page .package-link{font-size:12px;font-weight:700} .landing-page .availability-pill{font-size:10px} .landing-page .station-cta{font-size:11px} .landing-page .game-readiness,.landing-page .game-players{font-size:11px} .landing-page .game-card p{font-size:13px;line-height:1.55} @media(max-width:600px){ .landing-page .hero-meta{font-size:10px} .landing-page .package-tag{font-size:9px} .landing-page .package-players{font-size:11px} .landing-page .package-offer{font-size:9px} .landing-page .package-link{font-size:11px} .landing-page .availability-pill{font-size:9px} .landing-page .station-cta{font-size:10px} } /* Keep the booking action balanced with the adjacent package link. */ .landing-page .hero-actions{padding-left:10px} .landing-page .hero-actions .button.big{min-height:48px;min-width:205px;padding-inline:18px;font-size:13px} .landing-page .hero-actions{justify-content:center;padding-left:0} @media(max-width:600px){ .landing-page .hero-actions{justify-content:center;padding-left:0} .landing-page .hero-actions .button.big{min-width:190px} } .booking-box #success{padding:0;background:transparent;color:inherit} .booking-receipt{max-width:620px;margin:8px auto;padding:26px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,var(--surface),var(--surface2));color:var(--ink);box-shadow:var(--shadow)} .receipt-header{display:flex;align-items:center;gap:14px;padding-bottom:20px;border-bottom:1px solid var(--line)} .receipt-check{flex:none;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#15200b;font-size:24px;font-weight:800} .receipt-header h2{margin:2px 0;font-size:25px;letter-spacing:-.04em} .receipt-header p{margin:0;color:var(--muted);font-size:13px} .receipt-header .receipt-kicker{color:var(--accent);font-size:10px;font-weight:800;letter-spacing:.14em} .receipt-status{margin-left:auto;padding:7px 10px;border:1px solid color-mix(in srgb,var(--accent) 44%,transparent);border-radius:999px;color:var(--accent);font-size:10px;letter-spacing:.08em} .receipt-reference{display:grid;gap:5px;margin:18px 0;padding:13px 15px;border:1px dashed var(--line);border-radius:10px} .receipt-reference span,.receipt-details dt{color:var(--muted);font-size:11px;font-weight:650;letter-spacing:.04em;text-transform:uppercase} .receipt-reference strong{font-size:20px;letter-spacing:.07em} .receipt-details{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin:0} .receipt-details>div{padding:13px 0;border-bottom:1px solid var(--line)} .receipt-details dd{margin:5px 0 0;font-size:14px;font-weight:650} .receipt-details .receipt-total{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;border-bottom:0} .receipt-details .receipt-total dd{font-size:22px} .receipt-arrival{margin:8px 0 18px;padding:12px 14px;border-left:3px solid var(--accent-purple,#a970ff);border-radius:0 8px 8px 0;background:color-mix(in srgb,var(--accent-purple,#a970ff) 9%,var(--surface));color:var(--muted);font-size:12px;line-height:1.55} .receipt-arrival strong{color:var(--ink)} .receipt-print{width:100%;color:#111!important} @media(max-width:520px){.booking-receipt{padding:18px}.receipt-header{gap:10px}.receipt-header h2{font-size:21px}.receipt-status{font-size:9px;padding:6px 8px}.receipt-details{gap:0 12px}} @media print{ @page{size:auto;margin:14mm} body{background:#fff!important;color:#111!important} body *{visibility:hidden!important} .booking-box #success,.booking-box #success *{visibility:visible!important} .booking-box #success{position:absolute!important;inset:0 auto auto 0!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;background:#fff!important;color:#111!important} .booking-box #success .booking-receipt{max-width:620px;margin:0 auto;padding:24px;border:1px solid #d4d8df;border-radius:12px;background:#fff!important;color:#111!important;box-shadow:none} .booking-box #success .receipt-check{background:#b9ff45!important;-webkit-print-color-adjust:exact;print-color-adjust:exact} .booking-box #success .receipt-header,.booking-box #success .receipt-details>div{border-color:#d4d8df} .booking-box #success .receipt-header p,.booking-box #success .receipt-reference span,.booking-box #success .receipt-details dt,.booking-box #success .receipt-arrival{color:#505968!important} .booking-box #success .receipt-header .receipt-kicker,.booking-box #success .receipt-status{color:#42670d!important} .booking-box #success .receipt-status{border-color:#91bc4d} .booking-box #success .receipt-arrival{background:#f5f2fa!important;border-color:#8b5cc7;-webkit-print-color-adjust:exact;print-color-adjust:exact} .booking-box #success .receipt-arrival strong{color:#111!important} .booking-box #success .receipt-print{display:none!important} } /* Keep footer contact details and links in clear, aligned groups. */ .landing-page .landing-footer{display:grid;grid-template-columns:minmax(170px,.9fr) minmax(250px,1.2fr) minmax(250px,1.3fr) auto;align-items:center;gap:24px;padding:24px 28px 30px} .landing-page .landing-footer .landing-brand{margin:0;justify-self:start} .footer-contact,.footer-location{display:grid;align-content:center;gap:7px;min-width:0} .footer-contact{grid-template-columns:repeat(2,max-content);gap:7px 15px} .footer-label{grid-column:1/-1;color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase} .landing-page .landing-footer .footer-contact>a,.landing-page .landing-footer .footer-location>a,.landing-page .landing-footer .footer-social>a{width:max-content;color:var(--ink);font-size:12px;line-height:1.4} .landing-page .landing-footer .footer-contact>a:hover,.landing-page .landing-footer .footer-location>a:hover,.landing-page .landing-footer .footer-social>a:hover{color:var(--accent)} .landing-page .landing-footer .footer-location address{max-width:340px;color:var(--muted);font-size:11px;line-height:1.55} .landing-page .landing-footer .footer-social{display:flex;justify-content:flex-end;align-items:center;gap:14px;flex-wrap:wrap} .landing-page .landing-footer [hidden]{display:none!important} @media(max-width:900px){.landing-page .landing-footer{grid-template-columns:1fr 1fr;gap:22px}.landing-page .landing-footer .footer-social{justify-content:flex-start}} @media(max-width:560px){.landing-page .landing-footer{grid-template-columns:1fr;gap:18px;padding:22px 18px 26px}.landing-page .landing-footer .landing-brand .ve-logo{width:min(170px,100%)}.footer-contact{grid-template-columns:repeat(2,max-content)}.landing-page .landing-footer .footer-social{gap:18px}} .landing-page .game-card-tags{display:block;margin:5px 0 8px;line-height:1.45} .booking-footer{width:min(920px,100%);margin:20px auto 0;padding:22px 16px 28px;border-top:1px solid var(--line);display:grid;grid-template-columns:minmax(150px,.8fr) minmax(220px,1fr) minmax(240px,1.2fr);align-items:center;gap:24px;color:var(--muted)} .booking-footer-brand{display:block;width:max-content;max-width:100%} .booking-footer-brand .ve-logo{display:block;width:min(175px,100%);height:auto;object-fit:contain} .booking-footer-contact,.booking-footer-location{display:grid;align-content:center;gap:7px;min-width:0} .booking-footer-contact>span{color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase} .booking-footer-contact>a,.booking-footer-location>a{width:max-content;color:var(--ink);font-size:12px;line-height:1.4;text-decoration:none} .booking-footer-contact>a:hover,.booking-footer-location>a:hover{color:var(--accent-purple,#a970ff)} .booking-footer-location address{font-size:11px;font-style:normal;line-height:1.55} :root[data-theme="light"] .booking-footer{border-color:#d8cbe8} :root[data-theme="light"] .booking-footer-contact>a,:root[data-theme="light"] .booking-footer-location>a{color:#26344b} @media(max-width:700px){.booking-footer{grid-template-columns:minmax(0,1fr);gap:18px;padding:20px 6px 25px}.booking-footer-brand,.booking-footer-location{grid-column:auto}.booking-footer-brand .ve-logo{width:min(160px,100%)}.booking-footer-contact>a,.booking-footer-location>a{width:auto;overflow-wrap:anywhere}} .booking-box .form{align-items:start} .booking-box .form .field{align-content:start;align-self:start;width:100%} .booking-box .form .field>label{min-height:20px;line-height:20px} #booking-summary{padding:18px 20px;line-height:1.45;background:linear-gradient(145deg,var(--surface),var(--surface2))} .booking-summary-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px} .booking-summary-head>strong{font-size:16px} .summary-status{padding:4px 9px;border-radius:999px;font-size:10px;font-weight:750;white-space:nowrap} .summary-status.ready{background:#b9ff4520;color:#9fdc36} .summary-status.incomplete{background:#a970ff20;color:#c49aff} .summary-next{margin:0 0 12px;color:var(--muted);font-size:13px} .booking-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px;margin:0} .booking-summary-grid>div{min-width:0;padding:10px 0;border-top:1px solid var(--line)} .booking-summary-grid dt{color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase} .booking-summary-grid dd{margin:4px 0 0;color:var(--ink);font-size:14px;font-weight:650;overflow-wrap:anywhere} .booking-summary-grid .summary-games,.booking-summary-grid .summary-perk{grid-column:1/-1} .booking-summary-grid .summary-perk dd{color:#a8e94d} .booking-summary-grid .summary-price{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px} .booking-summary-grid .summary-price dd{font-size:19px} .summary-footnote,.summary-offer{margin:10px 0 0;color:var(--muted);font-size:11px} .summary-offer{color:#a8e94d} .booking-box .arrival-policy{padding:15px 18px;border:1px solid #a970ff40;border-left:3px solid #a970ff;border-radius:12px;background:linear-gradient(110deg,#a970ff12,#1b2730 58%);color:#c7d7dc;line-height:1.6} .booking-box .arrival-policy strong{display:block;margin-bottom:4px;color:var(--ink);font-size:14px} .booking-box .arrival-policy p{margin:0;font-size:13px} :root[data-theme="light"] .booking-box .arrival-policy{background:linear-gradient(110deg,#f1eaf9,#f7f9fc);border-color:#d8cbe8;border-left-color:#7952ae;color:#4e596e} :root[data-theme="light"] .booking-box .arrival-policy strong{color:#26344b} :root[data-theme="light"] #booking-summary{background:linear-gradient(145deg,#fff,#f7f5fa)} :root[data-theme="light"] .summary-status.ready{background:#e9f5d8;color:#3e6614} :root[data-theme="light"] .summary-status.incomplete{background:#f0eafb;color:#6840a2} :root[data-theme="light"] .summary-next{border-color:#e1b957;border-left-color:#b77700;background:#fff7df;box-shadow:0 6px 18px #68400012} :root[data-theme="light"] .summary-next li::marker{color:#a76700} :root[data-theme="light"] .booking-summary-grid .summary-perk dd,:root[data-theme="light"] .summary-offer{color:#4e781b} @media(max-width:520px){#booking-summary{padding:15px}.booking-summary-grid{grid-template-columns:1fr;gap:0}.booking-summary-grid .summary-games,.booking-summary-grid .summary-perk,.booking-summary-grid .summary-price{grid-column:auto}.booking-summary-grid .summary-price{align-items:flex-start;flex-direction:column;gap:2px}} /* Customer game requests */ .landing-page .game-request-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.85fr);align-items:start;gap:28px;margin-top:24px;padding:24px;border:1px solid color-mix(in srgb,var(--accent-purple) 24%,var(--line));border-radius:18px;background:linear-gradient(125deg,color-mix(in srgb,var(--accent-purple) 9%,var(--surface)),var(--surface));} .landing-page .game-request-panel h3{margin:8px 0;font-size:clamp(20px,2.4vw,27px)} .landing-page .game-request-panel p{max-width:56ch;margin:0;color:var(--muted);line-height:1.55} .landing-page .game-request-form{display:grid;gap:9px} .landing-page .game-request-form label{font-size:12px;font-weight:700;color:var(--muted)} .landing-page .game-request-form label span{font-weight:400} .landing-page .game-request-form select,.landing-page .game-request-form input,.landing-page .game-request-form textarea{width:100%;min-height:42px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-raised,var(--surface));color:var(--text);font:inherit} .landing-page .game-request-form textarea{resize:vertical;min-height:68px} .landing-page .game-request-form [hidden]{display:none} .landing-page .game-request-form .button{justify-self:start} .landing-page .game-request-status{min-height:1.3em;font-size:13px} :root[data-theme="light"] .landing-page .game-request-panel{background:linear-gradient(125deg,#f2ecfa,#fff);border-color:#d7c8e9} :root[data-theme="light"] .landing-page .game-request-form select,:root[data-theme="light"] .landing-page .game-request-form input,:root[data-theme="light"] .landing-page .game-request-form textarea{background:#fff;border-color:#cfc4df;color:#182237} @media(max-width:700px){.landing-page .game-request-panel{grid-template-columns:1fr;gap:18px;padding:18px}.landing-page .game-request-form .button{width:100%}} /* Initial brand reveal: the original VE artwork is separated into two transparent halves. */ .loading-screen{inset:auto;top:0;left:0;width:100vw;height:100vh;height:100dvh;pointer-events:none;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 48%,#171322 0,#0a0b12 61%,#07080d 100%);transition:opacity .46s ease,visibility .46s ease} .loading-screen::before{width:min(88vw,940px);border-color:#b9ff4515;animation-duration:18s} .loading-screen::after{width:min(68vw,700px);border-color:#bd68ff2b;animation-duration:22s} .loading-screen-card{width:100%;max-width:100vw;min-width:0;grid-template-columns:minmax(0,1fr);justify-items:center;gap:13px;padding:24px 18px;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible} .loading-screen-card::before{display:none} .loading-logo-stack{position:relative;width:min(100%,1000px);aspect-ratio:1784/882;display:grid;place-items:center;isolation:isolate} .loading-banner{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:scale(.72);filter:drop-shadow(0 0 24px #bd68ff37) drop-shadow(0 0 18px #52ff6d25);transition:opacity 1.45s cubic-bezier(.2,.75,.15,1),transform 1.7s cubic-bezier(.16,.76,.18,1)} .ve-split-mark{position:absolute;left:50%;top:50%;width:min(62%,470px);aspect-ratio:605/540;transform:translate(-50%,-50%);filter:drop-shadow(0 0 18px #bd68ff45) drop-shadow(0 0 20px #55ff6a36);} .loading-ve-half{position:absolute;inset:0;width:100%;height:100%;display:block;will-change:transform,opacity;} .loading-ve-half img{width:100%;height:100%;object-fit:contain} .ve-split-mark::before,.ve-split-mark::after{position:absolute;top:49%;width:29%;height:2px;content:"";opacity:0;pointer-events:none} .ve-split-mark::before{left:15%;background:linear-gradient(90deg,transparent,#e229ffb8);box-shadow:0 0 12px #e229ff75} .ve-split-mark::after{right:15%;background:linear-gradient(90deg,#61ff75b8,transparent);box-shadow:0 0 12px #61ff7575} .split-flare{position:absolute;z-index:3;left:50%;top:50%;width:10%;height:10%;border-radius:50%;opacity:0;pointer-events:none;transform:translate(-50%,-50%);background:radial-gradient(circle,#fff 0 3%,#fff7 10%,#f12bffbd 24%,#bd68ff45 47%,transparent 72%);filter:blur(1px)} .split-flare::before{position:absolute;content:"";left:50%;top:50%;width:clamp(120px,28vw,390px);height:2px;transform:translate(-50%,-50%);background:linear-gradient(90deg,transparent,#bd68ff,#fff,#b9ff45,transparent);box-shadow:0 0 12px #bd68ff,0 0 24px #b9ff45} .split-spark{position:absolute;z-index:3;left:50%;top:50%;width:5px;height:5px;border-radius:50%;opacity:0;pointer-events:none;background:#fff;box-shadow:0 0 7px 2px #bd68ff,0 0 14px 3px #b9ff45} .split-spark-one{--spark-x:-min(22vw,250px);--spark-y:-min(11vw,110px)}.split-spark-two{--spark-x:min(22vw,250px);--spark-y:min(12vw,120px)} .loading-title{margin-top:-3px;color:#f2efff;font-size:clamp(11px,1.25vw,14px);letter-spacing:.28em;text-shadow:0 0 18px #bd68ff45} .loading-meter{width:min(220px,55vw);height:3px;background:#ffffff18} .loading-meter i{background:linear-gradient(90deg,#bd68ff,#f12bff,#b9ff45);box-shadow:0 0 16px #bd68ff} .loading-screen-card p{min-height:1.2em;color:#b2aec5;font-size:12px} .intro-skip{position:fixed;top:max(18px,env(safe-area-inset-top));right:max(18px,env(safe-area-inset-right));z-index:3;pointer-events:auto;padding:9px 13px;border:1px solid #ffffff35;border-radius:999px;background:#10121ddb;color:#f3f0ff;font:600 12px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer;backdrop-filter:blur(12px)} .intro-skip:hover{border-color:#bd68ff;color:#fff} .loading-screen.is-splitting .loading-ve-left{animation:ve-left-exit .76s cubic-bezier(.68,0,.18,1) forwards} .loading-screen.is-splitting .loading-ve-right{animation:ve-right-exit .76s cubic-bezier(.68,0,.18,1) forwards} .loading-screen.is-splitting .ve-split-mark::before{animation:ve-left-trail .62s ease-out forwards} .loading-screen.is-splitting .ve-split-mark::after{animation:ve-right-trail .62s ease-out forwards} .loading-screen.is-splitting .split-flare{animation:ve-split-flare .58s cubic-bezier(.16,.76,.18,1) forwards} .loading-screen.is-splitting .split-spark{animation:ve-split-spark .66s cubic-bezier(.16,.76,.18,1) forwards} .loading-screen.is-splitting .loading-title,.loading-screen.is-splitting .loading-meter,.loading-screen.is-splitting #loading-status{opacity:0;transition:opacity .35s ease} .loading-screen.is-revealing .loading-banner{opacity:1;transform:scale(1)} @keyframes ve-left-exit{0%{transform:translateX(0);opacity:1}35%{filter:drop-shadow(0 0 26px #f12bff9a)}100%{transform:translateX(-112vw) rotate(-2deg);opacity:0}} @keyframes ve-right-exit{0%{transform:translateX(0);opacity:1}35%{filter:drop-shadow(0 0 26px #55ff6a9a)}100%{transform:translateX(112vw) rotate(2deg);opacity:0}} @keyframes ve-left-trail{0%{opacity:0;transform:translateX(0) scaleX(.3);transform-origin:right}20%{opacity:.8}100%{opacity:0;transform:translateX(-70%) scaleX(1);transform-origin:right}} @keyframes ve-right-trail{0%{opacity:0;transform:translateX(0) scaleX(.3);transform-origin:left}20%{opacity:.8}100%{opacity:0;transform:translateX(70%) scaleX(1);transform-origin:left}} :root[data-theme="light"] .loading-screen{background:radial-gradient(ellipse at 50% 44%,#fff 0,#f4f1fb 53%,#e8eaf4 100%)} :root[data-theme="light"] .loading-screen::before{border-color:#74a51a24} :root[data-theme="light"] .loading-screen::after{border-color:#8852c52d} :root[data-theme="light"] .loading-title{color:#20263a;text-shadow:0 1px 14px #a970ff45} :root[data-theme="light"] .loading-meter{background:#19203920} :root[data-theme="light"] .loading-screen-card p{color:#59627a} :root[data-theme="light"] .intro-skip{border-color:#6f789333;background:#ffffffc9;color:#20263a;box-shadow:0 5px 22px #29304a14} :root[data-theme="light"] .intro-skip:hover{border-color:#8054c8;color:#52348d} :root[data-theme="light"] .loading-screen-card{background:transparent;border:0;box-shadow:none} @keyframes ve-split-flare{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}18%{opacity:1;transform:translate(-50%,-50%) scale(1.25)}58%{opacity:.78}100%{opacity:0;transform:translate(-50%,-50%) scale(1.8)}} @keyframes ve-split-spark{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}20%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--spark-x)),calc(-50% + var(--spark-y))) scale(0)}} @media(max-width:600px){.loading-screen-card{padding:20px 12px}.loading-logo-stack{width:min(100%,1000px)}.ve-split-mark{width:min(64%,250px)}.loading-title{letter-spacing:.19em}.intro-skip{top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right))}} @media(prefers-reduced-motion:reduce){.loading-screen,.loading-screen::before,.loading-screen::after,.loading-screen-card,.loading-orbit,.loading-meter i,.loading-ve-half,.loading-banner,.split-flare,.split-spark{animation:none!important;transition:opacity .18s ease,visibility .18s ease!important}.loading-screen{opacity:1;visibility:visible}.loading-screen.is-hidden{opacity:0;visibility:hidden}.loading-banner{transform:none}.loading-screen.is-revealing .loading-banner{transform:none}} /* Keep the hero booking label vertically centered inside its taller CTA. */ .landing-page .hero-actions>a.button.primary.big{display:inline-flex;align-items:center;line-height:1.2;position:relative;top:2px} /* Booking game discovery: shuffle covers for a random, station-compatible suggestion. */ .booking-box .booking-game-cards[hidden],.booking-box .optional-game-content .game-controls[hidden],.booking-box .game-recommendation[hidden]{display:none!important} .booking-box .game-recommendation{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:12px 0;padding:14px 16px;border:1px solid color-mix(in srgb,#a970ff 42%,var(--line));border-radius:12px;background:linear-gradient(115deg,color-mix(in srgb,#a970ff 12%,var(--surface)),color-mix(in srgb,#b9ff45 6%,var(--surface)))} .booking-box .game-recommendation .eyebrow{color:#a970ff;font-size:10px;font-weight:800;letter-spacing:.13em} .booking-box .game-recommendation p{margin:4px 0 0;color:var(--muted);font-size:13px;line-height:1.5} .booking-box .game-recommendation-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap} .booking-box .game-recommendation-actions .text-link{padding:7px 4px;border:0;background:transparent;color:var(--muted);font:600 12px/1.3 ui-sans-serif,system-ui,sans-serif;cursor:pointer} .booking-box .game-recommendation-actions .text-link:hover{color:#a970ff} .booking-box .booking-game-card{position:relative;cursor:default} .booking-box label.booking-game-card{cursor:pointer} .booking-box .booking-game-cover{display:block;width:100%;height:120px;object-fit:cover;background:var(--surface2)} .booking-box .booking-game-card.recommended{border-color:#a970ff;box-shadow:0 0 0 2px #a970ff30,0 9px 25px #a970ff19} .booking-box .booking-game-badge{position:absolute;top:8px;left:8px;padding:4px 7px;border-radius:999px;background:#a970ff;color:#fff;font-size:9px;font-weight:800;letter-spacing:.08em} .booking-box .booking-game-cards.is-shuffling .booking-game-card{animation:booking-game-shuffle .42s cubic-bezier(.18,.75,.24,1) both;animation-delay:calc(var(--card-index,0)*22ms)} :root[data-theme="light"] .booking-box .game-recommendation{border-color:#d5c5e9;background:linear-gradient(115deg,#f2ebfa,#f5f8ef)} :root[data-theme="light"] .booking-box .game-recommendation .eyebrow{color:#7044a6} :root[data-theme="light"] .booking-box .game-recommendation-actions .text-link{color:#505a70} @keyframes booking-game-shuffle{from{opacity:.45;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}} @media(max-width:600px){.booking-box .game-recommendation{align-items:flex-start;flex-direction:column}.booking-box .game-recommendation-actions{justify-content:flex-start}.booking-box .booking-game-cover{height:155px}} @media(prefers-reduced-motion:reduce){.booking-box .booking-game-card,.booking-box .booking-game-cards.is-shuffling .booking-game-card{animation:none!important;transition:none!important;transform:none!important}} .booking-box .booking-game-card.station-available .booking-game-copy small:first-of-type{color:#9fe870}.booking-box .booking-game-card.station-unavailable .booking-game-copy small:first-of-type{color:var(--muted)} /* Make the room map legible and use its side space for station selection. */ .booking-box .floorplan-wrap{display:grid;grid-template-columns:minmax(0,360px) minmax(220px,1fr);gap:16px;align-items:stretch;padding:14px;border-color:#39445a;background:radial-gradient(ellipse at 80% 15%,#a970ff18,transparent 45%),linear-gradient(145deg,#151b29,#0d111b)} .booking-box #floorplan{width:100%;min-width:0;min-height:0;max-height:none;align-self:start;border:1px solid #65718a;border-radius:12px;box-shadow:0 8px 24px #0006,inset 0 0 0 3px #ffffff18} .booking-box #floorplan .map-station{gap:7px;padding:5px 4px 9%;} .booking-box #floorplan .map-station .room-label{padding:5px 8px;border-radius:999px;background:#080c16e8;color:#f4f5fb!important;font-size:clamp(9px,1.2vw,12px);font-weight:850;letter-spacing:.11em;text-shadow:none;box-shadow:0 2px 8px #0008} .booking-box #floorplan .map-station strong{max-width:100%;padding:5px 9px;border:1px solid #b9ff45;border-radius:7px;background:#080c16ed;color:#c1ff57!important;font-size:clamp(12px,1.45vw,17px);line-height:1.1;text-shadow:none;box-shadow:0 2px 9px #0009} .booking-box #floorplan .map-station-status{max-width:100%;padding:5px 7px;border-radius:6px;background:#080c16ed;color:#fff!important;font-size:clamp(8px,1vw,11px);font-weight:800;line-height:1.15;text-shadow:none;box-shadow:0 2px 8px #0008;text-align:center} .booking-box #floorplan .map-station.selected .room-label{background:#241636;color:#fff!important} .booking-box #floorplan .map-station.selected strong{background:#26183b;color:#e6ceff!important;border-color:#d2a6ff} .booking-box .station-floorplan-side{display:flex;flex-direction:column;gap:18px;min-width:0;padding:clamp(12px,2vw,22px);border:1px solid #343d51;border-radius:12px;background:linear-gradient(160deg,#ffffff08,transparent 60%),#101520} .booking-box .station-floorplan-intro{display:grid;gap:8px} .booking-box .station-floorplan-intro .eyebrow{color:#c7a0ff;font-size:10px;font-weight:850;letter-spacing:.16em} .booking-box .station-floorplan-intro strong{font-size:clamp(18px,2vw,24px);letter-spacing:-.035em} .booking-box .station-floorplan-intro p{margin:0;color:var(--muted);font-size:13px;line-height:1.55} .booking-box .station-floorplan-side .accessible-station-list{margin:0} .booking-box .station-floorplan-side .accessible-station-list legend{margin-bottom:9px;color:var(--ink);font-size:12px;font-weight:750} .booking-box .station-floorplan-side .station-list{display:grid;grid-template-columns:1fr;gap:8px} .booking-box .station-floorplan-side .station-option{min-height:58px;padding:11px 12px;text-align:left;font-size:13px;font-weight:750;line-height:1.4;border-color:#526078;background:#1a2231;color:#e8edf7} .booking-box .station-floorplan-side .station-option.available{border-color:#83bf39;background:linear-gradient(100deg,#243725,#18251c);color:#d8ff9e} .booking-box .station-floorplan-side .station-option.selected{outline:2px solid #c18aff;outline-offset:1px;border-color:#d2a6ff;background:linear-gradient(100deg,#372248,#241832);color:#f4e8ff} /* Moving dotted edge makes bookable stations easy to spot on the floor plan. */ .home-floorplan .map-station.available,.booking-box #floorplan .map-station.available{position:absolute;border-color:#b9ff45;box-shadow:0 0 0 1px #b9ff4580,0 0 18px #b9ff4555,0 2px 12px #0008,inset 0 0 0 1px #ffffff55} .home-floorplan .map-station.available::after,.booking-box #floorplan .map-station.available::after{content:"";position:absolute;inset:3px;z-index:2;border-radius:7px;pointer-events:none;background:linear-gradient(90deg,#c7ff63 50%,transparent 50%) 0 0/12px 2px repeat-x,linear-gradient(90deg,#c7ff63 50%,transparent 50%) 0 100%/12px 2px repeat-x,linear-gradient(0deg,#c7ff63 50%,transparent 50%) 0 0/2px 12px repeat-y,linear-gradient(0deg,#c7ff63 50%,transparent 50%) 100% 0/2px 12px repeat-y;animation:station-dots-march .8s linear infinite} @keyframes station-dots-march{to{background-position:12px 0,-12px 100%,0 12px,100% -12px}} @media(prefers-reduced-motion:reduce){.home-floorplan .map-station.available::after,.booking-box #floorplan .map-station.available::after{animation:none}} .navigation-loader{position:fixed;z-index:10000;inset:0;display:grid;place-content:center;justify-items:center;gap:11px;overflow:hidden;background:radial-gradient(ellipse at 50% 43%,#211832f4,#090b12f8 72%);color:#f5f3ff;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .28s ease,visibility .28s ease} .navigation-loader::before,.navigation-loader::after{position:absolute;content:"";width:min(76vw,620px);aspect-ratio:1;border:1px solid #b9ff4520;border-radius:50%;pointer-events:none;animation:nav-loader-orbit 16s linear infinite} .navigation-loader::after{width:min(57vw,460px);border-color:#bd91ff35;border-style:dashed;animation-direction:reverse;animation-duration:23s} .navigation-loader.is-visible,html.booking-arrival .navigation-loader{opacity:1;visibility:visible} .navigation-loader.is-hidden{opacity:0;visibility:hidden} .navigation-loader-orbit{position:relative;z-index:1;display:grid;place-items:center;width:min(64vw,310px);aspect-ratio:1;margin-bottom:2px;border:1px solid #ffffff14;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,#bd91ff 13%,transparent),transparent 69%);box-shadow:0 0 70px #bd91ff16,inset 0 0 48px #b9ff4508} .navigation-loader-orbit::before,.navigation-loader-orbit::after{position:absolute;inset:8%;border:1px solid #b9ff4522;border-radius:50%;content:"";animation:nav-loader-orbit 11s linear infinite} .navigation-loader-orbit::after{inset:17%;border-color:#bd91ff30;border-style:dashed;animation-direction:reverse;animation-duration:17s} .navigation-loader-orbit>span{position:absolute;width:12px;height:12px;border-radius:50%;background:#b9ff45;box-shadow:0 0 18px #b9ff45aa;animation:nav-loader-pulse 1.4s ease-in-out infinite} .navigation-loader-orbit img{position:relative;z-index:1;width:74%;height:auto;max-height:58%;object-fit:contain;filter:drop-shadow(0 0 16px #a970ff45);animation:nav-loader-logo 1.8s ease-in-out infinite alternate} .navigation-loader strong{position:relative;z-index:1;color:#f4f3fb;font-size:12px;font-weight:850;letter-spacing:.2em;text-align:center} .navigation-loader>small{position:relative;z-index:1;color:#a9a4bb;font-size:9px;font-weight:700;letter-spacing:.18em} .navigation-loader-mark{position:relative;z-index:1;height:25px;display:flex;align-items:center;gap:4px;margin-top:4px} .navigation-loader-mark i{display:block;width:6px;height:10px;border-radius:5px;background:#b9ff45;box-shadow:0 0 12px #b9ff4570;animation:nav-loading-pulse .72s ease-in-out infinite alternate} .navigation-loader-mark i:nth-child(2){height:21px;animation-delay:.12s}.navigation-loader-mark i:nth-child(3){height:15px;animation-delay:.24s}.navigation-loader-mark i:nth-child(4){height:9px;animation-delay:.36s} @keyframes nav-loading-pulse{to{transform:scaleY(.55);opacity:.58}} @keyframes nav-loader-orbit{to{transform:rotate(360deg)}} @keyframes nav-loader-pulse{50%{transform:scale(.68);opacity:.62;box-shadow:0 0 8px #b9ff4570}} @keyframes nav-loader-logo{to{transform:scale(1.035);filter:drop-shadow(0 0 24px #a970ff70)}} :root[data-theme="light"] .navigation-loader{background:radial-gradient(ellipse at 50% 43%,#f7f2fffa,#e9eaf3f7 72%);color:#252239} :root[data-theme="light"] .navigation-loader-orbit{border-color:#7952ae35;background:radial-gradient(circle,#b98cff1c,transparent 69%);box-shadow:0 0 70px #7952ae12,inset 0 0 48px #60952b0a} :root[data-theme="light"] .navigation-loader-orbit::before{border-color:#689b3430}:root[data-theme="light"] .navigation-loader-orbit::after{border-color:#7952ae35} :root[data-theme="light"] .navigation-loader strong{color:#272239}:root[data-theme="light"] .navigation-loader>small{color:#626076} @media(max-width:600px){.navigation-loader{gap:9px}.navigation-loader-orbit{width:min(72vw,260px)}.navigation-loader strong{font-size:11px;letter-spacing:.16em}.navigation-loader>small{font-size:8px}} @media(prefers-reduced-motion:reduce){.navigation-loader,.navigation-loader-mark i,.navigation-loader-orbit,.navigation-loader-orbit::before,.navigation-loader-orbit::after,.navigation-loader-orbit img,.navigation-loader-orbit>span{transition:none;animation:none!important}} .booking-box .station-floorplan-side .station-option.booked,.booking-box .station-floorplan-side .station-option.occupied,.booking-box .station-floorplan-side .station-option.unavailable{opacity:.82} :root[data-theme="light"] .booking-box .floorplan-wrap{border-color:#d5c9e5;background:radial-gradient(ellipse at 80% 15%,#a970ff20,transparent 45%),linear-gradient(145deg,#f0eafb,#edf0f7)} :root[data-theme="light"] .booking-box .station-floorplan-side{border-color:#d8c9e9;background:linear-gradient(160deg,#fff9,transparent 60%),#f5f1fa} :root[data-theme="light"] .booking-box .station-floorplan-intro strong,:root[data-theme="light"] .booking-box .station-floorplan-side .accessible-station-list legend{color:#20263a} :root[data-theme="light"] .booking-box .station-floorplan-intro p{color:#59647a} :root[data-theme="light"] .booking-box .station-floorplan-side .station-option{border-color:#c9bdd8;background:#fff;color:#31344a} :root[data-theme="light"] .booking-box .station-floorplan-side .station-option.available{border-color:#83aa54;background:#edf7e0;color:#314b1a} :root[data-theme="light"] .booking-box .station-floorplan-side .station-option.selected{border-color:#956bc2;background:#f0eafb;color:#422568} @media(max-width:700px){.booking-box .floorplan-wrap{grid-template-columns:minmax(0,1fr);justify-items:center}.booking-box #floorplan{width:min(100%,360px)}.booking-box .station-floorplan-side{width:100%;box-sizing:border-box}.booking-box .station-floorplan-side .station-list{grid-template-columns:repeat(2,minmax(0,1fr))}} .landing-nav{position:sticky!important;top:0;z-index:40;background:color-mix(in srgb,var(--page) 92%,transparent);backdrop-filter:blur(14px);box-shadow:0 6px 20px #00000010} .quick-jump-bar{position:fixed;z-index:60;left:50%;bottom:max(10px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:6px;max-width:calc(100vw - 20px);padding:7px;border:1px solid var(--line);border-radius:999px;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(16px);box-shadow:0 8px 30px #0005;overflow-x:auto;scrollbar-width:none} .quick-jump-bar::-webkit-scrollbar{display:none} .quick-jump-bar a{flex:0 0 auto;padding:9px 12px;border-radius:999px;color:var(--ink);font-size:12px;font-weight:750;text-decoration:none;white-space:nowrap} .quick-jump-bar a:hover,.quick-jump-bar a[href="/booking"]{background:var(--accent);color:#11170b} .landing-page{padding-bottom:76px} .clock-format-control{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:10px;font-weight:700} .clock-format-control select{min-height:34px;padding:5px 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font-size:11px} .required-mark{color:#ff765f;font-weight:900;margin-left:3px} .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} .arrival-acknowledgement{display:flex;align-items:flex-start;gap:9px;margin-top:14px;font-weight:700} .arrival-acknowledgement input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--accent);flex:0 0 auto} .landing-page .game-card{min-width:0} .landing-page .game-card img{height:clamp(105px,15vw,170px);object-fit:cover} .landing-page .game-card .game-art-placeholder{height:clamp(105px,15vw,170px);display:flex;flex-direction:column;justify-content:center;gap:6px} .landing-page .game-card>div:not(.game-art-placeholder){padding:10px 12px} .landing-page .game-card h3{font-size:clamp(13px,1.2vw,16px);line-height:1.25} .landing-page .game-card .eyebrow{display:block;font-size:9px;min-height:1.4em} .landing-page .game-card .game-readiness{display:inline-flex;margin-top:6px;padding:5px 8px;border-radius:999px;font-size:10px;font-weight:800} .landing-page .game-card.status-card-available{border-color:#86d95f;box-shadow:inset 0 3px 0 #8ee362} .landing-page .game-card.status-card-available .game-readiness{background:#e4f8d6;color:#275415} .landing-page .game-card.featured{border-color:#bd8eff;box-shadow:inset 0 3px 0 #bd8eff} .landing-page .game-card.featured .eyebrow{color:#c698ff} .landing-page .game-card.status-card-coming_soon .game-readiness{background:#e9e1ff;color:#57339b} .landing-page .game-card.status-card-proposed .game-readiness,.landing-page .game-card.status-card-unverified .game-readiness{background:#fff0c7;color:#725016} .landing-page .game-card.status-card-temporarily_unavailable .game-readiness{background:#ffe1e1;color:#812f35} :root[data-theme=light] .landing-page .home-floorplan .map-station{color:#10150b!important;text-shadow:none!important;font-weight:900;box-shadow:0 3px 14px #17220f38} :root[data-theme=light] .landing-page .map-station.booked,:root[data-theme=light] .landing-page .map-station.occupied,:root[data-theme=light] .landing-page .map-station.maintenance,:root[data-theme=light] .landing-page .map-station.unavailable{color:#161b25!important;text-shadow:none!important;font-weight:850} .booking-box .map-station.maintenance,.booking-box .station-option.maintenance{border-color:#9566cf;background:#302343;color:#efddff;box-shadow:none} .booking-box .legend-swatch.maintenance{background:#b891f5;border-color:#9566cf} :root[data-theme=light] .booking-box .map-station.maintenance,:root[data-theme=light] .booking-box .station-option.maintenance{background:#eee2ff;color:#45266d;border-color:#b391e4} .feedback-box .booking-top-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:20px} .feedback-box .booking-top-actions a{text-decoration:none} .feedback-box .brand{display:inline-flex;margin:0 0 20px} .feedback-box .brand .ve-logo{width:min(200px,60vw)} .feedback-box h1{margin:8px 0 12px;font-size:clamp(28px,5vw,42px)} .feedback-box .form{margin-top:22px} .feedback-footer{margin-top:24px;padding-top:16px;border-top:1px solid var(--line);font-size:13px} .feedback-footer a{color:var(--accent-purple,#b990ff)} @media(max-width:600px){.landing-nav{top:0}.landing-page .game-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.landing-page .game-card img,.landing-page .game-card .game-art-placeholder{height:112px}.landing-page .game-card>div:not(.game-art-placeholder){padding:8px}.landing-page .game-card h3{font-size:13px}.quick-jump-bar{bottom:max(8px,env(safe-area-inset-bottom));max-width:calc(100vw - 14px)}.quick-jump-bar a{padding:8px 10px;font-size:11px}.landing-page{padding-bottom:68px}.clock-format-control select{max-width:140px}} @media(prefers-reduced-motion:reduce){.booking-box .booking-game-cards.is-shuffling .booking-game-card{animation:none!important}} .game-edit-form .game-simple-field{align-items:center;gap:14px;padding:10px 12px} .game-edit-form .game-simple-field legend{padding:0 5px;color:var(--muted);font-size:12px} .game-edit-form .game-simple-field label,.game-edit-form .game-featured{display:inline-flex;align-items:center;gap:7px} .game-edit-form .game-simple-field input,.game-edit-form .game-featured input{width:16px;height:16px;accent-color:var(--accent)} .landing-page .package-price-discount{display:grid;justify-items:start;gap:7px;margin:18px 0 0} .landing-page .package-price-line{display:flex;align-items:baseline;gap:9px;min-width:0;white-space:nowrap} .landing-page .package-price-line del{color:#8993a7;font-size:16px;font-weight:650;letter-spacing:-.03em;text-decoration-color:#ff7182;text-decoration-thickness:2px;text-decoration-skip-ink:none} .landing-page .package-price-line strong{color:var(--accent);font-size:30px;letter-spacing:-.055em;line-height:1} .landing-page .package-price-line>span{color:#9ba4b5;font-size:10px} .landing-page .package-price-discount .package-saving{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border:1px solid #b9ff4540;border-radius:999px;background:linear-gradient(90deg,#b9ff4518,#b9ff4508);color:#c9ff70;font-size:10px;font-weight:750;letter-spacing:.015em;line-height:1.2} .landing-page .package-price-discount .package-saving::before{content:"↓";font-size:12px;font-weight:900} :root[data-theme="light"] .landing-page .package-price-line del{color:#737e8f;text-decoration-color:#c74358} :root[data-theme="light"] .landing-page .package-price-line strong{color:#4f7413} :root[data-theme="light"] .landing-page .package-price-line>span{color:#59665f} :root[data-theme="light"] .landing-page .package-price-discount .package-saving{border-color:#719a3840;background:linear-gradient(90deg,#9ccc5830,#9ccc5813);color:#456c12} @media(max-width:600px){.landing-page .package-price-line{gap:7px}.landing-page .package-price-line del{font-size:14px}.landing-page .package-price-line strong{font-size:26px}.landing-page .package-price-discount .package-saving{font-size:9px;padding:4px 8px}} /* Accessible, compact refinements for the customer journey. */ .landing-page .landing-nav{position:sticky!important;top:0;z-index:80;background:var(--bg)!important;backdrop-filter:none!important;border-bottom:1px solid var(--line);box-shadow:0 5px 18px #00000012} .landing-page .clock-format-control{padding:5px 8px;border:1px solid var(--line);border-radius:9px;background:var(--surface);white-space:nowrap} .landing-page .clock-format-control select{min-height:28px;border:0;background:transparent;color:var(--ink);font:inherit;cursor:pointer} .landing-page .quick-jump-bar{display:none!important}.landing-page{padding-bottom:0!important} .landing-page .game-mode-label{display:inline-flex;width:max-content;max-width:100%;margin-top:6px;padding:3px 7px;border:1px solid #ae7bed40;border-radius:999px;background:#ae7bed12;color:#d7b5ff;font-size:9px;font-weight:700;line-height:1.3} :root[data-theme="light"] .landing-page .game-mode-label{border-color:#8059a53d;background:#8059a510;color:#603d88} :root[data-theme="light"] .landing-page .home-floorplan .map-station .room-label{display:inline-block;padding:4px 7px;border:1px solid #ffffff55;border-radius:7px;background:#211a2eeF;color:#fff!important;font-weight:850;text-shadow:none;box-shadow:0 2px 8px #0005} :root[data-theme="light"] .landing-page .home-floorplan .map-station strong{display:inline-block;padding:3px 6px;border-radius:5px;background:#fffF;color:#17151c!important;font-weight:900;text-shadow:none;box-shadow:0 2px 8px #0003} :root[data-theme="light"] .landing-page .home-floorplan .map-station>span:not(.room-label){display:inline-block;padding:3px 6px;border-radius:5px;background:#fffF;color:#17151c!important;font-weight:850;text-shadow:none;box-shadow:0 2px 8px #0003} :root[data-theme="light"] .landing-page .landing-nav{background:#f6f8f5!important} :root[data-theme="light"] .landing-page .clock-format-control{background:#fff;color:#344139} :root[data-theme="light"] .landing-page .clock-format-control select{color:#17211d} .day-slots-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:9px}.day-slots-heading strong{font-size:13px}.day-slots-heading small{color:var(--muted);font-size:10px} .day-slot-options{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(102px,1fr));gap:7px!important;max-height:310px;overflow:auto;padding:2px 4px 5px 0} .day-slot{display:grid!important;justify-items:start;gap:3px;min-height:53px!important;padding:7px 9px!important;text-align:left;white-space:normal!important} .day-slot>span{font-size:12px;font-weight:800}.day-slot>small{font-size:9px;color:var(--muted)}.day-slot.slot-free{border-color:#9fe87088;color:var(--ink)}.day-slot.is-current{outline:2px solid var(--accent);outline-offset:1px}.day-slot.slot-busy{opacity:.64;cursor:not-allowed} .summary-next{margin:0 0 14px;padding:14px 16px;border:1px solid color-mix(in srgb,#ffbf47 48%,var(--line));border-left:4px solid #ffbf47;border-radius:12px;background:color-mix(in srgb,#ffbf47 10%,var(--surface));color:var(--ink);line-height:1.5;box-shadow:0 8px 22px #00000012} .summary-next strong{display:block;margin-bottom:3px;color:var(--ink);font-size:14px}.summary-next p{margin:0 0 7px;color:var(--muted);font-size:12px}.summary-next ul{display:flex;flex-wrap:wrap;gap:7px 16px;margin:0;padding-left:18px}.summary-next li{padding-right:3px;color:var(--ink);font-weight:600}.summary-next li::marker{color:#d99112} .game-shuffle-dialog{width:min(1500px,96vw);max-width:none;min-height:min(82vh,720px);max-height:94vh;padding:clamp(18px,3vw,32px);border:1px solid color-mix(in srgb,var(--accent-purple) 45%,var(--line));border-radius:22px;background:radial-gradient(ellipse at 80% 0%,color-mix(in srgb,var(--accent-purple) 18%,transparent),transparent 45%),var(--surface);color:var(--ink);box-shadow:0 30px 100px #0009;overflow:auto} .game-shuffle-dialog::backdrop{background:#05060bd9;backdrop-filter:blur(8px)}.shuffle-dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.shuffle-dialog-head .eyebrow{color:var(--accent)}.shuffle-dialog-head h2{margin:7px 0;font-size:clamp(22px,4vw,36px);letter-spacing:-.04em}.shuffle-dialog-head p{margin:0;color:var(--muted)} .shuffle-game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:12px;margin:22px 0;max-height:57vh;overflow:auto;padding:3px}.shuffle-game-card{position:relative;display:grid;align-content:start;gap:7px;min-width:0;padding:7px;border:1px solid var(--line);border-radius:13px;background:var(--surface2);transition:border-color .2s,transform .2s,opacity .2s,box-shadow .2s}.shuffle-game-card>img,.shuffle-art-fallback{width:100%;height:clamp(95px,15vw,150px);object-fit:cover;border-radius:8px;background:#090b12}.shuffle-art-fallback{display:grid;align-content:center;gap:5px;padding:10px;box-sizing:border-box;color:var(--ink)}.shuffle-art-fallback span{color:var(--accent);font-size:9px;font-weight:800;text-transform:uppercase}.shuffle-art-fallback strong{font-size:15px}.shuffle-game-card>strong{font-size:12px}.shuffle-game-card>small{color:var(--muted);font-size:9px}.game-shuffle-dialog.is-shuffling .shuffle-game-card{animation:shuffle-card .34s ease-in-out both;animation-delay:calc(var(--shuffle-index)*18ms)}.shuffle-game-grid.shuffle-tick .shuffle-game-card{transform:translateY(-4px) rotate(-1deg)}.shuffle-game-card.is-picked{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 34%,transparent),0 0 28px color-mix(in srgb,var(--accent) 25%,transparent);transform:translateY(-5px)}.shuffle-result{display:grid;gap:3px;margin:12px 0;padding:13px 16px;border:1px solid color-mix(in srgb,var(--accent) 55%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--accent) 10%,var(--surface));animation:shuffle-reveal .45s ease both}.shuffle-result span{color:var(--accent);font-size:10px;font-weight:850;letter-spacing:.12em}.shuffle-result strong{font-size:22px}.shuffle-dialog-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.shuffle-empty{grid-column:1/-1;color:var(--muted)} @keyframes shuffle-card{0%{opacity:.45;transform:translateY(12px) scale(.96) rotate(-2deg)}55%{opacity:1;transform:translateY(-5px) scale(1.02) rotate(1deg)}100%{transform:translateY(0) scale(1) rotate(0)}}@keyframes shuffle-reveal{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}} @media(max-width:600px){.day-slot-options{grid-template-columns:repeat(3,minmax(0,1fr));max-height:280px}.day-slot{min-height:49px!important;padding:6px!important}.game-shuffle-dialog{width:calc(100vw - 20px);min-height:0;max-height:92vh;padding:16px;border-radius:17px}.shuffle-game-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:56vh;gap:8px;margin:15px 0}.shuffle-game-card>img,.shuffle-art-fallback{height:100px}.shuffle-dialog-head{gap:8px}.shuffle-dialog-head .button{padding:7px}.shuffle-dialog-actions{display:grid;grid-template-columns:1fr 1fr}.shuffle-dialog-actions .text-link{grid-column:1/-1}.landing-page .clock-format-control{padding:3px 5px;font-size:9px}.landing-page .clock-format-control select{max-width:96px;font-size:9px}} @media(max-width:460px){.booking-box .booking-game-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px}.booking-box .booking-game-cover,.booking-box .booking-game-card .game-art-placeholder{height:92px!important}.booking-box .booking-game-copy{gap:3px;padding:7px}.booking-box .booking-game-copy strong{font-size:11px}.booking-box .booking-game-copy small{font-size:9px}.landing-page .landing-nav{padding:0 12px}.landing-page .landing-nav nav{gap:7px}.landing-page .landing-brand .ve-logo{width:32px}} @media print{ @page{size:A4 portrait;margin:8mm} html,body{width:100%!important;min-height:0!important;margin:0!important;padding:0!important;background:#fff!important;color:#111!important} body>*:not(.login){display:none!important}.login{display:block!important;min-height:0!important;margin:0!important;padding:0!important;background:#fff!important}.login>*:not(.booking-box){display:none!important} .booking-box{display:block!important;width:100%!important;max-width:none!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:#fff!important;box-shadow:none!important;color:#111!important} .booking-box>*:not(form){display:none!important}.booking-box form>*:not(#success){display:none!important}.booking-box #success{display:block!important;position:static!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;background:#fff!important;color:#111!important;visibility:visible!important} .booking-box #success *{visibility:visible!important}.booking-box #success .booking-receipt{display:block!important;max-width:180mm!important;margin:0 auto!important;padding:8mm!important;border:1px solid #cbd1da!important;border-radius:4mm!important;background:#fff!important;color:#111!important;box-shadow:none!important;break-inside:avoid!important;page-break-inside:avoid!important;font-size:10pt!important} .booking-box #success .receipt-header,.booking-box #success .receipt-details,.booking-box #success .receipt-details>div{break-inside:avoid!important;page-break-inside:avoid!important}.booking-box #success .receipt-print{display:none!important} } @media(prefers-reduced-motion:reduce){.game-shuffle-dialog.is-shuffling .shuffle-game-card,.shuffle-result{animation:none!important}.shuffle-game-card,.shuffle-game-grid.shuffle-tick .shuffle-game-card{transition:none!important;transform:none!important}} /* Shared public header and controls across home and booking. */ .landing-page .landing-nav,.booking-nav{width:100%;max-width:none;box-sizing:border-box;padding-inline:clamp(16px,4vw,56px);} .landing-brand .ve-logo{display:block;width:min(190px,24vw);height:62px;object-fit:contain;} .landing-nav nav .nav-book-now{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap;} .landing-nav .clock-format-control,.booking-nav .clock-format-control{color:var(--ink);background:var(--surface);border-color:var(--line);} .landing-nav .clock-format-control select,.booking-nav .clock-format-control select{color:var(--ink)!important;background:var(--surface)!important;} .landing-nav .clock-format-control select option,.booking-nav .clock-format-control select option{color:var(--ink);background:var(--surface);} .booking-nav{position:sticky;top:0;z-index:80;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:0 5px 18px #00000012;} .booking-nav nav>a:not(.button){color:var(--muted);text-decoration:none;} .booking-nav nav .theme-toggle{display:inline-flex!important;align-items:center;gap:5px;} .booking-nav{display:flex;align-items:center;justify-content:space-between;min-height:78px;padding-block:7px;} .booking-nav .landing-brand{display:flex;align-items:center;min-width:0;} .booking-nav .landing-brand .ve-logo{width:180px;max-width:56vw;height:64px;} .booking-nav nav{display:flex;align-items:center;justify-content:flex-end;margin-left:auto;} .tax-inclusive-note{display:block;margin-top:5px;color:var(--muted);font-size:10px;font-weight:600;letter-spacing:.01em;} .landing-page .package-price-discount .package-saving{display:none!important;} /* Keep the photographed station overlay readable and consistent in both themes. */ :root[data-theme="light"] .landing-page .home-floorplan .map-station{color:#fff!important;text-shadow:0 1px 5px #000!important;} :root[data-theme="light"] .landing-page .home-floorplan .map-station .room-label,:root[data-theme="light"] .landing-page .home-floorplan .map-station>span:not(.room-label){display:inline-block;padding:5px 8px;border:0;border-radius:999px;background:#080c16ed;color:#f4f5fb!important;font-size:clamp(8px,1vw,11px);font-weight:850;text-shadow:none;box-shadow:0 2px 8px #0008;} :root[data-theme="light"] .landing-page .home-floorplan .map-station strong{display:inline-block;padding:5px 9px;border:1px solid #b9ff45;border-radius:7px;background:#080c16ed;color:#c1ff57!important;font-size:clamp(12px,1.45vw,17px);font-weight:900;line-height:1.1;text-shadow:none;box-shadow:0 2px 9px #0009;} :root[data-theme="light"] .landing-page .home-floorplan .map-station.selected .room-label{background:#241636;color:#fff!important;} :root[data-theme="light"] .landing-page .home-floorplan .map-station.selected strong{background:#26183b;color:#e6ceff!important;border-color:#d2a6ff;} .availability-date-time{display:flex;gap:10px;align-items:center;} .availability-date-time input,.availability-date-time select{min-width:0;min-height:42px;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font:inherit;} .availability-date-time input{flex:1;} .availability-date-time select{width:150px;} .booking-header-brand{min-width:0;} .booking-nav .booking-home-link{display:inline-flex;align-items:center;justify-content:center;min-height:38px;margin-left:auto;white-space:nowrap;text-decoration:none} @media(max-width:700px){ .landing-brand .ve-logo{width:130px;height:52px;max-width:34vw;} .landing-page .landing-nav,.booking-nav{padding-inline:12px;gap:8px;} .landing-nav nav,.booking-nav nav{gap:7px;min-width:0;} .landing-nav nav>a:not(.button),.booking-nav nav>a:not(.button){display:none;} .landing-nav nav .button.small.theme-toggle,.booking-nav nav .button.small.theme-toggle{display:inline-flex!important;min-height:36px;padding:6px 9px;font-size:11px;} .landing-nav nav .nav-book-now,.booking-nav nav .nav-book-now{display:inline-flex!important;min-height:36px;padding:6px 10px;font-size:11px;} .landing-nav .clock-format-control,.booking-nav .clock-format-control{gap:3px;padding:3px 5px;font-size:9px;} .landing-nav .clock-format-control select,.booking-nav .clock-format-control select{max-width:86px;padding:4px;font-size:10px;} .booking-nav{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand controls" "home home";align-items:center;row-gap:5px;} .booking-nav .landing-brand{grid-area:brand} .booking-nav nav{grid-area:controls;margin:0;} .booking-nav .booking-home-link{grid-area:home;justify-self:start;margin:0;min-height:34px;padding:5px 10px;font-size:11px} .availability-date-time{gap:7px;} .availability-date-time select{width:126px;} } @media(max-width:390px){.landing-brand .ve-logo{width:108px;max-width:30vw}.landing-nav nav,.booking-nav nav{gap:5px}.landing-nav nav .nav-book-now,.booking-nav nav .nav-book-now{padding-inline:7px;font-size:10px}.landing-nav .clock-format-control,.booking-nav .clock-format-control{font-size:8px}.landing-nav .clock-format-control select,.booking-nav .clock-format-control select{max-width:74px;font-size:9px}} :root .staff-logo{display:block;width:132px;height:auto;max-height:70px;object-fit:contain} .sidebar .brand:has(.staff-logo){min-height:76px;gap:12px;align-items:center} .sidebar .brand .staff-logo{width:112px;max-height:66px} .booking-receipt .receipt-total dt small{display:block;color:var(--muted);font-size:.76rem;font-weight:500} .game-shuffle-dialog{color:var(--ink);background:var(--surface);border:1px solid var(--line)} .game-shuffle-dialog::backdrop{background:rgba(7,9,17,.78);backdrop-filter:blur(8px)} .tax-inclusive-note{display:inline-flex;grid-column:1/-1;align-items:center;gap:5px;width:max-content;max-width:100%;margin:3px 0 0;padding:4px 8px;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--accent) 8%,var(--surface));color:var(--muted);font-size:10px;font-weight:650;line-height:1.2;letter-spacing:.01em} .tax-inclusive-note::before{content:"✓";color:var(--accent);font-size:11px;font-weight:900} .landing-page .package-card{display:flex;flex-direction:column;min-height:0} .landing-page .package-price{display:grid;grid-template-columns:max-content auto;align-items:baseline;justify-content:start;column-gap:7px;row-gap:0} .landing-page .package-price .tax-inclusive-note{align-self:start} .landing-page .package-link{margin-top:auto} .landing-page .package-price-discount .tax-inclusive-note{margin-top:0} :root[data-theme="light"] .landing-page .tax-inclusive-note{border-color:#cbdcb4;background:#f2f8e9;color:#526144} :root[data-theme="light"] .landing-page .tax-inclusive-note::before{color:#56801d} @media(max-width:600px){.landing-page .tax-inclusive-note{padding:4px 7px;font-size:9px}} @media(max-width:700px){.sidebar .brand .staff-logo{width:88px;max-height:52px}.sidebar .brand:has(.staff-logo){gap:8px;flex-wrap:wrap}} .arrival-countdown{margin:5px 0 7px;color:var(--accent,#b8ff3b);font-size:12px;font-weight:700;letter-spacing:.02em} .arrival-decision{display:grid;gap:7px;min-width:190px;margin-top:8px}.arrival-decision input{width:100%;min-width:0}.arrival-decision .row{gap:6px;flex-wrap:wrap}.arrival-decision .button{white-space:nowrap} .day-slot.slot-extra{border-style:dashed;border-color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,var(--surface));} .package-duration-note{margin:14px 0 0;color:var(--muted);font-size:13px;line-height:1.6} @media(max-width:700px){ .landing-page .availability-control{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch;gap:10px} .landing-page .availability-date-control{display:grid;grid-template-columns:minmax(0,1fr);width:100%;min-width:0;gap:8px} .landing-page .availability-date-control>label{grid-column:auto} .landing-page .availability-date-time{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;min-width:0} .landing-page .availability-date-time input[type="date"],.landing-page .availability-date-time select{display:block;width:100%;min-width:0;max-width:100%;min-height:48px;padding:8px;font-size:14px} .landing-page .availability-control>#check-availability{width:100%;min-height:46px} .landing-page .availability-control>#slot-label{margin:0;min-height:1em} } /* Keep the homepage brand prominent and give mobile navigation its own row. */ @media(max-width:700px){ .landing-page .landing-nav{height:auto;min-height:0;display:flex;flex-wrap:wrap;gap:2px 0;padding:7px 14px 10px!important} .landing-page .landing-brand{flex:0 0 100%;min-height:70px;justify-content:center} .landing-page .landing-brand .ve-logo{width:180px!important;max-width:58vw!important;height:70px!important;object-fit:contain} .landing-page .landing-nav nav{order:2;display:flex;width:100%;justify-content:space-between;gap:8px!important;padding-top:5px} .landing-page .landing-nav nav>a:not(.button){display:none!important} .landing-page .landing-nav .clock-format-control{flex:1;min-width:0;justify-content:center;min-height:38px;padding-inline:8px;font-size:11px} .landing-page .landing-nav .clock-format-control select{max-width:150px!important;min-width:0;font-size:11px} .landing-page .landing-nav nav .nav-book-now{min-height:38px;padding-inline:14px!important;font-size:12px!important} .landing-page .landing-nav nav .theme-toggle{min-height:38px;padding-inline:11px!important;font-size:12px!important} } @media(max-width:360px){ .landing-page .landing-nav{padding-inline:10px!important} .landing-page .landing-brand .ve-logo{width:165px!important;height:64px!important} .landing-page .landing-nav nav{gap:5px!important} .landing-page .landing-nav .clock-format-control{padding-inline:5px;font-size:10px} .landing-page .landing-nav .clock-format-control select{max-width:112px!important;font-size:10px} .landing-page .landing-nav nav .nav-book-now,.landing-page .landing-nav nav .theme-toggle{padding-inline:8px!important;font-size:11px!important} } /* Make the homepage availability picker wide enough for native date controls. */ .landing-page .availability-control{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px 14px} .landing-page .availability-date-control{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;width:auto;min-width:0;align-items:start} .landing-page .availability-date-time{display:grid;grid-template-columns:minmax(180px,1fr) minmax(160px,190px);gap:10px;width:100%;max-width:520px;min-width:0} .landing-page .availability-date-time input[type="date"],.landing-page .availability-date-time select{box-sizing:border-box;width:100%;min-width:0;min-height:48px;padding:9px 12px;font-size:14px} .landing-page .availability-date-time input[type="date"]{min-width:180px} .landing-page .availability-date-time select{max-width:none} .landing-page .availability-control>#check-availability{grid-column:2;grid-row:1;align-self:end;min-height:48px;white-space:nowrap} .landing-page .availability-control>#slot-label{grid-column:2;grid-row:2;justify-self:end;margin:0;max-width:100%;font-size:11px;text-align:right} :root[data-theme="light"] .landing-page .availability-date-time input[type="date"],:root[data-theme="light"] .landing-page .availability-date-time select{color:#17211d;background:#fff} @media(max-width:700px){ .landing-page .availability-control{grid-template-columns:minmax(0,1fr);align-items:stretch} .landing-page .availability-date-time{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);max-width:none} .landing-page .availability-date-time input[type="date"]{min-width:0} .landing-page .availability-control>#check-availability,.landing-page .availability-control>#slot-label{grid-column:1;grid-row:auto;width:100%;justify-self:stretch;text-align:left} } @media(max-width:360px){.landing-page .availability-date-time{grid-template-columns:minmax(0,1fr)} } /* Keep game shuffle usable in narrow viewports and safe areas. */ .game-shuffle-dialog{box-sizing:border-box;width:min(1040px,calc(100vw - 32px));max-height:min(88dvh,820px);overflow:auto;overscroll-behavior:contain} .game-shuffle-dialog[open]{display:flex;flex-direction:column} .shuffle-dialog-head,.shuffle-dialog-actions,.shuffle-result{flex:0 0 auto} .shuffle-game-grid{flex:1 1 auto;min-height:0;grid-template-columns:repeat(auto-fill,minmax(clamp(112px,16vw,170px),1fr));max-height:48dvh} .shuffle-dialog-actions .shuffle-arrival,.booking-box .game-recommendation-actions .shuffle-arrival{border-color:var(--line);background:transparent;color:var(--muted);text-decoration:none} .shuffle-dialog-actions .shuffle-arrival:hover,.booking-box .game-recommendation-actions .shuffle-arrival:hover{border-color:var(--accent-purple);background:var(--accent-purple-soft);color:var(--ink)} @media(max-width:600px){ .game-shuffle-dialog{width:calc(100vw - 20px);max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 20px);padding:clamp(12px,4vw,16px);border-radius:17px} .shuffle-dialog-head h2{font-size:clamp(20px,6vw,26px)} .shuffle-game-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:43dvh;gap:8px;margin:12px 0} .shuffle-game-card{grid-template-columns:minmax(0,1fr);padding:6px;gap:5px} .shuffle-game-card>img,.shuffle-art-fallback{height:auto;aspect-ratio:1.4;min-height:0} .shuffle-game-card>strong{font-size:11px;line-height:1.25;overflow-wrap:anywhere} .shuffle-game-card>small{font-size:9px} .shuffle-result{margin:6px 0 10px;padding:11px 13px} .shuffle-result strong{font-size:clamp(19px,5vw,23px);overflow-wrap:anywhere} .shuffle-dialog-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .shuffle-dialog-actions>.button{min-width:0;min-height:44px;padding:8px;font-size:12px} .shuffle-dialog-actions .shuffle-arrival{grid-column:1/-1;min-height:40px} .booking-box .game-recommendation-actions .shuffle-arrival{flex:1 1 100%;min-height:40px} } @media(max-width:350px){.shuffle-dialog-actions{grid-template-columns:minmax(0,1fr)}.shuffle-dialog-actions .shuffle-arrival{grid-column:auto}} /* Keep tax information clear and understated alongside package prices. */ .landing-page .tax-inclusive-note{display:block;width:max-content;max-width:100%;margin:5px 0 0;padding:0;border:0;border-radius:0;background:transparent;color:var(--muted);font-size:10px;font-weight:550;line-height:1.35;letter-spacing:0} .landing-page .tax-inclusive-note::before{content:none;display:none} :root[data-theme="light"] .landing-page .tax-inclusive-note{border:0;background:transparent;color:var(--muted)} /* Keep the booking exit action grouped with the final submit action. */ .booking-box .form-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px} .booking-box .form-actions .booking-back{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 16px;border-color:var(--line);border-radius:11px;background:var(--surface2);color:var(--muted);font-size:13px;font-weight:700;text-decoration:none;transition:border-color .18s ease,color .18s ease,background .18s ease,transform .18s ease} .booking-box .form-actions .booking-back:hover{border-color:var(--accent-purple);background:var(--accent-purple-soft);color:var(--ink);transform:translateX(-2px)} .booking-box .form-actions .booking-back span{color:var(--accent-purple);font-size:17px;line-height:1} .booking-box .form-actions #confirm-booking{min-width:min(280px,58%);border-radius:11px} .summary-next{border-color:color-mix(in srgb,var(--accent-purple) 34%,var(--line));border-left:4px solid var(--accent-purple);background:linear-gradient(110deg,color-mix(in srgb,var(--accent-purple) 9%,var(--surface)),var(--surface2) 72%);box-shadow:0 8px 22px #00000012} .summary-next li::marker{color:var(--accent)} :root[data-theme="light"] .summary-next{border-color:color-mix(in srgb,var(--accent-purple) 34%,var(--line));border-left-color:var(--accent-purple);background:linear-gradient(110deg,color-mix(in srgb,var(--accent-purple) 7%,white),var(--surface2) 72%);box-shadow:0 6px 18px #38274b0e} :root[data-theme="light"] .summary-next li::marker{color:var(--accent-purple)} @media(max-width:600px){.booking-box .form-actions{align-items:stretch}.booking-box .form-actions .booking-back,.booking-box .form-actions #confirm-booking{min-width:0;min-height:46px;padding-inline:10px;font-size:11px}.booking-box .form-actions .booking-back{flex:0 0 auto}.booking-box .form-actions #confirm-booking{flex:1}} /* Staff operations: align the staff workspace with the Virtual Escape brand. */ .shell{--accent:#b9ff45;--accent-soft:color-mix(in srgb,#b9ff45 12%,var(--surface));--focus:#b9ff45;background:radial-gradient(ellipse at 80% -15%,#bd91ff12,transparent 40%),radial-gradient(ellipse at 15% 0%,#b9ff4509,transparent 34%),var(--bg)} .shell .sidebar{background:color-mix(in srgb,var(--surface) 91%,#11131d);border-color:color-mix(in srgb,#bd91ff 18%,var(--line))} .shell .brand{font-size:12px;letter-spacing:.12em;color:var(--muted)} .shell .nav{display:grid;align-content:start;gap:12px} .shell .nav-item{display:grid;gap:3px;min-width:0} .shell .nav-item>span{padding:5px 12px 2px;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase} .shell .nav button{width:100%;min-height:42px;border:1px solid transparent;border-radius:11px;font-weight:650;transition:background .16s ease,border-color .16s ease,transform .16s ease} .shell .nav button:hover{transform:translateX(2px)} .shell .nav button.active{background:linear-gradient(110deg,color-mix(in srgb,#b9ff45 15%,var(--surface)),color-mix(in srgb,#bd91ff 10%,var(--surface)));border-color:color-mix(in srgb,#b9ff45 26%,var(--line));color:var(--ink)} .shell .button.primary{background:#b9ff45;border-color:#b9ff45;color:#11150b} .shell .button.primary:hover{background:#c8ff70;border-color:#c8ff70;color:#11150b} .shell .mobile-staff-controls{display:contents} .shell .mobile-page-label,.shell .mobile-page-picker{display:none} .shell .sidebar-foot .clock-format-control{color:var(--muted)} .shell .sidebar-foot .clock-format-control select{max-width:100%;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:9px;padding:8px} .shell :focus-visible{outline:3px solid color-mix(in srgb,#b9ff45 78%,transparent);outline-offset:2px} .shell .main{min-width:0} .shell .content>*{min-width:0} .shell .tablewrap{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain} .shell table{min-width:620px} @media(max-width:900px){ .shell{display:block;width:100%;max-width:100%;overflow-x:clip} .shell .sidebar{position:sticky;top:0;z-index:30;display:grid;grid-template-columns:minmax(0,1fr);gap:10px;padding:8px clamp(12px,3vw,22px);border-right:0;border-bottom:1px solid color-mix(in srgb,#bd91ff 20%,var(--line));backdrop-filter:blur(18px)} .shell .brand{min-height:54px;padding:0;gap:10px} .shell .brand .staff-logo{width:112px;max-height:56px} .shell .nav{display:none} .shell .mobile-staff-controls{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;min-width:0} .shell .mobile-page-label{display:block;color:var(--muted);font-size:12px;font-weight:700} .shell .mobile-page-picker{display:block;width:100%;min-width:0;min-height:42px;padding:8px 34px 8px 11px;border:1px solid color-mix(in srgb,#bd91ff 25%,var(--line));border-radius:11px;background:var(--surface);color:var(--ink);font:inherit;font-size:14px} .shell .sidebar-foot{position:static;display:flex;align-items:center;justify-content:flex-end;gap:7px;margin:0} .shell .sidebar-foot .clock-format-control{display:flex;align-items:center;gap:5px;font-size:11px;white-space:nowrap} .shell .sidebar-foot .clock-format-control select{width:auto;max-width:118px;min-height:40px;padding:5px} .shell .sidebar-foot #staff-logout{min-height:40px;padding:6px 9px;white-space:nowrap} .shell .main{padding:clamp(18px,4vw,32px) clamp(12px,3vw,24px);overflow-x:clip} .shell .topline{align-items:flex-start;gap:10px;margin-bottom:20px} .shell .title{overflow-wrap:anywhere} .shell .userchip{flex:0 0 auto;max-width:42vw;overflow-wrap:anywhere} } @media(max-width:560px){ .shell .mobile-staff-controls{grid-template-columns:auto minmax(0,1fr);gap:6px} .shell .mobile-page-label{font-size:11px} .shell .mobile-page-picker{min-height:40px;font-size:13px} .shell .sidebar-foot{grid-column:1/-1;justify-content:space-between;padding:0 0 2px} .shell .sidebar-foot .clock-format-control{font-size:12px} .shell .sidebar-foot .clock-format-control select{max-width:150px} .shell .sidebar-foot #staff-logout{min-height:38px} .shell .topline{flex-direction:row;align-items:center} .shell .topline .eyebrow{max-width:58vw;font-size:11px} .shell .topline .title{font-size:clamp(23px,7vw,30px)} .shell .topline .subtitle{font-size:13px} .shell .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .shell .stat{padding:13px} .shell .stat strong{font-size:clamp(19px,6vw,25px);overflow-wrap:anywhere} .shell .panel{padding:14px} .shell .grid2,.shell .form{grid-template-columns:minmax(0,1fr);gap:12px} .shell .form .wide,.shell .form-actions{grid-column:1} .shell .form-actions{flex-wrap:wrap;justify-content:stretch} .shell .form-actions .button{flex:1 1 auto;min-height:42px} .shell dialog{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);padding:16px} .shell .toast{right:10px;bottom:max(10px,env(safe-area-inset-bottom));left:10px;text-align:center} } @media(max-width:360px){ .shell .brand .staff-logo{width:96px} .shell .brand{font-size:10px} .shell .sidebar{padding-inline:9px} .shell .main{padding-inline:9px} .shell .sidebar-foot .clock-format-control select{max-width:125px} .shell .userchip{font-size:12px;padding:6px 8px} } :root[data-theme="light"] .shell{--accent:#547d17;--accent-soft:#edf5df;--focus:#6c9a22;background:radial-gradient(ellipse at 80% -15%,#bd91ff12,transparent 40%),radial-gradient(ellipse at 15% 0%,#87ad3c10,transparent 34%),var(--bg)} :root[data-theme="light"] .shell .button.primary{background:#b9ff45;border-color:#9bc933;color:#171b10} .shell .sidebar{height:100vh;position:sticky;top:0;overflow:hidden} .shell .nav{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:3px} .shell .nav-group{display:grid;gap:3px;align-content:start} .shell .nav-group>span{padding:7px 12px 2px;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase} @media(max-width:900px){.shell .sidebar{height:auto;position:sticky;overflow:visible}.shell .nav{overflow:visible}}