:root { --bg:#f4f6f9; --card:#fff; --ink:#1b2330; --muted:#6b7686; --pri:#1f6feb; --ok:#1a7f37; --warn:#9a6700; --err:#cf222e; --line:#e3e8ef; }
* { box-sizing: border-box; }
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Segoe UI",sans-serif; background:var(--bg); color:var(--ink); padding:0 0 env(safe-area-inset-bottom); }
header { display:flex; align-items:baseline; gap:.6rem; padding:1rem 1rem .6rem; }
header h1 { font-size:1.15rem; margin:0; }
.muted { color:var(--muted); font-size:.85rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:14px; margin:.6rem .8rem; padding:1rem; }
h2 { font-size:1rem; margin:.1rem 0 .7rem; }
.row { display:flex; align-items:center; gap:.6rem; margin:.5rem 0; }
.btns { gap:.8rem; }
select { padding:.5rem .6rem; border-radius:9px; border:1px solid var(--line); font-size:1rem; flex:1; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.4rem; padding:.85rem 1rem; border-radius:11px; border:1px solid var(--line); background:#fff; font-size:1rem; cursor:pointer; flex:1; }
.btn.primary { background:var(--pri); color:#fff; border-color:var(--pri); }
.btn.ghost { background:transparent; color:var(--muted); width:calc(100% - 1.6rem); margin:.4rem .8rem 1.2rem; }
.status { margin:.2rem .8rem; padding:.55rem .8rem; border-radius:9px; font-size:.9rem; min-height:1.2rem; }
.status.ok { background:#e6f4ea; color:var(--ok); }
.status.warn { background:#fff4e0; color:var(--warn); }
.status.err { background:#ffebe9; color:var(--err); }
.results { list-style:none; padding:0; margin:0; }
.results li { border-top:1px solid var(--line); padding:.6rem 0; font-size:.9rem; }
.results li:first-child { border-top:none; }
footer { text-align:center; padding:1rem; }
code { background:#eef1f5; padding:.1rem .3rem; border-radius:5px; }