:root{--bg:#f4f6fb;--surface:#fff;--fg:#1b1f2a;--muted:#6b7385;--border:#e3e7ef;--accent:#4f46e5;--accent-hover:#4338ca;--accent-soft:#eef0ff;--terminal-bg:#0f172a;--terminal-fg:#d1fae5;--radius:12px;--radius-sm:8px;--shadow:0 1px 2px #1018280a, 0 4px 16px #1018280f}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);-webkit-font-smoothing:antialiased;margin:0;padding:48px 16px 64px;font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}main{max-width:780px;margin:0 auto}h1{letter-spacing:-.02em;margin:0 0 6px;font-size:2rem;font-weight:700}.sub{color:var(--muted);margin:0 0 32px}code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:20px;padding:20px}.head{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.head strong{font-size:1.05rem}.head span{color:var(--muted);font-size:14px}.head a{color:var(--accent);border-radius:6px;padding:2px 8px;font-weight:500;text-decoration:none;transition:background .15s}.head a:hover{background:var(--accent-soft)}.fields{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px;display:grid}input[type=text],select{width:100%;font:inherit;color:var(--fg);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 12px;transition:border-color .15s,box-shadow .15s}input[type=text]::placeholder{color:#a0a7b8}input[type=text]:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:none}select{cursor:pointer;margin-top:8px}.items{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;display:grid}.item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;align-items:flex-start;gap:10px;padding:10px 12px;transition:border-color .15s,background .15s,transform .1s;display:flex}.item:hover{border-color:var(--accent);transform:translateY(-1px)}.item:has(input:checked){background:var(--accent-soft);border-color:var(--accent)}.item code{font-weight:600}.item small{color:var(--muted);margin-top:2px;font-size:12px;line-height:1.4;display:block}input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent);cursor:pointer;margin-top:4px}.bar{align-items:center;gap:12px;margin:24px 0 12px;display:flex}button{font:inherit;color:#fff;background:var(--accent);border-radius:var(--radius-sm);cursor:pointer;border:0;padding:10px 20px;font-weight:600;transition:background .15s,transform .1s;box-shadow:0 1px 2px #4f46e54d}button:hover{background:var(--accent-hover)}button:active{transform:scale(.97)}button:focus-visible{outline:3px solid var(--accent-soft);outline-offset:2px}#msg{color:#16a34a;font-size:14px;font-weight:500}pre{color:var(--terminal-fg);background:var(--terminal-bg);border-radius:var(--radius);box-shadow:var(--shadow);margin:0;padding:20px;font-size:13px;line-height:1.7;overflow-x:auto}#hint{color:var(--muted);margin-top:12px;font-size:13px}#hint code{background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:2px 6px}@media (width<=520px){body{padding:24px 12px 48px}h1{font-size:1.6rem}.fields{grid-template-columns:1fr}}