/* PAPPERSKORTET — scorekortets stil, delad av bollens kort (oversikt.html)
   och ditt eget kort i analysens Hålen (analys.html). Ritningen bor i
   scorekort.js; se dess filhuvud för varför kortet finns på ett ställe.

   Länkas EFTER sidans egen stil. Analysen har allmänna regler för th och td
   (den långa vyns hålstabell), och `th:first-child` har samma specificitet
   som `.sk th`: ordningen är det som låter kortets regler vinna. I
   oversikt.html finns inga sådana krockar, så där är ordningen likgiltig. */

/* ---------- scorekortet: HÖJDLED och PAPPER ----------
   Vänt till höjdled 2026-08-19 och gjort vitt samma dag (grundarens riktning:
   "old school papper"). Kortet är därför den enda ytan i appen som INTE bär
   mörka temat — färgerna nedan är egna literaler med flit och ska inte bytas
   mot --ink/--card/--line, som alla är ljusa toner avsedda för mörk botten.

   Vänsterblocket (hål/längd/par/idx) är sticky: med fler än tre spelare
   scrollar deras kolumner i sidled medan hålraden står kvar. */
/* Vit kant 5 px till tabellen upptill OCH i sidled. Toppen låg på 14 och gav
   ett vitt band ovanför rubrikraden som inget annat höll sällskap.

   Talen 4 och 6 ser omaka ut men ger samma resultat, och det är det synliga
   som räknas: .scroll bär `margin:0 -2px`, så SIDORNA ger tillbaka 2 px av
   sin padding till tabellen (1 ram + 6 − 2 = 5) medan toppen inte gör det
   (1 ram + 4 = 5). Den negativa sidomarginalen är värd att behålla — den är
   2 px scorekort på en skärm där varje pixel redan är utkämpad — så det är
   toppen som får ge efter. Ändras det ena måste det andra följa med.

   Nedtill står 12 px kvar, och det är inte slarv: där under tabellen ligger
   mot-par-raden och spelformsväljaren, alltså text som behöver luft mot
   ramen på ett sätt som ett rutnät inte gör. */
