:root{--bg:#f6f7f9;--fg:#15181d;--mut:#5b6572;--card:#fff;--line:#d9dee5;--acc:#1b6ef3;--ok:#157f3b;--warn:#b45309;--bad:#b42318}
@media (prefers-color-scheme:dark){:root{--bg:#0f1216;--fg:#eceff3;--mut:#9aa5b1;--card:#181d24;--line:#2b333d;--acc:#5b9bff;--ok:#4cc77a;--warn:#f0a548;--bad:#ff7b72}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:18px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
main{max-width:860px;margin:0 auto;padding:12px 16px 48px}
nav{display:flex;gap:8px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--card);flex-wrap:wrap}
nav a,nav button{font:inherit;color:var(--fg);text-decoration:none;padding:10px 14px;border-radius:10px;background:none;border:0;min-height:44px;cursor:pointer}
nav .sp{flex:1}
h1{font-size:1.5rem;margin:.6em 0}
a{color:var(--acc)}
.card{display:flex;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px;margin:12px 0;text-decoration:none;color:inherit}
.card img,.card .ph{width:112px;height:80px;object-fit:cover;border-radius:8px;background:var(--line);flex:none}
.card b{display:block;overflow-wrap:anywhere}
.mut{color:var(--mut);font-size:.85rem}
.badge{display:inline-block;padding:2px 10px;border-radius:99px;font-size:.8rem;border:1px solid var(--line);margin-right:4px}
.badge.approved{color:var(--ok);border-color:var(--ok)}.badge.changes{color:var(--warn);border-color:var(--warn)}
.viewer video,.viewer img,.viewer object{width:100%;max-height:75vh;border-radius:10px;background:#000}
.viewer object{height:70vh;background:var(--card)}
.btn,button.btn{display:inline-block;font:inherit;font-weight:600;min-height:52px;padding:12px 20px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--fg);text-decoration:none;cursor:pointer;margin:4px 4px 4px 0}
.btn.ok{background:var(--ok);color:#fff;border-color:var(--ok)}.btn.pri{background:var(--acc);color:#fff;border-color:var(--acc)}
.actions{display:flex;flex-wrap:wrap;gap:4px;align-items:flex-start;margin:14px 0}
.actions form{margin:0}
details{width:100%}summary{list-style:none}summary::-webkit-details-marker{display:none}
textarea,input[type=password],input[type=file]{width:100%;font:inherit;padding:12px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--fg)}
textarea{min-height:120px}
.note,.flash{background:var(--card);border-left:4px solid var(--acc);padding:10px 14px;border-radius:8px;margin:12px 0;white-space:pre-wrap;overflow-wrap:anywhere}
.flash{border-color:var(--ok)}.err{border-color:var(--bad)}
.hist{border-top:1px solid var(--line);padding:8px 0;overflow-wrap:anywhere}
progress{width:100%;height:20px}
.pw{display:flex;gap:8px;align-items:stretch}.pw input{flex:1}.pw .show{white-space:nowrap}