:root { --ink:#f5f8ff; --muted:#bdcbe2; }
* { box-sizing:border-box; }
html,body { min-height:100%; }
body { margin:0; background:#061020; color:var(--ink); font-family:Inter,Arial,Helvetica,sans-serif; }
a { color:inherit; }
.splash { min-height:100svh; position:relative; display:flex; flex-direction:column; align-items:center; overflow-x:hidden; overflow-y:auto; isolation:isolate; padding:34px 24px 20px; }
.backdrop { position:fixed; inset:0; z-index:-3; background:url('images/tucker-background.png') center/cover; filter:saturate(.92) contrast(1.04); transform:scale(1.015); }
.vignette { position:fixed; inset:0; z-index:-2; background:radial-gradient(ellipse at center 58%,rgba(6,15,31,.14),rgba(4,11,24,.55) 58%,rgba(1,6,15,.91)),linear-gradient(180deg,rgba(2,8,18,.88),rgba(3,12,27,.38) 30%,rgba(2,8,18,.72)); }
.intro { text-align:center; text-shadow:0 3px 20px rgba(0,0,0,.72); z-index:3; }
.eyebrow { margin:0 0 5px; color:#a9c9f9; font-size:.72rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; }
h1 { margin:0; font-family:Georgia,"Times New Roman",serif; font-size:clamp(2.3rem,5vw,4.35rem); line-height:.98; letter-spacing:-.035em; }
.instruction { margin:10px 0 0; color:var(--muted); font-size:.83rem; letter-spacing:.08em; }
.wheel { width:min(1040px,96vw); height:min(680px,calc(100svh - 172px)); min-height:540px; position:relative; flex:1; margin-top:64px; }
.orbit-line { position:absolute; left:50%; top:51%; width:890px; height:530px; transform:translate(-50%,-50%); border:1px solid rgba(168,202,255,.25); border-radius:50%; box-shadow:inset 0 0 45px rgba(43,101,175,.11),0 0 45px rgba(43,101,175,.08); }
.hub { position:absolute; left:50%; top:51%; width:210px; transform:translate(-50%,-50%); display:grid; justify-items:center; z-index:4; }
.hub-glow { position:absolute; width:260px; height:260px; border-radius:50%; background:radial-gradient(circle,rgba(131,183,255,.28),rgba(19,62,120,.07) 52%,transparent 70%); transform:translateY(-24px); z-index:-1; }
.hub img { width:174px; height:174px; object-fit:cover; border-radius:50%; border:5px solid rgba(235,244,255,.9); box-shadow:0 15px 45px rgba(0,0,0,.65),0 0 0 10px rgba(61,116,184,.18); }
.hub span { margin-top:15px; padding:7px 14px; border:1px solid rgba(186,213,250,.34); border-radius:999px; background:rgba(4,15,32,.76); backdrop-filter:blur(8px); color:#d9e8ff; font-size:.72rem; letter-spacing:.08em; text-align:center; text-transform:uppercase; white-space:nowrap; }
.site-card { --x:0px; --y:0px; position:absolute; left:50%; top:51%; width:202px; overflow:hidden; transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))); border:1px solid rgba(215,231,255,.42); border-radius:17px; background:linear-gradient(145deg,var(--tone),rgba(4,13,28,.96)); box-shadow:0 14px 34px rgba(0,0,0,.52); text-decoration:none; transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease; z-index:3; }
.site-card:hover,.site-card:focus-visible { transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y) - 7px)) scale(1.045); border-color:rgba(233,243,255,.92); box-shadow:0 20px 50px rgba(0,0,0,.7),0 0 25px var(--tone); outline:none; z-index:5; }
.site-image { height:102px; display:block; position:relative; overflow:hidden; background:#e9eef5; }
.site-image img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.site-card:hover .site-image img { transform:scale(1.055); }
.image-shade { position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(3,10,22,.5)); }
.site-name { display:block; padding:12px 13px 3px; font-family:Georgia,"Times New Roman",serif; font-size:1rem; font-weight:700; line-height:1.15; }
.visit { display:flex; justify-content:space-between; padding:4px 13px 12px; color:#c7d8f0; font-size:.68rem; letter-spacing:.09em; text-transform:uppercase; }
.visit b { font-size:.9rem; }
footer { z-index:3; margin-top:72px; padding-bottom:22px; color:rgba(216,229,248,.72); font-size:.68rem; letter-spacing:.11em; text-align:center; text-shadow:0 2px 10px #000; text-transform:uppercase; }
footer a { color:#d9e8ff; font-weight:700; text-decoration:none; border-bottom:1px solid rgba(217,232,255,.5); transition:color .2s ease,border-color .2s ease; }
footer a:hover,footer a:focus-visible { color:#fff; border-color:#fff; outline:none; }
@media (max-width:900px),(max-height:740px) {
  .splash { overflow:auto; padding-top:28px; }
  .wheel { height:auto; min-height:0; margin-top:24px; padding:32px 0 38px; }
  .orbit-line { display:none; }
  .hub { position:relative; left:auto; top:auto; transform:none; margin:0 auto 32px; }
  .hub img { width:148px; height:148px; }
  .site-list { display:grid; grid-template-columns:repeat(2,minmax(0,220px)); justify-content:center; gap:18px; }
  .site-card,.site-card:hover,.site-card:focus-visible { position:relative; left:auto; top:auto; width:100%; transform:none; }
  .site-card:hover,.site-card:focus-visible { transform:translateY(-5px); }
  footer { margin-top:36px; }
}
@media (max-width:520px) {
  .splash { padding-inline:16px; }
  .eyebrow { font-size:.62rem; letter-spacing:.15em; }
  .site-list { grid-template-columns:minmax(0,330px); }
  .site-card { display:grid; grid-template-columns:116px 1fr; grid-template-rows:1fr auto; min-height:108px; }
  .site-image { height:100%; grid-row:1/3; }
  .site-name { align-self:end; padding:15px 12px 2px; }
  .visit { padding:4px 12px 14px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }