:root { --bg:#f6f7f9; --card:#fff; --ink:#1d2430; --muted:#5d6878; --line:#dde2e8; --accent:#2457d6;
        --good:#137a3f; --warn:#a15c00; --bad:#b42318; --chip:#eef1f6; }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; background:var(--bg); color:var(--ink); }
a { color:var(--accent); }
header { background:var(--card); border-bottom:1px solid var(--line); padding:10px 16px; display:flex; gap:18px;
         align-items:center; flex-wrap:wrap; }
header .brand { font-weight:700; margin-right:8px; }
header nav a { text-decoration:none; color:var(--ink); padding:6px 10px; border-radius:6px; }
header nav a.on { background:var(--chip); font-weight:600; }
header form { margin-left:auto; }
main { max-width:1200px; margin:0 auto; padding:16px; }
.flash { background:#fff8e1; border:1px solid #f1d58a; padding:10px 14px; border-radius:8px; margin-bottom:12px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px; margin-bottom:14px; }
.tabs { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
.tabs a { padding:8px 12px; border-radius:8px; background:var(--card); border:1px solid var(--line); text-decoration:none; color:var(--ink); }
.tabs a.on { border-color:var(--accent); color:var(--accent); font-weight:600; }
.bar { position:sticky; top:0; background:var(--bg); padding:8px 0; display:flex; gap:8px; flex-wrap:wrap; z-index:2; }
button, .btn { font:inherit; padding:8px 14px; border-radius:8px; border:1px solid var(--line); background:var(--card);
               cursor:pointer; color:var(--ink); text-decoration:none; display:inline-block; }
button.primary { background:var(--accent); border-color:var(--accent); color:#fff; font-weight:600; }
button:disabled { opacity:.5; cursor:not-allowed; }
.row { display:grid; grid-template-columns:28px 120px 1fr; gap:14px; align-items:start; }
.row img.cover { width:120px; height:160px; object-fit:cover; border-radius:8px; background:var(--chip); }
.row .ph { width:120px; height:90px; border-radius:8px; background:var(--chip); }
.chips { display:flex; gap:6px; flex-wrap:wrap; margin:6px 0; }
.chip { background:var(--chip); border-radius:999px; padding:2px 10px; font-size:14px; }
.chip.good { background:#e6f4ea; color:var(--good); } .chip.warn { background:#fff3e0; color:var(--warn); }
.chip.bad { background:#fdecea; color:var(--bad); }
.muted { color:var(--muted); font-size:14px; }
.cap { white-space:pre-wrap; overflow-wrap:anywhere; }
table { width:100%; border-collapse:collapse; background:var(--card); }
th, td { text-align:left; padding:8px; border-bottom:1px solid var(--line); vertical-align:top; font-size:15px; }
label { display:block; font-weight:600; margin:12px 0 4px; }
.hint { font-weight:400; color:var(--muted); font-size:14px; }
input[type=text], input[type=password], input[type=number], select, textarea { font:inherit; padding:8px; border:1px solid var(--line);
       border-radius:8px; width:100%; max-width:520px; background:#fff; }
textarea { min-height:120px; max-width:720px; }
.grid2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:14px; }
.checks label { display:inline-flex; gap:6px; font-weight:400; margin:4px 14px 4px 0; }
.copy { display:flex; gap:8px; align-items:flex-start; margin:6px 0; }
.copy textarea { min-height:70px; }
@media (max-width:640px) { .row { grid-template-columns:28px 1fr; } .row .media { display:none; } }
.clamp { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.row input[type=checkbox] { width:22px; height:22px; margin-top:4px; cursor:pointer; }