:root{--bg:#f4f4f2;--card:#fff;--ink:#1c1c1a;--mute:#6a6a64;--line:#dcdcd4;--acc:#b3261e;--acc-ink:#fff;--ok:#1d6b3a;--warn:#946200;--bad:#b3261e;--info:#2a5ea8;--chip:#ececE4}
@media (prefers-color-scheme:dark){:root{--bg:#121211;--card:#1c1c1a;--ink:#ecece6;--mute:#9a9a92;--line:#33332f;--acc:#e0584f;--acc-ink:#121211;--ok:#59c27f;--warn:#e0b04a;--bad:#ef7a72;--info:#7aa7e8;--chip:#2a2a27}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
.top{padding:18px 16px 6px;max-width:860px;margin:0 auto}
.top h1{margin:0;font-size:1.5rem;letter-spacing:.2px}
.sub{margin:4px 0 0;color:var(--mute)}
main{max-width:860px;margin:0 auto;padding:8px 12px 40px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;margin:12px 0}
.card h2{margin:0 0 10px;font-size:1.05rem}
.card h2:not(:first-child){margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
label{display:block;font-size:.82rem;color:var(--mute);margin:8px 0 0}
input,select{width:100%;margin-top:3px;padding:10px;font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px}
input:focus,select:focus,button:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.row2,.row3{display:grid;gap:10px}
.row2{grid-template-columns:1fr 1fr}.row3{grid-template-columns:1fr 1fr 1fr}
@media (max-width:560px){.row3{grid-template-columns:1fr 1fr}.row3>label:last-child:nth-child(odd){grid-column:1/-1}}
@media (max-width:380px){.row2,.row3{grid-template-columns:1fr}}
.hint{color:var(--mute);font-size:.82rem;margin:6px 0}
details{margin-top:8px}summary{cursor:pointer;color:var(--mute);font-size:.88rem}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:var(--chip);border:1px solid var(--line);color:var(--ink);padding:8px 12px;border-radius:999px;font:inherit;font-size:.88rem;cursor:pointer}
.chip:hover{border-color:var(--acc)}
.btns{display:flex;flex-wrap:wrap;gap:8px;align-items:end}
button{font:inherit;padding:10px 14px;border-radius:8px;border:1px solid var(--acc);background:var(--acc);color:var(--acc-ink);cursor:pointer}
button.alt{background:transparent;color:var(--ink);border-color:var(--line)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin:2px 0 4px}
.stat{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px}
.stat b{display:block;font-size:1.25rem}.stat span{font-size:.76rem;color:var(--mute)}
table{width:100%;border-collapse:collapse;margin-top:4px}
td{padding:7px 4px;border-top:1px solid var(--line);vertical-align:top}
td:first-child{color:var(--mute);width:46%}td:last-child{font-weight:600}
.note{font-size:.84rem;color:var(--mute);margin:8px 0 0}
.warns{list-style:none;padding:0;margin:0}
.warns li{padding:9px 10px;border-radius:8px;margin:6px 0;border-left:4px solid var(--info);background:var(--bg);font-size:.92rem}
.warns li.warn{border-color:var(--warn)}.warns li.bad{border-color:var(--bad)}
.tag{font-weight:700;font-size:.72rem;text-transform:uppercase;margin-right:6px}
.warns li.bad .tag{color:var(--bad)}.warns li.warn .tag{color:var(--warn)}.warns li.info .tag{color:var(--info)}
.verdict{font-weight:700}.ok{color:var(--ok)}.badc{color:var(--bad)}
footer{color:var(--mute);font-size:.82rem;margin-top:18px}
[hidden]{display:none!important}
@media print{body{background:#fff;color:#000}.card{break-inside:avoid;border-color:#999}#presets,#f,#saveBox,footer .hint{display:none}button{display:none}}

.tabs{max-width:860px;margin:6px auto 0;padding:0 12px;display:flex;gap:6px}
.tab{background:var(--chip);color:var(--ink);border:1px solid var(--line);padding:9px 16px;border-radius:10px 10px 0 0}
.tab.on{background:var(--card);border-bottom-color:var(--card);font-weight:700;color:var(--acc)}
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.grid{min-width:560px;font-variant-numeric:tabular-nums}
table.grid th,table.grid td{padding:6px 7px;text-align:center;border:1px solid var(--line);font-weight:600;width:auto}
table.grid th{color:var(--mute);font-size:.76rem;font-weight:600;background:var(--bg)}
table.grid td:first-child{color:var(--ink);width:auto}
table.grid td.na{color:var(--mute);font-weight:400}
@media print{.tabs{display:none}#tab-tune[hidden]{display:block!important}}

.card h3{margin:14px 0 2px;font-size:.92rem;color:var(--mute);font-weight:600}
.chart{width:100%;height:auto;margin-top:6px}
.chart text{fill:var(--mute);font-size:11px}
.chart .hp{stroke:var(--acc);fill:none;stroke-width:2.5}
.chart .tq{stroke:var(--info);fill:none;stroke-width:2.5}
.chart .ax{stroke:var(--line);stroke-width:1}
.leg span{display:inline-block;margin-right:14px;font-size:.82rem;color:var(--mute)}
.leg i{display:inline-block;width:14px;height:3px;vertical-align:middle;margin-right:5px}
