/* Layout "Opção 3": a light, newspaper-style sports design (cream paper, thick black outlines, hard shadows, orange highlight).
   styles.css stays untouched; every rule is scoped to <html data-layout="c"> (set by layout.js). The 3D arena stays dark on purpose: it is the "photo" of the page. */

/* ---------- tokens ---------- */
:root[data-layout="2"]{
  --paper:#f3eee3; --ink:#16130f; --bg:#f3eee3; --bg2:#ebe4d4; --card:#fffdf8; --card2:#f7f2e6; --line:#16130f;
  --txt:#16130f; --mut:#5a5348; --green:#0d8a54;
  /* highlight colour: fill + the text that sits on it + a darker version for text on paper + a pale tint. Change these four lines to recolour the whole page. */
  --accent:#ffd23f; --on-accent:#16130f; --accent-text:#6f4b00; --accent-soft:#fff1b8; --accent-rgb:255,210,63;
  --lib:#0d8a54; --sul:#1f6feb; --rel:#e11d48; --up:#0d8a54; --down:#e11d48;
  --head:'Archivo',Inter,system-ui,sans-serif; --hard:4px 4px 0 var(--ink);
  color-scheme:light;
}
:root[data-layout="2"] body{background:var(--paper);color:var(--ink);
  background-image:radial-gradient(rgba(22,19,15,.13) 1px,transparent 1.4px);background-size:22px 22px;background-attachment:scroll}
:root[data-layout="2"] body::before,:root[data-layout="2"] .glow,:root[data-layout="2"] #bg{display:none}
:root[data-layout="2"] ::selection{background:var(--accent);color:var(--on-accent)}
:root[data-layout="2"] .wrap{max-width:1160px}

/* ---------- typography ---------- */
:root[data-layout="2"] h1,:root[data-layout="2"] .page-head h1{font-family:var(--head);font-weight:900;letter-spacing:-.045em;line-height:.9;color:var(--ink)}
:root[data-layout="2"] h2,:root[data-layout="2"] .sim-th h2{font-family:var(--head);font-weight:900;font-size:26px;letter-spacing:-.03em;text-transform:uppercase;color:var(--ink);padding-bottom:8px}
:root[data-layout="2"] h2::after{height:5px;width:100%!important;max-width:64px;border-radius:0;background:var(--accent);transition:none}
:root[data-layout="2"] .b2-roundtitle h3,:root[data-layout="2"] .b2-leaguehead h3,:root[data-layout="2"] .b2-cmp h3,:root[data-layout="2"] .b2-lgintro h3,
:root[data-layout="2"] .pf-h,:root[data-layout="2"] .sim-final h3,:root[data-layout="2"] .bl-dialog h3{font-family:var(--head);font-weight:800;letter-spacing:-.02em;color:var(--ink)}
:root[data-layout="2"] .sub,:root[data-layout="2"] .hint{color:var(--mut)}

