:root{--bg:#f6f7f9;--card:#fff;--line:#e2e5ea;--text:#1b1f24;--muted:#626a75;--accent:#3559e0;--ok:#1f8a4c;--warn:#a15c00;--chip:#eef1f7}
@media (prefers-color-scheme:dark){:root{--bg:#121417;--card:#1b1e23;--line:#2f343c;--text:#e8eaed;--muted:#9aa3ad;--accent:#7d98ff;--ok:#4cc27e;--warn:#f0b35a;--chip:#252a33}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.55 system-ui,-apple-system,"Segoe UI","Malgun Gothic",sans-serif;padding:0 16px 40px;max-width:1100px;margin-inline:auto}
h1{margin:20px 0 4px;font-size:24px}
.sub{margin:0;color:var(--muted)}
.warn{margin:8px 0 0;font-size:13px;color:var(--warn)}
.muted{color:var(--muted);font-size:13px}
.summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin:16px 0}
.stat{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.stat b{display:block;font-size:22px}
.tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin-bottom:14px;overflow-x:auto}
.tabs button{border:0;background:none;padding:10px 12px;font:inherit;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap}
.tabs button[aria-selected=true]{color:var(--text);border-color:var(--accent);font-weight:600}
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
input,select,textarea{font:inherit;padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--text);max-width:100%}
#q{flex:1 1 200px}
.chk{display:flex;align-items:center;gap:6px;font-size:14px}
button,.btn{font:inherit;padding:7px 12px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--text);cursor:pointer;white-space:nowrap}
.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px}
.card h3{margin:0;font-size:16px;line-height:1.35}
.meta{display:flex;flex-wrap:wrap;gap:6px}
.chip{background:var(--chip);border-radius:999px;padding:2px 9px;font-size:12px}
.chip.k-cert{color:var(--accent)}.chip.k-course{color:var(--ok)}
.card .actions{margin-top:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.card a{color:var(--accent);font-size:14px}
.planrow{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:10px;display:grid;grid-template-columns:1fr auto;gap:8px}
.planrow h3{margin:0;font-size:15px}
.planrow .ctrl{display:flex;flex-wrap:wrap;gap:8px;align-items:center;grid-column:1/-1}
.planrow textarea{width:100%;grid-column:1/-1;min-height:40px}
.bar{height:8px;background:var(--chip);border-radius:99px;overflow:hidden;grid-column:1/-1}
.bar i{display:block;height:100%;background:var(--accent)}
.due{font-size:12px}.due.over{color:#d33}
.form{display:grid;gap:10px;max-width:480px}
.form label{display:grid;gap:4px}
.form .chk{display:flex}
.backup{margin-top:28px}
.empty{padding:30px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:12px}
