/* Entwurf A, gewählt von Lui am 04.10.2026. Eine gemeinsame Darstellung für alle Seiten. */
@font-face{font-family:Newsreader;font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/l33-Newsreader-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:Newsreader;font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/l33-Newsreader-latin-ext.woff2') format('woff2');unicode-range:U+0100-02FF,U+1E00-1EFF}
@font-face{font-family:Manrope;font-style:normal;font-weight:400 700;font-display:swap;src:url('/fonts/l33-Manrope-latin.woff2') format('woff2')}
:root{
  --paper:#F4EFE4;--surface:#FCFAF5;--field:#E1E6D8;--ink:#22261F;--muted:#566055;
  --accent:#8B3A2B;--accent-ink:#FCFAF5;--pitch-ink:#203A31;--rule:#C7C9BA;
  --font-heading:Newsreader,Georgia,serif;--font-body:Manrope,Arial,sans-serif;
  --radius:0px;--radius-button:2px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;
  --space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--page-gutter:22px;--content-width:1200px;
  /* Kept for existing state indicators; all resolve to Almanac tokens. */
  --panel:var(--surface);--ink2:var(--ink);--rule2:var(--rule);--rust:var(--accent);--rust2:var(--accent);--green:var(--pitch-ink);--pitchln:var(--rule);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:var(--space-5)}
body{margin:0;background:var(--paper);color:var(--ink);font:400 15px/1.65 var(--font-body);-webkit-font-smoothing:antialiased}
::selection{background:var(--accent);color:var(--accent-ink)}
a{color:var(--accent);text-underline-offset:4px;overflow-wrap:anywhere;min-height:44px;max-width:100%;display:inline-flex;align-items:center}
button,input,select,summary{font:inherit}
code,pre,kbd,samp{font-family:var(--font-body);overflow-wrap:anywhere}
button,select,[role=button],summary{cursor:pointer}
button,input,select{color:var(--ink);border-radius:var(--radius-button)}
button{background:var(--surface);border:1px solid var(--rule)}
button,a,summary,input,select{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid var(--accent);outline-offset:5px}
button:disabled{cursor:default}
input{accent-color:var(--accent)}
input::placeholder{color:var(--muted);opacity:1}
img{display:block;max-width:100%}
figure,dl,dd{margin:0}
h1,h2,h3{font-family:var(--font-heading);font-weight:400;line-height:1.08;letter-spacing:-.025em;margin:0;color:var(--ink)}
h1{font-size:clamp(51px,6.6vw,84px);overflow-wrap:anywhere}
h2{font-size:clamp(31px,3.3vw,44px)}
h3{font-size:26px}
b,strong{font-weight:700}
.wrap{width:min(var(--content-width),calc(100% - var(--page-gutter)*2));margin-inline:auto}
main>*,section,article,aside,.wrap>*,.rmain,.pc-main,.g-card__body{min-width:0}
.skip{position:absolute;left:10px;top:10px;z-index:100;padding:12px;background:var(--surface);transform:translateY(-180%)}
.skip:focus{transform:none}
.top__in{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-3);padding-top:var(--space-5)}
.brand{font:400 26px/1 var(--font-heading);letter-spacing:-.025em;text-decoration:none;color:var(--ink);min-height:44px;display:inline-flex;align-items:center;gap:6px}
.brand span{color:var(--ink)}
.top__note{font-size:10px;color:var(--muted);margin-left:auto}
.top__nav{display:flex;flex-basis:100%;gap:var(--space-5);border-block:1px solid var(--rule)}
.top__nav a{display:flex;align-items:center;min-height:46px;font-size:12px;color:var(--muted);text-decoration:none}
.top__nav a[aria-current]{color:var(--ink);border-bottom:2px solid var(--accent)}
.top__nav a:hover{color:var(--accent)}
.kicker,.eyebrow{color:var(--muted);font-size:11px;line-height:1.65}
.eyebrow{font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin:0 0 var(--space-3)}
.btn,.tab,.chip,.dsort button,.go,.badge{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);min-height:44px;border:1px solid var(--rule);border-radius:var(--radius-button);padding:10px 16px;text-decoration:none;font:700 12px/1.5 var(--font-body);background:var(--surface);color:var(--ink);max-width:100%;text-align:center}
.btn.solid,.btn.ready,.tab.on,.chip.on,.dsort button.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn:hover,.tab:hover,.chip:hover,.dsort button:hover,.go:hover,.badge:hover{border-color:var(--accent)}
.btn.solid:hover{background:var(--ink);border-color:var(--ink)}
.back{display:inline-flex;align-items:center;min-height:44px;font-size:11px;padding-top:var(--space-3)}
.stamp{width:34px;height:34px;flex:none;object-fit:contain;border:1px solid var(--rule);background:var(--surface)}
.stamp--ph{display:grid;place-items:center;font:700 10px var(--font-body);color:var(--muted)}
footer{border-top:1px solid var(--rule);padding:var(--space-6) 0 var(--space-7);margin-top:var(--space-6);color:var(--muted);font-size:11px}
footer .f-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-4) var(--space-5)}
footer a{display:inline-flex;align-items:center;min-height:44px}
footer .r{font-family:var(--font-heading);font-size:20px}
.prose{max-width:760px;overflow-wrap:anywhere}
.prose p{margin:0 0 var(--space-4)}
.prose h2{margin:var(--space-6) 0 var(--space-4)}
.prose h3{margin:var(--space-5) 0 var(--space-3)}
.prose li{margin-bottom:var(--space-3)}
.prose a{min-height:44px;display:inline-flex;align-items:center}
.ph,.ihead{padding:var(--space-6) 0 var(--space-5)}
.ph h1{font-size:clamp(42px,6vw,72px)}
.ihead p{max-width:700px;color:var(--muted);margin-top:var(--space-4)}
table{border-collapse:collapse;width:100%;font-size:13px;overflow-wrap:anywhere}
th,td{padding:12px 8px;border-bottom:1px solid var(--rule);text-align:left}
th{font-weight:700;color:var(--muted)}
.nf{padding:var(--space-8) 0;text-align:center}
.nf p{margin:var(--space-5) 0;color:var(--muted)}
.credits-list{list-style:none;padding:0}
.credits-list li{padding:var(--space-4) 0;border-bottom:1px solid var(--rule);font-size:13px;overflow-wrap:anywhere}

