:root{color-scheme:dark;font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
html:root[data-kit-motyw=ciemny]{--kit-tlo:#120c0a;--kit-tlo2:#2a1e17;--kit-tlo3:#3a2a1f;--kit-tekst:#f6ead5;--kit-tekst2:#d6c3a3;--kit-tekst3:#a8957a;--kit-akcent:#e2c27f;--kit-akcent2:#b0823f;--kit-linia:#c9a46a40}
html:root[data-kit-motyw=jasny]{--kit-tlo:#efe6d6;--kit-tlo2:#fbf6ec;--kit-tlo3:#efe3cc;--kit-tekst:#2b2016;--kit-tekst2:#5a4a38;--kit-tekst3:#7d6a54;--kit-akcent:#9a6a26;--kit-akcent2:#7a4f18;--kit-linia:#8a6a3c40}
/* the kit panels (menu, results) take the walnut and brass of the table, as in Domino */
html[data-kit-motyw=jasny] body{background:#cfc3b2}
html[data-kit-motyw=jasny] body .kit-warstwa--swiat{--kit-tlo2:#fbf6ec;--kit-tlo3:#efe3cc;--kit-tekst:#2b2016;--kit-tekst2:#5a4a38;--kit-tekst3:#7d6a54;--kit-linia:#8a6a3c40;background:linear-gradient(to bottom,#2b201626,#2b201640)}
html[data-kit-motyw=ciemny] body .kit-warstwa--swiat{--kit-tlo2:#2a1e17;--kit-tlo3:#3a2a1f;--kit-tekst:#f6ead5;--kit-tekst2:#d6c3a3;--kit-linia:#c9a46a40}
body{margin:0;background:#120c0a}
body .kit-toast{bottom:calc(120px + var(--kit-safe-dol,0px));border-radius:12px;max-width:calc(100% - 32px);width:max-content;pointer-events:none}
.kit-tytul{font-family:Georgia,'Times New Roman',serif!important;font-weight:500!important;letter-spacing:-.03em!important}
.kit-karta{border-color:#c9a46a55!important}
.kit-btn--glowny{background:linear-gradient(135deg,#ecd29a,#b98b45)!important;color:#22170e!important}
.ludo-gl{position:absolute;inset:0;display:block;touch-action:none;user-select:none;-webkit-user-select:none;outline:none}

/* seats: one chip per colour, the one on turn lifted with a gold ring */
.lr-seats{position:fixed;top:calc(10px + var(--kit-safe-gora,0px));left:calc(62px + var(--kit-safe-lewo,0px));right:calc(62px + var(--kit-safe-prawo,0px));display:flex;flex-wrap:wrap;justify-content:center;gap:8px;z-index:9;pointer-events:none}
.lr-seats[hidden]{display:none}
.lr-seat{display:flex;align-items:center;gap:8px;padding:7px 12px 7px 9px;border-radius:999px;background:linear-gradient(180deg,#2a1d16f2,#1a120ef2);border:1px solid #c9a46a40;color:#f6ead5;box-shadow:0 6px 18px #0008;transition:transform .25s,box-shadow .25s}
.lr-seat b{font-weight:650;font-size:14px;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lr-seat small{font-variant-numeric:tabular-nums;font-size:12px;font-weight:700;color:#1f150e;background:linear-gradient(135deg,#ecd29a,#b98b45);border-radius:999px;padding:2px 7px}
.lr-dot{width:16px;height:16px;border-radius:50%;box-shadow:inset 0 -2px 3px #0007,0 1px 2px #000a}
.lr-seat--red .lr-dot{background:radial-gradient(circle at 35% 30%,#ff8c84,#9a1720 65%)}
.lr-seat--green .lr-dot{background:radial-gradient(circle at 35% 30%,#7ff0be,#0d6a48 65%)}
.lr-seat--gold .lr-dot{background:radial-gradient(circle at 35% 30%,#ffe7a0,#c08a17 65%)}
.lr-seat--blue .lr-dot{background:radial-gradient(circle at 35% 30%,#a8c8ff,#173f92 65%)}
.lr-seat--on{border-color:#e2c27f;box-shadow:0 0 0 2px #e2c27f,0 8px 26px #e2c27f40;transform:translateY(2px)}
.lr-seat--won{border-color:#ffe2a8;box-shadow:0 0 0 2px #ffe2a8,0 0 30px #ffd06a80}

/* tray (20.10.2026): reactions on the left, what to do now in the middle, the hint and the round die button under the
   right thumb. Smaller than before so the board keeps the screen. */
.lr-tray{position:fixed;bottom:calc(12px + var(--kit-safe-dol,0px));left:calc(12px + var(--kit-safe-lewo,0px));right:calc(12px + var(--kit-safe-prawo,0px));display:flex;align-items:flex-end;gap:10px;z-index:11;pointer-events:none}
.lr-tray[hidden]{display:none}
.lr-status{flex:1;min-width:0;margin:0 0 10px;text-align:center;font-size:14px;font-weight:550;line-height:1.3;color:#f6ead5;background:#160f0cd9;border:1px solid #c9a46a33;border-radius:999px;padding:7px 12px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lr-roll{pointer-events:auto;appearance:none;display:grid;place-items:center;width:76px;height:76px;flex:none;border-radius:50%;border:0;padding:0;background:radial-gradient(circle at 35% 30%,#fff1c8,#e0b765 55%,#a8762f);box-shadow:0 0 0 3px #1a120ecc,0 0 0 4px #e2c27f99,0 10px 24px #000b,inset 0 1px 0 #fff8e0;cursor:pointer;transition:transform .15s,opacity .2s,filter .2s}
.lr-roll svg{width:46px;height:46px}
.lr-roll svg rect{fill:#f7efdd;stroke:#7a5524;stroke-width:4}
.lr-roll svg circle{fill:#1b1410}
.lr-roll:disabled{filter:grayscale(.6) brightness(.7);opacity:.7;cursor:default}
.lr-roll--ready{animation:lr-puls 1.5s ease-in-out infinite}
.lr-roll:active{transform:scale(.95)}
.lr-roll:focus-visible,.lr-tool:focus-visible{outline:3px solid var(--kit-akcent);outline-offset:3px}
@keyframes lr-puls{50%{transform:scale(1.06);box-shadow:0 0 0 3px #1a120ecc,0 0 0 5px #ffe2a8,0 0 34px #ffb34799,0 10px 24px #000b}}
.lr-tool{pointer-events:auto;appearance:none;display:grid;place-items:center;width:46px;height:46px;flex:none;margin-bottom:15px;border-radius:50%;border:1px solid #c9a46a55;background:linear-gradient(180deg,#2a1d16f0,#1a120ef0);box-shadow:0 6px 16px #0009;cursor:pointer;font-size:22px;line-height:1}
.lr-tool svg{width:22px;height:22px;fill:none;stroke:#e2c27f;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.lr-tool:disabled{opacity:.4;cursor:default}
.lr-tool[hidden]{display:none}
.lr-seat{position:relative}
/* the emoji strip: always on screen, above the tray, left of the die so the thumb never hits it by accident */
.lr-reactbar{position:fixed;z-index:11;left:calc(10px + var(--kit-safe-lewo,0px));right:calc(100px + var(--kit-safe-prawo,0px));bottom:calc(66px + var(--kit-safe-dol,0px));display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;padding:4px;border-radius:999px;background:#1a120ecc;border:1px solid #c9a46a40;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);width:max-content;max-width:calc(100% - 110px)}
.lr-reactbar::-webkit-scrollbar{display:none}
.lr-reactbar[hidden]{display:none}
.lr-reactbar button{appearance:none;flex:none;display:grid;place-items:center;border:0;background:none;width:38px;height:38px;border-radius:50%;cursor:pointer;padding:0;transition:transform .12s}
.lr-reactbar button img{width:28px;height:28px;pointer-events:none}
.lr-reactbar button:hover{transform:scale(1.18)}
.lr-reactbar button:active{transform:scale(.9)}
.lr-reactbar button:focus-visible{outline:2px solid var(--kit-akcent)}
.lr-bubble{position:absolute;left:50%;top:100%;width:40px;height:40px;margin-left:-20px;pointer-events:none;filter:drop-shadow(0 4px 8px #000a);animation:lr-lot 2.2s cubic-bezier(.2,.7,.3,1) both}
@keyframes lr-lot{0%{opacity:0;transform:translate(0,0) scale(.3)}12%{opacity:1;transform:translate(calc(var(--dx,0px)*.3),18px) scale(1.15)}70%{opacity:1}100%{opacity:0;transform:translate(var(--dx,0px),110px) scale(.9)}}
@media (prefers-reduced-motion:reduce){.lr-bubble{animation-duration:1.2s}}
.lr-roll{position:relative}
.lr-roll kbd{position:absolute;bottom:-9px;left:50%;transform:translateX(-50%);font:700 10px/1 system-ui;letter-spacing:.04em;text-transform:uppercase;color:#f6ead5;background:#1a120ef2;border:1px solid #c9a46a77;border-radius:6px;padding:3px 6px;white-space:nowrap}
.lr-coach{position:fixed;left:50%;bottom:calc(112px + var(--kit-safe-dol,0px));transform:translateX(-50%);z-index:12;width:min(440px,calc(100% - 32px));box-sizing:border-box;padding:14px 16px;border-radius:16px;background:linear-gradient(180deg,#2a1d16f7,#1a120ef7);border:1px solid #e2c27f88;box-shadow:0 14px 34px #000c;color:#f6ead5;animation:lr-wejscie .3s ease both}
.lr-coach[hidden]{display:none}
.lr-coach b{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#e2c27f;margin-bottom:6px}
.lr-coach p{margin:0 0 12px;font-size:15px;line-height:1.45}
.lr-coach .kit-btn{width:auto;min-height:40px;padding:8px 18px}
@keyframes lr-wejscie{from{opacity:0;transform:translate(-50%,10px)}}
.lr-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* setup and settings */
.lr-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
.lr-chip input{position:absolute;opacity:0;pointer-events:none}
.lr-chip span{display:inline-block;padding:9px 14px;border-radius:999px;border:1px solid var(--kit-linia);color:var(--kit-tekst2);cursor:pointer;font-weight:600}
.lr-chip input:checked+span{background:#3a2a1f;color:var(--kit-tekst);border-color:var(--kit-akcent)}
.lr-chip input:focus-visible+span{outline:3px solid var(--kit-akcent);outline-offset:2px}
html[data-kit-motyw=jasny] .lr-chip input:checked+span{background:#f3e2c1}
.lr-field{border:0;margin:0 0 10px;padding:0}
.lr-field[hidden]{display:none}
.lr-field legend{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--kit-tekst3);margin-bottom:6px;padding:0}
.lr-desc{margin:0 0 12px;color:var(--kit-tekst2);font-size:14px;line-height:1.4}
.lr-check{display:flex;gap:10px;align-items:center;margin:4px 0 12px;color:var(--kit-tekst2);font-size:14px}
.lr-rules{margin:0 0 14px;padding-left:20px;color:var(--kit-tekst2);line-height:1.45;font-size:14px}
.lr-rules li{margin-bottom:6px}
/* a phone keeps the four seats in two rows of two, so the board keeps the screen */
@media (max-width:520px){.lr-seats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;left:calc(8px + var(--kit-safe-lewo,0px));right:calc(58px + var(--kit-safe-prawo,0px))}.lr-seat{padding:5px 9px 5px 6px;gap:6px;min-width:0}.lr-seat b{font-size:12.5px;max-width:none;flex:1;min-width:0}.lr-dot{width:13px;height:13px;flex:none}.lr-seat small{font-size:11px;padding:1px 6px}}
@media (prefers-reduced-motion:reduce){.lr-roll--ready{animation:none}}
