:root{--ink:#2C1E12;--muted:#6f6557;--line:#e6dfd3;--bg:#FAF6F0;--card:#fff;--accent:#C2501A;--red:#A6171E;--green:#2f6b3a;--amber:#8a5a00}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 Arial,Helvetica,sans-serif}
h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:normal;line-height:1.2}
h1{font-size:28px;margin:0 0 6px}h2{font-size:21px;margin:26px 0 8px}h3{font-size:16px;margin:14px 0 4px}
a{color:var(--accent)}
nav{display:flex;align-items:center;gap:18px;flex-wrap:wrap;background:var(--ink);padding:10px 20px}
nav a{color:#fff;text-decoration:none}nav a:hover{text-decoration:underline}
nav .brand{font-family:Georgia,serif;font-size:18px;margin-right:10px}
nav .spacer{flex:1}nav button.link{color:#fff}nav form{margin:0}
main{max-width:1320px;margin:0 auto;padding:22px 20px 60px}
.head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.crumb{margin:0 0 4px;font-size:13px}.muted{color:var(--muted)}small{display:block;color:var(--muted);font-size:13px;margin-top:3px}
.red{color:var(--red)}.nowrap{white-space:nowrap}
button,.button{display:inline-block;font:inherit;font-weight:bold;padding:9px 15px;border:1px solid var(--ink);border-radius:6px;background:#fff;color:var(--ink);cursor:pointer;text-decoration:none}
button:hover,.button:hover{background:#f3ece1}
.primary,button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.primary:hover,button.primary:hover{background:#a84415}
button:disabled{opacity:.5;cursor:default}
button.link{background:none;border:0;padding:0;color:var(--accent);font-weight:normal;text-decoration:underline}
input,select,textarea{font:inherit;color:inherit;padding:8px 10px;border:1px solid #cfc6b7;border-radius:6px;background:#fff;width:100%}
input[type=checkbox],input[type=radio]{width:auto}
input:focus,select:focus,textarea:focus,button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
label{display:block;font-weight:bold;font-size:14px}label input,label select,label textarea{margin-top:4px;font-weight:normal}
.stack>*+*{margin-top:12px}.narrow{max-width:680px}
.row{display:flex;gap:12px;flex-wrap:wrap}.row>*{flex:1 1 220px}
fieldset{border:1px solid var(--line);border-radius:8px;padding:12px;margin:12px 0 0;background:#fff}
fieldset>*+*{margin-top:10px}legend{font-weight:bold;font-size:14px;padding:0 6px}
.check{font-weight:normal;display:inline-flex;gap:6px;align-items:center;margin-right:14px}.check input{margin:0}
.checks{display:flex;flex-wrap:wrap;gap:6px 0}
.note{padding:10px 14px;border-radius:6px;margin:10px 0;border:1px solid}
.note.ok{background:#eef6ef;border-color:#bcd8c1}.note.bad{background:#fbeeee;border-color:#e6bcbc}.warnbox{background:#fdf5e4;border-color:#ecd8a8}
.empty{padding:26px;text-align:center;color:var(--muted)}
table{border-collapse:collapse;width:100%;background:#fff}
th,td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:12px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}
.num{text-align:right;white-space:nowrap}.scroll{overflow-x:auto;border:1px solid var(--line);border-radius:8px}
tr.dim td{background:#f6f3ee;color:#7c7468}
.actions form{display:inline;margin-right:10px}
.pill{display:inline-block;font-size:11px;font-weight:bold;letter-spacing:.3px;padding:2px 8px;border-radius:10px;background:#eee7db;color:var(--ink);white-space:nowrap}
.pill-held,.pill-qa_passed,.qa-pass{background:#e3f0e5;color:var(--green)}
.pill-approved,.pill-sent{background:var(--green);color:#fff}.pill-placed{background:#dfe9f4;color:#1f4a78}
.pill-failed,.qa-fail{background:#f6dddd;color:var(--red)}.qa-warn,.pill-drafting{background:#fbeccb;color:var(--amber)}
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0}.filters input,.filters select{width:auto}.filters input[type=search]{min-width:240px}
.work{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:18px;align-items:start}
.preview{position:sticky;top:12px;min-width:0}
.toolbar{display:flex;gap:6px;align-items:center;margin-bottom:8px}.toolbar .link{margin-left:auto;font-size:14px}
.tab{padding:5px 12px;font-weight:normal}.tab.on{background:var(--ink);color:#fff}
.framewrap{background:#e6e1d8;border-radius:8px;padding:12px;display:flex;justify-content:center;overflow:hidden}
#emailframe{height:calc(100vh - 150px);min-height:520px;width:100%;max-width:100%;border:0;background:#fff;border-radius:4px}
#emailframe.w375{width:375px}#emailframe.w600{width:640px}
.panel{background:#fff;border:1px solid var(--line);border-radius:8px;padding:12px 14px;margin-bottom:10px}
.panel summary{cursor:pointer;font-family:Georgia,serif;font-size:17px}
.panel[open] summary{margin-bottom:8px}.panel.static h2{margin:0 0 8px;font-size:17px}
.panel p{margin:8px 0}.panel ul,.panel ol{padding-left:20px;margin:8px 0}.panel li{margin-bottom:6px}
.panel details{border-top:1px solid var(--line);padding:6px 0}.panel details summary{font:bold 14px Arial,sans-serif}
.choice{display:flex;gap:8px;align-items:flex-start;font-weight:normal}.choice>span{flex:1}.choice input[type=radio]{margin-top:12px}
.choice input:not([type=radio]){margin-top:0}
.issues{list-style:none;padding:0;font-size:14px}.issues li{padding:6px 8px;border-left:3px solid;margin-bottom:6px;overflow-wrap:anywhere}
.issues .fail{border-color:var(--red);background:#fbeeee}.issues .warn{border-color:#d7a93d;background:#fdf5e4}
.qa td{padding:7px 6px;font-size:14px;overflow-wrap:anywhere}.qa td:first-child{width:50px}
.links a{margin-right:10px;font-size:14px}
.steps li{margin-bottom:10px}.bannerthumb{display:block;width:100%;border-radius:6px;margin-bottom:8px;border:1px solid var(--line)}
.copytext{display:block;background:#f6f1e8;padding:5px 8px;border-radius:4px;margin-top:4px;font-size:14px;overflow-wrap:anywhere}
.reftiles{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}.reftiles img{display:block;height:110px;width:auto;max-width:100%;border:1px solid var(--line);border-radius:4px}
.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px}.swatch{font-weight:normal;font-size:13px}.swatch input{height:34px;padding:2px;margin-top:3px}
.inline{display:inline}.kv th{width:45%;text-transform:none;font-size:14px;letter-spacing:0;font-weight:normal}
.job{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:18px;font-size:16px}
.spinner{width:18px;height:18px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spinner{animation:none}}
pre{white-space:pre-wrap;overflow-wrap:anywhere;font:13px/1.5 Arial,sans-serif}
code{background:#fff;padding:2px 6px;border-radius:4px;border:1px solid var(--line);font-size:15px}
.login{max-width:380px;margin:9vh auto 0;background:#fff;padding:28px;border:1px solid var(--line);border-radius:10px}
.login h1{margin-bottom:18px}
@media (max-width:980px){.work{grid-template-columns:1fr}.preview{position:static}#emailframe{height:70vh}}
@media (max-width:600px){main{padding:16px 16px 50px}nav{padding:10px 16px;gap:12px}.filters input[type=search]{min-width:0;width:100%}.framewrap{padding:0}#emailframe.w600{width:100%}#emailframe.w375{width:100%}th,td{padding:7px}}