/* The cover keeps its natural 760:880 proportions, before the words on mobile. */
.hero__in{width:min(var(--content-width),calc(100% - var(--page-gutter)*2));margin:auto;display:grid;gap:var(--space-5);grid-template-areas:'pic' 'type' 'cta';padding:var(--space-5) 0 var(--space-6)}
.hero__frame{grid-area:pic;padding:var(--space-2);background:var(--surface);border:1px solid var(--rule);width:100%;max-width:500px;justify-self:start}
.hero__frame img{width:100%;height:auto;object-fit:contain;filter:none}
.hero__type{grid-area:type}
.hero__kick{display:block;font:700 10px/1.6 var(--font-body);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:var(--space-3)}
.hero__type h1{font-size:clamp(51px,6.6vw,84px);line-height:1.03}
.hero__type p{color:var(--muted);font-size:14px;max-width:430px;margin:var(--space-4) 0 0}
.hero__cta{grid-area:cta;display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:start}
.ledger{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-block:1px solid var(--rule);margin-bottom:var(--space-6)}
.ledger>div{padding:var(--space-4) var(--space-3) var(--space-4) 0}
.ledger .n{font:400 32px/1.2 var(--font-heading)}
.ledger .l{font-size:10px;color:var(--muted);margin-top:var(--space-1)}
.dateline{padding:0 0 var(--space-6)}
.dateline a{display:flex;gap:var(--space-3);flex-wrap:wrap;font-size:12px;min-height:44px;padding-block:var(--space-3);border-bottom:1px solid var(--rule);text-decoration:none}
.dl-date{color:var(--muted)}
.index,.game,.duelx,.conf-sec,.homefaq,.album,.duels,.ranked,.about-xi,.faq,.neigh,.vs-more{padding:var(--space-6) 0 var(--space-7)}
.game,.duelx,.conf-sec,.homefaq,.album,.duels,.ranked,.about-xi,.neigh,.vs-more{border-top:1px solid var(--rule)}
.index__head,.g-head,.dhead,.rhead{display:flex;align-items:baseline;flex-wrap:wrap;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-4)}
.sub,.g-sub,.dsub,.rl{color:var(--muted);font-size:13px;max-width:760px;margin:var(--space-3) 0 var(--space-5)}
.tools{display:flex;flex-wrap:wrap;gap:var(--space-4);padding:var(--space-4) 0 var(--space-5)}
.search{position:relative;flex:1 1 100%;min-width:0}
.search input{width:100%;min-height:48px;padding:12px 12px 12px 34px;border:1px solid var(--rule);background:var(--surface)}
.search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.chip{padding:10px 14px}
.natgrid,.ilist{display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--space-7)}
.nat{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) 0;border-bottom:1px solid var(--rule);color:var(--ink);text-decoration:none;min-width:0}
.nat__no{width:26px;flex:none;color:var(--accent);font-size:11px}
.nat__name{font:400 25px/1.2 var(--font-heading);flex:1;min-width:0;overflow-wrap:anywhere}
.nat__go{color:var(--accent);font-size:20px}
.nat__top{font-size:10px;color:var(--muted);max-width:38%;text-align:right;overflow-wrap:anywhere}
.nat:hover .nat__name{color:var(--accent)}
.empty{display:none;padding:var(--space-6) 0;color:var(--muted)}
.igrp{padding:var(--space-5) 0 var(--space-6);border-top:1px solid var(--rule)}
.igrp h2{margin-bottom:var(--space-4)}
.confgrid,.steps{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-5);margin-top:var(--space-5)}
.conf{display:flex;flex-direction:column;gap:var(--space-2);position:relative;padding:var(--space-5) 0;border-bottom:1px solid var(--rule);color:var(--ink);text-decoration:none}
.conf__label{font:400 28px/1.2 var(--font-heading);padding-right:var(--space-5)}
.conf__sub{font-size:12px;color:var(--muted)}
.conf__go{position:absolute;right:0;top:var(--space-5);color:var(--accent)}
.step{border-top:1px solid var(--rule);padding-top:var(--space-4)}
.step .sn{font:400 30px var(--font-heading);color:var(--accent)}
.step p{font-size:13px;margin:var(--space-2) 0}
.cta,.g-acts,.pp-cta,.vs-cta{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-5)}
.pulse{font-size:12px;color:var(--muted)}
.faq details{border-bottom:1px solid var(--rule);padding-block:var(--space-3)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-height:44px;font-size:14px;list-style:none}
.faq summary::after{content:'+';color:var(--accent)}
.faq details[open] summary::after{content:'−'}
.faq .fa{max-width:760px;padding-block:var(--space-3);font-size:13px}
.g-board,.g-play{max-width:760px}
.g-cat,.gv-tag{display:inline-block;font-size:10px;letter-spacing:.06em;font-weight:700;color:var(--accent);margin-bottom:var(--space-4)}
.g-q{font:400 clamp(25px,3vw,34px)/1.3 var(--font-heading);margin:0 0 var(--space-5)}
.g-opts{display:grid;gap:var(--space-3);max-width:620px}
.opt{width:100%;min-height:48px;padding:var(--space-4);border:1px solid var(--rule);background:var(--surface);text-align:left;font-size:14px}
.opt:hover:not(:disabled){border-color:var(--accent)}
.opt.right{background:var(--field);border-color:var(--pitch-ink);color:var(--pitch-ink)}
.opt.wrong{color:var(--accent);text-decoration:line-through}
.g-msg,.dmsg{font-size:13px;color:var(--pitch-ink);min-height:24px}
.g-dots,.g-score{display:flex;gap:var(--space-2);margin:var(--space-4) 0}
.g-dots i{width:34px;height:6px;background:var(--rule)}
.g-dots i.now{background:var(--accent)}
.g-dots i.hit,.g-score i.p5{background:var(--pitch-ink)}
.g-dots i.miss,.g-score i.p0{background:var(--accent)}
.g-score i{width:30px;height:30px;border:1px solid var(--rule);background:var(--field)}
.g-card,.g-done{background:var(--surface);border:1px solid var(--rule);padding:var(--space-5);max-width:760px}
.g-card{display:flex;gap:var(--space-5)}
.g-card img{width:96px;height:120px;object-fit:cover;flex:none}
.g-card__body b{display:block;font:400 28px/1.2 var(--font-heading)}
.g-card__body p{font-size:13px}
.g-reveal{display:flex;flex-direction:column;align-items:start;gap:var(--space-4)}
.g-arch a,.otd__all{font-size:11px;display:inline-flex;align-items:center;min-height:44px}
.otd{padding-block:var(--space-5)}
.otd__h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:var(--space-3)}
.otd__list{display:flex;flex-wrap:wrap;gap:var(--space-4)}
.otdc{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--rule);text-decoration:none;color:var(--ink)}
.otdc img,.otdc .ph{width:38px;height:38px;flex:none;object-fit:cover}
.otdc span{display:block;font-size:11px;color:var(--muted)}
.al-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:var(--space-4)}
.al img{width:100%;aspect-ratio:1;object-fit:cover}
.al span{display:block;font-size:11px}

