:root{
  box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
  --bg:#ECF0F5;--surface:#FFFFFF;--ink:#111A2C;--muted:#56647A;--line:#CAD3E0;--soft:#DDE4EE;
  --road:#14254A;--roadInk:#F2F5FA;--jaune:#FFD21F;--good:#138A43;--bad:#C0303A;--focus:#2563EB;
  --display:"Saira Extra Condensed","Arial Narrow",Impact,sans-serif;
  --body:"Saira","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --t-plaine:#4FAF55;--t-punch:#F29E1B;--t-montagne:#A0612B;--t-haute:#5F6F86;--t-clm:#2F6FE0;--t-paves:#857A6E;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#0C1322;--surface:#152036;--ink:#E8EDF6;--muted:#9AA8BE;--line:#27375A;--soft:#1C2A45;--road:#070D1A;--focus:#7AA2FF;}}
:root[data-theme="dark"]{--bg:#0C1322;--surface:#152036;--ink:#E8EDF6;--muted:#9AA8BE;--line:#27375A;--soft:#1C2A45;--road:#070D1A;--focus:#7AA2FF;}
*,*::before,*::after{box-sizing:inherit}
html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.45}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
h2{font-family:var(--display);font-weight:900;font-size:clamp(34px,5vw,46px);line-height:.95;margin:0 0 8px}
h3{font-family:var(--display);font-weight:800;font-size:26px;line-height:1.05;margin:0 0 8px}
.lede{color:var(--muted);max-width:64ch;margin:0 0 18px}
.btn{border:0;border-radius:9px;padding:11px 18px;font-weight:600;background:var(--ink);color:var(--bg)}
.btn:hover{filter:brightness(1.12)}
.btn.jaune{background:var(--jaune);color:#111A2C}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn:disabled{opacity:.4;cursor:not-allowed;filter:none}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px}
.muted{color:var(--muted)}

/* En-tête */
.top{background:var(--road);color:var(--roadInk)}
.top-in{max-width:1180px;margin:0 auto;padding:16px 20px 14px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{width:46px;height:46px}
.brand h1{margin:0;font-family:var(--display);font-weight:900;font-size:40px;line-height:.8;letter-spacing:.01em}
.brand h1 span{display:block;font-size:15px;font-weight:700;letter-spacing:.02em;color:var(--jaune);margin-top:4px}
.hud{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.hud button{display:flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:var(--roadInk);border-radius:12px;padding:6px 12px}
.hud b{font-family:var(--display);font-weight:800;font-size:24px;line-height:1}
.hud .packs{background:var(--jaune);color:#111A2C;border-color:var(--jaune)}
.hud .packs.zero{background:rgba(255,255,255,.06);color:var(--roadInk);border-color:rgba(255,255,255,.22)}
.navwrap{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:env(safe-area-inset-top,0px);z-index:20}
nav{max-width:1180px;margin:0 auto;padding:0 12px;display:flex;overflow-x:auto}
nav button{background:none;border:0;border-bottom:4px solid transparent;padding:13px 14px 9px;font-family:var(--display);font-size:22px;font-weight:800;color:var(--muted);white-space:nowrap;position:relative}
nav button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--jaune)}
nav .pip{position:absolute;top:8px;right:4px;background:var(--bad);color:#fff;font-family:var(--body);font-size:11px;font-weight:700;border-radius:9px;padding:0 5px;line-height:16px}
main{max-width:1180px;margin:0 auto;padding:24px 20px 70px}

/* ===== Cartes ===== */
.tc{--cw:190px;width:var(--cw);aspect-ratio:63/88;border-radius:calc(var(--cw)*.055);padding:calc(var(--cw)*.035);position:relative;flex:none;text-align:left;border:0;display:block;
  transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .25s ease-out,box-shadow .25s;box-shadow:0 2px 6px rgba(10,20,40,.25),0 10px 24px rgba(10,20,40,.12);color:#111A2C;font-family:var(--body)}
.tc.live{transition:transform .06s linear}
.tc.r0{background:linear-gradient(135deg,#d4d9e0,#8b949f 30%,#e3e6ea 55%,#7d8692 80%,#c9ced5)}
.tc.r1{background:linear-gradient(135deg,#9be3b6,#1f8f4e 30%,#b5ecc8 55%,#177a41 80%,#86d8a5)}
.tc.r2{background:linear-gradient(135deg,#b3d6ff,#1f5fd1 30%,#cfe4ff 55%,#1a4fb0 80%,#8fc3ff)}
.tc.r3{background:linear-gradient(135deg,#e7d1ff,#7b35d6 30%,#f0e2ff 55%,#5e22b5 80%,#cfa6ff)}
.tc.r4{background:linear-gradient(135deg,#fff3b8,#d4a019 25%,#fff8d8 45%,#b8860b 65%,#ffe27a 85%,#c9951a)}
.tc-in{position:relative;height:100%;border-radius:calc(var(--cw)*.035);background:#F6F8FB;overflow:hidden;display:flex;flex-direction:column}
.tc-head{display:flex;align-items:center;gap:calc(var(--cw)*.03);padding:calc(var(--cw)*.03) calc(var(--cw)*.04) calc(var(--cw)*.02)}
.tc-name{font-family:var(--display);font-weight:900;font-size:calc(var(--cw)*.105);line-height:.92;flex:1;min-width:0;margin:0}
.tc-name small{display:block;font-family:var(--body);font-weight:600;font-size:calc(var(--cw)*.052);color:#56647A;line-height:1.2;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tc-note{flex:none;width:calc(var(--cw)*.19);height:calc(var(--cw)*.19);border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-weight:900;font-size:calc(var(--cw)*.1);color:#fff;background:#111A2C;box-shadow:inset 0 0 0 calc(var(--cw)*.012) rgba(255,255,255,.35)}
.r4 .tc-note{background:linear-gradient(135deg,#b8860b,#f4c430,#8a6408);color:#111A2C}
.r3 .tc-note{background:linear-gradient(135deg,#5e22b5,#a26bf0)}
.r2 .tc-note{background:linear-gradient(135deg,#1a4fb0,#4c8ef5)}
.r1 .tc-note{background:linear-gradient(135deg,#177a41,#39b56b)}
.tc-art{position:relative;margin:0 calc(var(--cw)*.035);border-radius:calc(var(--cw)*.025);overflow:hidden;aspect-ratio:200/120;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18)}
.tc-art svg{display:block;width:100%;height:100%}
.tc-tag{position:absolute;left:calc(var(--cw)*.025);bottom:calc(var(--cw)*.025);background:rgba(17,26,44,.82);color:#fff;font-size:calc(var(--cw)*.05);font-weight:600;border-radius:calc(var(--cw)*.02);padding:1px calc(var(--cw)*.03)}
.tc-nat{position:absolute;right:calc(var(--cw)*.025);top:calc(var(--cw)*.025);background:#fff;color:#111A2C;font-family:var(--display);font-weight:800;font-size:calc(var(--cw)*.06);border-radius:calc(var(--cw)*.02);padding:0 calc(var(--cw)*.025);box-shadow:0 1px 3px rgba(0,0,0,.3)}
.tc-stats{display:grid;grid-template-columns:repeat(var(--nstat,5),1fr);gap:calc(var(--cw)*.012);padding:calc(var(--cw)*.035) calc(var(--cw)*.035) 0}
.tc-stats div{background:#E7ECF3;border-radius:calc(var(--cw)*.02);text-align:center;padding:calc(var(--cw)*.012) 0}
.tc-stats b{display:block;font-family:var(--display);font-weight:900;font-size:calc(var(--cw)*.085);line-height:1}
.tc-stats span{display:block;font-size:calc(var(--cw)*.042);font-weight:700;color:#56647A;line-height:1.2}
.tc-stats .hi{background:#111A2C;color:#fff}.tc-stats .hi span{color:#C9D3E3}
.tc-fx{padding:calc(var(--cw)*.03) calc(var(--cw)*.045) 0;display:grid;gap:calc(var(--cw)*.01);font-size:calc(var(--cw)*.056);font-weight:600;line-height:1.25}
.tc-fx .p{color:#0E7A3A}.tc-fx .m{color:#B42331}.tc-fx .s{color:#3A4760}
.tc-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding:calc(var(--cw)*.025) calc(var(--cw)*.045) calc(var(--cw)*.035);font-size:calc(var(--cw)*.048);color:#56647A;font-weight:600;gap:6px}
.tc-foot span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gem{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.gem i{width:calc(var(--cw)*.05);height:calc(var(--cw)*.05);transform:rotate(45deg);display:inline-block;border:1px solid rgba(0,0,0,.3)}
.tc-count{position:absolute;right:-6px;top:-6px;z-index:3;background:var(--jaune);color:#111A2C;font-family:var(--display);font-weight:900;font-size:16px;border-radius:9px;padding:0 7px;box-shadow:0 2px 5px rgba(0,0,0,.3)}
.tc-new{position:absolute;left:-6px;top:-6px;z-index:3;background:var(--bad);color:#fff;font-weight:700;font-size:12px;border-radius:9px;padding:1px 8px;box-shadow:0 2px 5px rgba(0,0,0,.3)}
/* Reflets */
.glare,.holo{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2}
.glare{background:radial-gradient(circle at var(--px,50%) var(--py,30%),rgba(255,255,255,.55),rgba(255,255,255,0) 55%);mix-blend-mode:soft-light;opacity:.5}
.tc.live .glare{opacity:1}
.r2 .holo{background:linear-gradient(115deg,transparent 30%,rgba(190,225,255,.75) 45%,rgba(255,255,255,.9) 50%,rgba(190,225,255,.75) 55%,transparent 70%);background-size:300% 100%;background-position:var(--px,50%) 0;mix-blend-mode:soft-light;opacity:.55}
.r3 .holo{background:repeating-linear-gradient(115deg,#ff5fa2 0%,#ffd76a 4%,#6dffb5 8%,#5ec8ff 12%,#b77dff 16%,#ff5fa2 20%);background-size:400% 400%;background-position:var(--px,30%) var(--py,30%);mix-blend-mode:color-dodge;opacity:.22;animation:holoIdle 7s ease-in-out infinite alternate}
.r4 .holo{background-image:radial-gradient(circle,rgba(255,255,255,.95) 0 .8px,transparent 1.3px),radial-gradient(circle,rgba(255,246,200,.9) 0 .6px,transparent 1.1px),repeating-linear-gradient(120deg,#fff4c2 0%,#f0b92b 5%,#fffbe8 10%,#cf9412 15%,#9df5ff 20%,#fff4c2 25%);background-size:13px 13px,7px 7px,300% 300%;background-position:calc(var(--px,50%) * .3) calc(var(--py,50%) * .3),calc(var(--px,50%) * -.2) 0,var(--px,40%) var(--py,40%);mix-blend-mode:color-dodge;opacity:.36;animation:holoIdle 5s ease-in-out infinite alternate}
.tc.live .holo{animation:none}
.r3.tc.live .holo{opacity:.4}.r4.tc.live .holo{opacity:.55}
@keyframes holoIdle{from{background-position:0% 20%}to{background-position:100% 80%}}
.tc.r4{box-shadow:0 2px 6px rgba(10,20,40,.25),0 0 22px rgba(244,196,48,.45)}
.tc.r3{box-shadow:0 2px 6px rgba(10,20,40,.25),0 0 16px rgba(162,107,240,.35)}
button.tc:hover{--lift:1}
.tc.missing{background:var(--soft);box-shadow:none}
.tc.missing .tc-in{background:transparent;border:2px dashed var(--line);align-items:center;justify-content:center;color:var(--muted);text-align:center;padding:10px}
.tc.missing b{font-family:var(--display);font-size:calc(var(--cw)*.3);line-height:1}
.tc.missing small{font-size:calc(var(--cw)*.06)}
.tc.dim{opacity:.35;filter:grayscale(.7)}
.tc.sel{outline:4px solid var(--jaune);outline-offset:3px}
/* Dos de carte */
.cback{--cw:190px;width:var(--cw);aspect-ratio:63/88;border-radius:calc(var(--cw)*.055);background:#0E1D40;position:relative;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,.35);border:calc(var(--cw)*.035) solid #F6F8FB}
.cback::before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 50% 50%,rgba(255,255,255,.07) 0 6deg,transparent 6deg 12deg)}
.cback::after{content:"";position:absolute;left:50%;top:50%;width:48%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:calc(var(--cw)*.03) solid var(--jaune);box-shadow:0 0 0 calc(var(--cw)*.02) #0E1D40,0 0 0 calc(var(--cw)*.03) rgba(255,210,31,.5)}
.cback span{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;color:#fff;font-family:var(--display);font-weight:900;font-size:calc(var(--cw)*.13);line-height:.85;z-index:1}
.cback span small{display:block;font-size:.55em;color:var(--jaune)}
.grid{display:flex;flex-wrap:wrap;gap:16px}
.grid .tc{content-visibility:auto;contain-intrinsic-size:auto 250px}

/* ===== Ravito ===== */
.ravito{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:34px;align-items:center}
@media(max-width:760px){.ravito{grid-template-columns:1fr}}
.counter{display:flex;align-items:flex-end;gap:14px;margin:6px 0 14px}
.counter b{font-family:var(--display);font-weight:900;font-size:120px;line-height:.78}
.counter span{font-family:var(--display);font-weight:800;font-size:28px;line-height:1;padding-bottom:6px}
.counter span small{display:block;font-family:var(--body);font-size:14px;font-weight:500;color:var(--muted);margin-top:6px}
.stage-pack{position:relative;height:430px;display:grid;place-items:center}
.pack-ghost{position:absolute;width:236px;height:370px;border-radius:14px;background:#0f2358;box-shadow:0 6px 18px rgba(0,0,0,.3)}
.pack{--rx:0deg;--ry:0deg;position:relative;width:236px;height:370px;border:0;padding:0;background:none;transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .2s ease-out;filter:drop-shadow(0 14px 22px rgba(8,16,40,.45))}
.pack:disabled{cursor:default}
.pack.live{transition:transform .06s linear}
.pack-top,.pack-rest{position:absolute;left:0;right:0;transition:transform .7s cubic-bezier(.3,.7,.3,1),opacity .6s}
.pack-top{top:0;height:44px;z-index:2}
.pack-rest{top:44px;bottom:0}
.foil{background:linear-gradient(160deg,#2451c4 0%,#0d1f52 38%,#2c5fd6 62%,#0b1a45 100%)}
.crimp{height:18px;background:linear-gradient(90deg,#c9d3e6,#8391ad,#e6ebf5,#7a88a6,#d5dcea);-webkit-mask:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) 50%/12px 100%;mask:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) 50%/12px 100%}
.crimp.bot{-webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/12px 100%;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/12px 100%}
.crimp::after{content:"";display:block;height:100%;background:repeating-linear-gradient(90deg,rgba(0,0,0,.18) 0 1px,transparent 1px 4px)}
.tearline{height:26px;border-bottom:2px dashed rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center;font-size:11px;color:rgba(255,255,255,.75);letter-spacing:.04em}
.pack-face{position:absolute;inset:0 0 18px 0;display:flex;flex-direction:column;align-items:center;padding:12px 14px 0;color:#fff;overflow:hidden}
.pack-logo{font-family:var(--display);font-weight:900;font-size:50px;line-height:.8;text-align:center;letter-spacing:.01em;text-shadow:0 2px 0 rgba(0,0,0,.25)}
.pack-logo small{display:block;font-size:17px;color:var(--jaune);letter-spacing:.02em;margin-top:4px}
.pack-face svg{width:100%;margin-top:8px}
.pack-band{margin-top:auto;margin-bottom:10px;background:var(--jaune);color:#111A2C;font-family:var(--display);font-weight:900;font-size:26px;padding:3px 16px;border-radius:6px;transform:rotate(-3deg);box-shadow:0 3px 0 rgba(0,0,0,.25)}
.pack-sub{font-size:13px;opacity:.85;margin-bottom:8px}
.pack .glare{border-radius:6px;opacity:.7}
.pack .holo{border-radius:6px;background:repeating-linear-gradient(115deg,#ff5fa2 0%,#ffd76a 5%,#6dffb5 10%,#5ec8ff 15%,#b77dff 20%,#ff5fa2 25%);background-size:400% 400%;background-position:var(--px,30%) var(--py,30%);mix-blend-mode:color-dodge;opacity:.16}
.pack.torn .pack-top{transform:translate(70px,-140px) rotate(24deg);opacity:0}
.pack.torn .pack-rest{transform:translateY(90px);opacity:0;transition-delay:.35s}
.pack.empty{opacity:.4;filter:grayscale(.6)}
.stack{position:absolute;inset:0;display:grid;place-items:center}
.stack-in{position:relative;width:200px;aspect-ratio:63/88}
.stack .cback{--cw:200px;position:absolute;inset:0;transition:transform .3s}
.stack button{position:absolute;inset:0;background:none;border:0;padding:0;z-index:10;border-radius:12px}
.stack-label{position:absolute;bottom:0;left:0;right:0;text-align:center;font-weight:600}
.revealed{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px;min-height:10px}
.flip-in{--cw:170px;width:var(--cw);aspect-ratio:63/88;position:relative;transform-style:preserve-3d;animation:flipIn .7s cubic-bezier(.2,.8,.2,1) both}
.flip-in>.tc{position:absolute;inset:0}
@keyframes flipIn{0%{transform:translateY(-40px) rotateY(180deg) scale(.8);opacity:0}40%{opacity:1}100%{transform:none}}
.burst{position:fixed;inset:0;pointer-events:none;z-index:60;animation:burst 1.1s ease-out forwards}
.burst.r4{background:radial-gradient(circle at 50% 50%,rgba(255,215,64,.75),rgba(255,215,64,0) 60%)}
.burst.r3{background:radial-gradient(circle at 50% 50%,rgba(170,110,255,.6),rgba(170,110,255,0) 60%)}
@keyframes burst{from{opacity:1}to{opacity:0}}
.note-line{margin-top:16px;font-weight:600}

/* ===== Filtres, recherche ===== */
.bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 12px}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:5px 13px;font-size:14px;display:inline-flex;align-items:center;gap:6px}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.dot{width:12px;height:12px;border-radius:50%;display:inline-block;border:1px solid rgba(0,0,0,.2)}
.search{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:8px 12px;min-width:220px}
.progress{height:8px;background:var(--soft);border-radius:9px;overflow:hidden;max-width:420px;margin:4px 0 18px}
.progress b{display:block;height:100%;background:var(--good)}

/* ===== Modale détail ===== */
.overlay{position:fixed;inset:0;background:rgba(6,12,26,.72);z-index:50;display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto}
.modal{background:var(--surface);border-radius:18px;max-width:880px;width:100%;display:grid;grid-template-columns:auto 1fr;gap:28px;padding:26px;position:relative;max-height:100%;overflow:auto}
@media(max-width:720px){.modal{grid-template-columns:1fr;justify-items:center;padding:18px}}
.modal .x{position:absolute;right:12px;top:10px;border:0;background:none;font-size:28px;line-height:1;color:var(--muted)}
.facts{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:15px;margin:10px 0 16px}
.facts dt{color:var(--muted)}.facts dd{margin:0;font-weight:600}
.terrbars{display:grid;gap:5px;max-width:420px}
.tb{display:grid;grid-template-columns:130px 1fr 32px;align-items:center;gap:8px;font-size:14px}
.tb i{height:9px;border-radius:9px;background:var(--soft);display:block;overflow:hidden}.tb i b{display:block;height:100%}
.tb span:last-child{font-family:var(--display);font-weight:800;font-size:19px;text-align:right}
.sig{font-style:italic;border-left:4px solid var(--jaune);padding:2px 0 2px 12px;margin:0 0 14px}

/* ===== Calendrier ===== */
.month{margin:26px 0 10px;font-family:var(--display);font-weight:800;font-size:24px;color:var(--muted)}
.races{display:grid;gap:8px}
.race{display:grid;grid-template-columns:88px 1fr 190px 150px;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 14px;text-align:left;width:100%}
.race:hover{border-color:var(--ink)}
.race.past{opacity:.55}
@media(max-width:760px){.race{grid-template-columns:70px 1fr;}.race .mix,.race .st{grid-column:2}}
.race .d{font-family:var(--display);font-weight:800;font-size:20px;line-height:1}
.race .d small{display:block;font-family:var(--body);font-weight:500;font-size:12px;color:var(--muted)}
.race strong{font-family:var(--display);font-size:22px;font-weight:800;line-height:1;display:block}
.race em{font-style:normal;font-size:13px;color:var(--muted)}
.mixbar{display:flex;height:10px;border-radius:9px;overflow:hidden;background:var(--soft)}
.status{font-size:13px;font-weight:700;border-radius:999px;padding:3px 10px;justify-self:start;white-space:nowrap}
.status.open{background:var(--jaune);color:#111A2C}
.status.run{background:#2F6FE0;color:#fff}
.status.done{background:var(--soft);color:var(--ink)}
.status.in{background:var(--good);color:#fff}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.hero-race{background:var(--road);color:var(--roadInk);border-radius:16px;padding:20px 22px;display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;margin-bottom:10px}
.hero-race h3{font-size:34px;margin:0}
.hero-race p{margin:4px 0 0;opacity:.85}
@media(max-width:640px){.hero-race{grid-template-columns:1fr}}

/* ===== Page course ===== */
.back{background:none;border:0;padding:0;color:var(--muted);font-weight:600;margin-bottom:12px}
.rhead{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:start;margin-bottom:16px}
@media(max-width:700px){.rhead{grid-template-columns:1fr}}
.meteo{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 14px;min-width:220px}
.meteo b{font-family:var(--display);font-size:24px}
.slots{display:flex;gap:12px;flex-wrap:wrap;margin:10px 0 6px}
.slot{--cw:132px;width:var(--cw);aspect-ratio:63/88;border:2px dashed var(--line);border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);text-align:center;font-size:13px;padding:6px;background:transparent}
.slot b{font-family:var(--display);font-size:30px;line-height:1}
.slots .tc{--cw:132px}
.est{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 18px;margin:14px 0}
.est .big{font-family:var(--display);font-weight:900;font-size:56px;line-height:.9}
.picker{margin-top:18px}
.pick-grid{display:flex;flex-wrap:wrap;gap:14px}
.pcard{display:flex;flex-direction:column;align-items:center;gap:4px}
.pcard .tc{--cw:140px}
.pcard .fit{font-family:var(--display);font-weight:800;font-size:18px}
.pcard .info{border:0;background:none;color:var(--muted);font-size:13px;text-decoration:underline;padding:0}
.lb{width:100%;border-collapse:collapse;background:var(--surface);border-radius:12px;overflow:hidden}
.lb th,.lb td{padding:9px 12px;text-align:left;border-bottom:1px solid var(--line)}
.lb th{font-size:13px;color:var(--muted);font-weight:600}
.lb td.n{font-family:var(--display);font-weight:800;font-size:20px;width:48px}
.lb tr.me td{background:rgba(255,210,31,.18)}
.lb .bot{color:var(--muted);font-size:13px}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.notice{background:var(--soft);border-radius:12px;padding:14px 16px;margin:12px 0}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 18px;border-radius:12px;font-weight:600;z-index:70;box-shadow:0 6px 20px rgba(0,0,0,.3);max-width:90vw}

/* ===== Accueil / compte ===== */
.onb{max-width:520px;margin:30px auto;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:28px}
.field{display:grid;gap:6px;margin:16px 0}
.field input{border:1px solid var(--line);background:var(--bg);border-radius:10px;padding:11px 13px;font-size:17px}
.err{color:var(--bad);font-weight:600;min-height:1.4em}
.splash{display:grid;place-items:center;min-height:50vh;color:var(--muted);font-weight:600}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ===== Ajouts v3 ===== */
.tc-art img{display:block;width:100%;height:100%;object-fit:cover}
.ribbon{position:absolute;left:0;top:calc(var(--cw)*.03);z-index:1;font-family:var(--display);font-weight:800;font-size:calc(var(--cw)*.058);line-height:1.15;padding:1px calc(var(--cw)*.035) 1px calc(var(--cw)*.03);border-radius:0 calc(var(--cw)*.02) calc(var(--cw)*.02) 0;box-shadow:0 1px 3px rgba(0,0,0,.35);max-width:85%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#111A2C;background:#fff}
.ribbon.jaune{background:#FFD21F}.ribbon.vert{background:#1FA046;color:#fff}.ribbon.blanc{background:#fff}
.ribbon.pois{background-color:#fff;color:#C8102E;box-shadow:inset calc(var(--cw)*-.03) 0 0 #fff,0 1px 3px rgba(0,0,0,.35);border-right:calc(var(--cw)*.04) dotted #E0242B}
.ribbon.rose{background:#F7A8C8}.ribbon.rouge{background:#D7263D;color:#fff}.ribbon.olympique{background:linear-gradient(90deg,#f7e08a,#d4a019);}
.ribbon.arc,.ribbon.arccx{background:#fff;padding-bottom:calc(var(--cw)*.028);background-image:linear-gradient(90deg,#1F4FB5 0 20%,#E0242B 20% 40%,#111 40% 60%,#FFD21F 60% 80%,#1FA046 80%);background-size:100% calc(var(--cw)*.022);background-repeat:no-repeat;background-position:bottom}
.ribbon.equipe{background:var(--tc1,#fff);color:var(--tc2,#111)}
.tc-desc{margin:calc(var(--cw)*.025) calc(var(--cw)*.045) 0;font-size:calc(var(--cw)*.05);line-height:1.28;color:#3A4760;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.tpicto{display:inline-flex;align-items:center;gap:calc(var(--cw)*.02);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tpicto svg{flex:none;width:calc(var(--cw)*.085);height:calc(var(--cw)*.078)}
.tpicto span{overflow:hidden;text-overflow:ellipsis}
.disc{font-size:12px;font-weight:700;border-radius:6px;padding:1px 7px;background:var(--soft);color:var(--ink);white-space:nowrap}
.disc.cx{background:#5B4636;color:#fff}
.credit{font-size:12px;color:var(--muted);margin-top:10px;max-width:280px}
.demo{background:#FFF3C4;color:#5A4500;text-align:center;font-size:14px;padding:6px 12px}
.auth{max-width:440px;margin:30px auto;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:28px}
.auth .tabs{display:flex;gap:6px;margin-bottom:16px}
.auth .link{background:none;border:0;padding:0;color:var(--focus);text-decoration:underline;font-size:14px}
.ok{color:var(--good);font-weight:600}
footer{max-width:1180px;margin:0 auto;padding:20px;color:var(--muted);font-size:13px;display:flex;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line)}
footer a{color:inherit}
.danger{background:var(--bad);color:#fff}
.bad{color:var(--bad);font-weight:600}
.tc-name.long{font-size:calc(var(--cw)*.078)}

.tc-name .ed{display:block;font-style:normal;font-family:var(--display);font-weight:800;font-size:calc(var(--cw)*.062);line-height:1.05;margin-top:calc(var(--cw)*.012);color:#B5121B}
.tc.r4 .tc-name .ed{color:#8A5A00}
.fav{position:absolute;top:calc(var(--cw)*.012);right:calc(var(--cw)*.012);z-index:4;width:calc(var(--cw)*.13);height:calc(var(--cw)*.13);min-width:24px;min-height:24px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#9AA3AF;font-size:calc(var(--cw)*.1);line-height:1;box-shadow:0 2px 6px rgba(0,0,0,.25);cursor:pointer;border:2px solid #E3E8F0}
.fav:hover{color:#D4A019}.fav.on{color:#fff;background:#D4A019;border-color:#B8860B}
.fav:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.tpicto svg{width:calc(var(--cw)*.12)!important;height:calc(var(--cw)*.108)!important}
.coins{font-weight:800}
.market-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}
.lot{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px;display:flex;flex-direction:column;align-items:center;gap:8px}
.lot .meta{width:100%;font-size:14px}
.lot .meta b{font-size:20px}
.lot .row{width:100%;justify-content:center}
.lot input{width:96px;padding:8px;border:1px solid var(--line);border-radius:8px;font:inherit}
.lot.lead{border-color:var(--good);box-shadow:0 0 0 2px var(--good)}
.lot .tag{font-size:12px;font-weight:700;border-radius:999px;padding:2px 9px;background:var(--soft)}
.lot .tag.good{background:var(--good);color:#fff}.lot .tag.bad{background:var(--bad);color:#fff}
.sellbox label{display:block;margin:10px 0 4px;font-weight:600}
.sellbox input,.sellbox select{padding:9px;border:1px solid var(--line);border-radius:8px;font:inherit;width:160px}
.big-jersey{width:120px;height:108px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tc-count{right:calc(var(--cw)*.16);top:calc(var(--cw)*.012)}
.sellbox input[type=checkbox]{width:auto;margin-right:6px}

.tpicto{white-space:normal!important}
.tname{font-weight:700;font-size:calc(var(--cw)*.056);line-height:1.1;color:#1B2436;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tname.none{font-weight:500;font-style:italic;color:#8A93A3}

/* ================= Identité TCG Pro Cycling ================= */
:root{--bg:#F5F3EE;--surface:#FFFFFF;--ink:#0E1B3D;--muted:#5B6479;--line:#D6D5D1;--soft:#ECEAE3;--road:#0E1B3D;--roadInk:#F5F3EE;
 --jaune:#FFD100;--bleu:#0072CE;--rouge:#E1001A;--vert:#009A44;--good:#009A44;--bad:#E1001A;--focus:#0072CE;
 --display:"Barlow Condensed","Arial Narrow",Impact,sans-serif;--body:"Barlow","Segoe UI",Roboto,Helvetica,Arial,sans-serif}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#081230;--surface:#101E47;--ink:#F5F3EE;--muted:#A9B2C8;--line:#24356A;--soft:#152658;--road:#0E1B3D;--focus:#5AA9FF}}
:root[data-theme="dark"]{--bg:#081230;--surface:#101E47;--ink:#F5F3EE;--muted:#A9B2C8;--line:#24356A;--soft:#152658;--road:#0E1B3D;--focus:#5AA9FF}
h2,h3,nav button,.hud b,.btn,.month{font-style:italic}
h2{font-weight:900;letter-spacing:.01em;text-transform:uppercase}
/* Traînées aux couleurs du logo, en signature sous les titres */
main>h2::after,.rhead h2::after{content:"";display:block;width:84px;height:6px;margin-top:6px;background:linear-gradient(90deg,var(--bleu) 0 20%,var(--rouge) 20% 40%,#fff 40% 60%,var(--jaune) 60% 80%,var(--vert) 80%);transform:skewX(-20deg);box-shadow:0 0 0 1px rgba(14,27,61,.15)}
.top{background:var(--road);border-bottom:4px solid var(--jaune)}
.brand{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.brand h1{margin:0;line-height:0}
.brand-logo{height:58px;width:auto;display:block}
.tagline{font-family:var(--display);font-style:italic;font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--jaune);padding-left:4px}
@media (max-width:640px){.brand-logo{height:42px}.tagline{font-size:12px}}
nav button[aria-selected="true"]{border-bottom-color:var(--jaune)}
.btn.jaune{background:var(--jaune);color:#0E1B3D;border-color:#0E1B3D}
.btn{border-radius:6px}
.btn.small{padding:4px 10px;font-size:15px;min-height:0}
.hud .clockchip{background:rgba(255,209,0,.12);border-color:rgba(255,209,0,.5)}
.hud .clockchip small{display:block;font-size:11px;letter-spacing:.04em;text-transform:uppercase;opacity:.8;line-height:1}
.hud .clockchip b{font-size:20px}
.hud .clockchip .ico{font-size:18px}
.demo{background:var(--jaune);color:#0E1B3D}
footer{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}
.langsel{display:inline-flex;gap:6px;align-items:center;margin-left:auto}
.langsel select{font:inherit;border:1px solid var(--line);border-radius:6px;padding:3px 6px;background:var(--surface);color:var(--ink)}
.auth-logo{background:#F5F3EE;border-radius:12px;padding:10px 14px;margin-bottom:18px}
.auth-logo svg{display:block;width:100%;max-width:420px;height:auto}

/* Cartes aux couleurs de la marque */
.tc-in{background:#F5F3EE}
.tc-stats div{background:#E6E3DA}
.tc-stats .hi{background:#0E1B3D;color:#FFD100}
.tc-stats .hi span{color:#F5F3EE}
.tc-name{font-style:italic}
.tc-foot{justify-content:flex-start;padding-right:calc(var(--cw)*.17)}
.tc-foot .gem{flex:none}
.tpicto{min-width:0;display:flex;align-items:center;gap:4px}
.tpicto .tname{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Bouton pour retourner la carte, et verso */
.tc .flip{position:absolute;right:calc(var(--cw)*.03);bottom:calc(var(--cw)*.025);z-index:4;width:calc(var(--cw)*.12);height:calc(var(--cw)*.12);min-width:22px;min-height:22px;border-radius:50%;display:grid;place-items:center;background:#0E1B3D;color:#FFD100;font-size:calc(var(--cw)*.075);font-weight:900;line-height:1;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.35)}
.tc .flip:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.tc-back{position:absolute;inset:calc(var(--cw)*.035);border-radius:calc(var(--cw)*.035);background:#0E1B3D;color:#F5F3EE;padding:calc(var(--cw)*.05) calc(var(--cw)*.05) calc(var(--cw)*.16);display:flex;flex-direction:column;gap:calc(var(--cw)*.025);overflow:hidden;opacity:0;visibility:hidden;transform:rotateY(90deg);transition:transform .25s ease,opacity .25s,visibility 0s .25s;font-size:calc(var(--cw)*.048);line-height:1.3;text-align:left;z-index:2}
.tc-back::before{content:"";position:absolute;left:0;right:0;top:0;height:calc(var(--cw)*.022);background:linear-gradient(90deg,#0072CE 0 20%,#E1001A 20% 40%,#fff 40% 60%,#FFD100 60% 80%,#009A44 80%)}
.tc.flipped .tc-back{opacity:1;visibility:visible;transform:none;transition:transform .25s ease,opacity .25s}
.tc.flipped .tc-in{visibility:hidden}
.tc.flipped .flip{background:#FFD100;color:#0E1B3D}
.bk-head b{display:block;font-family:var(--display);font-style:italic;font-weight:900;font-size:calc(var(--cw)*.095);line-height:.95;color:#FFD100}
.bk-head em{display:block;font-style:normal;font-weight:600;font-size:calc(var(--cw)*.05);opacity:.85}
.bk-list{margin:0;display:grid;grid-template-columns:auto 1fr;gap:calc(var(--cw)*.006) calc(var(--cw)*.03)}
.bk-row{display:contents}
.bk-list dt{font-weight:700;color:#FFD100;white-space:nowrap}
.bk-list dd{margin:0;min-width:0}
.bk-pal{display:flex;flex-direction:column;gap:1px}
.bk-pal b{color:#FFD100;font-weight:700}
.bk-pal span{padding-left:calc(var(--cw)*.03);position:relative}
.bk-pal span::before{content:"";position:absolute;left:0;top:.55em;width:calc(var(--cw)*.012);height:calc(var(--cw)*.012);background:#FFD100;border-radius:50%}
.bk-pal .m{color:#FF8A8A}.bk-pal .p{color:#8EE3B0}
.bk-desc{margin:0;opacity:.9;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.bk-foot{margin-top:auto;display:flex;justify-content:space-between;gap:6px;font-weight:700;font-size:calc(var(--cw)*.046)}
.bk-foot .gem{display:inline-flex;align-items:center;gap:4px}

/* Dos des cartes et paquet */
.cback{background:#0E1B3D;border-color:#F5F3EE;display:grid;place-items:center}
.cback::before{background:repeating-linear-gradient(-20deg,rgba(255,255,255,.05) 0 6px,transparent 6px 14px)}
.cback::after{display:none}
.cback svg{position:relative;z-index:1;width:78%;height:auto}
.foil{background:linear-gradient(160deg,#16296a 0%,#0E1B3D 40%,#1c3280 62%,#0a1433 100%)}
.pack-face{justify-content:flex-start;gap:4px}
.pack-stripes{display:flex;flex-direction:column;gap:3px;align-self:stretch;margin:6px 0 2px}
.pack-stripes i{display:block;height:5px;transform:skewX(-20deg);border-radius:1px}
.pack-stripes i:nth-child(1){background:#0072CE;width:46%;margin-left:30%}
.pack-stripes i:nth-child(2){background:#E1001A;width:66%;margin-left:16%}
.pack-stripes i:nth-child(3){background:#fff;width:86%;margin-left:4%}
.pack-stripes i:nth-child(4){background:#FFD100;width:66%;margin-left:16%}
.pack-stripes i:nth-child(5){background:#009A44;width:46%;margin-left:30%}
svg.pack-logo{flex:none;width:64%;height:auto;aspect-ratio:660/530;margin-top:6px;filter:drop-shadow(0 3px 0 rgba(0,0,0,.25))}
svg.pack-word{flex:none;width:96%;height:auto;aspect-ratio:1900/290;margin-top:2px}
.pack-band{font-style:italic;text-transform:uppercase;background:#FFD100;color:#0E1B3D}
.pack-season{font-family:var(--display);font-style:italic;font-weight:800;font-size:15px;color:#FFD100;letter-spacing:.06em;text-transform:uppercase;margin-bottom:6px}

/* Calendrier : mes équipes engagées */
.mine{background:var(--surface);border:1px solid var(--line);border-left:6px solid var(--jaune);border-radius:10px;padding:12px 16px;margin:16px 0}
.mine h3{margin:0 0 8px}
.mine-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.mine-item{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:3px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg)}
.mine-item:hover,.mine-item:focus-visible{border-color:var(--ink)}
.mine-item strong{font-family:var(--display);font-style:italic;font-weight:800;font-size:19px}
.mine-item small{color:var(--muted)}
.mine-riders{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.mine-riders i{font-style:normal;font-size:12px;background:var(--soft);border-radius:4px;padding:1px 6px}
.race .st{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.race small.muted{display:block;font-size:12px;margin-top:2px}
.race.past{opacity:.7}
.cback svg{aspect-ratio:660/530}
.brand-logo{aspect-ratio:3150/520}
.auth-logo svg{aspect-ratio:3150/520}
.pack-band{font-size:21px;white-space:nowrap;margin-top:8px;margin-bottom:6px;padding:2px 12px}
.pack-sub{margin-bottom:2px}
svg.pack-logo{width:56%}
.btn.small{white-space:nowrap}
.tc.flipped .holo{display:none}.tc.flipped .glare{opacity:.3}

/* ===== Typographie moins grasse ===== */
h2{font-weight:800}
h3,nav button,.hud b,.month,.btn{font-weight:700}
.brand h1,.counter b,.big{font-weight:800}
.tc-name{font-weight:800}
.tc-note,.tc-stats b{font-weight:800}
.bk-head b{font-weight:800}
.pack-band{font-weight:800}
.tc-name small{font-weight:500}
.tc-desc{font-weight:400}
.btn.jaune.alt{background:#0E1B3D;color:#FFD100;border-color:#0E1B3D}

/* ===== Mise en lumière des cartes épiques et légendaires ===== */
.spot{position:fixed;inset:0;z-index:200;display:grid;place-items:center;background:radial-gradient(circle at 50% 45%,rgba(14,27,61,.72),rgba(4,8,20,.96));overflow:hidden;animation:spotIn .35s ease both;cursor:pointer}
.spot.out{animation:spotOut .25s ease both}
@keyframes spotIn{from{opacity:0}to{opacity:1}}
@keyframes spotOut{to{opacity:0}}
.spot-rays{position:absolute;left:50%;top:45%;width:180vmax;height:180vmax;transform:translate(-50%,-50%);background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.12) 0 6deg,transparent 6deg 18deg);animation:rays 18s linear infinite;mask:radial-gradient(circle,#000 0 18%,transparent 55%);-webkit-mask:radial-gradient(circle,#000 0 18%,transparent 55%)}
.spot.r3 .spot-rays{background:repeating-conic-gradient(from 0deg,rgba(186,120,255,.35) 0 6deg,transparent 6deg 18deg)}
.spot.r4 .spot-rays{background:repeating-conic-gradient(from 0deg,rgba(255,209,0,.45) 0 6deg,transparent 6deg 16deg)}
@keyframes rays{to{transform:translate(-50%,-50%) rotate(360deg)}}
.spot-in{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:20px}
.spot-kicker{margin:0;font-family:var(--display);font-style:italic;font-weight:800;font-size:clamp(34px,7vw,64px);line-height:1;text-transform:uppercase;letter-spacing:.02em;color:#fff;text-shadow:0 3px 0 rgba(0,0,0,.35);animation:kick .6s cubic-bezier(.2,1.6,.4,1) both}
.spot.r3 .spot-kicker{color:#E7D1FF}
.spot.r4 .spot-kicker{color:#FFD100;background:linear-gradient(90deg,#fff3b8,#FFD100 40%,#fff8d8 60%,#d4a019);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
@keyframes kick{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
.spot-card{position:relative;animation:cardIn .8s cubic-bezier(.2,.9,.3,1.2) .1s both;cursor:default}
.spot-card .tc{position:relative}
.spot.r4 .spot-card{filter:drop-shadow(0 0 30px rgba(255,209,0,.8)) drop-shadow(0 0 70px rgba(255,209,0,.45))}
.spot.r3 .spot-card{filter:drop-shadow(0 0 26px rgba(162,107,240,.75))}
@keyframes cardIn{0%{transform:perspective(900px) rotateY(540deg) scale(.3);opacity:0}70%{opacity:1}100%{transform:none}}
.spot-name{margin:0;color:#fff;font-family:var(--display);font-style:italic;font-weight:700;font-size:26px}
.spot-bits i{position:absolute;left:var(--x);top:-4%;width:9px;height:14px;background:hsl(var(--h) 90% 60%);border-radius:2px;animation:fall 3.2s linear var(--d) infinite;opacity:.9}
.spot.r4 .spot-bits i:nth-child(3n){background:#FFD100}
@keyframes fall{to{transform:translateY(110vh) rotate(540deg)}}
@media (prefers-reduced-motion: reduce){.spot,.spot-rays,.spot-kicker,.spot-card,.spot-bits i{animation:none}}

/* ===== Page d'une course ===== */
.rinfo{display:grid;grid-template-columns:1.3fr 1fr;gap:22px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin:14px 0}
@media (max-width:760px){.rinfo{grid-template-columns:1fr}}
.rinfo h3{margin:0 0 6px}
.profile{display:block;width:100%;height:auto;max-height:130px}
.rchips{display:flex;flex-wrap:wrap;gap:6px}
.rchip{all:unset;cursor:pointer;display:inline-flex;flex-direction:column;padding:5px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);line-height:1.15}
.rchip:hover,.rchip:focus-visible{border-color:var(--ink)}
.rchip b{font-family:var(--display);font-style:italic;font-weight:700;font-size:17px}
.rchip small{color:var(--muted);font-size:12px}
.rchip.lieu{border-left:4px solid var(--jaune)}
.realtop{margin:6px 0;padding-left:26px;display:grid;gap:3px}
.realtop li span{display:inline-block;min-width:180px}
.realtop li b{color:var(--good)}
details.panel summary{cursor:pointer}
.lb.small td{padding:4px 8px}
.modal.reward{max-width:520px;grid-template-columns:1fr}
.spot{background:radial-gradient(circle at 50% 45%,rgba(14,27,61,.9),rgba(4,8,20,.98))}
.spot-rays{mask:radial-gradient(circle,#000 0 8%,transparent 32%);-webkit-mask:radial-gradient(circle,#000 0 8%,transparent 32%)}
.spot.r4 .spot-rays{background:repeating-conic-gradient(from 0deg,rgba(255,209,0,.3) 0 5deg,transparent 5deg 15deg)}
.spot.r3 .spot-rays{background:repeating-conic-gradient(from 0deg,rgba(186,120,255,.28) 0 5deg,transparent 5deg 15deg)}

/* ===== En-tête : le compte en petit au-dessus, ravitos et compte à rebours dessous ===== */
.top-in{flex-wrap:nowrap;align-items:center}
.brand{--lw:351px;flex:none}
.brand-logo{width:var(--lw);height:auto}
.tagline{padding-left:calc(var(--lw) * .396);width:calc(var(--lw) * .6);box-sizing:border-box;text-align:center;font-size:13px;letter-spacing:.05em;margin-top:2px}
.hud-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:8px;min-width:0}
.account{display:flex;gap:4px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.account button{background:none;border:0;color:var(--roadInk);opacity:.85;font-size:13px;padding:2px 6px;display:inline-flex;align-items:center;gap:6px;border-radius:6px}
.account button:hover{opacity:1;background:rgba(255,255,255,.08)}
.account b{font-family:var(--display);font-style:italic;font-weight:700;font-size:16px}
.account .av{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--jaune);color:#0E1B3D;font-weight:800;font-size:12px}
.account button+button::before{content:"·";margin-right:6px;opacity:.5}
.hud{flex-wrap:nowrap}
.hud .clockchip b{font-variant-numeric:tabular-nums;min-width:4.6em;display:inline-block}
@media (max-width:760px){.top-in{flex-wrap:wrap}.brand{--lw:260px}.hud-wrap{align-items:flex-start;width:100%}.account{justify-content:flex-start}}

/* ===== Carte : rôle, dos avec le bandeau, édition limitée ===== */
.tc-role{position:absolute;left:calc(var(--cw)*.025);bottom:calc(var(--cw)*.025);font-size:calc(var(--cw)*.048);font-weight:700;padding:1px calc(var(--cw)*.03);border-radius:calc(var(--cw)*.02);background:rgba(14,27,61,.85);color:#F5F3EE;line-height:1.35}
.tc-role.leader{background:#FFD100;color:#0E1B3D}
.tc-role.lieut{background:#0072CE;color:#fff}
.bk-ltd{margin:0;color:#FFD100;font-weight:700}
.cback{display:grid;place-items:center}
.cb-in{position:relative;z-index:1;width:84%;display:flex;flex-direction:column;align-items:center;gap:calc(var(--cw)*.02)}
.cback svg.cb-mark{width:86%;height:auto;aspect-ratio:660/530}
.cback svg.cb-word{width:100%;height:auto;aspect-ratio:1900/290}

/* ===== Composition : leader ===== */
.pcard{position:relative}
.pcard.is-leader .tc{outline:4px solid #FFD100;outline-offset:2px}
.lead-btn{display:block;margin:6px auto 0;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:6px;font-size:13px;padding:3px 8px}
.pcard.is-leader .lead-btn{background:#FFD100;border-color:#0E1B3D;color:#0E1B3D;font-weight:700}

/* ===== Bouton vers la prochaine course ===== */
.btn.next-race{display:inline-flex;flex-direction:column;align-items:flex-start;text-align:left;line-height:1.15}
.btn.next-race small{font-style:normal;font-weight:500;font-size:13px;opacity:.75}

/* ===== Règles ===== */
.rules{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px;margin-top:10px}
.rules section{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.rules h3{margin:0 0 6px;display:flex;align-items:center;gap:10px}
.rules h3 span{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#0E1B3D;color:#FFD100;font-size:16px;font-style:italic;flex:none}
.rules p{margin:0;line-height:1.5}
.tagline{display:block;padding-left:0;margin-left:calc(var(--lw) * .41);width:calc(var(--lw) * .57);text-align:center;white-space:nowrap;font-size:12.5px;letter-spacing:.04em;box-sizing:border-box}

/* ===== Cartes événement : cadre aux couleurs du logo et badge sablier ===== */
.tc.event{background:repeating-linear-gradient(135deg,#0072CE 0 10px,#E1001A 10px 20px,#fff 20px 30px,#FFD100 30px 40px,#009A44 40px 50px)}
.tc.event .tc-in{box-shadow:inset 0 0 0 calc(var(--cw)*.012) #0E1B3D}
.tc-ev{position:absolute;right:calc(var(--cw)*.025);bottom:calc(var(--cw)*.025);display:inline-flex;align-items:center;gap:2px;background:#0E1B3D;color:#FFD100;font-family:var(--display);font-style:italic;font-weight:800;font-size:calc(var(--cw)*.06);padding:1px calc(var(--cw)*.03) 1px calc(var(--cw)*.02);border-radius:calc(var(--cw)*.02);box-shadow:0 0 0 calc(var(--cw)*.008) #FFD100}
.tc-ev svg{width:calc(var(--cw)*.065);height:calc(var(--cw)*.065)}

/* ===== Albums ===== */
.chip.big{font-size:17px;padding:6px 16px}
.bar .sep{width:1px;align-self:stretch;background:var(--line);margin:0 4px}
.albums{display:grid;gap:10px}
.album{background:var(--surface);border:1px solid var(--line);border-radius:10px}
.album summary{display:grid;grid-template-columns:minmax(160px,1.4fr) 2fr auto auto auto;gap:12px;align-items:center;padding:12px 14px;cursor:pointer;list-style:none}
.album summary::-webkit-details-marker{display:none}
.alb-title{font-family:var(--display);font-style:italic;font-weight:700;font-size:20px}
.alb-prog{height:8px;background:var(--soft);border-radius:4px;overflow:hidden}.alb-prog i{display:block;height:100%;background:var(--jaune)}
.alb-count{font-variant-numeric:tabular-nums;color:var(--muted)}
.alb-rew{font-weight:700}
.album.full{border-color:#FFD100;box-shadow:0 0 0 2px #FFD100}
.album.done .alb-prog i{background:var(--good)}.album.done .alb-rew{color:var(--good)}
.alb-grid{display:flex;flex-wrap:wrap;gap:8px;padding:0 14px 14px}
@media (max-width:700px){.album summary{grid-template-columns:1fr auto;}.alb-prog{grid-column:1/-1}}

/* ===== Amis ===== */
.friends{display:grid;grid-template-columns:1fr 1.3fr;gap:16px;align-items:start}
@media (max-width:900px){.friends{grid-template-columns:1fr}}
.trades{display:grid;gap:10px;margin-top:12px}
.trade{border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:var(--bg)}
.trade.open{border-left:4px solid var(--jaune)}
.tr-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.tr-sides{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:8px}
.tr-sides small{display:block;color:var(--muted);margin-bottom:4px}
.tr-sides .rchip{margin:0 4px 4px 0}
.tform{border:1px solid var(--line);border-radius:10px;padding:12px;margin-top:12px;background:var(--bg)}
.tcols{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rchips.scroll{max-height:260px;overflow:auto;margin-top:6px}
.rchip.on{border-color:#0E1B3D;background:#FFD100}
button.link{background:none;border:0;padding:0 4px;color:var(--muted);text-decoration:underline;font:inherit;cursor:pointer}

/* ===== Paquet réaliste : sachet métallisé ===== */
.pack.pk2{filter:drop-shadow(0 16px 20px rgba(8,16,40,.45)) drop-shadow(0 2px 2px rgba(8,16,40,.3))}
.pk2 .pack-top{height:40px;background:#0E1B3D}
.pk2 .pack-rest{top:40px;background:#0E1B3D;overflow:hidden}
.pk2 .crimp{height:16px;background:linear-gradient(180deg,#24366B,#0E1B3D);-webkit-mask:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) 50%/10px 100%;mask:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) 50%/10px 100%}
.pk2 .crimp.bot{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(0deg,#24366B,#0E1B3D);-webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/10px 100%;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/10px 100%}
.pk2 .crimp::after{background:repeating-linear-gradient(90deg,rgba(255,255,255,.12) 0 1px,transparent 1px 3px)}
.pk2 .tearline{height:24px;border-bottom:1px dashed rgba(255,255,255,.35);font-size:10px;color:rgba(255,255,255,.6);letter-spacing:.08em;text-transform:uppercase}
.pk2 .pack-face{inset:0 0 16px 0;padding:0;display:block}
.pk2 .pack-art{position:absolute;inset:0;width:100%;height:100%}
.pk-logo{position:absolute;left:0;right:0;top:10px;display:flex;flex-direction:column;align-items:center;gap:3px}
.pk-mark{width:58%;aspect-ratio:660/530;height:auto;filter:drop-shadow(0 3px 0 rgba(0,0,0,.3))}
.pk-word{width:84%;aspect-ratio:1900/290;height:auto}
.pk-badge{position:absolute;right:10px;top:150px;width:54px;height:54px;border-radius:50%;background:#FFD100;color:#0E1B3D;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(12deg);box-shadow:0 3px 0 rgba(0,0,0,.3);font-family:var(--display);font-style:italic;line-height:.9}
.pk-badge b{font-size:26px;font-weight:800}.pk-badge small{font-size:11px;font-weight:700;text-transform:uppercase}
.pk-band{position:absolute;left:0;right:0;bottom:12px;background:#FFD100;color:#0E1B3D;text-align:center;padding:5px 6px 6px;transform:skewY(-4deg);box-shadow:0 -2px 0 #0E1B3D inset}
.pk-band b{display:block;font-family:var(--display);font-style:italic;font-weight:800;font-size:28px;letter-spacing:.06em;text-transform:uppercase;line-height:1}
.pk-band small{display:block;font-size:11px;font-weight:600}
/* reflet métallisé qui glisse sur le sachet, et relief « coussin » */
.pk-sheen{position:absolute;inset:0;pointer-events:none;border-radius:4px;background:linear-gradient(90deg,rgba(0,0,0,.35),rgba(255,255,255,0) 12%,rgba(255,255,255,0) 88%,rgba(0,0,0,.35)),linear-gradient(115deg,transparent 30%,rgba(255,255,255,.28) 42%,rgba(255,255,255,.05) 50%,transparent 60%);background-size:100% 100%,250% 100%;background-position:0 0,var(--px,80%) 0;mix-blend-mode:screen;transition:background-position .3s}
.pack.pk2:not(:disabled):hover .pk-sheen{--px:20%}
.pack.pk2.torn .pk-sheen{opacity:0}
.pk2 .pack-face svg{margin:0}
.pk2 .pack-face svg.pack-art{position:absolute;inset:0;width:100%;height:100%}
.pk2 .pack-face svg.pk-mark{width:46%;height:auto}
.pk2 .pack-face svg.pk-word{width:80%;height:auto}
/* Éditions limitées : cadre et badge dans la couleur de l'année */
.tc.event{background:repeating-linear-gradient(135deg,var(--ey,#FFD100) 0 12px,#0E1B3D 12px 16px)}
.tc-ev{background:var(--ey,#FFD100);color:#0E1B3D;box-shadow:0 0 0 calc(var(--cw)*.008) #0E1B3D}
.account .snd{padding:2px 4px}.account .snd svg{width:18px;height:18px;display:block}.account .snd+button::before{content:none}.alb-desc{margin:0 14px 10px;color:var(--muted)}
/* ===== Tableau de bord ===== */
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin:10px 0 14px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column}
.kpi b{font-family:var(--display);font-style:italic;font-weight:800;font-size:32px;line-height:1}
.kpi span{font-weight:600;font-size:14px}.kpi small{color:var(--muted);font-size:12px}
.dash-row{display:grid;grid-template-columns:1.6fr 1fr;gap:14px;margin-bottom:24px}
@media (max-width:900px){.dash-row{grid-template-columns:1fr}}
.dash-chart{width:100%;height:auto;color:var(--muted)}
.bell{display:inline-block;margin:6px 0;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:4px 12px;font:inherit;font-size:14px;cursor:pointer}
.bell.on{background:#FFD100;border-color:#0E1B3D}

/* ===== Page d'accueil ===== */
.landing{display:flex;flex-direction:column;gap:56px;padding-bottom:30px}
.land-hero{display:grid;grid-template-columns:1.35fr 1fr;gap:36px;align-items:start}
@media (max-width:900px){.land-hero{grid-template-columns:1fr}}
.land-kicker{margin:0;font-family:var(--display);font-style:italic;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--bleu)}
.land-title{font-family:var(--display);font-style:italic;font-weight:800;font-size:clamp(40px,6vw,68px);line-height:.95;margin:6px 0 14px;text-transform:uppercase}
.land-lede{font-size:19px;line-height:1.5;max-width:620px;margin:0 0 18px}
.btn.big{font-size:21px;padding:12px 26px}
.land-free{color:var(--muted);font-size:14px;margin:10px 0 0}
.land-fan{position:relative;height:300px;margin-top:26px}
.fan-card{position:absolute;left:50%;top:10px;width:170px;aspect-ratio:63/88;transform:translateX(calc(-50% + var(--i) * 78px)) rotate(calc(var(--i) * 9deg)) translateY(calc(var(--i) * var(--i) * 6px));transform-origin:50% 120%;animation:fanIn .9s cubic-bezier(.2,.9,.3,1.2) both;animation-delay:calc((var(--i) + 2) * .12s)}
.fan-card .tc{position:relative}
.fan-card:hover{z-index:5;transform:translateX(calc(-50% + var(--i) * 78px)) rotate(0) translateY(-18px) scale(1.06);transition:transform .25s}
@keyframes fanIn{from{opacity:0;transform:translateX(-50%) translateY(80px) rotate(0)}}
@media (prefers-reduced-motion: reduce){.fan-card{animation:none}}
@media (max-width:560px){.land-fan{height:230px}.fan-card{width:130px}.fan-card .tc{--cw:130px !important}}
.land-auth{background:var(--surface);border:1px solid var(--line);border-top:6px solid var(--jaune);border-radius:12px;padding:20px 22px;box-shadow:0 10px 30px rgba(14,27,61,.1);position:sticky;top:80px}
.land-auth h2{margin-top:0}
.landing h2{text-align:center}
.landing h2::after{margin-left:auto;margin-right:auto}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:18px}
.step{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px;position:relative}
.step b{position:absolute;top:-16px;left:16px;width:36px;height:36px;border-radius:50%;background:#FFD100;color:#0E1B3D;display:grid;place-items:center;font-family:var(--display);font-style:italic;font-weight:800;font-size:20px;box-shadow:0 2px 0 #0E1B3D}
.step h3{margin:10px 0 6px}.step p{margin:0;color:var(--muted)}
.perks{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:18px}
.perk{padding:16px 18px;border-radius:12px;background:#0E1B3D;color:#F5F3EE}
.perk span{font-size:28px}.perk h3{color:#FFD100;margin:6px 0}.perk p{margin:0;opacity:.9}
.land-faq{max-width:760px;margin:0 auto;width:100%}
.land-faq details{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 16px;margin-top:10px}
.land-faq summary{cursor:pointer;font-weight:700}
.land-faq p{margin:8px 0 0;color:var(--muted)}
.land-end{text-align:center;background:linear-gradient(135deg,#0E1B3D,#16306E);color:#fff;border-radius:16px;padding:34px 20px}
.land-end h2{color:#fff;font-size:clamp(24px,3.5vw,36px);max-width:760px;margin:0 auto 18px}
.perks{grid-template-columns:repeat(3,1fr)}@media (max-width:900px){.perks{grid-template-columns:1fr 1fr}}@media (max-width:560px){.perks{grid-template-columns:1fr}}
.account .logout svg{width:16px;height:16px}.account .logout{border:1px solid rgba(255,255,255,.25)}
.account .logout::before{content:none !important}.account .logout{margin-left:6px}
/* Maillots dessinés */
.jimg{width:100%;height:100%;object-fit:contain;display:block}
.tpicto .jimg{width:calc(var(--cw)*.075);height:calc(var(--cw)*.075)}
.big-jersey .jimg{width:64px;height:70px}
.art-jersey{width:100%;height:100%;display:grid;place-items:center;background:radial-gradient(circle at 50% 60%,#fff 0 30%,#E6E3DA 70%)}
.art-jersey img{height:92%;width:auto;filter:drop-shadow(0 3px 4px rgba(14,27,61,.3))}
.tpicto .jimg{flex:none;width:calc(var(--cw)*.12);height:calc(var(--cw)*.12)}
.modal.legal{grid-template-columns:1fr;max-width:820px}.legal-body h1{font-family:var(--display);font-style:italic;text-transform:uppercase}.legal-body table{border-collapse:collapse;width:100%;font-size:14px}.legal-body td,.legal-body th{border:1px solid var(--line);padding:6px;vertical-align:top}.legal-body .tablewrap,.legal-body table{display:block;overflow-x:auto}
.imgbox{border:1px dashed var(--line);border-radius:10px;padding:10px 12px;margin:10px 0;background:var(--bg)}
.land-fan{overflow-x:clip;overflow-y:visible}@media (max-width:560px){.fan-card{transform:translateX(calc(-50% + var(--i) * 46px)) rotate(calc(var(--i) * 8deg)) translateY(calc(var(--i) * var(--i) * 5px))}}
/* Téléphone : deux cartes par ligne dans la collection, le ravito et le marché */
@media (max-width:480px){
  .grid{gap:10px;justify-content:center}
  .grid .tc,.revealed .tc,.market-grid .tc{--cw:158px !important}
  .revealed .flip-in{--cw:158px !important}
  .revealed{justify-content:center;gap:10px}
  .alb-grid .tc{--cw:100px !important}
}
/* Paquet : pastille blanche, logo plus compact, bandeau plus fin pour laisser voir les coureurs */
.pk-badge{background:#fff;color:#0E1B3D;top:120px;right:12px;width:50px;height:50px;box-shadow:0 3px 0 rgba(0,0,0,.25),0 0 0 2px #0E1B3D}
.pk2 .pack-face svg.pk-mark{width:40%}
.pk2 .pack-face svg.pk-word{width:72%}
.pk-band{bottom:14px;padding:3px 6px 4px}
.pk-band b{font-size:24px}
.rav-tagline{margin:-4px 0 10px;font-family:var(--display);font-style:italic;font-weight:700;font-size:20px;color:var(--bleu)}
.art-logo{width:100%;height:100%;display:grid;place-items:center;background:#fff}
.art-logo img{max-width:86%;max-height:80%;object-fit:contain}
.btn.danger-l{color:var(--bad);border-color:var(--bad)}
.modal.ask{grid-template-columns:1fr;max-width:460px}.modal.ask p{margin:0;font-size:17px}
.modal.ask{grid-template-columns:1fr;max-width:460px}.modal.ask p{margin:0;font-size:17px}.btn.danger{background:var(--bad);color:#fff;border-color:var(--bad)}.btn.danger:disabled{opacity:.45}
.tc-name.xlong{font-size:calc(var(--cw)*.066)!important;line-height:1.05}
.rules section.wide{grid-column:1/-1}
.rules section p+p{margin-top:8px}
.stat-line{padding-left:0}
.stat-tag{display:inline-block;min-width:40px;text-align:center;background:#0E1B3D;color:#FFD100;border-radius:4px;padding:0 6px;font-family:var(--display);font-style:italic;margin-right:4px}
.admchk{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}tr.is-admin td:first-child{font-weight:700}
#ulist .tag{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:#FFD100;color:#0E1B3D;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
/* Photo illustrée : l'effet holographique ne voile plus l'image, crédit lisible au verso */
.tc-art img{position:relative;z-index:3;width:100%;height:100%;object-fit:cover;display:block}
.tc .tc-in{isolation:auto}
.bk-cr{margin-top:auto;font-size:calc(var(--cw)*.03);line-height:1.3;opacity:.7;font-style:italic}
/* Signalements */
.report-btn{background:none;border:1px solid var(--line);border-radius:999px;padding:2px 12px;font:inherit;font-size:13px;color:var(--ink);cursor:pointer}
.report-btn:hover{border-color:var(--ink)}
.modal.report{grid-template-columns:1fr;max-width:560px}
.modal.report textarea{width:100%;font:inherit;padding:8px;border:1px solid var(--line);border-radius:8px}
.modal.report input,.modal.report select{width:100%}
.report-card{display:block;margin:10px auto 0;font-size:13px}
.reports{display:grid;gap:8px;margin-bottom:18px}
.rep{border:1px solid var(--line);border-left:4px solid var(--jaune);border-radius:8px;padding:8px 12px;background:var(--surface)}
.rep.done{border-left-color:var(--line);opacity:.7}
.rep-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.rep p{margin:6px 0 0}
.modal.report select{padding:10px;border-radius:8px;border:1px solid var(--line);background:var(--bg);font:inherit;color:var(--ink)}
/* Verso : texte un peu plus compact, défilement si une fiche est très longue */
.tc-back{font-size:calc(var(--cw)*.043);overflow-y:auto;scrollbar-width:thin}
.tc-back .bk-desc{-webkit-line-clamp:4;flex:none}
/* Textes longs : taille adaptée plutôt que coupure */
.tname.long{font-size:calc(var(--cw)*.047)}
.tname.xlong{font-size:calc(var(--cw)*.042);white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.05}
.tc-name small.long{font-size:calc(var(--cw)*.045)}
.tc-name small.xlong{font-size:calc(var(--cw)*.04)}
.tc-desc{-webkit-line-clamp:5}
.tc-art > span,.tc-art .ribbon,.tc-art .tc-tag,.tc-art .tc-nat,.tc-art .tc-role,.tc-art .tc-ev{z-index:4}
.alts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.alt{all:unset;cursor:pointer;border:3px solid transparent;border-radius:8px;overflow:hidden;position:relative;background:#E6E3DA}.alt img{display:block;width:100%;aspect-ratio:5/3;object-fit:cover}.alt small{position:absolute;left:4px;bottom:4px;background:rgba(14,27,61,.8);color:#fff;font-size:11px;padding:0 5px;border-radius:4px}.alt.on{border-color:#FFD100;box-shadow:0 0 0 2px #0E1B3D}
.adm-left{width:320px;max-width:100%;display:flex;flex-direction:column;gap:10px}.adm-left .imgbox{margin:0}.adm-left .alts{grid-template-columns:repeat(2,1fr)}
.newcard{margin:12px 0}.newcard .field{margin-bottom:6px}#nc-budget.warn{background:#FDECEC;color:#8A1020}