.ky [hidden], .ky-qr-tam[hidden] { display: none !important; }
.ky-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ky-baglanti:empty { display: none; }
.ky-baglanti { margin: 0 0 12px; padding: 10px 14px; border: 1px solid var(--fmt-warn); border-radius: var(--fmt-radius); background: var(--fmt-warn-bg); color: var(--fmt-warn); font-weight: 600; }
.ky-giris { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 20px; align-items: start; }
.ky-kart { display: grid; gap: 12px; padding: 16px; border: 1px solid var(--fmt-border-strong); border-radius: var(--fmt-radius); background: var(--fmt-surface); min-width: 0; }
.ky-kart h2 { margin: 0; font-size: 1.25rem; }
.ky-kart form { display: grid; gap: 12px; }
.ky-alan { box-sizing: border-box; width: 100%; min-height: 44px; padding: 8px 10px; border: 1px solid var(--fmt-border-strong); border-radius: var(--arac-r-kucuk, 6px); background: var(--fmt-surface); color: inherit; font: inherit; }
.ky-alan:focus-visible { outline: 2px solid var(--fmt-accent); outline-offset: 2px; }
.ky-kod-alan { font-family: var(--fmt-mono); font-size: 1.6rem; letter-spacing: .2em; text-align: center; }
.ky-satir { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.ky-satir .fmt-btn, .ky-kart .fmt-btn { min-height: 44px; }
.ky-buyuk-btn { min-height: 52px; padding-inline: 22px; font-size: 1.1rem; font-weight: 700; }
.ky-ozet { margin: 0; font-weight: 600; }
.ky-ozet:empty { display: none; }
.ky-hata { min-height: 1.4em; margin: 0; color: var(--fmt-danger); font-weight: 600; }
.ky-adim { display: grid; gap: 12px; }
.ky-kod-bilgi { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
.ky-kod-bilgi strong { font-family: var(--fmt-mono); font-size: 1.3rem; letter-spacing: .12em; }
.ky-ogretmen p { margin: 0; }
.ky-kur { display: grid; gap: 14px; }
.ky-kur-ust { align-items: flex-end; }
.ky-set-ad { flex: 1 1 14em; min-width: 0; }
.ky-editor { display: grid; grid-template-columns: minmax(200px, 260px) minmax(0, 1fr); gap: 16px; align-items: start; }
.ky-soru-panel { display: grid; gap: 10px; }
.ky-soru-liste { display: grid; gap: 6px; max-height: 60vh; margin: 0; padding: 0; overflow: auto; list-style: none; }
.ky-soru-oge { width: 100%; min-height: 44px; padding: 8px 10px; border: 1px solid var(--fmt-border-strong); border-radius: var(--arac-r-kucuk, 8px); background: var(--fmt-surface); color: inherit; font: inherit; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.ky-soru-oge[aria-current="true"] { border-color: var(--fmt-accent); background: var(--fmt-accent-soft); font-weight: 700; }
.ky-soru-oge:focus-visible { outline: 2px solid var(--fmt-accent); outline-offset: 2px; }
.ky-duzen { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--fmt-border-strong); border-radius: var(--fmt-radius); background: var(--fmt-surface); min-width: 0; }
.ky-duzen-ust { align-items: flex-end; }
.ky-bosluk { flex: 1 1 auto; }
.ky-soru-metin { font-size: 1.25rem; resize: vertical; }
.ky-cevaplar { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 10px; }
.ky-cevap { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 10px; border: 2px solid currentColor; border-radius: var(--fmt-radius); }
.ky-cevap .ky-alan { flex: 1 1 8em; min-width: 0; color: var(--body-txt-color, inherit); }
.ky-cevap:has(input[name="kyDogru"]:checked) { outline: 3px solid currentColor; outline-offset: 2px; }
.ky-dogru-sec { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 6px; font-weight: 700; cursor: pointer; }
.ky-dogru-sec:has(input:focus-visible) { outline: 2px solid currentColor; outline-offset: 2px; }
.ky-uyari { margin: 0; padding-left: 1.2em; color: var(--fmt-warn); font-weight: 600; }
.ky-uyari:empty { display: none; }
.ky-kur-alt { align-items: flex-end; }
@media (max-width: 760px) {
    .ky-editor { grid-template-columns: minmax(0, 1fr); }
    .ky-soru-liste { max-height: 30vh; }
}
.ky-grup { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; border: 0; }
.ky-grup legend { margin-bottom: 8px; }
.ky-sec { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 1px solid var(--fmt-border-strong); border-radius: var(--arac-r-kucuk, 8px); cursor: pointer; }
.ky-sec:has(input:checked) { border-color: var(--fmt-accent); background: var(--fmt-accent-soft); font-weight: 600; }
.ky-sec:has(input:focus-visible) { outline: 2px solid var(--fmt-accent); outline-offset: 2px; }
.ky-ts:empty { display: none; }
.ky-ekran { display: grid; gap: 14px; }
.ky-lobi-ust { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; justify-content: space-between; }
.ky-kod-kutu { display: grid; gap: 8px; min-width: 0; }
.ky-kucuk { margin: 0; color: var(--fmt-muted); }
.ky-dev-kod { margin: 0; font-family: var(--fmt-mono); font-size: clamp(2.6rem, 9vw, 5.5rem); font-weight: 800; letter-spacing: .12em; line-height: 1.1; }
.ky-link { margin: 0; font-size: 1.15rem; overflow-wrap: anywhere; }
.ky-qr-kutu { display: grid; justify-items: center; gap: 10px; }
.ky-qr { width: min(100%, 360px); height: auto; image-rendering: pixelated; border-radius: 6px; }
.ky-lobi-eylem { align-items: center; }
.ky-lobi-eylem .ky-ozet { flex: 1 1 auto; }
.ky-lobi { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ky-lobi li { display: inline-flex; align-items: center; gap: 6px; padding: 4px 6px 4px 12px; border: 1px solid var(--fmt-border-strong); border-radius: 999px; background: var(--fmt-surface); overflow-wrap: anywhere; }
.ky-lobi li[data-bagli="0"] { opacity: .55; }
.ky-lobi .fmt-btn { min-height: 36px; padding: 0 10px; }
.ky-soru-ust { align-items: center; justify-content: space-between; }
.ky-n { margin: 0; color: var(--fmt-muted); font-weight: 700; }
.ky-sure-yazi { font-family: var(--fmt-mono); font-size: 2rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.ky-host-metin { margin: 0; font-size: clamp(1.5rem, 3.2vw, 2.6rem); line-height: 1.25; overflow-wrap: anywhere; }
.ky-host-sec, .ky-dagilim { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.ky-host-sec li, .ky-dagilim li { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 12px 16px; border: 2px solid currentColor; border-radius: var(--fmt-radius); font-size: clamp(1.1rem, 2vw, 1.5rem); font-weight: 700; overflow-wrap: anywhere; }
.ky-r0 { color: var(--fmt-danger); background: var(--fmt-danger-bg); }
.ky-r1 { color: var(--fmt-info); background: var(--fmt-info-bg); }
.ky-r2 { color: var(--fmt-warn); background: var(--fmt-warn-bg); }
.ky-r3 { color: var(--fmt-ok); background: var(--fmt-ok-bg); }
.ky-sekil { flex: 0 0 auto; font-size: 1.4em; line-height: 1; }
.ky-harf { flex: 0 0 auto; min-width: 1.6em; font-family: var(--fmt-mono); }
.ky-sec-metin { flex: 1 1 7em; min-width: 0; color: var(--body-txt-color, inherit); }
.ky-dagilim li { position: relative; flex-wrap: wrap; }
.ky-dagilim li[data-dogru="1"] { outline: 4px solid currentColor; outline-offset: 2px; }
.ky-dagilim li[data-dogru="0"] { opacity: .6; }
.ky-adet { flex: 0 0 auto; margin-left: auto; font-family: var(--fmt-mono); font-variant-numeric: tabular-nums; }
.ky-ilk5 { margin: 0; padding-left: 1.4em; font-size: 1.15rem; }
.ky-ilk5 li { padding: 2px 0; overflow-wrap: anywhere; }
.ky-tablo { width: 100%; border-collapse: collapse; table-layout: fixed; }
.ky-tablo th, .ky-tablo td { padding: 8px 10px; border-top: 1px solid var(--fmt-border); text-align: left; overflow-wrap: anywhere; }
.ky-tablo thead th { color: var(--fmt-muted); font-weight: 600; }
.ky-buyuk-yazi { margin: 0; font-size: clamp(1.5rem, 6vw, 2.2rem); font-weight: 800; overflow-wrap: anywhere; }
.ky-oy-metin { margin: 0; font-size: 1.15rem; font-weight: 600; overflow-wrap: anywhere; }
.ky-cubuk { height: 10px; border-radius: 5px; background: var(--fmt-border); overflow: hidden; }
.ky-cubuk span { display: block; height: 100%; width: 100%; background: var(--fmt-accent); }
.ky-oy-sec { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); gap: 12px; }
.ky-oy-btn { display: flex; align-items: center; gap: 10px; min-height: 84px; padding: 12px 14px; border: 2px solid currentColor; border-radius: var(--fmt-radius); font: inherit; font-size: 1.15rem; font-weight: 700; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.ky-oy-btn:focus-visible { outline: 3px solid var(--body-txt-color, currentColor); outline-offset: 3px; }
.ky-oy-btn:disabled { cursor: default; opacity: .55; }
.ky-oy-btn[aria-pressed="true"] { opacity: 1; outline: 4px solid currentColor; outline-offset: 2px; }
.ky-alindi { margin: 0; font-weight: 700; color: var(--fmt-ok); }
.ky-sinir { margin: 18px 0 0; color: var(--fmt-muted); font-size: .92rem; }
.ky-qr-tam { position: fixed; inset: 0; z-index: 1500; display: grid; place-items: center; align-content: center; gap: 12px; padding: 16px; background: #ffffff; color: #000000; }
.ky-qr-buyuk { width: min(90vw, 80vh); height: auto; image-rendering: pixelated; }
.ky-qr-tam .ky-dev-kod { color: #000000; }
.ky-atif { margin-top: 24px; color: var(--fmt-muted); font-size: .9rem; }
.ky-atif a { color: inherit; font-size: inherit; text-decoration: underline; text-underline-offset: 2px; }
@media (prefers-reduced-motion: no-preference) {
    .ky-oy-btn { transition: transform .1s ease; }
    .ky-oy-btn:active:not(:disabled) { transform: scale(.98); }
}
@media (forced-colors: active) {
    .ky-host-sec li, .ky-dagilim li, .ky-oy-btn { border-color: CanvasText; }
    .ky-cubuk span { background: CanvasText; }
}
.ky-modlar { display: flex; align-items: center; gap: 6px; margin: 0 0 12px; }
.ky-modlar-ad { flex: 1 1 auto; min-width: 0; color: var(--fmt-muted); font-weight: 700; font-size: .95rem; }
.ky-mod-btn { display: inline-grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 1px solid var(--fmt-border-strong); border-radius: var(--arac-r-kucuk, 8px); background: var(--fmt-surface); color: inherit; cursor: pointer; }
.ky-mod-btn:hover { border-color: var(--fmt-accent); }
.ky-mod-btn:focus-visible { outline: 2px solid var(--fmt-accent); outline-offset: 2px; }
.ky-mod-btn[aria-pressed="true"] { background: var(--fmt-accent-soft); border-color: var(--fmt-accent); }

html.ky-tiyatro { overflow: hidden; }
.ky-tiyatro .ky, .ky:fullscreen {
    position: fixed;
    inset: 0 0 var(--m-gb-h, 0px);
    z-index: 1003;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 12px clamp(12px, 3vw, 40px) 16px;
    border: 0;
    border-radius: 0;
    overflow: auto;
    background: var(--body-bg-color, Canvas);
    color: var(--body-txt-color, CanvasText);
}
.ky:fullscreen { inset: 0; }
.ky-tiyatro .riza-bandi { z-index: 1004; }
.ky-tiyatro .notification { z-index: 1005; }
:is(.ky-tiyatro .ky, .ky:fullscreen) > :is(.ky-host, .ky-oyuncu):not([hidden]) { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
:is(.ky-tiyatro .ky, .ky:fullscreen) > section > .ky-ekran:not([hidden]) { flex: 1 1 auto; }
:is(.ky-tiyatro .ky, .ky:fullscreen) .ky-sinir, :is(.ky-tiyatro .ky, .ky:fullscreen) .fmt-privacy { display: none; }
:is(.ky-tiyatro .ky, .ky:fullscreen) .ky-giris { flex: 1 1 auto; align-content: center; max-width: 960px; width: 100%; margin-inline: auto; }

.ky-ekran[data-ekran="soru"] { position: relative; grid-template-rows: auto auto auto 1fr; align-content: start; }
.ky-host .ky-ekran[data-ekran="soru"] { grid-template-rows: auto auto auto minmax(0, 1fr); }
.ky-host .ky-host-sec { align-self: end; }
.ky-host-metin { justify-self: center; width: fit-content; max-width: 100%; text-align: center; }
.ky-host .ky-host-metin { align-self: start; margin-top: clamp(8px, 3vh, 40px); }
.ky-host-cubuk { height: 8px; }
.ky-cubuk span { transform-origin: left center; }
:is(.ky-tiyatro .ky, .ky:fullscreen) .ky-host-sec { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: clamp(84px, 19vh, 200px); }
:is(.ky-tiyatro .ky, .ky:fullscreen) .ky-host-sec li { min-height: 0; font-size: clamp(1.2rem, 2.6vw, 2.2rem); }
@media (max-width: 600px) { :is(.ky-tiyatro .ky, .ky:fullscreen) .ky-host-sec { grid-template-columns: minmax(0, 1fr); grid-auto-rows: auto; } }
:is(.ky-tiyatro .ky, .ky:fullscreen) .ky-host-metin { font-size: clamp(1.6rem, 3.6vw, 3.2rem); }
.ky-oyuncu .ky-oy-metin { text-align: center; }



.ky-oyuncu .ky-ekran[data-ekran="soru"] { grid-template-rows: none; }
.ky-oy-sec { grid-auto-rows: minmax(clamp(84px, 13vh, 140px), auto); align-items: stretch; }
.ky { container-type: inline-size; }
@container (max-width: 520px) {
    .ky-oy-sec { gap: 10px; }
    .ky-oy-btn { justify-content: center; padding: 10px 12px; font-size: 1rem; line-height: 1.3; text-align: center; overflow-wrap: break-word; }
    .ky-oy-btn :is(.ky-sekil, .ky-harf) { display: none; }
    .ky-oy-btn .ky-sec-metin { flex: 0 1 auto; hyphens: auto; }
}

.ky { --ky-yay: linear(0, 0.028, 0.099, 0.195, 0.305, 0.418, 0.528, 0.629, 0.719, 0.796, 0.861, 0.913, 0.954, 0.985, 1.008, 1.023, 1.032, 1.037, 1.038, 1.037, 1.035, 1.031, 1.027, 1.022, 1.018, 1.014, 1); }

.ky-alindi-ekran { place-content: center; justify-items: center; gap: 10px; min-height: 50vh; text-align: center; }
.ky-alindi-ikon { display: grid; place-items: center; width: 72px; height: 72px; border: 2px solid var(--fmt-accent); border-radius: 50%; background: var(--fmt-accent-soft); color: var(--body-txt-color, inherit); font-size: 1.8rem; }
.ky-alindi-alt { margin: 0; color: var(--fmt-muted); font-size: 1.1rem; }
.ky-noktalar span { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
    .ky-alindi-ekran:not([hidden]) > * { animation: ky-belir 260ms cubic-bezier(0, 0, 0.2, 1) both; }
    .ky-alindi-ekran:not([hidden]) > .ky-alindi-ikon { animation: ky-belir 420ms var(--ky-yay) both; }
    .ky-noktalar span { animation: ky-nokta 1.4s ease-in-out infinite; }
    .ky-noktalar span:nth-child(2) { animation-delay: .2s; }
    .ky-noktalar span:nth-child(3) { animation-delay: .4s; }
}
@keyframes ky-belir { from { opacity: 0; transform: translateY(8px) scale(0.96); } }
@keyframes ky-nokta { 0%, 80%, 100% { opacity: .25; } 40% { opacity: 1; } }

.ky-host .ky-ekran[data-ekran="sonuc"] { grid-template-columns: minmax(0, 1fr); align-content: start; }
.ky-host .ky-ekran[data-ekran="sonuc"] > .ky-host-metin { justify-self: center; text-align: center; font-size: clamp(1.3rem, 2.6vw, 2.2rem); }
.ky-host .ky-ekran[data-ekran="sonuc"] > :is(h3, .ky-ilk5) { display: none; }
.ky-host .ky-ekran[data-ekran="sonuc"] > :is(.ky-grafik, .ky-dagilim) { width: min(100%, 1100px); justify-self: center; }
.ky-host .ky-ekran[data-ekran="sonuc"] > .ky-satir { justify-content: flex-end; }
:is(.ky-tiyatro .ky, .ky:fullscreen) .ky-dagilim { grid-template-columns: repeat(2, minmax(0, 1fr)); }
:is(.ky-tiyatro .ky, .ky:fullscreen) .ky-dagilim li { min-height: 52px; padding: 8px 14px; font-size: clamp(1rem, 1.6vw, 1.3rem); }

.ky-grafik { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); align-items: end; gap: clamp(10px, 2.4vw, 32px); padding: 0 clamp(4px, 2vw, 24px); border-bottom: 2px solid var(--fmt-border-strong); }
.ky-sutun { display: grid; justify-items: center; gap: 8px; min-width: 0; padding-bottom: 8px; }
.ky-sutun-alan { position: relative; width: min(100%, 150px); height: clamp(120px, 30vh, 300px); margin-top: 2.2em; }
.ky-sutun-cubuk { position: absolute; inset: 0; border-radius: 10px 10px 3px 3px; background: currentColor; box-shadow: inset 0 -5px 0 rgba(0, 0, 0, 0.18); transform: scaleY(0); transform-origin: bottom center; }
.ky-sutun-etiket { position: absolute; inset: 0; display: flex; justify-content: center; align-items: flex-start; font-size: clamp(1.1rem, 2.4vw, 2rem); line-height: 1.5; transform: translateY(calc(100% - 1.75em)); }
.ky-sutun-adet { color: var(--body-txt-color, inherit); font-family: var(--fmt-mono); font-weight: 800; font-variant-numeric: tabular-nums; }
.ky-sutun-alt { display: flex; align-items: center; gap: 8px; min-height: 1.6em; font-size: clamp(1.1rem, 2vw, 1.6rem); }
.ky-sutun-dogru { color: var(--body-txt-color, inherit); opacity: 0; transform: scale(0.4); }

.ky-ekran[data-grafik] { transition: opacity 200ms ease-out; }
.ky-ekran[data-grafik="0"] { opacity: 0; }
.ky-ekran[data-grafik="0"] * { transition: none; }
.ky-ekran:is([data-grafik="1"], [data-grafik="2"]) .ky-sutun-cubuk { transform: scaleY(var(--oran)); transition: transform 800ms var(--ky-yay); }
.ky-ekran:is([data-grafik="1"], [data-grafik="2"]) .ky-sutun-etiket { transform: translateY(calc((1 - var(--oran)) * 100% - 1.75em)); transition: transform 800ms var(--ky-yay); }
.ky-sutun { transition: opacity 320ms ease-out; }
.ky-ekran[data-grafik="2"] .ky-sutun[data-dogru="0"] { opacity: .38; }
.ky-ekran[data-grafik="2"] .ky-sutun-dogru { opacity: 1; transform: none; transition: opacity 200ms ease-out, transform 450ms var(--ky-yay); }
.ky-ekran[data-grafik] .ky-dagilim li { opacity: 0; transform: translateY(10px); transition: opacity 280ms ease-out 150ms, transform 280ms cubic-bezier(0, 0, 0.2, 1) 150ms, outline-color 300ms; }
.ky-ekran:is([data-grafik="1"], [data-grafik="2"]) .ky-dagilim li { opacity: 1; transform: none; }
.ky-ekran[data-grafik]:not([data-grafik="2"]) .ky-dagilim li[data-dogru="1"] { outline-color: transparent; }
.ky-ekran[data-grafik="2"] .ky-dagilim li[data-dogru="0"] { opacity: .45; }

@media (prefers-reduced-motion: reduce) {
    .ky-ekran[data-grafik] *, .ky-ekran[data-grafik] { transition-property: opacity; transition-duration: 150ms; transition-delay: 0s; }
    .ky-ekran[data-grafik] .ky-dagilim li { transform: none; }
}
.ky-grafik .ky-sutun { background: none; }

.ky-hazirlan-ekran, .ky-oy-sonuc-ekran, .ky-oy-bitis-ekran { place-content: center; justify-items: center; gap: 12px; min-height: 50vh; text-align: center; }
.ky-hazirlan-baslik { font-size: clamp(1.6rem, 4.5vw, 3rem); }
.ky-hazirlan-alt { margin: 0; color: var(--fmt-muted); }
.ky-halka { position: relative; width: clamp(130px, 24vmin, 230px); aspect-ratio: 1; }
.ky-halka svg { display: block; width: 100%; height: 100%; transform: rotate(-90deg); }
.ky-halka circle { fill: none; stroke-width: 8; }
.ky-halka-iz { stroke: var(--fmt-border); }
.ky-halka-dolu { stroke: var(--fmt-accent); stroke-linecap: round; stroke-dasharray: 100; }
.ky-halka-sayi { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--fmt-mono); font-size: clamp(2.4rem, 8vmin, 4.6rem); font-weight: 800; font-variant-numeric: tabular-nums; }

.ky-siralama-ekran { align-content: start; justify-items: center; }
.ky-siralama-baslik { margin: 0; font-size: clamp(1.6rem, 3.6vw, 2.8rem); }
.ky-skor { display: grid; gap: 10px; width: min(100%, 820px); margin: 8px 0 0; padding: 0; list-style: none; }
.ky-skor li { display: grid; grid-template-columns: 2.2em minmax(0, 1fr) auto auto; align-items: center; gap: 14px; min-height: 58px; padding: 8px 18px; border: 1px solid var(--fmt-border-strong); border-radius: var(--fmt-radius); background: var(--fmt-surface); font-size: clamp(1.1rem, 2.2vw, 1.7rem); font-weight: 700; }
.ky-skor li:first-child { border-color: var(--fmt-accent); background: var(--fmt-accent-soft); }
.ky-skor-sira { color: var(--fmt-muted); font-family: var(--fmt-mono); }
.ky-skor-ad { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ky-skor-puan { font-family: var(--fmt-mono); font-variant-numeric: tabular-nums; }
.ky-skor-degisim { font-family: var(--fmt-mono); font-size: .7em; color: var(--fmt-ok); opacity: 0; transition: opacity 300ms ease-out; }
.ky-skor-degisim[data-yon="asagi"] { color: var(--fmt-danger); }
.ky-skor li[data-bitti] .ky-skor-degisim, .ky-oy-sira[data-bitti] .ky-skor-degisim { opacity: 1; }
.ky-siralama-eylem { width: min(100%, 820px); justify-content: flex-end; }

.ky-oy-sonuc-ekran { border-radius: var(--fmt-radius); padding: 24px 16px; }
.ky-oy-sonuc-ekran[data-sonuc="dogru"] { background: var(--fmt-ok-bg); }
.ky-oy-sonuc-ekran[data-sonuc="yanlis"] { background: var(--fmt-danger-bg); }
.ky-oy-sonuc-ikon { display: grid; place-items: center; width: 84px; height: 84px; border-radius: 50%; font-size: 2.2rem; color: var(--body-bg-color, #fff); }
[data-sonuc="dogru"] .ky-oy-sonuc-ikon { background: var(--fmt-ok); }
[data-sonuc="yanlis"] .ky-oy-sonuc-ikon { background: var(--fmt-danger); }
.ky-oy-puan { margin: 0; font-family: var(--fmt-mono); font-size: 1.6rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.ky-oy-sira { display: grid; gap: 4px; margin-top: 12px; }
.ky-oy-sira-satir { display: flex; align-items: baseline; justify-content: center; gap: 8px; margin: 0; font-size: 1.3rem; font-weight: 700; }
.ky-sira-kutu { display: inline-block; overflow: hidden; vertical-align: bottom; }
.ky-sira-sayi { display: inline-block; font-family: var(--fmt-mono); font-size: 2.2rem; font-weight: 800; }
.ky-oy-sira-alt { margin: 0; color: var(--fmt-muted); }

.ky-bitis-ekran { justify-items: center; }
.ky-podyum-baslik { margin: 0; font-size: clamp(1.6rem, 3.6vw, 2.8rem); }
.ky-podyum { display: flex; align-items: flex-end; justify-content: center; gap: clamp(8px, 2vw, 24px); width: min(100%, 760px); --pod-h: clamp(150px, 32vh, 280px); }
.ky-pod { display: grid; justify-items: center; gap: 4px; flex: 1 1 0; min-width: 0; }
.ky-pod-ad { margin: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: clamp(1.1rem, 2.4vw, 1.8rem); font-weight: 800; }
.ky-pod-puan { margin: 0; color: var(--fmt-muted); font-family: var(--fmt-mono); }
.ky-pod-blok { display: grid; place-items: start center; width: 100%; padding-top: 10px; border: 1px solid var(--fmt-border-strong); border-top: 8px solid var(--pod-renk); border-radius: 10px 10px 0 0; background: var(--fmt-surface); font-family: var(--fmt-mono); font-size: clamp(2rem, 5vw, 3.4rem); font-weight: 800; transform-origin: bottom center; }
.ky-pod-1 { --pod-renk: var(--fmt-accent); }
.ky-pod-2 { --pod-renk: var(--fmt-border-strong); }
.ky-pod-3 { --pod-renk: var(--fmt-warn); }
.ky-pod-1 .ky-pod-blok { height: var(--pod-h); }
.ky-pod-2 .ky-pod-blok { height: calc(var(--pod-h) * 0.72); }
.ky-pod-3 .ky-pod-blok { height: calc(var(--pod-h) * 0.52); }
.ky-pod > :is(.ky-pod-ad, .ky-pod-puan) { opacity: 0; transform: translateY(8px); transition: opacity 300ms ease-out 450ms, transform 300ms cubic-bezier(0, 0, 0.2, 1) 450ms; }
.ky-pod .ky-pod-blok { transform: scaleY(0); transition: transform 700ms var(--ky-yay); }
.ky-bitis-ekran[data-podyum] > :not(.ky-podyum, .ky-podyum-baslik) { opacity: 0; transition: opacity 400ms ease-out; }
.ky-bitis-ekran[data-podyum="4"] > :not(.ky-podyum, .ky-podyum-baslik) { opacity: 1; }
.ky-bitis-ekran:is([data-podyum="1"], [data-podyum="2"], [data-podyum="3"], [data-podyum="4"]) .ky-pod-3 > *,
.ky-bitis-ekran:is([data-podyum="2"], [data-podyum="3"], [data-podyum="4"]) .ky-pod-2 > *,
.ky-bitis-ekran:is([data-podyum="3"], [data-podyum="4"]) .ky-pod-1 > * { opacity: 1; transform: none; }

.ky-oy-bitis-sira { margin: 0; font-family: var(--fmt-mono); font-size: clamp(4rem, 20vw, 7rem); font-weight: 800; line-height: 1; }
.ky-oy-bitis-ekran[data-ilk3="1"] .ky-oy-bitis-sira { color: var(--fmt-accent); }
.ky-oy-bitis-ekran .ky-ilk5 { text-align: left; }
.ky-ilk5 li[data-sen] { font-weight: 800; }

@media (prefers-reduced-motion: no-preference) {
    .ky-ekran:is(.ky-hazirlan-ekran, .ky-siralama-ekran, .ky-oy-sonuc-ekran, .ky-oy-bitis-ekran):not([hidden]) { animation: ky-belir 280ms cubic-bezier(0, 0, 0.2, 1) both; }
    .ky-oy-sonuc-ekran:not([hidden]) .ky-oy-sonuc-ikon, .ky-oy-bitis-ekran:not([hidden]) .ky-oy-bitis-sira { animation: ky-belir 520ms var(--ky-yay) both; }
}
@media (prefers-reduced-motion: reduce) {
    .ky-pod .ky-pod-blok, .ky-pod > * { transform: none; transition-property: opacity; transition-duration: 150ms; transition-delay: 0s; }
}

.ky { --giris-egri: cubic-bezier(0.55, 0, 1, 0.45); --yer-egri: cubic-bezier(0.65, 0, 0.35, 1); --acilis-egri: cubic-bezier(0.16, 1, 0.3, 1); }

.ky-host-sec li, .ky-dagilim li, .ky-oy-btn { border: 0; background: currentColor; box-shadow: inset 0 -5px 0 rgba(0, 0, 0, 0.22); }
.ky-host-sec li > *, .ky-dagilim li > *, .ky-oy-btn > * { color: var(--body-bg-color, #fff); }
.ky-oy-btn[aria-pressed="true"] { outline-color: var(--body-txt-color); }
@media (prefers-reduced-motion: no-preference) {
    .ky-oy-btn:active:not(:disabled) { transform: scale(0.96); transition: transform 90ms ease-out; }
}

.ky-ekran[data-faz] :is(.ky-host-metin, .ky-oy-metin) { transform-origin: center center; }
.ky-ekran[data-faz] :is(.ky-host-sec > li, .ky-oy-btn) { clip-path: inset(50% 0 50% 0 round var(--fmt-radius)); }
.ky-ekran[data-faz] :is(.ky-host-sec > li, .ky-oy-btn) > * { opacity: 0; }
.ky-ekran[data-faz] .ky-cubuk { transform: scaleX(0); transform-origin: left center; }

.ky-ekran[data-faz="olcum"] * { transition: none; }
.ky-ekran[data-faz="0"] :is(.ky-host-metin, .ky-oy-metin) {
    clip-path: inset(0 0 100% 0);
    transform: translateY(calc(var(--dy) + 0.5em)) scale(var(--olcek));
    transition: none;
}
.ky-ekran[data-faz="0"] :is(.ky-host-sec > li, .ky-oy-btn, .ky-cubuk), .ky-ekran[data-faz="0"] :is(.ky-host-sec > li, .ky-oy-btn) > * { transition: none; }

.ky-ekran[data-faz="soru"] :is(.ky-host-metin, .ky-oy-metin) {
    clip-path: inset(0 0 0 0);
    transform: translateY(var(--dy)) scale(var(--olcek));
    transition: clip-path 500ms var(--giris-egri), transform 500ms var(--giris-egri);
}

.ky-ekran:is([data-faz="kucul"], [data-faz="cevap"]) :is(.ky-host-metin, .ky-oy-metin) {
    clip-path: inset(0 0 0 0);
    transform: none;
    transition: transform 600ms var(--yer-egri);
}

.ky-ekran[data-faz="cevap"] :is(.ky-host-sec > li, .ky-oy-btn) {
    clip-path: inset(0 0 0 0 round var(--fmt-radius));
    transition: clip-path 420ms var(--acilis-egri);
}
.ky-ekran[data-faz="cevap"] :is(.ky-host-sec > li, .ky-oy-btn) > * { opacity: 1; transition: opacity 240ms ease-out 120ms; }
.ky-ekran[data-faz="cevap"] .ky-cubuk { transform: scaleX(1); transition: transform 420ms var(--acilis-egri); }

@media (prefers-reduced-motion: reduce) {
    .ky-ekran[data-faz] :is(.ky-host-metin, .ky-oy-metin, .ky-host-sec > li, .ky-oy-btn) { clip-path: none; transform: none; }
    .ky-ekran[data-faz] .ky-cubuk { transform: none; }
    .ky-ekran[data-faz="0"] :is(.ky-host-metin, .ky-oy-metin) { opacity: 0; }
    .ky-ekran:not([data-faz="0"]) :is(.ky-host-metin, .ky-oy-metin) { opacity: 1; transition: opacity 150ms; }
}