/* Nation: a quiet field and an open roster, with every player fully legible. */
.chead{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-5) 0 var(--space-6)}
.chead__flag{width:44px;height:44px}
.chead .cl{font-size:12px;color:var(--muted);margin-top:var(--space-3)}
.ribbon{display:block;margin-top:var(--space-3);font:700 11px/1.5 var(--font-body);letter-spacing:0;color:var(--accent)}
.builder{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-6);padding-bottom:var(--space-7)}
.controls{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);margin-bottom:var(--space-3)}
.controls .ct{font:400 31px/1.2 var(--font-heading);flex-basis:100%;margin-bottom:var(--space-3)}
select{min-height:44px;border:1px solid var(--rule);background:var(--surface);padding:10px;font-size:12px;max-width:100%}
.count{font-size:11px;color:var(--muted)}
.hint{font-size:11px;color:var(--muted);margin-bottom:var(--space-4)}
.pitch{position:relative;width:100%;aspect-ratio:3/4;border:1px solid var(--rule);background:var(--field);color:var(--pitch-ink);touch-action:none;overflow:hidden}
.pl{position:absolute;border:1px solid var(--rule);pointer-events:none}
.pl.circle,.pl.dot{border-radius:50%}
.pl.dot{background:var(--rule)}
.tok{position:absolute;transform:translate(-50%,-50%);width:68px;display:flex;flex-direction:column;align-items:center;gap:2px;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.tok.drag{z-index:9;cursor:grabbing}
.tok .disc{position:relative;width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--rule);background:var(--surface);color:var(--pitch-ink);border-radius:50%}
.tok .disc .ov{font:700 11px var(--font-body)}
.tok.empty .disc{background:var(--field);border:1px dashed var(--pitch-ink)}
.tok.empty .disc .ov{font-size:22px}
.tok .lbl{font-size:10px;font-weight:700;color:var(--pitch-ink);background:var(--field);line-height:1.25;text-align:center;max-width:78px;pointer-events:none;overflow-wrap:anywhere}
.tok .role{font-size:8px;color:var(--pitch-ink);background:var(--field);pointer-events:none}
.tok .x{position:absolute;top:-10px;right:-16px;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--accent);font-size:20px;line-height:1;z-index:3;cursor:pointer}
.tok .x::before{content:'';position:absolute;inset:10px;border:1px solid var(--rule);background:var(--surface);border-radius:50%;z-index:-1}
.tok.target .disc{outline:3px solid var(--accent);outline-offset:2px}
.dock{background:transparent;border-block:1px solid var(--rule);display:flex;flex-direction:column;min-width:0}
.dock__h{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-4) 0}
.dock__h b{font:400 31px var(--font-heading)}
.dsort{display:flex;gap:var(--space-2);padding-bottom:var(--space-4);background:var(--paper)}
.dock__list{overflow-y:auto;overscroll-behavior:contain;max-height:700px}
.dgrp{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding:var(--space-4) 0 var(--space-2)}
.prow{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) 0;border-bottom:1px solid var(--rule);cursor:pointer}
.prow.on{background:var(--field);color:var(--ink)}
.prow .nm{flex:1;min-width:0;font:400 21px/1.2 var(--font-heading);overflow-wrap:anywhere}
.prow .pos{font-size:10px;color:var(--muted);flex:none}
.prow .badge{padding:10px 8px;min-width:50px;flex:none;color:var(--accent)}
.rthumb{width:34px;height:42px;object-fit:cover;object-position:top;border:1px solid var(--rule);background:var(--surface);flex:none}
.rthumb--ph{display:grid;place-items:center;font-size:11px;color:var(--muted)}
.rgrid{display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--space-7)}
.rrow{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-4) 0;border-bottom:1px solid var(--rule);cursor:pointer}
.rrow .rk{font-size:11px;color:var(--accent);flex:none;width:24px;padding-top:4px}
.rrow .nm{font:400 25px/1.2 var(--font-heading);color:var(--ink);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.rrow .ds,.rrow .fx{display:block;font-size:12px;margin-top:var(--space-2);line-height:1.6}
.rrow .fx{color:var(--muted);font-size:11px}
.rrow .rside{font-size:10px;color:var(--muted);text-align:right;max-width:68px;flex:none;padding-top:6px}
.rrow .rside>span{display:block;overflow-wrap:anywhere}
.rrow .mini{width:18px;height:18px;display:inline-block}
.rrow .mv{font-weight:700;color:var(--accent)}
.rrow .ov{display:none}
.tabs{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.live{display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor}
.source-entry{font-size:11px;display:inline-flex;align-items:center;min-height:44px}
.source-entry summary{min-height:44px;display:flex;align-items:center;color:var(--accent)}
.source-entry[open]{display:block}
.source-entry p{font-size:12px}
.source-entry a{display:inline-flex;align-items:center;min-height:44px}
.arena{display:grid;grid-template-columns:minmax(0,1fr);max-width:880px;border-block:1px solid var(--rule)}
.fighter{position:relative;display:flex;flex-direction:column;gap:var(--space-2);align-items:center;padding:var(--space-5) var(--space-4);text-align:center;cursor:pointer;min-height:44px;background:transparent}
.fighter:hover{background:var(--surface)}
.fighter.win{background:var(--field)}
.fighter.lose{background:var(--surface)}
.fighter .fimg{width:88px;height:110px;object-fit:cover;object-position:top;border:6px solid var(--surface);outline:1px solid var(--rule)}
.fighter .fn{font:400 31px/1.15 var(--font-heading)}
.fighter .fp{font-size:11px;color:var(--muted)}
.fighter .fd{font-size:12px;line-height:1.6;max-width:330px}
.fighter .fo,.fighter .delta{display:none}
.vs{display:grid;place-items:center;align-content:center;gap:var(--space-2);padding:var(--space-3);font:400 22px var(--font-heading);color:var(--accent);border-block:1px solid var(--rule)}
.vsrec{font:400 11px var(--font-body);color:var(--muted)}
.dfoot{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center;max-width:880px;margin-top:var(--space-4)}
.dcount{font-size:11px;color:var(--muted);margin-right:auto}
.cutlist{padding-block:var(--space-6);border-top:1px solid var(--rule)}
.cutlist ul{list-style:none;padding:0;max-width:760px}
.cutlist li{padding:var(--space-4) 0;border-bottom:1px solid var(--rule)}
.cl-era,.cl-sub{font-size:12px;color:var(--muted)}
.cl-why{display:block;font-size:13px;margin-top:var(--space-2)}
.cl-foot{color:var(--accent);font-size:12px}
.related{padding-block:var(--space-5);font-size:13px}
.related a{min-height:44px;display:inline-flex;align-items:center}
.related b{margin-right:var(--space-3)}
.pcard-back,.pick-back{position:fixed;inset:0;background:var(--ink);opacity:.45;z-index:70;display:none}
.pcard-back.on,.pick-back.on{display:block}
.picker,.pcard{position:fixed;z-index:71;left:50%;top:50%;transform:translate(-50%,-50%);width:min(620px,calc(100% - 44px));max-height:calc(100dvh - 44px);overflow-y:auto;background:var(--surface);border:1px solid var(--rule);display:none}
.pcard.on,.picker.on{display:block}
.pcard{padding:var(--space-5)}
.pc-top,.pk-head{display:flex;align-items:start;gap:var(--space-3)}
.pc-nm{font:400 34px/1.15 var(--font-heading);flex:1;overflow-wrap:anywhere}
.pc-ov,.pc-meta .tag{display:none}
.pc-x,.pk-x{min-width:44px;min-height:44px;display:grid;place-items:center;color:var(--accent);font-size:20px;flex:none}
.pc-meta,.pk-sub{font-size:11px;color:var(--muted);margin:var(--space-3) 0 var(--space-4)}
.pc-meta{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.pc-body{display:grid;gap:var(--space-5)}
.pc-portrait{width:140px;min-width:0}
.pc-portrait img{width:100%;height:auto;border:6px solid var(--paper)}
.pc-credit{font-size:10px;line-height:1.6;margin-top:var(--space-2);overflow-wrap:anywhere;color:var(--muted)}
.pc-facts{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-3);margin-bottom:var(--space-4)}
.fl{font-size:10px;letter-spacing:.05em;color:var(--muted)}
.fv{font-size:14px}
.pc-desc{border-top:1px solid var(--rule);padding-top:var(--space-4);font-size:13px;line-height:1.7}
.pc-act{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-5)}
.pk-head{padding:var(--space-4);justify-content:space-between;border-bottom:1px solid var(--rule)}
.pk-head b{font:400 27px var(--font-heading)}
.pk-list{overflow-y:auto;max-height:58dvh;overscroll-behavior:contain}
.pkrow{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--rule);cursor:pointer;touch-action:none}
.pkrow img,.pkrow .ph{width:34px;height:42px;object-fit:cover;flex:none;background:var(--paper);font-size:10px}
.pkrow .nm{flex:1;min-width:90px;font:400 22px/1.2 var(--font-heading)}
.pkrow .nm small{display:block;font:400 10px/1.5 var(--font-body);color:var(--muted);margin-top:var(--space-1)}
.pkrow .ov{display:none}
.pkrow .tag{font-size:10px;color:var(--muted)}
.pkrow .go{padding:10px 12px}
.pk-foot,.pk-none{font-size:11px;color:var(--muted);padding:var(--space-4)}
.picker.ghosting{opacity:.1;pointer-events:none}
.pick-back.ghosting{display:none}
.dragghost{position:fixed;z-index:80;pointer-events:none;transform:translate(-50%,-50%);background:var(--surface);color:var(--ink);border:1px solid var(--rule);padding:var(--space-3);font-size:13px}

