@font-face{font-family:'Geist';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/geist-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Geist';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/geist-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Geist';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/geist-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Geist';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/geist-latin-700-normal.woff2') format('woff2')}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/geist-mono-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/geist-mono-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/geist-mono-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/chakra-petch-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/chakra-petch-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/chakra-petch-latin-700-normal.woff2) format('woff2')}
/* Rejects identity: black ground, white type, red for the brand and actions, blue for information. */
@layer legacy{
:root{
  color-scheme:dark;
  --bg:#090a0c;--bg-2:#101216;--surface:#131519;--surface-2:#1a1d23;--raise:#262b34;
  --line:rgba(183,192,211,.12);--line-2:rgba(183,192,211,.22);
  --ink:#f2f3f5;--ink-2:#c4c8d2;--muted:#9199a8;--white:#f7f8fa;
  --red:#c50102;--red-hi:#dc0a0c;--red-ink:#ff5a5a;--red-bg:rgba(255,90,90,.13);
  --blue:#6495ff;--blue-hi:#82aaff;--blue-bg:rgba(100,149,255,.13);
  --display:"Chakra Petch","Arial Narrow",system-ui,sans-serif;
  --body:"Geist",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --wrap:1180px;--gut:max(20px,env(safe-area-inset-left));
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:.9375rem;line-height:1.55;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;min-height:100vh;display:flex;flex-direction:column}
main{flex:1;width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gut) 64px;outline:0}
/* While a view loads, main holds the first screen so the footer stays below it instead of jumping down when the view paints (e2e audit PERF-01, CLS). */
main#main[aria-busy=true]{min-height:100vh}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.1;margin:0;letter-spacing:.005em;text-wrap:balance}
h1{font-size:36px;font-weight:700}
h2{font-size:21px}
h3{font-size:16px;margin-top:6px}
p{margin:0}
a{color:var(--ink);text-underline-offset:3px;text-decoration-color:rgba(242,243,245,.35)}
a:hover{text-decoration-color:currentColor}
.muted{color:var(--muted)}
.small{font-size:13px}
[hidden]{display:none!important}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-999px;top:8px;z-index:90;background:var(--white);color:var(--bg);padding:8px 14px;border-radius:8px;font-weight:600}
.skip:focus{left:12px}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.i{width:16px;height:16px;flex:none;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
code{font-size:12px}

/* header */
.site-top{position:sticky;top:0;z-index:40;background:rgba(9,10,12,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}

.brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex:none}
.brand img{width:38px;height:auto;display:block}



#nav{display:flex;gap:4px;flex:1;min-width:0}
#nav a{text-decoration:none;color:var(--ink-2);font-weight:500;padding:9px 12px;border-radius:8px;white-space:nowrap}
#nav a:hover{color:var(--white);background:var(--surface)}
#nav a[aria-current="page"]{color:var(--white);box-shadow:inset 0 -2px 0 var(--red)}
.who{display:flex;gap:8px;align-items:center;flex:none}
.acct{display:inline-flex;align-items:center;gap:8px;text-decoration:none;border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:4px 14px 4px 4px;max-width:240px;font-weight:600;font-size:14px}
.acct .av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--raise);flex:none;font-size:13px}
.acct .al{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct[aria-current="page"]{border-color:var(--ink-2)}

/* buttons and fields */
button.btn,button.iconbtn,button.acct,button.theme-btn,button.motion-toggle,.me-menu button{-webkit-appearance:none;appearance:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 18px;border-radius:10px;border:1px solid var(--line-2);background:var(--surface-2);color:var(--ink);font:inherit;font-weight:600;text-decoration:none;cursor:pointer;white-space:nowrap;touch-action:manipulation;transition:background-color .12s,border-color .12s}
.btn:hover{background:var(--raise)}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn.primary{background:var(--red);border-color:var(--red);color:#fff}
.btn.primary:hover{background:var(--red-hi);border-color:var(--red-hi)}
.btn.ghost{background:transparent}
.btn.ghost:hover{background:var(--surface-2)}
.btn.sm{min-height:36px;padding:6px 12px;font-size:13.5px;border-radius:9px}
.btn.icon{width:40px;min-height:40px;padding:0}
.btn.danger{color:var(--red-ink)}
input,select,textarea{font:inherit;color:var(--ink);background:var(--bg-2);border:1px solid var(--line-2);border-radius:10px;padding:10px 12px;min-height:44px;min-width:0;width:100%}
input::placeholder{color:#717887}
input[readonly]{color:var(--ink-2);background:var(--surface)}
select{-webkit-appearance:none;appearance:none;padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%239199a8' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
input[type="checkbox"]{width:20px;height:20px;min-height:0;padding:0;accent-color:var(--blue);flex:none;margin:1px 0 0}
@media (pointer:coarse){input,select,textarea{font-size:16px}}
label.f,.f.ozfile{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:500;color:var(--muted);min-width:0}
label.f.grow{flex:1 1 180px}
.hint{font-size:12.5px;color:var(--muted);font-weight:400;line-height:1.45}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-2);line-height:1.5;cursor:pointer}
.check.sm{align-items:center;font-size:13px;min-height:44px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.row.between{justify-content:space-between}

/* panels */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px;display:flex;flex-direction:column;gap:14px;min-width:0}
.panel.narrow{max-width:520px;margin:48px auto 0}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.page-head{margin:40px 0 20px;display:flex;flex-direction:column;gap:8px;max-width:760px}
.loading{color:var(--muted);padding:48px 0}
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:64px 20px;color:var(--ink-2)}
.empty.slim{padding:36px 20px;border:1px dashed var(--line-2);border-radius:14px}
.notice{margin-top:24px;padding:12px 16px;border-radius:10px;background:var(--red-bg);color:var(--ink);border:1px solid rgba(255,90,90,.35)}
.pill{display:inline-block;font-size:12px;font-weight:600;padding:2px 9px;border-radius:99px;background:var(--blue-bg);color:var(--blue-hi)}
.pill.bad{background:var(--red-bg);color:var(--red-ink)}
.tools{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px;align-items:center}
.search{position:relative;flex:1 1 280px;max-width:440px;display:block}
.search .i{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--muted)}
.search input{padding-left:38px}
.sel{flex:0 0 200px}

.sel.wk{flex:0 0 260px}
.tzsel{display:flex;align-items:center;gap:8px;max-width:360px;color:var(--muted);font-size:14px}.tzsel input{flex:1;min-width:0}


/* team badges */
.badge{width:40px;height:40px;flex:none;border-radius:9px;display:grid;place-items:center;background:#0b0c0e;border:1px solid var(--line-2);overflow:hidden}
.badge img{width:86%;height:86%;object-fit:contain;display:block}
.badge.letters{font-family:var(--display);font-weight:700;font-size:14px;letter-spacing:.04em;color:var(--white);background:var(--surface-2)}
.badge.long{font-size:11px}
.badge.xs{width:24px;height:24px;border-radius:6px;font-size:8.5px}
.badge.xs.long{font-size:7px}
.badge.lg{width:64px;height:64px;border-radius:12px;font-size:20px}
.badge.lg.long{font-size:15px}
.badge.xl{width:112px;height:112px;border-radius:18px;font-size:32px}
.badge.xl.long{font-size:24px}

/* home */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:48px;align-items:start;padding:56px 0 48px;border-bottom:1px solid var(--line)}




.cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.hero-board{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px 20px 8px;border-top:3px solid var(--red)}
.board-head,.block-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}
.board-head a,.block-head a{font-size:14px;color:var(--ink-2)}


/* the leaderboard: big rank numbers, like an end-of-match scoreboard */
.board{list-style:none;margin:0;padding:0}


.rk{font-family:var(--display);font-weight:700;font-size:34px;line-height:1;color:var(--muted);text-align:left}







.nums{display:flex;gap:18px}
.nums span{display:flex;flex-direction:column;align-items:flex-end;font-size:11.5px;color:var(--muted);line-height:1.2}
.nums b{font-family:var(--display);font-size:19px;color:var(--ink);font-weight:600}
.nums span:first-child b{color:var(--white)}
.block{padding:36px 0 0}

/* team grid */
.teams{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.teams li[hidden]{display:none}
.teams a{display:grid;grid-template-columns:64px minmax(0,1fr);grid-template-rows:auto auto auto;column-gap:14px;row-gap:2px;align-items:center;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);text-decoration:none;height:100%}
.teams a:hover{border-color:var(--line-2);background:#15171c}
.teams .badge{grid-row:1/4}
.tn{font-weight:600;font-size:15.5px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tt{font-family:var(--display);font-size:13px;letter-spacing:.06em;color:var(--ink-2)}
.tc{font-size:12.5px;color:var(--muted)}

/* tables */
.tablewrap{position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:middle}
tbody tr:last-child td{border-bottom:0}
th{font-size:12.5px;font-weight:500;color:var(--muted);background:var(--surface)}
th.num,td.num{text-align:right}
td.strong{font-weight:600;color:var(--white)}
.ranks td.rk{font-size:22px;width:72px}
.ranks tbody tr:nth-child(-n+3) td.rk{color:var(--white)}
.ranks tbody tr:first-child td.rk{color:var(--red-ink)}
.ranks .later td.rk{color:var(--muted)}
.ranks .pl b{font-weight:600}
.ranks .pl .sub{display:none;font-size:12.5px;color:var(--muted);text-decoration:none}
.ranks .tm a{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink-2)}
.ranks .tm a:hover{color:var(--ink)}
.ranks tr[hidden]{display:none}
.ranks.compact td,.ranks.compact th{padding:10px 12px}
.panel .tablewrap{border:0;border-radius:0;background:none;margin:0 -8px}
.later{margin-top:22px}
.later summary{cursor:pointer;font-weight:600;padding:8px 0;color:var(--ink-2)}
.later[open] summary{margin-bottom:10px}
.admin td.acts{text-align:right}

/* team page */



/* a rebranded team's old name on older records */
i.prev{font-style:italic;font-weight:400;color:var(--muted)}

.links{display:flex;flex-wrap:wrap;gap:6px 18px}
.links a{display:inline-flex;align-items:center;gap:5px;color:var(--ink-2);font-size:14px}
.links a .i{width:13px;height:13px}

.people{list-style:none;margin:0;padding:0}
.people li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--line)}
.people li:first-child{border-top:0}
.people span{color:var(--muted);font-size:13.5px;text-align:right}

/* editor */
.editor{display:flex;flex-direction:column;gap:16px;max-width:880px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}



.rows{display:flex;flex-direction:column;gap:8px}



.agree{padding:4px 2px}
.savebar{position:sticky;bottom:0;padding:14px 0 calc(14px + env(safe-area-inset-bottom,0px));background:linear-gradient(transparent,var(--bg) 30%);justify-content:space-between}

/* legal */
.legal{max-width:780px;margin:40px 0 0;gap:12px}
.legal h1{margin-bottom:4px}
.legal h2{font-size:19px;margin-top:16px}
.legal p,.legal li{color:var(--ink-2);line-height:1.65}
.legal ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px}

/* footer */





.copy{flex-basis:100%}

.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--white);color:var(--bg);font-weight:500;padding:10px 16px;border-radius:12px;font-size:14px;z-index:80;max-width:min(92vw,520px);box-shadow:0 12px 32px rgba(0,0,0,.45)}


