*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;margin:0;background:linear-gradient(135deg,#fdf2ff,#e6f7ff);color:#2b2b40;-webkit-text-size-adjust:100%}
.w{max-width:780px;margin:auto;padding:12px}
h1{font-size:22px;text-align:center;margin:10px 0 4px;color:#7a3cff}
h2{font-size:19px;margin:18px 4px 6px;color:#7a3cff}
.sub{text-align:center;color:#666;font-size:14px;margin:0 0 8px}
.card{background:#fff;border-radius:18px;box-shadow:0 4px 18px #0001;padding:12px;margin:10px 0}
canvas{width:100%;display:block;touch-action:pan-y}
input[type=range]{width:100%;accent-color:#ff4fa3;height:30px}
.ctl label{display:block;font-size:16px;margin-top:4px}
.ctl label b{color:#7a3cff}
.vals{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;font-size:14px;margin-top:6px}
.vals div{background:#f5f0ff;border-radius:10px;padding:7px 4px;text-align:center}
.vals div b{display:block;font-size:18px;color:#7a3cff;direction:ltr}
.vals div.obj{background:#ffe9f4}.vals div.obj b{color:#e2367f}
.btns{display:flex;gap:8px;flex-wrap:wrap}
button.go{flex:1;background:#22c58b;color:#fff;border:0;border-radius:12px;padding:11px 12px;font-size:16px;margin-top:8px;font-family:inherit}
button.go.alt{background:#ff8a3d}
.ok{background:#e8fff4;color:#118a5c;font-weight:bold;text-align:center;border-radius:10px;padding:8px;margin-top:8px;display:none;line-height:1.6}
p,li{line-height:1.7;margin:5px 0}
.m{direction:ltr;unicode-bidi:isolate;display:inline-block;font-family:"Cambria Math","STIX Two Math","Times New Roman",serif;font-size:1.06em;white-space:nowrap}
.q p{margin:4px 0}
.chips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:6px 0}
.chip{border-radius:999px;padding:3px 10px;font-size:13px;background:#efe7ff;color:#5a2bd6;border:0;font-family:inherit}
.chip.q571{background:#dff6ff;color:#0a6c91}.chip.q581{background:#fff1d6;color:#9a5a00}
details{margin-top:6px}summary{cursor:pointer;font-weight:bold;color:#7a3cff;font-size:16px;padding:6px 0}
.sol .ml{direction:ltr;text-align:left;font-family:"Cambria Math","Times New Roman",serif;background:#f7f5ff;border-radius:8px;padding:5px 9px;margin:4px 0;overflow-x:auto;white-space:nowrap}
.ans{background:#fff6d6;border-radius:10px;padding:8px;font-weight:bold;margin-top:8px}
.orig img{width:100%;border-radius:10px;border:1px solid #eee;background:#fff}
.nav{display:flex;justify-content:space-between;gap:8px;margin:10px 0}
.nav a{flex:1;text-align:center;background:#fff;border-radius:12px;padding:9px;color:#7a3cff;text-decoration:none;box-shadow:0 2px 8px #0001;font-size:15px}
.list a.pc{display:block;text-decoration:none;color:inherit;background:#fff;border-radius:16px;box-shadow:0 3px 12px #0001;padding:10px 12px;margin:8px 0;border-right:6px solid #ff4fa3}
.list a.pc.q581{border-right-color:#ffb020}.list a.pc.q571{border-right-color:#3cc8ff}
.pc .t{font-weight:bold;font-size:17px;color:#2b2b40}.pc .s{font-size:13px;color:#666;margin-top:2px}
.filters{position:sticky;top:0;z-index:5;background:#fffffff0;backdrop-filter:blur(4px);border-radius:0 0 16px 16px;padding:8px;box-shadow:0 3px 10px #0001}
.filters .row{display:flex;gap:6px;overflow-x:auto;padding:3px 0;-webkit-overflow-scrolling:touch}
.filters button{white-space:nowrap;border:1px solid #d9ccff;background:#fff;color:#5a2bd6;border-radius:999px;padding:6px 12px;font-size:14px;font-family:inherit}
.filters button.on{background:#7a3cff;color:#fff;border-color:#7a3cff}
.count{text-align:center;color:#666;font-size:13px;margin:6px}
.note{font-size:13px;color:#777}
.lh{color:#777;font-size:14px}
.m.mw{white-space:normal;overflow-wrap:anywhere}