.vlv-wrap { max-width: 860px; user-select: text; -webkit-user-select: text; padding-top: 18px !important; }
.vlv-wrap .vl-logo { width: min(280px, 72vw); }

.vlv-h1 { margin: 16px 0 6px; text-align: center; font-size: 1.6rem; font-weight: 500; color: var(--vl-ink); }
.vlv-uvod { text-align: center; color: var(--vl-tlum); font-size: .92rem; margin: 0 0 14px; }
.vlv-uvod a { color: var(--vl-fial); font-weight: 600; }

.vlv-prepinac { display: flex; gap: 8px; justify-content: center; padding: 0; background: none; box-shadow: none; z-index: auto; }

.vlv-prepinac a {
    flex: 1 1 0;
    max-width: 220px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1.5px solid var(--vl-ink);
    color: var(--vl-ink);
    font-weight: 700;
    font-size: .86rem;
    text-align: center;
    text-decoration: none;
}

.vlv-prepinac a:hover { text-decoration: none; color: var(--vl-fial); border-color: var(--vl-fial); }
.vlv-prepinac a.akt { background: var(--vl-fial); border-color: var(--vl-fial); color: #fff; }

.vlv-datum { margin: 10px 0 0; text-align: center; font-size: .86rem; color: var(--vl-tlum); }

.vlv-sekce { margin: 22px 0 10px; font-size: .78rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--vl-fial); text-align: center; }

.vlv-staty { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }

.vlv-staty div {
    padding: 10px 6px;
    border: 2px solid #fff;
    border-radius: 16px;
    background: radial-gradient(ellipse 80% 50% at 50% 0%, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0) 70%), linear-gradient(180deg, var(--k1), var(--k2) 55%, var(--k3));
    box-shadow: 0 6px 14px rgba(20, 25, 50, .18);
    text-align: center;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}

