/* ================= Hikari · daily puzzle ================= */
body.dgp{overflow-x:clip}
.dg-hero{position:relative;padding:108px 0 92px;color:#fff;isolation:isolate;overflow:hidden;background:linear-gradient(180deg,#0A0F24,#141038 70%,#1B1240)}
.dg-sky{position:absolute;inset:0;z-index:-1;pointer-events:none}
.dg-sky::before{content:"";position:absolute;inset:0;opacity:.5;background:radial-gradient(circle,rgba(255,255,255,.16) 1px,transparent 1.6px) 0 0/22px 22px;-webkit-mask:linear-gradient(#000,transparent 90%);mask:linear-gradient(#000,transparent 90%)}
.dg-sky i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;animation:dgDrift 16s ease-in-out infinite alternate}
.dg-sky i:nth-child(1){width:460px;height:320px;top:-120px;right:-40px;background:#F472B6}
.dg-sky i:nth-child(2){width:420px;height:300px;bottom:-170px;left:6%;background:#8B5CF6;animation-delay:-5s}
.dg-sky i:nth-child(3){width:280px;height:220px;top:20%;left:40%;background:#3DB4F2;opacity:.3;animation-delay:-9s}
@keyframes dgDrift{to{transform:translate(-50px,30px) scale(1.12)}}
.dg-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.dg-eb{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;font-size:13px;font-weight:800;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16)}
.dg-eb b{padding:1px 9px;border-radius:99px;background:#F472B6;font-size:12px}
.dg-next{font-size:13px;color:rgba(255,255,255,.75)}.dg-next b{font-variant-numeric:tabular-nums;color:#fff;letter-spacing:.04em}
.dg-hero h1{margin:16px 0 6px;font:400 clamp(38px,6vw,64px)/1.1 Lalezar,var(--font);background:linear-gradient(95deg,#fff,#FBCFE8 50%,#C4B5FD);-webkit-background-clip:text;background-clip:text;color:transparent}
.dg-hero p{margin:0;max-width:600px;color:rgba(255,255,255,.75);font-size:15px;line-height:1.9}
.dg-tabs{display:flex;gap:8px;margin-top:22px;flex-wrap:wrap}
.dg-tabs button{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px;border-radius:14px;font:800 14.5px var(--font);color:rgba(255,255,255,.85);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);transition:all .2s}
.dg-tabs button i{font-style:normal;font-size:12px}
.dg-tabs button:hover{background:rgba(255,255,255,.15)}
.dg-tabs button.on{background:#fff;color:#1B1240;box-shadow:0 10px 30px -8px rgba(244,114,182,.7)}

.dg-main{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;margin-top:-56px;position:relative;z-index:2;align-items:start;padding-bottom:30px}
.dg-loading{padding:60px 20px;text-align:center;color:var(--muted);background:var(--fg);border-radius:22px;box-shadow:var(--shadow)}
.dg-stage{display:grid;grid-template-columns:300px minmax(0,1fr);gap:22px;padding:20px;border-radius:24px;background:var(--fg);box-shadow:var(--shadow)}
.dg-stage.win{box-shadow:0 0 0 2px #2BA36B,var(--shadow)}
.dg-pic{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;position:relative;aspect-ratio:2/3;border-radius:18px;overflow:hidden;background:#0E1428;align-self:start;box-shadow:0 18px 40px -16px rgba(0,0,0,.5)}
.dg-pic canvas{display:block;width:100%;height:100%;object-fit:cover;filter:blur(calc(var(--b) * .35)) saturate(1.1);transform:scale(calc(1 + var(--b) / 120));transition:filter .9s ease,transform .9s ease;pointer-events:none}
.dg-q{position:absolute;inset:0;display:grid;place-items:center;font:400 120px/1 Lalezar,sans-serif;color:rgba(255,255,255,.85);text-shadow:0 6px 30px rgba(0,0,0,.4);pointer-events:none}
.dg-left{position:absolute;top:12px;right:12px;padding:3px 11px;border-radius:99px;font-size:12px;font-weight:800;color:#fff;background:rgba(10,15,36,.7);backdrop-filter:blur(6px)}
.dg-play{min-width:0;display:flex;flex-direction:column;gap:14px}
.dg-play h2{margin:4px 0 0;font-size:20px;color:var(--strong)}
.dg-pips{display:flex;gap:7px}
.dg-pips i{flex:1;max-width:46px;height:8px;border-radius:99px;background:var(--fg2);box-shadow:inset 0 0 0 1px var(--line)}
.dg-pips i.no{background:#E5484D;box-shadow:none}.dg-pips i.ok{background:#2BA36B;box-shadow:none}
.dg-pips i.now{background:linear-gradient(90deg,var(--blue),#8B5CF6);animation:dgPulse 1.4s ease-in-out infinite}
@keyframes dgPulse{50%{opacity:.45}}
.dg-input{position:relative}
.dg-input input{width:100%;height:54px;border-radius:15px;border:2px solid var(--line);background:var(--fg2);color:var(--strong);padding:0 16px;font:600 15.5px var(--font);transition:border-color .2s,box-shadow .2s}
.dg-input input:focus{outline:none;border-color:#8B5CF6;box-shadow:0 0 0 5px rgba(139,92,246,.15)}
.dg-sugg{position:absolute;top:60px;inset-inline:0;z-index:5;background:var(--fg);border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.25),0 0 0 1px var(--line);padding:5px;max-height:330px;overflow:auto}
.dg-s{display:flex;align-items:center;gap:11px;width:100%;padding:7px 9px;border-radius:10px;text-align:start;color:inherit}
.dg-s:hover,.dg-s.on{background:var(--fg2)}
.dg-s .cv{width:34px;height:48px;flex:none;border-radius:6px;background:center/cover no-repeat}
.dg-s b{display:block;font-size:14px;color:var(--strong)}.dg-s b.lat{direction:ltr;text-align:right}
.dg-s small{font-size:11.5px;color:var(--muted)}
.dg-none{padding:14px;text-align:center;color:var(--muted);font-size:13px}
.dg-hint{margin:-4px 0 0;font-size:12.5px;color:var(--muted)}
.dg-clues{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}
.dg-clue{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;padding:11px 13px;border-radius:13px;background:linear-gradient(135deg,rgba(139,92,246,.1),rgba(61,180,242,.08));border:1px solid rgba(139,92,246,.22)}
.dg-clue span{grid-row:1/3;font-size:22px;align-self:center}
.dg-clue small{font-size:11px;color:var(--muted);font-weight:700}
.dg-clue b{font-size:13.5px;color:var(--strong);line-height:1.6}
.dg-clue.lock{background:var(--fg2);border:1px dashed var(--line);opacity:.7}.dg-clue.lock b{font-weight:500;color:var(--muted);font-size:12px}
.dg-clue.new{animation:dgNew .7s cubic-bezier(.2,1.4,.4,1)}
@keyframes dgNew{from{transform:scale(.7);opacity:0}}
.dg-guesses{display:grid;gap:6px}
.dg-g{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:11px;font-size:13.5px;font-weight:700;color:var(--strong);animation:dgNew .4s ease}
.dg-g.no{background:rgba(229,72,77,.1)}.dg-g.ok{background:rgba(43,163,107,.14)}
.dg-res{display:grid;gap:12px;animation:dgNew .6s ease}
.dg-res-h b{font-size:17px;color:var(--strong)}
.dg-ans{display:grid;gap:2px;padding:16px 18px;border-radius:16px;text-decoration:none;color:#fff;background:linear-gradient(135deg,#8B5CF6,#3DB4F2);box-shadow:0 14px 30px -14px #8B5CF6}
.dg-ans small{font-size:12px;opacity:.85}.dg-ans strong{font:400 26px/1.3 Lalezar,var(--font)}.dg-ans span{font-size:12.5px;opacity:.85}.dg-ans em{font-style:normal;font-size:12.5px;font-weight:800;margin-top:4px}
.dg-share{display:flex;gap:8px;flex-wrap:wrap}
.dg-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:44px;padding:0 18px;border-radius:13px;font:800 14px var(--font);text-decoration:none;color:var(--strong);background:var(--fg2);border:1px solid var(--line);cursor:pointer;transition:transform .15s}
.dg-btn:active{transform:scale(.97)}
.dg-btn.pri{color:#fff;border:0;background:linear-gradient(135deg,#F472B6,#8B5CF6);box-shadow:0 10px 24px -10px #F472B6}
.dg-btn.wide{width:100%;margin-top:10px}

.dg-side{display:grid;gap:16px}
.dg-card{padding:18px;border-radius:20px;background:var(--fg);box-shadow:var(--shadow-s)}
.dg-card h3{margin:0 0 12px;font-size:15px;color:var(--strong);display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap}
.dg-card h3 small{font-size:11.5px;font-weight:600;color:var(--muted)}
.dg-nums{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center;margin-bottom:14px}
.dg-nums b{display:block;font:400 26px/1.1 Lalezar,var(--font);color:var(--strong)}.dg-nums small{font-size:11px;color:var(--muted)}
.dg-dist{display:grid;gap:5px}
.dg-dist div{display:grid;grid-template-columns:16px 1fr;gap:8px;align-items:center;font-size:12px;font-weight:800;color:var(--muted)}
.dg-dist i{display:block;width:var(--w);min-width:24px;height:22px;border-radius:7px;background:var(--fg2);position:relative;transition:width .6s}
.dg-dist i b{position:absolute;inset-inline-end:7px;top:2px;font-size:11.5px;color:var(--strong)}
.dg-dist .me i{background:linear-gradient(90deg,#2BA36B,#4ADE80)}.dg-dist .me i b{color:#fff}
.dg-top{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.dg-top li{display:flex;align-items:center;gap:9px;padding:7px 6px;border-radius:10px;font-size:13px}
.dg-top li:nth-child(-n+3){background:var(--fg2)}
.dg-top .rk{width:24px;text-align:center;font-weight:800;color:var(--muted)}
.dg-top a{flex:1;min-width:0;display:flex;align-items:center;gap:8px;color:var(--strong);font-weight:700;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-top .av{width:28px;height:28px;flex:none;border-radius:50%;background:center/cover;display:grid;place-items:center;color:#fff;font-size:12px}
.dg-top em{font-style:normal;font-size:11.5px;color:var(--muted);white-space:nowrap}
.dg-empty{margin:0;color:var(--muted);font-size:13px;text-align:center;padding:10px}

@media (max-width:980px){.dg-main{grid-template-columns:1fr}.dg-side{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}}
@media (max-width:680px){
  .dg-hero{padding:90px 0 80px}.dg-tabs button{flex:1;justify-content:center;padding:0 10px}
  .dg-stage{grid-template-columns:1fr;padding:14px;gap:14px}
  .dg-pic{width:min(240px,70%);justify-self:center}
}
@media (prefers-reduced-motion:reduce){.dg-sky i,.dg-pips i.now,.dg-clue.new{animation:none}}

/* 📺 Friday nostalgia */
.dg-nos{display:flex;align-items:center;gap:12px;margin-bottom:14px;padding:12px 16px;border-radius:16px;text-decoration:none;color:#FBEFD9;background:linear-gradient(135deg,#5A2E14,#2A140B);box-shadow:0 10px 26px -12px rgba(242,169,59,.6),inset 0 0 0 1px rgba(242,169,59,.35)}
.dg-nos>span{font-size:30px}.dg-nos b{display:block;font:400 20px Lalezar,var(--font);color:#FFD27A}.dg-nos small{display:block;font-size:12px;opacity:.8;line-height:1.8}
.dg-nos em{margin-inline-start:auto;font-style:normal;font-weight:800;color:#FFD27A;white-space:nowrap;font-size:13px}

/* 🎲 four choices + 🏳 give up */
.dg-mcbtn{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center;width:100%;padding:12px 16px;border:0;border-radius:16px;cursor:pointer;text-align:right;color:#fff;font:inherit;
  background:linear-gradient(135deg,#8B5CF6,#EC4899);box-shadow:0 14px 30px -14px rgba(139,92,246,.9);transition:transform .15s}
.dg-mcbtn:hover{transform:translateY(-2px)}.dg-mcbtn:active{transform:scale(.98)}
.dg-mcbtn span{grid-row:1/3;font-size:26px}.dg-mcbtn b{font-size:15px;font-weight:900}.dg-mcbtn small{font-size:12px;opacity:.85}
.dg-mcsoon{margin:0;font-size:12.5px;color:var(--muted);padding:10px 14px;border-radius:12px;border:1px dashed var(--line)}
.dg-mc{display:grid;gap:12px}
.dg-mc-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.dg-mc-h b{font-size:15.5px;color:var(--strong)}.dg-mc-h small{font-size:12px;color:var(--muted)}
.dg-mc-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.dg-opt{display:flex;align-items:center;gap:10px;min-height:62px;padding:10px 12px;border-radius:16px;border:2px solid var(--line);background:var(--fg2);color:var(--strong);font:700 14px/1.5 var(--font);text-align:right;cursor:pointer;
  animation:dgOpt .4s calc(var(--i) * 70ms) both;transition:border-color .15s,transform .15s,background .15s}
.dg-opt:hover{border-color:#8B5CF6;background:color-mix(in srgb,#8B5CF6 10%,var(--fg2));transform:translateY(-2px)}
.dg-opt em{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:10px;font-style:normal;font-weight:900;font-size:13px;color:#fff;background:linear-gradient(135deg,#8B5CF6,#EC4899)}
.dg-opt span{min-width:0;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
@keyframes dgOpt{from{opacity:0;transform:translateY(8px)}}
.dg-giveup{justify-self:start;margin-top:-2px;padding:6px 2px;border:0;background:none;color:var(--muted);font:600 12.5px var(--font);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.dg-giveup:hover{color:var(--strong)}
@media (max-width:520px){.dg-mc-g{grid-template-columns:minmax(0,1fr)}.dg-opt{min-height:52px}}
html.lite .dg-opt{animation:none}