*{box-sizing:border-box}
body{margin:0;background:#f5f7fb;color:#172033;font-family:-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',sans-serif}
header{height:66px;background:#fff;border-bottom:1px solid #e5e9f0;display:flex;align-items:center;gap:14px;padding:0 20px;position:sticky;top:0;z-index:20}
header b{color:#2457d6;letter-spacing:.03em}
main{max-width:1080px;margin:auto;padding:24px 16px 64px}
.card,.problem{background:#fff;border:1px solid #e5e9f0;border-radius:18px;padding:18px;margin-bottom:12px}
.hero{background:linear-gradient(135deg,#fff,#eef4ff)}
input{width:100%;padding:11px;border:1px solid #d8dee8;border-radius:10px;margin:5px 0 10px}
.btn{border:0;border-radius:10px;padding:10px 13px;font-weight:800;cursor:pointer}
.btn:disabled{opacity:.55;cursor:wait}
.primary{background:#2457d6;color:#fff}.soft{background:#eef4ff;color:#2457d6}.danger{background:#fff0f0;color:#c33}.ok{background:#eaf8ee;color:#187a38}.review-on{background:#fff7df;color:#9a6300}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.problem img,.solution img{width:100%;max-height:680px;object-fit:contain}
.muted{color:#667085}.hidden{display:none}.solution{border-top:1px solid #eee;margin-top:12px;padding-top:12px}
.dashboard{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 20px}
.stat{background:#fff;border:1px solid #e5e9f0;border-radius:16px;padding:14px}
.stat strong{display:block;font-size:24px;margin-top:4px}
.tabs{display:flex;gap:8px;overflow:auto;padding:4px 0 12px;position:sticky;top:66px;background:#f5f7fb;z-index:15}
.tabbtn{white-space:nowrap}.tabbtn.active{background:#2457d6;color:#fff}
.section-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:22px 2px 10px}
.badge{display:inline-block;border-radius:999px;padding:4px 8px;font-size:12px;font-weight:800;background:#eef4ff;color:#2457d6}
.state-line{font-size:13px;margin-top:8px}
.state-q{color:#c33;font-weight:800}.state-r{color:#9a6300;font-weight:800}.state-u{color:#187a38;font-weight:800}
.solution-shell{margin-top:14px;border-top:1px solid #e9edf3;padding-top:12px}
.solution-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.solution-tab.active{background:#172033;color:#fff}
.solution-pane{display:none}.solution-pane.active{display:block}
.solution-split{display:grid;grid-template-columns:minmax(240px,.9fr) minmax(0,1.1fr);gap:18px;align-items:start}
.solution-problem-ref,.solution-body{background:#fafbfc;border:1px solid #e7ebf0;border-radius:14px;padding:12px}
.solution-full .solution-body{width:100%}
.solution-method{margin-bottom:16px}
.solution-method h4{margin:2px 0 8px}
.video-link{display:block;padding:10px 12px;border-radius:10px;background:#eef4ff;color:#2457d6;text-decoration:none;font-weight:800;margin:6px 0}
.empty{padding:20px;text-align:center;color:#667085;background:#fff;border:1px dashed #d8dee8;border-radius:14px}
@media(max-width:760px){main{padding:16px 12px 48px}.dashboard{grid-template-columns:repeat(2,minmax(0,1fr))}.solution-split{grid-template-columns:1fr}.problem{padding:14px}}