.vlv-staty div:nth-child(1) { --k1: #4d8dff; --k2: #1560f0; --k3: #0a3aa8; }
.vlv-staty div:nth-child(2) { --k1: #5fd04a; --k2: #22a82a; --k3: #11701a; }
.vlv-staty div:nth-child(3) { --k1: #a95cf5; --k2: #7e22d8; --k3: #4f0f96; }
.vlv-staty div:nth-child(4) { --k1: #ff5c8a; --k2: #d6175a; --k3: #8c0a35; }
.vlv-staty div:nth-child(5) { --k1: #ff7a3d; --k2: #e84a0c; --k3: #9e2c00; }
.vlv-staty div:nth-child(6) { --k1: #ffd84a; --k2: #f5aa00; --k3: #a86c00; }
.vlv-staty span { display: block; font-size: .62rem; font-weight: 600; letter-spacing: .1em; color: rgba(255, 255, 255, .88); }
.vlv-staty strong { display: block; margin-top: 2px; font-size: 1.35rem; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }
.vlv-staty strong.vlv-akc { color: #fff; }

.vlv-razeni { display: flex; gap: 6px; justify-content: center; margin-bottom: 10px; }

.vlv-razeni button {
    padding: 7px 16px;
    border: 1px solid var(--vl-linka);
    border-radius: 999px;
    background: rgba(255, 253, 248, .7);
    color: var(--vl-ink);
    font-weight: 600;
    font-size: .84rem;
    cursor: pointer;
}

.vlv-razeni button.akt { background: var(--vl-fial); border-color: var(--vl-fial); color: #fff; }

.vlv-ramecek {
    padding: 12px 10px 10px;
    border: 2px solid #fff;
    border-radius: 20px;
    background:
        radial-gradient(ellipse 90% 40% at 50% 0%, rgba(169, 92, 245, .35), rgba(169, 92, 245, 0) 70%),
        linear-gradient(170deg, #2c1360 0%, #1d0d44 55%, #140a33 100%);
    box-shadow: 0 16px 36px rgba(40, 10, 90, .35);
    color: #efe6ff;
}

.vlv-ramecek[hidden] { display: none; }

.vlv-radek {
    position: relative;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto 58px 58px 70px;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    margin-bottom: 6px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .08);
    background: rgba(255, 255, 255, .06);
    font-size: .92rem;
}

.vlv-nejnovejsi .vlv-radek { grid-template-columns: minmax(0, 1fr) auto 58px 58px 70px 56px; }

.vlv-hlavicka { border: 0; background: none; margin-bottom: 2px; padding-top: 2px; padding-bottom: 2px; font-size: .68rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #b9a2e6; cursor: help; }
.vlv-radek .poradi { font-weight: 700; color: #b9a2e6; }
.vlv-radek .hrac { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: 400; color: #fff; }
.vlv-radek .vip { margin-left: 4px; color: #ffd84a; }
.vlv-radek .napovedy, .vlv-radek .uzliky, .vlv-radek .cas, .vlv-radek .hodina { text-align: right; font-variant-numeric: tabular-nums; }
.vlv-radek .napovedy { font-weight: 700; }
.vlv-radek .napovedy.nula { color: #7dea6a; }
.vlv-radek .cas { font-weight: 600; }
.vlv-hlavicka .napovedy, .vlv-hlavicka .uzliky, .vlv-hlavicka .cas, .vlv-hlavicka .hodina { font-weight: 600; }

.vlv-pribeh { display: inline-flex; flex-wrap: wrap; gap: 3px; max-width: 120px; justify-content: flex-end; }
.vlv-pribeh .vl-tecka { width: 11px; height: 11px; box-shadow: none; }
.vlv-pribeh .vl-tecka-n { box-shadow: inset 0 0 0 2px var(--vl-cerv); }
.vlv-pribeh .vl-tecka-n::after { display: none; }

.vlv-radek.medaile::before { content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 4px; border-radius: 2px; }
.vlv-radek.m1::before { background: var(--vl-span); }
.vlv-radek.m2::before { background: #a7b0c4; }
.vlv-radek.m3::before { background: #c58b5a; }

.vlv-radek.highlight-row, .vlv-radek.vip-me { border: 2px solid #ffd84a; padding: 7px 11px; background: rgba(255, 216, 74, .12); }
.vlv-radek.highlight-row::after, .vlv-radek.vip-me::after {
    content: "VY";
    position: absolute;
    right: 14px;
    top: -8px;
    padding: 0 6px;
    border-radius: 6px;
    background: #ffd84a;
    color: #3a2604;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 16px;
}

.vlv-legenda .vl-tecka { display: inline-block; width: 11px; height: 11px; vertical-align: -1px; box-shadow: none; }
.vlv-legenda .vl-tecka-n { box-shadow: inset 0 0 0 2px var(--vl-cerv); }
.vlv-legenda .vl-tecka-n::after { display: none; }

.vlv-prazdno { margin: 18px 0; text-align: center; color: #cdb8f2; }
.vlv-pozn { margin: 12px 8px 4px; font-size: .8rem; color: #cdb8f2; line-height: 1.5; }
.vlv-pozn strong { color: #fff; }
.vlv-nulovani { margin: 18px 0 0; text-align: center; font-size: .84rem; color: var(--vl-tlum); }

.vlv-reseni { max-width: 640px; }
.vlv-reseni-tema { text-align: center; margin-top: 14px; }

.vlv-mrizka {
    position: relative;
    display: grid;
    grid-template-columns: repeat(6, 40px);
    grid-auto-rows: 40px;
    width: 240px;
    margin: 6px auto 0 !important;
}

.vlv-nite { position: absolute; inset: 0; width: 100%; height: 100%; }
.vlv-nite { filter: drop-shadow(0 3px 2px rgba(12, 20, 48, .18)); }

.vlv-mrizka span {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin: 4px;
    border-radius: 50%;
    font-weight: 700;
    font-size: .95rem;
    box-sizing: border-box;
    border: 2px solid #fff;
    color: #fff;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .3), 0 0 2px rgba(0, 0, 0, .4);
    background: var(--vl-koule-lesk), radial-gradient(circle at 50% 42%, var(--k1), var(--k2) 55%, var(--k3));
    box-shadow: 0 2px 5px rgba(20, 25, 50, .25);
}

.vlv-mrizka span.s { --k1: #ffd84a; --k2: #f5aa00; --k3: #a86c00; }
.vlv-slova { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; padding: 0; margin-top: 14px !important; margin-bottom: 18px !important; list-style: none; }
.vlv-slova li { padding: 3px 12px; border: 2px solid #fff; border-radius: 999px; font-weight: 700; font-size: .85rem; background: linear-gradient(180deg, var(--k1), var(--k2) 55%, var(--k3)); color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .35); box-shadow: 0 2px 6px rgba(20, 25, 50, .2); }
.vlv-slova li.span { --k1: #ffd84a; --k2: #f5aa00; --k3: #a86c00; }

@media (max-width: 520px) {
    .vlv-staty { grid-template-columns: repeat(2, 1fr); }
    .vlv-radek { grid-template-columns: 22px minmax(0, 1fr) 40px 40px 50px; gap: 3px 5px; padding: 7px 12px; border-radius: 18px; font-size: .84rem; }
    .vlv-nejnovejsi .vlv-radek { grid-template-columns: minmax(0, 1fr) 40px 40px 50px 40px; }
    .vlv-radek { grid-template-areas: "p h n u c" "p b n u c"; }
    .vlv-nejnovejsi .vlv-radek { grid-template-areas: "h n u c o" "b n u c o"; }
    .vlv-hlavicka, .vlv-radek.vlv-hlavicka { grid-template-areas: "p h n u c"; }
    .vlv-nejnovejsi .vlv-radek.vlv-hlavicka { grid-template-areas: "h n u c o"; }
    .vlv-radek > .poradi { grid-area: p; }
    .vlv-radek > .hrac { grid-area: h; }
    .vlv-radek > .pribeh { grid-area: b; line-height: 0; }
    .vlv-radek > .napovedy { grid-area: n; }
    .vlv-radek > .uzliky { grid-area: u; }
    .vlv-radek > .cas { grid-area: c; }
    .vlv-radek > .hodina { grid-area: o; }
    .vlv-hlavicka > .pribeh { display: none; }
    .vlv-pribeh { max-width: none; justify-content: flex-start; }
    .vlv-pribeh .vl-tecka { width: 9px; height: 9px; }
    .vlv-radek.highlight-row, .vlv-radek.vip-me { padding: 6px 11px; }
}

.vlv-radek .uzliky { color: #b9a2e6; font-variant-numeric: tabular-nums; }
.vlv-staty { max-width: 640px; margin-left: auto; margin-right: auto; }
@media (min-width: 700px) {
    .vlv-ramecek { padding: 14px 16px 12px; }
    .vlv-radek { padding: 9px 18px; }
    .vlv-pribeh { max-width: 220px; }
}

.vlv-kratke { display: none; }
.vlv-uzlik { display: inline-block; width: 9px; height: 16px; vertical-align: -3px; background: url("/vlakna/uzlik.webp") center / contain no-repeat; }
@media (max-width: 520px) {
    .vlv-dlouhe { display: none; }
    .vlv-kratke { display: inline; }
}

.vlv-sberatel { display: inline-block; width: 12px; height: 20px; margin-left: 5px; vertical-align: -4px; background: url("/vlakna/uzlik.webp") center / contain no-repeat; cursor: help; }

.vlv-tema { max-width: 520px; margin: 14px auto 0; font-size: inherit; line-height: inherit; }
.vlv-tema strong { font-size: 1.6rem; }
.vlv-tema time { font-weight: inherit; }
.vlv-sampion { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 4px 8px; max-width: 520px; margin: 12px auto 4px; padding: 8px 14px; border: 2px solid #fff; border-radius: 999px; background: linear-gradient(180deg, #fff6d0, #ffe58a); box-shadow: 0 4px 12px rgba(168, 116, 6, .2); color: #5a3b00; font-size: .92rem; text-align: center; }
.vlv-sampion .jm { color: #3a2604; font-size: 1.02rem; }
.vlv-sampion span:last-child { color: #8a5d00; font-variant-numeric: tabular-nums; }
.vlv-pohar { font-size: 1.1rem; }

.vlv-tema + .vlv-sampion + .vlv-reseni, .vlv-tema + .vlv-reseni { margin-top: 10px; }
.vlv-reseni { margin-left: auto; margin-right: auto; max-width: 520px; }

.vlv-zaver { max-width: 520px; margin: 22px auto 6px; padding: 16px 18px 18px; border-radius: 20px; background: linear-gradient(180deg, rgba(255, 255, 255, .75), rgba(243, 233, 255, .75)); box-shadow: 0 8px 22px rgba(90, 20, 166, .1), inset 0 1px 0 #fff; text-align: center; }
.vlv-zaver p { margin: 0 0 12px; font-size: .86rem; color: var(--vl-tlum); }
.vlv-hrat {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 34px;
    border-radius: 999px;
    overflow: hidden;
    background: linear-gradient(180deg, #a35cf2 0%, #7e22d8 55%, #6316b8 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), inset 0 -3px 8px rgba(40, 0, 80, .22), 0 8px 18px rgba(90, 20, 166, .28);
    color: #fff;
    font-weight: 700;
    font-size: .95rem;
    letter-spacing: .04em;
    text-shadow: 0 1px 2px rgba(40, 0, 80, .4);
    transition: transform .15s, box-shadow .15s, filter .15s;
}
.vlv-hrat::before { content: ""; position: absolute; left: 8%; right: 8%; top: 1px; height: 42%; border-radius: 999px; background: linear-gradient(180deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, 0)); pointer-events: none; }
.vlv-hrat:hover { color: #fff; text-decoration: none; transform: translateY(-1px); filter: brightness(1.06); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), inset 0 -3px 8px rgba(40, 0, 80, .22), 0 11px 22px rgba(90, 20, 166, .32); }

