.preview-banner{background:#7c2d12;color:#fff;text-align:center;padding:8px 12px;font-weight:700;font-size:14px}
.level-pill{display:inline-block;border-radius:999px;padding:4px 12px;font-weight:800;font-size:13px;margin:0 0 10px}
.pill-easy{background:#ecfdf5;color:#047857;border:1px solid #34d399}
.pill-med{background:#fff7ed;color:#c2410c;border:1px solid #fdba74}
.pill-hard{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}
.whh{margin:8px 0 4px}.whh strong{color:#0B3D24}
.steps ol{margin:6px 0 6px 1.2rem;padding:0}
.fictional{background:#fff7ed;border:1px solid #fdba74;border-left:6px solid #c2410c;border-radius:10px;padding:10px 16px;margin:12px 0 20px}
.about-data{background:#eff6ff;border:1px solid #93c5fd;border-left:6px solid #1d4ed8;border-radius:10px;padding:12px 16px;margin:14px 0 20px}
.bug-card{background:var(--bg2,#f4f8f5);border:1px solid var(--line,#d7e3db);border-left:6px solid #b45309;border-radius:12px;padding:12px 16px;margin:14px 0}
.bug-card h3{margin:0 0 6px;font-size:1.05rem}
.bug-card .mini{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;background:#0B3D24;color:#ecfdf5;padding:8px 10px;border-radius:8px;overflow:auto;margin:8px 0}
.practice-list>li{margin:12px 0;padding:10px 14px;background:var(--bg2,#f4f8f5);border-radius:10px;border:1px dashed #0E7C86}
.hint{margin-top:6px;font-size:14.5px;color:var(--muted,#5b6b62)}
.quiz-box{background:var(--bg2,#f4f8f5);border:1px solid var(--line,#d7e3db);border-left:6px solid #0E7C86;border-radius:12px;padding:14px 18px;margin:18px 0}
.quiz-box .q{margin:10px 0 6px;font-weight:700}
.quiz-box label{display:block;margin:4px 0;padding:6px 10px;border-radius:8px;cursor:pointer}
.quiz-box label:hover{background:rgba(0,0,0,.04)}
.checker{background:#f8fafc;border:1px solid #cbd5e1;border-radius:12px;padding:14px 16px;margin:16px 0}
.checker input[type=text]{width:100%;max-width:520px;padding:8px 10px;border:1px solid #cbd5e1;border-radius:8px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:14px}
.checker .row{margin:10px 0}
.btn{appearance:none;border:0;background:#0E7C86;color:#fff;font-weight:700;padding:9px 14px;border-radius:10px;cursor:pointer;font-size:14px}
.btn.ghost{background:#fff;color:#0B3D24;border:1px solid var(--line,#d7e3db);text-decoration:none;display:inline-block}
.ok{color:#047857;font-weight:700}.bad{color:#b91c1c;font-weight:700}
.challenge-nav{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 18px}
.challenge-nav a{border:1px solid var(--line,#d7e3db);border-radius:999px;padding:6px 12px;text-decoration:none;color:#0B3D24;font-weight:600;font-size:14px}
.challenge-nav a.on{background:#0E7C86;color:#fff;border-color:#0E7C86}
.card-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:18px 0}
.chal-card{border:1px solid var(--line,#d7e3db);border-radius:14px;padding:16px;background:var(--bg,#fff)}
.chal-card h2{margin:6px 0 8px;font-size:1.15rem}
.dl-row{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}
details.sol{margin:12px 0;border:1px solid #d7e3db;border-radius:10px;padding:8px 12px;background:#fff}
details.sol summary{cursor:pointer;font-weight:700;color:#0B3D24}
