/* Draw Dominoes: računari gore, kost, linija kao zmija sa metama na krajevima, ruka. Domina iz domino.css. */
.is-game .felt.draw-dominoes{touch-action:manipulation;-webkit-user-select:none;user-select:none}
.ddboard{position:absolute;inset:0;isolation:isolate;touch-action:manipulation}
.ddboard .dom{touch-action:manipulation;transition:transform .38s cubic-bezier(.3,.7,.3,1),width .3s,height .3s,opacity .25s;will-change:transform}
.ddboard .dom.gone{opacity:0;pointer-events:none;transition:opacity .2s}
.ddboard .dom.mine{cursor:pointer;border-radius:8px}
.ddboard .dom.mine:focus-visible{outline:3px solid var(--brass-hi);outline-offset:2px}
.ddboard .dom.legal svg{filter:drop-shadow(0 0 0 rgba(0,0,0,0)) drop-shadow(0 0 4px rgba(240,212,145,.95)) drop-shadow(0 5px 8px rgba(0,0,0,.3))}
.ddboard .dom.dim{filter:brightness(.9) saturate(.8)}
.ddboard .dom.sel svg{filter:drop-shadow(0 0 0 3px var(--brass-hi)) drop-shadow(0 0 6px #f0d491) drop-shadow(0 12px 14px rgba(0,0,0,.45))}
.ddboard .dom.hint{border-radius:9px;box-shadow:0 0 0 3px #ffe39a,0 0 18px 4px rgba(255,227,154,.75);filter:none}
.ddboard .dom.last .dbody{stroke:var(--brass-hi);stroke-width:5}
.ddboard .dom.nope{animation:ddnope .32s}
@keyframes ddnope{25%{margin-left:-6px}75%{margin-left:6px}}
.ddboard .ddfly{pointer-events:none;transition:transform .24s ease-in}
/* računari gore */
.ddplate{position:absolute;left:0;top:0;z-index:5;display:flex;align-items:center;gap:8px;padding:4px 12px;border-radius:22px;
  background:rgba(20,10,4,.72);border:1px solid rgba(212,176,106,.3);box-shadow:0 6px 14px rgba(0,0,0,.35);color:var(--cream);font:inherit;font-size:14px;cursor:pointer;text-align:left;white-space:nowrap;overflow:hidden}
.ddplate[hidden]{display:none}
.ddplate .ddname{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.ddplate b{font:700 15px var(--sans)}
.ddplate small{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--cream-3)}
.ddplate .ddbacks{display:flex;margin-left:auto;padding-left:4px}
.ddplate .ddbacks svg{width:13px;height:26px;margin-left:-3px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.4))}
.ddplate .ddbacks .dback{fill:#6d1f1c;stroke:#3d0f0d;stroke-width:4}
.ddplate .ddbacks .dnail{fill:#c39a4b}
.ddplate .ddcnt{min-width:30px;text-align:center;padding:2px 8px;border-radius:12px;background:rgba(255,255,255,.12);font:800 15px var(--sans);font-variant-numeric:tabular-nums}
.ddplate .ddbacks:empty+.ddcnt{margin-left:auto}
.ddplate.turn{border-color:var(--brass-hi);box-shadow:0 0 0 3px rgba(240,212,145,.25),0 6px 14px rgba(0,0,0,.35)}
/* kost */
.ddbone{position:absolute;left:0;top:0;z-index:5;display:flex;align-items:center;justify-content:center;gap:7px;padding:4px 10px;border-radius:22px;
  background:rgba(20,10,4,.5);border:1px dashed rgba(212,176,106,.4);color:var(--cream);font:inherit;cursor:pointer}
.ddbone svg{width:16px;height:32px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.45))}
.ddbone .dback{fill:#6d1f1c;stroke:#3d0f0d;stroke-width:4}
.ddbone .dnail{fill:#c39a4b}
.ddbone b{font:800 17px var(--sans);font-variant-numeric:tabular-nums;color:#fff3d6}
.ddbone small{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--cream-3)}
.ddbone.empty svg{opacity:.35}
/* mete na krajevima linije: broj koji treba */
.ddtgt{position:absolute;left:0;top:0;z-index:40;display:grid;place-items:center;min-width:24px;min-height:24px;border-radius:8px;border:2px dashed rgba(240,212,145,.3);background:transparent;
  color:rgba(255,243,214,.6);font:800 15px var(--sans);padding:0;cursor:help}
.ddtgt[hidden]{display:none}
.ddtgt.on{cursor:pointer;border:2px solid var(--brass-hi);background:rgba(240,212,145,.22);color:#fff3d6;box-shadow:0 0 0 4px rgba(240,212,145,.2),0 0 18px rgba(240,212,145,.5);animation:ddpulse 1.2s ease-in-out infinite}
.ddtgt.hint{box-shadow:0 0 0 4px #ffe39a,0 0 22px #ffe39a}
@keyframes ddpulse{50%{background:rgba(240,212,145,.36)}}
/* natpis iznad ruke */
.ddbanner{position:absolute;left:50%;transform:translate(-50%,0);z-index:60;pointer-events:none;opacity:0;transition:opacity .25s;
  font:italic 700 clamp(18px,2.2vw,24px)/1.2 var(--serif);color:#fff3d6;text-shadow:0 2px 10px rgba(0,0,0,.6);text-align:center;white-space:nowrap}
.ddbanner.on{opacity:1}
.ddbanner span{font:800 14px var(--sans);font-style:normal;padding:3px 9px;border-radius:10px;background:rgba(0,0,0,.35);margin-left:6px;vertical-align:3px}
/* tabele u lampi: ruke na kraju i rezultat */
.ddtablewrap{max-height:46vh;overflow:auto}
.ddtable{width:100%;border-collapse:collapse;margin:6px 0 4px;font-variant-numeric:tabular-nums}
.ddtable th,.ddtable td{padding:7px 6px;text-align:center;border-bottom:1px solid rgba(212,176,106,.2)}
.ddtable tbody th,.ddtable tfoot th:first-child{text-align:left;font-weight:600;color:var(--cream-3);white-space:nowrap}
.ddtable tbody th small{font-size:13px;color:var(--brass-hi);font-weight:800}
.ddtable tr.me th,.ddtable tr.me td{color:#fff3d6;font-weight:700}
.ddtable td.won{color:var(--brass-hi);font-weight:800}
.ddtable thead th{font-size:13px;color:var(--brass-hi)}
.ddtable tfoot th{font-size:17px;border-bottom:0}
.ddmini{display:inline-flex;flex-wrap:wrap;gap:3px;justify-content:center;max-width:220px}
.ddmini svg{width:34px;height:17px}
.ddmini .dbody{fill:#fbf5e6;stroke:#d2c39f;stroke-width:3}
.ddmini .dline line{stroke:#a39370;stroke-width:4}
.ddmini .dnail{fill:#c39a4b}
.ddmini.none{font-size:13px;color:var(--cream-3)}
#b-draw.hint{box-shadow:0 0 0 3px var(--brass-hi)}
/* telefon i uzan sto (layout() pali .small) */
.ddboard.small .ddplate{gap:5px;padding:2px 8px;border-radius:14px}
.ddboard.small .ddplate b{font-size:13px}
.ddboard.small .ddplate .ddcnt{min-width:26px;font-size:13px;padding:1px 6px}
.ddboard.small .ddbone{gap:4px;padding:2px 6px;border-radius:14px}
.ddboard.small .ddbone svg{width:12px;height:24px}
.ddboard.small .ddbone b{font-size:15px}
.ddboard.small .ddbone small{font-size:10px;letter-spacing:.02em}
.ddboard.small .ddtgt{font-size:13px}
@media (max-width:640px){
  .ddbanner{font-size:16px;white-space:normal;width:94%}
  .ddbanner span{font-size:12px}
  .ddmini svg{width:28px;height:14px}
}
/* poruka ide gore: dole je ruka */
.toast{bottom:auto;top:calc(var(--bar) + 76px);transform:translate(-50%,-20px)}
.toast.on{transform:translate(-50%,0)}
/* uska pločica računara (troje na 320 px): ime iznad broja */
.ddboard .ddplate.narrow{flex-direction:column;justify-content:center;align-items:center;gap:1px;padding:2px 4px}
.ddboard .ddplate.narrow b{font-size:12px}
.ddboard .ddplate.narrow .ddcnt{margin-left:0;min-width:0;padding:0 6px;font-size:12px;line-height:16px}