.papper { background:#fff; border:1px solid #cfcabc; border-radius:6px;
          padding:4px 6px 12px; margin:10px 0; color:#111;
          box-shadow:0 1px 3px #0006; }
.papper h2 { color:#111; font-size:13px; text-transform:uppercase;
             letter-spacing:1.2px; margin:0 0 10px; text-align:center; }
.papper h2 .note { color:#6b6b6b; letter-spacing:.2px; text-transform:none;
                   font-size:12px; display:block; margin-top:3px; }
.papper .hint.left { color:#333; font-size:13px; text-align:left; }

.scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; margin:0 -2px; }
table.sk { border-collapse:collapse; width:auto; min-width:100%;
           font-variant-numeric:tabular-nums; color:#111; }
/* Rutnätet är hela poängen med ett papperskort: linjer åt BÅDA håll, inte
   bara under raderna. */
.sk th, .sk td { padding:6px 3px; text-align:center; font-size:15px;
                 white-space:nowrap; border:1px solid #d5d0c4; }
.sk thead th { font-weight:700; font-size:11px; text-transform:uppercase;
               letter-spacing:.6px; color:#333; background:#efece2;
               border-bottom:2px solid #8c8677; }
/* vänsterblocket — sticky, med egen (vit) bakgrund så kolumnerna glider under.

   EN TECKENGRAD för alla fyra (kortets 15px). Längd och index låg på 13px
   och läste sig som fotnoter till par, fast de är fyra jämbördiga uppgifter
   om hålet. Skillnaden bärs av FÄRGEN i stället: hål och par svarta, längd
   och index grå — samma rangordning, utan att raden hackar i höjdled.

   Bredden är ett GOLV, inte ett mått: en `width` som är mindre än cellens
   innehåll klampas upp till innehållet av tabellayouten, men kolumnen räknas
   ändå som ANGIVEN och får därför inget av tabellens överskott. Det är hela
   poängen — överskottet ska gå till spelarna (se nedan) och vänsterblocket
   vara exakt så brett som dess bredaste cell kräver. Skrivs de i stället i
   överkant (som förut, där längdkolumnen var dimensionerad för Ut-radens
   "2861 m") betalar var och en av de arton hålraderna för den bredaste.

   HÅL, PAR OCH IDX ÄR LIKA BREDA (grundarens beslut 2026-08-20). De bär tre
   ensiffriga till tvåsiffriga tal om samma hål och ska läsas som en enhet;
   att rubrikerna råkar vara olika breda ("HÅL" mot "IDX") är inget skäl att
   kolumnerna ska vara det. Måttet är hålkolumnens — den bredaste av de tre —
   och det MÄTS i JS (--w-hal), inte skrivs som en literal: det sätts av
   rubriken och av "Tot"/"Erh" i summaraderna, alltså av telefonens typsnitt.
   Längden står utanför; den bär "2861 m" och kan inte pressas dit.

   Trion bär BÅDA egenskaperna, och behöver båda. `width` ensam räckte inte:
   så snart tabellen blev bredare än skärmen (tre spelare och uppåt) föll
   kolumnerna tillbaka på sitt innehåll — 32,1 / 29,2 / 25,6 px — och bara
   enspelarkortet såg rätt ut. `min-width` ensam räcker inte heller: då är
   bredden inte längre ANGIVEN, och kolumnerna tar emot sin del av tabellens
   överskott, så vänsterblocket sväller på det breda kortet i stället för
   spelarna. Mätt, båda två. */
.sk .c-hal, .sk .c-lang, .sk .c-par, .sk .c-idx {
  position:sticky; z-index:2; padding-left:1px; padding-right:1px; }
.sk .c-hal, .sk .c-par, .sk .c-idx {
  width:var(--w-hal, 29px); min-width:var(--w-hal, 29px); }
.sk .c-hal  { left:0; font-weight:700; }
.sk .c-lang { left:var(--l-lang, 28px); width:40px; color:#555; }
.sk .c-par  { left:var(--l-par, 74px); }
.sk .c-idx  { left:var(--l-idx, 102px); color:#555;
              border-right:2px solid #8c8677; }
.sk tbody .c-hal, .sk tbody .c-lang, .sk tbody .c-par, .sk tbody .c-idx { background:#fff; }
.sk thead .c-hal, .sk thead .c-lang, .sk thead .c-par, .sk thead .c-idx { background:#efece2; }
/* spelarkolumner — TVÅ per spelare, som papperskortets delade fält:
   vänster bär slaget (med prickarna för erhållna slag), höger netto eller
   poäng. Andra kolumnen är en följd av slaget, inte en egen inmatning, och
   säger det med GRÅTON och egen bottenfärg — inte längre med bredden.

   LIKA BREDA (grundarens beslut 2026-08-20). Golvet är detsamma för båda och
   satt efter den bredare av dem: rubriken "Poäng". Slagrutan var 36 px mot
   poängrutans 44 och paret såg snett ut, fast slaget är det man trycker på.
   Ojämna par är dessutom svåra att läsa nedåt när fyra spelare står bredvid
   varandra — ögat tappar vilken kolumn det följer.

   BREDDEN ÄR SKALBAR. Bara golvet sätts här; taket sätter tabellen själv via
   `min-width:100%`, som delar ut det som blir över på kolumner utan angiven
   bredd — alltså spelarnas. En spelare får därför ett brett fält, fyra får
   smala, utan att någon siffra i kortet ändras. Överskottet delas i proportion
   till bredderna, så lika golv ger lika kolumner hela vägen upp.

   Golvet är det BREDASTE av tre saker: siffrorna (ringen runt talet),
   underrubrikerna (ordet "Poäng") och förnamnet — se namnregeln nedan.

   Talet står på .c-sp, som BÅDA kolumnerna bär — inte som två likalydande
   rader. Skrivs det två gånger går det att ändra på ena stället, och kravet
   "lika breda" är just det som då tyst går sönder. .c-slag har därför ingen
   egen regel; att den saknas är avsikten. */
.sk .c-sp { min-width:44px; }
.sk .c-and { color:#555; background:#faf9f6; }
.sk tbody td.c-and { font-weight:400; }
/* HELA FÖRNAMNET SKA ALLTID SYNAS (grundarens beslut 2026-08-20). Namnet är
   därför en breddsättare som alla andra: ingen max-width, ingen ellips, inget
   absolut läge som skulle hålla det utanför kolumnens minsta bredd. Ett långt
   namn breddar sitt kolumnpar, och räcker inte skärmen scrollar kortet i
   sidled — hellre det än en rubrik som säger "CHRISTOF…" och lämnar
   tvivel om vems kolumn man fyller i.

   NAMNET STACKAS ORD FÖR ORD (grundarens beslut 2026-08-20). Profilen har
   ETT fält som heter "Ditt namn" — ingen uppdelning i förnamn och
   efternamn — så kortet vet inte vilket ord som är vad och ska inte låtsas:
   varje ord får en egen rad, två som tre.

   Sida vid sida skulle "JOHANNES OHLSSON" ensam sätta hela kolumnparets
   bredd, och eftersom namnet aldrig klipps skulle kortet betala för det i
   sidled på var och en av de tjugotvå raderna. Stackat är kolumnen bara så
   bred som det längsta ORDET, och hela namnet syns ändå — regeln ovan hålls
   alltså utan att kortet växer.

   Kostnaden är betald på andra ställen: sidopaddingen är 2 px i stället
   för 4. */
.sk thead th.c-sp[colspan] { padding-left:2px; padding-right:2px; }
.sk thead th.c-sp .nd { display:block; }
.sk thead tr.under th { font-size:10px; letter-spacing:.4px; padding:3px 2px;
                        border-bottom:2px solid #8c8677; }
.sk tbody td.c-sp.me { background:#f1f5f0; }
.sk tbody td.c-and.me { background:#eef3ec; }
.sk thead .c-sp.me { background:#e4eadf; color:#111; }
/* erhållna slag — prickar i cellens övre vänstra hörn, aldrig i vägen för
   siffran. Därför position:absolute i en relativ cell. */
.sk td.c-and { position:relative; }
.erh { position:absolute; top:1px; left:3px; font-size:9px; line-height:1;
       letter-spacing:-1px; color:#111; }
.sk tr.erhrad td { font-size:11px; letter-spacing:.3px; font-weight:400; }
/* redigerbara rutor — en svag hörnmarkering, inte en knapp: kortet ska
   fortfarande läsas som papper, men det ska synas att rutan går att fylla i */
.sk td.sc.red { cursor:pointer; }
.sk td.sc.red:active { background:#fdf3c8; }
.sk td.sc.strack { letter-spacing:2px; }
/* spelformsväljaren */
.frad { display:flex; align-items:center; gap:6px; flex-wrap:wrap;
        margin:12px 0 0; padding-top:10px; border-top:1px dashed #cfcabc; }
.fval { background:#fff; color:#333; border:1px solid #cfcabc; border-radius:6px;
        font:inherit; font-size:13px; padding:6px 10px; }
.fval.pa { background:#efece2; color:#111; border-color:#8c8677; font-weight:700; }
.fnot { font-size:13px; color:#333; }
.fvarn { margin-top:8px; font-size:12px; color:#8a4b00; }
/* delsummerader Ut / In / Tot */
.sk tr.sum td { font-weight:800; background:#efece2; }
/* Summaradens meter i 13 px. Den är längdkolumnens BREDDSÄTTARE: feta
   "2861 m" tar 50,9 px mot hålradens "341 m" på 41,7, så arton hålrader
   betalade för tre summarader. 13 px räcker gott för ett tal man läser en
   gång per runda, och kolumnen faller från 55,9 px till 47,1.

   Bara i summaraderna. Hålradernas fyra uppgifter står kvar på 15 px — att
   de har EN teckengrad är ett eget beslut och rörs inte här. */
.sk tr.sum .c-lang { font-size:13px; }
.sk tr.sum td.c-sp.me { background:#e7e4d8; }
.sk tr.sum.tot td { border-top:2px solid #8c8677; }
/* Etiketten i 11 px, inte 12. Den är HÅLKOLUMNENS breddsättare: "Erh" lämnar
   bara 1,9 px till linjen medan hålnumret ovanför har 11,3, och eftersom par
   och idx är låsta till hål betalar alla tre för ordet. En px mindre på fyra
   etiketter ger 2 px på var och en av de tre kolumnerna. Versalstilen och
   spärren står kvar — de skiljer summaraden från hålraderna. */
.sk tr.sum .c-hal { font-size:11px; letter-spacing:.6px; text-transform:uppercase; }
/* nuvarande hål — pappret markerar inget, men vyn ska gå att hitta i */
.sk tbody tr.nu td { background:#fdf3c8; }
.sk tbody tr.nu td.c-sp.me { background:#f7eec2; }
/* ---------- score-notation: FORM I FÄRG (grundarens val 2026-08-19) ------
   Provades mot två alternativ direkt i appen — bara former (klassiskt
   papperskort) och bara färgade celler. Form + färg vann därför att den bär
   DUBBEL kodning: färgen syns på håll över flera spelarkolumner, formen bär
   betydelsen även när färgen inte går fram — i solljus, i gråskala, för den
   som är färgblind. De två förlorarna och väljaren är borttagna; kortet ska
   bära ett uttryck, inte tre.

   Par har varken form eller färg. Det är själva poängen: bara det som avviker
   från par markeras, precis som när man ritar för hand.

   Skalan går från varmt (bra) till kallt (dåligt), och dubbelbogey är en
   MÖRKARE ton av bogeyns blå — samma familj, tyngre, så att "sämre" läses
   utan att man behöver räkna ringarna. */
/* SIFFRAN ÄR ALLTID SVART OCH ALLTID FET (grundarens beslut 2026-08-19) —
   även på par, där det inte finns någon form runt den. Färgen bor uteslutande
   i ringen eller rutan. Skälet är läsbarhet: en siffra som byter färg med
   resultatet byter också upplevd tjocklek och kontrast, och kolumnen slutar
   läsas som en kolumn. Nu varierar bara markeringen, aldrig talet. */
.sk tbody td.sc { font-weight:700; color:#111; }
.mk { display:inline-flex; align-items:center; justify-content:center;
      width:24px; height:24px; line-height:1; font-weight:700; color:#111; }
/* eagle eller bättre — guld, dubbelring */
.mk.eagle  { border:1.6px solid #BA7517; border-radius:50%;
             box-shadow:0 0 0 2px #fff, 0 0 0 3.6px #BA7517; }
/* birdie — ljusare rött, enkel ring */
.mk.birdie { border:1.6px solid #E24B4A; border-radius:50%; }
/* bogey — mörkare blått, enkel ruta */
.mk.bogey  { border:1.6px solid #185FA5; border-radius:3px; }
/* dubbelbogey eller sämre — mörkare blått, dubbelruta */
.mk.dbl    { border:1.6px solid #042C53; border-radius:3px;
             box-shadow:0 0 0 2px #fff, 0 0 0 3.6px #042C53; }
.sk tbody td.sc { padding:8px 3px; }
.sk .tot-diff.under { color:#1a7f3c; }
.sk .tot-diff.over  { color:#b03028; }
