/* RSI Arena teaser: a printed fight-night poster. Palette: Bake AI Color System v1.0 (Ink, Warm Ivory,
   Frontier Moss, Ember Amber, Clay) plus the mascot's own browns and creams. One geometric sans, Outfit. */
:root{color-scheme:light;--ink:#231a15;--ink-deep:#15100c;--ivory:#f7f0df;--paper:#fbf7ee;--moss:#5d6b2c;--amber:#df9d49;--amber-200:#efd5af;--clay:#8b4b2e;--crumb:#5f320c;--crust:#e1750a;--mist:#c8d6df;--ink-700:#524941;--ink-500:#827a70;--ink-300:#a79e90;--ink-200:#bcb4a6;--ink-100:#d9d2c3;--sans:"Outfit","Avenir Next","Segoe UI",system-ui,sans-serif;--ease:cubic-bezier(.23,1,.32,1)}
*{box-sizing:border-box}
body{margin:0;background:#f7f0df;color:var(--ink);font:400 16px/1.55 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
[hidden]{display:none!important}
img{display:block;max-width:100%}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
a{color:inherit}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.wrap{max-width:1240px;margin:0 auto;padding-inline:clamp(16px,4vw,40px)}
.ver{min-height:100vh}
/* Shared pieces: logo badges, the mascot-style stickers, form notes, the footer. */
.badge{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:50%;background:#fbf7ee;box-shadow:inset 0 0 0 1px rgba(35,26,21,.08);overflow:hidden}
.badge img{width:60%;height:60%;object-fit:contain}
.badge.dark{background:#0c0c0c;box-shadow:none}
.stk{display:inline-block;flex:none;width:56px;height:56px}
.stk svg{display:block;width:100%;height:100%;overflow:visible}
.formnote{min-height:1.5em;margin:10px 2px 0;font-size:14px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;min-width:0}
.brand a{display:flex;align-items:center;gap:8px;text-decoration:none}
.brand a:hover{opacity:.8}
.brand img{width:42px;height:42px;margin:-4px -2px -4px 0}
.brand .wm{flex:none;width:64px;height:17px;transform:translateY(-2px);background:currentColor;-webkit-mask:url(assets/bake-ai-wordmark.svg) left center/contain no-repeat;mask:url(assets/bake-ai-wordmark.svg) left center/contain no-repeat}
.brand .rule{flex:none;width:1px;height:20px;background:currentColor;opacity:.28}
.brand b{font-weight:600;font-size:18px;letter-spacing:-.01em;white-space:nowrap}
.foot{background:#0f0b08;color:var(--ivory);padding-block:44px calc(44px + env(safe-area-inset-bottom,0px))}
.foot .frow{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px}
.foot .partners{display:flex;flex-direction:column;gap:14px;max-width:100%}
.foot .plab{font-weight:800;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-300)}
.foot .logos{display:flex;flex-wrap:wrap;align-items:center;gap:20px 24px}
.scale{height:18px;width:auto}
.pm{display:block;flex:none;background:var(--ivory);-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.pm.nd{width:94px;height:22px;-webkit-mask-image:url(assets/partner-nd.svg);mask-image:url(assets/partner-nd.svg)}
.pm.uw{width:42px;height:28px;-webkit-mask-image:url(assets/partner-uw.svg);mask-image:url(assets/partner-uw.svg)}
.pm.stanford{width:92px;height:21px;-webkit-mask-image:url(assets/partner-stanford.png);mask-image:url(assets/partner-stanford.png)}
.foot .fsmall{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:34px;padding-top:22px;border-top:1px solid rgba(247,240,223,.1);font-size:14px;color:var(--ink-300)}
.foot .fsmall a{text-decoration:none}
.foot .fsmall a:hover{text-decoration:underline}
/* The draft bar: not part of the site. */
.drafts{position:relative;z-index:50;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px;padding:6px 12px;border-bottom:2px solid var(--amber);background:#0d0a08;color:var(--ivory);font-size:14px}
.drafts button{height:38px;padding:0 15px;border:0;border-radius:19px;background:none;color:var(--ink-100);font-weight:500;white-space:nowrap}
.drafts button:hover{color:var(--ivory)}
.drafts button[aria-pressed=true]{background:var(--ivory);color:var(--ink)}
.drafts .statectl{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px;min-height:38px;padding:0 4px;color:var(--ink-100)}
.drafts .statectl button{height:30px;padding:0 10px;font-size:13px}
.drafts .dnote{padding:0 10px;color:var(--ink-300);white-space:nowrap}
.cdn i{display:inline-block;width:.6em;font-style:normal;text-align:center}
/* ============ The page: a printed fight-night poster ============ */
.vb{--pp:#f7f0df;--moss-lt:#b8c77e;color:var(--ink);background-color:var(--pp);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .14 0 0 0 0 .1 0 0 0 0 .08 .15 0 0 0 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.vb .ticker{display:flex;align-items:center;height:38px;overflow:hidden;background:var(--ink);color:var(--ivory);white-space:nowrap}
.vb .ticker .track{display:flex;flex:none;animation:tick 46s linear infinite}
.vb .ticker .track>span{display:inline-flex;align-items:center;gap:26px;padding-right:26px;font-weight:700;font-size:13px;letter-spacing:.15em;text-transform:uppercase}
.vb .ticker .track>span:after{content:"";width:7px;height:7px;border-radius:50%;background:var(--amber)}
@keyframes tick{to{transform:translateX(-50%)}}
/* The news strip under the ticker: the latest report, one line, the whole strip is the link. */
.vb .news{display:flex;align-items:center;justify-content:center;gap:10px 18px;min-height:54px;padding:9px clamp(16px,4vw,40px);border-bottom:3px solid var(--ink);background:var(--amber);color:var(--ink);text-decoration:none}
.vb .news .new{flex:none;padding:4px 9px 3px;background:var(--ink);color:var(--amber);font-weight:800;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.vb .news .nt{min-width:0;font-size:16px;line-height:1.3}
.vb .news .nt b{font-weight:900;letter-spacing:.02em;text-transform:uppercase}
.vb .news .go{flex:none;font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.vb .news:hover{background:var(--ink);color:var(--pp)}
.vb .news:hover .new{background:var(--amber);color:var(--ink)}
.vb .top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:16px;border-bottom:3px solid var(--ink)}
.vb .brand small{font-size:13px;font-weight:600;color:var(--clay);white-space:nowrap}
/* The RSI Arena logo kit: the compact mark in the header, the full logo in the hero and the footer. */
.vb .brand .rsimark{width:auto;height:44px;margin:0}
.vb .brand .rule{height:28px}
.vb .brand{--mk:30px}
.vb .brand .by{display:flex;align-items:center;gap:8px}
.vb .brand .bakemark{width:var(--mk);height:var(--mk);margin:0 -3px 0 -2px}
/* The Bake AI wordmark sits on the loaf, not on the whole mascot: the chef's hat fills the top of the image, so the
   loaf's centre is 14.9% of the mascot's height below the image centre (measured on the artwork). "by" moves with it. */
.vb .brand .wm{width:70px;height:18px;transform:translateY(calc(var(--mk) * .149))}
.vb .brand .by small{transform:translateY(calc(var(--mk) * .149))}
.vb .mega-logo img{width:100%;height:auto;vertical-align:top}
.vb .mega-logo svg{display:block;width:100%;height:auto}
/* Animated logos by default; the still ones after the livestream (grey live dot) and for reduced motion. */
.vb .still{display:none}
.vb[data-live=ended] .anim{display:none}
.vb[data-live=ended] .still{display:block}
.vb[data-live=ended] .still circle{fill:#5E554D}
.foot .brand .rsilogo{display:block;flex:none;width:150px;line-height:0}
.foot .brand .rsilogo img{width:100%;height:auto;margin:0;vertical-align:top}
.foot .brand .rsilogo svg{display:block;width:100%;height:auto}
.foot .brand .bakemark{width:var(--mk);height:var(--mk);margin:0 -3px 0 0}
.vb .mega-logo{width:min(100%,520px);margin:10px 0 0;line-height:0}
.vb .links{display:flex;gap:26px;font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase}
.vb .links a{text-decoration:none}
.vb .links a:hover{color:var(--clay)}
.vb .btn{display:inline-grid;place-items:center;height:44px;padding:0 20px;border:0;background:var(--ink);color:var(--pp);font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.vb .btn:hover{background:var(--clay)}
.vb .hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px 40px;align-items:end;padding-block:clamp(28px,4vw,48px) 40px;border-bottom:3px solid var(--ink)}
.vb .presents{margin:0;font-weight:800;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--clay)}
.vb .q{max-width:16em;margin:30px 0 0;font-weight:800;font-size:clamp(24px,2.5vw,34px);line-height:1.08;letter-spacing:-.022em;text-wrap:balance}
.vb .q em{font-style:normal;color:var(--clay);text-decoration:underline;text-decoration-color:var(--amber);text-decoration-thickness:.14em;text-underline-offset:.13em}
.vb .blurb{max-width:31em;margin:18px 0 0;font-size:18px;line-height:1.5;color:#4b4037}
.vb .daterow{display:flex;align-items:flex-end;gap:12px;margin-top:30px}
/* The date box is a ticket: the date, the clock and the visitor's own time, with the two actions as its tear-off row. */
.vb .dateblock{flex:0 1 auto;min-width:0;display:flex;flex-direction:column;gap:12px}
.vb .date{display:grid;grid-template-columns:auto minmax(0,1fr);border:3px solid var(--ink);background:var(--pp)}
.vb .date .acts{grid-column:1/-1;display:flex;border-top:3px solid var(--ink)}
.vb .act{display:inline-grid;flex:1 1 0;place-items:center;height:50px;padding:0 14px;border:0;background:var(--pp);color:var(--ink);font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;white-space:nowrap;cursor:pointer}
.vb .act+.act{border-left:3px solid var(--ink)}
.vb .act.primary{background:var(--amber)}
.vb .act:hover{background:var(--ink);color:var(--pp)}
.vb .date[data-st=live] .day{background:var(--amber);color:var(--ink)}
.vb .cal{align-self:flex-start;font-weight:700;font-size:13px;color:var(--clay);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.vb .cal:hover{color:var(--ink)}
.vb .date .day{display:flex;flex-direction:column;justify-content:center;padding:12px 20px;background:var(--ink);color:var(--pp);font-weight:900;font-size:48px;line-height:.9;letter-spacing:-.035em;text-transform:uppercase}
.vb .date .day span{white-space:nowrap}
.vb .date .day small{margin-top:8px;font-size:12px;font-weight:700;letter-spacing:.18em}
.vb .date .info{display:flex;flex-direction:column;justify-content:center;gap:5px;padding:12px 20px;font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.vb .date .cdn{font-weight:800;font-size:28px;letter-spacing:-.01em;line-height:1.05}
.vb .date .cdn u{margin:0 .22em 0 .04em;font-size:.55em;text-decoration:none;color:var(--clay)}
.vb .side{display:flex;flex-direction:column;justify-content:space-between;gap:84px;align-self:stretch;min-width:0}
/* The live sign hangs over the ring on two cables and swings a little. */
.vb .arena{position:relative;padding-top:58px}
.vb .livesign{position:absolute;top:0;left:50%;z-index:3;display:inline-flex;align-items:center;gap:12px;height:50px;padding:0 18px 0 8px;border:3px solid var(--crumb);border-radius:14px;background:var(--ink);color:var(--pp);text-decoration:none;white-space:nowrap;box-shadow:0 5px 0 var(--crumb);transform:translateX(-50%);transform-origin:50% -72px;animation:swing 5s ease-in-out infinite}
.vb .livesign:hover{background:#3b2a20}
.vb .livesign .cable{position:absolute;bottom:calc(100% + 3px);width:3px;height:72px;border-radius:2px;background:linear-gradient(to top,var(--crumb) 45%,rgba(95,50,12,0))}
.vb .livesign .cable.l{left:26px}
.vb .livesign .cable.r{right:26px}
.vb .onair{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 11px;border-radius:9px;background:var(--amber);color:var(--ink);font-weight:800;font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.vb .onair i{width:8px;height:8px;border-radius:50%;background:var(--ink);animation:onair 1.8s ease-in-out infinite}
.vb .livesign .url{font-weight:800;font-size:21px;letter-spacing:.005em}
.vb .livesign .arr{font-weight:700;font-size:19px;color:var(--amber)}
@keyframes swing{0%,100%{transform:translateX(-50%) rotate(-1.4deg)}50%{transform:translateX(-50%) rotate(1.4deg)}}
@keyframes onair{0%,100%{opacity:1}50%{opacity:.25}}
.vb .feat-l{margin:0;font-weight:800;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--clay)}
.vb .feat{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 24px;margin:12px 0 0;padding:18px 0 0;list-style:none;border-top:3px solid var(--ink)}
.vb .feat li{display:flex;align-items:center;gap:12px;min-width:0;font-weight:800;font-size:clamp(15px,1.35vw,19px);line-height:1.08;letter-spacing:-.005em;text-transform:uppercase}
.vb .feat .badge{width:32px;height:32px;box-shadow:0 0 0 2px var(--ink)}
.vb .ringbox{position:relative;width:100%;aspect-ratio:500/262;margin-bottom:6px}
.vb .ring-art{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.vb .ring-art path,.vb .ring-art ellipse{vector-effect:non-scaling-stroke}
.vb .ring-art .apron{fill:var(--clay)}
.vb .ring-art .apron-lip{fill:#a45e36}
.vb .ring-art .apron-foot{fill:#6d391f}
.vb .ring-art .apron-edge{fill:none;stroke:var(--crumb);stroke-width:2.5;stroke-linejoin:round}
.vb .ring-art .floor{fill:#b3c6d1}
.vb .ring-art .floor-in{fill:var(--mist);stroke:none}
.vb .ring-art .floor-spot{fill:#b3c6d1;opacity:.6}
.vb .ring-art .floor-edge{fill:none;stroke:var(--crumb);stroke-width:2.5;stroke-linejoin:round}
.vb .ring-art .posts path,.vb .ring-art .ropes path,.vb .ring-art .pads path{fill:none;stroke-linecap:round}
.vb .ring-art .post-o{stroke:var(--crumb);stroke-width:14}
.vb .ring-art .post{stroke:#fff4dc;stroke-width:8.5}
.vb .ring-art .rope-o{stroke:var(--crumb);stroke-width:6.5}
.vb .ring-art .rope{stroke:#fff4dc;stroke-width:3}
.vb .ring-art .rope.mid{stroke:var(--crust)}
.vb .ring-art .pad-o{stroke:var(--crumb);stroke-width:20}
.vb .ring-art .pad{stroke-width:14.5}
.vb .ring-art .pads.a .pad{stroke:var(--crust)}
.vb .ring-art .pads.b .pad{stroke:var(--moss-lt)}
.vb .fighter{position:absolute;bottom:25%;height:70%;aspect-ratio:1}
.vb .fighter.l{right:calc(50% + 12px)}
.vb .fighter.r{left:calc(50% + 12px)}
.vb .fighter .shade{position:absolute;left:14%;right:14%;bottom:-3%;height:8%;border-radius:50%;background:rgba(95,50,12,.22)}
.vb .bob{position:absolute;inset:0;transform-origin:50% 100%;animation:bob 1.1s ease-in-out infinite alternate}
.vb .fighter.r .bob{animation-delay:-.55s}
.vb .face{position:absolute;inset:0}
.vb .fighter.l .face{transform:scaleX(-1)}
.vb .face img{width:100%;height:100%}
.vb .glove{position:absolute;aspect-ratio:48/40;overflow:visible}
.vb .glove.lead{top:66%;left:-2%;width:27%;animation:jab 3.4s var(--ease) infinite}
.vb .glove.guard{top:70.5%;left:67%;width:25%;transform:rotate(10deg)}
.vb .fighter.l .glove{color:var(--crust)}
.vb .fighter.r .glove{color:var(--moss-lt)}
.vb .fighter.r .glove.lead{animation-delay:-1.7s}
@keyframes bob{from{transform:translateY(0)}to{transform:translateY(-2.5%)}}
@keyframes jab{0%,72%,100%{transform:translateX(0)}79%{transform:translateX(-20%)}88%{transform:translateX(0)}}
.vb .vs{position:absolute;top:40%;left:50%;display:grid;place-items:center;width:62px;height:62px;transform:translate(-50%,-50%) rotate(-8deg)}
.vb .vs svg{position:absolute;inset:0;width:100%;height:100%}
.vb .vs path{fill:var(--amber);stroke:var(--crumb);stroke-width:4;stroke-linejoin:round}
.vb .vs b{position:relative;font-style:italic;font-weight:900;font-size:20px;color:var(--crumb)}
.vb .apron-name .apron-at{margin-left:.5em}
.vb .apron-name .colm{display:inline-block;width:38px;height:20px;margin:0 .45em 0 .1em;vertical-align:-5px;background:#f6dcc0;-webkit-mask:url(assets/colm.svg) center/contain no-repeat;mask:url(assets/colm.svg) center/contain no-repeat}
.vb .apron-name{position:absolute;top:88%;left:50%;display:flex;align-items:center;font-weight:800;font-size:13px;letter-spacing:.3em;text-transform:uppercase;white-space:nowrap;color:#f6dcc0;transform:translate(-50%,-50%)}
.vb .shead{display:flex;flex-wrap:nowrap;align-items:flex-end;justify-content:space-between;gap:12px 32px;padding-block:52px 22px}
.vb h2{margin:0;font-weight:900;font-size:clamp(44px,5.8vw,84px);line-height:.86;letter-spacing:-.045em;text-transform:uppercase}
.vb .shead p{flex:0 1 20em;min-width:14em;margin:0;font-size:17px;color:#4b4037;text-wrap:pretty}
/* A strip under the hero: what RSI means, and who the arena is made with. Scale AI's lockup stays white on Ink. */
.vb .band{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;padding:28px 30px 26px;background:var(--ink);color:var(--pp)}
.vb .band .rsi{max-width:none;margin:0;padding-top:18px;border-top:1px solid rgba(247,240,223,.14);font-size:15px;line-height:1.55;color:#e2d6c2}
.vb .band .rsi b{margin-right:3px;font-weight:900;letter-spacing:.08em;color:var(--amber)}
.vb .band .partners{order:-1;display:flex;flex-wrap:wrap;align-items:center;gap:16px 44px}
.vb .band .plab{font-weight:800;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-300)}
.vb .band .logos{display:flex;flex:1 1 560px;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px}
.vb .band .scale{width:auto;height:25px}
.vb .band .pm.nd{width:130px;height:31px}
.vb .band .pm.uw{width:58px;height:39px}
.vb .band .pm.stanford{width:132px;height:30px}
/* Latest news: the arena's reports, newest first. Each item is one link: the day, the story, the way in. */
.vb .newslist{margin:0;padding:0;list-style:none;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.vb .newslist li+li{border-top:1.5px solid var(--ink)}
.vb .nitem{display:grid;grid-template-columns:auto minmax(0,1fr) auto;color:inherit;text-decoration:none}
.vb .ndate{display:flex;flex-direction:column;justify-content:center;gap:10px;min-width:200px;padding:26px 28px;background:var(--ink);color:var(--pp)}
.vb .ndate b{font-weight:900;font-size:60px;line-height:.82;letter-spacing:-.03em;text-transform:uppercase;color:var(--amber);white-space:nowrap}
.vb .ndate small{font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#d8ccb7}
.vb .nbody{display:flex;flex-direction:column;gap:10px;min-width:0;padding:26px 32px}
.vb .nk{font-weight:800;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--clay)}
.vb .nt{font-weight:900;font-size:clamp(26px,2.8vw,40px);line-height:.98;letter-spacing:-.03em;text-transform:uppercase;text-wrap:balance}
.vb .nd{max-width:44em;font-size:17px;line-height:1.5;color:#4b4037}
.vb .nstats{display:flex;flex-wrap:wrap;gap:6px 8px;margin-top:4px}
.vb .nstats span{padding:4px 9px 3px;border:1.5px solid var(--ink);font-weight:800;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.vb .ngo{display:flex;align-items:center;justify-content:center;padding:0 30px;border-left:3px solid var(--ink);background:var(--amber);font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.vb .nitem:hover .ngo{background:var(--ink);color:var(--pp)}
.vb .nitem:hover .nt{color:var(--clay)}
/* After a pick: a small poster of the visitor's corner, with a link to copy and an X post. */
.vb .shareband{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px 40px;align-items:center;margin-top:18px;padding:24px 28px;background:var(--ink);color:var(--pp)}
.vb .sc-poster{display:flex;align-items:center;gap:16px;min-width:0;padding:16px 26px 16px 16px;border:3px solid var(--amber);background:var(--pp);color:var(--ink);transform:rotate(-1.5deg)}
.vb .sc-badges{display:flex;flex:none}
.vb .sc-poster .badge{width:52px;height:52px;box-shadow:0 0 0 3px var(--ink)}
.vb .sc-badges .badge+.badge{margin-left:-14px}
.vb .sc-poster .k{margin:0;font-weight:800;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--clay)}
.vb .sc-poster .n{margin:2px 0 0;font-weight:900;font-size:clamp(16px,1.6vw,20px);line-height:1.12;letter-spacing:-.02em;text-transform:uppercase}
.vb .sc-poster .d{margin:7px 0 0;font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.vb .sc-body .m{margin:0 0 14px;font-size:17px;color:#e2d6c2}
.vb .sc-acts{display:flex;flex-wrap:wrap;gap:10px}
.vb .sc-acts .act{flex:0 0 auto;height:48px;padding:0 22px}
.vb .sc-acts .act+.act{border-left:0}
.vb .shareband .formnote{color:#e2d6c2}
.vb .corner .pick:disabled{cursor:default;opacity:.45}
.vb .corner.on .pick:disabled{opacity:1}
.vb .onair b{font-weight:inherit}
.vb .livesign:not([data-st=live]) .onair{background:transparent;color:var(--pp);box-shadow:inset 0 0 0 2px rgba(244,234,214,.45)}
.vb .livesign:not([data-st=live]) .onair i{display:none}
.vb .fightcard{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.vb .corner{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:0;padding:22px 22px 20px;border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink)}
.vb .corner:nth-child(4n){border-right:0}
.vb .corner:nth-child(n+5){border-bottom:0}
.vb .corner .lt{font-weight:800;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--clay)}
.vb .corner .badge{width:66px;height:66px;box-shadow:0 0 0 3px var(--ink)}
.vb .corner .nm{margin:4px 0 0;font-weight:900;font-size:clamp(21px,2vw,27px);line-height:.98;letter-spacing:-.02em;text-transform:uppercase;overflow-wrap:anywhere}
.vb .corner .mk{margin:0;font-weight:500;font-size:14px;color:#6b5f55}
.vb .corner .pick{width:100%;height:42px;margin-top:auto;border:2px solid var(--ink);background:none;font-weight:800;font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.vb .corner .pick:hover{background:rgba(35,26,21,.06)}
.vb .corner.on{background:rgba(223,157,73,.16)}
.vb .corner.on .pick{background:var(--ink);color:var(--pp)}
.vb .stamp{position:absolute;top:16px;right:10px;padding:3px 7px;border:3px solid var(--clay);color:var(--clay);font-weight:900;font-size:13px;letter-spacing:.12em;text-transform:uppercase;opacity:0;transform:rotate(-12deg) scale(1.7);transition:opacity .25s,transform .35s var(--ease);pointer-events:none}
.vb .corner.on .stamp{opacity:1;transform:rotate(-12deg) scale(1)}
/* Watch it live: Moss, with COLM's mark painted Ivory. */
.vb .live{display:grid;grid-template-columns:minmax(0,1fr);min-height:440px;align-items:center;margin-top:56px;padding:clamp(26px,4vw,46px);background:var(--moss);color:var(--pp)}
.vb .live .k{margin:0 0 10px;font-weight:800;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#dfe5b4}
.vb .live h2{color:var(--pp)}
.vb .live .d{max-width:32em;margin:18px 0 24px;font-size:18px;line-height:1.5;color:#eceed6}
.vb .live .acts2{display:flex;flex-wrap:wrap;gap:10px}
.vb .live .act{flex:0 0 auto;height:50px;padding:0 22px}
.vb .live .act+.act{border-left:0;background:transparent;color:var(--pp);box-shadow:inset 0 0 0 2px rgba(247,240,223,.6)}
.vb .live .act+.act:hover{background:var(--pp);color:var(--moss)}
.vb .live .lv{max-width:600px}
.vb .live .colm{display:block;width:150px;aspect-ratio:772.53/402.61;background:var(--pp);-webkit-mask:url(assets/colm.svg) right center/contain no-repeat;mask:url(assets/colm.svg) right center/contain no-repeat}
.vb .live .cmark{position:absolute;top:clamp(26px,4vw,46px);right:clamp(26px,4vw,46px);display:grid;justify-items:end;gap:10px;text-align:right}
.vb .live .cmark p{margin:0;font-weight:800;font-size:12px;line-height:1.55;letter-spacing:.14em;text-transform:uppercase;color:#eceed6}
/* Weigh-in slip: one printed slip, the same for every corner, stamped. */
.vb .tv2-wrap{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:36px 56px;align-items:center}
.vb .tv2-head h2{font-size:clamp(48px,5.6vw,84px);line-height:.84}
.vb .tv2-head p{max-width:22em;margin:18px 0 0;font-size:17px;color:#4b4037}
.vb .slip{position:relative;margin:14px 0;padding:30px 34px;background:#fffdf6;color:var(--ink);box-shadow:0 22px 44px rgba(35,26,21,.16),0 2px 0 rgba(35,26,21,.06);transform:rotate(-1.4deg)}
.vb .slip:before,.vb .slip:after{content:"";position:absolute;left:0;right:0;height:12px;background:radial-gradient(circle at 7px 12px,transparent 6px,#fffdf6 6.5px) 0 0/14px 12px repeat-x}
.vb .slip:before{top:-11px}
.vb .slip:after{bottom:-11px;transform:scaleY(-1)}
.vb .slip-top{display:flex;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:4px double var(--ink);font-weight:800;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.vb .slip-t{margin:16px 0 12px;font-weight:900;font-size:30px;letter-spacing:-.02em;text-transform:uppercase}
.vb .lines{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.vb .lines li{display:flex;align-items:baseline;gap:10px}
.vb .lines .k{flex:none;font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#6b5f55}
.vb .lines .lead{flex:1 1 auto;min-width:16px;border-bottom:2px dotted rgba(35,26,21,.35);transform:translateY(-4px)}
.vb .nw{white-space:nowrap}
.vb .lines .v{flex:none;max-width:60%;font-weight:900;font-size:19px;text-align:right}
.vb .weighed{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:22px;padding-top:16px;border-top:2px dashed rgba(35,26,21,.3)}
.vb .weighed .wl{font-weight:800;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#6b5f55}
.vb .weighed .wv{font-weight:900;font-size:17px}
.vb .sig{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:14px}
.vb .signed{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 12px;min-width:0}
.vb .sig .line{width:min(150px,100%);height:28px;border-bottom:2px solid var(--ink)}
.vb .sig .who{font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#6b5f55}
.vb .stamp2{position:relative;flex:none;margin:-6px 0 -14px;display:grid;place-items:center;align-content:center;width:132px;height:132px;border:4px solid var(--moss);border-radius:50%;box-shadow:inset 0 0 0 5px #fffdf6,inset 0 0 0 7px var(--moss);color:var(--moss);text-align:center;transform:rotate(-14deg);opacity:.92}
.vb .stamp2 span{font-weight:800;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase}
.vb .stamp2 b{margin:3px 0;font-weight:900;font-size:30px;line-height:1;letter-spacing:.02em;text-transform:uppercase}
.vb .tv2-wrap{padding-top:64px}
/* San Francisco in the COLM box: the Golden Gate from Battery Spencer, grey, multiplied into Moss. */
.vb .live{position:relative;isolation:isolate;overflow:hidden}
.vb .live .sf{position:absolute;top:0;left:39%;z-index:-1;width:64%;max-width:none;height:126%;object-fit:cover;object-position:50% 0;filter:contrast(1.2) brightness(1.06);mix-blend-mode:multiply;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%);mask-image:linear-gradient(90deg,transparent 0,#000 12%)}
/* One-colour logos: each mark is a mask painted in the text colour. */
.vb .mono{display:block;flex:none;width:40px;height:40px;background:currentColor;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
/* Tale of the tape: the eight marks run end to end in an ink band, two rows in opposite directions. */
.vb .lmarq{margin-top:30px;padding:22px 0 24px;background:var(--ink);color:var(--pp)}
.vb .lmarq .k{margin:0 24px 16px;font-weight:800;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--amber)}
.vb .lmarq .row{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.vb .lmarq .row+.row{margin-top:16px}
.vb .lmarq .track{display:flex;width:max-content;animation:tick 34s linear infinite}
.vb .lmarq .row.rev .track{animation-direction:reverse;animation-duration:40s}
.vb .lmarq:hover .track{animation-play-state:paused}
.vb .lmarq .mi{display:inline-flex;align-items:center;gap:12px;padding-right:22px}
.vb .lmarq .mi:after{content:"";flex:none;width:6px;height:6px;margin-left:10px;border-radius:50%;background:var(--amber)}
.vb .lmarq .mi .mono{width:34px;height:30px}
.vb .lmarq .mi b{font-weight:800;font-size:17px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
/* The schedule: three groups side by side, so the prize round (Stage 1 models) and the research (Stage 2) read apart. */
.vb .sched{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr) minmax(0,2fr);border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.vb .sg{display:flex;flex-direction:column;min-width:0;border-right:1.5px solid var(--ink)}
.vb .sg:last-child{border-right:0}
.vb .glab{margin:0;padding:10px 20px 9px;border-bottom:1.5px solid var(--ink);font-weight:800;font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.vb .g-train .glab{background:rgba(35,26,21,.06)}
.vb .g-prize .glab{background:var(--amber);color:var(--ink)}
.vb .g-research .glab{background:var(--moss);color:var(--pp)}
.vb .bouts{flex:1;display:grid;grid-template-columns:repeat(var(--n,1),minmax(0,1fr));margin:0;padding:0;list-style:none}
.vb .g-prize .bouts,.vb .g-research .bouts{--n:2}
.vb .stk.mascot img{width:100%;height:100%;object-fit:contain}
.vb .bout{display:flex;flex-direction:column;gap:8px;padding:22px 20px 26px;border-right:1.5px solid var(--ink)}
.vb .bout:last-child{border-right:0}
.vb .bout .stk{width:62px;height:62px}
.vb .bout .t{font-weight:800;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--clay)}
.vb .bout h3{margin:0;font-weight:900;font-size:clamp(22px,1.9vw,27px);line-height:1;letter-spacing:-.02em;text-transform:uppercase}
.vb .bout p{margin:0;font-size:15px;color:#4b4037}
.vb .bout.now{background:var(--ink);color:var(--pp)}
.vb .bout.now .t{color:var(--amber)}
.vb .bout.now p{color:#d9cdb9}
.vb .tix{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:stretch;padding-block:56px 64px}
.vb .ticket{position:relative;display:grid;grid-template-columns:118px minmax(0,1fr);background:var(--amber);color:var(--ink)}
.vb .ticket:before,.vb .ticket:after{content:"";position:absolute;left:105px;width:26px;height:26px;border-radius:50%;background:var(--pp)}
.vb .ticket:before{top:-13px}
.vb .ticket:after{bottom:-13px}
.vb .stub{display:flex;align-items:center;justify-content:center;border-right:3px dashed rgba(35,26,21,.55);transition:transform .6s var(--ease)}
.vb .stub b{font-weight:900;font-size:30px;letter-spacing:.06em;text-transform:uppercase;writing-mode:vertical-rl;transform:rotate(180deg)}
.vb .ticket.torn .stub{transform:translate(-10px,8px) rotate(-7deg)}
.vb .tbody{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:18px 44px;align-items:end;padding:30px 36px 28px}
.vb .tinfo .meta{margin:14px 0 12px}
.vb .tinfo .d{max-width:36em;margin:0;font-size:16px;line-height:1.5;color:#4b3527}
.vb .tjoin .sublab{margin:0 0 10px;font-weight:800;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#6d391f}
.vb .tjoin .consent{margin:10px 2px 0;font-size:13px;line-height:1.45;color:#4b3527}
.vb .tbody .t{margin:0;font-weight:800;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#6d391f}
.vb .tbody h3{margin:6px 0 0;font-weight:900;font-size:clamp(30px,3.4vw,44px);line-height:.92;letter-spacing:-.03em;text-transform:uppercase}
.vb .meta{display:flex;flex-wrap:wrap;gap:6px 22px;margin:14px 0 20px;font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.vb .tform{display:flex;flex-wrap:wrap;gap:8px}
.vb .tform input{flex:1 1 200px;min-width:0;height:50px;padding:0 16px;border:2px solid var(--ink);border-radius:0;background:#f6e2c2}
.vb .tform button{height:50px;padding:0 22px;border:0;background:var(--ink);color:var(--pp);font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase}
.vb .tform button:hover{background:var(--clay)}
.vb .formnote{color:#4b3527}
/* The stickers, drawn in the mascot's manner (from the livestream). At rest each keeps its state visible. */
.bk-crumb{opacity:0}
.bk-warm{opacity:.9}
.bk-coil{stroke:#ffe7b9}
@media (prefers-reduced-motion:no-preference){
.bk-wisp{opacity:0;animation:bk-steam 2.4s ease-out infinite}
.bk-wisp.w2{animation-delay:-.8s}
.bk-wisp.w3{animation-delay:-1.6s}
.bk-loaf{transform-origin:50% 100%;animation:bk-rise 3.2s ease-in-out infinite alternate}
.bk-glow{animation:bk-flicker 2.2s ease-in-out infinite}
.bk-eye{transform-origin:50% 50%;animation:bk-blink 4.6s infinite}
.bk-warm{opacity:.1;animation:bk-warm 4s ease-in-out infinite}
.bk-coil{animation:bk-coil 4s ease-in-out infinite}
.bk-dial{transform-origin:50% 100%;animation:bk-dial 4s ease-in-out infinite}
.bk-look{animation:bk-look 4s ease-in-out infinite}
.bk-shimmer path{opacity:0;animation:bk-shimmer 4s ease-in-out infinite}
.bk-shimmer path+path{animation-delay:-.4s}
.bk-chew{transform-origin:50% 50%;animation:bk-chew 3.6s ease-in-out infinite}
.bk-hop{transform-origin:50% 100%;animation:bk-hop 3.6s cubic-bezier(.3,0,.3,1) infinite}
.bk-sparkle{transform-origin:50% 50%;opacity:0;animation:bk-sparkle 3.6s ease-out infinite}
.bk-sparkle.s2{animation-delay:.18s}
.bk-crumb{opacity:0;animation:bk-crumb 3.6s ease-out infinite}
.bk-crumb.c2{animation-delay:.12s}
.bk-dough{transform-origin:50% 100%;animation:bk-breathe 3.4s ease-in-out infinite alternate}
.bk-breath{transform-origin:50% 50%;animation:bk-o 3.4s ease-in-out infinite alternate}
.bk-bub{transform-origin:50% 50%;opacity:0;animation:bk-bubble 3.4s ease-out infinite}
.bk-bub.b2{animation-delay:-1.5s}
.bk-settle{transform-origin:50% 100%;animation:bk-settle 3.2s ease-in-out infinite}
}
@keyframes bk-steam{0%{opacity:0;transform:translateY(4px)}35%{opacity:1}100%{opacity:0;transform:translateY(-5px)}}
@keyframes bk-rise{from{transform:scale(.92,.74)}to{transform:scale(1.04,1.06)}}
@keyframes bk-flicker{0%,100%{opacity:.78}30%{opacity:1}55%{opacity:.86}75%{opacity:.97}}
@keyframes bk-blink{0%,90%,100%{transform:scaleY(1)}94%{transform:scaleY(.12)}}
@keyframes bk-warm{0%{opacity:.08}70%{opacity:.95}85%{opacity:.95}100%{opacity:.08}}
@keyframes bk-coil{0%{stroke:#5f320c}70%,85%{stroke:#ffe7b9}100%{stroke:#5f320c}}
@keyframes bk-dial{0%{transform:rotate(-70deg)}70%,85%{transform:rotate(70deg)}100%{transform:rotate(-70deg)}}
@keyframes bk-look{0%,20%{transform:translateX(-1.2px)}45%,70%{transform:translateX(1.2px)}90%,100%{transform:translateX(-1.2px)}}
@keyframes bk-shimmer{0%,45%{opacity:0;transform:translateY(3px)}72%{opacity:1;transform:translateY(0)}92%,100%{opacity:0;transform:translateY(-3px)}}
@keyframes bk-chew{0%,8%,16%,24%,32%,40%{transform:scaleY(1)}4%,12%,20%,28%,36%{transform:scaleY(.3)}48%,100%{transform:scale(1.15,1.2)}}
@keyframes bk-hop{0%,44%{transform:translateY(0) scale(1)}50%{transform:translateY(0) scale(1.05,.93)}58%{transform:translateY(-3.5px) scale(.97,1.04)}66%{transform:translateY(0) scale(1.03,.97)}72%,100%{transform:translateY(0) scale(1)}}
@keyframes bk-sparkle{0%,50%{opacity:0;transform:scale(0) rotate(-30deg)}60%{opacity:1;transform:scale(1.15) rotate(0)}78%{opacity:1;transform:scale(1)}92%,100%{opacity:0;transform:scale(.4)}}
@keyframes bk-crumb{0%,2%{opacity:0;transform:translate(-3px,3px)}6%{opacity:1}30%{opacity:0;transform:translate(3px,-4px)}100%{opacity:0}}
@keyframes bk-breathe{from{transform:scale(1.03,.86)}to{transform:scale(.98,1.07)}}
@keyframes bk-o{from{transform:scale(.6)}to{transform:scale(1.1)}}
@keyframes bk-bubble{0%{opacity:0;transform:translateY(5px) scale(.3)}25%{opacity:1}70%{opacity:1;transform:translateY(-2px) scale(1)}78%{opacity:0;transform:translateY(-3px) scale(1.5)}100%{opacity:0}}
@keyframes bk-settle{0%,60%,100%{transform:scale(1)}70%{transform:scale(1.04,.95)}80%{transform:scale(.99,1.02)}}
@media (max-width:760px){
.vb .shareband{grid-template-columns:minmax(0,1fr)}
.vb .nitem{grid-template-columns:minmax(0,1fr)}
.vb .ndate{flex-direction:row;align-items:baseline;justify-content:flex-start;flex-wrap:wrap;gap:6px 14px;min-width:0;padding:18px 20px}
.vb .ndate b{font-size:44px}
.vb .nbody{padding:20px 0 22px}
.vb .ngo{justify-content:flex-start;height:54px;padding:0 20px;border-left:0;border-top:3px solid var(--ink)}
}
@media (max-width:1100px){
.vb .sched{grid-template-columns:minmax(0,1fr)}
.vb .sg{border-right:0;border-bottom:1.5px solid var(--ink)}
.vb .sg:last-child{border-bottom:0}
}
@media (max-width:900px){
.vb .shead{flex-wrap:wrap}
.vb .tv2-wrap{grid-template-columns:minmax(0,1fr)}
.vb .live{grid-template-columns:minmax(0,1fr)}
.vb .live{min-height:0;padding-bottom:270px}
.vb .live .cmark{position:static;justify-items:start;margin-bottom:22px;text-align:left}
.vb .live .colm{-webkit-mask-position:left center;mask-position:left center}
.vb .live .sf{top:auto;left:0;right:0;bottom:0;width:100%;height:320px;object-position:40% 30%;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 28%);mask-image:linear-gradient(180deg,transparent 0,#000 28%)}
.vb .top{flex-wrap:wrap}
.vb .links{order:1;flex-basis:100%;justify-content:space-between;gap:16px}
.vb .hero{grid-template-columns:minmax(0,1fr)}
.vb .ringbox{max-width:620px}
.vb .tix{grid-template-columns:minmax(0,1fr)}
.vb .tbody{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
.vb .news{justify-content:space-between;gap:10px 12px}
.vb .news .nt{font-size:14.5px}
.vb .news .sub{display:none}
.vb .brand small{display:none}
.vb .brand{gap:9px;--mk:26px}
.vb .brand .wm{width:58px;height:15px}
.vb .btn{height:40px;padding:0 12px;font-size:11.5px;letter-spacing:.08em}
.vb .billing{display:none}
.vb .band{padding:22px 18px}
.vb .band .logos{justify-content:flex-start;gap:18px 26px}
.vb .band .scale{height:20px}
.vb .band .pm.nd{width:104px;height:25px}
.vb .band .pm.uw{width:48px;height:32px}
.vb .band .pm.stanford{width:106px;height:24px}
.vb .slip{padding:26px 18px 28px}
.vb .lines li{flex-wrap:wrap;gap:2px 10px}
.vb .lines .lead{display:none}
.vb .lines .v{max-width:none;font-size:17px;text-align:left}
.vb .slip-t{font-size:24px}
.vb .stamp2{width:88px;height:88px;border-width:3px}
.vb .stamp2 b{font-size:18px}
.vb .stamp2 span{font-size:7px}
.vb .apron-name .apron-at{display:none}
.vb .apron-name{letter-spacing:.2em}
.vb .side{padding-top:64px}
.vb .date .info{padding:10px 12px;letter-spacing:.08em}
.vb .act{font-size:12px;padding:0 8px}
.vb .fightcard{grid-template-columns:repeat(2,minmax(0,1fr))}
.vb .corner,.vb .corner:nth-child(n){border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink)}
.vb .corner:nth-child(2n){border-right:0}
.vb .corner:nth-child(n+7){border-bottom:0}
.vb .bouts{grid-template-columns:minmax(0,1fr)}
.vb .bout,.vb .bout:nth-child(n){border-right:0;border-bottom:1.5px solid var(--ink)}
.vb .bout:last-child{border-bottom:0}
.vb .ticket{grid-template-columns:64px minmax(0,1fr)}
.vb .ticket:before,.vb .ticket:after{left:51px}
.vb .stub b{font-size:20px}
.vb .tbody{padding:22px 20px}
.vb .date .day{font-size:36px;padding:10px 14px}
.vb .date .cdn{font-size:22px}
.drafts .dnote{display:none}
}
@media (prefers-reduced-motion:reduce){
*,*:before,*:after{animation:none!important;transition:none!important}
}
@media (prefers-reduced-motion:reduce){
.vb .anim{display:none}
.vb .still{display:block}
}