:root {
    --wd-g1: #6cc36f;
    --wd-g2: #3a8c42;
    --wd-y1: #ecc24a;
    --wd-y2: #bf931a;
    --wd-d1: #5aa9ec;
    --wd-d2: #2c69b0;
    --wd-x1: #4b5058;
    --wd-x2: #30343a;
    --wd-text: #f1f4fb;
    --wd-dim: #9fb3d8;
    --wd-panel: #16294f;
    --wd-panel-2: #0a1431;
    --wd-line: rgba(255, 255, 255, .12);
    --wd-zlata: #ffcb3d;
}

body.wd-body {
    background: radial-gradient(ellipse at 50% 0%, #1f4f94 0%, #0e1f47 45%, #040a1c 100%) !important;
    background-attachment: fixed !important;
    min-height: 100vh;
}

.wd-body .main { padding-top: 88px; min-height: 100vh; box-sizing: border-box; margin-bottom: 40px; }
.wd-body .doc { padding-top: 0; }

.wd-wrap {
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
    text-align: center;
    color: var(--wd-text);
    font-family: 'Noto Sans', -apple-system, BlinkMacSystemFont, sans-serif;
}

h1.wd-nadpis { margin: 0 0 14px; line-height: 1; }
.wd-nadpis a { display: inline-block; }
.wd-logo {
    width: 400px;
    max-width: 86%;
    height: auto;
    filter: drop-shadow(0 8px 20px rgba(0, 0, 0, .5));
    animation: wdLogo .8s cubic-bezier(.2, 1.3, .4, 1) both;
}
@keyframes wdLogo { from { opacity: 0; transform: translateY(-14px) scale(.92); } }

.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

.wd-uvod { display: flex; flex-direction: column; align-items: center; }
.wd-uvod[hidden] { display: none; }
.wd-uvod .hrac-gate {
    --hrac-akcent: #7fd683;
    --hrac-akcent-2: #ecc24a;
    --hrac-panel: #1a3060;
    --hrac-panel-2: #0a1433;
    --hrac-dim: #9fb3d8;
    --hrac-btn-1: #55b45b;
    --hrac-btn-2: #22692b;
}
.wd-uvod .hrac-btn {
    border-color: rgba(170, 235, 172, .55);
    box-shadow: 0 10px 26px rgba(4, 12, 40, .6), 0 0 0 4px rgba(108, 195, 111, .18), inset 0 1px 0 rgba(255, 255, 255, .25);
}
.wd-uvod .hrac-gate input:focus { box-shadow: 0 0 0 3px rgba(108, 195, 111, .28); }

.wd-akce { display: flex; gap: 10px; justify-content: center; align-items: center; flex-wrap: wrap; margin-top: 16px; }
.wd-maly {
    display: inline-block;
    background: rgba(8, 16, 42, .45);
    border: 1px solid rgba(255, 255, 255, .24);
    color: rgba(255, 255, 255, .92);
    border-radius: 10px;
    padding: 9px 16px;
    font-size: .86rem;
    line-height: 1.2;
    cursor: pointer;
    text-decoration: none;
    transition: background .2s, border-color .2s;
}
.wd-maly:hover { background: rgba(8, 16, 42, .7); border-color: rgba(255, 255, 255, .45); color: #fff; text-decoration: none; }
.wd-zvuk {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; padding: 0;
    background: rgba(8, 16, 42, .45);
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 10px;
    color: rgba(255, 255, 255, .92);
    cursor: pointer;
}
.wd-zvuk svg { stroke-width: 1.7; }
.wd-zvuk .wd-skrt { display: none; }
.wd-zvuk.wd-ticho { color: var(--wd-dim); }
.wd-zvuk.wd-ticho .wd-vlny { display: none; }
.wd-zvuk.wd-ticho .wd-skrt { display: inline; }

.wd-hra {
    --kh: clamp(38px, 6.4dvh, 56px);
    --fix: 232px;
    --dl: clamp(30px, min(62px, calc((100vw - 64px) / 5), calc((100dvh - var(--fix) - 4 * var(--kh)) / 7)), 62px);
    --misto: 7;
    --mez: 10px;
    --pd: 10px;
    --rg: 6px;
    --kg: 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--mez);
    min-height: calc(38px + 2 * var(--mez) + 2 * var(--pd) + var(--misto) * var(--dl) + (var(--misto) - 1) * var(--rg) + 4 * var(--kh) + 3 * var(--kg) + 6px);
}
.wd-hra[hidden] { display: none; }

.wd-lista {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    max-width: 380px;
}
.wd-ikona {
    position: relative;
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; padding: 0;
    border-radius: 10px;
    border: 1px solid var(--wd-line);
    background: rgba(255, 255, 255, .06);
    color: var(--wd-text);
    cursor: pointer;
    transition: background .2s, border-color .2s;
}
.wd-ikona:hover { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .3); color: #fff; }
.wd-ikona svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.wd-ikona:disabled { opacity: .35; cursor: default; }
.wd-cas {
    min-width: 92px;
    padding: 6px 12px;
    border-radius: 10px;
    background: rgba(0, 0, 0, .28);
    border: 1px solid var(--wd-line);
    font-size: 1.15rem;
    font-weight: 800;
    letter-spacing: .04em;
    font-variant-numeric: tabular-nums;
    color: #fff;
}
.wd-vzdat-txt { display: none; }
.wd-vzdat.wd-jiste {
    width: auto;
    padding: 0 12px;
    gap: 6px;
    background: rgba(214, 64, 64, .85);
    border-color: rgba(255, 150, 150, .8);
}
.wd-vzdat.wd-jiste .wd-vzdat-txt { display: inline; font-size: .8rem; font-weight: 700; white-space: nowrap; }

.wd-plocha { position: relative; }
.wd-deska {
    display: flex;
    flex-direction: column;
    gap: var(--rg);
    padding: var(--pd);
    border-radius: 18px;
    background: linear-gradient(165deg, rgba(26, 46, 92, .75), rgba(6, 12, 32, .82));
    border: 1px solid rgba(150, 190, 255, .16);
    box-shadow: 0 20px 50px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .06);
}
.wd-radek { display: grid; grid-template-columns: repeat(5, var(--dl)); gap: var(--rg); animation: wdRadek .25s ease-out; }
@keyframes wdRadek { from { opacity: 0; transform: translateY(-6px); } }
.wd-radek:last-child .wd-dl:not([data-v]) { cursor: pointer; }
.wd-dl.wd-kurzor {
    border-color: #9be89f;
    box-shadow: 0 0 0 2px rgba(108, 195, 111, .35), 0 0 16px rgba(108, 195, 111, .3);
    background: rgba(108, 195, 111, .1);
}

