/* Dhivehi Games: the D4 game-menu look carried into every screen a game menu leads to (owner-approved 30 Oct 2026):
   the Friends / Join / Quick play sheets (net.js, restyled through its own --dgn-* variables and classes only), vs Computer,
   Practice, How to play, Daily, the in-game menu, the result cards, and the table CHROME (top bar, name and score chips,
   status pill, player cards, action buttons). The felt, board, cards, track and pieces stay as they are.
   html[data-dgg] (set by shared/dgmenu.js before the first paint) gives the game's own colours, as in shared/dgmenu.css:
   --a accent (white text on it passes AA), --p1 / --p2 the pastel of the game's logo colour. */
html[data-dgg=digu]{--a:#C42F45;--a-rgb:196,47,69;--p1:#FBE1E5;--p2:#F5C9D1}
html[data-dgg=bondi]{--a:#34373F;--a-rgb:52,55,63;--p1:#ECEDF1;--p2:#DCDEE5}
html[data-dgg=ranga]{--a:#B3135C;--a-rgb:179,19,92;--p1:#F8DDE6;--p2:#F0C4D4}
html[data-dgg=dhihaeh]{--a:#0A6A97;--a-rgb:10,106,151;--p1:#D9F0EE;--p2:#BFE4E1}
html[data-dgg=thaas]{--a:#4A3FB5;--a-rgb:74,63,181;--p1:#DEE6FB;--p2:#C8D5F6}
html[data-dgg=binveriya]{--a:#1B7347;--a-rgb:27,115,71;--p1:#DCF0E0;--p2:#C3E5CB}
html[data-dgg=raajje]{--a:#C2410C;--a-rgb:194,65,12;--p1:#DCEFFA;--p2:#C3E3F5}
html[data-dgg=raazuvaa]{--a:#6B4226;--a-rgb:107,66,38;--p1:#F2E7DA;--p2:#E7D4BF}
html[data-dgg=quiz]{--a:#C02A62;--a-rgb:192,42,98;--p1:#FADDE8;--p2:#F3C6D7}
html[data-dgg=celebrity]{--a:#6B2E8A;--a-rgb:107,46,138;--p1:#EBDFF3;--p2:#DCC8EA}
html[data-dgg=song]{--a:#0B7480;--a-rgb:11,116,128;--p1:#DDF1EF;--p2:#C3E6E2}
html[data-dgg]{--dk-ink:#141417;--dk-ink2:#45454F;--dk-card:#fff;--dk-sh:0 1px 2px rgba(20,20,40,.05),0 10px 24px -14px rgba(20,20,40,.24);
 --dk-press:0 5px 0 rgba(0,0,0,.25),0 5px 0 var(--a),0 16px 26px -14px rgba(var(--a-rgb),.6);
 --dk-bg:radial-gradient(90% 38% at 50% 0%,rgba(255,255,255,.7),transparent 75%),linear-gradient(180deg,var(--p1) 0%,var(--p1) 45%,var(--p2) 100%)}

/* ---------- net.js sheets: Friends, Join by code, Quick play search, invite (its own variables + classes) ---------- */
/* scoped to the Friends hub, the Quick play search and its mode chooser only: the waiting room (#dgnRoom), the invite tray and
   every other net.js layer keep the page's own --dgn-* colours (hotfix 31 Oct 2026: they were dark text on the dark room).
   The Quick Match search screen (#dgnQuick.qs) is the waiting room's first look, so it keeps the room's colours too (owner
   6 Nov 2026: the search was light, then the room came in dark: "shouldnt change right? check all games") */
html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm){color:var(--dgn-fg);--dgn-bg:#fff;--dgn-bg2:#F5F4F7;--dgn-fg:#141417;--dgn-muted:#45454F;--dgn-line:rgba(20,20,40,.10);--dgn-soft:rgba(var(--a-rgb),.08);
 --dgn-acc:var(--a);--dgn-acc-fg:#fff;--dgn-good:#15803D;--dgn-font:Sora,system-ui,sans-serif;--dgn-head:Sora,system-ui,sans-serif;--dgn-radius:22px;--dgn-scrim:rgba(20,20,30,.38)}
html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-sheet{border-radius:28px 28px 0 0!important;background:linear-gradient(180deg,var(--p1),#fff 130px)!important;box-shadow:0 -20px 50px -24px rgba(20,20,40,.35)!important}
html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-sheet h2,html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-hd h2{font-family:Sora,sans-serif!important;font-weight:800!important;letter-spacing:-.03em!important;color:var(--dk-ink)!important}
html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-tb{border-radius:20px!important;background:#fff!important;box-shadow:var(--dk-sh)!important;border:0!important;color:var(--dk-ink)!important}
html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-tb .ti{background:rgba(var(--a-rgb),.10)!important;color:var(--a)!important;border-radius:14px!important}
html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-tb.go,html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-tb.primary,html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-btn.primary,html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-go{background:var(--a)!important;color:#fff!important;box-shadow:var(--dk-press)!important}
html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-tb.go .ti,html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-tb.primary .ti{background:rgba(255,255,255,.22)!important;color:#fff!important}
html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-sheet input{border-radius:16px!important;border:2px solid rgba(var(--a-rgb),.28)!important;background:#fff!important;font-family:Sora,sans-serif!important}
html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-sheet input:focus{border-color:var(--a)!important;outline:none}
html[data-dgg] :is(#dgnHub,#dgnQuick:not(.qs),#dgnQm) .dgn-x{background:#fff!important;color:var(--dk-ink)!important;box-shadow:0 6px 14px -10px rgba(20,20,40,.35)!important}
html[data-dgg] #dgnQuick:not(.qs){background:var(--dk-bg)!important}
html[data-dgg] #dgnQuick:not(.qs),html[data-dgg] #dgnQuick:not(.qs) *{font-family:Sora,sans-serif!important}

/* ---------- a game's own sheets: How to play, Practice, vs Computer sheets, the in-game menu ---------- */
html[data-dgg] #sheet .sheet-b,html[data-dgg] #sheet>.card,html[data-dgg=binveriya] #sheet{background:linear-gradient(180deg,var(--p1),#fff 150px)!important;border-radius:28px 28px 0 0!important;color:var(--dk-ink)!important;font-family:Sora,sans-serif}
html[data-dgg] #sheet h2,html[data-dgg] #sheet h3{font-family:Sora,sans-serif!important;font-weight:800!important;letter-spacing:-.02em;color:var(--dk-ink)!important}
html[data-dgg] #sheet .btn.primary,html[data-dgg] #sheet .btn.am,html[data-dgg] #sheet button.go,html[data-dgg] #sheet .btn-coral{background:var(--a)!important;color:#fff!important;font-family:Sora,sans-serif!important;border-radius:20px!important;border:0!important;box-shadow:var(--dk-press)!important}
html[data-dgg] #sheet .lvb,html[data-dgg] #sheet .nsel button,html[data-dgg] #sheet .mlist .btn,html[data-dgg] #sheet .mlist button{background:#fff!important;border:0!important;box-shadow:var(--dk-sh)!important;border-radius:18px!important;font-family:Sora,sans-serif!important;color:var(--dk-ink)!important}
html[data-dgg] #sheet .mlist .btn.danger,html[data-dgg] #sheet .mlist [data-a=leave],html[data-dgg] #sheet .mlist [data-a=quit]{color:#B42318!important}
html[data-dgg] #sheet .lvb[aria-pressed=true],html[data-dgg] #sheet .nsel button[aria-pressed=true]{box-shadow:inset 0 0 0 2px var(--a),0 8px 20px -14px rgba(var(--a-rgb),.5)!important}
html[data-dgg] #sheet .chip{border-radius:16px!important;font-family:Sora,sans-serif!important}
html[data-dgg] #sheet .chip[aria-pressed=true]{background:rgba(var(--a-rgb),.10)!important;color:var(--dk-ink)!important}
html[data-dgg] #sheet .rew{background:#fff!important;box-shadow:var(--dk-sh)}

/* ---------- result cards and the table-rules card (#ov / #rov in the card games and Raazuvaa) ---------- */
html[data-dgg] #ov .ovc,html[data-dgg] #rov .ovc{background:linear-gradient(180deg,var(--p1),#fff 160px)!important;color:var(--dk-ink)!important;border:0!important;border-radius:28px!important;
 box-shadow:0 2px 4px rgba(0,0,0,.06),0 30px 60px -24px rgba(0,0,0,.55)!important;font-family:Sora,sans-serif}
html[data-dgg] #ov .ovc h2,html[data-dgg] #ov .ovc h3,html[data-dgg] #rov .ovc h2{font-family:Sora,sans-serif!important;font-weight:800!important;letter-spacing:-.03em;color:var(--dk-ink)!important;background:none!important;-webkit-text-fill-color:currentColor!important;text-shadow:none!important}
html[data-dgg] #ov .ovc .btn.primary,html[data-dgg] #rov .ovc .btn.primary{background:var(--a)!important;color:#fff!important;border:0!important;border-radius:20px!important;font-family:Sora,sans-serif!important;box-shadow:var(--dk-press)!important}
html[data-dgg] #ov .ovc .btn.ghost,html[data-dgg] #ov .ovc .btn.soft,html[data-dgg] #rov .ovc .btn.ghost{background:#fff!important;color:var(--dk-ink)!important;border:0!important;border-radius:18px!important;box-shadow:var(--dk-sh)!important;font-family:Sora,sans-serif!important}
html[data-dgg] #ov .ovc .muted,html[data-dgg] #ov .ovc small,html[data-dgg] #ov .ovc p{color:var(--dk-ink2)!important}
/* the Play again box (net.js [data-dgn-av]) in the light result card: the light net.js colours, as in the Friends hub (owner 8 Nov
   2026, Bondi iPhone: it kept the dark table's colours, so its name chips, ticks and count had no visible shape on the white card) */
html[data-dgg] #ov .ovc [data-dgn-av]{--dgn-bg2:#F5F4F7;--dgn-fg:#141417;--dgn-muted:#45454F;--dgn-line:rgba(20,20,40,.16);--dgn-soft:rgba(var(--a-rgb),.08);
 --dgn-acc:var(--a);--dgn-acc-fg:#fff;--dgn-good:#15803D;--dgn-bad:#B42318;--dgn-head:Sora,system-ui,sans-serif}
html[data-dgg] #ov .ovc [data-dgn-av]>.dgn-av{background:#fff;border:0;box-shadow:var(--dk-sh);text-align:left}

/* ---------- full sub-screens: vs Computer (card games, Raazuvaa), Raajje Run's race setup and How to play ---------- */
html[data-dgg] main.page:has(>.subtop),html[data-dgg] #setup,html[data-dgg] #howto{background:var(--dk-bg)!important;color:var(--dk-ink)!important;min-height:100vh;min-height:100dvh}
html[data-dgg] body:has(main.page>.subtop):before,html[data-dgg] body:has(main.page>.subtop):after{opacity:0!important}
html[data-dgg] body:has(main.page>.subtop){background:linear-gradient(180deg,var(--p1),var(--p2))!important}
html[data-dgg] main.page>.subtop h1{font:800 26px/1.1 Sora,sans-serif!important;letter-spacing:-.03em;color:var(--dk-ink)!important;background:none!important;-webkit-text-fill-color:currentColor!important;text-shadow:none!important}
html[data-dgg] main.page:has(>.subtop) .panel,html[data-dgg] main.page:has(>.subtop) .cpanel,html[data-dgg] #setup .card{background:#fff!important;border:0!important;border-radius:28px!important;box-shadow:0 1px 2px rgba(20,20,40,.05),0 18px 40px -22px rgba(20,20,40,.30)!important;color:var(--dk-ink)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html[data-dgg] main.page:has(>.subtop) .panel h2,html[data-dgg] main.page:has(>.subtop) .cpanel h2,html[data-dgg] #setup .card h2{font:800 24px/1.15 Sora,sans-serif!important;letter-spacing:-.03em;color:var(--dk-ink)!important}
html[data-dgg] main.page:has(>.subtop) label.f,html[data-dgg] #setup .lbl{font:700 12px/1.2 Sora,sans-serif!important;letter-spacing:.06em;color:var(--dk-ink2)!important}
html[data-dgg] main.page:has(>.subtop) .btn.sm.soft,html[data-dgg] main.page:has(>.subtop) .pick .btn,html[data-dgg] #setup .seg button,html[data-dgg] #setup .step button{background:#F4F3F6!important;color:var(--dk-ink)!important;border:0!important;box-shadow:none!important;border-radius:14px!important;font-family:Sora,sans-serif!important}
html[data-dgg] main.page:has(>.subtop) .btn.sm.soft[aria-pressed=true],html[data-dgg] main.page:has(>.subtop) .pick .btn[aria-pressed=true],html[data-dgg] main.page:has(>.subtop) .btn[aria-pressed=true],html[data-dgg] #setup .seg button[aria-pressed=true],html[data-dgg] #setup .seg button.on{background:var(--a)!important;color:#fff!important}
html[data-dgg] main.page:has(>.subtop) .btn[aria-pressed=true] small{color:#fff!important}
html[data-dgg] #setup .seg,html[data-dgg] #setup .step{background:#F4F3F6!important;border:0!important;box-shadow:none!important}
html[data-dgg] #setup .step output{color:var(--dk-ink)!important}
html[data-dgg] main.page:has(>.subtop) .btn.primary,html[data-dgg] main.page:has(>.subtop) [data-a=solo],html[data-dgg] #setup .go{background:var(--a)!important;color:#fff!important;font:700 19px/1 Sora,sans-serif!important;border-radius:22px!important;
 box-shadow:0 6px 0 rgba(0,0,0,.28),0 6px 0 var(--a),0 18px 30px -14px rgba(var(--a-rgb),.6)!important;border:0!important;text-shadow:none!important}
html[data-dgg] main.page>.subtop .icon-btn:not(.dgh),html[data-dgg] main.page>.subtop .shellpill{background:#fff!important;color:var(--dk-ink)!important;box-shadow:var(--dk-sh)!important;border:0!important}
html[data-dgg] #setup .su-me b,html[data-dgg] #setup .su-me small,html[data-dgg] #setup p,html[data-dgg] main.page:has(>.subtop) .muted,html[data-dgg] main.page:has(>.subtop) .hint,html[data-dgg] main.page:has(>.subtop) p{color:#3C3C46!important;text-shadow:none!important}
html[data-dgg] #howto *{color:var(--dk-ink)}
html[data-dgg] #howto b,html[data-dgg] #howto strong{color:color-mix(in srgb,var(--a) 78%,#000)!important}
html[data-dgg] #howto button{background:#fff!important;color:var(--dk-ink)!important;border:0!important;box-shadow:0 6px 16px -12px rgba(20,20,40,.3)!important;font-family:Sora,sans-serif!important}
html[data-dgg] #howto button[aria-selected=true],html[data-dgg] #howto button[aria-pressed=true],html[data-dgg] #howto [data-a=htNext]{background:var(--a)!important;color:#fff!important}
html[data-dgg] #howto [class*=card]{background:#fff!important;border:0!important;box-shadow:0 8px 20px -14px rgba(20,20,40,.25)!important}
html[data-dgg] #howto h2,html[data-dgg] #howto h3{font-family:Sora,sans-serif!important;font-weight:800!important;letter-spacing:-.03em}

/* ---------- the table chrome only (the felt, board, cards and track stay) ---------- */
html[data-dgg] main.table .topbar .icon-btn,html[data-dgg] main.table .goal>span,html[data-dgg=binveriya] #menuBtn,html[data-dgg=binveriya] #soundBtn,html[data-dgg=binveriya] #clockChip,
html[data-dgg=raajje] #hud .icb,html[data-dgg=raajje] #plc,html[data-dgg=raajje] #tim{background:#fff!important;color:var(--dk-ink)!important;border:0!important;box-shadow:0 1px 2px rgba(20,20,40,.06),0 8px 20px -12px rgba(20,20,40,.40)!important;
 -webkit-backdrop-filter:none!important;backdrop-filter:none!important;font-family:Sora,sans-serif!important;text-shadow:none!important}
html[data-dgg] main.table .goal>span{display:inline-block;padding:8px 16px!important;border-radius:99px!important}
html[data-dgg] main.table .goal b,html[data-dgg=binveriya] #clockChip b,html[data-dgg=raajje] #plc b{color:var(--a)!important}
html[data-dgg=binveriya] #menuBtn svg,html[data-dgg=binveriya] #soundBtn svg{filter:brightness(0)}
html[data-dgg] main.table .seat .nm{background:#fff!important;color:var(--dk-ink)!important;padding:2px 10px!important;border-radius:99px!important;font:700 12px/1.45 Sora,sans-serif!important;box-shadow:0 6px 14px -10px rgba(20,20,40,.5)!important;text-shadow:none!important}
html[data-dgg] main.table .seat .cnt{background:var(--a)!important;color:#fff!important;border-radius:99px!important;font:700 12px/1.5 Sora,sans-serif!important;padding:0 9px!important;box-shadow:none!important;text-shadow:none!important}
html[data-dgg] main.table .seat .cnt b{color:#fff!important}
html[data-dgg] main.table #status{background:#fff!important;color:var(--dk-ink)!important;font:600 14px/1.3 Sora,sans-serif!important;border-radius:99px!important;box-shadow:0 8px 20px -12px rgba(20,20,40,.45)!important;border:0!important;text-shadow:none!important}
html[data-dgg] main.table #status b{color:var(--a)!important}
/* ---------- my plate: the slim glass capsule (owner 5 Nov 2026: "why a huge white bar near my name?"; replaces the white card) ----------
   Digu, Bondi / Ranga, Dhihaeh / Thaas (#meinfo): a dark see-through capsule as wide as its content: my avatar with the rank
   badge on its corner, my name, one short status line. My turn (#meinfo.my, set by the game): the capsule glows in the
   table's own accent colour (--acc / --accGlow) and says "Your turn" inside in plain small text, never a button shape
   (the old pill beside it is hidden; while a button such as Govaa or Discard shows, the button is the cue).
   Reduced motion: the glow stays still. The low-power look (dg-lite): no blur, a solid capsule. */
html[data-dgg] main.table .me .mebar{justify-content:flex-start}
html[data-dgg] #meinfo{position:relative;flex:0 1 auto;width:max-content;min-width:0;box-sizing:border-box;padding:4px 16px 4px 4px;gap:10px;border-radius:99px;
 background:rgba(14,11,22,.7);-webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2);
 box-shadow:inset 0 0 0 1px rgba(255,255,255,.17),0 10px 24px -14px rgba(0,0,0,.75);color:#fff;font-family:Sora,sans-serif;transition:box-shadow .3s ease}
html[data-dgg].dg-lite #meinfo{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(14,11,22,.86)}
html[data-dgg] #meinfo>div{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:1px}
html[data-dgg] #meinfo b{display:block;overflow:hidden;text-overflow:ellipsis;min-width:0;color:#fff;font:700 15px/1.2 Sora,sans-serif;letter-spacing:-.01em;text-shadow:none;white-space:nowrap}
html[data-dgg] #meinfo .s{display:block;color:rgba(255,255,255,.86);opacity:1;font:500 12px/1.3 Sora,sans-serif;text-shadow:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:unset}
html[data-dgg] #meinfo .s .nomeld{font-style:normal;font-weight:700;color:#FFB4A8}
/* the glow: its own layer, so the pulse is only an opacity change */
html[data-dgg] #meinfo::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s ease;
 box-shadow:0 0 0 1.5px var(--acc,#F2C24E),0 0 22px 3px var(--accGlow,rgba(242,194,78,.55))}
html[data-dgg] #meinfo.my::before{opacity:1}
@media (prefers-reduced-motion:no-preference){html[data-dgg] #meinfo.my::before{animation:dgPlGlow 1.6s ease-in-out infinite alternate}}
@keyframes dgPlGlow{from{opacity:.62}to{opacity:1}}
html[data-dgg] #meinfo.my{box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),0 10px 24px -14px rgba(0,0,0,.75)}
/* "Your turn": plain small text inside the capsule after the name (a small accent dot, no pill, no shadow) */
html[data-dgg] #meinfo.my::after{content:"Your turn";flex:none;align-self:center;margin-left:4px;padding-left:13px;white-space:nowrap;color:#fff;
 font:700 11px/1.2 Sora,sans-serif;letter-spacing:.06em;text-transform:uppercase;background:radial-gradient(circle,var(--acc,#F2C24E) 0 3.5px,transparent 4px) 0 50%/8px 8px no-repeat}
html[data-dgg] main.table .me .acts .yt{display:none!important}
html[data-dgg] main.table .me .mebar:has(.acts button) #meinfo.my::after{display:none}
html[data-dgg] main.table .me .acts{margin-left:auto}
/* the rank badge on the avatar's corner (mine and the opponents'): bottom right; Dhihaeh / Thaas: top right (their
   tricks badge sits bottom right, the dealer's D top left); the opponents in Digu and Bondi: bottom left (the card fan
   sits bottom right) */
html[data-dgg] .plrb{position:absolute;right:-5px;bottom:-4px;z-index:5;display:inline-flex;line-height:0;pointer-events:none;filter:drop-shadow(0 1px 2px rgba(0,0,0,.55))}
html[data-dgg] .plrb:empty{display:none}
html[data-dgg] .plrb .rbt{margin:0!important}
html[data-dgg] .plrb svg,html[data-dgg] .plrb img{width:18px!important;height:18px!important}
html[data-dgg] main.table .seat .av .plrb{right:auto;left:-5px}
html[data-dgg=dhihaeh] .plrb,html[data-dgg=thaas] .plrb,html[data-dgg=dhihaeh] main.table .seat .av .plrb,html[data-dgg=thaas] main.table .seat .av .plrb{left:auto;right:-5px;top:-5px;bottom:auto}
html[data-dgg] main.table .seat .av{overflow:visible}
/* an opponent's name chip is as wide as its name (not its seat): shared/plates.js gives it its room (max-width) */
html[data-dgg] main.table .seat .nm{width:max-content;box-sizing:border-box}
html[data-dgg] main.table .seat .nm:not(.dgp-two) wbr{display:none}
/* an opponent's name that needs two lines (shared/plates.js, only past its one-line room): balanced, split after _ . - */
html[data-dgg] main.table .seat .nm.dgp-two{white-space:normal!important;overflow-wrap:anywhere;text-wrap:balance;line-height:1.2!important;padding-top:3px!important;padding-bottom:3px!important}
/* my plate beside a big button (Govaa, Discard) on a narrow phone: a 14-character name still fits whole */
@media (max-width:374px){html[data-dgg] #meinfo b{font-size:14px}html[data-dgg] main.table .me .acts .bdgb{min-width:0;padding:0 20px}html[data-dgg] main.table .me .mebar{gap:8px}}
html[data-dgg] main.table .seat .av:has(.aib) .plrb{display:none}   /* Dhihaeh: the computer badge took that corner */
html[data-dgg=binveriya] #game .pl{background:#fff!important;color:var(--dk-ink)!important;box-shadow:0 0 0 3px var(--c),0 8px 20px -12px rgba(20,20,40,.45)!important;font-family:Sora,sans-serif!important}
html[data-dgg=binveriya] #game .pl.on{box-shadow:0 0 0 5px var(--c),0 0 0 7px #fff,0 12px 24px -10px rgba(20,20,40,.55)!important}
html[data-dgg=binveriya] #game .pl *{color:var(--dk-ink)!important;text-shadow:none!important}
html[data-dgg=binveriya] #game .pl .youp{background:var(--c)!important;color:#fff!important}
html[data-dgg=binveriya] #act .st{background:#fff!important;color:var(--dk-ink)!important;border-radius:99px!important;font-family:Sora,sans-serif!important;box-shadow:0 8px 20px -12px rgba(20,20,40,.45)!important;text-shadow:none!important}
html[data-dgg=binveriya] #abtns .btn,html[data-dgg=binveriya] #riskMini .btn{background:#fff!important;color:var(--dk-ink)!important;border:0!important;box-shadow:0 8px 20px -12px rgba(20,20,40,.45)!important;font-family:Sora,sans-serif!important}
html[data-dgg=binveriya] #abtns .btn svg{color:var(--a)!important}
html[data-dgg=binveriya] #abtns .btn.off,html[data-dgg=binveriya] #abtns .btn[aria-disabled=true]{color:#6A6A74!important}
html[data-dgg=raajje] #hud .abil{box-shadow:0 0 0 4px #fff,0 10px 22px -10px rgba(20,20,40,.5)!important}
html[data-dgg=raajje] #hud #toast,html[data-dgg=raajje] #hud #hint{background:#fff!important;color:var(--dk-ink)!important;border:0!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;text-shadow:none!important;font-family:Sora,sans-serif!important}
html[data-dgg=raajje] #hud #toast *,html[data-dgg=raajje] #hud #hint *{color:var(--dk-ink)!important}

/* ---------- Binveriya: whose island is whose, at a glance (owner 30 Oct 2026) ----------
   every owned tile carries its owner's colour (a multiply tint, so the dark name and price stay dark and readable),
   a bigger owner badge, and the tint grows in when the island is bought; mortgaged / loaned tiles stay greyed and hatched */
html[data-dgg=binveriya] .cell.own::before{content:"";position:absolute;inset:0;z-index:1;background:var(--oc);opacity:.3;pointer-events:none;animation:dgOwnIn .7s cubic-bezier(.2,.8,.2,1) both}
html[data-dgg=binveriya] .cell.own::after{box-shadow:inset 0 0 0 calc(var(--B)*.009) var(--oc)!important}
html[data-dgg=binveriya] .cell .ob{width:calc(var(--B)*.046)!important;height:calc(var(--B)*.046)!important;box-shadow:0 0 0 calc(var(--B)*.004) #fff,0 0 0 calc(var(--B)*.008) var(--oc),0 1px 3px rgba(0,0,0,.4)!important}
@keyframes dgOwnIn{0%{opacity:0;transform:scale(.4)}60%{opacity:.55}100%{opacity:.3;transform:none}}
@media (prefers-reduced-motion:reduce){html[data-dgg=binveriya] .cell.own::before{animation:none}}
/* set by shared/dgmenu.js on old light-on-dark markup inside the light panels */
html[data-dgg] .dk-ink{color:var(--dk-ink2)!important;-webkit-text-fill-color:currentColor!important;text-shadow:none!important}
html[data-dgg] .dk-surf{background:#fff!important;color:var(--dk-ink)!important;border-color:rgba(20,20,40,.12)!important;box-shadow:var(--dk-sh)!important;text-shadow:none!important}
html[data-dgg] .dk-surf *{color:inherit}
html[data-dgg] #sheet .btn.gh,html[data-dgg] #sheet .btn.ghost{background:#fff!important;color:var(--dk-ink)!important;border:0!important;box-shadow:var(--dk-sh)!important}
/* Raajje Run's result card */
html[data-dgg=raajje] #results .card,html[data-dgg=raajje] #results .rc{background:linear-gradient(180deg,var(--p1),#fff 160px)!important;color:var(--dk-ink)!important;border:0!important;border-radius:28px!important}
html[data-dgg=raajje] #results .card h3{font:800 26px/1.15 Sora,sans-serif!important;letter-spacing:-.03em;color:var(--dk-ink)!important;text-shadow:none!important}
html[data-dgg=raajje] #results .card .rl li{background:#fff!important;border:0!important;box-shadow:var(--dk-sh)!important;color:var(--dk-ink)!important}
html[data-dgg=raajje] #results .row2 button,html[data-dgg=raajje] #results .row2 a{background:#fff!important;color:var(--dk-ink)!important;border:0!important;box-shadow:var(--dk-sh)!important;font-family:Sora,sans-serif!important}
html[data-dgg=raajje] #results .row2 .btn-coral,html[data-dgg=raajje] #results .row2 [data-a=again]{background:var(--a)!important;color:#fff!important;box-shadow:var(--dk-press)!important}
html[data-dgg] main.page:has(>.subtop) .cseg{background:#F4F3F6!important;border:0!important}
html[data-dgg] main.page:has(>.subtop) .cseg button{color:var(--dk-ink)!important;background:transparent!important}
html[data-dgg] main.page:has(>.subtop) .cseg button[aria-pressed=true]{background:var(--a)!important;color:#fff!important}
html[data-dgg] main.page:has(>.subtop) .btn small,html[data-dgg] main.page:has(>.subtop) .pick .btn small{font-size:11px!important;white-space:nowrap}
html[data-dgg] main.page:has(>.subtop) .btn[aria-pressed=true] *{color:#fff!important}
html[data-dgg] main.page:has(>.subtop) .new,html[data-dgg] main.page:has(>.subtop) .tag-new,html[data-dgg] main.page:has(>.subtop) .nw,html[data-dgg] main.page:has(>.subtop) .tnew{background:var(--a)!important;color:#fff!important}
html[data-dgg=raajje] #howto h2,html[data-dgg=raajje] #howto h3,html[data-dgg=raajje] #howto h4{color:var(--dk-ink)!important}
html[data-dgg=song] #sheet .pick.deckbg{background:#fff!important;box-shadow:var(--dk-sh)!important}
html[data-dgg=song] #sheet .pick.deckbg *{color:var(--dk-ink)!important}
html[data-dgg=song] #sheet .pick.deckbg .chip[aria-pressed=true]{background:var(--a)!important}
html[data-dgg=song] #sheet .pick.deckbg .chip[aria-pressed=true] *{color:#fff!important}
html[data-dgg] #sheet .tabs2{background:#F4F3F6!important;border:0!important;box-shadow:none!important}
html[data-dgg] #sheet .tabs2 button{background:transparent!important;color:var(--dk-ink)!important;border:0!important;box-shadow:none!important;font-family:Sora,sans-serif!important}
html[data-dgg] #sheet .tabs2 button[aria-pressed=true]{background:var(--a)!important;color:#fff!important}
html[data-dgg] main.page:has(>.subtop) .seg{background:#F4F3F6!important;border:0!important;box-shadow:none!important}
html[data-dgg] main.page:has(>.subtop) .seg button{background:transparent!important;color:var(--dk-ink)!important;border:0!important;box-shadow:none!important;font-family:Sora,sans-serif!important}
html[data-dgg] main.page:has(>.subtop) .seg button[aria-pressed=true]{background:var(--a)!important;color:#fff!important}
html[data-dgg=binveriya] #game .pl .youp{background:#141417!important;color:#fff!important}
html[data-dgg] main.table .goal .rg{color:var(--a)!important;text-shadow:none!important}

/* ---------- net.js v87: the "You left the table" sheet (#dgnNote .dgn-left) in the light D4 sheet style (owner 5 Nov 2026,
   extras/qa/rejoin-loop): the pastel-to-white sheet, Sora, white cards, the game's accent on Rejoin. AA on every text. ---------- */
html[data-dgg] #dgnNote:has(.dgn-left) .dgn-scrim{background:rgba(20,20,30,.38)!important}
html[data-dgg] #dgnNote .dgn-sheet.dgn-left{--dgn-bg:#fff;--dgn-bg2:#F5F4F7;--dgn-fg:#141417;--dgn-muted:#45454F;--dgn-line:rgba(20,20,40,.10);--dgn-soft:rgba(var(--a-rgb),.08);
 --dgn-acc:var(--a);--dgn-acc-fg:#fff;color:var(--dk-ink)!important;font-family:Sora,system-ui,sans-serif!important;border:0!important;border-radius:28px 28px 0 0!important;
 background:linear-gradient(180deg,var(--p1),#fff 130px)!important;box-shadow:0 -20px 50px -24px rgba(20,20,40,.35)!important;padding:10px 18px calc(18px + env(safe-area-inset-bottom,0px))!important}
html[data-dgg] #dgnNote .dgn-left .dgn-grab{background:rgba(20,20,40,.18)!important}
html[data-dgg] #dgnNote .dgn-left h2{font-family:Sora,sans-serif!important;font-weight:800!important;letter-spacing:-.03em!important;color:var(--dk-ink)!important;font-size:22px!important}
html[data-dgg] #dgnNote .dgn-left p{color:var(--dk-ink2)!important;font-family:Sora,sans-serif!important}
html[data-dgg] #dgnNote .dgn-left .dgn-tb{border-radius:20px!important;background:#fff!important;box-shadow:var(--dk-sh)!important;border:0!important;color:var(--dk-ink)!important}
html[data-dgg] #dgnNote .dgn-left .dgn-tb .ti{background:rgba(var(--a-rgb),.10)!important;color:var(--a)!important;border-radius:14px!important}
html[data-dgg] #dgnNote .dgn-left .dgn-tb small{color:var(--dk-ink2)!important;opacity:1!important}
html[data-dgg] #dgnNote .dgn-left .dgn-btn{min-height:50px!important;border-radius:20px!important;font-family:Sora,sans-serif!important;font-weight:700!important;border:0!important;
 background:#fff!important;color:var(--dk-ink)!important;box-shadow:var(--dk-sh)!important;filter:none!important}
html[data-dgg] #dgnNote .dgn-left .dgn-btn.pri{background:var(--a)!important;color:#fff!important;box-shadow:var(--dk-press)!important}
html[data-dgg] #dgnNote .dgn-left .dgn-btn.dgn-lback{background:transparent!important;box-shadow:none!important;color:var(--dk-ink)!important;min-height:46px!important;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(20,20,40,.3)}
/* ---------- the heart back button: ONE look on every screen inside a game (owner 5 Nov 2026, extras/qa/heart-back-unify:
   "every menu inside a game should have the same back heart colour button") ----------
   The reference is the game menu's back chip (shared/dgmenu.js .dgm-back): a white 44 px pill, no border, the menu's soft
   shadow, the ink chevron, and the heart-card mark in the game's accent --a. --a (html[data-dgg=...] at the top of this file;
   shared/dgmenu.css repeats the same table for .dgm[data-g]) is the ONE source of the heart colour per game.
   Every back button with the heart-card mark takes it from here, so no page can drift again: the menu (.dgm-back), vs
   Computer / Practice / Raajje Run's race setup / Digu's Profile (.dgh), Raazuvaa's table (.dgh), net.js's Quick play
   search and the waiting room "Your table" (.dgn-bk; the room used the page's --dgn-acc and a see-through pill).
   (The older rules above no longer style .dgh / .dgn-bk: this block is the only one.) */
html[data-dgg] :is(.dgh,.dgn-bk){align-items:center!important;justify-content:center!important;flex:none!important;box-sizing:border-box!important;
 width:auto!important;min-width:44px!important;height:44px!important;padding:0 14px!important;gap:6px!important;border:0!important;border-radius:22px!important;
 background:#fff!important;color:#141417!important;box-shadow:0 1px 2px rgba(20,20,40,.05),0 10px 24px -14px rgba(20,20,40,.20)!important;
 -webkit-backdrop-filter:none!important;backdrop-filter:none!important;text-decoration:none!important}
html[data-dgg] :is(.dgh,.dgn-bk) :is(.dgch,.dgm-ch){display:block!important;flex:none!important;width:22px!important;height:22px!important;color:#141417!important;stroke-width:2.4!important}
html[data-dgg] :is(.dgh,.dgn-bk) :is(.dgmk,.dgm-mk){display:block!important;flex:none!important;width:17px!important;height:22px!important;color:var(--a)!important}
/* the wider back pill (73 px, was a squeezed 44 px in the waiting room): "Your table" stays whole beside it and the ping chip.
   Guess the Celebrity's wide caps (Archivo 125 %) step down; on a 360 px phone every room title is a little smaller. */
html[data-dgg=celebrity] :is(#dgnRoom,#dgnQuick.qs) .dgn-top .ttl{font-size:16px}
@media (max-width:374px){html[data-dgg] :is(#dgnRoom,#dgnQuick.qs) .dgn-top{gap:6px}html[data-dgg] :is(#dgnRoom,#dgnQuick.qs) .dgn-top .ttl{font-size:19px}
 html[data-dgg=celebrity] :is(#dgnRoom,#dgnQuick.qs) .dgn-top .ttl{font-size:15px;font-stretch:110%}
 /* the same on the vs Computer / Profile screens: the title beside the back pill steps 26 -> 22 px on a 360 px phone */
 html[data-dgg] main.page>.subtop h1{font-size:22px!important}}
/* minimal clean-up (9 Nov 2026): the one result-card pattern in every game: a full-width primary "Play again", then this plain
   text link "Home" under it (no fill, no border). A dark card sets --dg-lnk-ink to a light ink. */
html[data-dgg] .dg-lnk,html[data-dgg] #ov .ovc .dg-lnk,html[data-dgg] #rov .ovc .dg-lnk,html[data-dgg] #results .dg-lnk,html[data-dgg] #sheet .dg-lnk{display:flex!important;align-items:center;justify-content:center;width:100%;min-height:44px;margin:6px 0 0!important;padding:8px 12px!important;
 background:transparent!important;border:0!important;box-shadow:none!important;border-radius:14px!important;color:var(--dg-lnk-ink,#45454F)!important;
 font:700 15px/1.2 Sora,system-ui,sans-serif!important;letter-spacing:normal!important;text-transform:none!important;text-shadow:none!important;text-decoration:none!important;cursor:pointer;-webkit-appearance:none;appearance:none;touch-action:manipulation}
html[data-dgg] .dg-lnk:active{background:rgba(20,20,40,.06)!important}
html[data-dgg] .dg-lnk:focus-visible{outline:2px solid currentColor;outline-offset:2px}
/* minimal clean-up (9 Nov 2026): the room's "Invite" lost the "Empty seat" line under it and now sits on a lighter part of
   the seat card (the lagoon-night room); Binveriya's gold there measured 4.42:1, a lighter gold keeps AA */
html[data-dgg=binveriya] :is(#dgnRoom,#dgnQuick){--dgn-acc-tx:#FFDE8A}