/* ---------- navigation: a floating bar, centred ---------- */
:root[data-layout="2"] .topnav{position:sticky;top:10px;z-index:60;max-width:1160px;margin:12px auto 0;padding:8px 10px 8px 16px;border:2px solid var(--ink);border-radius:18px;background:#fffdf8;box-shadow:var(--hard);
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px}
:root[data-layout="2"] .topnav .brand{color:var(--ink)}
:root[data-layout="2"] .topnav .brand .logo{filter:none}
:root[data-layout="2"] .topnav .brand .bn{font:900 17px/1 var(--head);letter-spacing:-.03em;text-transform:uppercase;color:var(--ink)}
:root[data-layout="2"] .topnav .brand .bn b{color:var(--accent-text)}
:root[data-layout="2"] .topnav .links{justify-self:center;gap:2px;padding:3px;border:2px solid var(--ink);border-radius:12px;background:var(--card2)}
:root[data-layout="2"] .topnav .links a{border-radius:8px;padding:7px 15px;font-size:13.5px;font-weight:800;color:var(--ink);letter-spacing:-.01em}
:root[data-layout="2"] .topnav .links a:hover{background:rgba(22,19,15,.08);color:var(--ink)}
:root[data-layout="2"] .topnav .links a[aria-current=page]{background:var(--ink);color:#fffdf8}
:root[data-layout="2"] .topnav .acct{justify-self:end}
@media (max-width:760px){
  :root[data-layout="2"] .topnav{grid-template-columns:1fr auto;margin:8px 10px 0;row-gap:8px;padding:8px 10px}
  :root[data-layout="2"] .topnav .links{grid-column:1/-1;order:3;justify-self:stretch;display:flex;width:auto}
  :root[data-layout="2"] .topnav .links a{flex:1;text-align:center;padding:7px 4px;font-size:12px}
}

/* ---------- hero ---------- */
:root[data-layout="2"] .hero{padding:50px 0 12px}
:root[data-layout="2"] .hero h1{font-size:clamp(30px,10.4vw,138px);text-transform:uppercase}
:root[data-layout="2"] .hero h1 .line.accent{animation:rise .9s var(--ease) .12s both;padding:.02em .16em 0;background:var(--accent);color:var(--on-accent);transform:rotate(-1.4deg);box-shadow:6px 6px 0 var(--ink);border:3px solid var(--ink)}
:root[data-layout="2"] .live-pill{background:#fffdf8;border:2px solid var(--ink);color:var(--ink);font-weight:700;box-shadow:3px 3px 0 var(--ink);backdrop-filter:none}
:root[data-layout="2"] .live-pill.on{color:var(--ink)}
:root[data-layout="2"] .hero .sub{color:var(--mut);font-size:16px;font-weight:500}
:root[data-layout="2"] .stat{background:#fffdf8;border:2px solid var(--ink);border-radius:16px;box-shadow:var(--hard);backdrop-filter:none}
:root[data-layout="2"] .stat:nth-child(1){background:#ffe27a}
:root[data-layout="2"] .stat:nth-child(2){background:#ffd2bd}
:root[data-layout="2"] .stat:nth-child(3){background:#c9ecd9}
:root[data-layout="2"] .stat:nth-child(4){background:#d4e4ff}
:root[data-layout="2"] .stat:hover{border-color:var(--ink);box-shadow:6px 6px 0 var(--ink);transform:translate(-2px,-2px)}
:root[data-layout="2"] .stat small{color:rgba(22,19,15,.65);font-weight:700}
:root[data-layout="2"] .stat b{font-family:var(--head);font-weight:800;color:var(--ink)}
:root[data-layout="2"] .stat span{color:var(--ink)}

/* ---------- cards, boards, controls ---------- */
:root[data-layout="2"] section{margin-top:48px}
:root[data-layout="2"] .board,:root[data-layout="2"] .tz-card,:root[data-layout="2"] .b2-card,:root[data-layout="2"] .tc-card,:root[data-layout="2"] .b2-sharecard,
:root[data-layout="2"] .sg-compose,:root[data-layout="2"] .profile>.pf-card,:root[data-layout="2"] .sim-left,:root[data-layout="2"] .sim-right,:root[data-layout="2"] .match{
  background:#fffdf8;border:2px solid var(--ink);border-radius:20px;box-shadow:var(--hard);backdrop-filter:none;color:var(--ink)}
:root[data-layout="2"] .match{border-radius:16px}
:root[data-layout="2"] .arena{border:2px solid var(--ink);border-radius:20px;box-shadow:var(--hard)}
:root[data-layout="2"] .chip,:root[data-layout="2"] .arena-tabs button,:root[data-layout="2"] .bl-ghost,:root[data-layout="2"] #search{background:#fffdf8;border:2px solid var(--ink);color:var(--ink);font-weight:700}
:root[data-layout="2"] .chip:hover,:root[data-layout="2"] .arena-tabs button:hover{background:var(--card2);color:var(--ink)}
:root[data-layout="2"] .chip.active,:root[data-layout="2"] .arena-tabs button.active{background:var(--ink);border-color:var(--ink);color:#fffdf8}
:root[data-layout="2"] .arena-tabs button[data-view=drop].active{background:var(--rel);border-color:var(--ink);color:#fff}
:root[data-layout="2"] #search::placeholder{color:var(--mut)}
:root[data-layout="2"] .bl-cta{background:var(--accent);color:var(--on-accent);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font-weight:800}
:root[data-layout="2"] .bl-cta:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}
:root[data-layout="2"] .foot{color:var(--mut)}
:root[data-layout="2"] .foot a{color:var(--ink);font-weight:700}

/* table */
:root[data-layout="2"] .board{overflow:hidden}
:root[data-layout="2"] .board .row.head{background:var(--ink);color:#fffdf8;border-bottom:0}
:root[data-layout="2"] .board .row.head span{color:#fffdf8}
:root[data-layout="2"] .team-row{border-bottom:1px solid rgba(22,19,15,.14);color:var(--ink)}
:root[data-layout="2"] .team-row:hover{background:rgba(var(--accent-rgb),.14)}
:root[data-layout="2"] .team-row.top1{background:#ffe27a}:root[data-layout="2"] .team-row.top2{background:#e9e6df}:root[data-layout="2"] .team-row.top3{background:#f6cfa6}
:root[data-layout="2"] .team-row.top1:hover,:root[data-layout="2"] .team-row.top2:hover,:root[data-layout="2"] .team-row.top3:hover{filter:brightness(.97)}
:root[data-layout="2"] .team-row.top1 .c-team span,:root[data-layout="2"] .team-row.top2 .c-team span,:root[data-layout="2"] .team-row.top3 .c-team span{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--ink)}
:root[data-layout="2"] .team-row.top1 .c-pos .n,:root[data-layout="2"] .team-row.top2 .c-pos .n,:root[data-layout="2"] .team-row.top3 .c-pos .n{color:var(--ink)}
:root[data-layout="2"] .c-pts{color:var(--ink);font-weight:900}

/* ---------- fixes found on the first pass: text that styles.css forces to white ---------- */
:root[data-layout="2"] .hero h1 .line.accent{margin-top:.12em}
:root[data-layout="2"] .tc-strip{background:#fffdf8;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);backdrop-filter:none;color:var(--ink)}
:root[data-layout="2"] .tc-strip:hover{border-color:var(--ink)}
:root[data-layout="2"] .tcs-live b,:root[data-layout="2"] .tc-live b,:root[data-layout="2"] .tc-list .pos,:root[data-layout="2"] .tcb-list .n{color:var(--ink)}
:root[data-layout="2"] .tcs-go{color:var(--accent-text)}
:root[data-layout="2"] .ch.t{color:#7a4b00;background:#ffe27a;border:1.5px solid var(--ink)}
:root[data-layout="2"] .ch.r{color:#9f1239;background:#ffd5dc;border:1.5px solid var(--ink)}
:root[data-layout="2"] .ch.t.final{color:var(--ink);background:#ffd23f;border-color:var(--ink);box-shadow:2px 2px 0 var(--ink)}
:root[data-layout="2"] .ch.r.final{color:#fff;background:var(--rel);border-color:var(--ink);box-shadow:2px 2px 0 var(--ink)}

/* bolão card on the home page */
:root[data-layout="2"] .tz-sub,:root[data-layout="2"] .tz-prog b,:root[data-layout="2"] .tz-when b,:root[data-layout="2"] .tz-pts span{color:var(--ink)}
:root[data-layout="2"] .tz-sub{font-weight:700}
:root[data-layout="2"] .tz-prog,:root[data-layout="2"] .tz-when,:root[data-layout="2"] .tz-pts small,:root[data-layout="2"] .g-k,:root[data-layout="2"] .g-x{color:var(--mut)}
:root[data-layout="2"] .tz-prog i{background:rgba(22,19,15,.12);border:1.5px solid var(--ink);height:10px}
:root[data-layout="2"] .tz-prog u{background:var(--accent)}
:root[data-layout="2"] .tz-lock{color:#7a4b00;background:#ffe9b8;border:1.5px solid var(--ink)}
:root[data-layout="2"] .tz-chip{background:var(--accent);color:var(--on-accent);border:1.5px solid var(--ink)}
:root[data-layout="2"] .tz-games li,:root[data-layout="2"] .tz-pts span{background:var(--card2);border:1.5px solid var(--ink)}
:root[data-layout="2"] .g-x em{background:var(--ink);color:#fff}
:root[data-layout="2"] .tz-pts b{color:var(--accent-text)}
:root[data-layout="2"] .tz2 .tz-side{background:var(--ink);border:2px solid var(--ink);box-shadow:none;color:#fff}
:root[data-layout="2"] .tz2 .tz-side *{color:inherit}
:root[data-layout="2"] .tz2 .tz-top .lbl{color:var(--accent)}
:root[data-layout="2"] .tz-wa{color:#fff;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}
:root[data-layout="2"] .tz-more{color:#fff}
:root[data-layout="2"] .tz-more:hover{color:var(--accent)}
:root[data-layout="2"] .tz-go{box-shadow:3px 3px 0 var(--ink)}

/* ---------- text colours made for dark backgrounds, redone for paper (generated from styles.css, see README) ---------- */
:root[data-layout="2"] .stat span,
:root[data-layout="2"] .bl-chip.done,
:root[data-layout="2"] .bl-rules b,
:root[data-layout="2"] .bl-rank .nm em,
:root[data-layout="2"] .bl-rank .pt,
:root[data-layout="2"] .bl-champ span,
:root[data-layout="2"] .pl-sponsor.after em,
:root[data-layout="2"] .tz-pts b,
:root[data-layout="2"] .tz-who i,
:root[data-layout="2"] .tz-score,
:root[data-layout="2"] .pm-tag,
:root[data-layout="2"] .bdg sup,
:root[data-layout="2"] .pf-stats b,
:root[data-layout="2"] .pf-badge b em,
:root[data-layout="2"] .q-big b,
:root[data-layout="2"] .q-lv b,
:root[data-layout="2"] .q-up b,
:root[data-layout="2"] .q-cr b,
:root[data-layout="2"] .qd-num b,
:root[data-layout="2"] .qd-chip b,
:root[data-layout="2"] .tcb-list li:nth-child(-n+3) .p,
:root[data-layout="2"] .tcb-more,
:root[data-layout="2"] .b2-tile b,
:root[data-layout="2"] .b2-rounds button.cur:not(.on),
:root[data-layout="2"] .b2-pill.gold,
:root[data-layout="2"] .b2-pod.me .nn,
:root[data-layout="2"] .b2-invite b,
:root[data-layout="2"] .c-on.me,
:root[data-layout="2"] .b2-list .pt,
:root[data-layout="2"] .sim-final h3,
:root[data-layout="2"] .sim-fin-g .champ b,
:root[data-layout="2"] .sim-r b{color:var(--accent-text)}
:root[data-layout="2"] .match.live .st,
:root[data-layout="2"] .mv.up,
:root[data-layout="2"] .c-n.pos,
:root[data-layout="2"] .bl-saved.ok,
:root[data-layout="2"] .sg-score.pos,
:root[data-layout="2"] .au-hint.ok,
:root[data-layout="2"] .pw-list li.ok,
:root[data-layout="2"] .tcb-head,
:root[data-layout="2"] .tcb-total b,
:root[data-layout="2"] .b2-pill.open,
:root[data-layout="2"] .b2-pill.green,
:root[data-layout="2"] .b2-saved.ok,
:root[data-layout="2"] .tc-tbnote b,
:root[data-layout="2"] .c-on,
:root[data-layout="2"] .sim-r small.up{color:#0a6a3f}
:root[data-layout="2"] .mv.down,
:root[data-layout="2"] .c-n.neg,
:root[data-layout="2"] .pts.live,
:root[data-layout="2"] .bl-saved.err,
:root[data-layout="2"] .bl-err,
:root[data-layout="2"] .sg-score.neg,
:root[data-layout="2"] .sg-del:hover,
:root[data-layout="2"] .au-hint.no,
:root[data-layout="2"] .acct-menu .danger,
:root[data-layout="2"] .b2-pill.live,
:root[data-layout="2"] .b2-saved.err,
:root[data-layout="2"] .b2-leave{color:#b4122f}

/* ---------- second pass: dark translucent fills become paper, white-on-dark text becomes ink ---------- */
:root[data-layout="2"] .bl-rules,:root[data-layout="2"] .tz-who,:root[data-layout="2"] .tz-score,:root[data-layout="2"] .sg-form textarea,:root[data-layout="2"] .sg-r,:root[data-layout="2"] .pf-stats div,:root[data-layout="2"] .pf-show,:root[data-layout="2"] .b2-list li,:root[data-layout="2"] .b2-list .st,:root[data-layout="2"] .b2-invite,:root[data-layout="2"] .b2-lgf,:root[data-layout="2"] .b2-m,:root[data-layout="2"] .sim-m{
  background:var(--card2);border:1.5px solid var(--ink);color:var(--ink)}
:root[data-layout="2"] .b2-m{background:#fffdf8;border-width:2px}
:root[data-layout="2"] .b2-m::before{width:8px;background:rgba(22,19,15,.2)}
:root[data-layout="2"] .b2-m.open::before,:root[data-layout="2"] .b2-m.right::before{background:var(--green)}
:root[data-layout="2"] .b2-m.exact{background:#fff4c2}:root[data-layout="2"] .b2-m.miss::before{background:#9c9588}
:root[data-layout="2"] .tz-prog i,:root[data-layout="2"] .tc-list .bar,:root[data-layout="2"] .q-bar,:root[data-layout="2"] .pw-bar{background:rgba(22,19,15,.12)}
:root[data-layout="2"] .b2-tile{background:#fffdf8;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}
:root[data-layout="2"] .b2-tile b{color:var(--accent-text)}
:root[data-layout="2"] .b2-tile span,:root[data-layout="2"] .b2-tile small{color:var(--mut)}
:root[data-layout="2"] .b2-tabs{background:var(--card2);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}
:root[data-layout="2"] .b2-tabs button{color:var(--ink)}
:root[data-layout="2"] .b2-tabs button.on{background:var(--accent);color:var(--on-accent)}
:root[data-layout="2"] .b2-pill{background:#e7e1d2;color:var(--ink);border:1.5px solid var(--ink)}
:root[data-layout="2"] .b2-pill.open,:root[data-layout="2"] .b2-pill.green{background:#c9ecd9;color:#07603a}
:root[data-layout="2"] .b2-pill.live{background:#ffd5dc;color:#9f1239}
:root[data-layout="2"] .b2-pill.gold{background:#ffe27a;color:#6b4300}
:root[data-layout="2"] .b2-mh,:root[data-layout="2"] .b2-mf,:root[data-layout="2"] .b2-x,:root[data-layout="2"] .b2-rules,:root[data-layout="2"] .b2-sub,:root[data-layout="2"] .b2-prog{color:var(--mut)}
:root[data-layout="2"] .b2-prog b,:root[data-layout="2"] .b2-t b{color:var(--ink)}
:root[data-layout="2"] .b2-in input,:root[data-layout="2"] .sim-in,:root[data-layout="2"] .bl-in input,:root[data-layout="2"] .bl-dialog input{background:#fffdf8;border:2px solid var(--ink);color:var(--ink);border-radius:12px}
:root[data-layout="2"] .b2-in button,:root[data-layout="2"] .b2-step{color:var(--ink);background:var(--card2);border:1.5px solid var(--ink)}
:root[data-layout="2"] .b2-lockbar{background:#fff0d4;border:2px solid var(--ink);color:var(--ink)}
:root[data-layout="2"] .b2-lockbar small{color:var(--mut)}
:root[data-layout="2"] .sim-sc{background:var(--ink);color:#fffdf8}
:root[data-layout="2"] .sim-left,:root[data-layout="2"] .sim-right{padding:16px}
:root[data-layout="2"] .sim-prog i{background:rgba(22,19,15,.12);border:1.5px solid var(--ink);height:10px}:root[data-layout="2"] .sim-prog u{background:var(--accent)}
:root[data-layout="2"] .sim-legend{color:var(--mut)}
:root[data-layout="2"] .sim-th h2{padding-bottom:6px}
:root[data-layout="2"] .sh-b.cp{background:var(--ink);color:#fffdf8;border:0}
:root[data-layout="2"] .sh-b.nv{background:#e7e1d2;color:var(--ink)}
:root[data-layout="2"] .sh-b{border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}
:root[data-layout="2"] .sh-b.pic{border-color:var(--ink);color:var(--ink)}
:root[data-layout="2"] .sh-l,:root[data-layout="2"] .b2-sharecard b{color:var(--ink)}

/* profile */
:root[data-layout="2"] .pf-stats b{color:var(--accent-text)}
:root[data-layout="2"] .pf-badge{background:#fffdf8;border:2px solid var(--ink);color:var(--ink)}
:root[data-layout="2"] .pf-badge.got{background:#fff4c2}
:root[data-layout="2"] .pf-badge.got.tier-legend{background:#e9defe;border-color:var(--ink)}
:root[data-layout="2"] .pf-badge.got:hover{box-shadow:var(--hard)}
:root[data-layout="2"] .pf-badge.got.tier-gold .tr{color:#946000}:root[data-layout="2"] .pf-badge.got.tier-silver .tr{color:#566177}
:root[data-layout="2"] .pf-badge.got.tier-bronze .tr{color:#954f12}:root[data-layout="2"] .pf-badge.got.tier-legend .tr{color:#6a3fd1}
:root[data-layout="2"] .pf-slot{border-color:var(--ink);background:#fffdf8;color:var(--ink)}
:root[data-layout="2"] .pf-slot b{color:rgba(22,19,15,.45)}
:root[data-layout="2"] .pf-slot.full{background:#fff4c2;border-color:var(--ink)}
:root[data-layout="2"] .pf-slot:not(.off):not(:disabled):hover{border-color:var(--accent);background:var(--accent-soft)}
:root[data-layout="2"] .pf-slot .x{background:var(--ink);color:#fff}
:root[data-layout="2"] .pf-name small,:root[data-layout="2"] .pf-show-h small,:root[data-layout="2"] .pf-badge small,:root[data-layout="2"] .pf-badge .tr{color:var(--mut)}
:root[data-layout="2"] .pf-av{box-shadow:0 0 0 3px var(--accent)}

/* suggestions */
:root[data-layout="2"] .sg-form textarea{color:var(--ink)}
:root[data-layout="2"] .sg-form textarea::placeholder{color:var(--mut)}
:root[data-layout="2"] .sg-r{background:#fffdf8}
:root[data-layout="2"] .sg-r b,:root[data-layout="2"] .sg-r span{color:var(--ink)}
:root[data-layout="2"] .sg-item,:root[data-layout="2"] .sg-list>*{background:#fffdf8;border:2px solid var(--ink);border-radius:16px;box-shadow:3px 3px 0 var(--ink)}
:root[data-layout="2"] .sg-compose{padding:16px}

/* account menu button and torcidas list */
:root[data-layout="2"] .acct-btn{background:var(--card2);border:2px solid var(--ink);color:var(--ink);font-weight:700}
:root[data-layout="2"] .tc-list li,:root[data-layout="2"] .tc-list .n{color:var(--ink)}
:root[data-layout="2"] .tc-note,:root[data-layout="2"] .tc-tbnote{color:var(--mut)}
:root[data-layout="2"] .sg-compose{background:none;border:0;box-shadow:none;padding:0}
:root[data-layout="2"] .sg-compose>*{background:#fffdf8;border:2px solid var(--ink);border-radius:20px;box-shadow:var(--hard)}
:root[data-layout="2"] .sg-form textarea{border-width:2px}
@media (max-width:560px){
  :root[data-layout="2"] .hero h1 .line.accent{box-shadow:4px 4px 0 var(--ink);border-width:2px}
  :root[data-layout="2"] .stat b{font-size:15px}:root[data-layout="2"] .stat{padding:12px;gap:10px}
  :root[data-layout="2"] h2{font-size:22px}
  :root[data-layout="2"] .ly-switch{bottom:10px}
}
:root[data-layout="2"] .arena-legend,:root[data-layout="2"] .arena-msg{color:rgba(255,255,255,.7)}

:root[data-layout="2"] .b2-rounds .b2-shot{background:var(--accent);color:var(--on-accent);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font-weight:800}
:root[data-layout="2"] .b2-rounds .b2-shot:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}

/* ---------- popups, menus and notices in the paper style ---------- */
:root[data-layout="2"] .bl-modal,:root[data-layout="2"] .shot-modal,:root[data-layout="2"] .pf-pick{background:rgba(22,19,15,.62);backdrop-filter:none}
:root[data-layout="2"] .bl-dialog,:root[data-layout="2"] .shot-box,:root[data-layout="2"] .pf-pick-box{background:#fffdf8;color:var(--ink);border:3px solid var(--ink);border-radius:22px;box-shadow:8px 8px 0 var(--ink)}
:root[data-layout="2"] .bl-dialog h3{font:900 28px/1 var(--head);letter-spacing:-.03em;text-transform:uppercase;color:var(--ink)}
:root[data-layout="2"] .bl-dialog label,:root[data-layout="2"] .bl-team legend,:root[data-layout="2"] .au-avatar small,:root[data-layout="2"] .pw-label,:root[data-layout="2"] .pw-list,
:root[data-layout="2"] .bl-fine,:root[data-layout="2"] .au-or,:root[data-layout="2"] .au-hint{color:var(--mut)}
:root[data-layout="2"] .bl-dialog input{background:#fffdf8;color:var(--ink);border:2px solid var(--ink);border-radius:12px}
:root[data-layout="2"] .bl-dialog input:focus{outline:3px solid var(--accent);outline-offset:1px;border-color:var(--ink)}
:root[data-layout="2"] .bl-dialog input::placeholder{color:#7a7367}
:root[data-layout="2"] .bl-x,:root[data-layout="2"] .shot-x,:root[data-layout="2"] .pf-pick-h button{color:var(--ink);background:var(--card2);border:2px solid var(--ink);border-radius:50%;width:34px;height:34px;display:grid;place-items:center;line-height:1;font-size:20px}
:root[data-layout="2"] .shot-x{background:#fffdf8}
:root[data-layout="2"] .seg{border:2px solid var(--ink);background:var(--card2)}
:root[data-layout="2"] .seg button{color:var(--ink);font-weight:700}
:root[data-layout="2"] .seg button.active{background:var(--ink);color:#fffdf8}
:root[data-layout="2"] .bl-go{background:var(--accent);color:var(--on-accent);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font-weight:800}
:root[data-layout="2"] .bl-go:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}
:root[data-layout="2"] .bl-err,:root[data-layout="2"] .au-hint.no{color:#b4122f;font-weight:600}
:root[data-layout="2"] .au-hint.ok,:root[data-layout="2"] .pw-list li.ok{color:#0a6a3f}
:root[data-layout="2"] .au-ok{background:#d6f5e3;border:2px solid var(--ink);color:var(--ink)}
:root[data-layout="2"] .au-link{color:#0a5aa8;font-weight:600}
:root[data-layout="2"] .au-prov{background:#fffdf8;color:var(--ink);border:2px solid var(--ink)}
:root[data-layout="2"] .au-or::before,:root[data-layout="2"] .au-or::after{background:rgba(22,19,15,.3)}
:root[data-layout="2"] .bl-teamgrid label,:root[data-layout="2"] .bl-teamgrid button{background:#fffdf8;border:2px solid rgba(22,19,15,.4);color:var(--ink)}
:root[data-layout="2"] .bl-teamgrid :checked+*,:root[data-layout="2"] .bl-teamgrid .on,:root[data-layout="2"] .bl-teamgrid [aria-checked=true]{border-color:var(--ink);background:var(--accent-soft)}

/* print window */
:root[data-layout="2"] .shot-box img{background:#e9e4d6;border:2px solid var(--ink);border-radius:12px}
:root[data-layout="2"] .shot-hint{color:var(--mut)}
:root[data-layout="2"] .shot-acts .bl-cta{background:var(--accent);color:var(--on-accent)}
:root[data-layout="2"] .shot-acts .bl-cta.wa{background:#25d366;color:#04230f}
:root[data-layout="2"] .shot-share .sh-l{color:var(--ink);font-weight:700}

/* badge picker */
:root[data-layout="2"] .pf-pick-h{color:var(--ink)}
:root[data-layout="2"] .pf-pick-l button{background:#fffdf8;border:2px solid var(--ink);color:var(--ink)}
:root[data-layout="2"] .pf-pick-l button:hover{background:var(--accent-soft);border-color:var(--ink)}

/* account menu */
:root[data-layout="2"] .acct-btn.out{background:var(--accent);color:var(--on-accent);border:2px solid var(--ink);font-weight:800}
:root[data-layout="2"] .acct-menu{background:#fffdf8;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);border-radius:16px}
:root[data-layout="2"] .acct-menu a,:root[data-layout="2"] .acct-menu button{color:var(--ink);font-weight:600}
:root[data-layout="2"] .acct-menu a:hover,:root[data-layout="2"] .acct-menu button:hover,:root[data-layout="2"] .acct-menu a:focus-visible,:root[data-layout="2"] .acct-menu button:focus-visible{background:var(--accent-soft);outline:2px solid var(--ink)}
:root[data-layout="2"] .acct-menu .danger{color:#b4122f}
:root[data-layout="2"] .acct-who{border-bottom:2px solid var(--ink)}
:root[data-layout="2"] .acct-who small{color:var(--mut)}

/* notices */
:root[data-layout="2"] .shot-toast{background:#fffdf8;color:var(--ink);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
:root[data-layout="2"] .shot-toast a{color:#0a5aa8;text-decoration:underline}
:root[data-layout="2"] .shot-toast kbd,:root[data-layout="2"] .fl-help kbd{background:var(--card2);border:1.5px solid var(--ink)}
:root[data-layout="2"] .fl-help{background:#fff4c2;border:2px solid var(--ink);color:var(--ink)}
:root[data-layout="2"] .fl-help summary{color:#0a4f9a}
:root[data-layout="2"] .fl-help code{background:#fffdf8;border:1.5px solid var(--ink);color:var(--ink)}
:root[data-layout="2"] .fl-help small{color:var(--mut)}
:root[data-layout="2"] .fl-copy{background:var(--accent);color:var(--on-accent);border:1.5px solid var(--ink)}

/* vote box */
:root[data-layout="2"] .ly-vote{background:#fffdf8;color:var(--ink);border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink)}
:root[data-layout="2"] .lv-x{color:var(--ink);border:2px solid var(--ink)}
:root[data-layout="2"] .lv-x:hover{background:var(--card2)}
:root[data-layout="2"] .lv-opt{background:#fffdf8;color:var(--ink);border:2px solid var(--ink)}
:root[data-layout="2"] .lv-opt:hover:not(:disabled){background:var(--card2)}
:root[data-layout="2"] .lv-opt.mine{background:var(--accent-soft);border-color:var(--ink)}
:root[data-layout="2"] .lv-t small,:root[data-layout="2"] .lv-n small,:root[data-layout="2"] .lv-msg{color:var(--mut)}
:root[data-layout="2"] .lv-bar{background:var(--accent);border-top:2px solid var(--ink)}
:root[data-layout="2"] .lv-opt em{color:#0a6a3f}
:root[data-layout="2"] .lv-login{color:var(--ink)}
:root[data-layout="2"] .lv-login button{color:#0a5aa8}

/* keyboard focus: a clear ring everywhere */
:root[data-layout="2"] a:focus-visible,:root[data-layout="2"] button:focus-visible,:root[data-layout="2"] input:focus-visible,:root[data-layout="2"] textarea:focus-visible,:root[data-layout="2"] summary:focus-visible,:root[data-layout="2"] [tabindex]:focus-visible{outline:3px solid #0a5aa8;outline-offset:2px}
:root[data-layout="2"] .tz2 .tz-side a:focus-visible,:root[data-layout="2"] .arena button:focus-visible{outline-color:#fff}
@media (prefers-reduced-motion:reduce){:root[data-layout="2"] *{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ?cor=amarelo: the same design with a yellow highlight instead of green */
:root[data-layout="2"][data-accent=verde]{--accent:#2bd47a; --on-accent:#0f1a12; --accent-text:#0a6a3f; --accent-soft:#d6f5e3; --accent-rgb:43,212,122}

/* ---------- accessibility fixes from the contrast audit ---------- */
:root[data-layout="2"] .sh-b.wa,:root[data-layout="2"] .tz-wa{background:#0f7a40;color:#fff}
:root[data-layout="2"] .sh-b.tg{background:#0b5f94;color:#fff}
:root[data-layout="2"] .sh-b.fb{background:#1558c0;color:#fff}
:root[data-layout="2"] .tzp .av .mk,:root[data-layout="2"] .tzp .av i{color:var(--ink)}
:root[data-layout="2"] .tzp.p1 .st{background:linear-gradient(180deg,#ffd23f,#f2b91c)}
:root[data-layout="2"] .tzp.p2 .st{background:linear-gradient(180deg,#e9edf3,#b9c0cc)}
:root[data-layout="2"] .tzp.p3 .st{background:linear-gradient(180deg,#f0b27a,#cf8447)}
:root[data-layout="2"] .tzp .st strong,:root[data-layout="2"] .tzp .st small,:root[data-layout="2"] .tzp .st::after{color:var(--ink);text-shadow:none}

/* ---------- audit, round 2: podium steps, avatars, tags, small controls ---------- */
:root[data-layout="2"] .b2-pod .step{border:2px solid var(--ink);color:var(--ink)}
:root[data-layout="2"] .b2-pod.p1 .step{background:linear-gradient(180deg,#ffd23f,#f2b91c)}
:root[data-layout="2"] .b2-pod.p2 .step{background:linear-gradient(180deg,#e9edf3,#b9c0cc)}
:root[data-layout="2"] .b2-pod.p3 .step{background:linear-gradient(180deg,#f0b27a,#cf8447)}
:root[data-layout="2"] .b2-pod .step strong,:root[data-layout="2"] .b2-pod .step small,:root[data-layout="2"] .b2-pod .step .sx{color:var(--ink);text-shadow:none}
:root[data-layout="2"] .b2-pod .step .num{color:rgba(22,19,15,.16)}
:root[data-layout="2"] .b2-pod .nn,:root[data-layout="2"] .b2-pod b.nn{color:var(--ink)}
:root[data-layout="2"] .b2-pod .rk{color:var(--ink);border:2px solid var(--ink)}
:root[data-layout="2"] .b2-pod.p1 .rk{background:#ffd23f}:root[data-layout="2"] .b2-pod.p2 .rk{background:#d5dae3}:root[data-layout="2"] .b2-pod.p3 .rk{background:#e8a971}
:root[data-layout="2"] .b2-av,:root[data-layout="2"] .av.init{background:linear-gradient(135deg,hsl(var(--h,150) 55% 28%),hsl(calc(var(--h,150) + 40) 55% 22%));color:#fff}
:root[data-layout="2"] .av.xs.init{font-size:max(9px,calc(var(--s) * .45))}
:root[data-layout="2"] .b2-tabs i{background:#5b34c4;color:#fff;font-size:10.5px}
:root[data-layout="2"] .b2-list .pt,:root[data-layout="2"] .b2-list .pos{color:var(--ink)}
:root[data-layout="2"] .b2-in button{min-height:26px}
:root[data-layout="2"] .pf-cam{background:var(--ink);color:#fff;border:2px solid #fffdf8}
:root[data-layout="2"] .pf-slot b{color:var(--mut)}
:root[data-layout="2"] .sg-score.pos{color:#0a6a3f}:root[data-layout="2"] .sg-score.neg{color:#b4122f}:root[data-layout="2"] .sg-score{font-weight:700}
:root[data-layout="2"] .b2-pod .step .num{color:rgba(22,19,15,.6)}
:root[data-layout="2"] .b2-pod.p3 .step{background:linear-gradient(180deg,#f6c9a0,#e3a56d)}
:root[data-layout="2"] .sg-meta a{display:inline-block;min-height:24px;line-height:24px}
:root[data-layout="2"] .au-forgot{min-height:24px;padding:4px 0}

/* podium: the big rank number behind the points collided with them; the round rank medal already says the position */
:root[data-layout="2"] .b2-pod .step .num{display:none}

/* podiums in paper style: flat steps with black outline, no glow or shine */
:root[data-layout="2"] .b2-podium::before,:root[data-layout="2"] .b2-podium::after,:root[data-layout="2"] .b2-pod .step::after{display:none}
:root[data-layout="2"] .b2-pod .step{border:3px solid var(--ink);border-bottom:0;border-radius:16px 16px 0 0;box-shadow:5px 0 0 var(--ink)}
:root[data-layout="2"] .b2-pod .step strong{text-shadow:none}
:root[data-layout="2"] .b2-pod .step small,:root[data-layout="2"] .b2-pod .step .sx{background:#fffdf8;border:1.5px solid var(--ink);border-radius:99px;padding:2px 9px;opacity:1;color:var(--ink);font-weight:700}
:root[data-layout="2"] .b2-pod .step .sx{margin-top:8px}
:root[data-layout="2"] .b2-pod .pa::before{background:var(--ink);animation:none;box-shadow:none}
:root[data-layout="2"] .b2-pod.p1 .pa::before{background:var(--ink);box-shadow:none}
:root[data-layout="2"] .b2-pod .pa .b2-av.big,:root[data-layout="2"] .b2-pod.p1 .pa .b2-av.big{box-shadow:0 0 0 3px #fffdf8}
:root[data-layout="2"] .b2-podium{border-bottom:3px solid var(--ink)}
:root[data-layout="2"] .b2-pod .crown{filter:none}
:root[data-layout="2"] .b2-pod .step strong{text-shadow:none!important}
/* index podium (dark panel): no giant rank number behind the points, flat steps */
:root[data-layout="2"] .tzp .st::after,:root[data-layout="2"] .tzp .st::before{display:none}
:root[data-layout="2"] .tzp .st{border:2px solid #fffdf8;border-bottom:0;animation:none}
:root[data-layout="2"] .tzp.p1 strong{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--ink)}
:root[data-layout="2"] .tzp .st small{background:#fffdf8;color:var(--ink);opacity:1;font-weight:700}
:root[data-layout="2"] .tzp .st small{color:var(--ink)!important;-webkit-text-fill-color:var(--ink);line-height:1.5;opacity:1!important}
:root[data-layout="2"] .legal{background:var(--card);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink);color:var(--ink)}
:root[data-layout="2"] .legal h2{font-family:var(--head);font-weight:900;font-size:20px;letter-spacing:-.01em;text-transform:uppercase;color:var(--ink)}
:root[data-layout="2"] .legal a,:root[data-layout="2"] .about a,:root[data-layout="2"] .foot-legal a{color:#0a5aa8}
:root[data-layout="2"] .pf-del button{color:#b4122f;font-weight:600}
