/* Jamb: dice, the throw button and the four column sheet, in the site's Ćilim tokens. Kept dice wear a saffron
   frame, cells you may write in are cream with the score that would go there, written cells are indigo text. */
.jb-page{padding-bottom:40px}
.jb-head{padding:26px 0 6px;text-align:center}
.jb-head h1{font-size:clamp(26px,3.4vw,42px);letter-spacing:-.03em;color:var(--indigo);margin-top:10px}
.jb-head p{margin:10px auto 0;max-width:640px;color:var(--ink-2);font-size:17px}
.jb-head .crumbs{justify-content:center}
.jb{max-width:640px;margin:14px auto 0;padding:18px 14px 18px;background:var(--card);box-shadow:inset 0 0 0 2px var(--rim-soft);position:relative}
.jb::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:var(--zig)}
.jb-play{position:sticky;top:0;z-index:4;margin:2px -14px 0;padding:12px 14px 12px;background:var(--card);border-bottom:2px solid var(--rim-soft)}
.jb-dice{display:flex;justify-content:center;gap:10px}
.jb-die{--s:clamp(48px,13vw,60px);position:relative;display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);place-items:center;inline-size:var(--s);block-size:var(--s);padding:7px;border:0;background:var(--cream);box-shadow:inset 0 0 0 2px var(--indigo),0 4px 0 var(--rim);cursor:pointer;touch-action:manipulation}
.jb-die:disabled{cursor:default}
.jb-die[aria-pressed="true"]{background:var(--saffron);box-shadow:inset 0 0 0 3px var(--red),0 4px 0 var(--red-deep);transform:translateY(2px)}
.jb-die i{inline-size:calc(var(--s) * .17);block-size:calc(var(--s) * .17);border-radius:50%;background:var(--indigo);visibility:hidden}
.jb-die i:nth-child(1){grid-area:1/1}.jb-die i:nth-child(2){grid-area:1/3}.jb-die i:nth-child(3){grid-area:2/1}.jb-die i:nth-child(4){grid-area:2/2}.jb-die i:nth-child(5){grid-area:2/3}.jb-die i:nth-child(6){grid-area:3/1}.jb-die i:nth-child(7){grid-area:3/3}
.jb-die[data-v="1"] i:nth-child(4),
.jb-die[data-v="2"] i:nth-child(2),.jb-die[data-v="2"] i:nth-child(6),
.jb-die[data-v="3"] i:nth-child(2),.jb-die[data-v="3"] i:nth-child(4),.jb-die[data-v="3"] i:nth-child(6),
.jb-die[data-v="4"] i:nth-child(1),.jb-die[data-v="4"] i:nth-child(2),.jb-die[data-v="4"] i:nth-child(6),.jb-die[data-v="4"] i:nth-child(7),
.jb-die[data-v="5"] i:nth-child(1),.jb-die[data-v="5"] i:nth-child(2),.jb-die[data-v="5"] i:nth-child(4),.jb-die[data-v="5"] i:nth-child(6),.jb-die[data-v="5"] i:nth-child(7),
.jb-die[data-v="6"] i:not(:nth-child(4)){visibility:visible}
.jb-die[aria-pressed="true"] i{background:var(--red-deep)}
.jb-die.is-roll{animation:jb-roll .35s}
@keyframes jb-roll{30%{transform:rotate(-14deg) scale(.92)}70%{transform:rotate(10deg)}}
.jb-throwrow{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 16px;margin-top:12px}
.jb-throwrow .btn{min-height:48px;padding:0 26px;font-size:14px}
.jb-throws{font-size:15px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.jb-status{min-height:48px;margin-top:10px;font-size:15px;color:var(--ink-2);text-align:center}
.jb-die:focus-visible,.jb-cell:focus-visible,.jb-tool:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.jb-sheet{inline-size:100%;margin-top:14px;border-collapse:collapse;table-layout:fixed;font-variant-numeric:tabular-nums}
.jb-sheet th,.jb-sheet td{border:1px solid var(--rim-soft);padding:0;text-align:center}
.jb-sheet thead th{padding:8px 2px;background:var(--indigo);color:var(--cream);font:700 13px/1.15 var(--text)}
.jb-sheet thead th span{display:block;font-size:16px}
.jb-sheet thead th:first-child{inline-size:30%}
.jb-sheet tbody th{padding:0 8px;text-align:start;font-size:15px;font-weight:600;background:var(--wool)}
.jb-sheet tbody th small{display:block;font-size:12px;font-weight:400;color:var(--ink-2)}
.jb-cell{inline-size:100%;min-block-size:44px;block-size:44px;border:0;background:transparent;color:var(--indigo);font:700 16px/1 var(--text);cursor:pointer}
.jb-cell:disabled{cursor:default}
.jb-cell[data-state="open"]{background:var(--cream);color:var(--ink-3);box-shadow:inset 0 0 0 2px var(--olive)}
.jb-cell[data-state="open"]:hover{background:#fff;color:var(--ink)}
.jb-cell[data-state="announced"]{background:var(--saffron);color:var(--indigo);box-shadow:inset 0 0 0 3px var(--red)}
.jb-cell[data-state="filled"]{color:var(--indigo);font-weight:800}
.jb-sheet .jb-sum th,.jb-sheet .jb-sum td{background:var(--wool);font-weight:700;block-size:40px;font-size:15px}
.jb-sheet .jb-sum--all th,.jb-sheet .jb-sum--all td{background:var(--indigo);color:var(--cream);font-size:16px}
.jb-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-top:14px}
.jb-score{font-size:15px;color:var(--ink-2)}
.jb-score b{font:800 22px/1 var(--display);color:var(--indigo);margin-inline:4px}
.jb-tool{min-height:44px;padding:0 16px;border:2px solid var(--indigo);background:transparent;color:var(--indigo);font:600 15px/1 var(--text);cursor:pointer}
.jb-noscript{margin-top:12px;padding:12px;background:var(--wool);text-align:center}
.jb-dialog{max-inline-size:min(440px,calc(100vw - 32px));inline-size:100%;padding:26px 22px 22px;border:0;background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 2px var(--rim-soft),0 30px 60px -20px rgba(42,28,20,.6)}
.jb-dialog::backdrop{background:rgba(26,39,71,.55)}
.jb-dialog h2{font-size:22px;color:var(--indigo);padding-inline-end:40px}
.jb-dialog p{margin-top:10px;color:var(--ink-2);font-size:16px}
.jb-x{position:absolute;inset-block-start:10px;inset-inline-end:10px;inline-size:44px;block-size:44px;border:0;background:transparent;font-size:28px;line-height:1;color:var(--ink);cursor:pointer}
.jb-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:16px;text-align:center}
.jb-nums b{display:block;font:800 26px/1.1 var(--display);color:var(--indigo)}
.jb-nums span{font-size:13px;color:var(--ink-2)}
.jb-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.jb-actions .btn{padding:0 24px;font-size:14px}
.jb-info{max-inline-size:880px;margin:34px auto 0}
.jb-info h2{font-size:clamp(22px,2.6vw,30px);color:var(--indigo);margin-top:30px}
.jb-info h2:first-child{margin-top:0}
.jb-info p,.jb-info li{margin-top:12px;color:var(--ink-2);font-size:17px;line-height:1.6}
.jb-info ul{padding-inline-start:22px}
.jb-info table{inline-size:100%;margin-top:14px;border-collapse:collapse;font-size:16px}
.jb-info th,.jb-info td{padding:10px 12px;border-bottom:1px solid var(--rim-soft);text-align:start;color:var(--ink)}
.jb-info thead th{background:var(--wool)}
.jb-info a{color:var(--red);font-weight:600}
@media (max-width:600px){.jb{margin-inline:calc(-1 * var(--gutter));padding-inline:6px}.jb-play{margin-inline:-6px;padding-inline:6px}.jb-dice{gap:6px}.jb-sheet thead th{font-size:11.5px}.jb-sheet thead th span{font-size:15px}.jb-sheet tbody th{padding:0 6px;font-size:14px}.jb-page{padding-bottom:110px}.jb-head{padding-top:6px}.jb-head .kicker{display:none}}
@media (prefers-reduced-motion:reduce){.jb-die{animation:none!important;transition:none!important}}