/* UNVEIL, built to the approved mock-ups (.lode-work/grails/v2): pure black, ivory serif, metallic gold pills,
   photographic box tiles. Root class .uv (prefix uv-). Display: Montserrat; UI: Manrope. Flat buttons. */
#unveilStage { background:#000; border:0; box-shadow:none; border-radius:0; overflow:visible; display:block; min-width:0; max-width:100%; }
body.uv-on, body.uv-on main { background:#000 !important; }
/* the portal header stays the same as on every other page (founder 2026-11-01) */
.uv { --ink:#efe8dc; --dim:#8a8378; --line:rgba(255,255,255,.08); --gold:#d9b25f;
  --goldfill:linear-gradient(180deg,#f3dc9f 0%,#dcb560 52%,#b98c3a 100%); --ease:cubic-bezier(.32,.72,0,1);
  position:relative; min-height:100dvh; color:var(--ink); background:#000; font:500 15px/1.5 Manrope, Inter, system-ui, sans-serif; overflow-x:hidden; padding-bottom:48px; }
.uv::after { content:""; position:fixed; inset:0; pointer-events:none; opacity:.045; mix-blend-mode:overlay; z-index:1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.uv button { font:inherit; color:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.uv h1, .uv h2 { font-family:Montserrat, Manrope, sans-serif; font-weight:500; letter-spacing:-.005em; margin:0; color:var(--ink); }
.uv-cap { display:inline-block; font:700 10px/1.2 Manrope, sans-serif; letter-spacing:.2em; text-transform:uppercase; color:var(--dim); }
.uv-cap.gold { color:var(--gold); } .uv-dim { color:var(--dim); }
.uv button:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }

/* top bar: small wordmark, (desktop) text tabs, slim balance pill */
.uv-top { position:relative; z-index:3; display:flex; align-items:center; justify-content:space-between; gap:16px; max-width:1240px; margin:0 auto; padding:14px 18px 12px; }
.uv-brand { background:none; border:0; padding:0; line-height:0; } .uv-brand img { height:24px; width:auto; }
.uv-bal { padding:6px 12px; border-radius:999px; background:rgba(217,178,95,.16); color:#f1d38c; font:700 12px/1 Manrope, sans-serif; font-variant-numeric:tabular-nums; white-space:nowrap; }
.uv-tabs { display:none; }
.uv-vtabs { display:flex; justify-content:center; gap:26px; padding:16px 18px 0; margin:0 0 12px; border-bottom:1px solid var(--line); }
.uv-vtabs button, .uv-tabs button { position:relative; border:0; background:none; padding:0 0 12px; font:400 16px/1 Montserrat, Manrope, sans-serif; color:#a49c8e; letter-spacing:.01em; text-transform:none; min-height:0; }
.uv-vtabs button.on, .uv-tabs button.on { color:var(--gold); }
.uv-vtabs button.on::after, .uv-tabs button.on::after { content:""; position:absolute; left:0; right:0; bottom:-1px; height:1.5px; background:var(--gold); }
.uv-tabs i { position:absolute; top:-6px; right:-12px; min-width:15px; height:15px; padding:0 4px; border-radius:99px; background:var(--gold); color:#1a1206; font:800 9px/15px Manrope; font-style:normal; }
.uv-main { position:relative; z-index:2; max-width:1240px; margin:0 auto; }

/* buttons */
.uv-btn { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 26px; border:0; border-radius:999px; font:700 14px/1 Manrope, sans-serif; letter-spacing:.01em; transition:transform .25s var(--ease), filter .3s; }
.uv-btn:active:not(:disabled) { transform:scale(.97); } .uv-btn:disabled { opacity:.45; cursor:default; }
.uv-btn.gold { background:var(--goldfill); color:#1d1406; } .uv-btn.gold:hover:not(:disabled) { filter:brightness(1.06); }
.uv-btn.dark { background:linear-gradient(180deg,#2b2b2b,#111); color:var(--ink); }
.uv-btn.wide { width:100%; min-height:52px; font-size:15.5px; } .uv-btn.sm { min-height:38px; padding:0 16px; font-size:13px; }
.uv-link { border:0; background:none; padding:8px 4px; color:#cdb682; font:600 13.5px/1 Manrope, sans-serif; text-decoration:underline; text-underline-offset:4px; text-decoration-color:rgba(217,178,95,.5); }
.uv-link:disabled { color:var(--dim); text-decoration:none; cursor:default; }

/* hero: one cinematic photo, the line set on it (mock-lobby) */
.uv-hero { position:relative; height:clamp(260px, 62vw, 330px); overflow:hidden; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.uv-hero picture, .uv-hero > picture img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 70%; }
.uv-hero::after { content:""; position:absolute; inset:0; background:radial-gradient(80% 60% at 50% 55%, rgba(0,0,0,.05), rgba(0,0,0,.55) 100%), linear-gradient(180deg, rgba(0,0,0,.25), transparent 30%, transparent 70%, #000); }
.uv-hero-copy { position:relative; z-index:1; padding:0 22px; }
.uv-hero h1 { font-size:clamp(32px, 9vw, 44px); line-height:1.02; text-shadow:0 2px 24px rgba(0,0,0,.6); }
.uv-hero p { display:none; }
.uv-hero-cta { display:flex; flex-direction:column; align-items:center; gap:6px; margin-top:16px; } .uv-hero-cta .uv-btn { min-height:38px; padding:0 20px; font-size:13px; }

/* bento of photographs (mock-lobby): gold tall left, watch + tech stacked, sneaker wide, ruby + silver */
.uv-bento { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); grid-template-areas:"g w" "g t" "s s" "r v"; grid-template-rows:150px 150px 140px 118px; gap:6px; padding:0 8px; }
.uv-tile { position:relative; overflow:hidden; border:1px solid var(--line); border-radius:12px; padding:0; background:#050505; text-align:left; transition:transform .5s var(--ease), border-color .4s; }
.uv-tile img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 72%; transition:transform 1.2s var(--ease); }
.uv-tile::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 45%, rgba(0,0,0,.78) 100%); }
.uv-tile:hover img { transform:scale(1.04); } .uv-tile:hover { border-color:rgba(217,178,95,.35); } .uv-tile:active { transform:scale(.985); }
.a-gold { grid-area:g; } .a-watch { grid-area:w; } .a-tech { grid-area:t; } .a-sneaker { grid-area:s; } .a-gamer { grid-area:r; } .a-starter { grid-area:v; }
.a-sneaker img { object-position:60% 60%; }
.uv-tile-copy { position:absolute; z-index:1; left:11px; right:11px; bottom:10px; display:flex; flex-direction:column; gap:3px; }
.uv-tile-copy b { font:500 14px/1.08 Montserrat, Manrope, sans-serif; text-transform:uppercase; letter-spacing:.02em; color:#f4eee4; max-width:16ch; }
.a-gold .uv-tile-copy b, .a-sneaker .uv-tile-copy b { font-size:16px; }
.uv-tile-copy small { font:700 8.5px/1 Manrope, sans-serif; letter-spacing:.14em; text-transform:uppercase; color:#b7ab95; }

/* live strip + trust */
.uv-strip { padding:34px 0 0; } .uv-strip-h { padding:0 18px 12px; }
.uv-feed { overflow:hidden; mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); -webkit-mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.uv-feed > .uv-dim { padding:0 18px; margin:0; font-size:13px; }
.uv-feed-track { display:flex; gap:22px; width:max-content; padding:0 18px; animation:uvMarquee 40s linear infinite; }
.uv-drop { display:flex; align-items:center; gap:10px; } .uv-drop img { width:36px; height:36px; border-radius:8px; object-fit:cover; }
.uv-drop b { display:block; font:500 15px/1.1 Montserrat, Manrope, sans-serif; } .uv-drop small { color:var(--dim); font-size:11px; }
@keyframes uvMarquee { to { transform:translateX(-50%); } }
.uv-trust { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:22px 16px; margin:34px 18px 0; padding-top:24px; border-top:1px solid var(--line); }
.uv-trust b { display:block; font:500 17px/1.15 Montserrat, Manrope, sans-serif; } .uv-trust small { color:var(--dim); font-size:11.5px; }

/* opening screen (mock-open) */
.uv-open { padding:0 0 10px; }
.uv-open-head { position:relative; text-align:center; padding:6px 52px 0; }
.uv-open-head h2 { font-size:clamp(32px, 9vw, 44px); line-height:1.05; } .uv-open-head .uv-cap { margin-top:8px; }
.uv-backarrow { position:absolute; left:10px; top:6px; width:44px; height:44px; border:0; background:none; display:grid; place-items:center; color:var(--gold); }
.uv-backarrow svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.uv-open-stage { height:clamp(170px, 48vw, 240px); margin:14px 0 6px; overflow:hidden; }
.uv-open-stage img { width:100%; height:100%; object-fit:cover; object-position:50% 74%; -webkit-mask-image:linear-gradient(180deg, transparent, #000 18%, #000 80%, transparent); mask-image:linear-gradient(180deg, transparent, #000 18%, #000 80%, transparent); }
.uv-reels { display:flex; flex-direction:column; gap:10px; margin:6px 0 4px; }
.uv-reel { position:relative; overflow:hidden; width:100%; min-width:0; height:186px; padding:14px 0;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent); mask-image:linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent); }
.uv-reel::before, .uv-reel::after { content:""; position:absolute; left:50%; width:1px; height:12px; background:var(--gold); z-index:2; }
.uv-reel::before { top:0; } .uv-reel::after { bottom:0; }
.uv-track { display:flex; align-items:center; gap:8px; height:100%; width:max-content; will-change:transform; }
.uv-card { flex:none; width:104px; height:140px; border-radius:12px; overflow:hidden; background:#0b0a09; transition:transform .45s var(--ease), opacity .45s; opacity:.72; }
.uv-card img { width:100%; height:100%; object-fit:cover; display:block; }
.uv-card.mid { transform:scale(1.14); opacity:1; outline:1.5px solid rgba(217,178,95,.85); outline-offset:-1.5px; }
.uv-card.won { background:radial-gradient(70% 60% at 50% 60%, rgba(217,178,95,.35), #0b0a09); }
.uv-reels.n2 .uv-reel, .uv-reels.n3 .uv-reel { height:136px; } .uv-reels.n2 .uv-card, .uv-reels.n3 .uv-card { width:78px; height:104px; }
.uv-reels.n4 .uv-reel, .uv-reels.n5 .uv-reel { height:108px; padding:10px 0; } .uv-reels.n4 .uv-card, .uv-reels.n5 .uv-card { width:62px; height:82px; border-radius:9px; }
.uv-qty { display:flex; justify-content:center; gap:14px; margin:10px 0 14px; }
.uv-qty button { width:36px; height:36px; border:0; border-radius:50%; background:none; color:#7d766a; font:500 15px/1 Manrope, sans-serif; }
.uv-qty button.on { background:rgba(217,178,95,.16); color:#f1d38c; }
.uv-open > .uv-btn.wide { display:flex; width:calc(100% - 36px); margin:0 18px; }
.uv-inside { margin:26px 18px 0; }
.uv-inside-h { display:grid; grid-template-columns:minmax(0, 1fr) 84px 58px; align-items:center; gap:10px; padding:0 0 10px; border-bottom:1px solid var(--line); }
.uv-inside-h span { font:700 9px/1 Manrope, sans-serif; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); text-align:right; }
.uv-inside-h span:first-child { font:500 20px/1 Montserrat, Manrope, sans-serif; letter-spacing:0; text-transform:none; color:#d9c08a; text-align:left; }
.uv-row { display:grid; grid-template-columns:30px minmax(0, 1fr) 84px 58px; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid rgba(255,255,255,.05); }
.uv-row img { width:30px; height:30px; border-radius:6px; object-fit:cover; }
.uv-row b { font:500 16.5px/1.15 Montserrat, Manrope, sans-serif; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.uv-row span { text-align:right; font-size:12px; color:#bcb3a3; font-variant-numeric:tabular-nums; } .uv-row span:last-child { color:var(--dim); }
.uv-row.r-legendary b { color:#f1d38c; } .uv-row.r-epic b { color:#e2d3ff; }
.uv-fair { margin:16px 18px 0; color:#5f594f; font-size:10.5px; word-break:break-word; }

/* the win moment (mock-win) */
.uv-modal { position:fixed; inset:0; z-index:60; display:grid; place-items:center; padding:16px; background:rgba(0,0,0,.86); }
.uv-modal[hidden] { display:none; }
.uv-modal.win { background:#000; overflow:auto; }
.uv-modal.clip { background:#000; } .uv-modal.clip video { width:min(100%, 960px); border-radius:18px; }
.uv-modal.clip .uv-skip { position:absolute; right:18px; bottom:calc(env(safe-area-inset-bottom) + 18px); }
.uv-win { width:min(100%, 440px); display:flex; flex-direction:column; align-items:center; text-align:center; padding:12px 6px calc(env(safe-area-inset-bottom) + 12px); }
.uv-win-logo { height:22px; width:auto; margin-bottom:12px; opacity:.9; }
.uv-win-art { position:relative; width:min(82vw, 360px); aspect-ratio:1; display:grid; place-items:center; margin-bottom:8px; }
.uv-win-art img { position:relative; z-index:1; width:84%; height:84%; object-fit:contain; mix-blend-mode:lighten; animation:uvRise 1s var(--ease) both, uvFloat 6s 1s ease-in-out infinite;
  -webkit-mask-image:radial-gradient(closest-side, #000 74%, transparent 100%); mask-image:radial-gradient(closest-side, #000 74%, transparent 100%); }
.uv-rays { position:absolute; inset:-14%; border-radius:50%; background:radial-gradient(closest-side, rgba(242,201,110,.55), rgba(242,201,110,.12) 55%, transparent 72%), repeating-conic-gradient(from 0deg, rgba(255,222,150,.16) 0 4deg, transparent 4deg 14deg);
  -webkit-mask-image:radial-gradient(closest-side, #000 30%, transparent 100%); mask-image:radial-gradient(closest-side, #000 30%, transparent 100%); animation:uvSpin 30s linear infinite; }
.uv-modal.win.r-common .uv-rays { opacity:.45; } .uv-modal.win.r-rare .uv-rays { opacity:.7; }
.uv-win h2 { font-size:clamp(34px, 10vw, 46px); line-height:1.02; margin:8px 0 4px; } .uv-win-val { margin:0 0 18px; color:var(--gold); font:500 20px/1 Manrope, sans-serif; font-variant-numeric:tabular-nums; }
.uv-win-pager { display:flex; gap:6px; margin:-6px 0 16px; } .uv-win-pager i { width:6px; height:6px; border-radius:50%; background:#3a352d; } .uv-win-pager i.on { background:var(--gold); width:18px; border-radius:3px; } .uv-win-pager i.done { opacity:.4; }
.uv-win-cta { display:grid; grid-template-columns:1fr 1.4fr; gap:10px; width:100%; } .uv-win-cta .uv-btn { min-height:52px; padding:0 14px; }
.uv-win .uv-link { margin-top:12px; } .uv-sellall { margin-top:0 !important; font-size:12.5px; }
@keyframes uvRise { from { opacity:0; transform:translateY(24px) scale(.9); } }
@keyframes uvFloat { 50% { transform:translateY(-8px); } }
@keyframes uvSpin { to { transform:rotate(360deg); } }

/* sheets (shipping) and toast */
.uv-sheet { width:min(100%, 440px); display:flex; flex-direction:column; gap:12px; padding:24px 20px; border-radius:22px; background:#0b0a09; }
.uv-sheet h2 { font-size:32px; }
.uv-field { display:flex; flex-direction:column; gap:5px; } .uv-field span { font:700 9.5px/1 Manrope, sans-serif; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); }
.uv-field input { min-height:46px; padding:0 14px; border:0; border-radius:12px; background:rgba(255,255,255,.07); color:var(--ink); font:500 15px Manrope, sans-serif; }
.uv-field input:focus-visible { outline:1.5px solid var(--gold); }
.uv-toast { position:fixed; left:50%; bottom:calc(env(safe-area-inset-bottom) + 96px); z-index:70; transform:translate(-50%, 16px); opacity:0; pointer-events:none; padding:12px 20px; border-radius:999px; background:#16130e; color:var(--ink); font:600 13.5px/1.2 Manrope, sans-serif; transition:all .45s var(--ease); max-width:calc(100% - 32px); }
.uv-toast.on { opacity:1; transform:translate(-50%, 0); } .uv-toast.ok { color:#f1d38c; } .uv-toast.err { background:#2a1214; color:#ffb4b4; }

/* battles, upgrader, inventory: same quiet editorial system */
.uv-page { padding:8px 18px 0; } .uv-page-h { margin:10px 0 22px; } .uv-page-h h2 { font-size:clamp(30px, 8vw, 40px); line-height:1.04; margin-top:8px; } .uv-page-h p { color:var(--dim); margin:10px 0 0; max-width:44ch; font-size:14px; }
.uv-list-h { margin:26px 0 12px; padding-bottom:10px; border-bottom:1px solid var(--line); }
.uv-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px; }
.uv-item { position:relative; display:flex; flex-direction:column; gap:2px; padding:0 0 10px; border:0; border-radius:12px; background:#0b0a09; text-align:left; overflow:hidden; }
.uv-item img { width:100%; aspect-ratio:1; object-fit:cover; display:block; margin-bottom:6px; }
.uv-item b { padding:0 9px; font:500 14px/1.12 Montserrat, Manrope, sans-serif; color:var(--ink); } .uv-item small { padding:0 9px; color:var(--dim); font-size:11px; }
.uv-item.on { outline:1.5px solid var(--gold); outline-offset:-1.5px; background:#14110b; }
.uv-item.on::after { content:""; position:absolute; top:8px; right:8px; width:18px; height:18px; border-radius:50%; background:var(--gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='%231a1206' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat; }
.uv-item.shipping { opacity:.6; }
.uv-empty { padding:50px 0; text-align:center; color:var(--dim); } .uv-empty p { margin:0 0 16px; }
.uv-actions { position:sticky; bottom:calc(env(safe-area-inset-bottom) + 76px); z-index:6; display:flex; align-items:center; gap:6px; margin:18px 18px 0; padding:8px 8px 8px 18px; border-radius:999px; background:rgba(16,14,11,.95); }
.uv-actions span { flex:1; color:var(--dim); font-size:12.5px; }
.uv-picker { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:6px; }
.uv-pick { position:relative; aspect-ratio:3 / 4; border:1px solid var(--line); border-radius:12px; overflow:hidden; padding:0; background:#050505; text-align:left; }
.uv-pick img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 72%; }
.uv-pick::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 50%, rgba(0,0,0,.8)); }
.uv-pick span { position:absolute; z-index:1; left:8px; right:8px; bottom:7px; display:flex; flex-direction:column; }
.uv-pick b { font:500 13px/1.05 Montserrat, Manrope, sans-serif; } .uv-pick small { font-size:10px; color:#b7ab95; }
.uv-lineup { display:flex; flex-wrap:wrap; gap:6px; min-height:40px; margin:16px 0; align-items:center; }
.uv-chip { display:inline-flex; align-items:center; gap:8px; min-height:34px; padding:0 12px; border:0; border-radius:999px; background:rgba(217,178,95,.12); color:#e9d3a0; font-size:12.5px; font-weight:600; }
.uv-chip span { color:var(--dim); font-size:15px; }
.uv-opts { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px; }
.uv-seg { display:flex; gap:2px; padding:3px; border-radius:999px; background:rgba(255,255,255,.06); }
.uv-seg button { min-height:38px; padding:0 14px; border:0; border-radius:999px; background:none; color:var(--dim); font-weight:600; font-size:12.5px; }
.uv-seg button.on { background:rgba(217,178,95,.18); color:#f1d38c; }
.uv-arena { padding:28px 0 0; }
.uv-seats { display:grid; gap:6px; } .uv-seats.n2, .uv-seats.n4 { grid-template-columns:repeat(2, minmax(0, 1fr)); } .uv-seats.n3 { grid-template-columns:repeat(3, minmax(0, 1fr)); }
.uv-seat { min-width:0; padding:10px 8px; border-radius:14px; background:#0b0a09; transition:background .5s var(--ease); }
.uv-seat-h { display:flex; flex-direction:column; gap:1px; margin-bottom:8px; } .uv-seat-h b { font:500 15px/1.1 Montserrat, Manrope, sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.uv-seat-h em { font-style:normal; font-weight:700; font-size:12px; color:var(--gold); font-variant-numeric:tabular-nums; }
.uv-seat.you .uv-seat-h b { color:#f1d38c; } .uv-seat.winner { background:radial-gradient(90% 70% at 50% 20%, rgba(217,178,95,.22), #0b0a09 80%); }
.uv-slot { min-width:0; }
.uv-reel.v { height:150px; padding:0; -webkit-mask-image:linear-gradient(180deg, transparent, #000 20%, #000 80%, transparent); mask-image:linear-gradient(180deg, transparent, #000 20%, #000 80%, transparent); }
.uv-reel.v::before, .uv-reel.v::after { display:none; }
.uv-reel.v .uv-track { flex-direction:column; width:100%; height:max-content; gap:8px; }
.uv-reel.v .uv-card { width:100%; height:110px; }
.uv-pulls { display:flex; flex-wrap:wrap; gap:4px; margin-top:8px; } .uv-pulls img { width:28px; height:28px; border-radius:6px; object-fit:cover; }
.uv-verdict { padding:26px 4px 0; text-align:center; } .uv-verdict h2 { font-size:32px; margin-top:6px; } .uv-verdict p { color:var(--dim); margin:6px 0 0; }
.uv-up { display:grid; gap:20px; }
.uv-dialwrap { display:flex; flex-direction:column; align-items:center; gap:18px; }
.uv-dial { --p:0; position:relative; width:min(70vw, 270px); aspect-ratio:1; border-radius:50%; background:conic-gradient(#d9b25f 0 calc(var(--p) * 1%), rgba(255,255,255,.07) calc(var(--p) * 1%) 100%); transition:filter .4s; }
.uv-dial::after { content:""; position:absolute; inset:10px; border-radius:50%; background:radial-gradient(circle at 50% 35%, #15120d, #060504 70%); }
.uv-dial-core { position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; } .uv-dial-core b { font:500 46px/1 Montserrat, Manrope, sans-serif; }
.uv-needle { position:absolute; z-index:3; left:50%; top:-6px; width:4px; height:calc(50% + 6px); margin-left:-2px; transform-origin:50% 100%; }
.uv-needle::before { content:""; position:absolute; top:0; left:-6px; border:8px solid transparent; border-top:13px solid #f3e9d6; }
.uv-dial.win { filter:drop-shadow(0 0 28px rgba(217,178,95,.55)); } .uv-dial.lose { filter:grayscale(.8) brightness(.7); }
.uv-updeal { display:flex; gap:34px; } .uv-updeal div { display:flex; flex-direction:column; align-items:center; gap:4px; } .uv-updeal b { font:500 24px/1 Montserrat, Manrope, sans-serif; }
.uv-dialwrap .uv-btn.wide { max-width:340px; }
@media (prefers-reduced-motion: reduce) { .uv-feed-track, .uv-rays, .uv-win-art img { animation:none; } }

/* desktop (mock-desk): tabs in the top bar, a split hero, the bento across the width */
@media (min-width:900px) {
  .uv-top { padding:22px 40px 16px; } .uv-brand img { height:30px; }
  .uv-tabs { display:flex; gap:34px; } .uv-tabs button { padding-bottom:6px; font-size:17px; } .uv-vtabs { display:none; }
  .uv-main { padding:0 40px; }
  .uv-hero { height:520px; align-items:flex-start; text-align:left; border-radius:4px; }
  .uv-hero picture img, .uv-hero > picture img { object-position:70% 50%; }
  .uv-hero::after { background:linear-gradient(90deg, #000 0%, rgba(0,0,0,.82) 30%, rgba(0,0,0,0) 62%), linear-gradient(180deg, transparent 75%, #000); }
  .uv-hero-copy { padding:0 0 0 56px; max-width:620px; }
  .uv-hero h1 { font-size:84px; line-height:.98; background:linear-gradient(180deg,#f3dc9f,#c99a48); -webkit-background-clip:text; background-clip:text; color:transparent; text-shadow:none; }
  .uv-hero p { display:block; color:#c8bfaf; margin:18px 0 0; font-size:16px; max-width:40ch; }
  .uv-hero-cta { flex-direction:row; gap:18px; margin-top:28px; } .uv-hero-cta .uv-btn { min-height:48px; padding:0 30px; font-size:14px; }
  .uv-bento { grid-template-columns:repeat(6, minmax(0, 1fr)); grid-template-areas:"g g w w t t" "g g s s r v"; grid-template-rows:240px 240px; gap:12px; padding:28px 0 0; }
  .uv-tile { border-radius:14px; } .uv-tile-copy { left:18px; bottom:16px; } .uv-tile-copy b { font-size:19px; } .a-gold .uv-tile-copy b { font-size:24px; } .uv-tile-copy small { font-size:9.5px; }
  .uv-strip { padding-top:60px; } .uv-strip-h, .uv-feed-track { padding-left:0; } .uv-feed > .uv-dim { padding:0; }
  .uv-trust { grid-template-columns:repeat(4, minmax(0, 1fr)); margin:56px 0 0; }
  .uv-open { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); column-gap:48px; align-items:start; padding-top:10px; }
  .uv-open-head, .uv-open-stage, .uv-reels, .uv-qty, .uv-open > .uv-btn.wide, .uv-fair { grid-column:1; }
  .uv-inside { grid-column:2; grid-row:1 / span 7; margin:8px 0 0; }
  .uv-open > .uv-btn.wide { width:100%; margin:0; } .uv-fair { margin:16px 0 0; }
  .uv-page { padding:12px 0 0; } .uv-grid { grid-template-columns:repeat(6, minmax(0, 1fr)); gap:12px; } .uv-picker { grid-template-columns:repeat(6, minmax(0, 1fr)); gap:10px; }
  .uv-up { grid-template-columns:minmax(0, 360px) minmax(0, 1fr); gap:48px; align-items:start; } .uv-dialwrap { position:sticky; top:20px; }
  .uv-seats.n4 { grid-template-columns:repeat(4, minmax(0, 1fr)); } .uv-actions { bottom:20px; margin:22px 0 0; }
}
.uv-vtabs button, .uv-vtabs button.on, .uv-tabs button, .uv-tabs button.on { background:none !important; box-shadow:none !important; border:0 !important; border-radius:0 !important; }
/* the portal styles every <main> as an auto-width grid: UNVEIL's content area is a plain block that never outgrows the screen */
.uv .uv-main { display:block !important; padding:0 !important; min-width:0; width:100%; }
@media (min-width:900px) { .uv .uv-main { padding:0 40px !important; } }
.uv-main > section, .uv-main > nav { min-width:0; max-width:100%; }
@media (max-width:899px) { body.uv-on main { padding-left:0 !important; padding-right:0 !important; } }
@media (min-width:900px) {
  .uv-hero h1 { max-width:7.4em; } /* breaks as "Every box / hides a grail." like mock-desk */
  .uv-inside-h { grid-template-columns:minmax(0, 1fr) 120px 64px; } .uv-row { grid-template-columns:30px minmax(0, 1fr) 120px 64px; }
}
.uv-row span { white-space:nowrap; }
/* cash wallet + demo top-up */
.uv-wallet { display:flex; align-items:center; gap:6px; }
.uv-add { min-height:30px; padding:0 10px; border:0; border-radius:999px; background:rgba(255,255,255,.07); color:#d9c08a; font:700 11px/1 Manrope, sans-serif; white-space:nowrap; }
.uv-add:hover { background:rgba(217,178,95,.16); }

/* ================================================================ v3 (2026-10-31): Montserrat, pinned navigation, painted art throughout
   Montserrat (it echoes the UNVEIL wordmark) replaces the serif: bold, tight headlines; small tracked caps; regular-weight names. */
.uv h1, .uv h2 { font-weight:700; letter-spacing:-.025em; }
.uv-hero h1 { font-size:clamp(28px, 7.6vw, 38px); line-height:1.06; }
.uv-open-head h2, .uv-win h2 { font-size:clamp(26px, 7.6vw, 36px); line-height:1.08; }
.uv-page-h h2, .uv-phero h2, .uv-verdict h2, .uv-sheet h2, .uv-daily h2 { font-size:clamp(24px, 6.6vw, 32px); line-height:1.08; }
.uv-tile-copy b { font-weight:700; font-size:11.5px; letter-spacing:.06em; line-height:1.2; } .a-gold .uv-tile-copy b, .a-sneaker .uv-tile-copy b { font-size:12.5px; }
.uv-row b, .uv-item b, .uv-drop b, .uv-pick b, .uv-seat-h b { font-weight:600; font-size:13px; letter-spacing:-.01em; }
.uv-inside-h span:first-child { font-weight:700; font-size:15px; letter-spacing:.02em; }
.uv-trust b { font-weight:700; font-size:14px; letter-spacing:-.01em; }
.uv-dial-core b, .uv-updeal b { font-weight:700; letter-spacing:-.02em; } .uv-dial-core b { font-size:38px; } .uv-updeal b { font-size:19px; }

/* navigation: the tab bar is pinned on every screen (phone); a labelled back pill on the box page */
.uv-vtabs { position:sticky; top:0; z-index:20; margin:0; padding:12px 18px 0; background:rgba(0,0,0,.92); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.uv-vtabs button { font:600 13.5px/1 Montserrat, Manrope, sans-serif; letter-spacing:.01em; padding-bottom:11px; }
.uv-vtabs i, .uv-invn { position:absolute; top:-7px; right:-12px; min-width:15px; height:15px; padding:0 4px; border-radius:99px; background:var(--gold); color:#1a1206; font:800 9px/15px Manrope; font-style:normal; }
.uv-tabs button { font:600 14px/1 Montserrat, Manrope, sans-serif; }
.uv-backpill { display:inline-flex; align-items:center; gap:6px; margin:14px 0 4px 14px; min-height:40px; padding:0 14px 0 8px; border:0; border-radius:999px; background:rgba(255,255,255,.07); color:var(--ink); font:600 13px/1 Manrope, sans-serif; }
.uv-backpill svg { width:18px; height:18px; fill:none; stroke:var(--gold); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.uv-backarrow { display:none; } .uv-open-head { padding:2px 18px 0; }

/* prize cards stand on painted rarity plinths (grey, blue, violet, gold) */
.uv-card { background-size:cover; background-position:center; opacity:.8; }
.uv-card img { object-fit:contain; mix-blend-mode:lighten; padding:12% 10% 16%; -webkit-mask-image:radial-gradient(closest-side, #000 70%, transparent 100%); mask-image:radial-gradient(closest-side, #000 70%, transparent 100%); }
.uv-card.mid { opacity:1; } .uv-card.won { background-image:url(assets/unveil/ui/plate-legendary.jpg); }
.uv-card.won.r-common { background-image:url(assets/unveil/ui/plate-common.jpg) !important; } .uv-card.won.r-rare { background-image:url(assets/unveil/ui/plate-rare.jpg) !important; } .uv-card.won.r-epic { background-image:url(assets/unveil/ui/plate-epic.jpg) !important; }

/* painted page headers (battles, upgrader, vault) */
.uv-phero { position:relative; height:clamp(190px, 50vw, 300px); overflow:hidden; display:flex; align-items:flex-end; }
.uv-phero img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:65% 50%; }
.uv-phero::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.25) 45%, #000 100%), linear-gradient(90deg, rgba(0,0,0,.6), transparent 70%); }
.uv-phero > div { position:relative; z-index:1; padding:0 18px 18px; max-width:520px; } .uv-phero h2 { margin-top:6px; } .uv-phero p { color:#c4bba9; font-size:13.5px; margin:8px 0 0; }
.uv-phero + .uv-page { padding-top:14px; }

/* daily box banner */
.uv-daily { position:relative; margin:22px 8px 0; height:170px; border-radius:14px; overflow:hidden; display:flex; align-items:center; }
.uv-daily img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:70% 50%; }
.uv-daily::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(0,0,0,.85), rgba(0,0,0,.2) 70%); }
.uv-daily > div { position:relative; z-index:1; padding:0 18px; display:flex; flex-direction:column; align-items:flex-start; gap:8px; } .uv-daily h2 { max-width:12ch; }
.uv-daily .uv-btn { min-height:40px; padding:0 20px; font-size:13px; }

/* empty vault */
.uv-empty img { width:min(70%, 280px); border-radius:16px; margin-bottom:14px; opacity:.9; }

/* battle mode badges */
.uv-seg button { display:inline-flex; align-items:center; gap:6px; } .uv-seg button img { width:20px; height:20px; object-fit:contain; }

/* the battle arena: a lit stage, portraits, VS between seats, a crown on the winner, a 3-2-1 intro */
.uv-arena { position:relative; margin:22px -18px 0; padding:18px 12px 24px; overflow:hidden; border-radius:0; min-height:420px; }
.uv-arena-bg { position:absolute; inset:0; z-index:0; } .uv-arena-bg img { width:100%; height:100%; object-fit:cover; opacity:.75; }
.uv-arena-bg::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.15) 40%, rgba(0,0,0,.85)); }
.uv-arena > *:not(.uv-arena-bg) { position:relative; z-index:1; }
.uv-arena-mode { display:flex; align-items:center; justify-content:center; gap:8px; margin-bottom:14px; } .uv-arena-mode img { width:28px; height:28px; object-fit:contain; }
.uv-arena-mode span { font:700 10px/1 Manrope, sans-serif; letter-spacing:.18em; text-transform:uppercase; color:#e9d3a0; }
.uv-seats { display:flex !important; align-items:flex-start; gap:4px; } .uv-seat { flex:1 1 0; background:rgba(8,7,6,.72); backdrop-filter:none; padding:10px 6px 8px; }
.uv-vs-mini { flex:none; width:26px; align-self:center; margin-top:-40px; filter:drop-shadow(0 0 8px rgba(242,201,110,.5)); }
.uv-seats.n4 .uv-vs-mini { width:18px; }
.uv-seat-av { position:relative; width:56px; height:56px; margin:4px auto 8px; }
.uv-seat-av > img:last-child { width:100%; height:100%; border-radius:50%; object-fit:cover; box-shadow:0 0 0 2px rgba(217,178,95,.55); }
.uv-seat.you .uv-seat-av > img:last-child { box-shadow:0 0 0 2px #f1d38c; }
.uv-crown { position:absolute; left:50%; top:-26px; width:40px; transform:translateX(-50%) scale(0); transform-origin:50% 100%; transition:transform .6s cubic-bezier(.3,1.6,.5,1); z-index:2; }
.uv-seat.winner .uv-crown { transform:translateX(-50%) scale(1); }
.uv-seat-h { align-items:center; text-align:center; } .uv-seat-h b { font-size:12px; max-width:100%; }
.uv-seat.winner { background:radial-gradient(90% 70% at 50% 20%, rgba(217,178,95,.32), rgba(8,7,6,.78) 80%); }
.uv-arena .uv-reel.v { height:132px; } .uv-arena .uv-reel.v .uv-card { height:96px; }
.uv-countdown { position:absolute !important; inset:0; z-index:5 !important; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; background:rgba(0,0,0,.6); transition:opacity .4s; }
.uv-countdown img { width:min(46%, 200px); animation:uvVs 1.9s cubic-bezier(.2,1.4,.4,1) both; }
.uv-countdown b { font:800 64px/1 Montserrat, sans-serif; color:#f3dc9f; } .uv-countdown b.pop { animation:uvPop .6s cubic-bezier(.2,1.6,.4,1); }
.uv-countdown.gone { opacity:0; pointer-events:none; }
@keyframes uvVs { from { transform:scale(.3) rotate(-8deg); opacity:0; } }
@keyframes uvPop { from { transform:scale(1.8); opacity:0; } }

/* upgrader: the engraved gold bezel around the dial */
.uv-dial-ring { position:absolute; inset:-9%; width:118%; height:118%; z-index:2; pointer-events:none; }
.uv-dial { margin:14px 0; } .uv-dial::after { inset:9px; }

@media (min-width:900px) {
  .uv-phero { height:320px; border-radius:6px; margin-top:6px; } .uv-phero > div { padding:0 40px 32px; }
  .uv-daily { margin:28px 0 0; height:220px; }
  .uv-arena { margin:26px 0 0; border-radius:16px; padding:24px 22px 30px; }
  .uv-seat-av { width:80px; height:80px; } .uv-crown { width:54px; top:-36px; } .uv-vs-mini { width:44px; } .uv-seats.n4 .uv-vs-mini { width:36px; }
  .uv-arena .uv-reel.v { height:170px; } .uv-arena .uv-reel.v .uv-card { height:124px; }
  .uv-backpill { margin:10px 0 6px; } .uv-open-head { padding:0; }
  .uv-vtabs { display:none; }
}

/* ================================================================ the fun hero (2026-10-31): it's a casino, not a perfume ad.
   A looping Higgsfield clip of a box blasting out prizes, a pulsing live badge, heavy caps, a big pulsing gold CTA. */
.uv-fun { position:relative; height:clamp(520px, 150vw, 640px); overflow:hidden; display:flex; flex-direction:column; justify-content:flex-start; text-align:center; background:#12081d; }
.uv-fun-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 100%; }
.uv-fun::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,4,18,.85) 0%, rgba(10,4,18,.35) 32%, transparent 48%, transparent 85%, #000 100%); pointer-events:none; }
.uv-fun-copy { position:relative; z-index:1; padding:26px 18px 0; display:flex; flex-direction:column; align-items:center; }
.uv-live { display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border-radius:999px; background:rgba(0,0,0,.45); color:#ffe08a; font:800 10.5px/1 Manrope, sans-serif; letter-spacing:.14em; text-transform:uppercase; position:relative; overflow:hidden; }
.uv-live i { width:8px; height:8px; border-radius:50%; background:#3ddc84; animation:uvBlink 1.2s ease-in-out infinite; }
.uv-live::after { content:""; position:absolute; top:0; bottom:0; width:40%; left:-50%; background:linear-gradient(90deg, transparent, rgba(255,230,160,.35), transparent); animation:uvSheen 3s ease-in-out infinite; }
.uv-fun h1 { margin:14px 0 0; font:800 clamp(32px, 9.6vw, 44px)/1.02 Montserrat, sans-serif; letter-spacing:-.025em; text-transform:uppercase; color:#fff; text-shadow:0 4px 24px rgba(0,0,0,.55); }
.uv-fun h1 em { font-style:normal; background:linear-gradient(180deg,#fff2bd 0%,#ffd15c 45%,#e59a1c 100%); -webkit-background-clip:text; background-clip:text; color:transparent; text-shadow:none; filter:drop-shadow(0 2px 10px rgba(255,180,40,.45)); }
.uv-fun p { margin:10px 0 0; color:#efe3ff; font:600 14px/1.4 Manrope, sans-serif; max-width:30ch; text-shadow:0 2px 12px rgba(0,0,0,.6); }
.uv-fun-cta { display:flex; flex-direction:column; align-items:center; gap:10px; margin-top:18px; width:100%; }
.uv-fun-cta .uv-btn.big { width:min(100%, 320px); min-height:58px; font:800 17px/1 Montserrat, sans-serif; letter-spacing:.04em; text-transform:uppercase; }
.uv-pulse { position:relative; }
.uv-pulse::before { content:""; position:absolute; inset:-5px; border-radius:999px; border:2px solid rgba(255,209,92,.75); animation:uvRing 1.8s ease-out infinite; pointer-events:none; }
.uv-dailypill { min-height:42px; padding:0 20px; border:1.5px solid rgba(255,209,92,.6); border-radius:999px; background:rgba(60,20,90,.55); color:#ffe9a8; font:800 12.5px/1 Manrope, sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.uv-dailypill:disabled { opacity:.6; cursor:default; }
@keyframes uvBlink { 50% { opacity:.3; } }
@keyframes uvSheen { 60%, 100% { left:120%; } }
@keyframes uvRing { from { transform:scale(.96); opacity:1; } to { transform:scale(1.18); opacity:0; } }
@media (prefers-reduced-motion: reduce) { .uv-live i, .uv-live::after, .uv-pulse::before { animation:none; } }
@media (min-width:900px) {
  .uv-fun { height:560px; border-radius:16px; margin-top:6px; text-align:left; justify-content:center; }
  .uv-fun-bg { object-position:70% 50%; }
  .uv-fun::after { background:linear-gradient(90deg, rgba(10,4,18,.92) 0%, rgba(10,4,18,.6) 34%, transparent 60%), linear-gradient(180deg, transparent 80%, #000); }
  .uv-fun-copy { align-items:flex-start; padding:0 0 0 56px; max-width:640px; }
  .uv-fun h1 { font-size:72px; } .uv-fun p { font-size:16px; max-width:36ch; }
  .uv-fun-cta { flex-direction:row; width:auto; gap:14px; } .uv-fun-cta .uv-btn.big { width:auto; padding:0 40px; }
}
/* phones: the headline over the sky, the explosion in the middle, the buttons in their own band under the chest */
@media (max-width:899px) {
  .uv-fun { height:clamp(610px, 172vw, 700px); justify-content:space-between; }
  .uv-fun-bg { height:calc(100% - 136px); object-position:50% 100%; }
  .uv-fun::after { background:linear-gradient(180deg, rgba(10,4,18,.88) 0%, rgba(10,4,18,.35) 28%, transparent 42%), linear-gradient(0deg, #0a0412 0, #0a0412 136px, rgba(10,4,18,.0) 210px); }
  .uv-fun-cta { position:relative; z-index:1; margin:0; padding:0 18px 22px; }
}
@media (min-width:900px) { .uv-fun-cta { position:absolute; z-index:1; left:56px; top:calc(50% + 110px); } .uv-fun-copy { margin-top:-90px; } }
@media (max-width:899px) { .uv-fun { height:clamp(560px, 150vw, 610px); } .uv-fun-bg { height:calc(100% - 126px); } .uv-fun-copy { padding-top:18px; } .uv-fun h1 { margin-top:10px; } .uv-fun-cta { padding-bottom:16px; gap:8px; } .uv-fun-cta .uv-btn.big { min-height:54px; } }
/* box tiles: a clear gold outline (founder 2026-10-31), brighter on hover / tap */
.uv-tile { border:1.5px solid rgba(217,178,95,.6) !important; }
.uv-tile:hover, .uv-tile:active, .uv-tile:focus-visible { border-color:#f1d38c !important; }
/* ================================================================ the upgrader, redone (2026-10-31): stake → target slots, multipliers,
   a wheel whose green WIN zone is exactly the chance, a fixed gold pointer, one plain sentence of rules */
.uv-upg { display:flex; flex-direction:column; }
.uv-deal { display:grid; grid-template-columns:minmax(0, 1fr) 44px minmax(0, 1fr); align-items:stretch; gap:6px; }
.uv-slot2 { display:flex; flex-direction:column; align-items:center; gap:4px; padding:12px 8px 12px; border:1.5px dashed rgba(255,255,255,.18); border-radius:16px; background:#0b0a09; text-align:center; min-height:150px; justify-content:center; }
.uv-slot2.full { border-style:solid; border-color:rgba(255,255,255,.14); } .uv-slot2.win.full { border-color:rgba(61,220,132,.6); background:radial-gradient(90% 70% at 50% 30%, rgba(61,220,132,.14), #0b0a09 80%); }
.uv-slot2-plus { display:grid; place-items:center; width:46px; height:46px; border-radius:50%; background:rgba(217,178,95,.14); color:#f1d38c; font:400 30px/1 Manrope, sans-serif; margin:4px 0; }
.uv-slot2-imgs { display:flex; justify-content:center; margin:2px 0; } .uv-slot2-imgs img { width:56px; height:56px; border-radius:10px; object-fit:cover; margin-left:-12px; box-shadow:0 0 0 2px #0b0a09; } .uv-slot2-imgs img:first-child { margin-left:0; }
.uv-slot2 b { font:700 15px/1.1 Montserrat, sans-serif; color:var(--ink); } .uv-slot2 small { color:var(--dim); font-size:11px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.uv-deal-mid { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; } .uv-deal-mid svg { width:22px; height:22px; fill:none; stroke:var(--gold); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.uv-deal-mid span { font:800 12px/1 Montserrat, sans-serif; color:#3ddc84; }
.uv-mults { display:flex; justify-content:center; gap:6px; margin:12px 0 4px; }
.uv-mults button { min-width:52px; min-height:36px; border:1px solid rgba(217,178,95,.4); border-radius:999px; background:none; color:#f1d38c; font:800 13px/1 Montserrat, sans-serif; }
.uv-mults button:disabled { opacity:.35; cursor:default; }
.uv-wheelwrap { position:relative; width:min(74vw, 290px); aspect-ratio:1; margin:22px auto 10px; }
.uv-wheel { position:absolute; inset:0; border-radius:50%; background:
    repeating-conic-gradient(from 0deg, rgba(0,0,0,.35) 0 .6deg, transparent .6deg 6deg),
    conic-gradient(from 0deg, #2fd27a 0 var(--win), #2a2622 var(--win) 360deg);
  box-shadow:inset 0 0 0 6px #d9b25f, inset 0 0 0 9px #000; }
.uv-wheel::after { content:""; position:absolute; inset:16%; border-radius:50%; background:radial-gradient(circle at 50% 35%, #17140f, #050404 75%); box-shadow:0 0 0 3px #000, 0 0 0 5px rgba(217,178,95,.6); }
.uv-pointer { position:absolute; z-index:3; left:50%; top:-14px; width:0; height:0; margin-left:-13px; border-left:13px solid transparent; border-right:13px solid transparent; border-top:24px solid #f6dc95; filter:drop-shadow(0 2px 4px rgba(0,0,0,.6)); }
.uv-wheel-core { position:absolute; inset:16%; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border-radius:50%; }
.uv-wheel-core b { font:800 clamp(30px, 9vw, 42px)/1 Montserrat, sans-serif; color:#fff; letter-spacing:-.02em; } .uv-wheel-core span { margin-top:6px; font:700 10px/1 Manrope, sans-serif; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); }
.uv-wheel-core.won b { color:#3ddc84; } .uv-wheel-core.lost b { color:#ff6b6b; }
.uv-explain { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:4px 6px; margin:6px auto 16px; max-width:34ch; text-align:center; color:#c9c0b0; font:500 13px/1.45 Manrope, sans-serif; }
.uv-explain b { color:#3ddc84; } .uv-explain i { display:inline-block; width:10px; height:10px; border-radius:3px; } .uv-explain i.g { background:#2fd27a; } .uv-explain i.r { background:#2a2622; box-shadow:inset 0 0 0 1px rgba(255,255,255,.25); }
.uv-upg > .uv-btn.wide { max-width:420px; align-self:center; }
.uv-upg .uv-list-h { margin-top:30px; }
.uv-dial, .uv-dialwrap, .uv-updeal { display:none !important; }
@media (min-width:900px) { .uv-deal { max-width:640px; margin:0 auto; grid-template-columns:minmax(0, 1fr) 60px minmax(0, 1fr); } .uv-slot2 { min-height:190px; } .uv-slot2-imgs img { width:80px; height:80px; } .uv-wheelwrap { width:330px; } }
.uv-explain { display:block; } .uv-explain i { vertical-align:-1px; margin:0 4px 0 2px; }
/* hero: a calm OPEN A BOX (no pulse) with room above the free daily box pill (founder 2026-10-31) */
.uv-fun-cta, .uv-fun-cta[class] { gap:20px; }
@media (min-width:900px) { .uv-fun-cta { gap:22px; } }
/* the menu reads as a real control: a gold-edged segmented bar, the open screen filled gold */
.uv-vtabs { justify-content:stretch; gap:0; padding:10px 12px; border-bottom:1px solid rgba(217,178,95,.25); }
.uv-vtabs, .uv-tabs { --seg:rgba(255,255,255,.06); }
.uv-vtabs > button, .uv-tabs > button { flex:1; padding:12px 6px !important; color:#f3ead6; font:800 12.5px/1 Montserrat, Manrope, sans-serif; letter-spacing:.06em; text-transform:uppercase; border-radius:999px !important; transition:background .2s, color .2s; }
.uv-vtabs > button.on, .uv-tabs > button.on { background:linear-gradient(180deg, #ffe08a, #e0ac3c) !important; color:#1a1206; }
.uv-vtabs > button.on::after, .uv-tabs > button.on::after { display:none; }
.uv-vtabs > button:not(.on):hover, .uv-tabs > button:not(.on):hover { color:var(--gold); }
#uvVtabs { background:rgba(0,0,0,.94); }
#uvVtabs::before { content:""; position:absolute; inset:10px 12px; border-radius:999px; background:var(--seg); border:1px solid rgba(217,178,95,.45); pointer-events:none; }
#uvVtabs > button { position:relative; z-index:1; }
.uv-vtabs > button i { top:2px; right:6px; }
.uv-tabs { padding:4px; gap:2px !important; border-radius:999px; background:var(--seg); border:1px solid rgba(217,178,95,.45); }
.uv-tabs > button { flex:0 0 auto; padding:11px 20px !important; font-size:13px; }
#uvVtabs > button { margin:3px 0; padding:11px 2px !important; border-radius:999px !important; font-size:11.5px; letter-spacing:.03em; }
#uvVtabs > button:first-child { margin-left:3px; } #uvVtabs > button:last-child { margin-right:3px; }
#uvVtabs > button.on { background:linear-gradient(180deg, #ffe08a, #e0ac3c) !important; color:#1a1206 !important; }
#uvVtabs > button:not(.on) { color:#f3ead6 !important; }
#uvRoot .uv-tabs > button { border-radius:999px !important; } #uvRoot .uv-tabs > button.on { color:#1a1206 !important; } #uvRoot .uv-tabs > button:not(.on) { color:#f3ead6 !important; }
/* top space freed (founder 2026-10-31): no UNVEIL header row; the cash wallet sits in the portal header in place of the coin pill, the logo in the hero */
.uv-hwallet { display:none; }
body.uv-on #coinPill, body.uv-on #cashPill, body.uv-on #bonusBadge { display:none !important; }
body.uv-on .uv-hwallet { display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 4px 0 14px; border:1.5px solid rgba(217,178,95,.6); border-radius:999px; background:rgba(217,178,95,.1); white-space:nowrap; }
.uv-hwallet small { color:#c9b07a; font:700 9.5px/1 Manrope, sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.uv-hwallet b { color:#ffe9a8; font:800 14px/1 Manrope, sans-serif; font-variant-numeric:tabular-nums; }
.uv-hadd { width:30px; height:30px; min-height:0; padding:0; border:0; border-radius:50%; background:linear-gradient(180deg, #ffe08a, #e0ac3c); color:#1a1206; font:800 18px/1 Manrope, sans-serif; }
.uv-hadd[hidden] { display:none; } body.uv-on .uv-hwallet:has(.uv-hadd[hidden]) { padding-right:14px; }
@media (max-width:899px) { .uv-top { display:none; } body.uv-on .uv-hwallet small { display:none; } body.uv-on .uv-hwallet { height:36px; padding-left:12px; } .uv-hwallet b { font-size:13px; } }
@media (min-width:900px) { .uv-top { justify-content:center; padding:14px 40px 6px; } }
.uv-fun-logo { display:block; height:22px; width:auto; margin:0 0 10px; }
@media (min-width:900px) { .uv-fun-logo { height:30px; margin-bottom:14px; } }
@media (min-width:900px) { .uv-fun-copy { margin-top:-140px; } }
/* the daily box countdown ticks live; digits stay put as they change */
.uv-cd span { display:inline-block; min-width:8ch; margin-left:4px; color:#ffd15c; font-variant-numeric:tabular-nums; letter-spacing:.06em; text-align:left; }
.uv-dailypill.uv-cd:disabled { opacity:1; }
/* win screen: a bigger logo and the cash balance, which ticks up when an item is sold */
.uv-win-logo { height:34px; margin-bottom:10px; opacity:1; }
@media (min-width:900px) { .uv-win-logo { height:42px; } }
.uv-win-bal { display:inline-flex; align-items:center; gap:8px; margin-bottom:6px; padding:8px 14px; border:1.5px solid rgba(217,178,95,.55); border-radius:999px; background:rgba(217,178,95,.1); }
.uv-win-bal small { color:#c9b07a; font:700 9.5px/1 Manrope, sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.uv-win-bal b { color:#ffe9a8; font:800 14px/1 Manrope, sans-serif; font-variant-numeric:tabular-nums; }
.uv-flash { animation:uvFlash .9s cubic-bezier(.2,.8,.2,1); }
@keyframes uvFlash { 25% { color:#7dffa8; transform:scale(1.12); } }
.uv-win-bal b, .uv-hwallet b { display:inline-block; }
#uvModal { justify-content:center; align-content:center; } /* a portal rule set space-between, which pinned the win screen left on desktop */
/* hero: the logo leads (big, with a gold glow) and the LIVE top prize reads as a headline badge (founder 2026-10-31) */
.uv-fun-logo { height:clamp(64px, 19vw, 84px); margin:0 0 6px; filter:drop-shadow(0 0 18px rgba(255,190,70,.45)) drop-shadow(0 2px 6px rgba(0,0,0,.8)); }
@media (min-width:900px) { .uv-fun-logo { height:104px; margin:0 0 10px -6px; } }
.uv-live { gap:10px; padding:5px 16px 5px 5px; border:1.5px solid rgba(255,209,92,.75); background:rgba(14,6,24,.78); color:#fff; font:700 12.5px/1 Manrope, sans-serif; letter-spacing:.04em; text-transform:none; }
.uv-live-tag { display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; background:#e3263f; color:#fff; font:800 11px/1 Manrope, sans-serif; letter-spacing:.14em; text-transform:uppercase; }
.uv-live-tag i { width:7px; height:7px; border-radius:50%; background:#fff; animation:uvBlink 1.2s ease-in-out infinite; }
.uv-live > i { display:none; }
.uv-live-txt { white-space:nowrap; text-transform:uppercase; letter-spacing:.1em; font-size:11px; color:#f3ead6; }
.uv-live-txt strong { margin-left:4px; color:#ffd15c; font:800 16px/1 Montserrat, sans-serif; letter-spacing:0; text-shadow:0 0 14px rgba(255,190,70,.5); }
@media (min-width:900px) { .uv-live-txt strong { font-size:19px; } .uv-live { padding-right:18px; } }
@media (prefers-reduced-motion: reduce) { .uv-live-tag i { animation:none; } }
@media (max-width:899px) { .uv-fun { height:clamp(610px, 168vw, 680px); } .uv-fun-logo { height:clamp(56px, 16vw, 70px); } }
@media (min-width:900px) { .uv-fun-copy { margin-top:0; } .uv-fun-cta { position:relative; left:auto; top:auto; align-self:flex-start; margin:22px 0 0 56px; } }
/* phones: the headline in its own band, then the prizes bursting out of the chest (the wide clip, framed on the prizes so they are not hidden by text and the chest stays small), then the buttons (founder 2026-10-31) */
@media (max-width:899px) {
  .uv-fun { height:auto; justify-content:flex-start; background:radial-gradient(120% 60% at 50% 0%, #2a0f45 0%, #12081d 55%, #0a0412 100%); }
  .uv-fun::after { display:none; }
  .uv-fun-copy { order:1; padding:18px 16px 4px; }
  .uv-fun-bg { order:2; position:relative; inset:auto; width:100%; height:clamp(300px, 92vw, 400px); object-fit:cover; object-position:74% 40%; -webkit-mask-image:linear-gradient(180deg, transparent 0, #000 14%, #000 84%, transparent 100%); mask-image:linear-gradient(180deg, transparent 0, #000 14%, #000 84%, transparent 100%); }
  .uv-fun-cta { order:3; padding:4px 18px 20px; }
}
@media (max-width:899px) { .uv-fun-bg { height:clamp(200px, min(70vw, 100svh - 500px), 300px); object-position:84% 45%; } .uv-fun p { margin-top:8px; font-size:13px; } .uv-fun h1 { margin-top:8px; } .uv-fun-copy { padding-top:12px; } .uv-fun-cta { gap:14px; } }
/* phones, take 2 (founder 2026-10-31): compact again; the art sits behind the text (a soft, dark wash of the same scene), and the prizes
   burst into view at the bottom of the banner just under the headline, rising up under the copy instead of pushing it all down */
@media (max-width:899px) {
  .uv-fun { isolation:isolate; }
  .uv-fun::before { content:""; position:absolute; inset:-30px; z-index:-1; background:url(assets/unveil/ui/fun-wide.jpg) 80% 30% / cover no-repeat; filter:blur(16px) brightness(.42) saturate(1.2); }
  .uv-fun-copy { position:relative; z-index:2; }
  .uv-fun-bg { position:relative; z-index:1; margin-top:-96px; height:clamp(230px, 70vw, 290px); object-position:84% 42%; -webkit-mask-image:linear-gradient(180deg, transparent 0, rgba(0,0,0,.55) 22%, #000 46%, #000 86%, transparent 100%); mask-image:linear-gradient(180deg, transparent 0, rgba(0,0,0,.55) 22%, #000 46%, #000 86%, transparent 100%); }
  .uv-fun-cta { position:relative; z-index:2; margin-top:-8px; }
}
@media (max-width:899px) { .uv-fun-bg { margin-top:-50px; } }
