@font-face { font-family: 'Fraunces'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/fraunces-vietnamese.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;}
@font-face { font-family: 'Fraunces'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/fraunces-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face { font-family: 'Fraunces'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/fraunces-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face { font-family: 'Instrument Sans'; font-style: normal; font-weight: 400 700; font-stretch: 100%; font-display: swap; src: url(../fonts/instrument-sans-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face { font-family: 'Instrument Sans'; font-style: normal; font-weight: 400 700; font-stretch: 100%; font-display: swap; src: url(../fonts/instrument-sans-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

:root{
  --bg:#f1f2ee; --s1:#fbfbf9; --s2:#e7e9e3; --s3:#dcdfd8;
  --line:#c9cec5; --line-2:#dde0d9; --line-strong:#9aa198;
  --t1:#15181b; --t2:#3e444a; --t3:#5f666d;
  --paper:#15181b; --paper-hover:#2a3036; --ink:#f6f7f3;
  --hi:#2448d4; --hi-bg:#e6ebfb; --hi-line:#aebcf0; --hi-strong:#c5d0f5;
  --ok:#1d7a4a; --ok-bg:#dff0e6; --ok-line:#a3d1b7;
  --mid:#8a5a00; --mid-bg:#f6ecd3; --mid-line:#dcc48a;
  --no:#b3261e; --no-bg:#f8e3e0; --no-line:#e3aaa5;
  --on-accent:#ffffff;
  --photo-bg:#dcdfd8; --overlay:rgba(251,251,249,.9); --kbd-bg:rgba(21,24,27,.07);
  --shadow-sm:0 1px 2px rgba(20,24,28,.14);
  --shadow-pop:0 14px 30px -14px rgba(20,24,28,.4), 0 2px 5px rgba(20,24,28,.07);
  --r-sm:4px; --r:6px; --r-lg:10px;
  --sans:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --display:"Fraunces",ui-serif,Georgia,serif;
  --serif:"Fraunces",ui-serif,Georgia,serif;
  --mono:"Instrument Sans",ui-sans-serif,system-ui,sans-serif;
  --ease:cubic-bezier(.2,.7,.3,1);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#121416; --s1:#191c1f; --s2:#212529; --s3:#2a2f34;
    --line:#363c42; --line-2:#272c31; --line-strong:#5a626b;
    --t1:#e8eae5; --t2:#b5bbc2; --t3:#8d949c;
    --paper:#e8eae5; --paper-hover:#ffffff; --ink:#15181b;
    --hi:#8aa4ff; --hi-bg:#1c2340; --hi-line:#35468a; --hi-strong:#2a3a7a;
    --ok:#6fd39b; --ok-bg:#142a1f; --ok-line:#275b3f;
    --mid:#e6b64f; --mid-bg:#2a2210; --mid-line:#55441c;
    --no:#ff8b7a; --no-bg:#311b18; --no-line:#6b2f28;
    --on-accent:#0f1216;
    --photo-bg:#0d0f11; --overlay:rgba(18,20,22,.86); --kbd-bg:rgba(232,234,229,.09);
    --shadow-sm:0 1px 2px rgba(0,0,0,.45);
    --shadow-pop:0 16px 32px -14px rgba(0,0,0,.75), 0 2px 5px rgba(0,0,0,.3);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
    --bg:#121416; --s1:#191c1f; --s2:#212529; --s3:#2a2f34;
    --line:#363c42; --line-2:#272c31; --line-strong:#5a626b;
    --t1:#e8eae5; --t2:#b5bbc2; --t3:#8d949c;
    --paper:#e8eae5; --paper-hover:#ffffff; --ink:#15181b;
    --hi:#8aa4ff; --hi-bg:#1c2340; --hi-line:#35468a; --hi-strong:#2a3a7a;
    --ok:#6fd39b; --ok-bg:#142a1f; --ok-line:#275b3f;
    --mid:#e6b64f; --mid-bg:#2a2210; --mid-line:#55441c;
    --no:#ff8b7a; --no-bg:#311b18; --no-line:#6b2f28;
    --on-accent:#0f1216;
    --photo-bg:#0d0f11; --overlay:rgba(18,20,22,.86); --kbd-bg:rgba(232,234,229,.09);
    --shadow-sm:0 1px 2px rgba(0,0,0,.45);
    --shadow-pop:0 16px 32px -14px rgba(0,0,0,.75), 0 2px 5px rgba(0,0,0,.3);
    color-scheme:dark;
  }

body{font-family:var(--sans); font-size:15px; background:var(--bg); color:var(--t1)}
h1,h2,h3{font-weight:620; letter-spacing:-.015em}
h1,.bname,.res-score,.res-score small{font-family:var(--display); font-optical-sizing:auto}
h1{font-weight:600; letter-spacing:-.025em}
.menu h1{font-size:clamp(34px,4.4vw,50px); line-height:1.05; font-weight:600; text-wrap:balance; overflow-wrap:anywhere}
.bname{font-weight:600; letter-spacing:-.015em}
.res-score{font-weight:600; letter-spacing:-.03em; font-variant-numeric:lining-nums tabular-nums}
.res-score small{font-weight:500}
.lede{color:var(--t2)}
::selection{background:var(--hi-strong); color:var(--t1)}
:focus-visible{outline:2px solid var(--hi); outline-offset:2px}

.kicker,.seg-label,.hud-k,.sb-k,.stat .k,.setup-sep,.combo-k,.daily-r,.gx-h,
.lb-you-k,.lbp-r i,.reto-cod,.rv-era,.chip,.doc .fecha,.doc th,.panel-hint,.you-k{
  text-transform:none; letter-spacing:0; font-family:var(--sans);
}
.kicker{font-size:13.5px; font-weight:600; color:var(--hi); margin-bottom:14px}
.seg-label{font-size:13px; font-weight:600; color:var(--t2)}
.hud-k{font-size:11.5px; color:var(--t3)}
.stat .k{font-size:12.5px; color:var(--t3)}
.setup-sep{font-size:12.5px; color:var(--t3)}
.combo-k{font-size:12.5px; color:var(--t3)}
.panel-hint{font-size:11.5px; color:var(--t3)}
.daily-r{font-size:12px; font-weight:600; letter-spacing:0}
.hud-v,.res-pts,.stat .v,.clock,.verdict-pts,.lb-pts,.combo-v,.tool-val,.best,.daily-r,.daily-streak{
  font-variant-numeric:tabular-nums;
}
.stat .v{font-family:var(--display); font-weight:600; letter-spacing:-.01em}

.topbar{background:var(--bg); backdrop-filter:none; -webkit-backdrop-filter:none; border-bottom:1px solid var(--line)}
.brand{gap:10px}
.brand-mark{
  flex:none; width:28px; height:28px; padding:5px; border-radius:var(--r);
  background:var(--hi); color:var(--on-accent); box-shadow:none;
  fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;
}
.brand-txt{font-weight:650; letter-spacing:-.01em}
.brand-txt i{font-style:normal; font-weight:500; color:var(--t3); margin-left:3px}

.setup{background:var(--s1); backdrop-filter:none; -webkit-backdrop-filter:none; border-radius:var(--r-lg); box-shadow:var(--shadow-sm)}
.panel{border-radius:var(--r-lg)}
.btn{font-weight:600; transition:background .14s var(--ease), border-color .14s var(--ease), color .14s var(--ease), transform .1s var(--ease)}
.btn kbd{font-family:var(--sans); font-weight:600}
.btn-primary kbd{background:color-mix(in srgb, var(--ink) 16%, transparent)}

.seg{background:var(--s2); border-color:var(--line)}
.seg-ind,.gi-ind,.lb-ind{background:var(--s1) !important; box-shadow:var(--shadow-sm), 0 0 0 1px var(--line) !important}
.seg button[aria-checked="true"],.gi-b[aria-checked="true"],.lb-tabs [aria-selected="true"]{color:var(--t1) !important}
.gi{background:var(--s2)}

.daily{background:var(--hi-bg); border-color:var(--hi-line)}
.daily:hover{border-color:var(--hi)}
.daily-r{border-color:var(--hi-line); color:var(--hi); background:var(--s1)}
.daily.done{background:var(--s2); border-color:var(--line)}
.daily-streak{border-radius:var(--r-sm)}

.marquee-row{opacity:.55}
.marquee-row img{border-radius:var(--r)}
.card::after{display:none}

.pip{background:var(--s3)}
.pip.now{background:var(--hi)}

.res-mark{font-size:0; color:var(--on-accent)}
.res-mark::before{
  content:""; width:13px; height:13px; background:currentColor;
  -webkit-mask:var(--ico) center/contain no-repeat; mask:var(--ico) center/contain no-repeat;
}
.res-item{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E")}
.res-item.m-ok{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.res-item.m-mid{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")}

.lb-pos{font-variant-numeric:tabular-nums}
.lb-row.podium .lb-pos{color:var(--hi); font-weight:700}

.foot{border-top:1px solid var(--line); color:var(--t3)}
.foot a{color:var(--t2); text-underline-offset:2px}
.foot a:hover{color:var(--hi)}

@media (prefers-reduced-motion:reduce){
  .marquee-row{animation:none}
}
.menu .lede{font-size:16.5px; max-width:50ch}
.how li > span:first-child{background:var(--hi-bg); border-color:var(--hi-line); color:var(--hi)}
.menu-col{display:grid; gap:14px; min-width:0}
.menu-arte{aspect-ratio:5/3; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; background:var(--s2); box-shadow:var(--shadow-sm)}
.menu-arte img{width:100%; height:100%; object-fit:cover; display:block}
@media (max-width:760px){
  .menu-arte{display:none}
}
img.brand-mark{padding:0; background:none; border-radius:7px; box-shadow:none}
.glogo{display:inline-block; width:1.15em; height:1.15em; vertical-align:-.22em; border-radius:22%; flex:none}
.gx-ico .glogo{width:16px; height:16px; vertical-align:-.2em}
.archivo{border:1px solid var(--line); border-radius:var(--r); background:var(--s1); font-size:13.5px}
.archivo summary{cursor:pointer; list-style:none; display:flex; align-items:center; gap:8px; padding:9px 12px; font-weight:600; color:var(--t2)}
.archivo summary::-webkit-details-marker{display:none}
.archivo summary::before{content:""; width:7px; height:7px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(-45deg); margin:0 3px 0 1px; transition:transform .14s var(--ease)}
.archivo[open] summary::before{transform:rotate(45deg)}
.archivo summary:hover{color:var(--t1)}
.archivo summary:focus-visible{outline:2px solid var(--hi); outline-offset:-2px}
.archivo-nota{margin:0; padding:0 12px 8px; font-size:12px; color:var(--t3)}
.archivo ol{list-style:none; margin:0; padding:0; max-height:228px; overflow:auto; border-top:1px solid var(--line-2)}
.archivo li a{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:7px 12px; color:var(--t1); text-decoration:none; border-bottom:1px solid var(--line-2)}
.archivo li:last-child a{border-bottom:0}
.archivo li a:hover{background:var(--s2)}
.archivo li a span::first-letter{text-transform:uppercase}
.archivo li a b{font-weight:600; font-variant-numeric:tabular-nums}
.archivo li a b.ok{color:var(--hi)}
.archivo li a b.no{color:var(--t3); font-weight:500}