/* Spilskallet for de selvstændige kabaler (kort-skal.js, 22.10), samme udseende som Pyramide og motor-kabalerne */
g.daekket use{visibility:hidden}
body{color:var(--creme);font:400 15px/1.4 Poppins,system-ui,sans-serif}
#kk-bar{align-items:center;flex-wrap:nowrap}
#kk-bar #dagens[aria-pressed="true"]{background:var(--creme);color:var(--bjaelke)}
#info{flex:none;display:flex;align-items:center;flex-wrap:wrap;gap:4px 14px;padding:2px 10px;min-height:44px;background:rgba(0,0,0,.16)}
#info b{font-weight:600;font-variant-numeric:tabular-nums}
#status{font-weight:600;color:#FFD27A}
#status:empty{display:none}
#info button{font:600 15px/1.2 Poppins,system-ui,sans-serif;min-height:40px;padding:0 12px;border:1px solid rgba(252,247,238,.22);border-radius:8px;background:var(--knap);color:var(--creme);cursor:pointer}
#info button.sk-link{min-height:44px;padding:0 6px;border:0;background:transparent;text-decoration:underline;text-underline-offset:3px;font-weight:400}
#braet{position:relative;flex:1 1 auto;min-height:0;display:flex}
#baize{flex:1 1 auto}
#pad{flex:none;display:flex;justify-content:center;gap:10px;padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));background:var(--bjaelke)}
#pad button{font:600 16px/1.2 Poppins,system-ui,sans-serif;min-height:48px;min-width:96px;padding:0 14px;border:1px solid rgba(252,247,238,.22);border-radius:8px;background:var(--knap);color:var(--creme);cursor:pointer;touch-action:manipulation}
#pad button:disabled{opacity:.45;cursor:default}
:is(#pad,#info,#kk-besked,#kk-bar) button:focus-visible{outline:3px solid var(--creme);outline-offset:2px}
#kk-besked{bottom:76px;display:none;align-items:center;flex-wrap:wrap;justify-content:center;gap:8px 12px;box-sizing:border-box;max-width:calc(100vw - 24px)}
#kk-besked.vis{display:flex}
#kk-besked{pointer-events:none}#kk-besked button{pointer-events:auto}
#kk-besked button{margin:0}
g[data-kort]:focus{outline:none}
g[data-kort]:focus-visible rect{stroke:#FFD54A;stroke-width:4}
g.sk-tip rect,rect.sk-tip{stroke:#FFD54A !important;stroke-width:6px !important;animation:sk-tip .9s ease-in-out 3}
@keyframes sk-tip{50%{stroke-opacity:.3}}
@media (prefers-reduced-motion:reduce){g.sk-tip rect,rect.sk-tip{animation:none}}
html.kabale-hk :is(#pad,#info,#kk-besked) button{border:2px solid var(--creme)!important}
html[data-ts="1"] #pad{zoom:1.12} html[data-ts="2"] #pad{zoom:1.25}
@media (max-height:600px) and (max-width:639px){#info{display:none}#pad{padding-top:4px;padding-bottom:4px}#pad button{min-height:44px}}
@media (max-width:420px){#pad button{flex:1 1 0;min-width:0;padding:0 8px}#info{font-size:14px;gap:2px 10px}#kk-bar{gap:5px;padding:6px}#kk-bar>button{padding:0 8px}}
@media (orientation:landscape) and (max-height:520px) and (min-width:640px){
  body{display:grid;grid-template-columns:minmax(0,1fr) 132px;grid-template-rows:auto auto minmax(0,1fr)}
  #kk-bar{grid-column:1/3}#braet{grid-column:1;grid-row:2/4}
  #info{grid-column:2;grid-row:2;flex-direction:column;align-items:stretch;padding:6px 8px;gap:2px}
  #pad{grid-column:2;grid-row:3;flex-direction:column;justify-content:flex-start;padding:6px 8px}#pad button{min-width:0}
  #kk-besked{bottom:12px}
}
#pad button.sk-tip{outline:3px solid #FFD54A;outline-offset:2px}
