:root{--navy:#0b1437;--navy2:#152790;--blue:#1c6ef7;--bg:#f3f5fb;--card:#fff;--ink:#141a33;--mut:#6a7391;--line:#e3e7f3;--ok:#12a150;--warn:#b7791f;--bad:#d92d20;--r:14px}
*{box-sizing:border-box}html,body{margin:0;height:100%}body{font:14px/1.5 'Poppins','Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--ink);display:flex}
button,input,select,textarea{font:inherit;color:inherit}a{color:var(--blue)}
aside{width:250px;flex:none;background:linear-gradient(180deg,#0b1437,#101c52);color:#cdd5f5;display:flex;flex-direction:column;height:100vh;position:sticky;top:0;padding:18px 14px;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#ffffff30 transparent}aside>*{flex-shrink:0}@media(max-height:900px){aside{padding:12px 12px}.brand{padding:2px 8px 10px}.client{margin-bottom:10px;padding:8px}nav{gap:1px}nav button{padding:7px 12px}.side-foot{padding:8px}}@media(max-height:760px){nav button{padding:5px 12px;font-size:13.5px}.side-foot div{margin:1px 0}}
.brand{display:flex;align-items:center;gap:10px;padding:4px 8px 18px;color:#fff;font-weight:700;font-size:17px}.brand i{width:34px;height:34px;border-radius:10px;background:var(--blue);display:grid;place-items:center;font-style:normal}
.client{background:#ffffff12;border:1px solid #ffffff1f;border-radius:12px;padding:10px;margin-bottom:16px}.client label{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:#8e9acb;display:block;margin-bottom:5px}
.client select{width:100%;background:#0b1437;border:1px solid #ffffff26;color:#fff;border-radius:8px;padding:8px}
nav{display:flex;flex-direction:column;gap:3px}nav button{display:flex;align-items:center;gap:11px;background:none;border:0;color:#b4bfec;padding:11px 12px;border-radius:10px;cursor:pointer;text-align:left;font-weight:500;position:relative}
nav button:hover{background:#ffffff10;color:#fff}nav button.on{background:var(--blue);color:#fff}nav .ic{width:20px;text-align:center;font-size:16px}nav .bdg{margin-left:auto;background:var(--bad);color:#fff;border-radius:20px;font-size:11px;padding:1px 8px}
.side-foot{margin-top:auto;font-size:11.5px;color:#8e9acb;padding:10px 8px;border-top:1px solid #ffffff1a}.side-foot div{display:flex;align-items:center;gap:7px;margin:3px 0}.dot{width:8px;height:8px;border-radius:50%;background:#555}.dot.ok{background:#31d07f}.dot.bad{background:#ff6b5e}
main{flex:1;min-width:0;height:100vh;overflow:auto}.top{display:flex;align-items:center;justify-content:space-between;padding:22px 34px 8px;position:sticky;top:0;background:linear-gradient(var(--bg) 75%,transparent);z-index:5}
.top h1{margin:0;font-size:23px;letter-spacing:-.3px}.top p{margin:2px 0 0;color:var(--mut)}.page{padding:12px 34px 60px;max-width:1280px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px;margin-bottom:18px}.card h2{margin:0 0 4px;font-size:16px}.card .sub{color:var(--mut);margin:0 0 14px;font-size:13px}
.grid{display:grid;gap:16px}.g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.g3{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.g4{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}.g5{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.kpi{display:flex;flex-direction:column;gap:2px;cursor:pointer}.kpi b{font-size:30px;line-height:1.1}.kpi span{color:var(--mut);font-size:12.5px}.kpi.bad b{color:var(--bad)}
label.f{display:block;font-size:11px;font-weight:600;color:var(--mut);margin:14px 0 5px;text-transform:uppercase;letter-spacing:.7px}
input[type=text],input[type=password],input[type=date],input[type=datetime-local],input[type=email],input[type=search],select,textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px #1c6ef722}textarea{resize:vertical;min-height:84px}
.btn{background:var(--blue);color:#fff;border:0;border-radius:10px;padding:10px 18px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px}.btn:hover{background:#155ad0}.btn:disabled{opacity:.5;cursor:default}
.btn.sec{background:#fff;color:var(--ink);border:1px solid var(--line)}.btn.sec:hover{background:#f3f5fb}.btn.bad{background:#fff;color:var(--bad);border:1px solid #f3c2bd}.btn.sm{padding:6px 12px;font-size:13px}.btn.ok{background:var(--ok)}
.types{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}.type{border:2px solid var(--line);background:#fff;border-radius:16px;padding:18px;cursor:pointer;text-align:left;transition:.15s}
.type:hover{border-color:#b9cdfb}.type.on{border-color:var(--blue);background:#f1f6ff;box-shadow:0 6px 18px #1c6ef71f}.type .em{font-size:28px}.type b{display:block;margin-top:8px;font-size:15px}.type span{color:var(--mut);font-size:12.5px}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{border:1px solid var(--line);background:#fff;border-radius:30px;padding:6px 13px;cursor:pointer;font-size:12.5px;display:inline-flex;gap:7px;align-items:center}.chip small{color:var(--mut)}.chip:hover{border-color:var(--blue)}.chip.on{background:var(--blue);border-color:var(--blue);color:#fff}.chip.on small{color:#d6e4ff}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}@media(max-width:900px){.row2,.row3{grid-template-columns:1fr}aside{width:70px}aside .tx,.client,.side-foot{display:none}}
.thumb{aspect-ratio:4/5;background:#e9edf8 center/cover no-repeat;border-radius:12px;border:1px solid var(--line);position:relative;overflow:hidden}
.item{cursor:pointer;padding:12px}.item:hover{box-shadow:0 8px 24px #1c2a6b1a;border-color:#c6d5fb}.item h4{margin:10px 0 4px;font-size:13.5px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.meta{display:flex;gap:6px;align-items:center;flex-wrap:wrap;color:var(--mut);font-size:12px}
.tag{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:600;background:#eaeefb;color:#46517f}.tag.scheduled{background:#fff2cc;color:#8a5a00}.tag.due{background:#ffe1de;color:var(--bad)}.tag.posted{background:#d8f4e4;color:var(--ok)}.tag.failed{background:#ffe1de;color:var(--bad)}.tag.type{background:#e3ecff;color:var(--navy2)}
.pills{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px;align-items:center}.pill{border:1px solid var(--line);background:#fff;border-radius:30px;padding:6px 14px;cursor:pointer;font-size:13px}.pill.on{background:var(--navy);border-color:var(--navy);color:#fff}
.empty{text-align:center;color:var(--mut);padding:44px 10px}.empty b{display:block;color:var(--ink);font-size:16px;margin-bottom:4px}
.overlay{position:fixed;inset:0;background:#0b143788;display:none;align-items:center;justify-content:center;z-index:50;backdrop-filter:blur(3px)}.overlay.on{display:flex}
.modal{background:#fff;border-radius:18px;width:min(1180px,96vw);max-height:93vh;overflow:auto;position:relative}.modal .hd{display:flex;justify-content:space-between;align-items:center;padding:16px 22px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:2}.modal .hd h3{margin:0;font-size:16px}
.modal .bd{display:grid;grid-template-columns:minmax(300px,420px) 1fr;gap:26px;padding:22px}@media(max-width:900px){.modal .bd{grid-template-columns:1fr}}
.strip{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px}.strip img{height:300px;border-radius:10px;border:1px solid var(--line);flex:none}.preview video{width:100%;max-height:520px;border-radius:12px;background:#000}.preview iframe{width:100%;height:560px;border:1px solid var(--line);border-radius:12px}
.load{text-align:center;background:#fff;border-radius:18px;padding:34px 44px;min-width:340px}.spin{width:42px;height:42px;border:4px solid #dbe6ff;border-top-color:var(--blue);border-radius:50%;animation:r 1s linear infinite;margin:0 auto 14px}@keyframes r{to{transform:rotate(360deg)}}
.toast{position:fixed;right:22px;bottom:22px;display:flex;flex-direction:column;gap:10px;z-index:80}.toast div{background:#101c52;color:#fff;padding:12px 18px;border-radius:12px;box-shadow:0 10px 30px #0006;max-width:380px;animation:up .25s}.toast .e{background:var(--bad)}.toast .s{background:var(--ok)}@keyframes up{from{transform:translateY(10px);opacity:0}}
.frow{border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:12px;background:#fafbff;position:relative}.frow .x{position:absolute;right:10px;top:8px;background:none;border:0;cursor:pointer;color:var(--mut);font-size:18px}
.sw{display:flex;align-items:center;gap:8px}.sw input[type=color]{width:46px;height:38px;border:1px solid var(--line);border-radius:8px;padding:2px;background:#fff}
.chk{display:flex;flex-wrap:wrap;gap:8px 18px}.chk label{display:flex;align-items:center;gap:7px;font-size:13px;cursor:pointer}.chk input{width:auto}
.note{background:#eef4ff;border:1px solid #cfe0ff;color:#27407f;border-radius:10px;padding:10px 14px;font-size:12.5px}.note.warn{background:#fff8e6;border-color:#f4dc9a;color:#7a5200}
.idea{display:flex;flex-direction:column;gap:6px}.idea b{font-size:14px}.idea p{margin:0;color:var(--mut);font-size:12.5px}.mini{width:56px;height:56px;border-radius:8px;object-fit:cover;border:1px solid var(--line)}
.logo-prev{height:60px;background:repeating-conic-gradient(#eef0f7 0 25%,#fff 0 50%) 0 0/14px 14px;border:1px solid var(--line);border-radius:10px;padding:6px;display:inline-block}.logo-prev img{height:100%}
hr.s{border:0;border-top:1px solid var(--line);margin:18px 0}
.navh{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:#6f7bb0;padding:14px 12px 4px}

/* report formatting panel */
.presets{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}@media(max-width:900px){.presets{grid-template-columns:1fr 1fr}}.preset{text-align:left;border:1.5px solid #d6dcee;background:#fff;border-radius:12px;padding:10px 12px;cursor:pointer;font:inherit;color:inherit}.preset b{display:block;font-size:13px}.preset span{display:block;font-size:11.5px;color:#6b7390;margin-top:3px;line-height:1.35}.preset.on{border-color:#1c6ef7;background:#eef4ff;box-shadow:0 0 0 3px #1c6ef722}