.wd-dl {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--dl);
    height: var(--dl);
    box-sizing: border-box;
    border-radius: 9px;
    border: 2px solid rgba(255, 255, 255, .13);
    background: rgba(255, 255, 255, .03);
    color: #fff;
    font-family: 'Noto Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: calc(var(--dl) * .52);
    font-weight: 800;
    line-height: 1;
    text-shadow: 0 2px 3px rgba(0, 0, 0, .3);
    user-select: none;
    position: relative;
}
.wd-dl.wd-plna { border-color: rgba(255, 255, 255, .45); background: rgba(255, 255, 255, .06); }
.wd-dl[data-v] { border-color: transparent; box-shadow: 0 3px 0 rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .28); }
.wd-dl[data-v="g"] { background: linear-gradient(180deg, var(--wd-g1), var(--wd-g2)); }
.wd-dl[data-v="y"] { background: linear-gradient(180deg, var(--wd-y1), var(--wd-y2)); }
.wd-dl[data-v="d"] { background: linear-gradient(180deg, var(--wd-d1), var(--wd-d2)); }
.wd-dl[data-v="x"] { background: linear-gradient(180deg, var(--wd-x1), var(--wd-x2)); box-shadow: 0 3px 0 rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .1); }
.wd-pop { animation: wdPop .12s ease-out; }
@keyframes wdPop { 50% { transform: scale(1.12); } }
.wd-otoc { animation: wdOtoc .5s ease-in-out; }
@keyframes wdOtoc { 0% { transform: rotateX(0); } 50% { transform: rotateX(-90deg); } 100% { transform: rotateX(0); } }
.wd-tres { animation: wdTres .45s ease; }
@keyframes wdTres { 20%, 60% { transform: translateX(-7px); } 40%, 80% { transform: translateX(7px); } }
.wd-skok { animation: wdSkok .55s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes wdSkok { 0% { transform: translateY(0); } 40% { transform: translateY(-38%); } 70% { transform: translateY(6%); } 100% { transform: translateY(0); } }

.wd-hlaska {
    position: absolute;
    top: 14px;
    left: 50%;
    z-index: 5;
    transform: translate(-50%, -8px);
    padding: 10px 16px;
    border-radius: 10px;
    background: #f4f6fb;
    color: #101a33;
    font-weight: 700;
    font-size: .92rem;
    white-space: nowrap;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .45);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s, transform .2s;
}
.wd-hlaska.wd-vidno { opacity: 1; transform: translate(-50%, 0); }

