/* Fælles udseende for admin-siderne. Farverne står ÉT sted, så en
   VideoGameQuizzle-side ikke kan komme til at ligne Quizzle. */
:root{ --bg:#0E1116; --kort:#171C24; --accent:#4CC2FF; --tekst:#E8EEF5;
       --groen:#5AA86B; --roed:#D8564F; --gul:#EFB55E;
       --daempet:rgba(232,238,245,.58); --linje:rgba(76,194,255,.30); }
/* Gitteret staar ÉT sted. Admin tegnede sine klikfelter som 4 x 4 uanset
   pladen, saa paa en 4 x 5-plade laa felterne forskudt og man skulle
   ramme ved siden af brikken for at vaelge den. Maalt 1. oktober 2026.
   --fh er pladens forhold: bredde delt med hoejde. */
:root{ --kolonner:4; --raekker:5; --fh:0.75; }
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg); color:var(--tekst);
     font-family:"Kumbh Sans",system-ui,Arial,sans-serif;
     padding:22px 24px 70px; max-width:1100px; margin:0 auto}
h1{font-family:"Yeseva One",Georgia,serif; font-weight:400; font-size:1.55rem}
h1 span{color:var(--accent)}
h2{font-family:"Yeseva One",Georgia,serif; font-weight:400; font-size:1.1rem;
   margin:34px 0 10px}
.sub{color:var(--daempet); font-size:.85rem; line-height:1.6; margin:5px 0 18px; max-width:66ch}
.bar{display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:18px}
.knap{font-family:inherit; font-size:.73rem; font-weight:700; text-transform:uppercase;
      letter-spacing:.06em; padding:9px 17px; border-radius:999px;
      border:1px solid var(--accent); background:transparent; color:var(--tekst);
      cursor:pointer; text-decoration:none; display:inline-block}
.knap.ja{background:var(--accent); color:#06202C}
.knap:disabled{opacity:.35; cursor:not-allowed}
input,select{font-family:inherit; font-size:.95rem; padding:10px 15px;
  border-radius:999px; border:1px solid var(--linje); background:var(--kort); color:var(--tekst)}
input:focus,select:focus{outline:none; border-color:var(--accent)}
.kort{background:var(--kort); border:1px solid var(--linje); border-radius:14px; padding:18px 20px}
.rul{overflow-x:auto; border:1px solid var(--linje); border-radius:12px; background:var(--kort)}
table{border-collapse:collapse; width:100%; font-size:.88rem}
th,td{text-align:left; padding:8px 13px; border-bottom:1px solid var(--linje); vertical-align:baseline}
th{font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; color:var(--daempet); font-weight:600}
tr:last-child td{border-bottom:0}
td.t,th.t{text-align:right; font-variant-numeric:tabular-nums}
.tal{display:flex; flex-wrap:wrap; gap:10px}
.tal div{background:var(--kort); border:1px solid var(--linje); border-radius:12px;
         padding:12px 16px; min-width:120px}
.tal b{display:block; font-family:"Yeseva One",Georgia,serif; font-weight:400;
       font-size:1.7rem; line-height:1.1; color:var(--accent); font-variant-numeric:tabular-nums}
.tal span{font-size:.68rem; text-transform:uppercase; letter-spacing:.09em; color:var(--daempet)}
.tom{color:var(--daempet); font-size:.87rem; line-height:1.7}
.besked{margin-top:12px; font-size:.87rem; min-height:1.2em}
.besked.fejl{color:var(--roed)} .besked.ok{color:var(--groen)}
code{font-family:ui-monospace,Menlo,monospace; font-size:.85em;
     background:rgba(76,194,255,.12); padding:1px 6px; border-radius:5px}

/* Pladen som varmekort. Bruges af statistikken og af link-byggeren, og
   tegnes af varmekort.js, saa de to ikke kan komme til at goere det
   forskelligt. Brikkerne er pladens EGNE masker - ikke firkanter. */
.varmekort{position:relative; width:min(94vw,340px); margin-top:12px;
  aspect-ratio:var(--vk-fh,var(--fh))}
.vkbrikker,.vktal-lag{position:absolute; inset:0}
.vkbrik{position:absolute; inset:0;
  -webkit-mask-size:100% 100%; mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat}
.vktal-lag{display:grid;
  grid-template-columns:repeat(var(--vk-kol),1fr);
  grid-template-rows:repeat(var(--vk-raek),1fr);
  pointer-events:none}
.vktal{display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:1px; text-align:center}
.vktal b{font-family:"Yeseva One",Georgia,serif; font-weight:400;
  font-size:clamp(.95rem,4.2vw,1.25rem); font-variant-numeric:tabular-nums}
.vktal span{font-size:.58rem; letter-spacing:.06em; text-transform:uppercase;
  opacity:.72}