:root{--eg-bg:#FAF8F5;--eg-card:#FFF;--eg-text:#1A1A1A;--eg-muted:#6B6560;--eg-hint:#9C9690;--eg-accent:#2563EB;--eg-accent-light:#EFF6FF;--eg-accent-hover:#1D4ED8;--eg-border:#E5E0DA;--eg-border-strong:#C8C2BA;--eg-cell-sel:#BFDBFE;--eg-cell-hl:#DBEAFE;--eg-correct:#0D6846;--eg-wrong:#C0392B;--eg-wrong-bg:#FDEAEA;--eg-correct-bg:#E8F5EE;--eg-black:#1A1A1A;--eg-font-d:'Libre Baskerville',Georgia,serif;--eg-font-b:'DM Sans',-apple-system,sans-serif;--eg-cell:clamp(22px,calc((100vw - 3rem) / 16),40px);--eg-gap:1px;}
html[data-theme="dark"]{--eg-bg:#171412;--eg-card:#1E1B18;--eg-text:#EDE8E3;--eg-muted:#9C9690;--eg-hint:#6B6560;--eg-border:#2E2A26;--eg-border-strong:#3E3A36;--eg-cell-sel:#1E3A5F;--eg-cell-hl:#1A2E4A;--eg-black:#0A0908;--eg-accent:#60A5FA;--eg-accent-light:#1E3A5F;--eg-accent-hover:#93C5FD;--eg-correct-bg:#0D2818;--eg-wrong-bg:#2D1010;}

/* container */
.eg-cw{font-family:var(--eg-font-b);max-width:100%;}

/* toolbar */
.eg-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap;gap:8px;}
.eg-timer{font-variant-numeric:tabular-nums;font-size:14px;font-weight:600;color:var(--eg-muted);min-width:48px;}
.eg-actions{display:flex;gap:6px;flex-wrap:wrap;}

/* buttons */
.eg-btn{font-family:var(--eg-font-b);font-size:12px;font-weight:500;padding:6px 14px;border-radius:100px;border:1px solid var(--eg-border);background:var(--eg-card);color:var(--eg-text);cursor:pointer;transition:background .12s,border-color .12s;white-space:nowrap;}
.eg-btn:hover{border-color:var(--eg-border-strong);background:var(--eg-accent-light);}
.eg-btn-primary{background:var(--eg-accent);color:#fff;border-color:var(--eg-accent);}
.eg-btn-primary:hover{background:var(--eg-accent-hover);border-color:var(--eg-accent-hover);}

/* current clue bar */
.eg-current-clue{display:flex;align-items:baseline;gap:8px;padding:10px 14px;background:var(--eg-accent-light);border-radius:8px;margin-bottom:16px;font-size:14px;line-height:1.4;min-height:42px;}
.eg-clue-num{font-weight:700;color:var(--eg-accent);white-space:nowrap;}

/* layout: grid + clues side by side */
.eg-layout{display:flex;gap:24px;align-items:flex-start;}
@media(max-width:760px){.eg-layout{flex-direction:column;}}

/* grid */
.eg-grid-wrap{flex-shrink:0;}
.eg-grid{display:grid;gap:var(--eg-gap);background:var(--eg-black);border:2px solid var(--eg-black);line-height:1;}

/* cells */
.eg-cell{position:relative;width:var(--eg-cell);height:var(--eg-cell);background:var(--eg-card);overflow:hidden;}
.eg-cell.black{background:var(--eg-black);}
.eg-cell .num{position:absolute;top:1px;left:2px;font-size:clamp(6px,1.5vw,9px);font-weight:600;color:var(--eg-muted);line-height:1;pointer-events:none;z-index:1;}
.eg-cell input{position:absolute;inset:0;width:100%;height:100%;border:none;outline:none;background:transparent;text-align:center;font-size:clamp(11px,3vw,18px);font-weight:600;font-family:var(--eg-font-b);color:var(--eg-text);caret-color:transparent;padding:0;z-index:2;}
.eg-cell input:focus{outline:none;}
.eg-cell.highlighted{background:var(--eg-cell-hl);}
.eg-cell.selected{background:var(--eg-cell-sel);}
.eg-cell.correct{background:var(--eg-correct-bg);}
.eg-cell.correct input{color:var(--eg-correct);}
.eg-cell.wrong{background:var(--eg-wrong-bg);}
.eg-cell.wrong input{color:var(--eg-wrong);}

/* clue panels */
.eg-clues{flex:1;min-width:0;max-height:calc(var(--eg-cell)*15 + var(--eg-gap)*14 + 4px);overflow-y:auto;display:flex;flex-direction:column;gap:16px;}
@media(max-width:760px){.eg-clues{max-height:300px;}}
.eg-clues h3{font-family:var(--eg-font-d);font-size:14px;font-weight:700;margin-bottom:6px;color:var(--eg-text);}
.eg-clue-item{display:flex;gap:6px;padding:5px 8px;border-radius:6px;font-size:13px;line-height:1.4;color:var(--eg-text);cursor:pointer;transition:background .1s;}
.eg-clue-item:hover{background:var(--eg-accent-light);}
.eg-clue-item.active{background:var(--eg-cell-hl);font-weight:500;}
.eg-clue-item.solved{opacity:.5;text-decoration:line-through;}
.eg-clue-item .cn{font-weight:700;color:var(--eg-accent);min-width:20px;flex-shrink:0;}

/* completion modal */
.eg-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:300;opacity:0;pointer-events:none;transition:opacity .25s;}
.eg-modal-overlay.show{opacity:1;pointer-events:auto;}
.eg-modal{background:var(--eg-card);border-radius:16px;padding:2.5rem 2rem;text-align:center;max-width:360px;width:90%;box-shadow:0 20px 60px rgba(0,0,0,.2);}
.eg-modal .trophy{font-size:48px;margin-bottom:12px;}
.eg-modal h2{font-family:var(--eg-font-d);font-size:22px;margin-bottom:6px;}
.eg-modal .stats{display:flex;justify-content:center;gap:24px;margin:20px 0 24px;}
.eg-modal .stat-val{font-size:22px;font-weight:700;color:var(--eg-accent);}
.eg-modal .stat-label{font-size:11px;color:var(--eg-muted);text-transform:uppercase;letter-spacing:1px;margin-top:2px;}

/* toast */
.eg-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--eg-text);color:var(--eg-bg);padding:10px 20px;border-radius:100px;font-size:13px;font-weight:500;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;z-index:250;}
.eg-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}