/* Player and comparison pages use career records, without strength or tier badges. */
.pp{display:flex;flex-direction:column;gap:var(--space-5);padding:var(--space-5) 0 var(--space-6);align-items:start}
.pp-photo{width:min(210px,60vw);padding:var(--space-2);border:1px solid var(--rule);background:var(--surface);flex:none}
.pp-photo img{width:100%;height:auto;object-fit:contain}
.pp-photo .cr{font-size:10px;color:var(--muted);line-height:1.6;margin-top:var(--space-2);overflow-wrap:anywhere}
.pp-main{min-width:0;width:100%}
.pp-main h1{font-size:clamp(82px,11vw,157px);line-height:1.03;overflow-wrap:anywhere}
.pp-kick{display:flex;align-items:center;gap:var(--space-3);font-size:11px;color:var(--muted);margin-bottom:var(--space-4)}
.pp-meta{display:flex;flex-wrap:wrap;gap:var(--space-3);font-size:12px;color:var(--muted);margin:var(--space-4) 0}
.pp-meta .tag{display:none}
.ppfacts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4) var(--space-5);border-block:1px solid var(--rule);padding-block:var(--space-5);margin:var(--space-5) 0}
.ppfacts .fv{font-size:16px;line-height:1.6;overflow-wrap:anywhere}
.ppranks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-bottom:1px solid var(--rule);margin-bottom:var(--space-5)}
.ppranks>div{padding:var(--space-4) var(--space-3) var(--space-4) 0}
.ppranks .n{font:400 38px/1.1 var(--font-heading)}
.ppranks .l{font-size:10px;color:var(--muted);margin-top:var(--space-2)}
.pp-main .prose{font-size:14px;line-height:1.85}
.sources{border-top:1px solid var(--rule);padding:var(--space-5) 0;overflow-wrap:anywhere}
.sources h2{font:400 31px/1.2 var(--font-heading);margin-bottom:var(--space-4)}
.sources ul{padding-left:var(--space-5)}
.sources li{font-size:12px;margin-bottom:var(--space-3)}
.sources small{color:var(--muted);font-size:11px}
.career,.ppq,.peersec{margin-bottom:var(--space-6)}
.career h2,.ppq h2,.peersec h2{margin-bottom:var(--space-4)}
.career table{max-width:760px}
.career td:first-child{font-size:11px;color:var(--muted);width:110px}
.ppq{border-block:1px solid var(--rule);padding:var(--space-5) 0;max-width:760px}
.ppq .q{font:400 24px/1.3 var(--font-heading)}
.ppq summary{color:var(--accent);min-height:44px;display:flex;align-items:center;font-size:12px}
.ppq .a{font-size:13px}
.peersec ul,.vs-more ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:var(--space-3)}
.peersec li a,.vs-more li a{display:inline-flex;align-items:center;min-height:44px;font-size:12px}
.peersec .sub{font-size:11px}
.neigh p{font-size:13px}
.neigh a{min-height:44px;display:inline-flex;align-items:center}
.vs-head{padding:var(--space-6) 0 var(--space-5)}
.vs-head h1{font-size:clamp(51px,6.6vw,84px);max-width:850px}
.vs-head .kick{color:var(--muted);font-size:13px;max-width:760px;margin-top:var(--space-4)}
.vs-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4);position:relative;align-items:start;padding-top:var(--space-5);border-top:1px solid var(--rule)}
.vs-side{min-width:0}
.vs-side img,.vs-noimg{width:100%;height:auto;aspect-ratio:4/5;object-fit:contain;border:var(--space-2) solid var(--surface);outline:1px solid var(--rule);margin-bottom:var(--space-5);background:var(--surface)}
.vs-noimg{display:grid;place-items:center;font:400 44px var(--font-heading);color:var(--muted)}
.vs-side h2{font-size:clamp(26px,3.3vw,44px);overflow-wrap:anywhere}
.vs-side h2 a{color:var(--ink);text-decoration:none}
.vs-sub{font-size:10px;color:var(--muted);margin:var(--space-3) 0 var(--space-5)}
.vs-side dl{border-top:1px solid var(--rule)}
.vs-side dl>div{padding:var(--space-3) 0;border-bottom:1px solid var(--rule);font-size:11px}
.vs-side dt{color:var(--muted);font-size:10px}
.vs-side dd{margin-top:var(--space-2);overflow-wrap:anywhere}
.vs-desc{font-size:12px;line-height:1.7;margin-top:var(--space-5)}
.vs-mid{position:absolute;left:50%;top:130px;transform:translateX(-50%);font:400 19px var(--font-heading);color:var(--accent);background:var(--surface);border:1px solid var(--rule);border-radius:50%;width:34px;height:34px;display:grid;place-items:center}
.vs-verdict{border-block:1px solid var(--rule);padding:var(--space-6) 0;margin:var(--space-6) 0}
.vs-verdict>p{font-size:13px;max-width:760px}
.vs-bar{display:flex;height:44px;border:1px solid var(--rule);margin:var(--space-4) 0;overflow:hidden;font-size:11px}
.vs-bar span{display:flex;align-items:center;justify-content:center;min-width:0;overflow:hidden}
.vs-bar .l{background:var(--field);color:var(--pitch-ink)}
.vs-bar .r{background:var(--surface);color:var(--ink)}
.born-head{padding:var(--space-6) 0 var(--space-5)}
.born-list{list-style:none;padding:0}
.born-list li{border-bottom:1px solid var(--rule);padding:var(--space-4) 0}
.bd{padding:var(--space-6) 0}
.bdrow{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) 0;border-bottom:1px solid var(--rule)}
.bdrow>span{min-width:0}
.bdrow img,.bdrow .ph{width:44px;height:55px;object-fit:cover;flex:none;background:var(--surface)}
.bdrow .yr{font-size:12px;color:var(--muted);flex:none}
.bdrow .nm{font:400 24px/1.2 var(--font-heading)}
.bdrow .meta{font-size:11px;color:var(--muted)}
.bdnav{display:flex;flex-wrap:wrap;gap:var(--space-4);justify-content:space-between;margin-block:var(--space-5)}
.bdnav a,.bdmonth a{min-height:44px;display:inline-flex;align-items:center;font-size:12px}
.bdmonth{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2) var(--space-5)}
.personal-choice{border:0;border-top:1px solid var(--rule);padding:var(--space-5) 0;margin:var(--space-6) 0;min-width:0}
.personal-choice legend{font:400 27px/1.2 var(--font-heading);padding:0}
.personal-choice label{display:flex;align-items:center;gap:var(--space-3);min-height:48px;border:1px solid var(--rule);background:var(--surface);padding:var(--space-3) var(--space-4);margin-top:var(--space-3);font-size:13px;cursor:pointer}
.personal-choice input{width:18px;height:18px;flex:none}
.personal-choice label:has(input:checked){border-color:var(--accent);outline:1px solid var(--accent)}