/* tournaments */
.panel>.search{flex:none;max-width:440px}
.count{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 6px;border-radius:99px;background:var(--blue);color:#06070a;font-size:11.5px;font-weight:700;margin-left:4px;vertical-align:1px}
.count.bad{background:var(--red-ink);color:#06070a}
.pill.live{background:var(--red-bg);color:var(--red-ink)}
.crumb{font-size:13.5px;color:var(--muted)}
.crumb a{color:var(--ink-2)}
.t-head{max-width:none}
.t-meta{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;color:var(--ink-2);font-size:14px}
.t-meta a{display:inline-flex;align-items:center;gap:5px}
.t-notes{color:var(--ink-2);white-space:pre-line;max-width:72ch;line-height:1.6}
.tlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.tlist a{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:16px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);text-decoration:none}
.tlist a:hover{border-color:var(--line-2)}
.tl-name{font-family:var(--display);font-weight:600;font-size:18px}
.tl-meta{grid-column:1;font-size:13px;color:var(--muted)}
.tlist .pill{grid-column:2;grid-row:1/3;justify-self:end}
.tl-champ{grid-column:1;display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-2);margin-top:4px}
.champ{display:flex;align-items:center;gap:16px;padding:16px 20px;margin:0 0 16px;border:1px solid rgba(255,90,90,.4);border-radius:14px;background:linear-gradient(90deg,var(--red-bg),transparent 70%)}
.champ div{display:flex;flex-direction:column}
.champ b{font-family:var(--display);font-size:26px;line-height:1.1}
main > .panel+.panel,main > section.panel{margin-bottom:16px}
.modbar{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;padding:12px 16px;margin-bottom:16px;border:1px dashed var(--line-2);border-radius:12px;background:var(--bg-2)}
.modbar>.row{gap:8px}
#modExtra{flex-basis:100%}
#modExtra:empty{display:none}
.bracket{display:flex;gap:14px;overflow-x:auto;padding:4px 2px 10px;-webkit-overflow-scrolling:touch}
.bcol{display:flex;flex-direction:column;justify-content:space-around;gap:12px;min-width:218px;flex:0 0 218px}
.panel h3{color:var(--ink-2);font-size:14.5px;margin-top:4px}
.mbox{display:flex;flex-direction:column;border:1px solid var(--line-2);border-radius:10px;background:var(--bg-2);text-decoration:none;overflow:hidden}
.mbox:hover{border-color:var(--ink-2)}
.mbox.disp{border-color:rgba(255,90,90,.6)}
.mlabel{font-size:11.5px;color:var(--muted);padding:6px 10px 4px;font-weight:500}
.mrow{display:flex;align-items:center;gap:8px;padding:6px 10px;border-top:1px solid var(--line);font-size:13.5px;min-height:36px}
.mrow .tnm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mrow b{margin-left:auto;font-family:var(--display);font-size:15px;min-width:14px;text-align:right}
.mrow.win{background:var(--blue-bg)}
.mrow.win .tnm{color:var(--white);font-weight:600}
.mrow.me{box-shadow:inset 3px 0 0 var(--red)}
.mtime{font-size:11.5px;color:var(--muted);padding:5px 10px 7px;border-top:1px solid var(--line)}
.mtime .bad,.bad{color:var(--red-ink)}
.mbox.done .mtime{color:var(--ink-2)}
.groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:16px}
.stand tr.adv td{background:rgba(100,149,255,.06)}
.stand tr.adv td.rk{color:var(--blue-hi)}
.sched{list-style:none;margin:0;padding:0}
.sched li a{display:grid;grid-template-columns:200px 170px minmax(0,1fr) auto;gap:6px 14px;align-items:center;padding:11px 4px;border-top:1px solid var(--line);text-decoration:none;font-size:14px}
.sched li:first-child a{border-top:0}
.sched li a:hover{background:var(--surface-2)}
.sched .st{color:var(--ink-2)}
.sched .sl{color:var(--muted);font-size:13px}
.sched .sv b{font-family:var(--display);padding:0 6px;color:var(--white)}
.sched li.done .st{color:var(--muted)}
/* In a half-width panel the four columns squeeze the teams into a word per line, so narrow lists stack (Oct 2026) */
.sched{container-type:inline-size}
@container (max-width:720px){
  .sched li a{grid-template-columns:minmax(0,1fr) auto}
  .sched .sv{grid-column:1/-1}
  .sched .sl{grid-column:1/-1;order:-1}
}
.seeds{margin:0;padding-left:26px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px 18px}
.seeds a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;padding:3px 0}
.mpanel{border-color:var(--line-2);scroll-margin-top:90px;margin-bottom:16px}
.mvs{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:16px}
.modtools{border-top:1px solid var(--line);padding-top:12px;display:flex;flex-direction:column;gap:12px}
.scoreform{display:flex;flex-direction:column;gap:8px;padding:10px 0}
.maprow{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.maprow .mn{font-size:13px;color:var(--muted);width:48px;padding-bottom:12px}
.maprow select{min-width:170px}
.maprow .sc{width:110px}
.maprow .sc span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mycards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:14px}
.mycard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:12px}
.mycard.done{opacity:.8}
.mycard header{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.mycard header a{font-weight:600;color:var(--ink-2)}
.mycard .ok{color:var(--blue-hi);font-weight:600}
.mycard details summary{cursor:pointer;font-weight:600;color:var(--ink-2)}
.pick{display:flex;flex-direction:column;gap:8px}
.propose{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end}
.propose label{flex:1 1 190px}
.when b{color:var(--white)}





textarea{resize:vertical;min-height:84px}
@media (max-width:720px){
  .sched li a{grid-template-columns:1fr auto;padding:12px 2px}
  .sched .sv{grid-column:1/-1}
  .sched .sl{grid-column:1/-1;order:-1}
  .bcol{min-width:190px;flex-basis:190px}
  .maprow .sc{width:calc(50% - 34px)}
  .maprow select{min-width:0;flex:1}
  .maprow .mn{width:100%;padding:0}
}
@media (max-width:960px){
  .hero{grid-template-columns:1fr;gap:32px;padding-top:36px}


}
@media (max-width:720px){

  .brand{order:1}
  .who{order:2;margin-left:auto}
  #nav{order:3;flex-basis:100%;overflow-x:auto;scrollbar-width:none;margin:0 -8px}
  .acct{padding:4px}
  .acct .al{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  h1{font-size:30px}

  .grid2{grid-template-columns:1fr}
  .ranks .tm{display:none}
  .ranks .pl .sub{display:block}
  .ranks td.rk{width:52px;font-size:19px}
  th,td{padding:11px 10px}


  .badge.xl{width:88px;height:88px;font-size:26px}
  .nums{gap:12px}
  .nums span:nth-child(3){display:none}

  .rk{font-size:28px}
  .sel{flex:1 1 160px}
}
@media (max-width:480px){
  .ranks .rd{display:none}
  .ranks th,.ranks td{padding:10px 8px}
  .ranks td.rk{width:40px}
  .who .su{display:none}
}
/* staff */
.pill.warn{background:rgba(255,190,80,.14);color:#ffc768}
.subnav{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px;padding:5px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.subnav a{padding:8px 13px;border-radius:9px;color:var(--ink-2);text-decoration:none;font-weight:600;font-size:14px}
.subnav a:hover{background:var(--surface-2);color:var(--ink)}
.subnav a[aria-current="page"]{background:var(--surface-2);color:var(--white);box-shadow:inset 0 -2px 0 var(--red)}
.reqs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.reqs>li{display:flex;flex-direction:column;gap:10px;padding:14px 0;border-top:1px solid var(--line)}
.reqs>li:first-child{border-top:0}
.reqs p{margin:3px 0 0}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.panel.narrow .grid3{grid-template-columns:1fr}
.tlist.review>li{display:flex;flex-direction:column;gap:8px}
.tlist>li>p{margin:0 4px}
.issuebox,.issued{margin:12px 0;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--bg-2)}
pre.codebox{white-space:pre-wrap;margin:8px 0;padding:12px;border-radius:10px;background:var(--surface-2);font-size:13px;color:var(--ink)}
.daysin{width:74px}
td.acts{white-space:nowrap}
td.acts .daysin,td.acts .btn{margin-left:6px;vertical-align:middle}

table.log td{vertical-align:top}
.qr{display:inline-block;padding:10px;background:#fff;border-radius:10px;margin:6px 0}
.qr svg{display:block}
ol.steps{margin:8px 0 6px;padding-left:22px;display:flex;flex-direction:column;gap:6px}
code.big{font-size:15px;padding:2px 8px;letter-spacing:.06em}
.panel h3{margin-top:18px}
.panel>h3:first-of-type{margin-top:4px}
@media (max-width:720px){.grid3{grid-template-columns:1fr}.subnav a{padding:7px 10px;font-size:13.5px}td.acts{white-space:normal}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
/* ---------- team calendar ---------- */
.codebox{margin:8px 0;padding:12px;border-radius:10px;background:var(--surface-2);font-size:13px;color:var(--ink);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere}
.wknav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.wknav h2,.wknav h3{margin:0}
.wknav h2{min-width:150px;text-align:center}
.btn.icon{font-size:20px;line-height:1;padding-left:12px;padding-right:12px}
.agenda{list-style:none;margin:6px 0 0;padding:0}





.evs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ev{display:grid;grid-template-columns:170px minmax(0,1fr) auto;gap:4px 12px;align-items:center;padding:8px 12px;border-radius:10px;background:var(--surface-2);border-left:3px solid var(--tc,var(--line-2))}



.tp{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.02em;padding:1px 8px;border-radius:99px;background:var(--tb,var(--surface));color:var(--tc,var(--ink-2));margin-right:4px}
.tp-game{--tc:#ff6b6b;--tb:rgba(255,90,90,.14)}
.tp-scrim{--tc:#82aaff;--tb:rgba(100,149,255,.15)}
.tp-vod{--tc:#c49bff;--tb:rgba(180,130,255,.15)}
.tp-prac{--tc:#f5b94a;--tb:rgba(245,185,74,.14)}
.tp-other{--tc:#c4c8d2;--tb:rgba(196,200,210,.12)}
.tp-busy{--tc:#9199a8;--tb:rgba(145,153,168,.14)}





.srcs li{flex-wrap:wrap;align-items:center}
.srcs li .muted{flex:1;text-align:left}
ul.help{margin:8px 0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:14px}

/* staff schedules */
.schtools{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin-bottom:12px}
.schtools .f{min-width:150px}
.sweek{display:flex;flex-direction:column;gap:10px}
.sday{display:grid;grid-template-columns:110px minmax(0,1fr);gap:6px 12px;align-items:start;padding:10px 0;border-top:1px solid var(--line)}
.sday:first-child{border-top:0}
.sday-h{font-weight:600;font-size:13.5px;padding-top:2px}
.sbars{display:flex;flex-direction:column;gap:5px;min-width:0}
.sbar{display:grid;grid-template-columns:48px minmax(0,1fr);gap:8px;align-items:center}
.sbar-l{font-size:11.5px;font-weight:700;color:var(--ink-2);text-transform:uppercase}
.track{position:relative;height:18px;border-radius:5px;background:var(--surface-2);overflow:hidden}
.track i{position:absolute;top:0;bottom:0}
.track i.b{background:var(--tc,#5c6370);opacity:.8}
.track i.fr{background:repeating-linear-gradient(135deg,rgba(95,211,154,.30) 0 5px,rgba(95,211,154,.14) 5px 10px);box-shadow:inset 0 0 0 1px rgba(95,211,154,.6)}
.ticks{position:relative;height:16px;margin-left:56px;font-size:11px;color:var(--muted)}
.ticks span{position:absolute;transform:translateX(-50%);white-space:nowrap}
.ticks span:first-child{transform:none}
.ticks span:last-child{transform:translateX(-100%)}
.sfree{grid-column:2;font-size:13px;color:#5fd39a}
.sfree.none{color:var(--muted)}
.legend{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 2px}
@media (max-width:720px){
  .ev{grid-template-columns:minmax(0,1fr);padding:9px 11px}


  .wknav h2{min-width:0;font-size:18px}
  .sday{grid-template-columns:minmax(0,1fr)}
  .sfree{grid-column:1}
  .ticks{margin-left:56px}
}
.tp-free{--tc:#5fd39a;--tb:rgba(80,200,140,.14)}
/* team schedules */
.sgrid{display:grid;grid-template-columns:76px repeat(7,minmax(0,1fr));gap:2px;max-width:620px;margin:10px 0;user-select:none;-webkit-user-select:none}

.sgrid .gl{font-size:11px;color:var(--muted);text-align:right;padding-right:8px;line-height:20px;white-space:nowrap}
.sgrid .gl.late{border-top:1px dashed var(--line-2)}




.track i.hc{background:#5fd39a}
.tp-heat{--tc:#5fd39a;--tb:linear-gradient(90deg,rgba(95,211,154,.08),rgba(95,211,154,.45))}




.both{display:flex;flex-direction:column;gap:6px}
.gday h2{font-size:17px}

[data-theme="light"] .track i.hc{background:#108c50}
/* ---------- policies, notice, theme button ---------- */




.legal code{font-size:13px;background:var(--surface-2);padding:1px 6px;border-radius:5px}
.notice-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:70;width:min(calc(100% - 32px),720px);display:flex;align-items:center;gap:14px;padding:12px 14px 12px 18px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line-2);box-shadow:0 14px 40px rgba(0,0,0,.35)}
.notice-bar p{flex:1;font-size:14px;color:var(--ink-2)}
/* A short window (a phone with its keyboard open): the notice sits at the end of the page instead of over the inputs (e2e audit MOB-04). */
@media (max-height:600px){.notice-bar{position:relative;left:auto;bottom:auto;transform:none;margin:0 auto 16px;box-shadow:none}}








/* a visually hidden file input shows its focus on the button that opens it */
label.btn:has(+ input.sr:focus-visible),label.btn:has(+ input[type="file"]:focus-visible){outline:2px solid var(--blue);outline-offset:2px}
.copy a{color:inherit}
/* Phones (newcomer round r4z11 F11): one short line and the OK button beside it, so the notice covers as little as possible; the page also gets room under it. */
@media (max-width:720px){.notice-bar{bottom:calc(8px + env(safe-area-inset-bottom,0px));width:calc(100% - 16px);gap:10px;padding:8px 8px 8px 12px;border-radius:12px}.notice-bar p{font-size:13px;line-height:1.35}.notice-bar .nb-more{display:none}.theme-btn{order:2;width:38px;height:38px;margin-left:auto}.who{margin-left:0}}

/* ---------- light mode ---------- */
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#f5f6f8;--bg-2:#eceef2;--surface:#ffffff;--surface-2:#f0f2f5;--raise:#e3e6eb;
  --line:rgba(16,20,28,.12);--line-2:rgba(16,20,28,.24);
  --ink:#14171c;--ink-2:#363c46;--muted:#596170;--white:#0a0c0f;
  --red:#c50102;--red-hi:#a50002;--red-ink:#b00003;--red-bg:rgba(197,1,2,.08);
  --blue:#2457c5;--blue-hi:#1d4cb3;--blue-bg:rgba(36,87,197,.10);
}
[data-theme="light"] a{text-decoration-color:rgba(20,23,28,.35)}
[data-theme="light"] .site-top{background:rgba(245,246,248,.92)}
[data-theme="light"] input::placeholder,[data-theme="light"] textarea::placeholder{color:#677080}
[data-theme="light"] .badge{background:#e7eaef}
[data-theme="light"] .teams a:hover{background:#eef1f5}

[data-theme="light"] .toast{box-shadow:0 12px 32px rgba(0,0,0,.2)}
[data-theme="light"] .count,[data-theme="light"] .count.bad{color:#fff}
[data-theme="light"] .pill.warn{background:rgba(176,104,0,.12);color:#7a4a00}
[data-theme="light"] .notice{border-color:rgba(176,0,3,.35)}
[data-theme="light"] .notice-bar{box-shadow:0 14px 40px rgba(0,0,0,.14)}
/* the Round One logo is drawn for a dark background, so it sits on a dark tile */
[data-theme="light"] .brand img,[data-theme="light"] .foot-brand img,[data-theme="light"] .hero-logo,[data-theme="light"] .empty > img{background:#0a0c0f;border-radius:10px;padding:4px}
[data-theme="light"] .tp-game{--tc:#b42318;--tb:rgba(180,35,24,.10)}
[data-theme="light"] .tp-scrim{--tc:#1d4cb3;--tb:rgba(29,76,179,.10)}
[data-theme="light"] .tp-vod{--tc:#6a3db8;--tb:rgba(106,61,184,.10)}
[data-theme="light"] .tp-prac{--tc:#7a4a00;--tb:rgba(176,104,0,.12)}
[data-theme="light"] .tp-other{--tc:#454d5a;--tb:rgba(69,77,90,.10)}
[data-theme="light"] .tp-busy{--tc:#545c69;--tb:rgba(84,92,105,.12)}
[data-theme="light"] .tp-free{--tc:#106b42;--tb:rgba(16,107,66,.10)}
[data-theme="light"] .sfree{color:#106b42}
[data-theme="light"] .track i.fr{background:repeating-linear-gradient(135deg,rgba(16,140,80,.30) 0 5px,rgba(16,140,80,.14) 5px 10px);box-shadow:inset 0 0 0 1px rgba(16,107,66,.6)}
[data-theme="light"] .track i.b{opacity:.9}
.tablewrap[tabindex]:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* beta feedback */


dialog.fb{width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:1px solid var(--line-2);border-radius:16px;background:var(--surface);color:var(--ink);box-shadow:0 24px 80px rgba(0,0,0,.5)}
dialog.fb::backdrop{background:rgba(5,6,8,.66)}




#fbForm{display:flex;flex-direction:column;gap:14px}
.fb-type{border:0;padding:0;margin:0;min-width:0}
.fb-type legend{font-size:14px;font-weight:600;color:var(--ink-2);margin-bottom:8px;padding:0}













@media (max-width:720px){.fb-btn{order:2;margin-left:auto;margin-right:0;height:38px}.theme-btn{margin-left:0}}
@media (max-width:480px){.fb-btn{width:38px;padding:0;justify-content:center}.fb-btn span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.fb-types{grid-template-columns:1fr}.fb-in{padding:16px}}

@media (max-width:480px){.site-top-in{gap:8px}.brand{gap:8px}.brand img{width:32px}.word b{font-size:16px}.word span{font-size:8.5px;letter-spacing:.15em}}







.fbi-shot{display:block;max-width:100%;max-height:520px;border-radius:10px;border:1px solid var(--line-2)}

@media (max-width:720px){.fbi-who{margin-left:0;flex-basis:100%}}


/* header that fits whatever links it has */
#nav{overflow-x:auto;scrollbar-width:none}
#nav::-webkit-scrollbar{display:none}

.site-top.compact #nav a{padding:9px 10px}

.site-top.compact .fb-btn span,.site-top.compact .acct .al{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.site-top.compact .acct{padding:4px}

.site-top.stacked .brand{order:1}

.site-top.stacked .theme-btn,.site-top.stacked .who{order:2}
.site-top.stacked #nav{order:3;flex-basis:100%;margin:0 -10px}
/* ===== Round One facelift, matching TradeBack: tactical map behind solid cards.
   Logo red for the brand and actions, cyan for information, green for wins and free time.
   Text stays white and gray; glow only on active things. ===== */
:root{
  --bg:#08090b;--bg-2:#101216;--surface:#16181c;--surface-2:#1e2126;--raise:#2a2e35;
  --line:rgba(255,255,255,.08);--line-2:rgba(255,255,255,.16);
  --ink:#f4f5f7;--ink-2:#c9ccd3;--muted:#8f96a3;--white:#fff;
  --red:#F8313E;--red-hi:#FF4B57;--red-ink:#FF4B57;--red-bg:rgba(248,49,62,.13);
  --blue:#22D3EE;--blue-hi:#67E8F9;--blue-bg:rgba(34,211,238,.13);
  --good:#3DDC84;--warn:#FFC23D;
  --mono:ui-monospace,"Cascadia Mono","SF Mono","Roboto Mono",Menlo,Consolas,monospace;
  --glow:0 0 18px rgba(248,49,62,.32);
}
body{background:var(--bg)}
body:before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:#08090b url(/map-bg-dark.webp) center/cover no-repeat}
.site-top{background:rgba(10,11,14,.94)}

.panel,.hero-board,.tablewrap,.teams a,.tlist a,.mycard,.champ{box-shadow:0 10px 28px rgba(0,0,0,.35)}
.panel,.hero-board,.tablewrap,.teams a,.tlist a,.mycard{background:var(--surface)}
.teams a:hover{background:var(--surface-2)}
.champ{background:linear-gradient(90deg,rgba(61,220,132,.14),var(--surface) 70%);border-color:rgba(61,220,132,.55);box-shadow:0 0 0 1px rgba(61,220,132,.3),0 0 28px rgba(61,220,132,.16)}
/* map marker: a small red square before section titles */
.panel>h2:first-child:before,.panel-head h2:before,.board-head h2:before,.block-head h2:before{content:'';display:inline-block;width:7px;height:7px;background:var(--red);margin-right:9px;vertical-align:.16em}
/* numbers read like the map's coordinate labels */
.rk,.nums b,.mrow b,.sched .sv b,.seedlist .sn,td.num,.count{font-family:var(--mono);letter-spacing:-.02em}
/* active things glow, the rest stays flat */
#nav a[aria-current="page"]{background:var(--surface-2);box-shadow:inset 0 -2px 0 var(--red),var(--glow)}
.btn.primary{font-weight:700}
.btn.primary:focus-visible{box-shadow:var(--glow)}
.pill.live{box-shadow:0 0 12px rgba(248,49,62,.45)}
.mrow.win{background:rgba(61,220,132,.12)}
.mrow.win b{color:var(--good)}
.mycard .ok{color:var(--good)}
.notice{border-color:rgba(248,49,62,.4)}
.mbox.disp{border-color:var(--warn)}
.pill.warn{background:rgba(255,194,61,.14);color:var(--warn)}
.stand tr.adv td{background:rgba(34,211,238,.06)}
.tp-game{--tc:#FF4B57;--tb:rgba(248,49,62,.14)}
.tp-scrim{--tc:#22D3EE;--tb:rgba(34,211,238,.14)}
.tp-prac{--tc:#FFC23D;--tb:rgba(255,194,61,.14)}
/* light mode: same meanings in darker shades, no map */
:root[data-theme="light"]{
  --red:#C8102E;--red-hi:#A50D26;--red-ink:#B00D28;--red-bg:rgba(200,16,46,.08);
  --blue:#0E7490;--blue-hi:#0B5F75;--blue-bg:rgba(14,116,144,.10);
  --good:#15803D;--warn:#B45309;--glow:0 0 14px rgba(200,16,46,.2);
}
[data-theme="light"] body:before{display:none}
[data-theme="light"] .site-top{background:rgba(245,246,248,.92)}

[data-theme="light"] .panel,[data-theme="light"] .hero-board,[data-theme="light"] .tablewrap,[data-theme="light"] .teams a,[data-theme="light"] .tlist a,[data-theme="light"] .mycard,[data-theme="light"] .champ{box-shadow:0 1px 3px rgba(0,0,0,.08)}
[data-theme="light"] .teams a:hover{background:#eef1f5}
[data-theme="light"] .tp-game{--tc:#C8102E;--tb:rgba(200,16,46,.10)}
[data-theme="light"] .tp-scrim{--tc:#0E7490;--tb:rgba(14,116,144,.10)}
[data-theme="light"] .tp-prac{--tc:#7a4a00;--tb:rgba(176,104,0,.12)}
[data-theme="light"] .pill.warn{background:rgba(176,104,0,.12);color:#7a4a00}
/* Round One: Join steps and Link Ubisoft */
.r1-steps{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin:2px 0 4px}
.r1-steps span{display:flex;flex-direction:column;gap:6px;font-size:11.5px;color:var(--muted);line-height:1.25}
.r1-steps span::before{content:"";height:4px;border-radius:2px;background:var(--line-2)}
.r1-steps span.done::before{background:var(--blue)}
.r1-steps span.on::before{background:var(--red)}
.r1-steps span.on{color:var(--ink)}
.r1-steps b{font-weight:600}
@media (max-width:520px){.r1-steps span{font-size:0}.r1-steps b{font-size:11.5px}}
.r1 .stack,.r1-help .stack{display:flex;flex-direction:column;gap:14px}
.r1-terms{display:flex;flex-direction:column;gap:10px;padding:14px 16px;border:1px solid var(--line-2);border-radius:10px;background:var(--surface-2)}
.r1-terms p{margin:0}
.r1-drop{display:flex;flex-direction:column;align-items:center;gap:8px;padding:28px 16px;border:2px dashed var(--line-2);border-radius:12px;text-align:center}
.r1-drop.over{border-color:var(--red);background:var(--red-bg)}
.r1-drop p{margin:0}
.r1-drop .row{justify-content:center}
.r1-help summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600;color:var(--ink-2)}
.r1-facts{display:grid;grid-template-columns:max-content 1fr;gap:8px 16px;margin:0}
.r1-facts dt{color:var(--muted);font-size:13.5px}
.r1-facts dd{margin:0}
@media (max-width:520px){.r1-facts{grid-template-columns:1fr}.r1-facts dd{margin-bottom:6px}}
/* ---------- Round One profiles: players, teams, orgs ---------- */
.pre{white-space:pre-wrap;overflow-wrap:anywhere}
.pav{width:34px;height:34px;flex:none;border-radius:50%;display:inline-grid;place-items:center;overflow:hidden;background:var(--surface-2);border:1px solid var(--line-2);vertical-align:middle}
.pav img{width:100%;height:100%;object-fit:cover;display:block}
.pav.letters{background:hsl(var(--h,220) 38% 30%);color:var(--white);font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.03em}
.pav.xl{width:112px;height:112px;font-size:36px}
.pav.open{background:transparent;border-style:dashed;color:var(--muted)}
.tier{display:inline-flex;align-items:center;font-size:11.5px;font-weight:600;padding:1px 8px;border-radius:99px;border:1px solid var(--line-2);color:var(--ink-2);white-space:nowrap}
.tier.t-account,.tier.t-roster{color:var(--blue-hi);border-color:rgba(100,149,255,.45);background:var(--blue-bg)}
.tier.t-event,.tier.t-result{color:#c4a6ff;border-color:rgba(170,130,255,.45);background:rgba(170,130,255,.12)}
.tier.t-admin{color:var(--good);border-color:rgba(61,220,132,.45);background:rgba(61,220,132,.1)}
.chip{display:inline-block;font-size:12.5px;padding:2px 10px;border-radius:99px;border:1px solid var(--line-2);color:var(--ink-2);margin:2px 0}







ul.xp,ul.hist,ul.locks{list-style:none;margin:0;padding:0}


.xp li:first-child,.hist li:first-child{border-top:0}

.hist li{display:grid;grid-template-columns:100px minmax(0,1fr);gap:10px;padding:8px 0;border-top:1px solid var(--line);font-size:14px}
.locks{display:flex;flex-direction:column;gap:12px}
.locks li{display:flex;gap:12px;align-items:flex-start}
.lock{color:var(--muted);padding-top:2px}

.pcard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:8px;min-width:0}
.pcard p{margin:0}
.pcard>.btn{align-self:flex-start}
.pc-top{display:flex;align-items:center;gap:12px}
.pc-top>div{flex:1;min-width:0}


.who-cell{display:inline-flex;align-items:center;gap:9px;flex-wrap:wrap}
.crew select{min-height:38px;padding:6px 10px;width:auto;max-width:190px}
.crew tr.open td{color:var(--muted)}
details.menu{display:inline-block;vertical-align:middle}
details.menu>summary{list-style:none;cursor:pointer}
details.menu>summary::-webkit-details-marker{display:none}


.people.found li{align-items:center}


/* weekly availability: the editing grid and the read-only week strip */




.ostrip{display:grid;grid-template-columns:34px repeat(48,minmax(0,1fr));gap:2px 0;margin:8px 0;max-width:640px}
.ostrip>span{font-size:10.5px;color:var(--muted);white-space:nowrap;line-height:14px}
.ostrip .od{font-weight:600;color:var(--ink-2)}
.ostrip i{height:12px;background:var(--surface-2)}
.ostrip i:nth-of-type(2n){margin-right:1px}
.ostrip i.on{background:rgba(61,220,132,.7)}
[data-theme="light"] .ostrip i.on{background:rgba(16,140,80,.6)}
[data-theme="light"] .pav.letters{background:hsl(var(--h,220) 45% 42%)}
@media (max-width:820px){.pp-body{grid-template-columns:1fr}}
@media (max-width:720px){.pp-head{gap:16px;padding-top:28px}.pav.xl{width:88px;height:88px;font-size:28px}.hist li{grid-template-columns:1fr;gap:2px}}
@media (min-width:961px){.team-body{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}}
/* ===== Round One events: Home, events, Match Rooms, disputes, organizer tools ===== */
.pill.ok{background:rgba(61,220,132,.13);color:var(--good)}
.ok{color:var(--good)}
.dia{color:var(--blue-hi);letter-spacing:.08em;font-size:15px;white-space:nowrap}
.banner{padding:12px 16px;margin:0 0 14px;border:1px solid var(--line-2);border-radius:12px;background:var(--surface);font-size:14px;line-height:1.5}
.banner.bad{border-color:rgba(248,49,62,.5);background:linear-gradient(90deg,var(--red-bg),var(--surface) 80%)}
.banner.warn{border-color:rgba(255,194,61,.45);background:linear-gradient(90deg,rgba(255,194,61,.12),var(--surface) 80%)}
.banner a{font-weight:600}
.linkish{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;text-align:left;text-decoration:underline;text-underline-offset:3px}
ul.plain,ul.needs,ul.notes,ul.feed,ul.evteams,ul.evpick,ul.rmmaps,ul.mboard,ol.ozseeds{list-style:none;margin:0;padding:0}
ul.plain li{padding:3px 0}
.needs li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.needs li:first-child{border-top:0}
.needs p{margin:0;flex:1;min-width:0}
.notes li{border-top:1px solid var(--line)}
.notes li:first-child{border-top:0}
.note{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:4px 14px;align-items:center;width:100%;padding:12px 4px;background:none;border:0;color:inherit;font:inherit;text-align:left;cursor:pointer;min-height:44px}
.note:hover{background:var(--surface-2)}

.notes .unread .nt{font-weight:700;color:var(--white)}

.bell{position:relative;display:inline-grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--ink-2)}
.bell .i{width:18px;height:18px}
.bell .count{position:absolute;top:-6px;right:-8px;margin:0}
.bell[aria-current="page"]{border-color:var(--ink-2)}
/* events hub and event pages */
.evlist .tl-meta{grid-column:1}










.evpick li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 0;border-top:1px solid var(--line)}
.evpick li:first-child{border-top:0}
.evpick select{width:auto;min-width:140px}
.feed li{padding:12px 0;border-top:1px solid var(--line)}
.feed li:first-child{border-top:0}
.feed p{margin:4px 0}
/* public match page and the Match Room header */







.rstrip{display:flex;flex-wrap:wrap;gap:3px;margin:8px 0}
i.rd{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:5px;font-style:normal;font-size:11px;font-weight:700;background:var(--surface-2);color:var(--ink)}
p i.rd{width:12px;height:12px;vertical-align:-1px}

i.rd.rb{background:var(--blue-bg);color:var(--blue-hi);border:1px solid rgba(34,211,238,.45)}
/* the Match Room */





















.msg{padding:8px 10px;border-radius:10px;background:var(--surface-2);border-left:3px solid var(--line-2)}
.msg.sa{border-left-color:var(--red)}
.msg.sb{border-left-color:var(--blue)}
.msg.staff{border-left-color:var(--warn)}
.msg p{margin:0 0 4px;overflow-wrap:anywhere}
.reacts{display:flex;flex-wrap:wrap;gap:4px}
.react{min-height:30px;padding:2px 9px;border-radius:99px;border:1px solid var(--line);background:none;color:var(--ink-2);font-size:13px;cursor:pointer}
.react.on{border-color:var(--blue);background:var(--blue-bg);color:var(--white)}





.shots{display:flex;flex-wrap:wrap;gap:8px}
.shots img{max-width:220px;max-height:160px;border-radius:8px;border:1px solid var(--line-2)}
/* organizer tools */









#ozSetup{display:flex;flex-direction:column;gap:12px}
.ozplain{border:0;margin:0;padding:0;min-width:0;display:flex;flex-direction:column;gap:12px}
.ozplain[disabled]{opacity:.6}
.ozset{border:1px solid var(--line);border-radius:12px;padding:10px 14px 14px;margin:0;min-width:0}
.ozset legend{padding:0 6px;font-weight:600;font-size:14px;color:var(--ink-2)}
.ozchecks{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:0 12px}
.ozlogo{align-items:center;gap:14px}
.ozweek{display:grid;grid-template-columns:minmax(0,.8fr) repeat(3,minmax(0,1fr)) auto;gap:8px;align-items:end;padding:8px 0;border-top:1px solid var(--line)}
.ozweek:first-child{border-top:0}


.mcard{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--line);border-left:3px solid var(--line-2);border-radius:12px;background:var(--surface-2)}
.mcard>a{display:flex;flex-direction:column;gap:5px;text-decoration:none;align-items:flex-start}
.mcard .sl{font-size:12.5px;color:var(--muted)}
.mcard .sv b{font-family:var(--display);padding:0 6px;color:var(--white)}
.mcard .st{font-size:13px;color:var(--ink-2)}
.mcard.st-live{border-left-color:var(--red)}
.mcard.st-warn{border-left-color:var(--warn)}
.mcard.st-bad{border-left-color:var(--red-ink);background:linear-gradient(90deg,var(--red-bg),var(--surface-2) 60%)}
.mcard.st-ok{border-left-color:var(--good)}




.ozseeds{counter-reset:seed;display:flex;flex-direction:column;gap:6px;margin:8px 0 12px}
.ozseeds li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2)}
.ozseeds li>span:first-child:before{counter-increment:seed;content:counter(seed) '. ';color:var(--muted);font-weight:600}

@media (max-width:960px){.rmgrid,.ozwrap{grid-template-columns:minmax(0,1fr)}.ozbar{position:static;min-width:0}.ozbar ol{flex-direction:row;overflow-x:auto;gap:4px}.ozstep{min-width:180px}}
@media (max-width:720px){.r1-facts.evfacts{grid-template-columns:1fr 1fr}.mvhead{grid-template-columns:1fr;gap:12px}.mvmid{order:-1}.needs li{flex-direction:column;align-items:stretch}.note{grid-template-columns:1fr auto}.nk{grid-column:1/-1}.ozweek{grid-template-columns:1fr 1fr}.ozweek .btn{grid-column:1/-1}}
[data-theme="light"] .mvscore,[data-theme="light"] .mvmap,[data-theme="light"] .mcard .sv b,[data-theme="light"] .notes .unread .nt,[data-theme="light"] .react.on{color:var(--ink)}
[data-theme="light"] .pill.ok,[data-theme="light"] .ok,[data-theme="light"] .mvside.win b,[data-theme="light"] .mvside.win .mvscore{color:#0f8a4b}
/* Scrims (page guide 20 to 22) */
.stack{display:flex;flex-direction:column;align-items:flex-start;gap:10px}




.pcard form .row{align-items:flex-end}
/* Class (phase 5) */
.pill.muted{background:var(--line);color:var(--muted);font-weight:500}
.pill.cls{margin-left:6px}
.formula{font-family:var(--display);font-size:1.05rem;letter-spacing:.02em;margin:4px 0 10px}
table.ranks tr.grp th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.06em;padding-top:14px;opacity:.75}

/* ---------- facelift: foundation (phase 1) ---------- */
/* Rules everyone can rely on: anything clickable has a box or an underline and reacts on hover, and every
   number sits in a box. Panels read like the design boards: graphite cards, fine borders, a red square marker. */
:root{--r:10px;--r-sm:7px;--ease:cubic-bezier(.2,.7,.2,1)}
body:before{transform:none}
.eyebrow{display:flex;align-items:center;gap:8px;margin:0;font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2)}
.eyebrow:before{content:'';width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red)}
h1{letter-spacing:-.01em}
.panel,.hero-board,.tablewrap{border-radius:var(--r)}

/* top bar */
.site-top{transition:box-shadow .2s,background-color .2s}
.site-top.scrolled{box-shadow:0 10px 30px rgba(0,0,0,.45)}

#nav{gap:2px}
#nav a{position:relative;padding:9px 14px;font-size:14.5px;border-radius:8px;transition:color .15s,background-color .15s}
#nav a:after{content:'';position:absolute;left:12px;right:12px;bottom:0;height:2px;background:var(--red);transform:scaleX(0);transition:transform .2s var(--ease)}
#nav a:hover{background:var(--surface-2);color:var(--white)}
#nav a[aria-current="page"]{background:var(--surface-2);box-shadow:none;color:var(--white)}
#nav a[aria-current="page"]:after{transform:scaleX(1);box-shadow:0 0 12px var(--red)}
.iconbtn{position:relative;display:inline-grid;place-items:center;width:40px;height:40px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--surface);color:var(--ink-2);text-decoration:none;transition:border-color .15s,color .15s,background-color .15s}
.iconbtn:hover{color:var(--white);border-color:rgba(255,255,255,.3);background:var(--surface-2)}
.iconbtn .i{width:18px;height:18px}
.bell{border-radius:var(--r)}

.acct{cursor:pointer;font:inherit;font-weight:600;font-size:14px;color:var(--ink);border:1px solid var(--line-2);border-radius:var(--r);padding:4px 10px 4px 4px;background:var(--surface);transition:border-color .15s,background-color .15s}
.acct:hover,.acct[aria-expanded="true"]{border-color:rgba(255,255,255,.3);background:var(--surface-2)}
.acct .av{border-radius:var(--r-sm);background:linear-gradient(135deg,var(--red),#7a0910);color:#fff;font-family:var(--display);font-weight:700}
.acct .count{margin:0}
.acct .chev{width:16px;height:16px;color:var(--muted);transition:transform .2s var(--ease)}
.acct[aria-expanded="true"] .chev{transform:rotate(180deg)}

@keyframes menuIn{from{opacity:0;transform:translateY(-6px)}}















/* clickable means it looks clickable */
main a:not([class]):not(.btn){text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.35);transition:color .15s,text-decoration-color .15s}
main a:not([class]):not(.btn):hover{color:var(--blue-hi);text-decoration-color:currentColor}
.btn{border-radius:var(--r);transition:background-color .15s,border-color .15s,box-shadow .2s,transform .1s}
.btn:not(.primary){border-color:var(--line-2)}
.btn:not(.primary):hover{border-color:rgba(255,255,255,.32)}
.btn.primary:hover{box-shadow:var(--glow)}
.btn.ghost{border-color:var(--line-2)}
.teams a,.tlist a,.mcard>a,.tile{position:relative;isolation:isolate;transition:border-color .18s,background-color .18s,box-shadow .25s,transform .25s var(--ease);transform:perspective(900px) rotateX(var(--rx,0)) rotateY(var(--ry,0))}
.teams a:hover,.tlist a:hover,.mcard>a:hover,.tile:hover{border-color:rgba(248,49,62,.55);box-shadow:0 14px 34px rgba(0,0,0,.45),0 0 0 1px rgba(248,49,62,.25)}
.teams a:after,.tlist a:after,.tile:after{content:'';position:absolute;right:14px;top:50%;width:8px;height:8px;border-right:2px solid var(--muted);border-top:2px solid var(--muted);transform:translateY(-50%) rotate(45deg);transition:border-color .15s,right .2s var(--ease)}
.teams a:hover:after,.tlist a:hover:after,.tile:hover:after{border-color:var(--red-ink);right:11px}
.teams a,.tlist a{padding-right:38px}
.sched li a{position:relative;border-radius:var(--r-sm);transition:background-color .15s}
.sched li a:hover{background:var(--surface-2)}
.board-row .pwho a,.ranks .tm a,.seeds a,.ozalerts a{background:linear-gradient(currentColor,currentColor) left bottom/100% 1px no-repeat;padding-bottom:2px;opacity:.95}
.board-row .pwho a:hover,.ranks .tm a:hover,.seeds a:hover,.ozalerts a:hover{color:var(--blue-hi)}
.subnav a,.docnav a{border:1px solid transparent}
.subnav a:not([aria-current="page"]){border-color:var(--line)}
.subnav a:hover{border-color:var(--line-2)}

summary{cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.3)}

/* numbers live in boxes */
.nb,.nums b,.mrow b,.sched .sv b,.seedlist .sn{display:inline-block;min-width:2.2em;padding:2px 8px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--bg-2);text-align:center;line-height:1.35;font-family:var(--mono);font-variant-numeric:tabular-nums}
.nums b{padding:3px 10px}
.rk:not(td){display:inline-grid;place-items:center;min-width:1.7em;padding:2px 6px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--bg-2)}
.count{border-radius:6px}
.pill{border-radius:6px;border:1px solid currentColor;border-color:color-mix(in srgb,currentColor 45%,transparent)}

/* glow under the mouse */
.panel,.hero-board,.tile{position:relative;isolation:isolate}
.panel:after,.hero-board:after,.teams a:before,.tlist a:before,.tile:before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;opacity:0;transition:opacity .3s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.055),transparent 60%)}
.panel:hover:after,.hero-board:hover:after,.teams a:hover:before,.tlist a:hover:before,.tile:hover:before{opacity:1}

/* Find page */
.search.big{max-width:none;margin:4px 0 18px}
.search.big input{min-height:54px;font-size:16px;padding-left:46px;border-radius:var(--r);background:var(--surface);border-color:var(--line-2)}
.search.big input:focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-bg)}
.search.big .i{left:16px;width:20px;height:20px}

.tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.tile{display:grid;grid-template-columns:42px minmax(0,1fr);grid-template-rows:auto auto;column-gap:14px;align-items:center;padding:18px 40px 18px 18px;height:100%;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);text-decoration:none;color:var(--ink);box-shadow:0 10px 28px rgba(0,0,0,.35)}
.tile .i{grid-row:1/3;width:42px;height:42px;padding:10px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--bg-2);color:var(--red-ink)}
.tile b{font-family:var(--display);font-size:17px;font-weight:600}
.tile span{font-size:13px;color:var(--muted);line-height:1.4}

/* entrance */
.rv{opacity:0;translate:0 14px}
.rv.sx{translate:var(--sx,0) 0}
.rv.in{opacity:1;translate:none;transition:opacity .45s var(--ease) var(--d,0ms),translate .5s var(--ease) var(--d,0ms)}
.teams>li.rv.in,.tiles>li.rv.in,.tlist>li.rv.in{transition-duration:.35s}

/* light mode keeps the same shapes */
[data-theme="light"] .site-top.scrolled{box-shadow:0 6px 20px rgba(0,0,0,.08)}

[data-theme="light"] main a:not([class]):not(.btn){text-decoration-color:rgba(20,23,28,.35)}
[data-theme="light"] .btn:not(.primary):hover,[data-theme="light"] .iconbtn:hover,[data-theme="light"] .acct:hover{border-color:rgba(16,20,28,.4)}
[data-theme="light"] .panel:after,[data-theme="light"] .hero-board:after,[data-theme="light"] .teams a:before,[data-theme="light"] .tlist a:before,[data-theme="light"] .tile:before{background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(0,0,0,.035),transparent 60%)}
[data-theme="light"] .tile{box-shadow:0 1px 3px rgba(0,0,0,.08)}


@media (prefers-reduced-motion:reduce){
  body:before{transform:none}
  .rv,.rv.sx{opacity:1;transform:none;translate:none}
  .teams a,.tlist a,.mcard>a,.tile{transform:none}
  *,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* ---------- facelift: landing (phase 2) ---------- */
body{overflow-x:clip}
.btn.lg{min-height:52px;padding:12px 26px;font-size:16px}









.lx-copy{position:relative;z-index:3;max-width:var(--wrap);height:100%;margin:0 auto;padding:0 var(--gut) 40px;display:flex;flex-direction:column;justify-content:center;gap:18px}
.lx-copy>*{max-width:480px}




/* the logo: six copies stacked in depth make a solid 3D badge that turns toward the mouse */







@keyframes lxFloat{0%,100%{translate:0 0;rotate:y -9deg}50%{translate:0 -8px;rotate:y 9deg}}




.lx-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}
.lx-stats>div{display:flex;align-items:center;gap:16px;padding:18px 20px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);box-shadow:0 10px 28px rgba(0,0,0,.35)}
.stat-n{display:inline-grid;place-items:center;min-width:2.4em;padding:6px 12px;border:1px solid rgba(34,211,238,.35);border-radius:var(--r-sm);background:var(--bg-2);font-family:var(--mono);font-size:28px;font-weight:600;color:var(--blue);line-height:1.1}
.lx-stats b{font-size:14px;font-weight:500;color:var(--ink-2)}

.evc{position:relative;isolation:isolate;display:flex;flex-direction:column;gap:6px;height:100%;padding:16px 16px 18px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);text-decoration:none;color:var(--ink);box-shadow:0 10px 28px rgba(0,0,0,.35);transition:border-color .18s,box-shadow .25s,transform .25s var(--ease);transform:perspective(900px) rotateX(var(--rx,0)) rotateY(var(--ry,0))}
.evc:hover{border-color:rgba(248,49,62,.55);box-shadow:0 14px 34px rgba(0,0,0,.45),0 0 0 1px rgba(248,49,62,.25)}


.evc b{font-family:var(--display);font-size:17px;font-weight:600;line-height:1.2;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:3px;transition:text-decoration-color .15s}
.evc:hover b{text-decoration-color:currentColor}

[data-theme="light"] .lx-stats>div,[data-theme="light"] .evc{box-shadow:0 1px 3px rgba(0,0,0,.08)}

@media (prefers-reduced-motion:reduce){.lx-logo{animation:none}.lx-video video{transform:none}}
@media (max-width:960px){.lx-for,.lx-stats{grid-template-columns:1fr}.lx-events{grid-template-columns:repeat(2,minmax(0,1fr))}.lx-title{font-size:48px}.lx-hero{--cut:46%}}

/* ---------- facelift: getting in (phase 2) ---------- */
/* Sign in and sign up: form on the left, what you get on the right */
.auth{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:16px;max-width:960px;margin:48px auto 0;align-items:start}




.why{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:16px}
.why li{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:14px;align-items:start}
.why .i{grid-row:1/3;width:40px;height:40px;padding:9px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--surface);color:var(--blue);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.why b{font-weight:600}
.why span{font-size:13.5px;color:var(--muted);line-height:1.45}
/* Join: stepper with circles, the form with a preview, then what comes next */

.saved{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.saved .i,.r1-steps .i{width:14px;height:14px;fill:none;stroke:var(--good,#3ddc84);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
ol.r1-steps{list-style:none;margin:6px 0 2px;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}
.r1-steps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;font-size:12.5px;color:var(--muted);line-height:1.25}
.r1-steps li:before{content:'';position:absolute;top:14px;left:calc(-50% + 18px);right:calc(50% + 18px);height:2px;background:var(--line-2)}
.r1-steps li:first-child:before{display:none}
.r1-steps li.done:before,.r1-steps li.on:before{background:var(--good,#3ddc84)}
.r1-steps b{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:2px solid var(--line-2);background:var(--bg-2);font-family:var(--mono);font-size:13px;font-weight:600;color:var(--muted)}
.r1-steps li.done b{border-color:var(--good,#3ddc84);background:rgba(61,220,132,.12)}
.r1-steps li.on b{border-color:var(--blue);color:var(--blue);box-shadow:0 0 0 4px var(--blue-bg),0 0 18px rgba(34,211,238,.25)}
.r1-steps li.on{color:var(--ink);font-weight:600}
.r1-steps span{display:block}



.r1-prev{align-self:start}
.r1-prev-card{display:flex;align-items:center;gap:16px;padding:16px;border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2)}
.r1-ini{display:grid;place-items:center;flex:none;width:64px;height:64px;border:1px solid rgba(34,211,238,.4);border-radius:var(--r);background:var(--surface-2);font-family:var(--display);font-size:30px;font-weight:700;color:var(--blue)}
.r1-prev-card div{display:flex;flex-direction:column;gap:4px;min-width:0}
.r1-prev-card b{font-family:var(--display);font-size:22px;font-weight:600;overflow-wrap:anywhere}
.r1-prev-card div span{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--ink-2)}
.r1-prev-card .i,.r1-who .i,.r1-drop>.i{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.r1-prev-card .i{width:15px;height:15px;color:var(--muted)}






.tiles.r1-done{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:4px}
/* Link Ubisoft: numbered steps, copyable folder paths, the drop zone, and a side column */
.subnav.tabs{padding:0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;gap:0;margin:0}
.subnav.tabs a{border-radius:0;padding:10px 16px}
.subnav.tabs a:hover{background:none;color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.subnav.tabs a[aria-current="page"]{background:none;box-shadow:inset 0 -2px 0 var(--blue)}
ol.r1-how{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px}
.r1-how>li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:14px}
.r1-how .n{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid rgba(34,211,238,.45);background:var(--blue-bg);color:var(--blue);font-family:var(--mono);font-size:13px}
.r1-how h3{margin:4px 0 4px;font-size:16px}
.r1-how p{margin:0 0 8px;color:var(--ink-2);font-size:14px}





.r1-drop{padding:34px 16px;border-color:rgba(34,211,238,.35);background:repeating-linear-gradient(135deg,transparent 0 14px,rgba(34,211,238,.025) 14px 28px);transition:border-color .15s,background-color .15s,transform .2s var(--ease)}
.r1-drop:hover{border-color:var(--blue)}
.r1-drop.over{transform:scale(1.01)}
.r1-drop>.i{width:42px;height:42px;color:var(--blue)}



.r1-card{border-color:rgba(34,211,238,.3);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.r1-card.wait{border-color:rgba(255,194,61,.45);background:linear-gradient(160deg,rgba(255,194,61,.08),transparent 50%),var(--surface)}
.r1-card.wait .eyebrow:before{background:var(--warn,#ffc768);box-shadow:0 0 10px var(--warn,#ffc768)}
.r1-card.bad{border-color:rgba(255,90,90,.45)}
.r1-card.ok .eyebrow:before{background:var(--good,#3ddc84);box-shadow:0 0 10px var(--good,#3ddc84)}
.r1-card h2{margin:0}
.r1-found,.r1-who{display:flex;align-items:center;gap:16px;padding:12px;border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2)}
.r1-found img{width:160px;height:90px;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--line-2)}
.r1-found div,.r1-who div{display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.r1-found b,.r1-who b{font-family:var(--display);font-size:22px;font-weight:600}
.r1-who .i{width:40px;height:40px;color:var(--good,#3ddc84)}
.credit{margin:0;font-size:11px;color:var(--muted)}
/* Settings: the section list on the left stays put while the sections scroll */
.set{display:grid;grid-template-columns:220px minmax(0,1fr);gap:20px;align-items:start}
.set-nav{position:sticky;top:88px;display:flex;flex-direction:column;gap:4px;padding:8px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.set-nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--r-sm);color:var(--ink-2);text-decoration:none;font-weight:500;font-size:14.5px;border:1px solid transparent}
.set-nav a:hover{background:var(--surface-2);color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.set-nav a[aria-current]{background:var(--surface-2);color:var(--ink);border-color:var(--line-2);box-shadow:inset 3px 0 0 var(--red)}
.set-nav .i{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.set-main{display:flex;flex-direction:column;gap:14px;min-width:0}
.set-main>.panel.narrow{max-width:none;margin:0;scroll-margin-top:88px}
.set-main #delete{border-color:rgba(255,90,90,.35)}

[data-theme="light"] .r1-card,[data-theme="light"] .r1-card.wait{box-shadow:0 1px 3px rgba(0,0,0,.08)}
@media (max-width:960px){.auth,.r1j-body.two,.r1l,.set{grid-template-columns:1fr}.r1j-cards{grid-template-columns:1fr}.set-nav{position:static;flex-direction:row;flex-wrap:wrap}}
.r1-steps span:before{display:none}
.subnav.tabs a,.subnav.tabs a:not([aria-current="page"]),.subnav.tabs a:hover{border-color:transparent}

/* ---------- facelift: everyday (phase 3) ---------- */
.page-head .hl{color:var(--blue)}
.h-sub{font-family:var(--body,inherit);font-size:13px;font-weight:500;color:var(--muted)}
.panel-head h2 .nb{font-size:14px;vertical-align:.1em}
/* Home: needs, next match and team on top; the week, results and progress below */




.needs .i{width:36px;height:36px;padding:8px;border:1px solid rgba(248,49,62,.4);border-radius:var(--r-sm);background:var(--red-bg);color:var(--red-ink);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.needs p{font-size:14px}













.row.chips{gap:6px;margin:0}









/* Notifications: header actions on the right, tabs with unread counts, rows with an icon box */
.nt-head{flex-direction:row;justify-content:space-between;align-items:flex-end;max-width:none}
.nt-head .i{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.subnav.tabs{margin-bottom:14px}
.subnav.tabs .count{margin-left:6px}
ul.notes.panel{padding:6px;gap:0}
.notes .note{grid-template-columns:10px 36px minmax(0,1fr) auto 18px;gap:12px;padding:12px 10px;border-radius:var(--r-sm)}
.notes .note .dot{width:8px;height:8px;border-radius:50%}
.notes .unread .note .dot{background:var(--blue);box-shadow:0 0 8px var(--blue)}
.notes .unread .note{background:linear-gradient(90deg,var(--blue-bg),transparent 60%)}
.notes .note>.i{width:36px;height:36px;padding:8px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--bg-2);color:var(--ink-2);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.notes .unread .note>.i{color:var(--blue);border-color:rgba(34,211,238,.4)}
.notes .nt{display:flex;flex-direction:column;gap:2px}


.notes .chev{width:18px;height:18px;fill:none;stroke:var(--muted);stroke-width:2}
.notes .note:hover .chev{stroke:var(--ink)}
/* Search: tabs with counts, grouped result panels, and the two recruiting boards */
.search.big{margin-bottom:14px}







.sres{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg-2);text-decoration:none;color:var(--ink);transition:border-color .15s,background-color .15s}
.sres:hover{border-color:var(--line-2);background:var(--surface-2)}
.sres:hover b{text-decoration:underline;text-underline-offset:3px}
.sres>.i{width:40px;height:40px;padding:9px;border:1px solid var(--line-2);border-radius:var(--r-sm);color:var(--red-ink);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sres .badge,.sres .pav{width:40px;height:40px}
.sres-id{display:flex;flex-direction:column;gap:2px;min-width:0}
.sres-id b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Availability: legend, a roomier week grid, two panels side by side */



.legend{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--ink-2)}
.legend li{display:flex;align-items:center;gap:7px}
.legend i{width:14px;height:14px;border-radius:4px}
.lg-on{background:var(--blue)}
.lg-busy{background:repeating-linear-gradient(45deg,var(--surface-2) 0 3px,rgba(255,90,90,.45) 3px 6px)}
.lg-off{background:var(--surface-2);border:1px solid var(--line-2)}






.savebar .btn.primary{min-width:180px}

[data-theme="light"] .notes .unread .note{background:linear-gradient(90deg,rgba(14,116,144,.08),transparent 60%)}
@media (max-width:960px){.hm-grid,.sgroups,.find-boards,.av-two{grid-template-columns:1fr}.hm-join{grid-template-columns:44px 1fr}.nt-head,.av-head{flex-direction:column;align-items:flex-start}}
main>.banner:first-child{margin-top:24px}

/* ---------- facelift: profiles (phase 4) ---------- */
/* Player, team and org pages open with an ID card: picture, name, verified facts and the main actions on the right.
   A tab row under it jumps to each section and stays under the top bar while you scroll. */
.idcard{position:relative;isolation:isolate;overflow:hidden;margin:28px 0 0;padding:28px 30px;border:1px solid var(--line-2);border-radius:14px;background:radial-gradient(120% 140% at 0% 0%,rgba(248,49,62,.16),transparent 55%),linear-gradient(180deg,var(--surface-2),var(--surface));box-shadow:0 18px 44px rgba(0,0,0,.45)}
.idcard:before{content:'';position:absolute;left:0;top:18px;bottom:18px;width:3px;border-radius:0 3px 3px 0;background:var(--red);box-shadow:0 0 16px var(--red)}
.idcard:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(115deg,transparent 55%,rgba(255,255,255,.03) 55% 62%,transparent 62%)}


.idcard .eyebrow{margin-bottom:-2px}
.idcard h1{font-size:40px;line-height:1.05}

.idcard .badge.xl,.id-av .pav.xl{box-shadow:0 0 0 1px var(--line-2),0 14px 30px rgba(0,0,0,.5)}

.idcard .t-meta .i,.idcard .team-meta .i{width:15px;height:15px;color:var(--muted)}


.pill.lft{background:var(--blue-bg);color:var(--blue-hi);letter-spacing:.06em}
.pill .i{width:12px;height:12px;vertical-align:-1px;margin-right:4px}
.jump{position:sticky;top:66px;z-index:30;display:flex;gap:0;margin:14px 0 18px;border-bottom:1px solid var(--line);background:rgba(9,10,12,.88);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);overflow-x:auto}
.jump a{padding:12px 18px;font-weight:600;font-size:14px;color:var(--ink-2);text-decoration:none;white-space:nowrap;transition:color .15s,box-shadow .2s}
.jump a:hover{color:var(--white);text-decoration:underline;text-underline-offset:5px}
.jump a[aria-current]{color:var(--white);box-shadow:inset 0 -2px 0 var(--red)}

.pp-body .panel,.team-body .panel,.editor .panel{scroll-margin-top:130px}
/* big boxed numbers */
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:10px;margin:4px 0 0}
.stat{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg-2)}
.stat>span{font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.stat .stat-n{font-size:26px;padding:4px 10px}
.stat:first-child .stat-n{color:var(--white);border-color:rgba(248,49,62,.5);box-shadow:0 0 18px rgba(248,49,62,.18)}
.stat small{font-size:12px;color:var(--muted)}
.statrow.sm{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:14px}
.statrow.sm .stat-n{font-size:20px}
.statrow.sm .stat:first-child .stat-n{color:var(--blue);border-color:rgba(34,211,238,.35);box-shadow:none}
.bignum{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.vnote{display:flex;align-items:center;gap:8px;margin:14px 0 0;font-size:13px;color:var(--muted)}
.vnote .i{width:18px;height:18px;color:var(--good)}
.panel td.acts a{font-weight:600}
/* team results: event, score box, win or loss box */
.rlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.rlist a{display:grid;grid-template-columns:minmax(0,1fr) auto 34px;gap:12px;align-items:center;padding:9px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg-2);color:var(--ink);text-decoration:none;transition:border-color .15s,background-color .15s}
.rlist a:hover{border-color:var(--line-2);background:var(--surface-2)}
.rlist a:hover b{text-decoration:underline;text-underline-offset:3px}
.rl-ev{display:flex;flex-direction:column;gap:2px;min-width:0}
.rl-ev b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wl{display:grid;place-items:center;width:34px;height:30px;border-radius:var(--r-sm);font-family:var(--display);font-weight:700}
.wl.w{background:rgba(61,220,132,.16);color:var(--good);border:1px solid rgba(61,220,132,.5)}
.wl.l{background:var(--red-bg);color:var(--red-ink);border:1px solid rgba(255,90,90,.45)}
.crew .who-cell .pav{width:36px;height:36px}
/* edit profile: actions in the header, two columns, locked facts in a row */
.editor.wide{max-width:none}
.ed-head,.bd-head{flex-direction:row;justify-content:space-between;align-items:flex-end;gap:20px;max-width:none}
.ed-head>div:first-child,.bd-head>div:first-child{display:flex;flex-direction:column;gap:8px;max-width:720px}


.cnt{float:right;font-family:var(--mono);font-size:12px;color:var(--muted)}
.locks.row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.locks.row3 li{padding:12px;border:1px dashed var(--line-2);border-radius:var(--r-sm);background:var(--bg-2)}
.lock .i{width:18px;height:18px}
.check.switch{align-items:center}
.check.switch input{appearance:none;-webkit-appearance:none;flex:none;width:42px;height:24px;margin:0;border-radius:99px;border:1px solid var(--line-2);background:var(--surface-2);position:relative;cursor:pointer;transition:background-color .2s,border-color .2s}
.check.switch input:before{content:'';position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--ink-2);transition:transform .2s var(--ease),background-color .2s}
.check.switch input:checked{background:var(--blue);border-color:var(--blue-hi)}
.check.switch input:checked:before{transform:translateX(18px);background:#fff}
.check.switch input:focus-visible{outline:2px solid var(--blue-hi);outline-offset:2px}
/* recruiting boards and scouting: labelled filters, a result count, cards with boxed facts */
.tools.filters{flex-direction:row;flex-wrap:wrap;align-items:flex-end;gap:12px;padding:14px 16px;margin-bottom:12px}

.filters .sel{display:flex;flex-direction:column;gap:6px;flex:1 1 150px}
.filters .sel>.sr{position:static!important;width:auto;height:auto;margin:0;clip:auto;overflow:visible;white-space:nowrap;font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.filters .check{min-height:44px;align-items:center}
.found-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 12px}
.found-bar p{margin:0;color:var(--ink-2)}
.pav.lg{width:52px;height:52px;font-size:17px}
.pcard{border-radius:var(--r);gap:10px;padding:16px;box-shadow:0 10px 28px rgba(0,0,0,.35);transition:border-color .18s,box-shadow .25s}
.pcard:hover{border-color:rgba(248,49,62,.45)}
.pc-top{align-items:flex-start}
.pc-top .muted .i{width:13px;height:13px;vertical-align:-2px;margin-right:3px}
.pc-top .row.chips{margin-top:6px}








.pcard.lfp{display:grid;grid-template-columns:112px minmax(0,1fr) 220px;gap:18px;align-items:start;padding:18px}





.chip.strong{border-color:rgba(34,211,238,.45);color:var(--blue)}
.chip.want{border-color:rgba(248,49,62,.5);color:var(--red-ink);background:var(--red-bg)}
.chip.map{border-radius:var(--r-sm);background:var(--bg-2)}
[data-theme="light"] .idcard{background:radial-gradient(120% 140% at 0% 0%,rgba(197,1,2,.08),transparent 55%),var(--surface);box-shadow:0 1px 3px rgba(0,0,0,.08)}
[data-theme="light"] .jump{background:rgba(245,246,248,.92)}
[data-theme="light"] .pcard{box-shadow:0 1px 3px rgba(0,0,0,.08)}
@media (max-width:960px){.ed-grid{grid-template-columns:1fr}.ed-head,.bd-head{flex-direction:column;align-items:flex-start}.pcard.lfp{grid-template-columns:88px minmax(0,1fr)}.lfp-side{grid-column:1/-1}.lfp-logo .badge.xl{width:88px;height:88px}}
@media (max-width:720px){.locks.row3{grid-template-columns:1fr}.idcard{padding:20px}.idcard h1{font-size:32px}.id-acts,.pp-acts{margin-left:0}}
main .jump a:not([class]){text-decoration:none}
main .jump a:not([class]):hover{color:var(--white);text-decoration:underline;text-underline-offset:5px}

.panel h2 .nb{font-size:14px;vertical-align:.1em}
main .teams a:not([class]){text-decoration:none}
main .teams a:not([class]):hover .tn{text-decoration:underline;text-underline-offset:3px}
main .panel[id]{scroll-margin-top:90px}

/* ---------- facelift: competing (phase 5) ---------- */
/* Match Room, match page and scrim room share one big VS card. Rooms add a title row and a row of steps. */










ol.r1-steps.rm{grid-template-columns:repeat(7,minmax(0,1fr));margin:0;padding:16px 8px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
ol.r1-steps.reg{margin:0 0 16px;padding:16px 8px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}






.vs{font-family:var(--display);font-size:30px;font-weight:700;letter-spacing:.06em;color:var(--muted)}











/* check-in, lineups, map bans and uploads */
.panel.hot{border-color:rgba(255,194,61,.5);box-shadow:0 0 0 1px rgba(255,194,61,.2),0 14px 34px rgba(0,0,0,.45)}



















/* dispute timeline */
ol.tline{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column}
.tline li{position:relative;display:flex;flex-direction:column;gap:2px;padding:0 0 18px 30px;color:var(--muted)}
.tline li:before{content:'';position:absolute;left:6px;top:4px;width:12px;height:12px;border-radius:50%;border:2px solid var(--line-2);background:var(--bg-2)}
.tline li:after{content:'';position:absolute;left:12px;top:20px;bottom:2px;width:2px;background:var(--line-2)}
.tline li:last-child{padding-bottom:0}
.tline li:last-child:after{display:none}
.tline li b{font-weight:600}
.tline li.done{color:var(--ink-2)}
.tline li.done:before{border-color:var(--good);background:var(--good)}
.tline li.done:after{background:rgba(61,220,132,.6)}
.tline li.on{color:var(--white)}
.tline li.on:before{border-color:var(--blue);box-shadow:0 0 0 4px var(--blue-bg),0 0 14px rgba(34,211,238,.35)}
/* scrim finder and proposals */
.hl.brk{display:block}


.bd-head .sel,.bd-head label.f{flex:none;width:260px}

.sx-side{display:flex;flex-direction:column;align-items:stretch;gap:10px}



.sx-form{grid-column:1/-1;padding:14px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--bg-2)}
.pcard.prop{gap:12px}









.subnav.tabs .nb{margin-left:6px;min-width:1.8em;padding:0 6px;font-size:12px}
.subnav.tabs .nb.hot{color:var(--red-ink);border-color:rgba(255,90,90,.5)}
/* events hub */
.enext{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.enext .tile em{font-style:normal;font-weight:600;color:var(--red-ink);text-decoration:underline;text-underline-offset:3px}

.evrow{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) 120px;gap:18px;align-items:center;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);color:var(--ink);text-decoration:none;box-shadow:0 10px 28px rgba(0,0,0,.35);transition:border-color .18s,box-shadow .25s,transform .25s var(--ease);transform:perspective(900px) rotateX(var(--rx,0)) rotateY(var(--ry,0))}
.evrow:hover{border-color:rgba(248,49,62,.55);box-shadow:0 14px 34px rgba(0,0,0,.45),0 0 0 1px rgba(248,49,62,.25)}
.evr-id{display:flex;flex-direction:column;gap:6px;min-width:0}
.evrow:hover .tl-name{text-decoration:underline;text-underline-offset:4px}
.evr-facts{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--ink-2);min-width:0}
.evr-facts>span{display:flex;align-items:center;gap:8px;min-width:0}
.evr-facts .i{width:15px;height:15px;color:var(--muted)}
.evr-n{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.evr-n .nb{font-size:15px}
.evr-n small{font-size:11.5px;color:var(--muted)}
.evr-n em{margin-top:4px;padding:6px 12px;border-radius:var(--r-sm);background:var(--red);color:#fff;font-style:normal;font-weight:600;font-size:13px;white-space:nowrap}
.evrow:hover .evr-n em{box-shadow:var(--glow)}




[data-theme="light"] .evrow{box-shadow:0 1px 3px rgba(0,0,0,.08)}
@media (max-width:1100px){.evrow{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 110px}.evr-facts:nth-child(3){display:none}}
@media (max-width:960px){.sxtop{grid-template-columns:1fr}.pcard.sxcard{grid-template-columns:56px minmax(0,1fr)}.sx-side{grid-column:1/-1;flex-direction:row;align-items:center}ol.r1-steps.rm span{font-size:11px}}
@media (max-width:720px){.mvside,.mvside:last-child{flex-direction:column;text-align:center}.evrow{grid-template-columns:1fr}.evr-n{flex-direction:row}}
@media (prefers-reduced-motion:reduce){.evrow{transform:none}}

/* ---------- facelift: motion (tabs glide, parts slide in) ---------- */
/* One marker per tab bar glides to the picked tab. fx.js places it; each tab's own underline steps aside. */
.subnav.has-ink{position:relative}
.ink{position:absolute;left:0;top:0;width:var(--iw,0);height:var(--ih,0);transform:translate3d(var(--ix,0),var(--iy,0),0);transform-origin:0 0;pointer-events:none;opacity:0;transition:opacity .15s}

.subnav.tabs>.ink{box-shadow:inset 0 -2px 0 var(--blue)}
.subnav.tabs>.ink:after{content:"";position:absolute;left:14%;right:14%;bottom:-2px;height:3px;background:var(--blue);filter:blur(5px);opacity:.7}
.subnav.tabs.has-ink a[aria-current="page"],.subnav.tabs.has-ink .ftab[aria-current]{box-shadow:none}
.subnav:not(.tabs)>.ink{border-radius:9px;background:var(--surface-2);box-shadow:inset 0 -2px 0 var(--red)}
.subnav:not(.tabs).has-ink>a{position:relative;z-index:1}
.subnav:not(.tabs).has-ink a[aria-current="page"]{background:none;box-shadow:none}
.jump>.ink{box-shadow:inset 0 -2px 0 var(--red)}
.jump.has-ink a[aria-current]{box-shadow:none}
.set-nav>.ink{border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--line-2);box-shadow:inset 3px 0 0 var(--red)}
.set-nav.has-ink>a{position:relative;z-index:1}
.set-nav.has-ink a[aria-current]{background:none;box-shadow:none;border-color:transparent}
@media (max-width:960px){.set-nav{position:relative;top:auto}}

/* A thin moving line under the top bar while a slow page loads. */
.site-top:after{content:"";position:absolute;left:0;width:35%;bottom:-1px;height:2px;background:linear-gradient(90deg,transparent,var(--red-ink),var(--blue),transparent);opacity:0;transition:opacity .15s;pointer-events:none}
html.busy .site-top:after{opacity:1;animation:r1busy 1.1s linear infinite}
@keyframes r1busy{from{transform:translate3d(-110%,0,0)}to{transform:translate3d(310%,0,0)}}

/* Page hand-over (View Transitions). The top bar holds still. Between tabs of one page the header and tab bar hold
   still too, the old content slides out the way you're going, and the new parts slide in (fx.js enter). */
.site-top{view-transition-name:top}
::view-transition-group(*){animation-duration:.42s;animation-timing-function:cubic-bezier(.22,.8,.24,1)}
::view-transition-old(top){display:none}
::view-transition-new(top){animation:none}
::view-transition-old(psub){display:none}
::view-transition-new(psub){animation:none}
::view-transition-old(pmain){animation:r1out .2s cubic-bezier(.4,0,1,1) both}
::view-transition-new(pmain){animation:r1inup .38s var(--ease) .08s both}






@keyframes r1out{to{opacity:0;transform:translateY(-10px)}}
@keyframes r1outl{to{opacity:0;transform:translateX(-64px)}}
@keyframes r1outr{to{opacity:0;transform:translateX(64px)}}
@keyframes r1fade{to{opacity:0}}
@keyframes r1inup{from{opacity:0;transform:translateY(12px)}}
@keyframes r1inr{from{opacity:0;transform:translateX(56px)}}
@keyframes r1inl{from{opacity:0;transform:translateX(-56px)}}

/* Things that open inside a page ease in instead of popping. */
details.just-open>:not(summary),.sx-form{animation:r1pop .32s var(--ease) both}
@keyframes r1pop{from{opacity:0;translate:0 -8px}}
@media (prefers-reduced-motion:reduce){.ink{transition:none}html.busy .site-top:after{animation:none}details.just-open>:not(summary),.sx-form{animation:none}}


/* ---------- facelift: rankings and ratings (phase 6) ---------- */
.rank-head{align-items:stretch}
.calbox{flex:none;width:360px;padding:16px 18px;border:1px solid rgba(100,149,255,.35);border-radius:var(--r);background:linear-gradient(160deg,rgba(100,149,255,.12),rgba(100,149,255,.02) 60%),var(--surface);box-shadow:0 14px 34px rgba(0,0,0,.35)}
.calbox-h{display:flex;align-items:center;gap:8px;margin:0 0 4px}
.calbox-h .i{width:18px;height:18px;color:var(--blue)}
.calbox .small{margin:0 0 12px}
.calbox-n{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.calbox-n li{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2)}
.calbox-n .nb{font-size:18px;padding:2px 9px}
.calbox-n span{font-size:12px;color:var(--ink-2);line-height:1.3}
.subnav.tabs a .i{width:16px;height:16px;margin-right:7px;vertical-align:-3px;opacity:.8}
.subnav.tabs a[aria-current] .i{opacity:1;color:var(--blue)}
.panel.flush{padding:0;overflow:hidden}
.panel.flush .tablewrap{margin:0;border:0;border-radius:0}
.rk-table thead th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:var(--surface-2)}
.rk-table tbody tr{transition:background-color .15s}
.rk-table tbody tr:not(.grp):hover{background:rgba(255,255,255,.03)}
table.ranks.rk-table tr.grp th{opacity:1;padding:12px 16px 10px;background:linear-gradient(90deg,rgba(248,49,62,.10),transparent 55%);border-top:1px solid var(--line)}




.nb.cls{min-width:2.6em;text-align:center;font-family:var(--display)}
.trend{font-size:13px}
.trend.up{color:var(--good)}
.trend.down{color:var(--red-ink)}

.vnote.warn .i{color:var(--warn)}
.vnote.warn{margin:6px 0 14px;font-size:13.5px;color:var(--ink-2);align-items:flex-start}
/* The four-step flow (How ratings work, Player Rating in calibration) */
.rflow{list-style:none;margin:0 0 18px;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px}
.rflow li{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);box-shadow:0 10px 26px rgba(0,0,0,.3)}
.rflow li .i{width:24px;height:24px;color:var(--red-ink)}
.rflow li b{font-family:var(--display);font-size:15px}
.rflow li span{font-size:13px;color:var(--ink-2);line-height:1.4}
.rflow li+li:before{content:"›";position:absolute;left:-20px;top:50%;transform:translateY(-50%);font-size:22px;color:var(--muted)}
.rflow.big li{padding:20px 18px;align-items:center;text-align:center;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent),var(--surface)}
.rflow.big li .i{width:30px;height:30px}
.calwait .rflow{margin:12px 0}

.formula{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px;padding:10px 14px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--surface-2);font-size:1.02rem}
.formula b{padding:1px 7px;border:1px solid rgba(100,149,255,.45);border-radius:5px;background:var(--blue-bg);color:var(--blue-hi);font-weight:600}
.fgrid{list-style:none;margin:12px 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.fgrid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.fgrid li{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2)}
.fgrid h3{font-size:14.5px;margin:2px 0 4px}
.fgrid p{margin:0;font-size:13.5px;color:var(--ink-2);line-height:1.45}
.nb.fk{flex:none;min-width:2em;text-align:center;font-family:var(--display);color:var(--blue-hi);border-color:rgba(100,149,255,.45)}









.gates{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.gates li{display:flex;gap:14px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2)}
.gates li span{font-size:14px;line-height:1.45}



[data-theme="light"] .rflow li,[data-theme="light"] .calbox{box-shadow:0 1px 3px rgba(0,0,0,.08)}
[data-theme="light"] .rk-table tbody tr:not(.grp):hover{background:rgba(0,0,0,.03)}
@media (max-width:1100px){.calbox{width:300px}.rflow{grid-template-columns:repeat(2,minmax(0,1fr))}.rflow li+li:before{display:none}}
@media (max-width:960px){.calbox{width:100%}.fgrid.two{grid-template-columns:1fr}}

/* ---------- facelift: organizer, staff, owner, legal (phase 7) ---------- */





.subnav.tabs .nb.zero{opacity:.5}















.kcol.st-bad{border-top-color:var(--red-ink)}.kcol.st-warn{border-top-color:var(--warn)}.kcol.st-ok{border-top-color:var(--blue)}
.mcard{transition:transform .2s var(--ease),box-shadow .2s,border-color .2s}
.mcard:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.35);border-color:var(--line-2)}
/* Setup: progress ring and numbered steps */

.ring{--p:0;flex:none;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:conic-gradient(var(--blue) calc(var(--p)*1%),var(--surface-2) 0);position:relative}
.ring:before{content:"";position:absolute;inset:6px;border-radius:50%;background:var(--surface)}
.ring b{position:relative;font-family:var(--display);font-size:14px}







/* Staff: every queue at a glance */





/* Owner Console */
.ow-stats{margin:0 0 16px}
.ow-set .set-nav a{gap:10px}
.ow-set .set-nav a span{display:flex;align-items:center;gap:6px;flex:1}
.ow-set .set-nav .nb{margin-left:auto;font-size:11.5px;padding:0 6px}
/* Policies */
.set-h{margin:4px 12px 6px;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}







[data-theme="light"] .qtiles a:hover,[data-theme="light"] .ozalerts li a:hover,[data-theme="light"] .mcard:hover{box-shadow:0 6px 16px rgba(0,0,0,.1)}
@media (prefers-reduced-motion:reduce){.qtiles a,.ozalerts li a,.mcard{transition:none;transform:none!important}}
@media (max-width:960px){.oz-needs li{grid-template-columns:36px minmax(0,1fr)}.oz-needs li>.btn{grid-column:2;justify-self:start}}

/* facelift: bracket looks, groups editor, look studio, banners (Oct 2026) */
.bk-wrap{margin:18px 0 0}
.bk-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:space-between;margin-bottom:12px}
.bk-views{display:flex;align-items:center;gap:6px;min-width:0;flex:1}
.bk-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px;min-width:0}
.bk-tabs::-webkit-scrollbar{display:none}
.bk-tab{flex:none;border:1px solid var(--line-2);background:var(--surface);color:var(--ink-2);font:600 13px/1 var(--body);padding:9px 14px;border-radius:999px;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s,transform .2s}
.bk-tab:hover{border-color:var(--ink-2);color:var(--ink)}
.bk-tab[aria-selected="true"]{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 6px 18px rgba(197,1,2,.35)}
.bk-arrow{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);cursor:pointer}
.bk-arrow:disabled{opacity:.35;cursor:default}
.bk-arrow:not(:disabled):hover{border-color:var(--ink-2)}
.bk-dl{position:relative}
.bk-dl summary{list-style:none;cursor:pointer}
.bk-dl summary::-webkit-details-marker{display:none}
.bk-dlmenu{position:absolute;right:0;top:calc(100% + 6px);z-index:30;display:grid;gap:6px;width:250px;padding:12px;border:1px solid var(--line-2);border-radius:12px;background:var(--surface-2);box-shadow:0 18px 40px rgba(0,0,0,.5)}
.bk-dlmenu .btn{justify-content:flex-start}
.bk-stage{border-radius:14px;overflow:hidden;border:1px solid var(--line-2);box-shadow:0 22px 50px rgba(0,0,0,.45)}
.bk-frame{position:relative;isolation:isolate;padding:clamp(18px,3vw,34px);background:var(--bk-bg);color:var(--bk-text);min-height:260px}
.bk-bgl{position:absolute;inset:0;z-index:-2;overflow:hidden}
.bk-bgm{position:absolute;inset:-2%;width:104%;height:104%;object-fit:cover;filter:blur(var(--bk-blur))}
.bk-dark{position:absolute;inset:0;background:var(--bk-base,#000);opacity:var(--bk-dark)}
.bk-flogo{position:absolute;inset:0;z-index:-1;display:grid;place-items:center;pointer-events:none;opacity:var(--bk-lop)}
.bk-flogo>*{width:var(--bk-lsz);max-height:var(--bk-lsz);aspect-ratio:1;object-fit:contain}
.bk-head{margin:0 0 18px;max-width:calc(100% - var(--bk-csz) * 1vw - 40px)}
.bk-title{font-family:var(--bk-hf),var(--display);font-weight:var(--bk-hw);font-style:var(--bk-hi);text-decoration:var(--bk-hu);text-transform:var(--bk-ht);font-size:clamp(24px,3.4vw,38px);color:var(--bk-text);text-underline-offset:6px}
.bk-title:after{content:'';display:block;width:56px;height:4px;margin-top:10px;border-radius:2px;background:var(--bk-accent)}
.bk-sub{margin-top:8px;font-family:var(--bk-bf),var(--body);font-weight:var(--bk-bw);font-style:var(--bk-bi);color:var(--bk-muted);font-size:15px}
.bk-corner{position:absolute;width:calc(var(--bk-csz) * 1%);min-width:48px;aspect-ratio:1;display:grid;place-items:center}
.bk-corner>*{width:100%;height:100%;object-fit:contain}
.bk-corner.tr{top:18px;right:18px}.bk-corner.tl{top:18px;left:18px}.bk-corner.br{bottom:18px;right:18px}.bk-corner.bl{bottom:18px;left:18px}
.bk-corner.tl~.bk-head,.bk-frame:has(.bk-corner.tl) .bk-head{margin-left:calc(var(--bk-csz) * 1% + 24px)}
.bk-scene{overflow-x:auto;overflow-y:hidden;padding-bottom:4px;scrollbar-width:thin}
.bk-svg{display:block;width:100%;height:auto;margin:0 auto}
.bk-svg .bk-m{cursor:pointer;transition:opacity .2s}
.bk-svg .bk-m:hover>rect:first-child,.bk-svg .bk-m:focus>rect:first-child{stroke:var(--bk-hi);stroke-width:2}
.bk-svg.bk-hover .bk-m:not(.bk-on),.bk-svg.bk-hover .bk-row:not(.bk-on){opacity:.32}
.bk-svg .bk-row,.bk-svg [data-team]{transition:opacity .2s}
.bk-svg .bk-me text{fill:var(--bk-hi)}
.bk-sponsor{display:flex;align-items:center;gap:12px;margin-top:18px;color:var(--bk-muted);font:700 11px/1.2 var(--bk-bf),var(--body);letter-spacing:.08em;text-transform:uppercase}
.bk-sponsor>img,.bk-sponsor>video{height:44px;max-width:180px;object-fit:contain}
.bk-sponsor.bc,.bk-sponsor.tc{justify-content:center}.bk-sponsor.br{justify-content:flex-end}
.bk-sponsor.tc{position:absolute;top:12px;left:0;right:0;margin:0}
/* event, team, player and org banners */
.hbnr{position:relative;margin:28px 0 0;height:clamp(130px,20vw,250px);border-radius:14px;overflow:hidden;border:1px solid var(--line-2);background:var(--surface)}
.hbnr>img,.hbnr>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hbnr:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(9,10,12,.85))}
.idcard.on-bnr{margin-top:-70px;margin-left:18px;margin-right:18px;background:linear-gradient(180deg,rgba(26,29,35,.88),rgba(19,21,25,.94));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.bnr-ed{display:grid;gap:10px}
.bnr-prev{height:120px;border-radius:10px;overflow:hidden;border:1px dashed var(--line-2);display:grid;place-items:center;background:var(--surface)}
.bnr-prev>img,.bnr-prev>video{width:100%;height:100%;object-fit:cover}
.bnr-prev .muted{display:flex;align-items:center;gap:6px}
/* the groups editor */






















body.gdrag-on,body.gdrag-on *{cursor:grabbing!important;user-select:none}




/* the look studio */
.st-grid{display:grid;grid-template-columns:minmax(300px,380px) 1fr;gap:20px;align-items:start;margin-top:18px}
.st-ctl{display:grid;gap:10px}







.themes{display:grid;grid-template-columns:repeat(auto-fill,minmax(98px,1fr));gap:8px;margin-top:10px}
.theme{display:grid;gap:6px;padding:6px;border:1px solid var(--line-2);border-radius:10px;background:var(--bg-2);color:var(--ink-2);font-size:12px;cursor:pointer;text-align:left;transition:border-color .2s,transform .2s}
.theme:hover{transform:translateY(-2px);border-color:var(--ink-2)}
.theme.on{border-color:var(--h);box-shadow:0 0 0 2px var(--h)}
.theme .sw{height:40px;border-radius:7px;background:linear-gradient(135deg,var(--b1),var(--b2));position:relative;overflow:hidden}
.theme .sw:before{content:'';position:absolute;left:8px;top:9px;width:42%;height:8px;border-radius:3px;background:var(--a)}
.theme .sw:after{content:'';position:absolute;left:8px;top:22px;width:28%;height:6px;border-radius:3px;background:var(--h)}
.colors{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.color{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-2)}
.color input{width:36px;height:30px;padding:0;border:1px solid var(--line-2);border-radius:7px;background:none;cursor:pointer}

.shows{display:grid;gap:8px;margin-top:6px}
.stpic{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:center;margin-top:12px}



.stpic .row{margin-top:6px}
.st-prev{position:sticky;top:86px;display:grid;gap:10px}
.st-save{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.st-prev .bk-wrap{margin:0}
input[type=range]{width:100%;accent-color:var(--red)}
@media (max-width:980px){.st-grid{grid-template-columns:1fr}.st-prev{position:static;order:-1}}
@media (prefers-reduced-motion:reduce){.gcard,.theme,.bk-tab{transition:none}}

/* Ubisoft map art on map ban tiles and match cards (Oct 2026) */




.mthumb{width:48px;height:27px;object-fit:cover;border-radius:5px;vertical-align:middle;margin-right:8px;border:1px solid var(--line-2)}


/* Home Recent results: centered glass cards, each team logo large and faint behind its name */
















@media (prefers-reduced-motion:reduce){.rescard{transition:none}.rescard:hover{transform:none}}
.f.ozfile .row{gap:8px;align-items:center}
.ozx{gap:8px;align-items:center;margin-bottom:8px;flex-wrap:nowrap}
.ozx select{flex:0 0 130px}
.ozx input{flex:1 1 auto;min-width:0}
#ozSplit{margin-top:6px}
.acct .av{overflow:hidden}.acct .av img{width:100%;height:100%;object-fit:cover;display:block}
[data-theme="light"] .rc-t b{text-shadow:none}

/* Map background in both themes (light uses its own paper map), and the Round One logo adapts to the theme
   instead of sitting on a dark tile in light mode. */
body:before{background-image:url(/map-bg-dark.webp)}
[data-theme="light"] body:before{display:block;background:#f5f6f8 url(/map-bg-light.webp) center/cover no-repeat}
[data-theme="light"] .brand img,[data-theme="light"] .foot-brand img,[data-theme="light"] .hero-logo,[data-theme="light"] .empty > img,[data-theme="light"] .cast-brand img{background:none;padding:0;border-radius:0;filter:saturate(1.1) brightness(.86)}

/* Theme switch: the new theme falls down the page with a soft edge, like a waterfall (app.js toggleTheme). */



@keyframes r1fall{from{-webkit-mask-position:0 100%;mask-position:0 100%}to{-webkit-mask-position:0 0;mask-position:0 0}}

/* Landing video: the red stripes stay; the video is solid on the right and fades out behind the stripes (along their slant)
   and toward the bottom, into the map background. No dark band under the hero. */



/* Large background surfaces stay still; continuously moving UI uses transforms. */
.site-top{background:rgba(9,10,12,.97);-webkit-backdrop-filter:none;backdrop-filter:none;transition:background-color .15s}
[data-theme="light"] .site-top{background:rgba(248,249,251,.98)}
.jump{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none}
.idcard.on-bnr,.rescard{-webkit-backdrop-filter:none;backdrop-filter:none}
.teams a,.tlist a,.mcard>a,.tile,.evc,.evrow{transition:transform .22s var(--ease),border-color .15s,background-color .15s}

.teams a:after,.tlist a:after,.tile:after{transition:transform .2s var(--ease),border-color .15s}
.teams a:hover:after,.tlist a:hover:after,.tile:hover:after{right:14px;transform:translate(3px,-50%) rotate(45deg)}
.ranks td.num,.ranks td.rk{font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){.sx-form{animation:none}}
:root{--replay-progress-height:12px}
.replay-progress{display:grid;gap:.6rem;margin:1rem 0;padding:1rem;border:1px solid var(--line,#35383e);border-radius:12px;background:var(--surface-2,#16191e);color:var(--ink,#fff)}
.replay-progress progress{display:block;width:100%;height:var(--replay-progress-height);border:0;border-radius:8px;overflow:hidden;accent-color:var(--accent,#ee5757)}
.replay-progress progress::-webkit-progress-bar{background:#6663;border-radius:8px}
.replay-progress progress::-webkit-progress-value{background:var(--accent,#ee5757);border-radius:8px}
.replay-progress progress::-moz-progress-bar{background:var(--accent,#ee5757);border-radius:8px}
.replay-progress[data-stage=complete] progress{accent-color:#45bd8d}
.replay-progress-track{height:var(--replay-progress-height);overflow:hidden;border-radius:8px;background:#6663}
.replay-progress-track span{display:block;width:100%;height:100%;background:var(--accent,#ee5757);transform-origin:left;transition:transform 150ms linear}
.replay-progress[data-stage=complete] .replay-progress-track span{background:#45bd8d}
@media(prefers-reduced-motion:reduce){.replay-progress-track span{transition:none}}
}

/* ======================================================================================================
   Round One design layer (wave 4, track F2, 21 Oct 2026). Unlayered, so it wins over every rule in
   @layer legacy above whatever the specificity. Sources: wave1 shared-components.md, Public Site v7,
   Member Area v8, Public Pages v2. Area page styles go in css/r1-<area>.css, never here.

   Selector rewrite rules (every track follows them in its area file):
   - Mockup `X` becomes `:where(.r1v,.r1s) X` (no added specificity, so the mockup's own order and
     specificity carry over). .r1v wraps a ported view; .r1s marks a shell part the app paints.
   - Mockup `body.pub X` becomes `body[data-shell=pub] :where(.r1v,.r1s) X`; `body.navopen X` becomes
     `body.navopen :where(.r1v,.r1s) X` (the drawer state lives on body).
   - An element that carries .r1s itself (the top bar, rail, top row, footer, drawers, select menu,
     stream dock, backdrop) is matched as `:where(.r1s).bar`, `footer:where(.r1s)` and so on.
   - Mockup `:root{...}` values are tokens (section 1); never set them on :root.
   - Never copy .fake, .chrome, .mk-*, .sloader, or anything from shared-components section 10.
   ====================================================================================================== */
/* ---- 1. Tokens. shared-components 1.1 verbatim on .r1v,.r1s (never :root: live --blue is cyan in the old CSS). ---- */
/* Round One tokens. Section 1.1 gives the source of every value. */
.r1v,.r1s{
  --bg:#08090B;--rail:#0D0F13;
  --s1:#13161B;--s1b:#171B21;--s2:#1B1F26;--s3:#232831;--s4:#2D333E;
  --well:#0F1216;--quiet:var(--s3);
  --ink:#F5F6F8;--ink2:#CDD2DA;--mute:#A0A8B5;--ph:#949CAA;--on-fill:#0A0B0D;
  --red:#F8313E;--redt:#FF5A66;--redi:#FF9AA2;--redlo:#B91F2A;
  --cy:#22D3EE;--cyhi:#67E8F9;--cyi:#A5F3FC;--cylo:#0891B2;
  --blue:#3A7FFF;--bluei:#9FBEFF;
  --green:#3DDC84;--greeni:#8DEDB9;
  --amber:#FFC23D;--amberi:#FFDB8A;
  --pink:#FF4DA6;--pinki:#FF86C2;
  --tb:#3277FE;
  --hl:inset 0 1px 0 rgba(255,255,255,.06);
  --edge:0 0 0 1px rgba(255,255,255,.045);
  --lift:0 1px 2px rgba(0,0,0,.4),0 18px 40px -18px rgba(0,0,0,.75);
  --e:cubic-bezier(.22,1,.36,1);--spring:cubic-bezier(.34,1.56,.64,1);
  --disp:'Chakra Petch',system-ui,sans-serif;
  --text:'Geist',system-ui,sans-serif;
  --mono:'Geist Mono',ui-monospace,'Cascadia Mono',Consolas,monospace;
  /* the shell backdrop (img/bg/IMAGE-SOURCES.md) and the public page width and gutter (Public Site v7 L16) */
  --bgimg:url(/img/bg/backdrop-texture.webp);--gut:clamp(16px,4vw,48px);--max:1240px;
  /* aliases, so older rules in each file keep working */
  --cyan:var(--cy);--data:var(--cy);--datai:var(--cyi);--loss:var(--pink);--accent:var(--red);--red2:var(--red);
}
/* Public shell: its own surface steps (Public v6 line 11); the quiet button sits one step above its panels. */
body[data-shell=pub] :where(.r1v,.r1s){--s2:#1A1E25;--s3:#242A33;--quiet:var(--s2)}
/* ---- 2. Isolation reset ---- */
/* revert in an unlayered rule rolls back past every author layer, so a ported view starts from the mockup's
   blank page and old rules cannot leak in. SVG children, images, video, canvas and iframes are left out on
   purpose: their width, height, cx, r, d and fill attributes are author-level presentational hints that
   revert would wipe (tested in Edge 21 Oct: circles drew with r 0 and black fill). Pseudo-elements are reset
   too, because old rules such as .tile:after and .sw:before draw content on class names the mockups reuse. */
:where(.r1v,.r1s) :where(:not(svg *,img,video,canvas,iframe)){all:revert}
:where(.r1v,.r1s) :where(:not(svg *))::before,:where(.r1v,.r1s) :where(:not(svg *))::after{all:revert}
:where(.r1v,.r1s){color:var(--ink);font-family:var(--text);font-size:.9375rem;line-height:1.5;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
body[data-shell=pub] :where(.r1v,.r1s){font-size:1rem}

/* ---- 3. Base type. Member Area v8 L18-38 and Public Site v7 L18-26: the element rules both shells share. ---- */
:where(.r1v,.r1s) *{box-sizing:border-box}
:where(.r1v,.r1s) :is(h1,h2,h3){font-family:var(--disp);font-weight:600;margin:0;line-height:1.1;letter-spacing:-.01em}
body[data-shell=pub] :where(.r1v,.r1s) :is(h1,h2,h3){font-weight:700;line-height:1.02;text-wrap:balance}
:where(.r1v,.r1s) p{margin:0}
body[data-shell=pub] :where(.r1v,.r1s) p{text-wrap:pretty}
:where(.r1v,.r1s) a{color:var(--ink)}
body[data-shell=pub] :where(.r1v,.r1s) a{color:inherit}
:where(.r1v,.r1s) button{font:inherit}
body[data-shell=pub] :where(.r1v,.r1s) img{display:block;max-width:100%}
:where(.r1v,.r1s) .i{width:18px;height:18px;flex:none;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
:where(.r1v,.r1s) .disp{font-family:var(--disp)}
:where(.r1v,.r1s) .num{font-variant-numeric:tabular-nums}
:where(.r1v,.r1s) .wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
:where(.r1v,.r1s) .sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* ---- 4. Shared components. shared-components sections 2, 3.1, 4.1, 5.1, 6.1, 7.1, 8.1, 9.1, 12.1, 13.1, 14, 15, 16, 17 and 21 (Round One blocks). ---- */
/* -- 2. Focus rings and keyboard rules -- */
/* Focus and keyboard (Round One). Member v7 32, 75, 427 and 639; TradeBack v6 659. */
:where(.r1v,.r1s) :focus-visible{outline:2px solid var(--cy);outline-offset:2px}
/* the doubled pseudo-class (0,2,0) beats `all:unset` and `outline:none` resets such as .tabs2 button and .tsearch input
   (0,1,1), so every control keeps a ring (24 Oct 2026); a component's own :focus-visible rule still wins */
:where(.r1v,.r1s) :focus-visible:focus-visible{outline:2px solid var(--cy);outline-offset:2px}
:where(.r1v,.r1s) :focus:not(:focus-visible){outline:none}
:where(.r1v,.r1s) .vh{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
/* On touch screens the small controls grow to the default 40 px control height. */
@media (pointer:coarse){:where(.r1v,.r1s) .btn.sm,:where(.r1v,.r1s) .xsel.xs-sm .xs-b,:where(.r1v,.r1s) .seg.sm button{min-height:2.5rem}}
@media (prefers-reduced-motion:reduce){:where(.r1v,.r1s) *,:where(.r1v,.r1s) *::before,:where(.r1v,.r1s) *::after{animation-duration:1ms!important;animation-iteration-count:1!important;animation-delay:0ms!important;transition-duration:1ms!important;scroll-behavior:auto!important}}
/* and everything outside the scope roots (toasts, the hold overlay, dialogs on body, view transitions); hold-to-confirm
   times its 1.5 s press with a timer, so it still needs the full hold (24 Oct 2026) */
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;animation-delay:0ms!important;transition-duration:1ms!important;scroll-behavior:auto!important}::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}
/* -- 3.1 Buttons -- */
/* Buttons (Round One). Sources in section 3.1. */
:where(.r1v,.r1s) .btn,:where(.r1v,.r1s) :is(a,button).nb,:where(.r1v,.r1s) :is(a,button).qb{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;height:40px;padding:0 1rem;border:0;border-radius:11px;font-family:var(--text);font-size:.875rem;font-weight:600;line-height:1;white-space:nowrap;color:var(--ink);text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .18s ease,box-shadow .16s var(--e),transform .14s var(--e),color .18s ease}
:where(.r1v,.r1s) .btn .i,:where(.r1v,.r1s) :is(a,button).nb .i,:where(.r1v,.r1s) :is(a,button).qb .i{width:16px;height:16px;flex:none}
:where(.r1v,.r1s) .btn.ghost{background:transparent;color:var(--ink2);padding:0 .625rem}
:where(.r1v,.r1s) .btn.ghost:hover{color:var(--ink);background:var(--Lf-ffffff0d,rgba(255,255,255,.05))}
:where(.r1v,.r1s) .btn.sm{height:34px;padding:0 1em;font-size:.8125rem;border-radius:10px}
:where(.r1v,.r1s) .btn.lg{height:48px;padding:0 1.375rem;font-size:.9375rem;border-radius:13px}
/* public marketing size (Public v6 50-57 and 764-769); scoped to a and button because Owner v3 and Staff v2 use .nb for count badges */
:where(.r1v,.r1s) :is(a,button).nb,:where(.r1v,.r1s) :is(a,button).qb{height:50px;padding:0 1.375rem;border-radius:4px;font:700 1.0625rem/1 var(--disp);letter-spacing:.02em}
:where(.r1v,.r1s) :is(a,button).nb.sm,:where(.r1v,.r1s) :is(a,button).qb.sm{height:42px;padding:0 1rem;font-size:.9375rem}
:where(.r1v,.r1s) :is(a,button).qb{padding:0 1.25em;font-weight:600;font-size:1rem}
:where(.r1v,.r1s) :is(a,button).qb.sm{padding:0 1rem}
/* the red primary keeps its dark text (G2) over the shared button colour (24 Oct 2026, contrast 5.2:1) */
body :where(.r1v,.r1s) :is(a,button).nb{color:var(--on-fill)}

/* Primary: red neo brutal, dark text, white edge and offset. One per view region (G2). */
:where(.r1v,.r1s) .btn.pri{background:var(--red);color:var(--on-fill);font-weight:700;border-radius:6px;box-shadow:inset 0 0 0 2px var(--ink),4px 4px 0 var(--ink)}
:where(.r1v,.r1s) .btn.pri:hover{transform:translate(-1px,-1px);box-shadow:inset 0 0 0 2px var(--ink),5px 5px 0 var(--ink)}
:where(.r1v,.r1s) .btn.pri:active{transform:translate(4px,4px);box-shadow:inset 0 0 0 2px var(--ink),0 0 0 var(--ink)}
:where(.r1v,.r1s) .btn.pri.sm{box-shadow:inset 0 0 0 2px var(--ink),3px 3px 0 var(--ink)}
:where(.r1v,.r1s) .btn.pri.sm:active{transform:translate(3px,3px);box-shadow:inset 0 0 0 2px var(--ink),0 0 0 var(--ink)}
:where(.r1v,.r1s) :is(a,button).nb{background:var(--red);color:var(--on-fill);border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
:where(.r1v,.r1s) :is(a,button).nb:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}
:where(.r1v,.r1s) :is(a,button).nb:active{transform:translate(5px,5px);box-shadow:0 0 0 var(--ink)}
:where(.r1v,.r1s) :is(a,button).nb.sm{box-shadow:4px 4px 0 var(--ink)}
:where(.r1v,.r1s) :is(a,button).nb.sm:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--ink)}
/* TradeBack's own button on Round One pages stays blue (P10, Public v6 835) */
:where(.r1v,.r1s) :is(a,button).nb.tbbtn,:where(.r1v,.r1s) .btn.pri.tbbtn{background:var(--tb)}

/* Quiet secondary: panel one tone up, 8% edge, white text; red edge and a 2 px red offset on hover (G2). */
:where(.r1v,.r1s) .btn.sec{background:var(--quiet);color:var(--ink);border-radius:8px;box-shadow:inset 0 0 0 1px var(--Ls-ffffff14,rgba(255,255,255,.08))}
:where(.r1v,.r1s) .btn.sec:hover{box-shadow:inset 0 0 0 1px var(--red),2px 2px 0 var(--red);transform:translate(-1px,-1px)}
:where(.r1v,.r1s) .btn.sec:active{transform:translate(1px,1px);box-shadow:inset 0 0 0 1px var(--red),0 0 0 var(--red)}
/* the public quiet button draws its edge as a real border, as Public v6 764-767 does */
:where(.r1v,.r1s) :is(a,button).qb{background:var(--quiet);color:var(--ink);border:1px solid var(--Ll-ffffff14,rgba(255,255,255,.08))}
:where(.r1v,.r1s) :is(a,button).qb:hover{border-color:var(--red);box-shadow:2px 2px 0 var(--red);transform:translate(-1px,-1px)}
:where(.r1v,.r1s) :is(a,button).qb:active{transform:none;box-shadow:0 0 0 var(--red)}

/* Destructive: pink outline (Reject, Decline, Delete, Remove, Unban, Ban). */
:where(.r1v,.r1s) .btn.bad,:where(.r1v,.r1s) .btn.del,:where(.r1v,.r1s) .btn.dz{background:transparent;color:var(--t-pink,var(--pink));border-radius:8px;box-shadow:inset 0 0 0 1px var(--pink)}
:where(.r1v,.r1s) .btn.bad:hover,:where(.r1v,.r1s) .btn.del:hover,:where(.r1v,.r1s) .btn.dz:hover{background:var(--Lf-ff4da61a,rgba(255,77,166,.1));color:var(--pinki)}
:where(.r1v,.r1s) .btn.bad:active,:where(.r1v,.r1s) .btn.del:active,:where(.r1v,.r1s) .btn.dz:active{transform:scale(.97)}

/* Staff rule buttons (Rule, Confirm, Approve, Verify): outline first, full red with the white offset on hover (S7). */
:where(.r1v,.r1s) .btn.rule{background:transparent;color:var(--redt);font-weight:700;border-radius:6px;box-shadow:inset 0 0 0 2px var(--red)}
:where(.r1v,.r1s) .btn.rule:hover,:where(.r1v,.r1s) .btn.rule:focus-visible{background:var(--red);color:var(--on-fill);box-shadow:inset 0 0 0 2px var(--ink),3px 3px 0 var(--ink);transform:translate(-1px,-1px)}
:where(.r1v,.r1s) .btn.rule:active{transform:translate(2px,2px);box-shadow:inset 0 0 0 2px var(--ink),0 0 0 var(--ink)}

/* Icon button, 44 px (Member v7 67-68). Always has an aria-label. */
:where(.r1v,.r1s) .iconbtn{width:44px;height:44px;flex:none;border:0;border-radius:12px;background:var(--Lf-1b1f26d9,rgba(27,31,38,.85));box-shadow:var(--hl),var(--edge);color:var(--ink2);display:grid;place-items:center;position:relative;cursor:pointer;transition:background-color .18s ease,color .18s ease,transform .14s var(--e)}
:where(.r1v,.r1s) .iconbtn:hover{background:var(--s3);color:var(--ink)}
:where(.r1v,.r1s) .iconbtn:active{transform:scale(.96)}
:where(.r1v,.r1s) .iconbtn .i{width:18px;height:18px}
:where(.r1v,.r1s) .iconbtn.sm{width:34px;height:34px;border-radius:10px}
:where(.r1v,.r1s) .iconbtn.sm .i{width:16px;height:16px}

/* Disabled: every kind takes the Member v7 89 look, with no hover motion. */
:where(.r1v,.r1s) :is(.btn,:is(a,button).nb,:is(a,button).qb):is(:disabled,[aria-disabled="true"],.off),:where(.r1v,.r1s) :is(.btn,:is(a,button).nb,:is(a,button).qb):is(:disabled,[aria-disabled="true"],.off):is(:hover,:active,:focus-visible){background:var(--s2);color:var(--mute);box-shadow:none;transform:none;cursor:not-allowed;filter:none}
:where(.r1v,.r1s) :is(:is(a,button).nb,:is(a,button).qb):is(:disabled,[aria-disabled="true"],.off){border-color:var(--s3)}
:where(.r1v,.r1s) .iconbtn:disabled{color:var(--mute);background:var(--s2);cursor:not-allowed}

/* Busy: the label changes to the action in progress ("Saving"), a ring sits before it, width holds. */
:where(.r1v,.r1s) :is(.btn,:is(a,button).nb,:is(a,button).qb)[aria-busy="true"]{cursor:progress;pointer-events:none}
:where(.r1v,.r1s) :is(.btn,:is(a,button).nb,:is(a,button).qb)[aria-busy="true"]::before{content:"";width:14px;height:14px;flex:none;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:w1spin .7s linear infinite}
@keyframes w1spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){:where(.r1v,.r1s) :is(.btn,:is(a,button).nb,:is(a,button).qb)[aria-busy="true"]::before{animation:none;border-right-color:currentColor;opacity:.55}}
/* -- 4.1 Styled select (the open menu is placed on <body> with class r1s, so .xs-m is matched as a scope root) -- */
/* Styled select (Round One). Sources in section 4.1. */
:where(.r1v,.r1s) .fgrp{display:flex;flex-direction:column;gap:.4375rem;min-width:0}
:where(.r1v,.r1s) .fgrp>label,:where(.r1v,.r1s) .fgrp>.flab{font:600 .6875rem/1.2 var(--disp);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
:where(.r1v,.r1s) .fgrp>label .optl{margin-left:.375rem;font:500 .75rem/1 var(--text);letter-spacing:0;text-transform:none;color:var(--mute)}
:where(.r1v,.r1s) .xsel{position:relative;display:block;width:100%;min-width:0}
:where(.r1v,.r1s) .xsel.w220{width:13.75rem;flex:none}
:where(.r1v,.r1s) .xs-n{position:absolute!important;left:0;bottom:0;width:1px!important;height:1px!important;padding:0!important;margin:0!important;border:0!important;opacity:0;pointer-events:none}
:where(.r1v,.r1s) .xs-b{width:100%;height:40px;display:flex;align-items:center;gap:.625rem;padding:0 .75rem 0 .875rem;border:0;border-radius:10px;background:var(--well);color:var(--ink);font:500 .84375rem/1.2 var(--text);letter-spacing:0;text-transform:none;text-align:left;cursor:pointer;box-shadow:inset 0 1px 0 var(--Ls-ffffff12,rgba(255,255,255,.07)),inset 0 -1px 0 var(--Ls-00000099,rgba(0,0,0,.6)),0 0 0 1px var(--Ls-ffffff0b,rgba(255,255,255,.045));transition:box-shadow .18s ease,background-color .18s ease}
:where(.r1v,.r1s) .xs-b:hover{background:var(--Lf-12161b,#12161B);box-shadow:inset 0 1px 0 var(--Ls-ffffff17,rgba(255,255,255,.09)),inset 0 -1px 0 var(--Ls-00000099,rgba(0,0,0,.6)),0 0 0 1px var(--Ls-ffffff17,rgba(255,255,255,.09))}
:where(.r1v,.r1s) .xsel.open .xs-b{box-shadow:inset 0 1px 0 var(--Ls-ffffff17,rgba(255,255,255,.09)),inset 0 -1px 0 var(--Ls-00000099,rgba(0,0,0,.6)),0 0 0 1px var(--Ls-22d3ee99,rgba(34,211,238,.6))}
:where(.r1v,.r1s) .xs-v{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:where(.r1v,.r1s) .xs-c{width:16px;height:16px;flex:none;color:var(--ink2);transition:transform .22s var(--e)}
:where(.r1v,.r1s) .xsel.open .xs-c{transform:rotate(180deg)}
:where(.r1v,.r1s) .xsel.xs-sm .xs-b{height:34px;font-size:.8125rem;padding:0 .625rem 0 .75rem}
/* combo: type to filter (TradeBack v6 705-711) */
:where(.r1v,.r1s) .xsel.combo .xs-b{cursor:text}
:where(.r1v,.r1s) .xs-i{flex:1;min-width:0;height:100%;padding:0;background:none;border:0;outline:0;color:var(--ink);font:inherit}
:where(.r1v,.r1s) .xs-i::placeholder{color:var(--ph);opacity:1}
:where(.r1v,.r1s) .xsel.combo .xs-c{cursor:pointer}
/* states */
:where(.r1v,.r1s) .xsel.err .xs-b{box-shadow:inset 0 1px 0 var(--Ls-ffffff12,rgba(255,255,255,.07)),inset 0 -1px 0 var(--Ls-00000099,rgba(0,0,0,.6)),0 0 0 1px var(--Ls-f8313eb3,rgba(248,49,62,.7))}
:where(.r1v,.r1s) .xsel.dis .xs-b,:where(.r1v,.r1s) .xs-b:disabled{background:var(--s2);color:var(--mute);cursor:not-allowed;box-shadow:none}
:where(.r1v,.r1s) .xsel.dis .xs-c{opacity:.5}
:where(.r1v,.r1s) .fgrp .ferr{color:var(--redi);font-size:.8125rem;margin:0}
:where(.r1v,.r1s) .fgrp .ferr:empty{display:none}
:where(.r1v,.r1s) .fgrp .hint{color:var(--mute);font-size:.78125rem;margin:0}
/* the open menu, placed on <body> */
:where(.r1s).xs-m{position:fixed;z-index:90;overflow:auto;padding:.375rem;border-radius:12px;max-width:calc(100vw - 16px);background:linear-gradient(180deg,var(--Lf-232831,#232831),var(--Lf-1b1f26,#1B1F26));box-shadow:inset 0 1px 0 var(--Ls-ffffff14,rgba(255,255,255,.08)),0 0 0 1px var(--Ls-22d3ee47,rgba(34,211,238,.28)),0 24px 50px -14px var(--Ls-000000d9,rgba(0,0,0,.85)),0 0 40px -18px var(--Ls-22d3ee73,rgba(34,211,238,.45));scrollbar-width:thin;animation:w1xsin .18s var(--e) both}
:where(.r1s).xs-m.xs-up{animation-name:w1xsup}
@keyframes w1xsin{from{opacity:0;transform:translateY(-4px)}}
@keyframes w1xsup{from{opacity:0;transform:translateY(4px)}}
:where(.r1v,.r1s) .xs-o{display:flex;align-items:center;gap:.75rem;height:40px;padding:0 .75rem;border-radius:8px;font:400 .84375rem/1.2 var(--text);color:var(--ink2);cursor:pointer;white-space:nowrap}
:where(.r1v,.r1s) .xs-o .xs-t{width:15px;height:15px;flex:none;margin-left:auto;color:var(--t-cy,var(--cy));opacity:0}
:where(.r1v,.r1s) .xs-o.act{background:var(--Lf-ffffff0f,rgba(255,255,255,.06));color:var(--ink)}
:where(.r1v,.r1s) .xs-o.sel{color:var(--ink);font-weight:500}
:where(.r1v,.r1s) .xs-o.sel .xs-t{opacity:1}
:where(.r1v,.r1s) .xs-o.dis{color:var(--mute);opacity:.5;cursor:not-allowed}
:where(.r1v,.r1s) .xs-none{margin:0;padding:.75rem .875rem;color:var(--mute);font-size:.8125rem}
/* public shell: a taller field to match its 16 px type (Public v6 859-860) */
body[data-shell=pub] :where(.r1v,.r1s) .xs-b{height:50px;padding:0 1rem;font-size:1rem}
body[data-shell=pub] :where(.r1v,.r1s) .xs-o{font-size:.9375rem}
/* -- 5.1 Checkbox and consent -- */
/* Checkbox and consent (Round One). Owner v3 1018-1024 (structure), Staff v2 1161-1165 (colours), Public v6 852 (hover), Member v7 878-885 (consent row). */
:where(.r1v,.r1s) .ck{position:relative;display:inline-flex;align-items:center;gap:.75rem;color:var(--ink);font-size:.875rem;line-height:1.35;cursor:pointer;-webkit-tap-highlight-color:transparent}
:where(.r1v,.r1s) .ck input{position:absolute;left:0;top:50%;width:20px;height:20px;margin:-10px 0 0;opacity:0;cursor:pointer}
:where(.r1v,.r1s) .ck .box{flex:none;width:20px;height:20px;padding:0;margin:0;border-radius:6px;background:var(--well);box-shadow:inset 0 1px 0 var(--Ls-00000099,rgba(0,0,0,.6)),inset 0 -1px 0 var(--Ls-ffffff0f,rgba(255,255,255,.06)),0 0 0 1px var(--Ls-ffffff1a,rgba(255,255,255,.1));display:grid;place-items:center;transition:background-color .16s ease,box-shadow .16s ease}
:where(.r1v,.r1s) .ck .box::after{content:"";width:5px;height:10px;margin-top:-2px;border-right:2.5px solid var(--on-fill);border-bottom:2.5px solid var(--on-fill);transform:rotate(45deg) scale(0);transition:transform .2s var(--e)}
:where(.r1v,.r1s) .ck:hover input:not(:checked):not(:disabled)+.box{box-shadow:inset 0 1px 0 var(--Ls-00000099,rgba(0,0,0,.6)),inset 0 -1px 0 var(--Ls-ffffff0f,rgba(255,255,255,.06)),0 0 0 1px var(--Ls-22d3ee99,rgba(34,211,238,.6))}
:where(.r1v,.r1s) .ck input:checked+.box{background:var(--cy);box-shadow:0 0 0 1px var(--Ls-22d3ee99,rgba(34,211,238,.6)),0 4px 12px -4px var(--Ls-22d3eeb3,rgba(34,211,238,.7))}
:where(.r1v,.r1s) .ck input:checked+.box::after{transform:rotate(45deg) scale(1)}
:where(.r1v,.r1s) .ck input:indeterminate+.box{background:var(--cy)}
:where(.r1v,.r1s) .ck input:indeterminate+.box::after{width:.625rem;height:0;margin:0;border-right:0;border-bottom:2.5px solid var(--on-fill);transform:none}
:where(.r1v,.r1s) .ck input:focus-visible+.box{outline:2px solid var(--cy);outline-offset:2px}
:where(.r1v,.r1s) .ck:has(input:disabled){color:var(--mute);cursor:not-allowed}
:where(.r1v,.r1s) .ck input:disabled{cursor:not-allowed}
:where(.r1v,.r1s) .ck input:disabled+.box{opacity:.45}
:where(.r1v,.r1s) .ck small{display:block;color:var(--mute);font-size:.78125rem;margin-top:.125rem}
:where(.r1v,.r1s) .ck b{display:block;font-weight:600}
:where(.r1v,.r1s) .ck a{color:var(--cyi);text-underline-offset:3px}
/* consent row: full width, box aligned to the first line, tile surface */
:where(.r1v,.r1s) .ck.consent{display:flex;align-items:flex-start;width:100%;padding:.875rem;margin-top:1rem;border-radius:12px;background:var(--s2);box-shadow:var(--hl),var(--edge)}
:where(.r1v,.r1s) .ck.consent input{left:.875rem;top:.9375rem;margin:0}
:where(.r1v,.r1s) .ck.consent .box{margin-top:0}
:where(.r1v,.r1s) .ck.consent.err{box-shadow:var(--hl),inset 0 0 0 1px var(--Ls-f8313eb3,rgba(248,49,62,.7))}
:where(.r1v,.r1s) .ck.consent.err .box{box-shadow:inset 0 1px 0 var(--Ls-00000099,rgba(0,0,0,.6)),0 0 0 1px var(--Ls-f8313ecc,rgba(248,49,62,.8))}
:where(.r1v,.r1s) .ck.consent+.ferr{color:var(--redi);font-size:.8125rem;margin:.375rem 0 0}
:where(.r1v,.r1s) .ck.consent+.ferr:empty{display:none}
body[data-shell=pub] :where(.r1v,.r1s) .ck{font-size:1rem}
body[data-shell=pub] :where(.r1v,.r1s) .ck.consent{border-radius:6px;background:var(--s1)}
/* -- 6.1 Segmented control -- */
/* Segmented control (Round One). Member v7 537-539 and 914-915, Owner v3 1042. */
:where(.r1v,.r1s) .seg{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem;border-radius:12px;background:var(--s2);box-shadow:var(--hl),var(--edge);max-width:100%;overflow-x:auto;scrollbar-width:none;flex:0 0 auto}
:where(.r1v,.r1s) .seg::-webkit-scrollbar{display:none}
:where(.r1v,.r1s) .seg button{height:36px;padding:0 1rem;border:0;border-radius:9px;background:transparent;color:var(--ink2);font:600 .84375rem/1 var(--text);display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap;cursor:pointer;transition:background-color .18s ease,color .18s ease,box-shadow .18s ease}
:where(.r1v,.r1s) .seg button:hover{color:var(--ink);background:var(--Lf-ffffff0a,rgba(255,255,255,.04))}
:where(.r1v,.r1s) .seg button[aria-pressed="true"]{background:linear-gradient(180deg,var(--Lf-22d3ee3d,rgba(34,211,238,.24)),var(--Lf-22d3ee21,rgba(34,211,238,.13)));color:var(--Lt-e6fbff,#E6FBFF);box-shadow:inset 0 0 0 1px var(--Ls-22d3ee8c,rgba(34,211,238,.55))}
:where(.r1v,.r1s) .seg button[aria-pressed="true"][data-v="out"]{background:var(--s4);color:var(--ink);box-shadow:none}
:where(.r1v,.r1s) .seg button:disabled{color:var(--mute);opacity:.5;cursor:not-allowed;background:transparent}
:where(.r1v,.r1s) .seg.sm button{height:32px;padding:0 .8125rem;font-size:.8125rem}
body[data-shell=pub] :where(.r1v,.r1s) .seg{border-radius:6px}
body[data-shell=pub] :where(.r1v,.r1s) .seg button{border-radius:4px;font-size:.875rem}
/* -- 7.1 Toggle switch -- */
/* Toggle switch (Round One). Member v7 464-470 and 572-575; Public v6 268-274 (large); Owner v3 944-947 (off tile). */
:where(.r1v,.r1s) button.sw{display:flex;align-items:center;gap:.875rem;width:100%;padding:.875rem;margin-top:.625rem;border:0;color:var(--ink);font:inherit;font-size:.875rem;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
/* the row surface comes from .tile (Member v7 97): <button class="sw tile"> */
:where(.r1v,.r1s) button.sw>span:not(.tog){flex:1;min-width:0}
:where(.r1v,.r1s) button.sw small{display:block;color:var(--mute);font-size:.78125rem;margin-top:.125rem}
:where(.r1v,.r1s) button.sw b{display:block;font-weight:600}
:where(.r1v,.r1s) .tog{position:relative;flex:none;width:44px;height:26px;border-radius:13px;background:var(--Lf-111418,#111418);box-shadow:inset 3px 3px 7px var(--Ls-050607,#050607),inset -3px -3px 7px var(--Ls-1d2229,#1D2229),inset 0 0 0 1px var(--Ls-ffffff12,rgba(255,255,255,.07));transition:box-shadow .2s ease}
:where(.r1v,.r1s) .tog::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--Lf-2a3039,#2A3039);box-shadow:3px 3px 6px var(--Ls-050607,#050607),-2px -2px 5px var(--Ls-343b46,#343B46);transition:transform .3s var(--e),background-color .25s ease}
:where(.r1v,.r1s) button.sw[aria-checked="true"] .tog,:where(.r1v,.r1s) .tog[aria-checked="true"]{box-shadow:inset 3px 3px 7px var(--Ls-050607,#050607),inset -3px -3px 7px var(--Ls-1d2229,#1D2229),inset 0 0 0 1px var(--Ls-22d3ee80,rgba(34,211,238,.5))}
:where(.r1v,.r1s) button.sw[aria-checked="true"] .tog::after,:where(.r1v,.r1s) .tog[aria-checked="true"]::after{transform:translateX(18px);background:var(--cy)}
:where(.r1v,.r1s) button.sw:hover .tog{box-shadow:inset 3px 3px 7px var(--Ls-050607,#050607),inset -3px -3px 7px var(--Ls-1d2229,#1D2229),inset 0 0 0 1px var(--Ls-ffffff29,rgba(255,255,255,.16))}
:where(.r1v,.r1s) button.sw[aria-checked="false"] small{color:var(--Lt-8a929f,#8A929F)}
:where(.r1v,.r1s) button.sw:is(:disabled,[aria-disabled="true"]){cursor:not-allowed;color:var(--mute)}
:where(.r1v,.r1s) button.sw:is(:disabled,[aria-disabled="true"]) .tog{opacity:.45}
/* a bare switch (no row), and the large public demo size */
:where(.r1v,.r1s) button.tog{border:0;padding:0;cursor:pointer}
:where(.r1v,.r1s) .tog.lg{width:58px;height:32px;border-radius:99px}
:where(.r1v,.r1s) .tog.lg::after{top:4px;left:4px;width:24px;height:24px;transition:transform .35s var(--spring),background-color .25s ease}
:where(.r1v,.r1s) .tog.lg[aria-checked="true"]::after{transform:translateX(26px)}
/* -- 8.1 Chips and pills -- */
/* Chips and pills (Round One). Member v7 112-129, 645 and 646; public skin Pages v1 923-930. */
:where(.r1v,.r1s) .pill,:where(.r1v,.r1s) .cl,:where(.r1v,.r1s) .live{display:inline-flex;align-items:center;justify-content:center;line-height:1;white-space:nowrap;vertical-align:middle}
:where(.r1v,.r1s) .pill{height:24px;padding:0 .625rem;border-radius:12px;font-size:.75rem;font-weight:600}
:where(.r1v,.r1s) .pill .i{width:14px;height:14px;margin-right:6px}
:where(.r1v,.r1s) .pill.lg{height:30px;padding:0 1em;font-size:.8125rem;border-radius:15px}
:where(.r1v,.r1s) .pill.xs{height:20px;padding:0 .5rem;font-size:.6875rem}
:where(.r1v,.r1s) .pill.ok{background:var(--Lf-3ddc8424,rgba(61,220,132,.14));color:var(--greeni);box-shadow:inset 0 0 0 1px var(--Ls-3ddc8438,rgba(61,220,132,.22))}
:where(.r1v,.r1s) .pill.wait{background:var(--Lf-ffc23d26,rgba(255,194,61,.15));color:var(--amberi);box-shadow:inset 0 0 0 1px var(--Ls-ffc23d40,rgba(255,194,61,.25))}
:where(.r1v,.r1s) .pill.info{background:var(--Lf-22d3ee1f,rgba(34,211,238,.12));color:var(--cyi);box-shadow:inset 0 0 0 1px var(--Ls-22d3ee4d,rgba(34,211,238,.3))}
:where(.r1v,.r1s) .pill.bad{background:var(--Lf-ff4da624,rgba(255,77,166,.14));color:var(--pinki);box-shadow:inset 0 0 0 1px var(--Ls-ff4da64d,rgba(255,77,166,.3))}
:where(.r1v,.r1s) .pill.no{background:var(--s3);color:var(--ink2)}
/* Class badge: the only blue in Round One (G1) */
:where(.r1v,.r1s) .cl{height:24px;min-width:2rem;padding:.08em .5rem 0;border-radius:7px;background:var(--Lf-3a7fff29,rgba(58,127,255,.16));color:var(--bluei);font-family:var(--disp);font-weight:600;font-size:.8125rem;box-shadow:inset 0 0 0 1px var(--Ls-3a7fff47,rgba(58,127,255,.28))}
:where(.r1v,.r1s) .cl.un{background:var(--s3);color:var(--ink2);box-shadow:none;font-family:var(--text);font-size:.75rem}
/* live and ON AIR */
:where(.r1v,.r1s) .live{gap:.5rem;height:26px;padding:0 .6875rem;border-radius:13px;background:var(--Lf-f8313e29,rgba(248,49,62,.16));color:var(--redi);font-weight:600;font-size:.78125rem;box-shadow:inset 0 0 0 1px var(--Ls-f8313e4d,rgba(248,49,62,.3))}
:where(.r1v,.r1s) .live i{width:7px;height:7px;border-radius:50%;background:var(--red);animation:w1beat 1.6s ease-out infinite}
:where(.r1v,.r1s) .live.onair{font-family:var(--disp);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:.6875rem;height:22px;padding:0 .5rem}
@keyframes w1beat{0%{box-shadow:0 0 0 0 var(--Ls-f8313eb3,rgba(248,49,62,.7))}70%{box-shadow:0 0 0 7px rgba(248,49,62,0)}100%{box-shadow:0 0 0 0 rgba(248,49,62,0)}}
/* filter chips */
:where(.r1v,.r1s) .chips{display:flex;flex-wrap:wrap;gap:.5rem}
:where(.r1v,.r1s) button.chip,:where(.r1v,.r1s) a.chip{display:inline-flex;align-items:center;justify-content:center;gap:.4375rem;height:36px;padding:0 .875rem;border:0;border-radius:10px;background:var(--s2);box-shadow:var(--hl),var(--edge);color:var(--ink2);font:500 .84375rem/1 var(--text);white-space:nowrap;cursor:pointer;transition:background-color .18s ease,color .18s ease,box-shadow .18s ease,transform .14s var(--e)}
:where(.r1v,.r1s) button.chip:hover,:where(.r1v,.r1s) a.chip:hover{background:var(--s3);color:var(--ink)}
:where(.r1v,.r1s) button.chip:active{transform:scale(.96)}
:where(.r1v,.r1s) button.chip[aria-pressed="true"]{background:linear-gradient(180deg,var(--Lf-22d3ee3d,rgba(34,211,238,.24)),var(--Lf-22d3ee21,rgba(34,211,238,.13)));color:var(--Lt-e6fbff,#E6FBFF);box-shadow:inset 0 0 0 1px var(--Ls-22d3ee8c,rgba(34,211,238,.55)),0 6px 16px -8px var(--Ls-22d3ee8c,rgba(34,211,238,.55))}
:where(.r1v,.r1s) button.chip:disabled{color:var(--mute);opacity:.5;cursor:not-allowed;transform:none}
:where(.r1v,.r1s) .chips .cnt,:where(.r1v,.r1s) button.chip .cnt{min-width:1.25rem;height:20px;padding:0 .375rem;border-radius:10px;background:var(--s4);font-size:.75rem;display:inline-flex;align-items:center;justify-content:center}
/* public shell skin: square, uppercase, display face */
body[data-shell=pub] :where(.r1v,.r1s) .pill,body[data-shell=pub] :where(.r1v,.r1s) .live{gap:.4375rem;height:26px;border-radius:4px;font:700 .75rem/1 var(--disp);letter-spacing:.07em;text-transform:uppercase}
body[data-shell=pub] :where(.r1v,.r1s) .pill .i{margin-right:0}
body[data-shell=pub] :where(.r1v,.r1s) .live{background:var(--red);color:var(--on-fill);box-shadow:none}
body[data-shell=pub] :where(.r1v,.r1s) .live i{background:var(--on-fill);animation:w1blink 1.2s steps(2) infinite}
body[data-shell=pub] :where(.r1v,.r1s) button.chip{border-radius:4px}
@keyframes w1blink{50%{opacity:0}}
/* -- 9.1 Corner brackets -- */
/* Corner brackets (Round One). Member v7 565; small size from Staff v2 1190. G3 option A. */
:where(.r1v,.r1s) .corners{position:relative}
:where(.r1v,.r1s) .corners::after{content:"";position:absolute;inset:.625rem;pointer-events:none;z-index:2;--hc:var(--Lf-22d3eebf,rgba(34,211,238,.75));--hs:16px;
  background:linear-gradient(var(--hc),var(--hc)) 0 0/var(--hs) 2px,linear-gradient(var(--hc),var(--hc)) 0 0/2px var(--hs),
    linear-gradient(var(--hc),var(--hc)) 100% 0/var(--hs) 2px,linear-gradient(var(--hc),var(--hc)) 100% 0/2px var(--hs),
    linear-gradient(var(--hc),var(--hc)) 0 100%/var(--hs) 2px,linear-gradient(var(--hc),var(--hc)) 0 100%/2px var(--hs),
    linear-gradient(var(--hc),var(--hc)) 100% 100%/var(--hs) 2px,linear-gradient(var(--hc),var(--hc)) 100% 100%/2px var(--hs);
  background-repeat:no-repeat}
:where(.r1v,.r1s) .corners.sm::after{inset:.4375rem;--hs:10px}
/* -- 12.1 Skeleton rows -- */
/* Skeleton (Round One). Member v7 148-152; row sizes Pages v1 958-963. */
:where(.r1v,.r1s) .sk{display:block;position:relative;overflow:hidden;border-radius:8px;background:var(--s2)}
:where(.r1v,.r1s) .sk::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,var(--Lf-ffffff0f,rgba(255,255,255,.06)),transparent);animation:w1sweep 1.25s cubic-bezier(.4,0,.2,1) infinite}
@keyframes w1sweep{to{transform:translateX(100%)}}
:where(.r1v,.r1s) .skw{display:flex;flex-direction:column;gap:.75rem}
:where(.r1v,.r1s) .sk.t{height:46px;width:46%}
:where(.r1v,.r1s) .sk.r{height:68px}
:where(.r1v,.r1s) .sk.g{height:200px}
:where(.r1v,.r1s) .sk.ln{height:12px;width:60%;border-radius:6px}
:where(.r1v,.r1s) .sk.ln.s{width:36%}
:where(.r1v,.r1s) .sk.c{width:40px;height:40px;border-radius:11px;flex:none}
:where(.r1v,.r1s) .sk-row{display:grid;grid-template-columns:2.5rem minmax(0,1fr) 4.5rem;gap:.875rem;align-items:center;padding:.75rem .875rem;border-radius:12px;background:var(--s1);box-shadow:var(--hl),var(--edge)}
:where(.r1v,.r1s) .sk-row>div{display:flex;flex-direction:column;gap:.5rem;min-width:0}
:where(.r1v,.r1s) .sk-row>.sk:last-child{height:24px;border-radius:12px}
body[data-shell=pub] :where(.r1v,.r1s) .sk,body[data-shell=pub] :where(.r1v,.r1s) .sk-row{border-radius:6px}
@media (prefers-reduced-motion:reduce){:where(.r1v,.r1s) .sk::after{animation:none;opacity:0}}
/* -- 13.1 Offline, error, empty and no-access states -- */
/* Offline, error, empty, no access (Round One). Staff v2 820, 823-826 and 1017; Member v7 868 and 872-877. */
:where(.r1v,.r1s) .offbar{position:sticky;top:.5rem;z-index:12;display:flex;align-items:center;flex-wrap:wrap;gap:.5rem .75rem;padding:.625rem .875rem .625rem 1rem;margin:0 0 1rem;border-radius:12px;background:linear-gradient(180deg,var(--Lf-2e2614,#2E2614),var(--Lf-272011,#272011));box-shadow:inset 3px 0 0 var(--amber),inset 0 1px 0 var(--Ls-ffdc8c1f,rgba(255,220,140,.12)),0 0 0 1px var(--Ls-ffc23d33,rgba(255,194,61,.2));color:var(--Lt-fbe2ae,#FBE2AE);font-size:.84375rem}
:where(.r1v,.r1s) .offbar .i{width:18px;height:18px;flex:none;color:var(--amberi)}
:where(.r1v,.r1s) .offbar b{color:var(--Lt-fff0cf,#FFF0CF);font-weight:600}
:where(.r1v,.r1s) .offbar .btn{margin-left:auto}
body:not(.offline) :where(.r1v,.r1s) .offbar{display:none}
body.offline :where(.r1v,.r1s) [data-net]{background:var(--s2);color:var(--mute);box-shadow:none;transform:none;cursor:not-allowed}
:where(.r1v,.r1s) .errbox{display:flex;align-items:center;gap:.75rem;padding:1rem;border-radius:14px;background:var(--s2);color:var(--Lt-ffc2c7,#FFC2C7);box-shadow:var(--hl),inset 0 0 0 1px var(--Ls-f8313e4d,rgba(248,49,62,.3))}
:where(.r1v,.r1s) .errbox:empty{display:none}
:where(.r1v,.r1s) .errbox>.i{width:20px;height:20px;flex:none;color:var(--redi)}
:where(.r1v,.r1s) .errbox b{color:var(--ink);font-weight:600}
:where(.r1v,.r1s) .errbox .btn{margin-left:auto}
:where(.r1v,.r1s) .empty2{display:flex;align-items:center;gap:.875rem;padding:1rem;border-radius:14px;color:var(--ink2);background:var(--s2);box-shadow:var(--hl),var(--edge)}
:where(.r1v,.r1s) .empty2>.i{width:22px;height:22px;flex:none;color:var(--mute)}
:where(.r1v,.r1s) .empty2 b{display:block;color:var(--ink);font-size:.90625rem}
:where(.r1v,.r1s) .empty2 small{display:block;color:var(--mute);font-size:.8125rem;margin-top:.1875rem}
:where(.r1v,.r1s) .empty2.wide{grid-column:1/-1;padding:1.375rem}
:where(.r1v,.r1s) .empty2 .btn{margin-left:auto}
:where(.r1v,.r1s) .noacc{display:flex;align-items:center;gap:1.625rem;padding:2.125rem;max-width:47.5rem}
:where(.r1v,.r1s) .noacc .lockart{width:92px;height:92px;flex:none;border-radius:26px;display:flex;align-items:center;justify-content:center;background:var(--Lf-111418,#111418);box-shadow:inset 4px 4px 10px var(--Ls-050607,#050607),inset -4px -4px 10px var(--Ls-1d2229,#1D2229);color:var(--Lt-ff7a84,#FF7A84)}
:where(.r1v,.r1s) .noacc .lockart .i{width:40px;height:40px}
:where(.r1v,.r1s) .noacc p{color:var(--ink2);margin-top:.5rem}
:where(.r1v,.r1s) .nf{max-width:35rem;margin:3.75rem auto;padding:2.75rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:.75rem}
body[data-shell=pub] :where(.r1v,.r1s) .offbar,body[data-shell=pub] :where(.r1v,.r1s) .errbox,body[data-shell=pub] :where(.r1v,.r1s) .empty2{border-radius:6px}
@media (max-width:720px){:where(.r1v,.r1s) .noacc{flex-direction:column;align-items:flex-start;padding:1.5rem}}
/* -- 14 More below arrow -- */
/* More below arrow (Round One, public shell). Public v6 1048-1062. */
:where(.r1v,.r1s) button.more{all:unset;box-sizing:border-box;position:fixed;left:50%;bottom:22px;z-index:40;width:46px;height:46px;margin-left:-23px;border-radius:50%;display:grid;place-items:center;cursor:pointer;background:var(--Lf-1a1e25e6,rgba(26,30,37,.9));border:1px solid var(--Ll-ffffff1a,rgba(255,255,255,.1));color:var(--ink);box-shadow:0 10px 24px -10px var(--Ls-000000e6,rgba(0,0,0,.9));backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;pointer-events:none;transform:translateY(10px);transition:opacity .45s var(--e),transform .45s var(--e),border-color .16s var(--e),box-shadow .16s var(--e)}
:where(.r1v,.r1s) button.more.on{opacity:1;pointer-events:auto;transform:none}
:where(.r1v,.r1s) button.more.on svg{animation:w1moreb 2.6s ease-in-out infinite}
@keyframes w1moreb{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}
:where(.r1v,.r1s) button.more:hover{border-color:var(--red);box-shadow:2px 2px 0 var(--red)}
:where(.r1v,.r1s) button.more:focus-visible{outline:2px solid var(--cy);outline-offset:3px}
:where(.r1v,.r1s) .toast.on~button.more,body:has(.pmod.on) :where(.r1v,.r1s) button.more,body.navopen :where(.r1v,.r1s) button.more{opacity:0;pointer-events:none}
@media (prefers-reduced-motion:reduce){:where(.r1v,.r1s) button.more.on svg{animation:none}}
/* -- 15 Compact sticky hero bar -- */
/* Compact sticky hero bar (Round One). Staff v2 1182-1203 (S1); Owner v3 894-912 (O3) folded in. */
:where(.r1v,.r1s) .cdock{position:sticky;top:0;height:0;z-index:8}
:where(.r1v,.r1s) .cbar{position:absolute;left:0;right:0;top:.625rem;display:flex;flex-direction:column;gap:.5rem;opacity:0;visibility:hidden;transform:translateY(-14px);transition:opacity .2s ease,transform .32s var(--e),visibility 0s linear .32s}
:where(.r1v,.r1s) .cbar.on{opacity:1;visibility:visible;transform:none;transition:opacity .2s ease,transform .32s var(--e),visibility 0s}
:where(.r1v,.r1s) .cbar::before{content:"";position:absolute;left:-.625rem;right:-.625rem;top:-.625rem;bottom:-.875rem;z-index:-1;pointer-events:none;background:linear-gradient(180deg,var(--Lf-08090bf7,rgba(8,9,11,.97)),var(--Lf-08090beb,rgba(8,9,11,.92)) calc(100% - 16px),rgba(8,9,11,0));backdrop-filter:blur(8px);-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 16px),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 16px),transparent)}
:where(.r1v,.r1s) .cb-top{position:relative;height:72px;display:flex;align-items:center;gap:.75rem;padding:0 1.5rem 0 1.625rem;border-radius:16px;overflow:hidden;background:radial-gradient(420px 140px at 0% 0%,var(--Lf-f8313e29,rgba(248,49,62,.16)),transparent 70%),radial-gradient(420px 140px at 100% 100%,var(--Lf-22d3ee17,rgba(34,211,238,.09)),transparent 70%),linear-gradient(180deg,var(--Lf-161a20,#161A20),var(--Lf-111418,#111418));box-shadow:var(--hl),var(--edge),0 18px 40px -18px var(--Ls-000000e6,rgba(0,0,0,.9))}
:where(.r1v,.r1s) .cb-top>*{position:relative;z-index:2}
:where(.r1v,.r1s) .cb-ic{display:inline-flex;color:var(--Lt-ff7a84,#FF7A84)}
:where(.r1v,.r1s) .cb-ic .i{width:18px;height:18px}
:where(.r1v,.r1s) .cb-t{font:700 1.375rem/1 var(--disp);letter-spacing:-.01em;white-space:nowrap}
:where(.r1v,.r1s) .cb-sp{flex:1}
:where(.r1v,.r1s) .cb-q{display:flex;gap:.375rem;overflow-x:auto;scrollbar-width:none;padding:0 1px}
:where(.r1v,.r1s) .cb-q::-webkit-scrollbar{display:none}
:where(.r1v,.r1s) .cq{flex:none;display:inline-flex;align-items:center;gap:.64em;height:32px;padding:0 .48em 0 .96em;border-radius:9px;background:var(--Lf-1b1f26f5,rgba(27,31,38,.96));box-shadow:var(--hl),var(--edge);color:var(--ink2);font-size:.78125rem;font-weight:500;line-height:1;white-space:nowrap;text-decoration:none;transition:background-color .18s ease,color .18s ease}
:where(.r1v,.r1s) a.cq:hover,:where(.r1v,.r1s) a.cq:focus-visible{background:var(--s3);color:var(--ink)}
:where(.r1v,.r1s) a.cq:focus-visible{outline-offset:-2px}
:where(.r1v,.r1s) .cq b{min-width:1.25rem;height:20px;padding:0 .375rem;border-radius:7px;background:var(--Lf-ffc23d29,rgba(255,194,61,.16));color:var(--amberi);font-size:.75rem;font-weight:600;display:inline-flex;align-items:center;justify-content:center;line-height:1}
:where(.r1v,.r1s) .cq.tot{padding:0 .75rem;gap:.4375rem;background:linear-gradient(180deg,var(--Lf-2e2614,#2E2614),var(--Lf-211b0f,#211B0F));box-shadow:inset 0 1px 0 var(--Ls-ffdc8c1f,rgba(255,220,140,.12)),0 0 0 1px var(--Ls-ffc23d47,rgba(255,194,61,.28));color:var(--Lt-e9cf98,#E9CF98)}
:where(.r1v,.r1s) .cq.tot b{min-width:0;height:auto;padding:0;background:none;font-size:.9375rem;color:var(--amberi)}
:where(.r1v,.r1s) .cq-dot{flex:none;width:7px;height:7px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px var(--Ls-ffc23dcc,rgba(255,194,61,.8));animation:w1cqpulse 1.8s ease-in-out infinite}
@keyframes w1cqpulse{50%{opacity:.35;box-shadow:0 0 2px var(--Ls-ffc23d66,rgba(255,194,61,.4))}}
:where(.r1v,.r1s) .cq.ok{padding:0 .75rem;color:var(--greeni);box-shadow:var(--hl),inset 0 0 0 1px var(--Ls-3ddc8440,rgba(61,220,132,.25))}
@media (max-width:1100px){:where(.r1v,.r1s) .cb-q{display:none}:where(.r1v,.r1s) .cb-top{padding:0 1.125rem}}
@media (prefers-reduced-motion:reduce){:where(.r1v,.r1s) .cbar{transform:none}:where(.r1v,.r1s) .cq-dot{animation:none}}
/* -- 16 Time zone labels -- */
/* Time labels (Round One; TradeBack uses the same with --cyan for --cyi and 12 px). Wave 1 from the page guide lines 81-82. */
:where(.r1v,.r1s) .tz{white-space:nowrap;font-variant-numeric:tabular-nums}
:where(.r1v,.r1s) .tz abbr{margin-left:.3em;text-decoration:none;color:var(--mute);font-size:.86em;cursor:help}
:where(.r1v,.r1s) .cdown{white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--ink2)}
:where(.r1v,.r1s) .cdown.soon{color:var(--amberi)}
:where(.r1v,.r1s) .tzline{display:flex;align-items:center;flex-wrap:wrap;gap:.48em .64em;color:var(--mute);font-size:.78125rem}
:where(.r1v,.r1s) .tzline a{color:var(--cyi);text-underline-offset:3px}
/* -- 17 Ubisoft credit line (the footer is a scope root, so footer .ulegal is matched on it) -- */
/* Ubisoft credit (Round One). Public v6 1045. TradeBack uses 12 px too (G7). */
:where(.r1v,.r1s) .ucred{margin-top:.625rem;font-size:.75rem;line-height:1.4;color:var(--mute)}
footer:where(.r1s) .ulegal{margin-top:.75rem;font-size:.8125rem;line-height:1.5;color:var(--mute);max-width:72ch}
/* -- 21 Stream dock. Public Pages v2 L1016-1028, L1042-1053, L1450-1456, L1505-1509 (the fake stream art L1029-1041 is mockup only). dock() in ui.js writes the dock with class r1s, so .tv and .tvchip are scope roots. -- */
:where(.r1s).tv{position:fixed;right:1.25rem;bottom:1.25rem;z-index:44;width:20rem;border-radius:8px;overflow:hidden;background:var(--Lf-0d0f13,#0D0F13);box-shadow:0 34px 70px -24px var(--Ls-000000f2,rgba(0,0,0,.95)),inset 0 0 0 1px var(--Ls-ffffff1a,rgba(255,255,255,.1));transition:transform .55s var(--spring),opacity .3s var(--e)}
:where(.r1s).tv.off{transform:translateY(calc(100% + 40px));opacity:0;pointer-events:none}
:where(.r1s).tv .th{display:flex;align-items:center;gap:.5rem;height:40px;padding:0 .375rem 0 .75rem;background:var(--s1)}
:where(.r1s).tv .th .pill{height:22px;font-size:.6875rem;padding:0 .4375rem}
:where(.r1s).tv .th b{font:600 .8125rem/1 var(--text);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:where(.r1s).tv .th b span{color:var(--mute);font-weight:500}
:where(.r1s).tv .tb{all:unset;cursor:pointer;width:30px;height:30px;border-radius:5px;display:grid;place-items:center;color:var(--ink2);font:700 15px/1 var(--disp)}
:where(.r1s).tv .tb:hover{background:var(--s3);color:var(--ink)}
:where(.r1s).tv .tb:focus-visible{outline:2px solid var(--cyan)}
:where(.r1s).tv .fr{position:relative;aspect-ratio:16/9;background:var(--Lf-000000,#000) center/cover;container-type:inline-size;overflow:hidden}
:where(.r1s).tv .fr::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--Lf-08090bbf,rgba(8,9,11,.75)),var(--Lf-08090b0d,rgba(8,9,11,.05)) 50%,var(--Lf-08090b59,rgba(8,9,11,.35)))}
:where(.r1s).tv.min .fr,:where(.r1s).tv.min .tf{display:none}
:where(.r1v,.r1s) .strm{position:absolute;inset:0}
:where(.r1s).tv .tf{display:flex;align-items:center;justify-content:space-between;gap:.625rem;padding:.625rem .75rem;font-size:.8125rem;color:var(--mute);background:var(--s1)}
:where(.r1s).tv .tf a{color:var(--ink);font-weight:600;text-decoration:underline;text-decoration-color:var(--t-red,var(--red));text-underline-offset:3px;cursor:pointer;white-space:nowrap}
:where(.r1s).tvchip{position:fixed;right:1.25rem;bottom:1.25rem;z-index:44;display:flex;align-items:center;gap:.625rem;height:40px;padding:0 .375rem 0 .875rem;border-radius:8px;background:var(--s1);box-shadow:0 20px 40px -18px var(--Ls-000000e6,rgba(0,0,0,.9)),inset 0 0 0 1px var(--Ls-ffffff1a,rgba(255,255,255,.1));font-size:.8125rem;color:var(--ink2);transition:transform .45s var(--spring),opacity .25s}
:where(.r1s).tvchip.off{transform:translateY(80px);opacity:0;pointer-events:none}
:where(.r1s).tvchip .qb{height:30px;padding:0 .75rem;font-size:.8125rem}
@media (min-width:1900px){
  :where(.r1s).tv{width:18.75rem;right:1rem;bottom:auto;top:7.25rem}
  :where(.r1s).tv.off{transform:translateX(calc(100% + 40px))}
  :where(.r1s).tvchip{right:1rem;bottom:auto;top:7.25rem}
}
@media (max-width:1279px){:where(.r1s).tv{width:17.5rem}}
@media (max-width:620px){:where(.r1s).tv{width:calc(100vw - 32px);right:1rem;bottom:1rem}}
:where(.r1s).tv .th b a.tvorg{color:var(--ink);text-decoration:none}
:where(.r1s).tv .th b a.tvorg:hover{text-decoration:underline;text-decoration-color:var(--t-red,var(--red));text-underline-offset:3px}
:where(.r1v,.r1s) .strm.idle{display:grid;place-items:center;background:radial-gradient(120% 120% at 70% 0%,var(--Lf-22d3ee14,rgba(34,211,238,.08)),transparent 60%),var(--Lf-0b0d11,#0B0D11)}
:where(.r1v,.r1s) .strm .idc{text-align:center;padding:0 8cqw;display:flex;flex-direction:column;align-items:center;gap:2cqw}
:where(.r1v,.r1s) .strm .idc b{font:700 5cqw/1.1 var(--disp);color:var(--ink)}
:where(.r1v,.r1s) .strm .idc span{font-size:3.6cqw;color:var(--ink2);line-height:1.35}
:where(.r1v,.r1s) .strm .idc .qb{height:30px;font-size:.8125rem;padding:0 .75rem}
:where(.r1s).tv .tf.tvc{display:block;padding-top:0;color:var(--ink2);line-height:1.8}
:where(.r1s).tv .tf.tvc .onair{margin-left:.3125rem;white-space:nowrap}
:where(.r1s).tv .tf.tvc b{color:var(--ink);font-weight:600;white-space:nowrap}
:where(.r1s).tv .tf.tvc .tvcn{white-space:nowrap}
:where(.r1s).tv.min .tf.tvc{display:none}
@media (prefers-reduced-motion:reduce){:where(.r1s).tv,:where(.r1s).tvchip{transition:none}}
/* the frame shade must not catch clicks meant for the Twitch player mounted inside .fr; live pills in the dock head take the pill size */
:where(.r1s).tv .fr::before{pointer-events:none}
:where(.r1s).tv .th .live{height:22px;font-size:.6875rem;padding:0 .4375rem}

/* Stream dock frame states (moved from r1-public.css, F lead pass 3): Public Pages v2 L1028, L1034 and the idle card, drawn by
   ui.js dock() inside .r1s.tv. The dock sits outside main, so its rules live here and stay on whatever area the page uses. */
:where(.r1s).tv .strm{position:absolute;inset:0}
:where(.r1s).tv .strm .tw{position:absolute;left:3cqw;bottom:3cqw;font:600 3cqw/1 var(--text);color:var(--Lt-ffffff,#fff);background:var(--Lf-0a0b0dbf,rgba(10,11,13,.75));padding:1.4cqw 2cqw;border-radius:1cqw}
:where(.r1s).tv .strm.idle{display:grid;place-items:center;background:var(--s2)}
:where(.r1s).tv .strm .idc{display:flex;flex-direction:column;align-items:center;gap:.375rem;text-align:center;padding:0 1rem;position:relative}
:where(.r1s).tv .strm .idc b{font:700 .9375rem/1.2 var(--disp);color:var(--ink)}
:where(.r1s).tv .strm .idc span{font-size:.8125rem;color:var(--mute)}
:where(.r1s).tv .tvc{justify-content:flex-start;flex-wrap:wrap;gap:.25rem}
:where(.r1s).tv a.tvorg{color:inherit;text-decoration:none}
/* Feedback dialog (feedback.js, dialog#fbDlg outside main). Member Area v8 modal, option, note and footer rules, scoped to the
   dialog so they never reach another area's .note or .opt; the dialog is styled on every page, public ones too (F lead pass 3). */
:where(#fbDlg .r1v) .modal{position:fixed;left:50%;top:50%;width:min(520px,calc(100% - 32px));max-height:calc(100vh - 48px);overflow:auto;transform:translate(-50%,-50%);background:linear-gradient(180deg,var(--Lf-1a1e25,#1A1E25),var(--Lf-13161b,#13161B));border-radius:22px;padding:1.625rem;z-index:11;box-shadow:0 40px 90px var(--Ls-000000b3,rgba(0,0,0,.7)),var(--hl),var(--edge);animation:fbpop .4s var(--e) both;display:flex;flex-direction:column;gap:1.125rem}
@keyframes fbpop{from{opacity:0;transform:translate(-50%,-47%) scale(.97)}}
:where(#fbDlg .r1v) .modal h2{font-size:1.5rem}
:where(#fbDlg .r1v) .iconbtn{width:44px;height:44px;border:0;border-radius:12px;background:var(--Lf-1b1f26d9,rgba(27,31,38,.85));box-shadow:var(--hl),var(--edge);color:var(--ink2);display:grid;place-items:center;position:relative;cursor:pointer;transition:background-color .18s ease,transform .14s var(--e)}
:where(#fbDlg .r1v) .opt{display:flex;align-items:center;gap:.75rem;width:100%;padding:.8125rem 1em;border:0;border-radius:12px;background:var(--s2);box-shadow:var(--hl),var(--edge);color:var(--ink);font-size:.875rem;text-align:left;cursor:pointer;margin-top:.5rem}
:where(#fbDlg .r1v) .opt:hover{background:var(--s3)}
:where(#fbDlg .r1v) .opt[aria-checked="true"]{background:var(--Lf-22d3ee17,rgba(34,211,238,.09));box-shadow:inset 0 0 0 1.5px var(--cy),0 8px 20px -10px var(--Ls-22d3ee80,rgba(34,211,238,.5))}
:where(#fbDlg .r1v) .rad{width:18px;height:18px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--s4);flex:none}
:where(#fbDlg .r1v) .opt[aria-checked="true"] .rad{box-shadow:inset 0 0 0 5px var(--cy)}
:where(#fbDlg .r1v) .opt small{color:var(--mute);margin-left:auto;font-size:.78125rem}
:where(#fbDlg .r1v) .note{width:100%;min-height:5.25rem;border:0;border-radius:12px;background:var(--s2);box-shadow:var(--hl),var(--edge);color:var(--ink);font:inherit;font-size:.875rem;padding:.75rem 1em;resize:vertical;box-sizing:border-box}
:where(#fbDlg .r1v) .note.tall{min-height:8.125rem}
:where(#fbDlg .r1v) .lbl{font-weight:600;font-size:.875rem;display:block;margin-bottom:.625rem}
:where(#fbDlg .r1v) .mcopy{font-size:.875rem;color:var(--ink2)}
:where(#fbDlg .r1v) .hint{color:var(--mute);font-size:.78125rem;margin-top:.5rem}
:where(#fbDlg .r1v) .ferr{color:var(--Lt-ff9aa2,#FF9AA2);font-size:.8125rem;min-height:0;margin-top:.375rem}
:where(#fbDlg .r1v) .ferr:empty{display:none}
:where(#fbDlg .r1v) .sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:where(#fbDlg .r1v) .v8shot{display:flex;align-items:center;gap:.75rem}
:where(#fbDlg .r1v) .v8shot span{width:120px;height:68px;border-radius:10px;background-size:cover;background-position:center;box-shadow:var(--hl),var(--edge)}
:where(#fbDlg .r1v) .foot2{margin-top:auto;display:flex;gap:.625rem}
:where(#fbDlg .r1v) .foot2 .btn{flex:1;height:46px;margin:0}
/* .btn.sec meets r1-public.css .sec (a page section with margin-top) on public pages; the margin above keeps the footer row level. */
dialog#fbDlg::backdrop{background:var(--Lf-040507a8,rgba(4,5,7,.66));backdrop-filter:blur(3px)}
@media (prefers-reduced-motion:reduce){:where(#fbDlg .r1v) .modal{animation:none}}

/* Hold to confirm (ui.js hold, F lead, 22 Oct). Global on purpose: legacy views carry data-hold too. The overlay is one
   fixed element over the held control, so the control's own layout never changes. Rule: ARCHITECTURE.md section 4. */
[data-hold]{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:manipulation}
:where(.r1s).r1hold{position:fixed;z-index:2147483000;display:none;pointer-events:none;box-sizing:border-box;box-shadow:0 0 0 2px var(--red),0 0 22px -6px var(--Ls-f8313eb3,rgba(248,49,62,.7))}
:where(.r1s).r1hold.on{display:block}
:where(.r1s).r1hold .r1hold-clip{position:absolute;inset:0;border-radius:inherit;overflow:hidden;display:block}
:where(.r1s).r1hold .r1hold-fill{position:absolute;inset:0;display:block;background:var(--Lf-f8313e4d,rgba(248,49,62,.30));transform:scaleX(0);transform-origin:left center}
:where(.r1s).r1hold .r1hold-tip{position:absolute;left:0;bottom:calc(100% + 8px);white-space:nowrap;font:600 .8125rem/1.2 Geist,system-ui,sans-serif;color:var(--ink);background:var(--s3);padding:.375rem .625rem;border-radius:8px;box-shadow:var(--hl),0 10px 24px -10px var(--Ls-000000b3,rgba(0,0,0,.7))}
:where(.r1s).r1hold.below .r1hold-tip{bottom:auto;top:calc(100% + 8px)}
:where(.r1s).r1hold.hint{box-shadow:0 0 0 2px var(--amber)}
:where(.r1s).r1hold.hint .r1hold-tip{color:var(--amberi)}
:where(.r1s).r1hold.ok{box-shadow:0 0 0 2px var(--green)}
:where(.r1s).r1hold.ok .r1hold-fill{background:var(--Lf-3ddc8452,rgba(61,220,132,.32))}
:where(.r1s).r1hold.still .r1hold-fill{display:none}
/* A standing "Hold" mark on every hold control, so nobody taps and waits (e2e audit 2 UX-036). The press shows "Hold to ..." and the fill. */
:is(button,a[href],[role=button])[data-hold]::after{content:"Hold";display:inline-block;margin-left:.45em;padding:0 .35em;border:1px solid currentColor;border-radius:4px;font-size:.6875em;font-weight:700;letter-spacing:.04em;text-transform:uppercase;line-height:1.45;opacity:.8;vertical-align:middle;pointer-events:none}

/* ---- 5. Shells. render() in app.js sets body[data-shell] (pub, mem or cast) from the route row; renderShell() paints the parts. ---- */
/* Which parts show. main#main is never inside .r1s: old views keep their old look inside it. */
body[data-shell=pub] #memShell>.rail,body[data-shell=pub] #memTop{display:none}
body[data-shell=mem] #pubTop,body[data-shell=mem] #pubFoot,body[data-shell=mem] #pubMenu{display:none}
/* the caster app draws its own menu (cast-mode), so the site shell hides */
body[data-shell=cast] #pubTop,body[data-shell=cast] #pubFoot,body[data-shell=cast] #pubMenu,body[data-shell=cast] #memShell>.rail,body[data-shell=cast] #memTop{display:none}
/* wait: the first paint, and a page whose shell depends on sign-in while sign-in settles; no shell part shows yet */
body[data-shell=wait] #pubTop,body[data-shell=wait] #pubFoot,body[data-shell=wait] #pubMenu,body[data-shell=wait] #memShell>.rail,body[data-shell=wait] #memTop{display:none}
body:not([data-shell=mem]) :where(.r1s).backdrop{display:none}
/* Page ground: the shell colour (token --bg; body sits outside the scope). The old map backdrop (1600 x 900) fails the
   image rule, so it is switched off in both shells. Dark only until light mode lands (G14): app.js and index.html keep
   data-theme dark, and these rules hold the dark ground and controls whatever the device scheme says. */
:root:not([data-theme="light"]){color-scheme:dark}
body:is([data-shell=pub],[data-shell=mem],[data-shell=wait]){background:var(--Lf-08090b,#08090B)}
body:is([data-shell=pub],[data-shell=mem],[data-shell=wait])::before{content:none}
/* Public page frame (moved from r1-public.css): a ported view draws its own .wrap, so main#main drops its width and padding. */
body[data-shell=pub] main#main:has(> .r1v){max-width:none;padding:0}
body[data-shell=pub]:has(main#main > .r1v){background:var(--Lf-08090b,#08090B)}
/* A member view on an auto route signed out (/player/<key>, /lft, /lfp, /join-team) draws no .wrap of its own, so the pub shell
   frames it like the member page width. painted() in app.js sets main[data-area] to the area styles the view asked for. */
body[data-shell=pub] main#main[data-area~=member]:not([data-area~=public]) > .r1v{width:min(1440px,calc(100% - 64px));margin:0 auto;padding:2rem 0 4rem}
@media (max-width:720px){body[data-shell=pub] main#main[data-area~=member]:not([data-area~=public]) > .r1v{width:calc(100% - 32px);padding-top:1.25rem}}
body:is([data-shell=pub],[data-shell=wait]) #memShell{flex:1 0 auto}
/* member shell grid: Member Area v8 L41 (.shell) */
body[data-shell=mem] #memShell{position:relative;z-index:1;display:grid;grid-template-columns:16.25rem minmax(0,1fr);align-items:start;min-height:100vh}
body[data-shell=mem] #memShell>.mainwrap{min-width:0}
/* page width: Public Site v7 .wrap (L16 and L25) and Member Area v8 .main (L62, L426, L1540) */
body[data-shell=pub] main#main{width:100%;max-width:77.5rem;margin:0 auto;padding:0 clamp(16px,4vw,48px) 4rem}
body[data-shell=mem] main#main{width:auto;max-width:none;min-width:0;margin:0;padding:0 2.5rem 5rem}
@media (max-width:980px){body[data-shell=mem] #memShell{display:block}body[data-shell=mem] main#main{padding-top:0}}
@media (max-width:720px){body[data-shell=mem] main#main{padding:0 1rem 3.75rem}}

/* Backdrop: Member Area v8 L21-26 (the mockup's dark map texture behind everything, two soft brand glows). --bgimg is
   img/bg/backdrop-texture.webp: the mockup texture upscaled to 1920 x 1080 (Jai W3, 21 Oct; IMAGE-SOURCES.md in img/bg). */
:where(.r1s).backdrop{position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(900px 520px at 18% -8%,var(--Lf-3a7fff21,rgba(58,127,255,.13)),transparent 70%),
  radial-gradient(760px 480px at 100% 0%,var(--Lf-f8313e17,rgba(248,49,62,.09)),transparent 70%),
  radial-gradient(1200px 800px at 60% 120%,var(--Lf-3a7fff0f,rgba(58,127,255,.06)),transparent 70%)}
:where(.r1s).backdrop::before{content:"";position:absolute;inset:0;background:var(--bgimg) center/cover no-repeat;opacity:.55;mix-blend-mode:screen}

/* Public top bar. Public Site v7 L28-36, L348, L774-778, L859-860, L1455-1480 and L550-552. The round clock
   (L38-47) shows on the landing page only, driven by app.js clockTick. "You are here" on Sign up uses aria-current, not body[data-v]. */
:where(.r1s).bar{position:sticky;top:0;z-index:30;background:var(--bg);box-shadow:0 1px 0 var(--Ls-1c2027,#1C2027)}
:where(.r1s).bar .wrap{display:flex;align-items:center;gap:.75rem;min-height:66px}
:where(.r1s).bar .brand{display:flex;align-items:center;gap:.625rem;text-decoration:none;font:700 min(1.1875rem,5.5vw)/1 var(--disp);letter-spacing:.04em;flex:0 1 auto;min-width:0;overflow:hidden;white-space:nowrap}
:where(.r1s).bar .brand:focus-visible{outline-offset:-2px}
:where(.r1s).bar .menub{flex:none}
:where(.r1s).bar .brand img{width:1.875rem;height:auto}
:where(.r1s).bar .links{display:flex;gap:.25rem;margin-left:.5rem;flex:none}
:where(.r1s).bar .links a{text-decoration:none;color:var(--ink2);font-weight:500;padding:.5rem .625rem;border-radius:8px;transition:color .2s,background .2s}
:where(.r1s).bar .links a:hover{color:var(--ink);background:var(--s1)}
:where(.r1s).bar .links a[aria-current]{color:var(--ink);background:var(--s1);box-shadow:inset 0 -2px 0 var(--red)}
:where(.r1s).bar .sp{flex:1}
:where(.r1s).bar .srch{width:42px;height:42px;border-radius:8px}
:where(.r1s).bar .signin,:where(.r1s).bar .hdrsu{white-space:nowrap}
:where(.r1s).bar .hdrsu .here{display:none}
:where(.r1s).bar .hdrsu[aria-current] .go{display:none}
:where(.r1s).bar .hdrsu[aria-current] .here{display:inline-flex;align-items:center;gap:.5rem}
:where(.r1s).bar .hdrsu[aria-current] .here::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--cyan)}
:where(.r1s).bar .hdrsu[aria-current]{background:var(--s1);color:var(--ink2);border:1px solid var(--Ll-ffffff14,rgba(255,255,255,.08));box-shadow:none;transform:none;translate:none;cursor:default;font-weight:600;animation:none}
:where(.r1s).bar .sio{display:flex;align-items:center;gap:.75rem;position:relative}
:where(.r1s).bar .bellb .cnt{position:absolute;top:.25rem;right:.25rem;min-width:1.125rem;height:18px;padding:0 .3125rem;border-radius:9px;background:var(--red);color:var(--on-fill);font:700 .6875rem/1.125rem var(--disp);text-align:center}
:where(.r1s).bar .avb{all:unset;cursor:pointer;display:flex;align-items:center;gap:.5rem;height:42px;padding:0 .625rem 0 .25rem;border-radius:8px;color:var(--ink2);font-weight:600}
:where(.r1s).bar .avb:hover{background:var(--s1);color:var(--ink)}
:where(.r1s).bar .avb:focus-visible{outline:2px solid var(--cy);outline-offset:2px}
:where(.r1s).bar .avb .av{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;overflow:hidden;background:var(--Lf-2a5bd0,#2A5BD0);color:var(--Lt-eaf0ff,#EAF0FF);font:700 15px/1 var(--disp)}
:where(.r1s).bar .avb .av img{width:100%;height:100%;object-fit:cover;display:block}
:where(.r1s).bar .avm{position:absolute;right:0;top:calc(100% + 10px);z-index:60;width:15.5rem;padding:.5rem;border-radius:8px;background:linear-gradient(180deg,var(--Lf-232831,#232831),var(--Lf-1b1f26,#1B1F26));box-shadow:inset 0 1px 0 var(--Ls-ffffff14,rgba(255,255,255,.08)),0 0 0 1px var(--Ls-ffffff14,rgba(255,255,255,.08)),0 24px 50px -14px var(--Ls-000000d9,rgba(0,0,0,.85))}
:where(.r1s).bar .avm[hidden]{display:none}
:where(.r1s).bar .avm .who{padding:.5rem .625rem .625rem;border-bottom:1px solid var(--Ll-ffffff12,rgba(255,255,255,.07));margin-bottom:.375rem}
:where(.r1s).bar .avm .who b{display:block;font:700 1rem/1.2 var(--disp)}
:where(.r1s).bar .avm .who span{font-size:.8125rem;color:var(--mute)}
:where(.r1s).bar .avm a,:where(.r1s).bar .avm button{all:unset;box-sizing:border-box;display:flex;align-items:center;width:100%;height:40px;padding:0 .625rem;border-radius:6px;color:var(--ink2);font-size:.90625rem;cursor:pointer}
:where(.r1s).bar .avm a:hover,:where(.r1s).bar .avm button:hover,:where(.r1s).bar .avm a:focus-visible,:where(.r1s).bar .avm button:focus-visible{background:var(--Lf-ffffff0f,rgba(255,255,255,.06));color:var(--ink)}
:where(.r1s).bar .avm .sep{height:1px;margin:.375rem .25rem;background:var(--Lf-ffffff12,rgba(255,255,255,.07))}
/* Round clock on the landing page bar (Public Site v7 L38-47; app.js clockTick follows the scroll). */
:where(.r1s).bar .clock{--pc:var(--cyan);display:flex;align-items:center;gap:.75rem;padding:.375rem .875rem;position:relative;font-family:var(--disp)}
:where(.r1s).bar .clock::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(var(--pc),var(--pc)) 0 0/10px 2px,linear-gradient(var(--pc),var(--pc)) 0 0/2px 10px,linear-gradient(var(--pc),var(--pc)) 100% 100%/10px 2px,linear-gradient(var(--pc),var(--pc)) 100% 100%/2px 10px;background-repeat:no-repeat}
:where(.r1s).bar .clock[data-ph="action"]{--pc:var(--red)}
:where(.r1s).bar .clock[data-ph="won"]{--pc:var(--green)}
:where(.r1s).bar .clock .ph{font-size:.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--pc);white-space:nowrap}
:where(.r1s).bar .clock .t{font-size:1.5rem;font-weight:700;min-width:3.875rem;text-align:right;font-variant-numeric:tabular-nums}
/* Top bar fit (22 Oct, measured): the bar must never be wider than its column. Signed in, the clock drops its label (the compact clock of Public Site v7 L551); under 1180 px the signed-in Open Round One button and the name leave the bar too (they stay in the drawer and the avatar menu). */
@media (max-width:1239px){:where(.r1s).bar .clock .ph{display:none}}
:where(.r1s).bar:has(.sio) .clock .ph{display:none}
@media (max-width:1210px){:where(.r1s).bar .sio .nb,:where(.r1s).bar .sio .avb .nm2{display:none}}
@media (max-width:1040px){:where(.r1s).bar:not(:has(.sio)) .clock{display:none}}
@media (max-width:980px){:where(.r1s).bar .clock{display:none}}
@media (max-width:1180px){:where(.r1s).bar .hdrsu .lng{display:none}}
@media (max-width:980px){:where(.r1s).bar .wrap{gap:.75rem}:where(.r1s).bar .sio .nb,:where(.r1s).bar .sio .avb .nm2{display:none}}
@media (max-width:620px){:where(.r1s).bar .nb{display:none}:where(.r1s).bar .srch{display:none}}

/* Member rail and top row. Member Area v8 L41-69, L510, L798, L854-859 and L1533; Send feedback and Sign out are rows
   in the rail foot. The 820 px strip (L512-520) is replaced by the drawer below (wave1-defaults D4). */
:where(.r1s).rail{position:sticky;top:0;height:100vh;height:100dvh;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;z-index:5;background:linear-gradient(180deg,var(--Lf-111419eb,rgba(17,20,25,.92)),var(--Lf-0c0e12eb,rgba(12,14,18,.92)));box-shadow:1px 0 0 var(--Ls-ffffff0d,rgba(255,255,255,.05));padding:1.375rem .875rem 1.125rem;display:flex;flex-direction:column;gap:1.375rem}
:where(.r1s).rail .brand{display:flex;align-items:center;gap:.625rem;padding:0 .5rem;text-decoration:none}
:where(.r1s).rail .brand img{width:2.125rem;height:auto;filter:drop-shadow(0 4px 12px var(--Ls-3a7fff59,rgba(58,127,255,.35)))}
:where(.r1s).rail .brand b{font-family:var(--disp);font-size:1.0625rem;font-weight:700;letter-spacing:.03em}
:where(.r1s).rail .me{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:14px;background:var(--s2);box-shadow:var(--hl),var(--edge);text-decoration:none;transition:background-color .18s ease}
:where(.r1s).rail .me:hover{background:var(--s3)}
:where(.r1s).rail .av{display:inline-flex;align-items:center;justify-content:center;line-height:1;white-space:nowrap;padding-top:.08em;width:38px;height:38px;border-radius:11px;font-family:var(--disp);font-weight:700;font-size:14px;flex:none;overflow:hidden;background:linear-gradient(145deg,var(--Lf-4c82f0,#4C82F0),var(--Lf-2347a8,#2347A8));color:var(--Lt-ffffff,#fff);box-shadow:inset 0 1px 0 var(--Ls-ffffff2e,rgba(255,255,255,.18)),0 6px 16px -6px var(--Ls-3a7fff99,rgba(58,127,255,.6))}
:where(.r1s).rail .av:has(img){padding:0}
:where(.r1s).rail .av img{width:100%;height:100%;object-fit:cover;display:block}
:where(.r1s).rail .me .who{display:flex;flex-direction:column;gap:.125rem;min-width:0}
:where(.r1s).rail .me .who b{font-size:.875rem;line-height:1.2}
:where(.r1s).rail .me .who small{color:var(--mute);font-size:.78125rem;line-height:1.25}
:where(.r1s).rail .navg{display:flex;flex-direction:column;gap:.125rem}
:where(.r1s).rail .navg>p{color:var(--mute);font-size:.78125rem;padding:0 .75rem .375rem}
:where(.r1s).rail .nav{display:flex;align-items:center;gap:.75rem;height:40px;padding:0 .75rem;border-radius:10px;color:var(--ink2);text-decoration:none;font-weight:500;font-size:.875rem;position:relative;transition:background-color .18s ease,color .18s ease}
:where(.r1s).rail button.nav{width:100%;border:0;background:none;font-family:inherit;font-weight:500;font-size:.875rem;text-align:left;cursor:pointer}
:where(.r1s).rail .nav:hover{background:var(--Lf-ffffff0a,rgba(255,255,255,.04));color:var(--ink)}
:where(.r1s).rail .nav[aria-current]{background:linear-gradient(90deg,var(--Lf-f8313e29,rgba(248,49,62,.16)),var(--Lf-f8313e08,rgba(248,49,62,.03)) 70%);color:var(--ink);box-shadow:var(--hl)}
:where(.r1s).rail .nav[aria-current]::before{content:"";position:absolute;left:-.875rem;top:.5625rem;bottom:.5625rem;width:.1875rem;border-radius:0 3px 3px 0;background:var(--red);box-shadow:0 0 12px var(--Ls-f8313ecc,rgba(248,49,62,.8))}
:where(.r1s).rail .nav[aria-current] .i{color:var(--Lt-ff7a84,#FF7A84)}
:where(.r1s).rail .nav .n{display:inline-flex;align-items:center;justify-content:center;line-height:1;white-space:nowrap;margin-left:auto;min-width:1.375rem;height:20px;padding:0 .375rem;border-radius:10px;background:var(--red);color:var(--on-fill);font-size:.75rem;font-weight:600;box-shadow:0 4px 10px -3px var(--Ls-f8313eb3,rgba(248,49,62,.7))}
:where(.r1s).rail .nav.subn{height:32px;padding-left:1.375rem;font-size:.84375rem;color:var(--mute)}
:where(.r1s).rail .nav.subn .i{width:16px;height:16px;margin-left:10px}
:where(.r1s).rail .nav.subn::after{content:"";position:absolute;left:1.1875rem;top:-.125rem;bottom:50%;width:.5rem;border-left:1px solid var(--Ll-ffffff1f,rgba(255,255,255,.12));border-bottom:1px solid var(--Ll-ffffff1f,rgba(255,255,255,.12));border-bottom-left-radius:5px;pointer-events:none}
:where(.r1s).rail .nav.subn[aria-current]{color:var(--ink)}
:where(.r1s).rail .railfoot{margin-top:auto;display:flex;flex-direction:column;gap:.125rem}
/* Large text (e2e audit MOB-03): the top bar wraps to a second row instead of pushing the page sideways. */
@media (min-width:981px){:where(.r1s).bar .wrap{flex-wrap:wrap}}
/* Settings and Sign out stay in view at the rail foot when the rail scrolls (e2e audit UX-024). */
@media (min-width:821px){:where(.r1s).rail .railfoot{position:sticky;bottom:-.875rem;z-index:1;margin-bottom:-.875rem;padding:.5rem 0 .875rem;background:linear-gradient(var(--Lf-0c0e12eb,rgba(12,14,18,.92)),var(--Lf-0c0e12eb,rgba(12,14,18,.92))),var(--bg,#08090B);box-shadow:0 -1px 0 var(--Ls-ffffff0d,rgba(255,255,255,.05))}}
@media (min-width:821px){:where(.r1s).rail{gap:.875rem;padding:1.125rem .875rem .875rem}:where(.r1s).rail .nav{height:36px}:where(.r1s).rail .me{padding:.625rem .75rem}:where(.r1s).rail .navg>p{padding-bottom:.25rem}}
@media (max-width:820px){:where(.r1s).rail .nav.subn{height:38px;padding-left:.75rem;font-size:.875rem}:where(.r1s).rail .nav.subn::after{display:none}:where(.r1s).rail .nav.subn .i{margin-left:0}}
:where(.r1s).top{display:flex;align-items:center;gap:.75rem;min-height:4.75rem;flex-wrap:wrap;padding:0 2.5rem}
:where(.r1s).top .search{flex:1 1 17.5rem;max-width:32.5rem;height:44px;border:0;border-radius:12px;background:var(--Lf-1b1f26d9,rgba(27,31,38,.85));box-shadow:var(--hl),var(--edge);color:var(--mute);font-size:.875rem;display:flex;align-items:center;gap:.625rem;padding:0 1em;cursor:pointer;text-decoration:none;transition:background-color .18s ease}
:where(.r1s).top .search:hover{background:var(--s3)}
:where(.r1s).top .kbd{display:inline-flex;align-items:center;justify-content:center;line-height:1;white-space:nowrap;margin-left:auto;font-size:.75rem;color:var(--ink2);background:var(--s4);border-radius:6px;height:22px;padding:0 .4375rem}
:where(.r1s).top .sp{flex:1 1 0}
:where(.r1s).top .dot{position:absolute;top:10px;right:11px;width:8px;height:8px;border-radius:50%;background:var(--red);box-shadow:0 0 0 2px var(--s2),0 0 8px var(--Ls-f8313ee6,rgba(248,49,62,.9))}
:where(.r1s).top .iconbtn{position:relative}
@media (max-width:1023px),(hover:none) and (pointer:coarse){:where(.r1s).top .search .kbd{display:none}}
/* Bell drawer (Member Area v8 bellDrawer; app.js bellOpen paints it on <body> with class r1s, so .bdr is a scope root). */
body.bellopen{overflow:hidden}
:where(.r1s).bdr .veil{position:fixed;inset:0;z-index:80;width:100%;border:0;padding:0;background:var(--Lf-040507a8,rgba(4,5,7,.66));backdrop-filter:blur(3px);cursor:pointer;animation:r1-fadein .3s ease both}
:where(.r1s).bdr .drawer{box-sizing:border-box;position:fixed;top:0;right:0;bottom:0;z-index:81;width:min(450px,100%);padding:1.625rem;display:flex;flex-direction:column;gap:1.25rem;overflow:auto;background:linear-gradient(180deg,var(--Lf-181c22,#181C22),var(--Lf-121519,#121519));color:var(--ink);font-family:var(--text);box-shadow:-30px 0 70px var(--Ls-00000099,rgba(0,0,0,.6)),inset 1px 0 0 var(--Ls-ffffff0f,rgba(255,255,255,.06));animation:r1-drawer .45s var(--e) both}
:where(.r1s).bdr .dh{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
:where(.r1s).bdr h2{margin:0;font:700 1.5rem/1.15 var(--disp);color:var(--ink)}
:where(.r1s).bdr .sub{margin:0;color:var(--mute);font-size:.84375rem}
:where(.r1s).bdr .nlist{display:flex;flex-direction:column;gap:.5rem}
:where(.r1s).bdr .ni{box-sizing:border-box;display:flex;gap:.75rem;padding:.875rem;align-items:flex-start;position:relative;width:100%;border:0;text-align:left;text-decoration:none;color:var(--ink);font:inherit;cursor:pointer;background:var(--s2);border-radius:14px;box-shadow:var(--hl),var(--edge);transition:background-color .18s ease}
:where(.r1s).bdr .ni:hover{background:var(--s3)}
:where(.r1s).bdr .ni:focus-visible{outline:2px solid var(--cy);outline-offset:2px}
:where(.r1s).bdr .ni b{display:block;font-size:.875rem;font-weight:600;padding-right:1.125rem}
:where(.r1s).bdr .ni small{display:block;color:var(--mute);font-size:.78125rem;margin-top:.125rem}
:where(.r1s).bdr .ni.unread::after{content:"";position:absolute;top:18px;right:14px;width:8px;height:8px;border-radius:50%;background:var(--cy);box-shadow:0 0 8px var(--Ls-22d3eee6,rgba(34,211,238,.9))}
:where(.r1s).bdr .ti{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;flex:none}
:where(.r1s).bdr .seeall{display:flex;flex-direction:column;gap:.5rem;margin-top:.25rem}
:where(.r1s).bdr .seeall .btn{width:100%}
:where(.r1s).bdr .seeall small{color:var(--mute);font-size:.78125rem;text-align:center}
@keyframes r1-fadein{from{opacity:0}}
@keyframes r1-drawer{from{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){:where(.r1s).bdr .veil,:where(.r1s).bdr .drawer{animation:none}}
@media (max-width:720px){:where(.r1s).top{padding:0 1rem}}

/* Narrow-width drawer under 980 px. shared-components 11.1 (TradeBack v6 767-773, Member v7 55-60), with the shell
   parts as scope roots. #nmenu (the rail) is the drawer in the member shell, #pubMenu in the public shell. */
:where(.r1v,.r1s) .menub,:where(.r1v,.r1s) .nm-x{display:none}
:where(.r1s).nscrim{position:fixed;inset:0;z-index:65;background:var(--Lf-0405078c,rgba(4,5,7,.55));opacity:0;pointer-events:none;transition:opacity .3s}
body[data-shell=pub] :where(.r1s).nmenu{display:none}
:where(.r1v,.r1s) .nm-head{display:flex;align-items:center;gap:.625rem;min-height:44px;padding-right:2.75rem}
:where(.r1v,.r1s) .nm-head .brand{display:flex;align-items:center;gap:.625rem;text-decoration:none;font:700 1.1875rem/1 var(--disp);letter-spacing:.04em}
:where(.r1v,.r1s) .nm-links{display:flex;flex-direction:column;gap:.125rem}
:where(.r1v,.r1s) .nm-links a{position:relative;display:flex;align-items:center;gap:.75rem;height:44px;padding:0 .75rem;border-radius:10px;color:var(--ink2);text-decoration:none;font:500 .9375rem/1 var(--text)}
:where(.r1v,.r1s) .nm-links a .i{width:18px;height:18px;flex:none}
:where(.r1v,.r1s) .nm-links a:hover{background:var(--Lf-ffffff0a,rgba(255,255,255,.04));color:var(--ink)}
:where(.r1v,.r1s) .nm-links a[aria-current]{background:linear-gradient(90deg,var(--Lf-f8313e29,rgba(248,49,62,.16)),var(--Lf-f8313e08,rgba(248,49,62,.03)) 70%);color:var(--ink)}
:where(.r1v,.r1s) .nm-links a[aria-current]::before{content:"";position:absolute;left:-.875rem;top:.625rem;bottom:.625rem;width:.1875rem;border-radius:0 3px 3px 0;background:var(--red)}
:where(.r1v,.r1s) .nm-acts{display:flex;flex-direction:column;gap:.75rem;padding-top:1rem;box-shadow:inset 0 1px 0 var(--Ls-ffffff0f,rgba(255,255,255,.06))}
:where(.r1v,.r1s) .nm-acts .nb,:where(.r1v,.r1s) .nm-acts .qb{width:100%}
:where(.r1v,.r1s) .nm-foot{margin-top:auto;display:flex;flex-wrap:wrap;gap:.375rem .875rem;font-size:.8125rem;color:var(--mute)}
:where(.r1v,.r1s) .nm-foot a{color:var(--ink2);text-decoration:none}
/* the Light or Dark mode button sits with the links and looks like them */
:where(.r1v,.r1s) .nm-foot button{all:unset;cursor:pointer;color:var(--ink2)}
:where(.r1v,.r1s) .nm-foot button:hover{color:var(--ink)}
@media (max-width:980px){
  :where(.r1v,.r1s) .menub{display:grid}
  :where(.r1v,.r1s) .nm-x{display:grid;position:absolute;top:.875rem;right:.75rem;z-index:1}
  body.navopen{overflow:hidden}
  body.navopen :where(.r1s).nscrim{opacity:1;pointer-events:auto}
  /* The member shell is its own layer (z-index 1), which kept its drawer under the page-level backdrop: let the drawer
     stack against the backdrop while the menu is open (3rd live pass, 30 Oct: drawer links could not be tapped). */
  body.navopen[data-shell=mem] #memShell{z-index:auto}
  /* The caster pages draw their own menu and backdrop (r1-cast.css .c7 .nscrim): the page-level one stays hidden there, or it
     sits on top of the caster menu (4th live pass P2: caster menu links could not be tapped at phone width). */
  body.navopen[data-shell=cast] :where(.r1s).nscrim{opacity:0;pointer-events:none}
  :where(.r1s).nmenu{box-sizing:border-box;position:fixed;top:0;bottom:0;left:0;z-index:70;width:min(320px,86vw);height:100vh;height:100dvh;display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:1.125rem;padding:1.125rem .875rem;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;background:linear-gradient(180deg,var(--Lf-111419fa,rgba(17,20,25,.98)),var(--Lf-0c0e12fa,rgba(12,14,18,.98)));box-shadow:1px 0 0 var(--Ls-ffffff0f,rgba(255,255,255,.06));backdrop-filter:none;transform:translateX(-105%);visibility:hidden;transition:transform .45s cubic-bezier(.3,1.3,.45,1),box-shadow .3s,visibility 0s linear .45s}
  body.navopen :where(.r1s).nmenu{transform:none;visibility:visible;box-shadow:24px 0 60px var(--Ls-0000008c,rgba(0,0,0,.55));transition:transform .45s cubic-bezier(.3,1.3,.45,1),box-shadow .3s,visibility 0s}
  body[data-shell=pub] :where(.r1s).nmenu{display:flex}
  body[data-shell=pub] :where(.r1s).bar .links,body[data-shell=pub] :where(.r1s).bar .signin{display:none}
  :where(.r1s).rail.nmenu .me{display:flex}
  :where(.r1s).rail.nmenu .navg>p{display:block}
  :where(.r1s).rail.nmenu .brand b{display:inline}
  :where(.r1s).rail.nmenu .navg,:where(.r1s).rail.nmenu .railfoot{flex-direction:column;gap:.125rem;margin:0}
  :where(.r1s).rail.nmenu .railfoot{margin-top:auto}
  :where(.r1s).rail.nmenu .nav{height:44px;white-space:normal}
  :where(.r1s).rail.nmenu .nav[aria-current]::before{left:-.875rem;right:auto;top:.625rem;bottom:.625rem;width:.1875rem;height:auto;border-radius:0 3px 3px 0}
  :where(.r1s).top .menub{order:-1}
}
@media (prefers-reduced-motion:reduce){:where(.r1s).nmenu,:where(.r1s).nscrim{transition:none!important}}

/* Public footer. Public Site v7 L336-340, L757-758 and L1670-1680 (the R6 line is section 17 above; the R42 line is .exn). */
footer:where(.r1s){padding:2.5rem 0 2.125rem;background:var(--bg)}
footer:where(.r1s) .name{font:700 min(calc((100vw - 2 * var(--gut)) / 5.6),204px)/.8 var(--disp);letter-spacing:-.03em;white-space:nowrap;color:var(--ink)}
footer:where(.r1s) .row{display:flex;justify-content:space-between;gap:1.25rem;flex-wrap:wrap;color:var(--mute);font-size:.875rem;border-top:1px solid var(--Ll-ffffff12,rgba(255,255,255,.07));padding-top:1.25rem;margin-top:2.125rem}
footer:where(.r1s) .row a{color:var(--ink2);text-decoration:none;overflow-wrap:anywhere}
footer:where(.r1s) .row > span{min-width:0;overflow-wrap:anywhere}
footer:where(.r1s) .ulegal{margin-top:.875rem}
footer:where(.r1s) .exn{margin-top:1rem;color:var(--mute);font-size:.8125rem}
:where(.r1v,.r1s) .fcols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem;margin-top:2.125rem}
:where(.r1v,.r1s) .fcols nav{display:flex;flex-direction:column;gap:.5625rem;font-size:.90625rem}
:where(.r1v,.r1s) .fcols nav b{font:600 .6875rem/1.2 var(--disp);letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-bottom:.25rem}
:where(.r1v,.r1s) .fcols a,:where(.r1v,.r1s) .fcols button{all:unset;cursor:pointer;color:var(--ink2);text-decoration:none;width:max-content;max-width:100%}
:where(.r1v,.r1s) .fcols a:hover,:where(.r1v,.r1s) .fcols button:hover{color:var(--ink);text-decoration:underline;text-decoration-color:var(--t-red,var(--red));text-underline-offset:3px}
:where(.r1v,.r1s) .fcols a:focus-visible,:where(.r1v,.r1s) .fcols button:focus-visible{outline:2px solid var(--cy);outline-offset:3px}
/* Tap targets: footer links reach 24px through 1px of padding (layout and spacing unchanged), accordion headers are at least 24px tall. */
:where(.r1v,.r1s) .fcols a,:where(.r1v,.r1s) .fcols button{padding-block:1px;box-sizing:content-box}
summary{min-height:24px}
@media (max-width:980px){:where(.r1v,.r1s) .fcols{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---- 5.9 Phone tap targets and text zoom (audit 43, P4) ---- */
/* Phones (up to 600px): footer links, the Class chart steps, checkboxes and button pills get a real tap size. Desktop sizes are unchanged.
   Text zoom: the Class chart scrolls inside its own box, and tables that are wider than a phone scroll inside their own wrapper. */
@media (max-width:600px){
  :where(.r1v,.r1s) .fcols{grid-template-columns:repeat(auto-fit,minmax(min(100%,9rem),1fr))}
  :where(.r1v,.r1s) .fcols nav{gap:0;min-width:0}
  footer:where(.r1s) .row a{display:inline-flex;align-items:center;min-height:44px}
  :where(.r1v,.r1s) .fcols nav b{margin-bottom:.375rem}
  :where(.r1v,.r1s) .fcols a,:where(.r1v,.r1s) .fcols button{display:flex;align-items:center;min-height:44px;min-width:44px;box-sizing:border-box;overflow-wrap:anywhere}
  :where(.r1s) .pill:is(button,a,[role=button]),:where(.r1v) .pill:is(button,a,[role=button]){min-height:32px}
  .r1v .ck .box,.r1s .ck .box{width:24px;height:24px}
  .r1v .ck input,.r1s .ck input{width:24px;height:24px}
  .r1v .ck:not(.consent) input,.r1s .ck:not(.consent) input{margin-top:-12px}
  .r1v.c7 .ck input,.r1s.c7 .ck input{margin:0}
  input[type="checkbox"]{width:24px;height:24px}
  .r1v .stairw .stair{grid-template-columns:repeat(31,24px);gap:.25rem;overflow-x:auto;overflow-y:hidden;padding-top:1.25rem;-webkit-overflow-scrolling:touch}
  .r1v .stairw .stair button{min-width:24px}
}

/* ---- 6. Light mode, week of 26 Oct (G14) ---- */
/* Light mode (G14, built 24 Oct 2026). The same colour roles as dark (G1), in shades that pass WCAG 2.2 AA on light
   surfaces. Fills keep the bright accent where dark text sits on them (red primary 5.2:1, cyan 5.3:1); lines and rings use
   a shade that reaches 3:1 on white; text gets its own darker shade through the --t-* tokens (tools/light-layer.cjs
   rewrites var(--cy) in a color: declaration to var(--t-cy,var(--cy)), so dark is unchanged). Every hard-coded colour in
   the area files gets its light value from the generated block at the end of each file. Parts listed in
   tools/light-islands.json (art, video, broadcast graphics) keep the dark set. */
:root[data-theme="light"]{color-scheme:light}
/* Dark text shades: red and Class blue text on the dark panels (#1B1F26) only reach 4.4:1 and 3.6:1, so text uses the
   lighter shades in dark too; fills and lines keep G1's red and blue. */
.r1v,.r1s{--t-red:var(--redt);--t-red2:var(--redt);--t-blue:#6F9DFF}
:root[data-theme="light"] :where(.r1v,.r1s){
  --bg:#EEF1F5;--rail:#FFFFFF;
  --s1:#FFFFFF;--s1b:#FAFBFC;--s2:#F5F7FA;--s3:#E9ECF1;--s4:#DDE2E9;
  --well:#EEF1F5;--quiet:var(--s3);
  --ink:#12151A;--ink2:#3A414D;--mute:#555E6C;--ph:#5F6878;--on-fill:#0A0B0D;
  --red:#F8313E;--redt:#B8141F;--redi:#A3121C;--redlo:#B91F2A;
  --cy:#0891B2;--cyhi:#0E7490;--cyi:#0B5F75;--cylo:#0E7490;
  --blue:#3A7FFF;--bluei:#1F4FB0;
  --green:#1E9E5A;--greeni:#11683A;
  --amber:#B97E00;--amberi:#7A5000;
  --pink:#E2338A;--pinki:#A3165E;
  --tb:#3277FE;
  --t-cy:#0E7490;--t-cyan:#0E7490;--t-data:#0E7490;--t-red:#B8141F;--t-red2:#B8141F;--t-green:#137A43;--t-amber:#8A5A00;--t-blue:#1F5FD6;--t-pink:#B0186A;--t-loss:#B0186A;
  --hl:inset 0 1px 0 rgba(255,255,255,.7);
  --edge:0 0 0 1px rgba(18,21,26,.09);
  --lift:0 1px 2px rgba(15,20,30,.08),0 14px 32px -18px rgba(15,20,30,.28);
}
/* the backdrop: the same map texture, inverted to dark lines on paper, and the two brand glows kept faint */
:root[data-theme="light"] :where(.r1s).backdrop{background:
  radial-gradient(900px 520px at 18% -8%,rgba(58,127,255,.10),transparent 70%),
  radial-gradient(760px 480px at 100% 0%,rgba(248,49,62,.07),transparent 70%)}
:root[data-theme="light"] :where(.r1s).backdrop::before{filter:invert(1);mix-blend-mode:multiply;opacity:.16}
/* the round clock phase word takes its phase colour 30% darker so it reads on the light bar */
:root[data-theme="light"] :where(.r1s).bar .clock .ph{color:color-mix(in srgb,var(--pc) 70%,#000)}

/* Account state bar (24 Oct 2026, app.js stateBar): waiting for a guardian, restricted, banned, no age given. Tokens only. */
:where(.r1v,.r1s) .acctbar,.acctbar{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;margin:.5rem 0 0;padding:.625rem .875rem;border-radius:8px;background:var(--s2);box-shadow:inset 3px 0 0 var(--red);color:var(--ink);font-size:.875rem;line-height:1.4}
.acctbar span{flex:1 1 16rem;min-width:0}
.acctbar a{font-weight:700;white-space:nowrap}
/* A text-link button (Change, Mute, Block): link look, no button chrome. Underline on hover and keyboard focus keeps the ring. */
:where(.r1v,.r1s) button.tl{background:none;border:0;padding:0;margin:0;font:inherit;color:var(--ink2);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--t-red,var(--red));cursor:pointer}
:where(.r1v,.r1s) button.tl:hover{color:var(--ink)}
/* ---------- Legal ops (js/ops.js, 25 Oct 2026): owner No-stream list, Round One fees, invoices and receipts ---------- */
.lo-mute{color:var(--mute);font-size:.875rem;margin:.375rem 0}
.lo-err{color:var(--redt);margin:.5rem 0}
.lo-warn{color:var(--amber);margin:.5rem 0}
.lo-n{text-align:right;white-space:nowrap}
.lo-links{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:.75rem 0}
.lo-acts{white-space:nowrap}
.lo-acts>*{margin-right:.375rem}
.lo-form{margin:1rem 0;padding:1rem;border-radius:12px;background:var(--s2);box-shadow:var(--edge)}
/* The owners' invoice maker and invoice search (30 Oct 2026) */
.lo-make{margin:1rem 0;border-radius:12px;background:var(--s2);box-shadow:var(--edge)}
.lo-make>summary{display:flex;flex-wrap:wrap;gap:.25rem .75rem;align-items:baseline;padding:.875rem 1rem;cursor:pointer;min-height:24px}
.lo-make>.lo-form{margin:0;box-shadow:none;padding-top:0}
.lo-tot2{display:flex;justify-content:space-between;align-items:baseline;margin:.75rem 0;padding-top:.75rem;border-top:1px solid var(--line)}
.lo-tot2 b{font-size:1.25rem}
.lo-invs{margin:1rem 0 .5rem;max-width:34rem}
.lo-form h3{margin:0 0 .5rem;font-size:1rem}
.lo-fg{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.75rem}
.lo-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin:.75rem 0}
.lo-chip{display:flex;flex-direction:column;min-width:96px;padding:.5rem .875rem;border-radius:10px;background:var(--s2);box-shadow:var(--edge);color:var(--mute);font-size:.8125rem}
.lo-chip b{color:var(--ink);font-size:1.25rem}
.lo-places{border:0;margin:1rem 0;padding:0;min-width:0}
.lo-places legend{font-weight:600;padding:0;margin-bottom:.5rem}
.lo-grp{margin:.75rem 0 .375rem;color:var(--ink2);font-weight:600}
.lo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.25rem .75rem}
.lo-cb{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:var(--ink2)}
.lo-sub td{color:var(--mute);font-size:.8125rem}
.lo-inv{margin:1rem 0}
.lo-invh{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem}
.lo-invh span{margin-left:.625rem;color:var(--ink2)}
.lo-calc{margin:.75rem 0}
.lo-calc>div{display:flex;justify-content:space-between;gap:1rem;padding:.375rem 0;border-bottom:1px solid var(--line)}
.lo-calc dt{color:var(--ink2)}
.lo-calc dt small{display:block;color:var(--mute);font-size:.8125rem}
.lo-calc dd{margin:0;white-space:nowrap}
.lo-calc .lo-tot{font-weight:700;border-bottom:0}
.lo-teams h3{margin:1rem 0 .5rem;font-size:1rem}
.lo-teams ul{list-style:none;margin:0;padding:0}
.lo-teams li{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.5rem 0;border-bottom:1px solid var(--line)}
.lo-teams li .lo-form{flex-basis:100%}
.lo-tn{font-weight:600}
.lo-rf{color:var(--mute);font-size:.875rem}
.lo-late ul{margin:.5rem 0 0;padding-left:1.25rem;color:var(--ink2)}
.lo-bar{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1rem}
.lo-print{max-width:820px;margin:0 auto;padding:1.5rem clamp(1rem,4vw,2.5rem);border-radius:12px;background:var(--s1);box-shadow:var(--edge);color:var(--ink);overflow-wrap:anywhere}
.lo-hd{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-bottom:1.25rem}
.lo-co h1{margin:0 0 .25rem;font-size:1.5rem}
.lo-co p,.lo-meta p,.lo-blk p{margin:.125rem 0}
.lo-meta{text-align:right}
.lo-meta h2{margin:0 0 .25rem;font-size:1.25rem;text-transform:uppercase;letter-spacing:.06em}
.lo-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
.lo-blk{margin:1rem 0}
.lo-blk h3{margin:0 0 .25rem;font-size:.8125rem;text-transform:uppercase;letter-spacing:.06em;color:var(--mute)}
.lo-blk ul{margin:.25rem 0;padding-left:1.25rem}
/* The owner console does not load the member area's .tblwrap; its tables scroll inside the card at phone width. */
#loOwner{min-width:0;max-width:100%}
#loOwner .tblwrap{position:relative;overflow-x:auto;max-width:100%}
#loOwner .osec{min-width:0}
.lo-tb{width:100%;border-collapse:collapse;margin:1rem 0}
.lo-tb th,.lo-tb td{padding:.5rem .5rem;border-bottom:1px solid var(--line-2);text-align:left;vertical-align:top}
.lo-tb th.lo-n,.lo-tb td.lo-n{text-align:right}
.lo-tb td small{display:block;color:var(--mute);font-size:.8125rem}
.lo-tb .lo-tot td{font-weight:700;font-size:1.0625rem}
.lo-paidline{font-weight:700;margin:1rem 0}
.lo-sign{margin-top:2.5rem}
.lo-line{display:block;border-bottom:1px solid var(--ink);width:260px;max-width:100%;height:1.75rem}
.lo-sig{height:3rem}
.lo-sr{display:flex;align-items:flex-end;gap:.75rem;margin-top:1rem}
.lo-sr .lo-line{flex:0 1 260px}
@media (max-width:520px){.lo-meta{text-align:left}.lo-calc>div{flex-direction:column;gap:.125rem}.lo-calc dd{white-space:normal}}
@media print{
  body *{visibility:hidden}
  .lo-print,.lo-print *{visibility:visible}
  .lo-print{position:absolute;left:0;top:0;width:100%;max-width:none;margin:0;padding:0;border-radius:0;box-shadow:none;background:#fff;color:#000}
  .lo-print *{color:#000;border-color:#000}
  .lo-noprint{display:none}
  .lo-line{border-bottom:1px solid #000}
}
.lo-sw{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;padding:.5rem 0;border-bottom:1px solid var(--line)}
.lo-sw>span:first-child{flex:1 1 220px}
.lo-br{margin:.5rem 0}
.lo-br .lo-cb{display:inline-flex;margin-right:1rem}
@supports selector(:has(a)){.lo-brl{display:none}.lo-br:has(input[value="list"]:checked) .lo-brl{display:block}}
.lo-tbl{list-style:none;margin:.5rem 0 0;padding:0}
.lo-tbl li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem 0;border-bottom:1px solid var(--line)}
.lo-notice{line-height:1.6;overflow-wrap:anywhere}
/* ==== Ban list and MOSS files (lo- classes, 25 Oct 2026) ==== */
.lo-bans{list-style:none;margin:0;padding:0;display:grid;gap:.625rem}
.lo-ban{padding:.875rem 1rem;border-radius:12px;background:var(--s2);box-shadow:var(--edge);min-width:0;overflow-wrap:anywhere}
.lo-bh{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem}
.lo-bh b{font-size:1rem}
.lo-bm{color:var(--mute);font-size:.875rem;margin:.25rem 0 0}
.lo-bw{margin:.5rem 0 0}
/* ==== Removals (route /removal and the owner console section ow-rm), classes start with lo- ==== */
.lo-ty[hidden],.lo-hint[hidden]{display:none}
.lo-ty{display:grid;gap:.75rem;margin:.75rem 0;min-width:0}
.lo-form .fgrp{margin:.75rem 0}
.lo-form .inp2,.lo-form .fsel,.lo-form .note{width:100%;max-width:100%;box-sizing:border-box}
.lo-form .lo-cb{align-items:flex-start;line-height:1.4}
.lo-form .lo-cb input{flex:none;margin-top:.2rem}
.lo-hint{margin:.75rem 0;padding:.625rem .875rem;border-radius:10px;background:var(--s2);border-left:3px solid var(--amber);color:var(--ink2)}
.lo-done{margin:1rem 0;padding:1rem;border-radius:12px;background:var(--s2);box-shadow:var(--edge);overflow-wrap:anywhere}
.lo-done:focus{outline:2px solid var(--ink2);outline-offset:2px}
.lo-rmg{margin:1.25rem 0 .5rem;font-size:1rem}
.lo-rm{margin:.75rem 0;padding:1rem;border-radius:12px;background:var(--s2);box-shadow:var(--edge);min-width:0;overflow-wrap:anywhere}
.lo-rm p{margin:.375rem 0}
.lo-rmh{display:flex;flex-wrap:wrap;align-items:center;gap:.375rem .625rem}
.lo-rmd{font-weight:600}
.lo-rml a{overflow-wrap:anywhere;word-break:break-all}
.lo-rmt{color:var(--ink2)}
.lo-rmf{margin:.5rem 0}
.lo-rmf>div{display:flex;flex-wrap:wrap;gap:.25rem .75rem;padding:.25rem 0;border-bottom:1px solid var(--line)}
.lo-rmf dt{color:var(--mute);min-width:8.5rem}
.lo-rmf dd{margin:0;min-width:0;flex:1 1 12rem}
.lo-rm .fsel{width:auto;max-width:100%}
.lo-rmcl{margin:1rem 0}
.lo-rmcl summary{cursor:pointer;font-weight:600}
.lo-rmc{list-style:none;margin:.5rem 0 0;padding:0}
.lo-rmc li{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .75rem;padding:.375rem 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
/* TradeBack launch pop-up (app.js tbLaunchOpen, 25 Oct 2026): the feedback dialog's modal on its own id. Tokens only, no colour values. */
:where(#tbLaunch .r1v) .modal{position:fixed;left:50%;top:50%;width:min(480px,calc(100% - 32px));max-height:calc(100vh - 48px);overflow:auto;transform:translate(-50%,-50%);background:var(--s1);color:var(--ink);border-radius:22px;padding:1.625rem;z-index:11;box-shadow:var(--lift),var(--hl),var(--edge);animation:fbpop .4s var(--e) both;display:flex;flex-direction:column;gap:1.125rem}
:where(#tbLaunch .r1v) .modal h2{font-size:1.5rem}
:where(#tbLaunch .r1v) .mcopy{font-size:.9375rem;color:var(--ink2)}
:where(#tbLaunch .r1v) .foot2{flex:none;display:flex;flex-direction:column;gap:.625rem}
#tbLaunch .foot2 .btn{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;width:100%;height:46px;margin:0;padding:0 1rem;border:0;font-size:.9375rem;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer}
dialog#tbLaunch::backdrop{background:color-mix(in srgb,var(--bg) 70%,transparent);backdrop-filter:blur(3px)}
@media (prefers-reduced-motion:reduce){:where(#tbLaunch .r1v) .modal{animation:none}}

/* ==== LIGHT LAYER (generated by tools/light-layer.cjs; do not edit by hand, edit the tool and run it) ==== */
:root[data-theme="light"]{
  --Lf-000000:#ffffff;
  --Lf-0405078c:rgba(244,246,248,0.55);
  --Lf-040507a8:rgba(244,246,248,0.66);
  --Lf-08090b:#f2f3f5;
  --Lf-08090b0d:rgba(242,243,245,0.05);
  --Lf-08090b59:rgba(242,243,245,0.35);
  --Lf-08090bbf:rgba(242,243,245,0.75);
  --Lf-08090beb:rgba(242,243,245,0.92);
  --Lf-08090bf7:rgba(242,243,245,0.97);
  --Lf-0a0b0dbf:rgba(241,242,244,0.75);
  --Lf-0b0d11:#f0f1f4;
  --Lf-0c0e12eb:rgba(239,241,244,0.92);
  --Lf-0c0e12fa:rgba(239,241,244,0.98);
  --Lf-0d0f13:#eff0f3;
  --Lf-111418:#ffffff;
  --Lf-111419eb:rgba(255,255,255,0.92);
  --Lf-111419fa:rgba(255,255,255,0.98);
  --Lf-121519:#ffffff;
  --Lf-12161b:#ffffff;
  --Lf-13161b:#fefefe;
  --Lf-161a20:#fafbfd;
  --Lf-181c22:#f7f9fe;
  --Lf-1a1e25:#f5f8fd;
  --Lf-1a1e25e6:rgba(245,248,253,0.9);
  --Lf-1b1f26:#f4f7fc;
  --Lf-1b1f26d9:rgba(244,247,252,0.85);
  --Lf-1b1f26f5:rgba(244,247,252,0.96);
  --Lf-211b0f:#fdf9f1;
  --Lf-22d3ee14:rgba(13,151,171,0.08);
  --Lf-22d3ee17:rgba(13,151,171,0.09);
  --Lf-22d3ee1f:rgba(13,151,171,0.12);
  --Lf-22d3ee21:rgba(13,151,171,0.13);
  --Lf-22d3ee3d:rgba(13,151,171,0.24);
  --Lf-22d3eebf:rgba(13,151,171,0.75);
  --Lf-232831:#eceff5;
  --Lf-2347a8:#e7efff;
  --Lf-272011:#f9f4eb;
  --Lf-2a3039:#e5e9ef;
  --Lf-2a5bd0:#2a5bd0;
  --Lf-2e2614:#f5efe4;
  --Lf-3a7fff0f:rgba(57,126,254,0.06);
  --Lf-3a7fff21:rgba(57,126,254,0.13);
  --Lf-3a7fff29:rgba(57,126,254,0.16);
  --Lf-3ddc8424:rgba(0,160,88,0.14);
  --Lf-3ddc8452:rgba(0,160,88,0.32);
  --Lf-4c82f0:#4c82f0;
  --Lf-f8313e08:rgba(242,41,57,0.03);
  --Lf-f8313e17:rgba(242,41,57,0.09);
  --Lf-f8313e29:rgba(242,41,57,0.16);
  --Lf-f8313e4d:rgba(242,41,57,0.3);
  --Lf-ff4da61a:rgba(228,47,143,0.1);
  --Lf-ff4da624:rgba(228,47,143,0.14);
  --Lf-ffc23d26:rgba(171,126,14,0.15);
  --Lf-ffc23d29:rgba(171,126,14,0.16);
  --Lf-ffffff0a:rgba(18,21,26,0.044);
  --Lf-ffffff0d:rgba(18,21,26,0.055);
  --Lf-ffffff0f:rgba(18,21,26,0.066);
  --Lf-ffffff12:rgba(18,21,26,0.077);
  --Ll-ffffff12:rgba(18,21,26,0.088);
  --Ll-ffffff14:rgba(18,21,26,0.1);
  --Ll-ffffff1a:rgba(18,21,26,0.125);
  --Ll-ffffff1f:rgba(18,21,26,0.15);
  --Ls-0000008c:rgba(15,20,30,0.22);
  --Ls-00000099:rgba(15,20,30,0.22);
  --Ls-000000b3:rgba(15,20,30,0.22);
  --Ls-000000d9:rgba(15,20,30,0.22);
  --Ls-000000e6:rgba(15,20,30,0.22);
  --Ls-000000f2:rgba(15,20,30,0.22);
  --Ls-050607:rgba(15,20,30,0.22);
  --Ls-1c2027:rgba(15,20,30,0.22);
  --Ls-1d2229:rgba(15,20,30,0.22);
  --Ls-22d3ee47:rgba(13,151,171,0.196);
  --Ls-22d3ee4d:rgba(13,151,171,0.21);
  --Ls-22d3ee73:rgba(13,151,171,0.315);
  --Ls-22d3ee80:rgba(13,151,171,0.35);
  --Ls-22d3ee8c:rgba(13,151,171,0.385);
  --Ls-22d3ee99:rgba(13,151,171,0.42);
  --Ls-22d3eeb3:rgba(13,151,171,0.49);
  --Ls-22d3eee6:rgba(13,151,171,0.63);
  --Ls-343b46:rgba(15,20,30,0.22);
  --Ls-3a7fff47:rgba(57,126,254,0.196);
  --Ls-3a7fff59:rgba(57,126,254,0.245);
  --Ls-3a7fff99:rgba(57,126,254,0.42);
  --Ls-3ddc8438:rgba(0,160,88,0.154);
  --Ls-3ddc8440:rgba(0,160,88,0.175);
  --Ls-f8313e4d:rgba(242,41,57,0.21);
  --Ls-f8313eb3:rgba(242,41,57,0.49);
  --Ls-f8313ecc:rgba(242,41,57,0.56);
  --Ls-f8313ee6:rgba(242,41,57,0.63);
  --Ls-ff4da64d:rgba(228,47,143,0.21);
  --Ls-ffc23d33:rgba(171,126,14,0.14);
  --Ls-ffc23d40:rgba(171,126,14,0.175);
  --Ls-ffc23d47:rgba(171,126,14,0.196);
  --Ls-ffc23d66:rgba(171,126,14,0.28);
  --Ls-ffc23dcc:rgba(171,126,14,0.56);
  --Ls-ffdc8c1f:rgba(162,129,48,0.084);
  --Ls-ffffff0b:rgba(255,255,255,0.045);
  --Ls-ffffff0d:rgba(255,255,255,0.05);
  --Ls-ffffff0f:rgba(255,255,255,0.06);
  --Ls-ffffff12:rgba(255,255,255,0.07);
  --Ls-ffffff14:rgba(255,255,255,0.08);
  --Ls-ffffff17:rgba(255,255,255,0.09);
  --Ls-ffffff1a:rgba(255,255,255,0.1);
  --Ls-ffffff29:rgba(255,255,255,0.16);
  --Ls-ffffff2e:rgba(255,255,255,0.18);
  --Lt-8a929f:#676767;
  --Lt-e6fbff:#151515;
  --Lt-e9cf98:#77602b;
  --Lt-eaf0ff:#191919;
  --Lt-fbe2ae:#76602f;
  --Lt-ff7a84:#b33445;
  --Lt-ff9aa2:#A3121C;
  --Lt-ffc2c7:#865258;
  --Lt-fff0cf:#6c5f42;
  --Lt-ffffff:#0f0f0f;
}
:root[data-theme="light"] :is(.r1dark){
  --Lf-000000:initial;
  --Lf-0405078c:initial;
  --Lf-040507a8:initial;
  --Lf-08090b:initial;
  --Lf-08090b0d:initial;
  --Lf-08090b59:initial;
  --Lf-08090bbf:initial;
  --Lf-08090beb:initial;
  --Lf-08090bf7:initial;
  --Lf-0a0b0dbf:initial;
  --Lf-0b0d11:initial;
  --Lf-0c0e12eb:initial;
  --Lf-0c0e12fa:initial;
  --Lf-0d0f13:initial;
  --Lf-111418:initial;
  --Lf-111419eb:initial;
  --Lf-111419fa:initial;
  --Lf-121519:initial;
  --Lf-12161b:initial;
  --Lf-13161b:initial;
  --Lf-161a20:initial;
  --Lf-181c22:initial;
  --Lf-1a1e25:initial;
  --Lf-1a1e25e6:initial;
  --Lf-1b1f26:initial;
  --Lf-1b1f26d9:initial;
  --Lf-1b1f26f5:initial;
  --Lf-211b0f:initial;
  --Lf-22d3ee14:initial;
  --Lf-22d3ee17:initial;
  --Lf-22d3ee1f:initial;
  --Lf-22d3ee21:initial;
  --Lf-22d3ee3d:initial;
  --Lf-22d3eebf:initial;
  --Lf-232831:initial;
  --Lf-2347a8:initial;
  --Lf-272011:initial;
  --Lf-2a3039:initial;
  --Lf-2a5bd0:initial;
  --Lf-2e2614:initial;
  --Lf-3a7fff0f:initial;
  --Lf-3a7fff21:initial;
  --Lf-3a7fff29:initial;
  --Lf-3ddc8424:initial;
  --Lf-3ddc8452:initial;
  --Lf-4c82f0:initial;
  --Lf-f8313e08:initial;
  --Lf-f8313e17:initial;
  --Lf-f8313e29:initial;
  --Lf-f8313e4d:initial;
  --Lf-ff4da61a:initial;
  --Lf-ff4da624:initial;
  --Lf-ffc23d26:initial;
  --Lf-ffc23d29:initial;
  --Lf-ffffff0a:initial;
  --Lf-ffffff0d:initial;
  --Lf-ffffff0f:initial;
  --Lf-ffffff12:initial;
  --Ll-ffffff12:initial;
  --Ll-ffffff14:initial;
  --Ll-ffffff1a:initial;
  --Ll-ffffff1f:initial;
  --Ls-0000008c:initial;
  --Ls-00000099:initial;
  --Ls-000000b3:initial;
  --Ls-000000d9:initial;
  --Ls-000000e6:initial;
  --Ls-000000f2:initial;
  --Ls-050607:initial;
  --Ls-1c2027:initial;
  --Ls-1d2229:initial;
  --Ls-22d3ee47:initial;
  --Ls-22d3ee4d:initial;
  --Ls-22d3ee73:initial;
  --Ls-22d3ee80:initial;
  --Ls-22d3ee8c:initial;
  --Ls-22d3ee99:initial;
  --Ls-22d3eeb3:initial;
  --Ls-22d3eee6:initial;
  --Ls-343b46:initial;
  --Ls-3a7fff47:initial;
  --Ls-3a7fff59:initial;
  --Ls-3a7fff99:initial;
  --Ls-3ddc8438:initial;
  --Ls-3ddc8440:initial;
  --Ls-f8313e4d:initial;
  --Ls-f8313eb3:initial;
  --Ls-f8313ecc:initial;
  --Ls-f8313ee6:initial;
  --Ls-ff4da64d:initial;
  --Ls-ffc23d33:initial;
  --Ls-ffc23d40:initial;
  --Ls-ffc23d47:initial;
  --Ls-ffc23d66:initial;
  --Ls-ffc23dcc:initial;
  --Ls-ffdc8c1f:initial;
  --Ls-ffffff0b:initial;
  --Ls-ffffff0d:initial;
  --Ls-ffffff0f:initial;
  --Ls-ffffff12:initial;
  --Ls-ffffff14:initial;
  --Ls-ffffff17:initial;
  --Ls-ffffff1a:initial;
  --Ls-ffffff29:initial;
  --Ls-ffffff2e:initial;
  --Lt-8a929f:initial;
  --Lt-e6fbff:initial;
  --Lt-e9cf98:initial;
  --Lt-eaf0ff:initial;
  --Lt-fbe2ae:initial;
  --Lt-ff7a84:initial;
  --Lt-ff9aa2:initial;
  --Lt-ffc2c7:initial;
  --Lt-fff0cf:initial;
  --Lt-ffffff:initial;
}
/* islands keep the dark tokens (section 1) */
:root[data-theme="light"] :is(.r1dark){color-scheme:dark;color:var(--ink);
  --bg:#08090B;--rail:#0D0F13;
  --s1:#13161B;--s1b:#171B21;--s2:#1B1F26;--s3:#232831;--s4:#2D333E;
  --well:#0F1216;--quiet:var(--s3);
  --ink:#F5F6F8;--ink2:#CDD2DA;--mute:#A0A8B5;--ph:#949CAA;--on-fill:#0A0B0D;
  --red:#F8313E;--redt:#FF5A66;--redi:#FF9AA2;--redlo:#B91F2A;
  --cy:#22D3EE;--cyhi:#67E8F9;--cyi:#A5F3FC;--cylo:#0891B2;
  --blue:#3A7FFF;--bluei:#9FBEFF;
  --green:#3DDC84;--greeni:#8DEDB9;
  --amber:#FFC23D;--amberi:#FFDB8A;
  --pink:#FF4DA6;--pinki:#FF86C2;
  --tb:#3277FE;
  --hl:inset 0 1px 0 rgba(255,255,255,.06);
  --edge:0 0 0 1px rgba(255,255,255,.045);
  --lift:0 1px 2px rgba(0,0,0,.4),0 18px 40px -18px rgba(0,0,0,.75);
  --e:cubic-bezier(.22,1,.36,1);--spring:cubic-bezier(.34,1.56,.64,1);
  --disp:'Chakra Petch',system-ui,sans-serif;
  --text:'Geist',system-ui,sans-serif;
  --mono:'Geist Mono',ui-monospace,'Cascadia Mono',Consolas,monospace;
  /* the shell backdrop (img/bg/IMAGE-SOURCES.md) and the public page width and gutter (Public Site v7 L16) */
  --bgimg:url(/img/bg/backdrop-texture.webp);--gut:clamp(16px,4vw,48px);--max:1240px;
  /* aliases, so older rules in each file keep working */
  --cyan:var(--cy);--data:var(--cy);--datai:var(--cyi);--loss:var(--pink);--accent:var(--red);--red2:var(--red);
}
/* ==== END LIGHT LAYER ==== */
.clst{margin-left:.35em;font-size:.85em;opacity:.75;white-space:nowrap}
/* Touch targets of at least 24 px that E's round 2 pass still found (e2e audit 2 MOB-02). Inline links inside sentences are exempt. */
:where(.r1v) button.c2link,:where(.r1v) .tzline a,:where(.r1v) .etm a,:where(.r1v) .ecrumb a,:where(.r1v) a.qcode{display:inline-flex;align-items:center;min-height:24px}
:where(.r1v) #ozPostNote,:where(.r1v) #ozUncl,:where(.r1v) [id^="sfBribe-"],:where(.r1v) #rmEsCrewOut{width:24px;height:24px;flex:none}
:where(.r1v) input[type="range"]{min-height:24px}
/* The rest (fix phase 3): player page team and history links, caster page "Change" and "more" links. */
:where(.r1v) .pp8 .pname p>a,:where(.r1v) :is(#pp-career,#pp-hist) a,:where(.r1v) .tzl .lnkx,:where(.r1v) a.more{display:inline-flex;align-items:center;min-height:24px}

/* Round One date picker (js/datepick.js; Jai 26 Oct 2026). Painted on <body> with class r1s, so .dp is a scope root.
   Range ends in red, the days between on a red band, today ringed. Two months from 720 px, a bottom sheet below. */
input[type="date"]::-webkit-calendar-picker-indicator,input[type="datetime-local"]::-webkit-calendar-picker-indicator{display:none}
input[type="date"],input[type="datetime-local"]{cursor:pointer;padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23F8313E' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px}
input[type="date"]:disabled,input[type="datetime-local"]:disabled{cursor:not-allowed;background-image:none;padding-right:revert}
:where(.r1s).dp{position:fixed;inset:0;z-index:1000;font-family:var(--text);color:var(--ink)}
:where(.r1s).dp .dp-veil{position:absolute;inset:0;background:transparent}
:where(.r1s).dp .dp-pop{position:fixed;box-sizing:border-box;width:min(640px,calc(100vw - 24px));padding:16px;border-radius:14px;background:linear-gradient(180deg,var(--s2),var(--s1));box-shadow:var(--lift),var(--edge),0 0 0 1px var(--line-2,rgba(255,255,255,.12));animation:dpIn .22s var(--e) both}
:where(.r1s).dp .dp-pop.dp-sheet{left:0;right:0;bottom:0;top:auto;width:100%;max-height:92vh;overflow:auto;border-radius:18px 18px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom));animation:dpUp .28s var(--e) both}
:where(.r1s).dp:has(.dp-sheet) .dp-veil{background:rgba(4,5,7,.6);backdrop-filter:blur(2px)}
@keyframes dpIn{from{opacity:0;transform:translateY(-6px)}}
@keyframes dpUp{from{transform:translateY(100%)}}
:where(.r1s).dp .dp-tabs{display:flex;gap:8px;margin-bottom:10px}
:where(.r1s).dp .dp-tab{flex:1;display:flex;flex-direction:column;gap:2px;align-items:flex-start;padding:9px 12px;border-radius:10px;border:1px solid var(--s4);background:var(--s1);color:var(--ink);font:inherit;text-align:left;cursor:pointer}
:where(.r1s).dp div.dp-tab{cursor:default}
:where(.r1s).dp .dp-tab small{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
:where(.r1s).dp .dp-tab b{font-family:var(--disp);font-size:15px;font-weight:600}
:where(.r1s).dp .dp-tab.on{border-color:var(--red);box-shadow:inset 0 -2px 0 var(--red)}
:where(.r1s).dp .dp-q{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 6px}
:where(.r1s).dp .dp-chip{min-height:28px;padding:0 12px;border-radius:999px;border:1px solid var(--s4);background:var(--s1);color:var(--ink);font:600 12px/1 var(--text);cursor:pointer}
:where(.r1s).dp .dp-chip:hover{border-color:var(--red)}
:where(.r1s).dp .dp-hint{font-size:12px;color:var(--mute)}
:where(.r1s).dp .dp-nav{position:relative;height:0}
:where(.r1s).dp .dp-arrow{position:absolute;top:4px;width:32px;height:32px;border-radius:8px;border:1px solid var(--s4);background:var(--s1);color:var(--ink);font:600 20px/1 var(--text);cursor:pointer;z-index:1}
:where(.r1s).dp .dp-arrow:hover{border-color:var(--red);color:var(--redt)}
:where(.r1s).dp .dp-arrow[data-dp-mv="-1"]{left:0}
:where(.r1s).dp .dp-arrow[data-dp-mv="1"]{right:0}
:where(.r1s).dp .dp-ms{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
:where(.r1s).dp .dp-m{min-width:0}
:where(.r1s).dp .dp-mt{height:40px;display:flex;align-items:center;justify-content:center;font:700 15px/1 var(--disp);letter-spacing:.04em;text-transform:uppercase}
:where(.r1s).dp .dp-wd,:where(.r1s).dp .dp-g{display:grid;grid-template-columns:repeat(7,1fr)}
:where(.r1s).dp .dp-wd span{text-align:center;font-size:11px;font-weight:600;color:var(--mute);padding:4px 0}
:where(.r1s).dp .dp-c{position:relative;height:38px;margin:1px 0;border:0;background:transparent;color:var(--ink);font:500 14px/1 var(--text);cursor:pointer;border-radius:999px}
:where(.r1s).dp .dp-out{cursor:default}
:where(.r1s).dp button.dp-c:hover:not(:disabled){background:var(--s3)}
:where(.r1s).dp .dp-c:disabled{color:var(--mute);opacity:.45;cursor:not-allowed}
:where(.r1s).dp .dp-c.dp-today{box-shadow:inset 0 0 0 1px var(--mute)}
:where(.r1s).dp .dp-c.dp-in{border-radius:0;background:var(--red-bg,rgba(248,49,62,.14))}
:where(.r1s).dp .dp-c.dp-rs{border-radius:999px 0 0 999px;background:linear-gradient(90deg,transparent 50%,var(--red-bg,rgba(248,49,62,.14)) 50%)}
:where(.r1s).dp .dp-c.dp-re{border-radius:0 999px 999px 0;background:linear-gradient(90deg,var(--red-bg,rgba(248,49,62,.14)) 50%,transparent 50%)}
:where(.r1s).dp .dp-c.dp-lo::after,:where(.r1s).dp .dp-c.dp-hi::after{content:"";position:absolute;inset:0;margin:auto;width:38px;height:38px;border-radius:999px;background:var(--red);z-index:-1}
:where(.r1s).dp .dp-c.dp-lo,:where(.r1s).dp .dp-c.dp-hi{color:#fff;font-weight:700;z-index:0;isolation:isolate}
:where(.r1s).dp .dp-c.dp-prev::after{background:transparent;box-shadow:inset 0 0 0 2px var(--red)}
:where(.r1s).dp .dp-c.dp-prev{color:var(--ink)}
:where(.r1s).dp .dp-c:focus-visible{outline:2px solid var(--cy);outline-offset:1px}
:where(.r1s).dp .dp-times{display:flex;gap:12px;margin-top:12px;padding-top:12px;border-top:1px solid var(--s4)}
:where(.r1s).dp .dp-time{flex:1;display:flex;flex-direction:column;gap:4px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
:where(.r1s).dp .dp-time input{min-height:38px;padding:0 10px;border-radius:8px;border:1px solid var(--s4);background:var(--s1);color:var(--ink);font:500 14px/1 var(--text);color-scheme:inherit}
:where(.r1s).dp .dp-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
:where(.r1s).dp .dp-btn{min-height:36px;padding:0 18px;border-radius:9px;border:1px solid var(--red);background:var(--red);color:#fff;font:700 13px/1 var(--disp);letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
:where(.r1s).dp .dp-btn.ghost{background:transparent;color:var(--ink);border-color:var(--s4)}
:where(.r1s).dp .dp-btn:focus-visible,:where(.r1s).dp .dp-tab:focus-visible,:where(.r1s).dp .dp-chip:focus-visible,:where(.r1s).dp .dp-arrow:focus-visible{outline:2px solid var(--cy);outline-offset:2px}
@media (prefers-reduced-motion:reduce){:where(.r1s).dp .dp-pop{animation:none}}
/* The storage notice is fixed at the bottom: sticky save bars ride above it until it is closed (layout pass 29 Oct 2026). */
body.has-notice .savebar,body.has-notice .c3save.avsave,body.has-notice .og-save,body.has-notice .zgsave{bottom:calc(var(--nb,0px) + .75rem)}
