/* Daily game: sidebar card + game window */
.dg-head-label{display:flex;align-items:center;justify-content:space-between;font-size:10px;font-weight:700;color:#52525b;text-transform:uppercase;letter-spacing:.07em;padding:4px 10px 3px;margin-top:10px}
#daily-card-slot{padding:2px 4px 6px}
.dg-card{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border-radius:11px;border:1px solid rgba(255,255,255,.07);
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.015));color:#d4d4d8;font:inherit;text-align:left;cursor:pointer;
  transition:border-color .15s,background .15s}
.dg-card:hover{border-color:rgba(0,153,255,.35);background:rgba(0,153,255,.06)}
.dg-card.is-loading{cursor:default}
.dg-card-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.dg-card-title{display:flex;align-items:baseline;gap:6px;font-size:12.5px;font-weight:650;color:#e4e4e7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-card-title em{font-style:normal;font-size:10.5px;font-weight:600;color:#52525b;font-variant-numeric:tabular-nums}
.dg-card-sub{font-size:11px;color:#8b8b95;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-card-cta{flex:0 0 auto;font-size:11px;font-weight:700;color:#fff;background:#0099ff;border-radius:7px;padding:4px 9px}
.dg-card-done{flex:0 0 auto;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:15px;color:#4ade80;background:rgba(74,222,128,.12)}
.dg-card-done.is-lost{color:#a1a1aa;background:rgba(255,255,255,.06)}
.dg-card-foot{display:flex;justify-content:space-between;gap:8px;padding:5px 4px 0;font-size:10px;color:#52525b;font-variant-numeric:tabular-nums}
.dg-glyph{flex:0 0 auto;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:#1f1f29;border:1px solid rgba(255,255,255,.06);color:#a1a1aa;font-size:12px;font-weight:800}
.dg-glyph.is-word{grid-template-columns:repeat(2,9px);grid-auto-rows:9px;gap:2px;place-content:center}
.dg-glyph.is-word i{display:block;width:9px;height:9px;border-radius:2px;background:#33333d}.dg-glyph.is-word i.h{background:#3a9b5f}.dg-glyph.is-word i.n{background:#c49a2c}
.dg-glyph.is-scramble{font-size:12px;letter-spacing:-.02em;color:#7cc4ff}
.dg-glyph.is-number{font-size:16px;color:#fbbf24}
.dg-glyph.is-code{grid-template-columns:repeat(2,7px);grid-auto-rows:7px;gap:3px;place-content:center}
.dg-glyph.is-code i{display:block;width:7px;height:7px;border-radius:50%;background:#52525b}.dg-glyph.is-code i:nth-child(1){background:#f87171}.dg-glyph.is-code i:nth-child(4){background:#60a5fa}

/* Window */
.modal-box:has(.dg-modal){max-width:430px;padding:20px}
.dg-modal{color:#d4d4d8;display:flex;flex-direction:column;gap:14px}
.dg-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.dg-kicker{display:block;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#0099ff;margin-bottom:3px}
.dg-head h3{margin:0;font-size:19px;font-weight:750;color:#fff;letter-spacing:-.01em}
.dg-head p{margin:3px 0 0;font-size:12px;color:#8b8b95}
.dg-status{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 11px;border-radius:10px;background:#1c1c25;font-size:11.5px;color:#a1a1aa;flex-wrap:wrap}
.dg-status span:first-child{font-weight:650;color:#e4e4e7}
.dg-status span:last-child{display:inline-flex;align-items:center;gap:5px}
.dg-result{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;border-radius:11px;flex-wrap:wrap}
.dg-result div{display:flex;flex-direction:column;gap:3px}
.dg-result b{font-size:14px;color:#fff}
.dg-result span{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:#d4d4d8;flex-wrap:wrap}
.dg-result small{font-size:11px;color:#8b8b95;font-variant-numeric:tabular-nums}
.dg-result.is-won{background:rgba(74,222,128,.08);border:1px solid rgba(74,222,128,.22)}
.dg-result.is-lost{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08)}
.dg-bonus{padding:1px 7px;border-radius:999px;background:rgba(251,191,36,.14);color:#fcd34d;font-weight:700;font-size:11px}
.dg-msg{margin:-4px 0 0;min-height:16px;text-align:center;font-size:12px;font-weight:600;color:#e4e4e7;opacity:0;transition:opacity .15s}
.dg-msg.is-on{opacity:1}
.dg-board-foot{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:#71717a;border-top:1px solid rgba(255,255,255,.06);padding-top:10px;font-variant-numeric:tabular-nums}
.dg-winners{list-style:none;margin:-4px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.dg-winners li{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;background:#1c1c25;font-size:11.5px;color:#d4d4d8}
.dg-winners li em{font-style:normal;color:#71717a;font-variant-numeric:tabular-nums}
.dg-winners li.is-first{background:rgba(251,191,36,.12);color:#fde68a}
.dg-empty{margin:-4px 0 0;font-size:11.5px;color:#71717a}
.dg-btn{height:40px;padding:0 18px;border:0;border-radius:10px;background:#0099ff;color:#fff;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.dg-btn:hover:not(:disabled){background:#1aa5ff}
.dg-btn:disabled{opacity:.4;cursor:default}
.dg-btn.is-ghost{background:#22222c;color:#d4d4d8}.dg-btn.is-ghost:hover{background:#2a2a35}
.dg-actions{display:flex;justify-content:center;gap:8px}
.dg-history{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.dg-chip{display:inline-flex;align-items:center;gap:2px;padding:4px 9px;border-radius:8px;background:#1f1f29;font-size:12px;font-weight:700;color:#d4d4d8;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.dg-chip .material-icons-round{font-size:14px;color:#7cc4ff}
.dg-chip.is-miss{color:#8b8b95;text-decoration:line-through;text-decoration-color:#52525b}
.dg-chip.is-hit{background:rgba(74,222,128,.14);color:#86efac}
@keyframes dg-shake{0%,100%{transform:none}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
.is-shake{animation:dg-shake .32s ease}

/* Word */
.dg-board{display:grid;gap:5px;justify-content:center}
.dg-row{display:grid;grid-template-columns:repeat(5,48px);gap:5px}
.dg-tile{height:48px;display:grid;place-items:center;border-radius:8px;border:1.5px solid #2c2c36;font-size:21px;font-weight:800;color:#fff;background:transparent;text-transform:uppercase}
.dg-tile.is-filled{border-color:#52525b}
.dg-tile.is-hit{background:#3a9b5f;border-color:#3a9b5f}
.dg-tile.is-near{background:#c49a2c;border-color:#c49a2c}
.dg-tile.is-miss{background:#2a2a33;border-color:#2a2a33;color:#a1a1aa}
@keyframes dg-flip{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}100%{transform:rotateX(0)}}
.dg-row.is-reveal .dg-tile{animation:dg-flip .42s ease both;animation-delay:calc(var(--i) * 90ms)}
.dg-keys{display:flex;flex-direction:column;gap:5px;align-items:center}
.dg-keyrow{display:flex;gap:4px;justify-content:center;width:100%}
.dg-key{flex:1 1 0;max-width:34px;height:44px;border:0;border-radius:7px;background:#2b2b36;color:#e4e4e7;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;display:grid;place-items:center;padding:0}
.dg-key:hover{background:#353542}
.dg-key.is-wide{max-width:58px;flex:1.5 1 0;font-size:11px}
.dg-key .material-icons-round{font-size:17px}
.dg-key.is-hit{background:#3a9b5f;color:#fff}.dg-key.is-near{background:#c49a2c;color:#fff}.dg-key.is-miss{background:#1a1a21;color:#52525b}

/* Scramble */
.dg-scramble{display:flex;flex-direction:column;gap:14px;align-items:center}
.dg-slots{display:grid;grid-template-columns:repeat(6,44px);gap:6px;cursor:pointer}
.dg-slot{height:48px;border-radius:9px;border-bottom:2px solid #3f3f4a;background:#1a1a22;display:grid;place-items:center;font-size:21px;font-weight:800;color:#fff}
.dg-slot.is-filled{border-color:#0099ff}
.dg-pool{display:grid;grid-template-columns:repeat(6,44px);gap:6px}
.dg-letter{height:44px;border:0;border-radius:10px;background:#2b2b36;color:#fff;font:inherit;font-size:19px;font-weight:800;cursor:pointer;display:grid;place-items:center;box-shadow:inset 0 -3px 0 rgba(0,0,0,.25);transition:transform .12s,opacity .12s}
.dg-letter:hover:not(:disabled){transform:translateY(-2px);background:#343442}
.dg-letter.is-used{opacity:.18;cursor:default}
.dg-pool.is-static .dg-letter{cursor:default}
.dg-hint{margin:0;font-size:12px;color:#a1a1aa}.dg-hint b{color:#fde68a;letter-spacing:.08em}

/* Number */
.dg-number{display:flex;flex-direction:column;gap:12px}
.dg-range{position:relative;height:10px;border-radius:999px;background:#1f1f29;overflow:hidden}
.dg-range-fill{position:absolute;top:0;bottom:0;border-radius:999px;background:linear-gradient(90deg,#0099ff,#7cc4ff);transition:left .35s ease,width .35s ease}
.dg-range-labels{display:flex;justify-content:space-between;font-size:11px;color:#71717a;margin-top:-6px;font-variant-numeric:tabular-nums}
.dg-range-labels b{color:#e4e4e7;font-size:13px}
.dg-number-form{display:flex;gap:8px}
.dg-input{flex:1;min-width:0;height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:#0f0f13;color:#fff;font:inherit;font-size:20px;font-weight:700;text-align:center;font-variant-numeric:tabular-nums;outline:0}
.dg-input:focus{border-color:#0099ff;box-shadow:0 0 0 3px rgba(0,153,255,.18)}
.dg-number .dg-btn{height:44px}

/* Code */
.dg-code{display:flex;flex-direction:column;gap:6px;align-items:center}
.dg-code-row{display:flex;align-items:center;gap:14px;padding:5px 10px;border-radius:10px;background:#1a1a22}
.dg-code-row.is-current{background:transparent;border:1px dashed #33333d}
.dg-code-digits{display:flex;gap:6px}
.dg-peg{width:30px;height:30px;border-radius:50%;border:0;display:grid;place-items:center;font:inherit;font-size:13px;font-weight:800;color:#0b0b10;font-style:normal}
.dg-peg.is-empty{background:#22222c;box-shadow:inset 0 0 0 1.5px #33333d}
.dg-peg.d1{background:#f87171}.dg-peg.d2{background:#fbbf24}.dg-peg.d3{background:#4ade80}.dg-peg.d4{background:#60a5fa}.dg-peg.d5{background:#c084fc}.dg-peg.d6{background:#f9fafb}
.dg-code-marks{display:grid;grid-template-columns:repeat(2,9px);gap:4px;width:22px}
.dg-code-marks i,.dg-legend i{width:9px;height:9px;border-radius:50%;background:#2c2c36;display:inline-block}
.dg-code-marks i.is-exact,.dg-legend i.is-exact{background:#4ade80}
.dg-code-marks i.is-near,.dg-legend i.is-near{background:transparent;box-shadow:inset 0 0 0 2px #fbbf24}
.dg-legend{margin:2px 0 0;display:flex;align-items:center;gap:6px;font-size:11px;color:#71717a}
.dg-legend i:not(:first-child){margin-left:8px}
.dg-pad{display:flex;gap:8px;align-items:center;margin-top:6px}
.dg-pad .dg-peg{width:38px;height:38px;font-size:15px;cursor:pointer;box-shadow:inset 0 -3px 0 rgba(0,0,0,.2);transition:transform .12s}
.dg-pad .dg-peg:hover{transform:translateY(-2px)}
.dg-pad-back{width:38px;height:38px;border:0;border-radius:10px;background:#22222c;color:#d4d4d8;cursor:pointer;display:grid;place-items:center}

@media (max-width:420px){
  .dg-row{grid-template-columns:repeat(5,44px)}.dg-tile{height:44px;font-size:19px}
  .dg-slots,.dg-pool{grid-template-columns:repeat(6,40px)}
  .dg-key{height:42px}
}
@media (prefers-reduced-motion:reduce){.dg-row.is-reveal .dg-tile,.is-shake{animation:none}}