@media(min-width:600px){
  .natgrid,.ilist{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ledger{grid-template-columns:repeat(4,minmax(0,1fr))}
  .arena{grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr)}
  .vs{border-block:0;border-inline:1px solid var(--rule)}
  .rgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pc-body{grid-template-columns:140px minmax(0,1fr)}
  .confgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pp{flex-direction:row;gap:var(--space-6)}
  .pp-photo{width:25%}
  .vs-mid{top:200px}
}
@media(min-width:960px){
  body{font-size:16px}
  .brand{font-size:30px}
  .hero__in{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'pic type' 'pic cta';grid-template-rows:1fr auto;gap:var(--space-5) var(--space-8);padding:var(--space-6) 0 var(--space-7)}
  .hero__type{align-self:center}
  .hero__type p{font-size:16px;margin-top:var(--space-5)}
  .hero__cta{align-self:start;padding-bottom:var(--space-6)}
  .top__note{font-size:11px}
  .builder{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--space-7)}
  .pitch{aspect-ratio:3/3.6}
  .tok{width:86px}
  .tok .lbl{font-size:12px;max-width:90px}
  .tok .role{font-size:10px}
  .prow{gap:var(--space-3)}
  .confgrid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .steps{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vs-grid{gap:var(--space-8)}
  .vs-side img,.vs-noimg{max-width:350px}
  .vs-side dl>div{display:grid;grid-template-columns:130px minmax(0,1fr);gap:var(--space-4);font-size:13px}
  .vs-side dd{margin:0}
  .vs-side dt{font-size:11px}
  .vs-desc{font-size:14px}
}
@media(max-width:599px){
  .g-card{flex-direction:column}
  .rrow .rthumb{display:none}
  .rrow .rside{max-width:56px}
  .tabs .tab{font-size:11px;padding:10px 12px}
  .top__nav{gap:var(--space-4)}
  .picker{left:22px;right:22px;top:auto;bottom:22px;transform:none;width:auto;max-height:85dvh}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

.daily-occasion{padding:28px 0;border-block:1px solid var(--rule);overflow-wrap:anywhere}
.daily-occasion h2{font-size:32px;margin:0 0 12px}.daily-occasion h3{font-size:21px;margin:12px 0 6px}
.daily-occasion ul{padding-left:22px;margin:0}.daily-occasion li{margin:8px 0}
.daily-occasion a,.report-error a{color:var(--rust2);text-decoration:underline}
.report-error{margin:28px auto;overflow-wrap:anywhere}.report-error summary{cursor:pointer;min-height:44px;padding:10px 0;color:var(--rust2);text-decoration:underline}
.report-error form{max-width:640px;padding:16px 0}.report-error label{display:block;margin:12px 0 4px;font-weight:bold}
.report-error textarea,.report-error input[type=email]{display:block;width:100%;min-width:0;font:inherit;color:var(--ink);background:var(--panel);border:1px solid var(--ink2);padding:10px}
.report-error button{font:inherit;min-height:44px;padding:8px 16px;margin-top:14px;color:var(--paper);background:var(--ink);border:1px solid var(--ink);cursor:pointer}
.report-error :focus-visible{outline:3px solid var(--rust2);outline-offset:4px}
.report-error .report-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.report-error .report-hint{font-size:16px;margin:10px 0}.report-error output{display:block;min-height:1.6em;margin-top:12px}
