/* OnziQ — direction visuelle 2026/2027. Couleurs héritées du club. */
:root{
 --oq-radius:22px;--oq-radius-sm:14px;--oq-space:16px;--oq-motion:180ms;
 --oq-border:color-mix(in srgb,var(--ink) 12%,transparent);
 --oq-soft:color-mix(in srgb,var(--accent) 6%,var(--glass));
 --oq-elevation:0 8px 24px #0000000a,inset 0 1px 0 color-mix(in srgb,var(--ink) 5%,transparent);
}
body{line-height:1.5}
html .panel{border:1px solid var(--oq-border);border-radius:var(--oq-radius);background:var(--glass);box-shadow:var(--oq-elevation);backdrop-filter:none;-webkit-backdrop-filter:none}
html .stack{gap:var(--oq-space)}
html main h2,html main h3{letter-spacing:.012em!important;line-height:1.1!important}
html .eyebrow,html .label{letter-spacing:.06em;line-height:1.4}
html .btn{border:1px solid var(--oq-border);border-radius:var(--oq-radius-sm);min-height:44px;font-size:.9rem;line-height:1.3;padding:10px 14px;box-shadow:inset 0 1px 0 #ffffff08;transition:background var(--oq-motion),border-color var(--oq-motion),transform var(--oq-motion)}
html .btn.pri{border-color:transparent;box-shadow:0 4px 12px color-mix(in srgb,var(--accent) 16%,transparent)}
html .btn.warn{box-shadow:none}
html .btn:disabled{cursor:default;box-shadow:none}
html input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),html select,html textarea{border-radius:var(--oq-radius-sm);border:1px solid var(--oq-border);min-height:44px;line-height:1.4;background:var(--field);color:var(--ink)}
html textarea{padding:12px;resize:vertical}
html :focus-visible{outline:3px solid var(--ink);outline-offset:3px}
html .field>span.label{font-size:.8rem;color:var(--muted);font-weight:800}
html .seg3,html .hubseg,html .vesttabs,html .famtabs{border:1px solid var(--oq-border);padding:5px;gap:4px;border-radius:18px!important}
html .hubseg>button{flex:1 1 80px;font-size:.875rem}
html .seg3 button,html .hubseg button,html .vesttabs button{border-radius:13px;line-height:1.3;min-height:44px;padding:8px 12px}
html nav.tabs{border:1px solid var(--oq-border);box-shadow:0 8px 28px #00000012}
html nav.tabs button{border-radius:14px;transition:background var(--oq-motion),color var(--oq-motion)}
html .oq-nav-context{margin-bottom:14px;font-size:.82rem}
html .oqfan-tile,html .oqfan-match,html .oqnews-preview{border:1px solid var(--oq-border);border-radius:var(--oq-radius);background:linear-gradient(150deg,var(--oq-soft),var(--glass) 65%);box-shadow:var(--oq-elevation);transition:transform var(--oq-motion),border-color var(--oq-motion),box-shadow var(--oq-motion)}
html .oqfan-tile{gap:14px;overflow:hidden}
html .oqfan-tile::before{left:22px;width:42px;height:4px}
html .oqfan-icon{width:46px;height:46px;border-radius:15px;border:1px solid var(--oq-border);background:color-mix(in srgb,var(--accent) 12%,var(--glass2))}
html .oqfan-tile-foot{padding-top:10px;border-top:1px solid var(--oq-border)}
html .oqfan-tile-foot>span:last-child{background:var(--ink);color:var(--bg);width:30px;height:30px;font-weight:800}
html .clubcover{border:1px solid var(--oq-border);box-shadow:var(--oq-elevation);border-radius:26px;position:relative;isolation:isolate}
html .clubcover .cccrest{border-radius:20px;box-shadow:0 6px 18px #00000015}
html .oqhome-priority>.tile.hero,html .oqhome-conv>.tile,html .mcard.mc2,html .post,html .tncard{border:1px solid var(--oq-border);border-radius:var(--oq-radius);box-shadow:var(--oq-elevation)}
html .oqhome-priority>.tile.hero{--ink:#FFFFFF;--muted:#C8D0CC;--board-muted:#C8D0CC;color:#FFFFFF;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 24%,#101613),#101613 75%)}
html .oqhome-priority>.tile.hero .eyebrow{color:#C8D0CC}
html .oqhome-conv>.tile{background:var(--glass)}
html .oqhome-details>summary{font-size:.95rem;gap:10px}
html .oqnews-card{border-radius:var(--oq-radius);box-shadow:var(--oq-elevation)}
html .oqnews-reader .oqnews-card{box-shadow:none}
html .oqnews-preview>img{border-radius:16px;box-shadow:0 4px 12px #00000014}
html .oqnews-photo-hint{border:1px solid #ffffff35;backdrop-filter:none}
html .oqnews-modal,html .sheet{border:1px solid var(--oq-border);box-shadow:0 24px 80px #00000035;border-radius:24px}
html .shot{border-radius:18px;box-shadow:0 10px 32px #00000030}
html .tablebox{border:1px solid var(--oq-border);border-radius:18px;background:var(--glass)}
html table th{font-size:.8rem;font-weight:800;background:var(--glass2)}
html table td{font-size:.875rem;padding-block:12px}
html .msgs .thread,html .msgpane{border-radius:var(--oq-radius)}
html .empty{padding:24px;line-height:1.6;border-style:dashed;box-shadow:none}
html .empty p{max-width:58ch;margin-inline:auto}
/* Effectif : une identité de carte sportive, sans fausse photo de joueur. */
.oqroster-intro{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.oqroster-intro p{margin:6px 0 0;font-size:.875rem;max-width:55ch}
.oqroster-tools{display:flex;align-items:end;gap:12px;flex-wrap:wrap}
.oqroster-tools .field{flex:1 1 220px;display:grid;gap:6px;margin:0}
.oqroster-tools input,.oqroster-tools select{width:100%;padding:10px 12px}
.oqroster-tools .oqroster-position{flex:0 1 200px}
.oqroster-count{font-size:.82rem;font-weight:700;margin:0;color:var(--muted)}
html .rgrid{grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:16px}
html .rcard{position:relative;isolation:isolate;overflow:hidden;display:grid;gap:14px;padding:0 14px 14px;border:1px solid var(--oq-border);border-radius:24px;box-shadow:var(--oq-elevation);background:var(--glass);content-visibility:visible;contain-intrinsic-size:none;transition:transform var(--oq-motion),box-shadow var(--oq-motion),border-color var(--oq-motion)}
html .rcard::before{content:"";position:absolute;inset:0 0 auto;height:106px;z-index:-1;background:linear-gradient(130deg,color-mix(in srgb,var(--accent) 22%,var(--glass2)),var(--glass2) 60%);border-bottom:1px solid var(--oq-border)}
html .rcard::after{content:"";position:absolute;top:-18px;right:-32px;width:120px;height:120px;border:1px solid color-mix(in srgb,var(--accent) 24%,transparent);border-radius:50%;pointer-events:none;z-index:-1}
html .rtop{padding-top:20px;gap:6px;position:relative;min-height:210px;align-content:start}
html .rring{width:108px;height:108px;padding:3px;margin-bottom:4px;border-radius:24px;background:linear-gradient(140deg,color-mix(in srgb,var(--accent) 55%,var(--ink)),var(--glass2) 42%,var(--accent));box-shadow:0 8px 24px #00000022}
html .rav{border-radius:21px;border:3px solid var(--glass);background:linear-gradient(140deg,#252C2A,#101613);color:#fff}
html .rav img{object-position:50% 35%}
html .rav b{font-size:2.25rem;font-weight:900}
html .rno{background:var(--accent);color:var(--on-accent);border-radius:9px;height:28px;min-width:30px;right:-6px;bottom:-3px;box-shadow:0 0 0 3px var(--glass);font-size:.85rem}
html .rname{font:900 1.25rem/1.2 var(--title);white-space:normal;text-overflow:clip;overflow-wrap:anywhere;max-width:100%;min-height:1.2em;letter-spacing:.015em}
html .rpos{font-size:.8rem;color:var(--muted);font-weight:700;display:flex;align-items:center;justify-content:center;gap:6px}
.oq-position-icon{width:16px;height:16px;flex:none;display:block;color:var(--ink)}
html .rstats{gap:6px}
html .rstats span{border-radius:12px;background:var(--glass2);padding:9px 2px;font-size:.72rem;line-height:1.3;color:var(--muted)}
html .rstats b{font-size:1.3rem;line-height:1.2;color:var(--ink)}
html .rstats .rovr b{color:var(--ink)}
html .rshare{font-size:.8rem;padding:9px 6px;background:var(--glass2);border:1px solid var(--oq-border);margin-top:auto}
html .pcreator{border:1px solid var(--oq-border);padding:0 18px 18px;border-radius:24px;background:var(--glass);gap:16px}
html .pcov{margin-inline:-18px;height:120px;background:linear-gradient(130deg,color-mix(in srgb,var(--accent) 35%,var(--glass2)),var(--glass2) 75%);border-bottom:1px solid var(--oq-border)}
html .pcring{border-radius:25px;background:linear-gradient(140deg,var(--accent),var(--glass2),var(--accent));box-shadow:0 6px 20px #00000022}
html .pcav{border-radius:22px;border-color:var(--glass)}
html .pcname{font-weight:900;font-size:clamp(1.5rem,5vw,2rem);line-height:1.1}
html .pcact .btn.pri{background:var(--accent)!important;color:var(--on-accent)!important}
html .pcstats>div{border:1px solid var(--oq-border);background:var(--glass2);padding:12px 3px}
html .pcstats .hl b{color:var(--ink)}
/* Médaille réaliste + symbole SVG. Même langage dans la vitrine et les exports. */
html .awmed{background:transparent url('assets/onziq-medallion.webp') center/contain no-repeat!important;border-radius:50%!important;box-shadow:none!important;overflow:hidden;filter:none;opacity:1;isolation:isolate}
html .awmed::before,html .awmed::after{display:none!important}
html .awmed svg{width:58%!important;height:58%!important;filter:drop-shadow(0 2px 2px #0008);position:relative}
html .bcoll{grid-template-columns:repeat(auto-fill,minmax(min(100%,155px),1fr));gap:12px}
html .bcoll .badge{position:relative;isolation:isolate;overflow:hidden;border:1px solid var(--oq-border);padding:16px 12px;border-radius:20px;gap:10px;background:var(--glass2);content-visibility:visible;contain-intrinsic-size:none;align-content:start;min-height:226px}
html .bcoll .badge.on{border-color:color-mix(in srgb,var(--rc) 45%,var(--oq-border));background:linear-gradient(145deg,color-mix(in srgb,var(--rc) 12%,var(--glass)),var(--glass) 72%)}
html .bcoll .badge .awmed{width:86px;height:86px;background:transparent url('assets/onziq-medallion.webp') center/contain no-repeat!important}
html .bcoll .badge .brar{font-size:.65rem;font-weight:900;letter-spacing:.08em;line-height:1.4;color:var(--ink);background:var(--glass2);border:1px solid var(--oq-border);padding:4px 7px;border-radius:7px;max-width:100%;white-space:normal}
html .bcoll .badge b{font:900 1.05rem/1.15 var(--title);color:var(--ink);overflow-wrap:anywhere}
html .bcoll .badge small{font-size:.75rem;line-height:1.45;color:var(--muted);overflow-wrap:anywhere}
html .bcoll .badge .bshare{font-size:.75rem;color:var(--ink);background:var(--glass2);padding:7px 12px;border:1px solid var(--oq-border);border-radius:10px;margin-top:auto;font-weight:800}
html .bcoll .badge.locked{opacity:1;background:var(--glass2);border-color:var(--oq-border)}
html .bcoll .badge.locked .awmed{opacity:.65;filter:grayscale(1)}
html .bcoll .badge.locked::before{display:none}
html .bcoll .badge.locked .brar{color:var(--muted)}
html .nextb{background:var(--glass2);border:1px solid var(--oq-border);border-radius:18px;padding:14px}
html .nextb .awmed{width:64px!important;height:64px!important}
html .nbv{color:var(--ink)}
html .nbar{height:8px}.nbar i{background:var(--accent)!important}
html .awcard.awb{border:1px solid var(--oq-border);border-radius:22px;padding:18px;column-gap:16px;background:linear-gradient(140deg,color-mix(in srgb,var(--bc) 10%,var(--glass)),var(--glass) 65%);box-shadow:var(--oq-elevation)}
html .awcard.awb>.awmed{width:82px;height:82px}
html .awcard.awb .awlab{color:var(--ink);font-size:.72rem;line-height:1.4;letter-spacing:.08em}
html .awcard.awb .awtxt b{font-size:clamp(1.3rem,3vw,1.65rem);line-height:1.1;font-weight:900}
html .awhook{font-style:normal;color:var(--muted);font-size:.85rem;line-height:1.5;opacity:1}
html .ldlab .awmed,html .fanlead .awmed{background:none!important;overflow:visible}
html .ldlab .awmed svg,html .fanlead .awmed svg{width:100%!important;height:100%!important;filter:none}
/* Une seule passe lumineuse à l'interaction, aucun mouvement en boucle. */
@keyframes oq-glint{from{transform:translateX(-150%) skewX(-24deg)}to{transform:translateX(260%) skewX(-24deg)}}
html .bcoll .badge.on::after{content:"";position:absolute;inset:-35% auto -35% 0;width:38%;background:linear-gradient(90deg,transparent,#ffffff18,transparent);pointer-events:none;transform:translateX(-150%) skewX(-24deg)}
@media(hover:hover) and (pointer:fine){
 html .oqfan-tile:hover,html .rcard:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 50%,var(--oq-border));box-shadow:0 12px 26px #00000016}
 html .btn:not(:disabled):hover{border-color:color-mix(in srgb,var(--ink) 28%,transparent)}
 html .bcoll .badge.on:hover::after{animation:oq-glint 800ms ease-out 1}
 html .rcard:hover .rring{transform:rotate(-2deg)}
}
.rring{transition:transform var(--oq-motion)}
html .bcoll .badge.on:focus-visible::after{animation:oq-glint 800ms ease-out 1}
/* Objets réalistes et branding de collection sportive. */
.oqroster-filters{border:1px solid var(--oq-border);border-radius:14px;background:var(--glass);padding:0 12px}
.oqroster-filters>summary{min-height:44px;padding:11px 0;cursor:pointer;font-size:.875rem;font-weight:800}
.oqroster-filters[open]>.oqroster-tools{padding:4px 0 12px}
html .rav:has(.oq-kit-portrait),html .pcav:has(.oq-kit-portrait){background:linear-gradient(150deg,color-mix(in srgb,var(--accent) 12%,#E5ECE8),#D4DED8)}
html .rav .oq-kit-portrait,html .pcav .oq-kit-portrait{object-fit:contain;object-position:center;padding:4px}
html .rcard .rstats .rovr{background:var(--accent);color:var(--on-accent)}html .rcard .rstats .rovr b{color:var(--on-accent)}
html .rshare{background:var(--ink);color:var(--bg);border-color:var(--ink);border-radius:12px}
html .rtop{min-height:190px}
html .oqfan-icon:has(img){background:none;border:0;width:76px;height:68px;justify-content:start;box-shadow:none}
html .oqfan-icon img{display:block;width:76px;height:68px;object-fit:contain;filter:drop-shadow(0 5px 4px #0002)}
html .oqfan-tile:has(.oqfan-icon img){background:linear-gradient(140deg,color-mix(in srgb,var(--accent) 9%,var(--glass)),var(--glass) 60%)}
html .bcoll .badge{--ink:#F7FAF8;--muted:#BBC8C0;--glass:#17231C;--glass2:#223329;--oq-border:#FFFFFF24;min-height:274px;box-shadow:0 8px 18px #00000016}
html .bcoll .badge.on{background:radial-gradient(ellipse at 50% 0,color-mix(in srgb,var(--rc) 17%,#17231C),#142019 70%);border-color:color-mix(in srgb,var(--rc) 55%,#ffffff35)}
html .bcoll .badge .awmed{width:124px;height:124px}
html .awmed img{position:relative;width:88%;height:88%;object-fit:contain;filter:drop-shadow(0 3px 2px #0005);display:block}
.oq-badge-cluster{position:relative;display:block;width:90%;height:90%}
html .awmed .oq-badge-cluster img{position:absolute;width:64%;height:64%;object-fit:contain}
html .oq-badge-cluster.oq-double img:nth-child(1){left:0;top:13%}html .oq-badge-cluster.oq-double img:nth-child(2){right:0;bottom:6%}
html .oq-badge-cluster.oq-hat img{width:57%;height:57%}html .oq-badge-cluster.oq-hat img:nth-child(1){top:0;left:22%}html .oq-badge-cluster.oq-hat img:nth-child(2){bottom:0;left:0}html .oq-badge-cluster.oq-hat img:nth-child(3){bottom:0;right:0}
html .oq-badge-cluster.oq-quad img,html .oq-badge-cluster.oq-quint img{width:48%;height:48%}
html .oq-badge-cluster.oq-quad img:nth-child(1){top:2%;left:2%}
html .oq-badge-cluster.oq-quad img:nth-child(2){top:2%;right:2%}
html .oq-badge-cluster.oq-quad img:nth-child(3){bottom:2%;left:2%}
html .oq-badge-cluster.oq-quad img:nth-child(4){bottom:2%;right:2%}
html .oq-badge-cluster.oq-quint img{width:42%;height:42%}
html .oq-badge-cluster.oq-quint img:nth-child(1){top:0;left:0}
html .oq-badge-cluster.oq-quint img:nth-child(2){top:0;right:0}
html .oq-badge-cluster.oq-quint img:nth-child(3){bottom:0;left:0}
html .oq-badge-cluster.oq-quint img:nth-child(4){bottom:0;right:0}
html .oq-badge-cluster.oq-quint img:nth-child(5){top:29%;left:29%}
html .awmed .oq-raster-fallback{display:none}
html .ldlab .awmed img,html .fanlead .awmed img{width:100%;height:100%;filter:none}
@media(max-width:599px){html .rtop{min-height:157px}html .bcoll .badge{min-height:254px}html .bcoll .badge .awmed{width:106px;height:106px}html .oqfan-icon:has(img),html .oqfan-icon img{width:62px;height:58px}html .oqfan-tile:has(.oqfan-icon img){min-height:218px}}
@media(max-width:599px){
 :root{--oq-space:14px;--oq-radius:20px}
 html .panel{padding:16px}html .btn{font-size:.875rem;padding:9px 12px}
 html .oqfan-tile{padding:16px;gap:10px;min-height:180px}
 html .oqfan-icon{width:38px;height:38px;border-radius:12px}html .oqfan-icon svg{width:22px;height:22px}
 html .oqfan-tile::before{left:16px;width:32px}
 html .oqfan-tile-foot{font-size:.75rem;padding-top:8px}
 html .oqfan-tile-title{font-size:clamp(1.2rem,5.6vw,1.5rem)}
 html .rgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 html .rcard{padding:0 9px 10px;gap:10px;border-radius:20px}
 html .rcard::before{height:88px}
 html .rtop{padding-top:16px;min-height:180px}
 html .rring{width:88px;height:88px;border-radius:22px}
 html .rav{border-radius:19px}html .rav b{font-size:1.9rem}
 html .rname{font-size:1.12rem;line-height:1.2}html .rpos{font-size:.75rem}
 html .rstats{gap:3px}html .rstats span{font-size:.68rem;padding:8px 1px;border-radius:9px}
 html .rstats b{font-size:1.12rem}html .rshare{font-size:.75rem;padding:7px 4px}
 html .bcoll{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 html .bcoll .badge{padding:14px 8px;min-height:228px;gap:9px}
 html .bcoll .badge .awmed{width:106px;height:106px}
 html .bcoll .badge b{font-size:1rem}html .bcoll .badge small{font-size:.75rem}
 html .pcreator{padding-inline:14px}html .pcov{margin-inline:-14px}
 html .pcstats{gap:5px}html .pcstats b{font-size:1.25rem}html .pcstats span{font-size:.7rem}
 html .awcard.awb{padding:14px;column-gap:12px}html .awcard.awb>.awmed{width:66px;height:66px}
 .oqroster-tools{gap:10px}.oqroster-tools .oqroster-position{flex:1 1 140px}
}
@media(max-width:359px){html .rno{right:-3px}html .rname{font-size:1.02rem}html .rtop{min-height:180px}.oqroster-tools .field{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){
 html *,html *::before,html *::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
 html .oqfan-tile:hover,html .rcard:hover,html .oqfan-tile:active,html .rcard:hover .rring{transform:none!important}
}

html .bcoll .badge{--rc:#9A9AA0}
html .bcoll .badge[data-r="leg"]{--rc:#E8C04A}html .bcoll .badge[data-r="epi"]{--rc:#B06CFF}html .bcoll .badge[data-r="rar"]{--rc:#3DA5FF}
html .awmed.is-fallback img,html .awmed.is-fallback .oq-badge-cluster{display:none}html .awmed.is-fallback .oq-raster-fallback{display:grid;place-items:center;width:100%;height:100%;position:absolute;inset:0}

/* Lettre Q lisible dans toutes les palettes, sans changer la couleur du club. */
html h1 .q{color:color-mix(in srgb,var(--accent) 80%,var(--ink))!important}
html .oqfan-icon .oq-match-icon,html .oqfan-icon .oq-section-icon{display:block;width:34px;height:34px;color:var(--accent)}
@media(max-width:599px){html .oqfan-icon .oq-match-icon,html .oqfan-icon .oq-section-icon{width:28px;height:28px}}

/* Direct : deux équipes identifiables, commandes lisibles et tactiles. */
html header .iconbtn,html header #mode[role="button"]{min-height:44px;height:auto;align-items:center}
html body .livegrid>.pad .duo{gap:12px;overflow:visible;flex:0 0 auto;min-height:0}
html body .livegrid>.pad .teamcol{padding:10px;border:1px solid color-mix(in srgb,var(--tc) 30%,var(--stroke));border-radius:20px;background:linear-gradient(155deg,color-mix(in srgb,var(--tc) 8%,var(--bg2)),var(--bg2));gap:10px;grid-template-rows:auto auto!important;min-height:0}
html body .livegrid>.pad .teamhead{display:flex!important;min-height:36px;padding:0 0 8px;border-bottom:3px solid var(--tc);font-size:clamp(.9rem,2.8vw,1.15rem);letter-spacing:.02em;color:var(--ink)}
html body .livegrid>.pad .teamcol .acts{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-rows:auto!important;gap:7px;border-top:0;padding-top:0}
html body .livegrid>.pad .teamcol .act{min-width:0;min-height:64px!important;padding:8px 3px!important;border:1px solid var(--stroke);border-radius:14px!important;background:var(--glass);color:var(--ink);box-shadow:0 2px 0 color-mix(in srgb,var(--tc) 22%,transparent),inset 0 1px 0 #ffffff12;gap:5px!important;overflow:hidden;order:2;transition:transform .15s,background .15s,border-color .15s}
html body .livegrid>.pad .teamcol .act .lb{font-family:var(--body)!important;font-weight:750!important;font-size:clamp(11px,1.2vw,14px)!important;line-height:1.15!important;white-space:normal!important;overflow-wrap:normal;hyphens:none;max-width:100%;transform:none!important;letter-spacing:0!important}
html body .livegrid>.pad .teamcol .act .ic{display:grid!important;place-items:center;height:22px!important;color:color-mix(in srgb,var(--tc) 65%,var(--ink))!important}
html body .livegrid>.pad .teamcol .act .ic svg{width:22px!important;height:22px!important}
html body .livegrid>.pad .teamcol .act.big{grid-column:1/-1!important;min-height:58px!important;background:var(--tc);color:var(--tci);border-color:var(--tc);box-shadow:0 4px 12px color-mix(in srgb,var(--tc) 20%,transparent);order:0}
html body .livegrid>.pad .teamcol .act.big .lb{font-family:var(--display)!important;font-size:1.35rem!important;letter-spacing:.04em!important;font-weight:900!important}
html body .livegrid>.pad .teamcol .act.hl{grid-column:1/-1!important;min-height:46px!important;order:1;background:color-mix(in srgb,var(--tc) 10%,var(--bg2));border-color:color-mix(in srgb,var(--tc) 30%,var(--stroke))}
html body .livegrid>.pad .teamcol .act[data-t="yellow"] .ic{color:#BD8B00!important}
html body .livegrid>.pad .teamcol .act[data-t="red"] .ic{color:#E64949!important}
html body .livegrid>.pad .teamcol .act .card-y{background:#FFD43B!important}
html body .livegrid>.pad .teamcol .act .card-r{background:#E64949!important}
html body .livegrid>.pad .teamcol .act:hover{border-color:var(--tc);background:color-mix(in srgb,var(--tc) 12%,var(--bg2));transform:translateY(-2px)}
html body .livegrid>.pad .teamcol .act.big:hover{background:var(--tc)}
html body .livegrid>.pad .teamcol .act:active{transform:scale(.97)}
html body .livegrid>.pad .teamcol .act:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
@media(max-width:599px){
 html body .livegrid>.pad .duo{gap:8px}
 html body .livegrid>.pad .teamcol{padding:7px;border-radius:17px;gap:8px}
 html body .livegrid>.pad .teamcol .acts{gap:6px}
 html body .livegrid>.pad .teamcol .act{min-height:62px!important;border-radius:12px!important;padding:7px 2px!important}
 html body .livegrid>.pad .teamcol .act .lb{font-size:11px!important;overflow-wrap:anywhere}
 html body .livegrid>.pad .teamcol .act.big .lb{font-size:1.2rem!important}
}
@media(orientation:landscape) and (max-height:600px){
 html body .livegrid>.pad{overflow-y:auto}
 html body .livegrid>.pad .teamcol .act{min-height:56px!important}
 html body .livegrid>.pad .duo{overflow:visible;flex:0 0 auto}
}
@media(prefers-reduced-motion:reduce){html body .livegrid>.pad .teamcol .act{transition:none}html body .livegrid>.pad .teamcol .act:hover,html body .livegrid>.pad .teamcol .act:active{transform:none}}

@media(max-width:359px) and (orientation:portrait){html body .livegrid>.pad .teamcol .acts{grid-template-columns:minmax(0,1fr)!important}html body .livegrid>.pad .teamcol .act:not(.big):not(.hl){display:flex!important;flex-direction:row!important;min-height:48px!important;gap:5px!important}html body .livegrid>.pad .teamcol .act .ic svg{width:18px!important;height:18px!important}}
