@font-face{font-family:Manrope;src:url(/fonts/Manrope-Variable.ttf) format("truetype");font-weight:200 800;font-display:swap}
@font-face{font-family:Inter;src:url(/fonts/Inter-Variable.ttf) format("truetype");font-weight:100 900;font-display:swap}
:root{--blue:#1F47C7;--blue-l:#7EA2FF;--amber:#F5A524;--ink:#0E1A24;--paper:#F6F4EF;--line:#DDD8CE;--muted:#5B6570;--ok:#1E8E5A;--err:#B42318}
*{box-sizing:border-box}
body{margin:0;font:15px/1.5 Inter,system-ui,sans-serif;color:var(--ink);background:var(--paper)}
h1,h2,h3{font-family:Manrope,Inter,sans-serif;font-weight:780;letter-spacing:-.01em;margin:.2em 0 .5em}
h2{font-size:20px}h3{font-size:15px;margin-top:1.2em}
code{background:#EAE6DD;padding:1px 5px;border-radius:4px;font-size:.9em}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:9}
.top{display:flex;align-items:center;gap:18px;padding:12px 24px;background:var(--ink);color:var(--paper);position:sticky;top:0;z-index:5}
.top .logo{height:30px}.product{font:700 13px Inter;letter-spacing:.12em;text-transform:uppercase;color:var(--blue-l)}
.top nav{display:flex;gap:4px;flex:1}
.tab{background:none;border:0;color:#C9D3E0;font:600 14px Inter;padding:8px 12px;border-radius:8px;cursor:pointer}
.tab[aria-current=page]{background:#1A2A3F;color:#fff;box-shadow:inset 0 -2px 0 var(--amber)}
main{padding:24px;max-width:1500px;margin:0 auto}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;margin-bottom:20px}
.narrow{max-width:420px;margin:60px auto}
.cols{display:flex;gap:20px;align-items:flex-start}.grow{flex:1;min-width:0}.side{width:440px;position:sticky;top:76px}.upload{width:400px}
@media (max-width:1000px){.cols{flex-direction:column}.side,.upload{width:100%;position:static}}
.row{display:flex;gap:10px;align-items:center}.between{justify-content:space-between}.wrap{flex-wrap:wrap}
label{display:block;font-weight:600;font-size:13px;color:var(--muted);margin:8px 0}
label.inline{display:flex;gap:8px;align-items:center;margin:0}
input,select,textarea{font:inherit;color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--paper);width:100%}
.row input,.row select{width:auto}
input:focus,select:focus,textarea:focus,button:focus-visible{outline:3px solid var(--blue-l);outline-offset:1px}
.check{display:flex;gap:8px;font-weight:500;color:var(--ink)}.check input{width:auto;margin-top:3px}
button{font:600 14px Inter;border-radius:999px;padding:10px 18px;cursor:pointer;border:1px solid transparent}
.primary{background:var(--blue);color:#fff}.primary:hover{background:#1a3cab}
.ghost{background:#fff;border-color:var(--line);color:var(--ink)}.small{padding:6px 12px;font-size:13px}
.danger{background:#fff;border-color:#F0C8C3;color:var(--err)}
.top .ghost{background:transparent;color:#C9D3E0;border-color:#2A3B52}
.muted{color:var(--muted)}.small{font-size:12px}.error{color:var(--err);font-weight:600;min-height:1em}
.req{background:var(--amber);color:var(--ink);font-size:11px;padding:1px 8px;border-radius:9px;margin-left:6px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.drop{border:2px dashed #C7CFE0;border-radius:14px;padding:22px;text-align:center;background:#F3F6FD}
.drop.over{border-color:var(--blue);background:#E8EEFC}.link{display:inline;color:var(--blue);text-decoration:underline;cursor:pointer;font-size:inherit}
.pending{list-style:none;padding:0;margin:8px 0;font-size:13px}
fieldset.rights{border:1px solid var(--line);border-radius:12px;margin:12px 0;padding:8px 14px}
legend{font-weight:700;font-size:13px}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.m{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--paper);font-size:12px}
.m img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:#1A2A3F}
.m .b{padding:8px}.m .n{font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pill{display:inline-block;padding:1px 8px;border-radius:9px;background:#EAE6DD;margin:2px 2px 0 0}
.pill.ok{background:#DDF3E8;color:#14613E}.pill.test{background:#FFF1D6;color:#7A4B00}.pill.blue{background:#E3E9FB;color:var(--blue)}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.slot{border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--paper)}
.slot.over{outline:3px solid var(--blue)}.slot .t{display:flex;justify-content:space-between;gap:6px;font-weight:650;font-size:13px}
.slot .id{font:600 11px ui-monospace,monospace;color:var(--muted)}
.slot .ph{height:92px;border-radius:8px;margin:8px 0;background:repeating-linear-gradient(135deg,#24364D,#24364D 10px,#22334a 10px,#22334a 20px);display:flex;align-items:center;justify-content:center;color:#9AA6B6;font-size:11px;overflow:hidden}
.slot .ph img{width:100%;height:100%;object-fit:cover}
.slot select{font-size:12px;padding:5px}
.strip{display:flex;flex-wrap:wrap;gap:6px;max-height:260px;overflow:auto}
.strip img{width:76px;height:56px;object-fit:cover;border-radius:6px;cursor:grab;border:2px solid transparent}
.strip img:focus{border-color:var(--blue)}
.pvbox{position:relative;background:var(--ink);border-radius:12px;overflow:hidden;min-height:160px;display:flex;align-items:center;justify-content:center}
.pvbox img{max-width:100%;max-height:520px;display:block}
.busy{position:absolute;top:8px;right:8px;background:var(--amber);color:var(--ink);font-weight:700;font-size:12px;padding:3px 10px;border-radius:9px}
.chip{background:#EEF2FD;border:1px solid #D3DDF8;color:var(--blue);padding:3px 10px;font-size:12px}
.tbl{width:100%;border-collapse:collapse;font-size:14px}.tbl th{text-align:left;color:var(--muted);font-weight:600;border-bottom:1px solid var(--line);padding:8px}
.tbl td{border-bottom:1px solid #EEEAE2;padding:8px}
.bar{height:8px;background:#EAE6DD;border-radius:5px;overflow:hidden;width:140px}.bar i{display:block;height:100%;background:var(--blue)}
.st{font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.06em}.st.done{color:var(--ok)}.st.failed{color:var(--err)}.st.rendering{color:var(--blue)}.st.queued{color:#7A4B00}
.outs{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.out{border:1px solid var(--line);border-radius:12px;padding:10px}.out video{width:100%;border-radius:8px;background:var(--ink)}
textarea.code{font:12px/1.4 ui-monospace,monospace;height:220px;background:#0E1A24;color:#DDE4EE}
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.toast{position:fixed;bottom:20px;right:20px;background:var(--ink);color:#fff;padding:12px 18px;border-radius:12px;border-left:4px solid var(--amber);z-index:20}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}