/* ── VARIABLES ───────────────────────────────────────────── */
:root {
    --bg-base:    #111314;
    --bg-surface: #1c1f21;
    --bg-hover:   #2f3336;
    --text-main:  #e8e6e3;
    --text-muted: #a8a39d;
    --border:     #3f4448;
    --accent:     #58a6ff;
    --neg:        #ff6e64;
    --pos:        #60b68e;
    --warn:       #e3b341;
    --mer:#27F4D2; --fer:#E8002D; --red:#3333ff; --mcl:#FF8000;
    --alp:#ff87bc; --ast:#358C75; --haa:#cccccc; --wil:#005aff;
    --vrb:#6692ff; --aud:#f54418; --cad:#888888;
}

/* ── RESET ───────────────────────────────────────────────── */
* { border-radius:0!important; box-shadow:none!important; font-family:'JetBrains Mono',monospace; }
html { font-size:16px; }
body { background:var(--bg-base); color:var(--text-main); padding-bottom:0; font-size:1.05rem; }
.wrap { max-width:900px; margin:0 auto; }

/* ── UTILITY ─────────────────────────────────────────────── */
.neg    { color:var(--neg)!important; }
.pos    { color:var(--pos)!important; }
.warn   { color:var(--warn)!important; }
.accent { color:var(--accent)!important; }
.muted  { color:var(--text-muted)!important; }
.text-main { color:var(--text-main)!important; }
.fw-bold { font-weight:700; }
.text-right { text-align:right; }
.text-center { text-align:center; }
.diff-small { font-size:.68rem; }
.opacitiy-50 { opacity:.5; }
.rotate-y-180 { transform: rotateY(180deg); }

.b  { border:1px solid var(--border); }
.bb { border-bottom:1px solid var(--border); }
.bt { border-top:1px solid var(--border); }

.label    { font-size:.82rem; text-transform:uppercase; color:var(--text-muted); }
.subtitle { font-size:.82rem; color:var(--text-muted); margin-top:2px; }

@keyframes blink { 50%{opacity:0} }

/* ── SHARED COMPONENTS ───────────────────────────────────── */
.card-db {
    background:var(--bg-surface); border:1px solid var(--border);
    padding:1.1rem; margin-bottom:1rem;
}
/* ── CARD WINNER — bordo animato clockwise ── */
.card-db--winner {
    position: relative;
    background: var(--bg-surface);
}
.card-db--winner::before {
    content: '';
    position: absolute;
    inset: -1.5px;
    background: conic-gradient(
        from var(--angle, 0deg),
        transparent 0deg,
        var(--warn) 60deg,
        transparent 120deg
    );
    z-index: 0;
    animation: spinBorder 4s linear infinite;
}
.card-db--winner::after {
    content: '';
    position: absolute;
    inset: 1.5px;
    background: var(--bg-surface);
    z-index: 1;
}
.card-db--winner > * {
    position: relative;
    z-index: 2;
}

@property --angle {
    syntax: '<angle>';
    inherits: false;
    initial-value: 0deg;
}
@keyframes spinBorder {
    to { --angle: 360deg; }
}
.card-db-flag { width:32px; height:20px; border:1px solid var(--border); margin-bottom:4px; }
.card-db .summary {
    display:grid; grid-template-columns:1fr auto 74px;
    gap:.5rem; align-items:center; padding:.2rem 0; font-size:.92rem;
}
.card-header-row   { display:flex; justify-content:space-between; align-items:flex-start; }
.card-header-left  { min-width:0; flex:1; }
.card-header-right { text-align:right; flex-shrink:0; }
.card-pts          { font-weight:700; color:var(--text-main); }
.card-pts.warn     { color:var(--warn); }
.card-gap          { font-size:.7rem; }
.s-code            { font-weight:700; }

.x2 {
    background:rgba(227,179,65,.15); color:var(--warn);
    padding:.15rem .4rem; font-weight:700; font-size:.75rem; margin-left:5px;
}

.sprint-badge       { font-size:.52rem; color:var(--warn); font-weight:700; letter-spacing:.04em; display:inline-block; }
.sprint-badge--md   { font-size:.82rem; }

.diff-inline { display:flex; align-items:center; font-size:.72rem; }

.flag-inline { border:1px solid var(--border); vertical-align:middle; margin:3px; }
