:root{
  --navy:#031d42;--navy2:#062f68;--blue:#0a4a96;--yellow:#ffd414;--white:#fff;
  --soft:#b8d2f3;--green:#1fb66a;--orange:#f47b20;--red:#c63838;
}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#020f24;color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
button{font:inherit}.storefront{width:100%;height:100%;display:grid;grid-template-rows:auto 1fr auto;background:radial-gradient(circle at 50% -30%,rgba(27,105,193,.52),transparent 48%),linear-gradient(180deg,#073873,#031d42);position:relative;isolation:isolate}
.display-header,.display-footer{display:flex;align-items:center;justify-content:space-between;padding:clamp(14px,2.2vw,30px) clamp(18px,3.4vw,54px);gap:20px;z-index:2}
.display-header{border-bottom:1px solid rgba(150,200,255,.18)}.display-footer{border-top:1px solid rgba(150,200,255,.18);color:var(--soft);font-size:clamp(12px,1.2vw,19px)}
.display-brand{font-size:clamp(24px,3.5vw,56px);font-weight:950;letter-spacing:-.06em}.display-brand span:last-child{color:var(--yellow)}
.display-header-right{display:flex;align-items:center;gap:clamp(10px,1.4vw,20px)}.display-clock{font-size:clamp(18px,2vw,34px);font-weight:850;font-variant-numeric:tabular-nums}.sync-status{font-size:clamp(10px,.9vw,14px);font-weight:900;letter-spacing:.12em;padding:7px 10px;border-radius:999px;border:1px solid rgba(150,200,255,.32);color:var(--yellow)}.sync-status.online{color:#62df9a;border-color:rgba(98,223,154,.45)}.sync-status.offline{color:#ff9696;border-color:rgba(255,90,90,.4)}
.fullscreen-button{border:1px solid rgba(150,200,255,.28);background:rgba(255,255,255,.05);color:#fff;border-radius:12px;width:44px;height:44px;cursor:pointer;font-size:22px}
.display-content{min-height:0;display:grid;place-items:center;padding:clamp(18px,3vw,54px);position:relative}
.hero-card{width:min(92%,1400px);min-height:min(68vh,760px);border-radius:clamp(24px,3vw,52px);padding:clamp(30px,5vw,88px);display:grid;place-items:center;text-align:center;border:1px solid rgba(150,200,255,.28);box-shadow:0 30px 90px rgba(0,0,0,.34);background:linear-gradient(180deg,rgba(8,55,117,.94),rgba(4,32,72,.96));overflow:hidden;position:relative}
.hero-card.green{background:radial-gradient(circle at 50% -20%,rgba(75,255,167,.2),transparent 50%),linear-gradient(180deg,#11844b,#075532)}.hero-card.yellow{background:radial-gradient(circle at 50% -20%,rgba(255,255,255,.18),transparent 45%),linear-gradient(180deg,#7b6400,#3c3100)}.hero-card.orange{background:radial-gradient(circle at 50% -20%,rgba(255,195,90,.2),transparent 50%),linear-gradient(180deg,#8c430f,#482207)}.hero-card.red{background:radial-gradient(circle at 50% -20%,rgba(255,160,160,.16),transparent 50%),linear-gradient(180deg,#9b2929,#4d1313)}
.hero-stack{display:grid;justify-items:center;gap:clamp(10px,1.5vw,24px);max-width:1200px}.hero-eyebrow{font-size:clamp(18px,2.3vw,42px);font-weight:900;letter-spacing:.12em;color:var(--yellow)}.hero-title{margin:0;font-size:clamp(52px,8vw,150px);line-height:.92;letter-spacing:-.055em;font-weight:950;text-wrap:balance}.hero-body{font-size:clamp(22px,3vw,54px);font-weight:720;line-height:1.15;text-wrap:balance}.hero-sub{font-size:clamp(17px,2vw,34px);color:#e4f1ff}.countdown{font-size:clamp(88px,15vw,260px);font-weight:950;line-height:.82;color:var(--yellow);font-variant-numeric:tabular-nums;letter-spacing:-.07em}.countdown-caption{font-size:clamp(22px,2.5vw,44px);font-weight:850;color:var(--yellow)}
.away-layout{width:min(94%,1500px);display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,.8fr);gap:clamp(18px,2.5vw,38px);align-items:stretch}.away-main,.away-side{border-radius:clamp(22px,2.5vw,42px);border:1px solid rgba(150,200,255,.28);box-shadow:0 24px 70px rgba(0,0,0,.28)}.away-main{display:grid;place-items:center;text-align:center;padding:clamp(28px,4vw,70px);background:linear-gradient(180deg,rgba(82,68,0,.92),rgba(39,32,0,.95))}.away-side{padding:clamp(24px,3vw,48px);background:linear-gradient(180deg,rgba(8,55,117,.97),rgba(3,31,70,.98));display:grid;align-content:center;gap:22px;text-align:left}.away-side h2{margin:0;font-size:clamp(28px,3vw,54px);line-height:1.05}.away-side p{margin:0;color:#dcecff;font-size:clamp(17px,1.7vw,28px);line-height:1.35}.qr-box{width:min(210px,55%);aspect-ratio:1;background:white;border-radius:18px;padding:14px;display:grid;grid-template-columns:repeat(9,1fr);gap:2px}.qr-box i{background:#071c39}.qr-box i:nth-child(3n){opacity:.25}.return-line{font-size:clamp(22px,2.3vw,42px);font-weight:850}
.slide-stage{width:min(94%,1500px);height:min(70vh,800px);border-radius:clamp(24px,3vw,52px);overflow:hidden;border:1px solid rgba(150,200,255,.3);position:relative;background:linear-gradient(145deg,#0a4a96,#05295c);box-shadow:0 30px 90px rgba(0,0,0,.35)}.slide-panel{position:absolute;inset:0;padding:clamp(36px,6vw,100px);display:grid;place-items:center;text-align:center;opacity:0;transition:opacity .8s}.slide-panel.active{opacity:1}.slide-panel:nth-child(2){background:linear-gradient(145deg,#0d6b48,#06442e)}.slide-panel:nth-child(3){background:linear-gradient(145deg,#7a4a0b,#3f2504)}.slide-panel h1{font-size:clamp(54px,8vw,140px);line-height:.95;margin:0;letter-spacing:-.05em}.slide-panel p{font-size:clamp(24px,3vw,52px);margin:18px 0 0;color:#e6f2ff}.slide-dots{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);display:flex;gap:10px}.slide-dots i{width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,.35)}.slide-dots i.active{background:var(--yellow)}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(15px,2vw,30px);width:min(94%,1450px)}.service-card{min-height:clamp(180px,22vw,330px);border:1px solid rgba(150,200,255,.3);border-radius:clamp(20px,2vw,36px);background:linear-gradient(180deg,rgba(9,64,133,.98),rgba(4,35,77,.98));display:grid;place-items:center;text-align:center;padding:28px}.service-icon{font-size:clamp(42px,5vw,82px)}.service-card strong{font-size:clamp(24px,2.8vw,48px)}
.offline-ribbon{position:absolute;top:0;left:50%;transform:translateX(-50%);background:#8b2525;color:white;padding:8px 18px;border-radius:0 0 14px 14px;font-weight:850;font-size:13px;z-index:4}
.pairing-overlay{position:fixed;inset:0;background:rgba(0,10,25,.88);backdrop-filter:blur(8px);z-index:20;display:grid;place-items:center;padding:24px}.pairing-overlay[hidden]{display:none}.pairing-card{width:min(560px,94vw);padding:42px;border-radius:32px;background:linear-gradient(180deg,#083873,#031d42);border:1px solid rgba(150,200,255,.42);text-align:center;box-shadow:0 30px 100px rgba(0,0,0,.55)}.pairing-kicker{font-weight:900;letter-spacing:.15em;color:var(--yellow)}.pairing-code{font-size:clamp(62px,11vw,118px);font-weight:950;letter-spacing:.12em;color:white;margin:20px 0;font-variant-numeric:tabular-nums}.pairing-card p{font-size:20px;color:#d8eaff}.pairing-card small{display:block;color:#9fc7f5}.pairing-card button{margin-top:24px;border:0;border-radius:14px;background:var(--yellow);color:#031d42;font-weight:900;padding:14px 26px;cursor:pointer}
@media(max-aspect-ratio:4/3){.away-layout{grid-template-columns:1fr}.away-side{display:none}.services-grid{grid-template-columns:1fr 1fr}.hero-card{min-height:60vh}}
@media(max-width:700px){.display-footer{display:none}.display-header{padding:12px 16px}.display-content{padding:14px}.hero-card{width:100%;min-height:72vh;padding:26px}.away-layout{width:100%}.services-grid{grid-template-columns:1fr;width:100%;height:75vh;overflow:auto}.service-card{min-height:150px}.sync-status{display:none}}
.setup-card{width:min(720px,96vw);text-align:left}.setup-card p{text-align:left}.setup-textarea{width:100%;min-height:180px;background:#021a3b;border:1px solid rgba(150,200,255,.35);border-radius:14px;color:white;padding:14px;font:13px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace;resize:vertical}.setup-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.setup-grid label{display:grid;gap:7px;color:#b8d2f3;font-size:13px;font-weight:800}.setup-grid input{border:1px solid rgba(150,200,255,.35);background:#021a3b;color:white;border-radius:12px;padding:13px}.setup-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.pairing-card .setup-secondary{background:#0a3f82;color:white;border:1px solid rgba(150,200,255,.35)}.pairing-card .setup-link{display:block;margin:18px auto 0;background:transparent;color:#b8d2f3;border:1px solid rgba(150,200,255,.2)}@media(max-width:650px){.setup-grid,.setup-actions{grid-template-columns:1fr}}
.setup-status{display:grid;gap:5px;padding:14px 16px;border:1px solid rgba(150,200,255,.28);background:#021a3b;border-radius:14px}.setup-status strong{color:#62df9a}.setup-status span{color:#b8d2f3;font-size:13px;overflow-wrap:anywhere}