:root{--bg:#f6f5f2;--fg:#1d1d1b;--mut:#6b6a66;--card:#fff;--line:#dcdad3;--pri:#2f5d50;--err:#b3261e}
@media (prefers-color-scheme:dark){:root{--bg:#161715;--fg:#ecebe6;--mut:#a09f98;--card:#1f201e;--line:#34352f;--pri:#6fb39f;--err:#ff8a80}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;padding:env(safe-area-inset-top) 16px env(safe-area-inset-bottom)}
header{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
header[hidden],main[hidden],section[hidden],form[hidden],p[hidden]{display:none}
.sp{flex:1}.s{color:var(--mut);font-size:.9rem}.err{color:var(--err);min-height:1.2em;margin:.5em 0 0}
nav button{background:none;border:0;border-bottom:2px solid transparent;border-radius:0;padding:6px 10px;color:var(--mut)}
nav button.on{color:var(--fg);border-bottom-color:var(--pri)}
button,input{font:inherit;color:inherit}
button{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:8px 14px;cursor:pointer;min-height:40px}
button.pri{background:var(--pri);color:#fff;border-color:var(--pri)}
input{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:9px 12px;min-height:40px;width:100%}
#login{max-width:360px;margin:12vh auto 0}
#lf{display:flex;flex-direction:column;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px}
#lf h1{margin:0 0 4px;font-size:1.5rem}
label{display:flex;flex-direction:column;gap:4px;font-size:.9rem;color:var(--mut)}
label.chk{flex-direction:row;align-items:center;gap:8px}label.chk input{width:auto;min-height:0}
.bar{display:flex;gap:8px;margin:14px 0;align-items:center;flex-wrap:wrap}
.bar input[type=search]{flex:1;min-width:180px}
.plist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.plist li{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
footer{padding:24px 0;text-align:center}