.wd-klav {
    width: 100%;
    max-width: 540px;
    display: flex;
    flex-direction: column;
    gap: var(--kg);
    user-select: none;
    touch-action: manipulation;
}
.wd-krada { display: flex; gap: 5px; justify-content: center; }
.wd-k {
    flex: 1 1 0;
    min-width: 0;
    max-width: 46px;
    height: var(--kh);
    padding: 0;
    border: none;
    border-radius: 8px;
    background: linear-gradient(180deg, #6b7580, #535b64);
    color: #fff;
    font-family: 'Noto Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: clamp(.82rem, 3.6vw, 1.05rem);
    font-weight: 700;
    box-shadow: 0 3px 0 rgba(0, 0, 0, .35);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: filter .15s, transform .08s;
}
.wd-krada:first-child .wd-k { background: linear-gradient(180deg, #5d6a73, #46505a); }
.wd-k:hover { filter: brightness(1.15); }
.wd-k:active { transform: translateY(2px); box-shadow: 0 1px 0 rgba(0, 0, 0, .35); }
.wd-k:focus { outline: none; }
.wd-k:focus-visible { outline: 2px solid #fff; outline-offset: 1px; }
.wd-k-siroka { flex: 1.5 1 0; max-width: 72px; font-size: clamp(.66rem, 2.8vw, .82rem); letter-spacing: .03em; }
.wd-k-siroka svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; }
.wd-k[data-v="g"] { background: linear-gradient(180deg, var(--wd-g1), var(--wd-g2)); }
.wd-k[data-v="y"] { background: linear-gradient(180deg, var(--wd-y1), var(--wd-y2)); }
.wd-k[data-v="d"] { background: linear-gradient(180deg, var(--wd-d1), var(--wd-d2)); }
.wd-k[data-v="x"] { background: #2a2e33; color: rgba(255, 255, 255, .45); box-shadow: 0 3px 0 rgba(0, 0, 0, .2); }

.wd-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1060;
    overflow: auto;
    background: rgba(2, 6, 20, .62);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}
.wd-modal.wd-vidno { display: block; animation: wdPrichod .2s ease-out; }
@keyframes wdPrichod { from { opacity: 0; } }
.wd-box {
    position: relative;
    box-sizing: border-box;
    background:
        radial-gradient(120% 60% at 50% 0%, rgba(90, 150, 255, .2) 0%, rgba(108, 195, 111, 0) 60%),
        linear-gradient(165deg, var(--wd-panel) 0%, var(--wd-panel-2) 100%);
    border-radius: 22px;
    padding: 28px 22px 24px;
    max-width: 430px;
    width: calc(100% - 28px);
    margin: 8vh auto;
    text-align: center;
    border: 1px solid rgba(150, 190, 255, .2);
    box-shadow: 0 24px 64px rgba(0, 0, 0, .65), inset 0 1px 0 rgba(255, 255, 255, .08);
    color: var(--wd-text);
    font-family: 'Noto Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    animation: wdBox .3s cubic-bezier(.2, 1.2, .4, 1);
}
@keyframes wdBox { from { transform: translateY(18px) scale(.97); opacity: 0; } }
.wd-box h2 { font-size: 1.3rem; color: var(--wd-zlata); margin: 0 0 12px; font-weight: 800; }
.wd-box p { font-size: .9rem; margin: 0 0 8px; line-height: 1.55; color: rgba(241, 244, 251, .88); }

.wd-np-uvod { margin-bottom: 14px !important; }
.wd-np-radek { text-align: left; margin: 0 0 12px; }
.wd-np-radek p { margin: 6px 0 0; font-size: .84rem; }
.wd-np-slovo { display: flex; gap: 5px; }
.wd-mala { --dl: 38px; }
.wd-np-body { text-align: left; padding-left: 18px; margin: 14px 0 18px; font-size: .84rem; line-height: 1.55; color: rgba(241, 244, 251, .85); }
.wd-np-body li { margin-bottom: 4px; }

.wd-tlacitka { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.wd-t {
    display: inline-block;
    padding: 12px 24px;
    border-radius: 12px;
    font-size: .95rem;
    font-weight: 700;
    cursor: pointer;
    border: none;
    text-decoration: none;
    transition: transform .2s, filter .2s;
}
.wd-t:hover { transform: translateY(-1px); filter: brightness(1.1); color: #fff; text-decoration: none; }
.wd-t-prim { background: linear-gradient(180deg, #5cbc62, #2d7d35); color: #fff; box-shadow: 0 6px 16px rgba(28, 110, 38, .45), inset 0 1px 0 rgba(255, 255, 255, .25); }
.wd-t-sek { background: rgba(255, 255, 255, .1); color: #fff; border: 1px solid rgba(255, 255, 255, .2); }

.wd-pohar {
    display: block;
    width: 110px;
    height: 110px;
    margin: -8px auto 6px;
    filter: drop-shadow(0 6px 22px rgba(255, 203, 61, .55));
    animation: wdPohar .7s cubic-bezier(.2, 1.4, .4, 1) both;
}
.wd-pohar[hidden] { display: none; }
@keyframes wdPohar { from { opacity: 0; transform: scale(.4) rotate(-12deg); } }
.wd-k-titulek { font-size: 1.6rem !important; margin-bottom: 2px !important; }
.wd-prohra .wd-k-titulek { color: #fff !important; }
.wd-k-pod { font-size: .82rem !important; color: var(--wd-dim) !important; text-transform: uppercase; letter-spacing: .1em; margin-bottom: 10px !important; }
.wd-k-slovo { display: flex; justify-content: center; gap: 6px; margin-bottom: 8px; }
.wd-k-slovo .wd-dl { --dl: 48px; animation: wdSlovo .45s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes wdSlovo { from { opacity: 0; transform: translateY(12px) rotateX(-80deg); } }
.wd-k-odkazy { display: flex; justify-content: center; gap: 18px; margin-bottom: 16px; font-size: .8rem; }
.wd-k-odkazy a { color: #9fe0a3; text-decoration: underline; text-underline-offset: 3px; }
.wd-k-odkazy a:hover { color: #fff; }
.wd-k-cisla, .wd-st-cisla { display: flex; justify-content: center; gap: 8px; margin-bottom: 14px; }
.wd-k-cisla > div, .wd-st-cisla > div {
    flex: 1;
    min-width: 0;
    max-width: 110px;
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 13px;
    padding: 10px 2px 8px;
}
.wd-k-cisla b, .wd-st-cisla b { display: block; font-size: 1.35rem; font-weight: 900; color: #fff; line-height: 1.2; font-variant-numeric: tabular-nums; }
.wd-k-cisla b.wd-zlata { color: var(--wd-zlata); }
.wd-k-cisla span, .wd-st-cisla span { display: block; font-size: .6rem; text-transform: uppercase; letter-spacing: .07em; color: var(--wd-dim); }
.wd-k-pozn {
    font-size: .82rem !important;
    color: #ffe9b0 !important;
    background: rgba(236, 194, 74, .12);
    border: 1px solid rgba(236, 194, 74, .4);
    border-radius: 10px;
    padding: 9px 10px;
    margin-bottom: 14px !important;
}
.wd-k-pozn[hidden] { display: none; }

.wd-stat { margin-bottom: 16px; }
.wd-st-graf { display: grid; gap: 4px; text-align: left; }
.wd-st-r { display: flex; align-items: center; gap: 8px; font-size: .8rem; }
.wd-st-r > span { width: 12px; color: var(--wd-dim); font-weight: 700; text-align: center; }
.wd-st-p {
    min-width: 22px;
    padding: 2px 7px;
    border-radius: 5px;
    background: var(--wd-x1);
    color: #fff;
    font-weight: 700;
    text-align: right;
    box-sizing: border-box;
}
.wd-st-p.wd-st-akt { background: linear-gradient(90deg, var(--wd-g2), var(--wd-g1)); }
.wd-stat-mala .wd-st-cisla { display: none; }
.wd-stat-mala .wd-st-r { font-size: .72rem; }
.wd-st-pozn { font-size: .74rem !important; color: var(--wd-dim) !important; }

.wd-text {
    max-width: 760px;
    margin: 36px auto 0;
    padding: 22px 22px 24px;
    box-sizing: border-box;
    border-radius: 18px;
    background: rgba(8, 16, 42, .6);
    border: 1px solid var(--wd-line);
    color: rgba(241, 244, 251, .88);
    font-family: 'Noto Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    text-align: left;
}
.wd-text h2 { font-size: 1.2rem; font-weight: 800; color: #fff; margin: 0 0 10px; }
.wd-text h3 { font-size: .98rem; font-weight: 700; color: var(--wd-zlata); margin: 18px 0 4px; }
.wd-text p { font-size: .9rem; line-height: 1.6; margin: 0 0 8px; }
.wd-text a:not(.wd-t) { color: #9fe0a3; }
.wd-text .wd-t { margin-top: 12px; }

body.wd-hraje .main { padding-top: 86px; }
body.wd-hraje h1.wd-nadpis { display: none; }

@media (min-height: 920px) and (min-width: 600px) {
    body.wd-hraje h1.wd-nadpis { display: block; margin-bottom: 8px; }
    .wd-hra { --fix: 304px; }
    body.wd-hraje .wd-logo { width: 230px; }
}

@media (max-width: 599px), (max-height: 760px) {
    body.wd-hraje .main { padding-top: 78px; margin-bottom: 20px; }
    .wd-hra { --fix: 205px; --dl: clamp(30px, min(60px, calc((100vw - 56px) / 5), calc((100dvh - var(--fix) - 4 * var(--kh)) / 7)), 60px); --mez: 8px; --pd: 8px; --rg: 5px; --kg: 5px; }
    .wd-deska { border-radius: 15px; }
    .wd-krada { gap: 4px; }
    .wd-k { border-radius: 6px; }
}

@media (max-width: 380px) {
    .wd-wrap { padding: 0 4px; }
    .wd-krada { gap: 3px; }
    .wd-k-siroka { font-size: .6rem; }
    .wd-mala { --dl: 34px; }
    .wd-k-slovo .wd-dl { --dl: 42px; }
}

@media (prefers-reduced-motion: reduce) {
    .wd-radek,
    .wd-logo, .wd-box, .wd-modal.wd-vidno, .wd-pohar, .wd-k-slovo .wd-dl { animation: none; }
}

.wd-v-wrap { max-width: 780px; }
.wd-v-logo { width: 260px; }
.wd-v-podtitul { color: #fff; font-size: 1.05rem; font-weight: 700; margin: 0 0 18px; text-shadow: 0 2px 10px rgba(0, 0, 0, .35); }
.wd-v-podtitul small { display: block; color: var(--wd-dim); font-size: .78rem; font-weight: 600; margin-top: 3px; }

.wd-v-staty { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 0 0 16px; }
.wd-v-stat {
    background: linear-gradient(165deg, rgba(26, 46, 92, .88), rgba(8, 15, 38, .92));
    border: 1px solid rgba(150, 190, 255, .14);
    border-radius: 13px;
    padding: 11px 6px 10px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .3);
}
.wd-v-stat span { display: block; font-size: .6rem; letter-spacing: .09em; text-transform: uppercase; color: var(--wd-dim); }
.wd-v-stat b { display: block; font-size: 1.45rem; font-weight: 800; line-height: 1.2; color: #fff; font-variant-numeric: tabular-nums; }
.wd-v-stat b.zlata { color: var(--wd-zlata); }
.wd-v-stat b.zelena { color: #8fe293; }
.wd-v-stat b.modra { color: #8cc8ff; }
.wd-v-stat b.cervena { color: #ff9a8a; }

.wd-v-slovo { display: flex; justify-content: center; gap: 7px; margin: 4px 0 10px; }
.wd-v-slovo .wd-dl { --dl: 56px; }

.wd-v-prepinac {
    display: flex;
    gap: 5px;
    background: rgba(8, 16, 42, .8);
    border: 1px solid rgba(150, 190, 255, .14);
    border-radius: 13px;
    padding: 5px;
    max-width: 460px;
    margin: 0 auto 14px;
}
.wd-v-prepinac button {
    flex: 1 1 0;
    border: none;
    background: none;
    border-radius: 9px;
    padding: 9px 6px;
    font-size: .86rem;
    font-weight: 700;
    color: var(--wd-dim);
    cursor: pointer;
    transition: background .2s, color .2s;
}
.wd-v-prepinac button:hover { color: #fff; }
.wd-v-prepinac button.akt { background: linear-gradient(180deg, #5cbc62, #2d7d35); color: #fff; box-shadow: 0 4px 12px rgba(28, 110, 38, .5); }

.wd-v-tabulka {
    position: relative;
    display: grid;
    gap: 5px;
    grid-template-columns: minmax(0, 1fr);
    text-align: left;
    padding: 14px 14px 12px;
    border-radius: 20px;
    background:
        radial-gradient(120% 70% at 50% 0%, rgba(90, 150, 255, .2) 0%, rgba(108, 195, 111, 0) 60%),
        linear-gradient(165deg, rgba(24, 42, 86, .94) 0%, rgba(6, 12, 32, .96) 100%);
    border: 1px solid rgba(150, 190, 255, .22);
    box-shadow: 0 22px 50px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .1);
    overflow: hidden;
    font-family: 'Noto Sans', -apple-system, BlinkMacSystemFont, sans-serif;
}
.wd-v-tabulka::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, var(--wd-g1), var(--wd-y1) 50%, var(--wd-d1));
    opacity: .9;
}
.wd-v-radek {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 62px 52px 52px 60px 74px;
    min-width: 0;
    gap: 8px;
    align-items: center;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 11px;
    padding: 8px 12px;
    font-size: .88rem;
    color: #fff;
}
.wd-v-nejnovejsi .wd-v-radek { grid-template-columns: minmax(0, 1fr) 62px 52px 52px 60px 74px; }
.wd-v-aktivni .wd-v-radek { grid-template-columns: 34px minmax(0, 1fr) 46px 56px 62px 52px 52px; }
.wd-v-radek .vzdano { color: #ff9a8a; font-weight: 700; text-align: right; }
.wd-v-slova .wd-v-radek { grid-template-columns: 34px minmax(0, 1fr) 62px 52px 52px 74px; }
.wd-v-radek > span { font-variant-numeric: tabular-nums; }
.wd-v-radek .poradi b {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 24px; height: 24px; padding: 0 5px;
    border-radius: 7px;
    background: rgba(255, 255, 255, .1);
    font-size: .78rem; font-weight: 800;
}
.wd-v-radek .hrac { display: flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; font-weight: 600; }
.wd-v-radek .hrac .jm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wd-v-radek .vip { color: #ffd700; flex: 0 0 auto; text-shadow: 0 0 6px rgba(255, 215, 0, .5); }
.wd-v-radek .skore { color: var(--wd-zlata); font-weight: 800; font-size: 1rem; text-align: right; }
.wd-v-radek .pokusy { color: #8fe293; font-weight: 700; text-align: right; }
.wd-v-radek .her { color: #8cc8ff; font-weight: 700; text-align: right; }
.wd-v-radek .cas, .wd-v-radek .datum { color: var(--wd-dim); font-size: .8rem; text-align: right; }
.wd-v-radek .slovo { text-align: right; }
.wd-v-radek .slovo a {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 6px;
    background: linear-gradient(180deg, var(--wd-g1), var(--wd-g2));
    color: #fff;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-decoration: none;
    box-shadow: 0 2px 0 rgba(0, 0, 0, .25);
}
.wd-v-radek .slovo a:hover { filter: brightness(1.15); }

.wd-v-radek.wd-v-medaile { border-color: rgba(236, 194, 74, .45); }
.wd-v-radek.wd-v-m1 { background: linear-gradient(90deg, rgba(108, 195, 111, .4), rgba(255, 255, 255, .05) 75%); }
.wd-v-radek.wd-v-m2 { background: linear-gradient(90deg, rgba(108, 195, 111, .26), rgba(255, 255, 255, .05) 75%); }
.wd-v-radek.wd-v-m3 { background: linear-gradient(90deg, rgba(108, 195, 111, .15), rgba(255, 255, 255, .05) 75%); }
.wd-v-radek.wd-v-m1 .poradi b { background: linear-gradient(180deg, #ffe27a, #e0a800); color: #3a2600; }
.wd-v-radek.wd-v-m2 .poradi b { background: linear-gradient(180deg, #f1f4f9, #aeb6c4); color: #2a2f38; }
.wd-v-radek.wd-v-m3 .poradi b { background: linear-gradient(180deg, #f1b784, #b8682c); color: #3a1c05; }

.wd-v-radek.highlight-row,
.wd-v-radek.vip-me {
    outline: 2px solid #ffcb00;
    outline-offset: -1px;
    background: rgba(255, 203, 0, .15);
}
.wd-v-radek.highlight-row > span,
.wd-v-radek.vip-me > span { color: #fff; }

.wd-v-radek.wd-v-hlavicka {
    background: transparent;
    border-color: transparent;
    padding: 0 12px 4px;
}
.wd-v-radek.wd-v-hlavicka > span { color: var(--wd-dim); font-size: .7rem; font-weight: 600; text-align: right; }
.wd-v-radek.wd-v-hlavicka .poradi, .wd-v-radek.wd-v-hlavicka .hrac { text-align: left; }
.wd-v-radek.wd-v-hlavicka span[title] { cursor: help; }

.wd-v-zlom { display: none; }
.wd-v-prazdno { color: #fff; text-align: center; padding: 26px 10px; }
.wd-v-pozn { color: rgba(255, 255, 255, .75); font-size: .8rem; line-height: 1.5; text-align: center; margin: 12px auto 22px; max-width: 560px; }
.wd-v-pohled[hidden] { display: none; }

.wd-v-hrat { margin: 30px auto 0; }
.wd-v-hrat h2 { color: #eee; font-size: 1.1rem; margin: 0 0 14px; }

@media (max-width: 599px) {
    .wd-v-staty { grid-template-columns: repeat(2, 1fr); }
    .wd-v-slovo .wd-dl { --dl: 48px; }
    .wd-v-radek,
    .wd-v-nejnovejsi .wd-v-radek,
    .wd-v-aktivni .wd-v-radek,
    .wd-v-slova .wd-v-radek {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 3px 10px;
        padding: 8px 10px;
    }
    .wd-v-radek .poradi { flex: 0 0 auto; }
    .wd-v-radek .hrac { flex: 1 1 0; min-width: 0; }
    .wd-v-radek .skore { flex: 0 0 auto; margin-left: auto; }
    .wd-v-zlom { display: block; flex: 0 0 100%; height: 0; }
    .wd-v-radek .pokusy,
    .wd-v-radek .cas,
    .wd-v-radek .datum,
    .wd-v-radek .her { text-align: left; font-size: .74rem; font-weight: 600; }
    .wd-v-radek .pokusy, .wd-v-aktivni .wd-v-radek .her { margin-left: 34px; }
    .wd-v-nejnovejsi .wd-v-radek .pokusy { margin-left: 0; }
    .wd-v-radek span[data-popis]::after { content: " " attr(data-popis); color: var(--wd-dim); font-weight: 400; }
    .wd-v-radek .slovo { margin-left: auto; }
    .wd-v-radek .datum::before { content: "v "; color: var(--wd-dim); }
    .wd-v-slova .wd-v-radek .datum::before { content: ""; }
    .wd-v-tabulka { padding: 10px 8px 9px; border-radius: 16px; }
    .wd-v-radek.wd-v-hlavicka { display: none; }
}
.wd-st-nadpis { font-size: .66rem !important; text-transform: uppercase; letter-spacing: .09em; color: var(--wd-dim) !important; margin: 0 0 6px !important; text-align: left; }

.wd-lista [data-tip] { position: relative; }
.wd-lista [data-tip]::after {
    content: attr(data-tip);
    position: absolute;
    top: calc(100% + 8px);
    left: 50%;
    z-index: 20;
    padding: 5px 10px;
    border-radius: 7px;
    background: #f4f6fb;
    color: #101a33;
    font-size: .68rem;
    font-weight: 400;
    letter-spacing: 0;
    white-space: nowrap;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .4);
    pointer-events: none;
    opacity: 0;
    transform: translate(-50%, -4px);
    transition: opacity .15s, transform .15s;
}
.wd-lista [data-tip]:hover::after,
.wd-lista [data-tip]:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }
.wd-lista .wd-vzdat.wd-jiste::after { display: none; }
@media (hover: none) {
    .wd-lista [data-tip]:hover::after { opacity: 0; }
}

details.wd-text { padding: 0; background: none; border: none; }
details.wd-text > summary {
    display: block;
    width: fit-content;
    margin: 0 auto;
    padding: 11px 22px;
    border-radius: 12px;
    background: rgba(8, 16, 42, .6);
    border: 1px solid rgba(150, 190, 255, .22);
    color: #fff;
    font-weight: 700;
    font-size: .95rem;
    text-align: center;
    cursor: pointer;
    list-style: none;
    transition: background .2s, border-color .2s;
}
details.wd-text > summary::-webkit-details-marker { display: none; }
details.wd-text > summary::after { content: " ▾"; color: var(--wd-g1); }
details.wd-text[open] > summary::after { content: " ▴"; }
details.wd-text > summary:hover { background: rgba(8, 16, 42, .85); border-color: rgba(150, 190, 255, .45); }
details.wd-text[open] {
    padding: 0 22px 24px;
    border-radius: 18px;
    background: rgba(8, 16, 42, .6);
    border: 1px solid var(--wd-line);
}
details.wd-text[open] > summary { margin: 0 auto 18px; transform: translateY(-1px); background: none; border-color: transparent; padding-top: 16px; }

.wd-stat-mala .wd-st-graf { gap: 2px; }
.wd-stat-mala .wd-st-p { padding: 0 6px; line-height: 1.45; font-size: .7rem; }
@media (max-height: 860px) {
    .wd-box { margin: 3vh auto; padding: 20px 18px 18px; }
    .wd-pohar { width: 84px; height: 84px; margin: -6px auto 2px; }
    .wd-k-cisla > div { padding: 7px 2px 6px; }
    .wd-k-odkazy { margin-bottom: 10px; }
}

.wd-hra .wd-klav { margin-top: auto; }

.wd-v-staty-6 { grid-template-columns: repeat(3, 1fr); }
.wd-v-stat b.seda { color: #c9cfdb; }
.wd-v-radek .skore.nic { color: var(--wd-dim); font-weight: 600; }
.wd-stitek {
    display: inline-block;
    padding: 2px 7px 1px;
    border-radius: 5px;
    font-style: normal;
    font-size: .62rem;
    font-weight: 400;
    letter-spacing: .08em;
    line-height: 1.4;
    color: #fff;
    vertical-align: middle;
}
.wd-stitek.vzdano { background: #c62f2f; box-shadow: 0 1px 0 rgba(0, 0, 0, .35); }
.wd-stitek.prohra { background: #0b0d12; border: 1px solid rgba(255, 255, 255, .22); }
@media (max-width: 599px) {
    .wd-v-staty-6 { grid-template-columns: repeat(3, 1fr); gap: 6px; }
    .wd-v-staty-6 .wd-v-stat { padding: 9px 3px 8px; }
    .wd-v-staty-6 .wd-v-stat span { font-size: .52rem; letter-spacing: .05em; }
    .wd-v-staty-6 .wd-v-stat b { font-size: 1.2rem; }
}
.wd-v-radek .slovo a.neuhodnuto { background: linear-gradient(180deg, var(--wd-x1), var(--wd-x2)); color: rgba(255, 255, 255, .85); }
@media (max-width: 599px) {
    .wd-v-aktivni .wd-v-radek .wd-v-zlom { order: 4; }
    .wd-v-aktivni .wd-v-radek .her { order: 5; margin-left: 34px; }
    .wd-v-aktivni .wd-v-radek .vzdano { order: 6; text-align: left; font-size: .74rem; font-weight: 600; }
    .wd-v-aktivni .wd-v-radek .pokusy { order: 7; margin-left: 0; }
    .wd-v-aktivni .wd-v-radek .cas { order: 8; }
}

.wd-box-siroky { max-width: 640px; }
@media (min-width: 700px) {
    .wd-np-mrizka { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 26px; }
    .wd-box-siroky .wd-np-body { columns: 2; column-gap: 26px; }
    .wd-box-siroky .wd-np-body li { break-inside: avoid; }
}
.wd-box-limit { max-width: 440px; }
.wd-limit-ikona { font-size: 2.6rem; line-height: 1; margin: -4px 0 8px; }
.wd-limit-cas { font-size: 1.02rem !important; color: #fff !important; }
.wd-limit-cas strong { color: var(--wd-zlata); }
.wd-t-vip { background: linear-gradient(180deg, #ffd95a, #d9a20b); color: #2b1d00; box-shadow: 0 6px 16px rgba(217, 162, 11, .35), inset 0 1px 0 rgba(255, 255, 255, .45); }
.wd-t-vip:hover { color: #2b1d00; }
.wd-limit-odkaz { color: #9fe0a3; font-weight: 800; letter-spacing: .04em; text-decoration: underline; text-underline-offset: 3px; }
.wd-limit-odkaz:hover { color: #fff; }

.wd-limit-panel {
    box-sizing: border-box;
    width: min(100%, 420px);
    margin: 0 auto 4px;
    padding: 22px 20px 20px;
    border-radius: 20px;
    background:
        radial-gradient(120% 60% at 50% 0%, rgba(255, 203, 61, .14) 0%, rgba(255, 203, 61, 0) 60%),
        linear-gradient(165deg, var(--wd-panel) 0%, var(--wd-panel-2) 100%);
    border: 1px solid rgba(255, 203, 61, .35);
    box-shadow: 0 18px 46px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .08);
    color: var(--wd-text);
    text-align: center;
    animation: wdBox .3s cubic-bezier(.2, 1.2, .4, 1);
}
.wd-limit-panel[hidden] { display: none; }
.wd-limit-panel h2 { font-size: 1.25rem; font-weight: 800; color: var(--wd-zlata); margin: 0 0 10px; }
.wd-limit-panel p { font-size: .9rem; line-height: 1.5; margin: 0 0 8px; color: rgba(241, 244, 251, .88); }
.wd-limit-panel .wd-t-vip { margin-top: 8px; }
.wd-uvod .hrac-btn[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { .wd-limit-panel { animation: none; } }

.wd-vyzva-panel {
    box-sizing: border-box;
    width: min(100%, 440px);
    margin: 0 auto 14px;
    padding: 16px 16px 14px;
    border-radius: 18px;
    background:
        radial-gradient(120% 70% at 50% 0%, rgba(90, 169, 236, .22) 0%, rgba(90, 169, 236, 0) 65%),
        linear-gradient(165deg, var(--wd-panel) 0%, var(--wd-panel-2) 100%);
    border: 1px solid rgba(90, 169, 236, .45);
    box-shadow: 0 16px 40px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .08);
    color: var(--wd-text);
    text-align: center;
    animation: wdBox .3s cubic-bezier(.2, 1.2, .4, 1);
}
.wd-vyzva-stitek {
    display: inline-block;
    padding: 5px 18px;
    border-radius: 20px;
    background: linear-gradient(180deg, var(--wd-d1), var(--wd-d2));
    color: #fff;
    font-size: .95rem;
    font-weight: 800;
    letter-spacing: .18em;
}
.wd-vyzva-hlava { position: relative; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; }
.wd-vyzva-hlava .wd-vyzva-sd { position: absolute; right: 0; top: 50%; margin-top: -15px; }
.wd-vyzva-kdo { font-size: 1.05rem; margin-bottom: 10px; }
.wd-vyzva-kdo strong { color: #fff; font-size: 1.35rem; font-weight: 800; }
.wd-vyzva-cil { display: flex; justify-content: center; gap: 8px; margin-bottom: 8px; }
.wd-vyzva-cil span {
    flex: 1;
    max-width: 110px;
    padding: 7px 4px 6px;
    border-radius: 11px;
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(255, 255, 255, .08);
    font-size: .6rem;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--wd-dim);
}
.wd-vyzva-cil b { display: block; font-size: 1.25rem; font-weight: 900; color: #fff; letter-spacing: 0; text-transform: none; line-height: 1.2; }
.wd-vyzva-cil b.wd-zlata { color: var(--wd-zlata); }
.wd-vyzva-info { font-size: .82rem; color: var(--wd-dim); min-height: 1.2em; }
.wd-vyzva-neplatna p { margin: 0; font-size: .9rem; color: var(--wd-dim); }
#wd-vyzva-tab .wd-vt { margin-top: 10px; }

.wd-mini { display: inline-grid; grid-template-columns: repeat(5, 6px); gap: 1px; align-content: start; flex: 0 0 auto; min-width: 34px; }
.wd-mini i { width: 6px; height: 6px; border-radius: 1.5px; background: var(--wd-x1); }
.wd-mini i[data-v="g"] { background: var(--wd-g1); }
.wd-mini i[data-v="y"] { background: var(--wd-y1); }
.wd-mini i[data-v="d"] { background: var(--wd-d1); }

.wd-vt { display: grid; gap: 4px; text-align: left; }
.wd-vt-r {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) 34px auto 40px;
    gap: 8px;
    align-items: center;
    padding: 6px 9px;
    border-radius: 9px;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .06);
    font-size: .8rem;
}
.wd-vt-por { color: var(--wd-dim); font-weight: 700; text-align: center; }
.wd-vt-jm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; color: #fff; }
.wd-vt-vys { color: var(--wd-dim); font-size: .74rem; white-space: nowrap; text-align: right; }
.wd-vt-b { color: var(--wd-zlata); font-weight: 800; text-align: right; }
.wd-vt-vyz { background: rgba(90, 169, 236, .14); border-color: rgba(90, 169, 236, .4); }
.wd-vt-vyz .wd-vt-por { color: var(--wd-zlata); }
.wd-vt-ja { outline: 2px solid #ffcb00; outline-offset: -1px; background: rgba(255, 203, 0, .13); }
.wd-vt-dalsi { font-size: .74rem; color: var(--wd-dim); text-align: center; padding: 2px 0; }

.wd-k-vyzva { margin: 2px 0 14px; }
.wd-vyzva-zprava { font-size: 1.02rem !important; font-weight: 800; color: #fff !important; margin: 0 0 2px !important; }
.wd-vyzva-zprava.wd-vyzva-vyhra { color: #8fe293 !important; }
.wd-vyzva-poradi { font-size: .78rem !important; color: var(--wd-dim) !important; margin: 0 0 8px !important; }

.wd-sdilet-obal { position: relative; display: block; margin: 0 0 12px; }
.wd-sdilet-obal[hidden] { display: none; }
.wd-t-vyzva {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    padding: 13px 18px;
    font-size: 1.02rem;
    letter-spacing: .02em;
    color: #fff;
    background: linear-gradient(180deg, var(--wd-d1), var(--wd-d2));
    box-shadow: 0 8px 20px rgba(44, 105, 176, .45), inset 0 1px 0 rgba(255, 255, 255, .3);
    animation: wdVyzvaPuls 2.4s ease-in-out 1s 2;
}
.wd-t-vyzva[hidden] { display: none; }
.wd-t-vyzva svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
@keyframes wdVyzvaPuls { 50% { transform: scale(1.03); box-shadow: 0 10px 28px rgba(90, 169, 236, .6), inset 0 1px 0 rgba(255, 255, 255, .3); } }
.wd-sdilet-obal[data-tip]::after {
    content: attr(data-tip);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    z-index: 5;
    padding: 6px 11px;
    border-radius: 8px;
    background: #f4f6fb;
    color: #101a33;
    font-size: .68rem;
    font-weight: 400;
    white-space: nowrap;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .4);
    pointer-events: none;
    opacity: 0;
    transform: translate(-50%, 4px);
    transition: opacity .15s, transform .15s;
}
.wd-sdilet-obal[data-tip]:hover::after { opacity: 1; transform: translate(-50%, 0); }
@media (hover: none) {
    .wd-sdilet-obal[data-tip]::after { position: static; display: block; margin-top: 6px; padding: 0; background: none; box-shadow: none; color: var(--wd-dim); font-size: .7rem; font-weight: 400; white-space: normal; opacity: 1; transform: none; }
}

.wd-stat-vyzvy { margin: -4px 0 14px; text-align: left; }
.wd-stat-vyzvy[hidden] { display: none; }
.wd-mv { display: grid; gap: 4px; }
.wd-mv-r {
    display: grid;
    grid-template-columns: 52px 1fr auto;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 9px;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .07);
    color: #fff;
    font-size: .8rem;
    text-decoration: none;
}
.wd-mv-r:hover { background: rgba(90, 169, 236, .14); border-color: rgba(90, 169, 236, .4); color: #fff; text-decoration: none; }
.wd-mv-d { color: var(--wd-dim); }
.wd-mv-n { color: #8cc8ff; font-weight: 700; }
@media (prefers-reduced-motion: reduce) { .wd-vyzva-panel, .wd-t-vyzva { animation: none; } }


.wd-v-rozbal { cursor: pointer; transition: background .15s; }
.wd-v-rozbal:hover { background: rgba(255, 255, 255, .09); }
.wd-v-rozbal:focus-visible { outline: 2px solid var(--wd-d1); outline-offset: -1px; }
.wd-v-mrizka {
    grid-column: 1 / -1;
    flex: 0 0 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 10px 0 4px;
    animation: wdRadek .25s ease-out;
}
.wd-v-mr { display: flex; gap: 4px; }
.wd-v-mr i { width: 22px; height: 22px; border-radius: 5px; background: linear-gradient(180deg, var(--wd-x1), var(--wd-x2)); box-shadow: 0 2px 0 rgba(0, 0, 0, .25); }
.wd-v-mr i[data-v="g"] { background: linear-gradient(180deg, var(--wd-g1), var(--wd-g2)); }
.wd-v-mr i[data-v="y"] { background: linear-gradient(180deg, var(--wd-y1), var(--wd-y2)); }
.wd-v-mr i[data-v="d"] { background: linear-gradient(180deg, var(--wd-d1), var(--wd-d2)); }
@media (prefers-reduced-motion: reduce) { .wd-v-mrizka { animation: none; } }

.wd-v-staty-8 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 599px) {
    .wd-v-staty-8 { grid-template-columns: repeat(4, 1fr); gap: 5px; }
    .wd-v-staty-8 .wd-v-stat { padding: 8px 2px 7px; }
    .wd-v-staty-8 .wd-v-stat span { font-size: .48rem; letter-spacing: .03em; }
    .wd-v-staty-8 .wd-v-stat b { font-size: 1.05rem; }
}

.wd-vyzva-sd {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 1px solid rgba(90, 169, 236, .5);
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    color: #fff;
    cursor: pointer;
    transition: background .15s, transform .15s;
}
.wd-vyzva-sd:hover { background: rgba(90, 169, 236, .35); transform: scale(1.08); }
.wd-vyzva-sd:focus-visible { outline: 2px solid var(--wd-d1); outline-offset: 2px; }
.wd-vyzva-sd svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.wd-vyzva-sd::after {
    content: attr(data-tip);
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 5;
    padding: 6px 11px;
    border-radius: 8px;
    background: #f4f6fb;
    color: #101a33;
    font-size: .68rem;
    font-weight: 400;
    letter-spacing: 0;
    white-space: nowrap;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .4);
    pointer-events: none;
    opacity: 0;
    transform: translate(-50%, -4px);
    transition: opacity .15s, transform .15s;
}
.wd-vyzva-sd:hover::after, .wd-vyzva-sd:focus-visible::after { opacity: 1; transform: none; }
@media (hover: none) { .wd-vyzva-sd::after { display: none; } }

.wd-vyzva-sd::after { transform: translateY(-4px); }
.wd-vt-vyz[data-tip] { position: relative; }
.wd-vt-vyz[data-tip]::after {
    content: attr(data-tip);
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    z-index: 5;
    padding: 6px 11px;
    border-radius: 8px;
    background: #f4f6fb;
    color: #101a33;
    font-size: .68rem;
    font-weight: 400;
    white-space: nowrap;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .4);
    pointer-events: none;
    opacity: 0;
    transform: translate(-50%, 4px);
    transition: opacity .15s, transform .15s;
}
.wd-vt-vyz[data-tip]:hover::after { opacity: 1; transform: translate(-50%, 0); }
@media (hover: none) { .wd-vt-vyz[data-tip]::after { display: none; } }

@media (max-height: 650px) and (min-width: 600px) {
    body.wd-hraje .navbar.fixed-top { position: absolute; }
    .wd-hra { --kh: clamp(34px, 7dvh, 44px); --dl: clamp(36px, 8.5dvh, 50px); min-height: 0; }
    .wd-hra .wd-klav { margin-top: 4px; }
}

.wd-vyzva-panel { position: relative; }
.wd-vyzva-avatar {
    position: absolute;
    top: 12px;
    left: 12px;
    width: 48px;
    height: 48px;
    box-sizing: border-box;
    padding: 4px;
    border-radius: 50%;
    border: 2px solid rgba(90, 169, 236, .65);
    background: radial-gradient(circle at 50% 35%, rgba(140, 200, 255, .35), rgba(20, 40, 90, .9));
    box-shadow: 0 4px 12px rgba(0, 0, 0, .35);
    object-fit: contain;
}
.wd-vyzva-kdo[hidden], .wd-vyzva-slovo[hidden] { display: none; }
.wd-vyzva-slovo { display: flex; justify-content: center; gap: 5px; margin: 4px 0 12px; }
.wd-vyzva-panel .wd-vyzva-hlava { min-height: 48px; }
@media (max-width: 380px) {
    .wd-vyzva-stitek { font-size: .8rem; padding: 4px 12px; letter-spacing: .12em; }
    .wd-vyzva-avatar { width: 40px; height: 40px; top: 14px; left: 10px; }
}
.wd-mv-w { margin-left: 6px; color: var(--wd-zlata); }
.wd-mv-v .wd-stitek { font-size: .6rem; }
.wd-v-stat small { display: block; margin-top: 1px; font-size: .55rem; color: var(--wd-dim); }
.wd-v-radek .slovo a.wd-v-vyzva {
    position: relative;
    padding: 1px 10px;
    border: 1.5px solid rgba(200, 228, 255, .75);
    border-radius: 999px;
    background: linear-gradient(180deg, var(--wd-d1), var(--wd-d2));
    font-size: .66rem;
    letter-spacing: .14em;
    box-shadow: 0 0 0 2px rgba(90, 169, 236, .25), 0 2px 0 rgba(0, 0, 0, .25);
}
.wd-v-radek .slovo a.wd-v-vyzva::after {
    content: attr(data-tip);
    position: absolute;
    top: 50%;
    right: calc(100% + 8px);
    z-index: 5;
    padding: 5px 10px;
    border-radius: 7px;
    background: #f4f6fb;
    color: #101a33;
    font-size: .68rem;
    font-weight: 400;
    letter-spacing: 0;
    white-space: nowrap;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .4);
    pointer-events: none;
    opacity: 0;
    transform: translate(4px, -50%);
    transition: opacity .15s, transform .15s;
}
.wd-v-radek .slovo a.wd-v-vyzva:hover::after, .wd-v-radek .slovo a.wd-v-vyzva:focus-visible::after { opacity: 1; transform: translate(0, -50%); }
@media (hover: none) { .wd-v-radek .slovo a.wd-v-vyzva::after { display: none; } }

.wd-stat-vyzvy .wd-st-cisla { justify-content: center; text-align: center; }

.wd-zavrit-x {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    color: #fff;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    transition: background .15s;
}
.wd-zavrit-x:hover { background: rgba(255, 255, 255, .18); }
.wd-zavrit-x:focus-visible { outline: 2px solid var(--wd-d1); outline-offset: 2px; }