/* APP-005 / META-052; codex-meta052-0912 / gpt-6-astra / 2026-09-12. */
@import url("/kit/2.1.0/ui/pk.css"); /* Pausito-kit 2.1.0 (stijl A), bevroren kopie; claude-restyle-prj012-1014 / 2026-10-14. */
:root{--game-inset-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-bottom:7rem}body{padding-bottom:calc(6rem + var(--game-inset-bottom))!important}
.game-tools{position:sticky;bottom:0;display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;padding:.6rem .8rem calc(.6rem + var(--game-inset-bottom));background:#f6f1e8;color:#213c38;border-top:1px solid #bccbbc;z-index:20;font:14px/1.4 system-ui}
.game-tools [role=status]{flex:1 1 100%;overflow-wrap:anywhere}.game-tools button{min-height:44px;max-width:100%;padding:.4rem .7rem;font:inherit;background:#fff;color:#213c38;border:1px solid #9aad9f;border-radius:8px}.game-tools[data-error=true]{background:#fff0dc;color:#713809}
button:focus-visible{outline:3px solid #bd7429;outline-offset:3px}button{touch-action:manipulation}
.game-tools{container-type:inline-size}.game-tools .game-primary{width:auto!important;height:auto!important;min-height:44px!important;max-width:100%;margin:0!important;padding:10px 14px!important;flex:1 1 auto;font-size:15px!important}.game-tools .game-primary svg{display:none}.game-tools .game-save-menu{position:relative;margin-left:auto;border:0;padding:0}.game-save-menu summary{cursor:pointer;min-height:44px;display:flex;align-items:center}.game-save-menu[open]{flex-basis:100%;max-height:45dvh;overflow:auto}.game-save-menu button{margin:4px}.game-tools [role=status]{flex:1 1 auto;font-size:12px}
[data-game] #hud,[data-game] .hud{position:sticky;top:0;z-index:15;flex-wrap:wrap;background:var(--bg,#f6f1e8);max-width:100%}
[data-game=orangerie_bouwer] #side{overflow:visible;max-height:none}[data-game=orangerie_bouwer] main{min-height:0}
[data-game=rifwachter] #hud{position:sticky}[data-game=rifwachter] .game-primary{color:#213c38}
[data-game=expeditie] .tabbar{display:flex;flex-wrap:wrap}[data-game=expeditie] #fotokader{max-height:50dvh}
[data-game] img,[data-game] svg{max-width:100%}[data-game] button{min-height:44px}[data-game] .game-save-menu [hidden]{display:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* W04: measured narrow and large-text overflow; retain every action. */
[data-game] body{min-width:0}[data-game] main,[data-game] #app,[data-game] main>*{min-width:0;max-width:100%;box-sizing:border-box}[data-game] button,[data-game] summary{white-space:normal;overflow-wrap:anywhere}[data-game] h1,[data-game] h2,[data-game] p,[data-game] header{overflow-wrap:anywhere}[data-game=verwonderpaden] header{flex-wrap:wrap}[data-game=orangerie_bouwer] .helper-name{white-space:normal}[data-game=expeditie] .opties{grid-template-columns:repeat(2,minmax(0,1fr))}

/* META-052: bounded depth accents in existing logical DOM/SVG boards. */
[data-game=expeditie] .tegel{box-shadow:inset 0 2px 1px #ffffff20,0 3px 0 #090f1a;transition:transform .12s,opacity .12s}[data-game=expeditie] .tegel:active{transform:translateY(2px)}[data-game=bloesemhof] #kas button{box-shadow:0 3px 0 #284c3933,inset 0 1px #fff9}[data-game=karavaan] #wereld svg{filter:drop-shadow(0 3px 2px #49372220)}[data-game=rifwachter] .zone{box-shadow:inset 0 1px #a9e1df33,0 3px 0 #051e2944}[data-game=verwonderpaden] .choice{box-shadow:0 4px 0 #173c3022}

/* ==========================================================================================================================
   PAUSITO-SCHIL (stijl A, kit 2.1.0) — eigenaarsopdracht 14/10/2026 ("meer de look & feel van Pausito, ook voor alle games").
   claude-restyle-prj012-1014 / claude-opus-5-5 / uitvoerder / 2026-10-14.
   Alleen VORM: donkere inkt met paarse gloed, crème/goud/teal, stickerschaduw, onregelmatige ronde hoeken, Fredoka + Inter.
   Spelregels, teksten en gedrag ongewijzigd; speelstukken en speelvelden (kasvakken, fototegels, rif, orangerie-scène,
   kaart van de karavaan) houden hun eigen tekening. Lokale prototypes: géén Pausito-logo of -naam (MIGRATIE.md §5).
   Tokens en lettertypen komen uit de bevroren kopie runtime/pausito-kit/ (zie LEESMIJ.md daar, sha256 gecontroleerd); elke
   token heeft hieronder een terugvalwaarde, zodat dit bestand ook werkt als het ergens zonder de kit wordt ingelijnd
   (bv. Companion App export-games.py: dan valt alleen het lettertype terug op system-ui).
   Rustig: data-calm="1"/data-rustig="true" op <html> of prefers-reduced-motion zet alle beweging uit.
   ========================================================================================================================== */
html[data-game]{--gs-ink:var(--pk-ink,#0C0B14);--gs-glow:var(--pk-glow,#29213F);--gs-cream:var(--pk-cream,#FEEDBA);--gs-cream-s:var(--pk-cream-s,#8C7F5E);
 --gs-gold:var(--pk-gold,#F2CB81);--gs-gold-s:var(--pk-gold-s,#7A4E00);--gs-teal:var(--pk-teal,#4FD1C5);--gs-teal-s:var(--pk-teal-s,#00695F);
 --gs-coral:var(--pk-coral,#F2A08F);--gs-coral-s:var(--pk-coral-s,#8C3A2A);--gs-sub:var(--pk-sub,#D9CFB4);--gs-mute:var(--pk-mute,#A79F8C);--gs-label:var(--pk-label,#B3ADC5);
 --gs-line:var(--pk-line,#3A3446);--gs-line-2:var(--pk-line-2,#51465D);--gs-line-3:var(--pk-line-3,#64556C);--gs-surface:var(--pk-surface,#201B2C);
 --gs-surface-2:var(--pk-surface-2,#272233);--gs-field:var(--pk-field,#332A40);--gs-deep:var(--pk-deep,#1A1422);
 --gs-r-btn:var(--pk-r-chip,16px 20px 15px 21px/19px 15px 21px 16px);--gs-r-big:var(--pk-r-big,40px 52px 44px 56px/48px 40px 54px 42px);
 --gs-r-card:var(--pk-r-card2,54px 40px 50px 44px/42px 52px 40px 50px);--gs-r-tile:var(--pk-r-tile,26px 32px 24px 30px/30px 24px 32px 26px);
 --gs-r-panel:var(--pk-r-panel,22px 28px 20px 26px/26px 20px 28px 22px);--gs-r-chip:var(--pk-r-chip,16px 20px 15px 21px/19px 15px 21px 16px);
 --gs-display:var(--pk-font-display,Fredoka,Inter,system-ui,sans-serif);--gs-text:var(--pk-font-text,Inter,'Segoe UI',system-ui,-apple-system,Roboto,sans-serif);
 --gs-press:var(--pk-t-press,90ms);color-scheme:dark;background:var(--gs-ink)}

/* Spelvariabelen van de schil naar de kit (html:root wint ook van de eigen donker-modusblokken :root:not([data-theme])). */
html:root:is([data-game=bloesemhof],[data-game=karavaan],[data-game=expeditie]){--bg:var(--gs-ink);--paneel:var(--gs-surface);--rand:var(--gs-line-2);
 --accent:var(--gs-gold);--accent2:var(--gs-teal);--tekst:var(--gs-cream);--dof:var(--gs-sub);--fout:var(--gs-coral)}
html:root[data-game=rifwachter]{--bg:var(--gs-ink);--panel-bg:var(--gs-surface);--panel-bg-alt:var(--gs-surface-2);--text:var(--gs-cream);--text-dim:var(--gs-sub);
 --border:var(--gs-line-2);--accent:var(--gs-teal);--accent-strong:#7DE3D8;--danger:var(--gs-coral);--danger-strong:#FFAB9E;--nutrient-track-bg:var(--gs-deep);
 --card-shadow:0 4px 0 var(--gs-deep);--modal-overlay:#08060ECA}
html:root[data-game=orangerie_bouwer]{--bg:var(--gs-ink);--bg-panel:var(--gs-surface);--ink:var(--gs-cream);--ink-soft:var(--gs-sub);--border:var(--gs-line-2);
 --accent:var(--gs-gold);--btn-bg:var(--gs-gold);--btn-bg-hover:#F7DBA5;--disabled:#2A2333;--shadow:#0009}

/* Schil: inkt + zachte paarse gloed bovenaan, Inter als tekstletter, Fredoka voor koppen. */
html[data-game] body{background:radial-gradient(ellipse 120% 60% at 50% 0,var(--gs-glow),transparent 70%) no-repeat,var(--gs-ink);color:var(--gs-cream);
 font-family:var(--gs-text);font-synthesis:none}
html[data-game] :is(h1,h2,h3){font-family:var(--gs-display);font-weight:600;letter-spacing:0;color:var(--gs-cream)}
html[data-game] h1{line-height:1.1}
html[data-game] :is(.vtitel,.hud-value,.metric){font-family:var(--gs-display);font-weight:600}
html[data-game] a{color:var(--gs-gold);text-underline-offset:.2em}
html[data-game] :is(.sub,.klein,.muted,.bron,.hud-label){color:var(--gs-sub)}
html[data-game] :is(a,button,summary,input,select,textarea,[tabindex]):not(.zone-hit):focus-visible{outline:3px dashed var(--gs-cream);outline-offset:4px}
html[data-game] :is(select,input[type=search],input[type=text],input[type=number]){background:var(--gs-field);color:var(--gs-cream);border:1px solid var(--gs-line-3);
 border-radius:10px;min-height:44px;padding:8px 12px;font:inherit}

/* Knoppen (lage specificiteit, dus spelstukken met een eigen klasse houden hun vorm): outline + harde stickerschaduw. */
:where(html[data-game]) button:where(:not(.vak,.tegel,.resident-card,.helper-row,.bed-btn,.zone-control,.choice)){--c:var(--gs-cream);--s:var(--gs-cream-s);
 background:transparent;color:var(--gs-cream);border:3px solid var(--c);border-radius:var(--gs-r-btn);box-shadow:0 4px 0 var(--s);
 font-family:var(--gs-display);font-weight:600;letter-spacing:0;transition:transform var(--gs-press) ease-out,box-shadow var(--gs-press) ease-out}
:where(html[data-game]) button:where(:not(.vak,.tegel,.resident-card,.helper-row,.bed-btn,.zone-control,.choice)):hover:not(:disabled){background:#FEEDBA12}
:where(html[data-game]) button:where(:not(.vak,.tegel,.resident-card,.helper-row,.bed-btn,.zone-control,.choice)):active:not(:disabled){transform:translateY(2px);box-shadow:0 2px 0 var(--s)}
:where(html[data-game]) button:where(:not(.vak,.tegel,.resident-card,.helper-row,.bed-btn,.zone-control,.choice)):disabled{--c:var(--gs-line-2);--s:var(--gs-deep);color:var(--gs-label)}

/* Bewaarbalk onderaan: inktbalk; de hoofdactie is de ene gouden knop, een tweede actie is teal; het bewaarmenu is rustig. */
html[data-game] .game-tools{background:var(--gs-ink);color:var(--gs-sub);border-top:2px solid var(--gs-line);font-family:var(--gs-text)}
html[data-game] .game-tools[data-error=true]{background:#2A1712;color:var(--gs-coral)}
html[data-game] .game-tools .game-primary:is(.game-primary,#gs-specificiteit){--c:var(--gs-gold);--s:var(--gs-gold-s);background:transparent;color:var(--gs-cream);
 border:4px solid var(--c);border-radius:var(--gs-r-big);box-shadow:0 6px 0 var(--s);font-family:var(--gs-display);font-weight:600;letter-spacing:0}
html[data-game] .game-tools .game-primary~.game-primary:is(.game-primary,#gs-specificiteit){--c:var(--gs-teal);--s:var(--gs-teal-s);border-width:3px;border-radius:var(--gs-r-btn);box-shadow:0 4px 0 var(--s)}
html[data-game] .game-tools .game-primary:is(.game-primary,#gs-specificiteit):hover:not(:disabled){background:#FEEDBA12}
html[data-game] .game-tools .game-primary:is(.game-primary,#gs-specificiteit):active:not(:disabled){transform:translateY(4px);box-shadow:0 2px 0 var(--s)}
html[data-game] .game-tools .game-primary:is(.game-primary,#gs-specificiteit):disabled{--c:var(--gs-line-2);--s:var(--gs-deep);color:var(--gs-label)}
html[data-game] .game-save-menu summary{color:var(--gs-sub);font-family:var(--gs-text);font-weight:500;text-decoration:underline;text-underline-offset:.2em;padding:0 6px}
html[data-game] .game-tools .game-save-menu button{--c:var(--gs-line-2);--s:transparent;background:transparent;border:2px solid var(--c);border-radius:22px;box-shadow:none;
 color:var(--gs-sub);font-family:var(--gs-text);font-weight:500}

/* Panelen, chips, dialogen en meldingen in kitvorm. */
html[data-game] :is(.paneel,.panel,#stage-wrap,#shop,.modal-box,dialog){border:3px solid var(--gs-line);border-radius:var(--gs-r-panel)}
html[data-game] :is(.paneel,.panel,#shop,#stage-wrap){background:var(--gs-surface)}
html[data-game] :is(.chip,.hud .chip){background:#0C0B14D0;border:3px solid var(--gs-teal);border-radius:var(--gs-r-chip);box-shadow:0 4px 0 var(--gs-teal-s);
 font-family:var(--gs-display);font-weight:600;color:var(--gs-cream)}
html[data-game] .chip b{color:var(--gs-gold)}
html[data-game] :is(dialog,.modal-box){background:var(--gs-surface);color:#F9F1E5;border:1px solid var(--gs-line-3);box-shadow:0 30px 100px #0009}
html[data-game] dialog::backdrop{background:#08060ECA}
html[data-game] .melding{background:var(--gs-cream);color:var(--gs-ink);border-radius:var(--gs-r-chip);box-shadow:0 4px 0 var(--gs-cream-s),0 18px 70px #0005;
 font-family:var(--gs-display);font-weight:600}
html[data-game] :is(.rij,.wielrij,.galwerk){border-color:var(--gs-line)}

/* Bloesemhof: kas in kitkleuren; de vakken blijven vakken (stippellijn leeg, vol = gevuld, paar = goud). */
html[data-game=bloesemhof] #kas{background:var(--gs-surface);border:3px solid var(--gs-line);border-radius:var(--gs-r-panel);box-shadow:0 3px 0 var(--gs-deep)}
html[data-game=bloesemhof] .vak{background:var(--gs-deep);border-color:var(--gs-line-2);border-radius:14px}
html[data-game=bloesemhof] .vak.vol{background:var(--gs-surface-2);border-color:var(--gs-line-3)}
html[data-game=bloesemhof] .vak.paar{border-color:var(--gs-gold)}
html[data-game=bloesemhof] #kas button{box-shadow:0 3px 0 #0006}
html[data-game=bloesemhof] .vak.gekozen{box-shadow:0 0 0 3px var(--gs-gold)}
html[data-game=bloesemhof] .soort{background:var(--gs-deep);border-color:var(--gs-line-2);border-radius:var(--gs-r-chip)}
html[data-game=bloesemhof] #tafelBalk{background:var(--gs-deep);height:14px;border:2px solid var(--gs-teal);border-radius:9px}

/* Expeditie: fotokader als stickerkader; tegels, antwoorden en hun juist/fout-kleuren blijven het spel. */
html[data-game=expeditie] #fotokader{border:4px solid var(--gs-cream);border-radius:var(--gs-r-tile);box-shadow:0 6px 0 var(--gs-cream-s);background:var(--gs-ink)}
html[data-game=expeditie] .powerbalk button{background:transparent}
html[data-game=expeditie] .tabbar button.actief{background:var(--gs-gold);color:var(--gs-ink);border-color:var(--gs-gold)}
html[data-game=expeditie] .titelkaart{background:var(--gs-surface);border:3px solid var(--gs-gold);border-radius:var(--gs-r-panel);box-shadow:0 4px 0 var(--gs-gold-s)}
html[data-game=expeditie] .weetje{background:var(--gs-surface-2);border-left:4px solid var(--gs-gold);border-radius:0 14px 14px 0}
html[data-game=expeditie] .galwerk .mini{background:var(--gs-surface-2)}
html[data-game=expeditie] .minireeks a{color:var(--gs-teal)}

/* Karavaan: wereldkaart in een rustig kader; overval in koraal; oefenkaravaan in kitpaneel. */
html[data-game=karavaan] #wereld{border:4px solid var(--gs-line-2);border-radius:var(--gs-r-tile)}
html[data-game=karavaan] #overval{background:#2A1712;border:3px solid var(--gs-coral);border-radius:var(--gs-r-panel)}
html[data-game=karavaan] .wachtslot{background:var(--gs-deep);border-color:var(--gs-line-2);border-radius:var(--gs-r-chip)}
html[data-game=karavaan] .hpbalk{background:var(--gs-deep)}
html[data-game=karavaan] #kr-oef-les{background:var(--gs-surface);border:3px solid var(--gs-line);border-radius:var(--gs-r-panel);color:var(--gs-cream)}
html[data-game=karavaan] #kr-oef-les article{border:3px solid var(--gs-line-2);border-radius:var(--gs-r-tile)}
html[data-game=karavaan] #kr-oef-status{background:var(--gs-deep)}
html[data-game=karavaan] #kr-oef-les summary{font-family:var(--gs-display);font-weight:600;color:var(--gs-gold)}

/* Rifwachter: rif (SVG) ongemoeid; bewonerskaarten als kitkaartjes, golfknop teal (goud = pauzeknop in de balk). */
html[data-game=rifwachter] #hud{border:3px solid var(--gs-line);border-radius:var(--gs-r-panel)}
html[data-game=rifwachter] #shop h2{font-family:var(--gs-display);color:var(--gs-sub)}
html[data-game=rifwachter] .resident-card{background:var(--gs-surface-2);border:3px solid var(--gs-line-2);border-radius:var(--gs-r-tile);box-shadow:0 4px 0 var(--gs-deep)}
html[data-game=rifwachter] .resident-card:hover{border-color:var(--gs-teal)}
html[data-game=rifwachter] .resident-card.selected{border-color:var(--gs-gold);box-shadow:0 4px 0 var(--gs-gold-s);background:var(--gs-surface)}
html[data-game=rifwachter] .resident-naam{font-family:var(--gs-display);font-weight:600}
html[data-game=rifwachter] .start-wave-btn{--c:var(--gs-teal);--s:var(--gs-teal-s);background:transparent;color:var(--gs-cream);border:3px solid var(--c);
 border-radius:var(--gs-r-btn);box-shadow:0 4px 0 var(--s);min-height:52px;font-size:16px}
html[data-game=rifwachter] #controls{flex-wrap:wrap;gap:10px}html[data-game=rifwachter] #controls .start-wave-btn{flex:1 1 100%} /* golfknop over de volle breedte i.p.v. één letter per regel */
html[data-game=rifwachter] .start-wave-btn:hover{background:#FEEDBA12;color:var(--gs-cream)}
html[data-game=rifwachter] .zone-control{background:var(--gs-surface-2);border:2px solid var(--gs-line-2);border-radius:var(--gs-r-chip);color:var(--gs-cream)}
html[data-game=rifwachter] .modal-box button{--c:var(--gs-gold);--s:var(--gs-gold-s);background:transparent;color:var(--gs-cream);border:3px solid var(--c);
 border-radius:var(--gs-r-btn);box-shadow:0 4px 0 var(--s)}
html[data-game=rifwachter] .modal-fact{background:var(--gs-surface-2);border-color:var(--gs-line-2);border-radius:14px}
html[data-game=rifwachter] #stage-wrap{padding:10px}
html[data-game=rifwachter] #rif-svg{background:#EEF6F6;border-radius:14px} /* speelveld: zonenamen staan donker op licht, zoals voorheen */

/* Orangerie bouwer: scène (SVG/3D) ongemoeid; helpers en bedden als kitkaartjes, brede knoppen teal of goud. */
html[data-game=orangerie_bouwer] #hud{background:#0C0B14E6;border-bottom:2px solid var(--gs-line)}
html[data-game=orangerie_bouwer] .hud-value{font-family:var(--gs-display);font-weight:600}
html[data-game=orangerie_bouwer] .panel h2,html[data-game=orangerie_bouwer] #plantenbank h2{color:var(--gs-sub);font-family:var(--gs-display)}
html[data-game=orangerie_bouwer] #orangerie-stage{border:3px solid var(--gs-line-2);border-radius:var(--gs-r-tile)}
html[data-game=orangerie_bouwer] .helper-row{background:var(--gs-surface-2);border:3px solid var(--gs-line-2);border-radius:var(--gs-r-tile);box-shadow:0 4px 0 var(--gs-deep);min-height:52px}
html[data-game=orangerie_bouwer] .helper-row:hover:not(:disabled){border-color:var(--gs-gold)}
html[data-game=orangerie_bouwer] .helper-row:disabled{background:#2A2333}
html[data-game=orangerie_bouwer] .bed-card{border:2px solid var(--gs-line-2);border-radius:var(--gs-r-tile)}
html[data-game=orangerie_bouwer] .bed-btn{border:2px solid var(--gs-line-2);border-radius:var(--gs-r-chip);color:var(--gs-cream)}
html[data-game=orangerie_bouwer] :is(.brede-knop,.modal-box button){--c:var(--gs-teal);--s:var(--gs-teal-s);background:transparent;color:var(--gs-cream);
 border:3px solid var(--c);border-radius:var(--gs-r-btn);box-shadow:0 4px 0 var(--s);font-family:var(--gs-display);font-weight:600;min-height:48px}
html[data-game=orangerie_bouwer] :is(.brede-knop--goud,.modal-box button:not(.knop-stil)){--c:var(--gs-gold);--s:var(--gs-gold-s);color:var(--gs-cream)}
html[data-game=orangerie_bouwer] :is(.brede-knop,.modal-box button):hover:not(:disabled){background:#FEEDBA12}
html[data-game=orangerie_bouwer] .brede-knop:disabled{--c:var(--gs-line-2);--s:var(--gs-deep);background:transparent;color:var(--gs-label)}
html[data-game=orangerie_bouwer] .modal-box button.knop-stil{--c:var(--gs-line-2);--s:transparent;box-shadow:none;color:var(--gs-sub);font-family:var(--gs-text);font-weight:500}
html[data-game=orangerie_bouwer] #milestone-list li{border:2px solid var(--gs-line-2);border-radius:var(--gs-r-chip);color:var(--gs-sub)}
html[data-game=orangerie_bouwer] #milestone-list li.bereikt{border-color:var(--gs-gold);color:var(--gs-gold);box-shadow:0 3px 0 var(--gs-gold-s)}

/* Verwonderpaden: lichte leespagina wordt inkt; de drie keuzes zijn kitkaarten (goud, teal, crème). */
html[data-game=verwonderpaden] header{border-bottom:2px solid var(--gs-line)}
html[data-game=verwonderpaden] .brand,html[data-game=verwonderpaden] .eyebrow{color:var(--gs-gold)}
html[data-game=verwonderpaden] h1{font:600 clamp(36px,6vw,64px)/1.06 var(--gs-display);letter-spacing:0}
html[data-game=verwonderpaden] :is(h2,h3,.metric,.choice b,.vak strong){font-family:var(--gs-display);font-weight:600;letter-spacing:0}
html[data-game=verwonderpaden] :is(.muted,small,.status){color:var(--gs-sub)}
html[data-game=verwonderpaden] .panel{border-color:var(--gs-line)}
html[data-game=verwonderpaden] .choice{--c:var(--gs-gold);--s:var(--gs-gold-s);background:transparent;color:var(--gs-cream);border:4px solid var(--c);
 border-radius:var(--gs-r-big);box-shadow:0 8px 0 var(--s);transition:transform var(--gs-press) ease-out,box-shadow var(--gs-press) ease-out}
html[data-game=verwonderpaden] .choice:nth-child(2){--c:var(--gs-teal);--s:var(--gs-teal-s);background:transparent;color:var(--gs-cream);border-color:var(--c)}
html[data-game=verwonderpaden] .choice:nth-child(3){--c:var(--gs-cream);--s:var(--gs-cream-s);background:transparent;color:var(--gs-cream);border-color:var(--c);border-radius:var(--gs-r-card)}
html[data-game=verwonderpaden] .choice:hover{filter:none;background:#FEEDBA12}
html[data-game=verwonderpaden] .choice:active{transform:translateY(6px);box-shadow:0 2px 0 var(--s)}
html[data-game=verwonderpaden] .vak{--c:var(--gs-cream);--s:var(--gs-cream-s);background:transparent;color:var(--gs-cream);border:3px solid var(--c);border-radius:var(--gs-r-tile);box-shadow:0 5px 0 var(--s);transition:transform var(--gs-press) ease-out,box-shadow var(--gs-press) ease-out}
html[data-game=verwonderpaden] .vak:hover:not(:disabled){filter:none;background:#FEEDBA12}
html[data-game=verwonderpaden] .vak:active:not(:disabled){transform:translateY(3px);box-shadow:0 2px 0 var(--s)}
html[data-game=verwonderpaden] .current{--c:var(--gs-gold);--s:var(--gs-gold-s);border-color:var(--gs-gold)}
html[data-game=verwonderpaden] .tag{background:var(--gs-surface-2);color:var(--gs-cream);border:2px solid var(--gs-line-2);border-radius:var(--gs-r-chip)}
html[data-game=verwonderpaden] .feedback{background:var(--gs-surface-2);border-radius:14px}
html[data-game=verwonderpaden] details{border-top-color:var(--gs-line)}
html[data-game=verwonderpaden] .bar{background:var(--gs-gold)}
html[data-game=verwonderpaden] footer{border-top:2px solid var(--gs-line);color:var(--gs-sub)}
html[data-game=verwonderpaden] .crumbs button{border-width:2px;box-shadow:0 3px 0 var(--s)}

/* Rustig: zelfde regel als kit 2.1.0 voor wie data-calm/data-rustig zet; prefers-reduced-motion staat al bovenaan. */
html[data-game]:is([data-calm="1"],[data-calm="true"],[data-rustig="true"]) *,html[data-game]:is([data-calm="1"],[data-calm="true"],[data-rustig="true"]) *::before,
html[data-game]:is([data-calm="1"],[data-calm="true"],[data-rustig="true"]) *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}