/* Same tokens as the story studio (epplz_shortdrama_story/public/theme.css). */
:root{
 --brand:#7650FF;--brand-ink:#5B36E6;--brand-grad:linear-gradient(120deg,#5F3BFF 0%,#8B55FF 55%,#B865FF 100%);
 --brand-tint:#F1ECFF;--brand-glow:0 6px 18px -8px rgba(118,80,255,.75),inset 0 1px 0 rgba(255,255,255,.28);
 --ink:#1E1A26;--ink-2:#4A4458;--muted:#857E93;--line:#E6E2EE;--surface:#fff;--bg:#f6f4f9;--select:#EFEFF2;
 --btn-h:32px;--btn-r:7px;
 --planned:#A39BAB;--ready:#C99A2E;--scheduled:#7650FF;--published:#2E9D6A;--failed:#D9534F;
 --yt:#FF0033;--ig:#D62976;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',sans-serif;font-size:14px;letter-spacing:-.3px}
button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;border:0;background:none}a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
input,select,textarea{border:1px solid var(--line);border-radius:var(--btn-r);background:#fff;padding:8px 10px;font-size:13px}
h1,h2,h3,p{margin:0}

/* ---------- Shell ---------- */
.sidebar{position:fixed;inset:0 auto 0 0;width:224px;background:#f7f6f9;border-right:1px solid #eae7ef;padding:26px 16px 16px;display:flex;flex-direction:column;z-index:30}
.logo{display:flex;align-items:center;gap:8px;padding:0 10px}.logo img{height:26px}.logo span{font-size:9px;background:var(--brand-tint);color:var(--brand-ink);letter-spacing:.7px;padding:4px 5px;border-radius:4px;font-weight:700}
.workspace{margin:22px 10px 14px}.workspace strong{font-size:12px;display:block;margin-bottom:4px}.workspace small{font-size:10px;color:var(--muted)}
.navlabel{font-size:9px;letter-spacing:1.8px;color:#a39bab;padding:14px 12px 6px}
.nav{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border-radius:8px;text-align:left;font-size:12.5px;color:#7d7589;margin:1px 0}
.nav:hover{background:#efedf3}.nav.active{background:var(--select);color:var(--brand-ink);font-weight:700}
.nav .soon{margin-left:auto;font-size:9px;letter-spacing:.5px;color:#b0a8ba;border:1px solid #e3dfea;border-radius:4px;padding:2px 4px}
.nav .ext{margin-left:auto;color:#b0a8ba}.nav[aria-disabled=true]{opacity:.55;cursor:default}.nav[aria-disabled=true]:hover{background:none}
.nav svg{width:16px;height:16px;flex-shrink:0}
.sidebottom{margin-top:auto;border-top:1px solid #e8e4ec;padding-top:12px}
.person{display:flex;gap:10px;align-items:center;padding:6px 8px}.avatar{width:30px;height:30px;border-radius:7px;background:var(--brand-tint);color:var(--brand-ink);display:grid;place-items:center;font-weight:700;font-size:12px}
.person strong{font-size:11px;display:block}.person small{font-size:10px;color:var(--muted)}.person button{margin-left:auto;font-size:10px;color:var(--muted)}
.main{margin-left:224px;min-height:100vh}
.topbar{height:60px;padding:0 36px;border-bottom:1px solid #eeebf2;display:flex;align-items:center;justify-content:space-between;background:#fff}
.breadcrumb{font-size:11px;color:#9a92a3;display:flex;gap:10px;align-items:center}.breadcrumb b{font-weight:600;color:var(--ink-2)}
.content{padding:28px 36px 60px;max-width:1500px}
.pagehead{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.headtitle{display:flex;gap:10px;align-items:center}h1{font-size:26px;letter-spacing:-1.2px;font-weight:750}
.pagehead p{color:var(--muted);font-size:12px;margin-top:8px}
.badge{font-size:10px;border-radius:5px;padding:4px 7px;background:#efebf5;color:#857E93;border:1px solid #e4dbed;font-weight:600}

/* ---------- Controls ---------- */
.button{height:var(--btn-h);padding:0 14px;border-radius:var(--btn-r);font-size:13px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;border:1px solid var(--line);background:#fff;color:var(--ink);transition:background .15s,border-color .15s}
.button:hover:not(:disabled){border-color:#CFC7DE;background:#FAF9FC}.button:disabled{opacity:.5;cursor:not-allowed}
.button.primary{background:var(--brand-grad);border-color:transparent;color:#fff;box-shadow:var(--brand-glow)}.button.primary:hover:not(:disabled){filter:brightness(1.07);background:var(--brand-grad)}
.button.danger{color:var(--failed)}.button.ghost{border-color:transparent;background:transparent}.button.icon{width:var(--btn-h);padding:0}
.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{height:28px;padding:0 11px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#7d7589;font-size:12px;display:inline-flex;align-items:center;gap:6px}
.chip.active{color:#fff;background:var(--ink);border-color:var(--ink)}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.month{display:flex;align-items:center;gap:6px}.month b{font-size:17px;min-width:118px;text-align:center;letter-spacing:-.6px}

/* ---------- Cards / tables ---------- */
.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px 22px;margin-bottom:18px}
.card>header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap}.card h2{font-size:15px;letter-spacing:-.5px}.card header p{font-size:11px;color:var(--muted);margin-top:4px}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}
.kpi{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px 18px}.kpi small{font-size:11px;color:var(--muted)}.kpi b{display:block;font-size:24px;letter-spacing:-1px;margin-top:6px;font-variant-numeric:tabular-nums}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:12.5px}th{font-size:11px;color:var(--muted);font-weight:600;text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:10px;border-bottom:1px solid #f0edf4;vertical-align:middle;white-space:nowrap}tr:last-child td{border-bottom:0}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr.clickable{cursor:pointer}tr.clickable:hover td{background:#fbfaff}
.rank{font-weight:750;color:var(--brand-ink);width:28px}
.bar{height:6px;border-radius:3px;background:var(--brand-tint);min-width:80px;position:relative}.bar i{position:absolute;inset:0 auto 0 0;border-radius:3px;background:var(--brand-grad)}
.hooks td{white-space:normal}.hooks{background:#faf8fd;font-size:12px;line-height:1.7;color:var(--ink-2)}.hooks td{padding:12px 16px}.hooks b{color:var(--brand-ink);font-size:11px;display:block;margin-bottom:2px}.hooks .pair{display:grid;grid-template-columns:1fr 1fr;gap:16px;white-space:pre-wrap}
.up{color:var(--published);font-weight:650}.down{color:#b5764f;font-weight:650}.dim{color:#b0a8ba}
.empty{padding:44px 20px;border:1px dashed #dcd3e7;border-radius:8px;text-align:center;color:var(--muted);background:#fbf9fd;font-size:13px;line-height:1.8}
.empty b{display:block;color:var(--ink-2);font-size:15px;margin-bottom:6px}.empty .button{margin-top:12px}
.note{font-size:11.5px;color:var(--muted);line-height:1.7}

/* ---------- Platform & status marks ---------- */
.pf{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:650}.pf i{width:8px;height:8px;border-radius:2px;display:inline-block}
.pf.youtube i{background:var(--yt)}.pf.instagram i{background:linear-gradient(135deg,#FEDA75,#D62976 50%,#4F5BD5)}
.st{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;padding:3px 7px;border-radius:6px;background:#f4f2f7;color:var(--ink-2);white-space:nowrap}
.st:before{content:'';width:6px;height:6px;border-radius:50%;background:var(--c)}
.st.planned{--c:var(--planned)}.st.ready{--c:var(--ready)}.st.scheduled{--c:var(--scheduled)}.st.published{--c:var(--published)}.st.failed{--c:var(--failed);background:#fdeeee;color:#a33}
.legend{display:flex;gap:6px;flex-wrap:wrap}

/* ---------- Calendar ---------- */
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.cal .dow{font-size:11px;color:var(--muted);padding:9px 10px;border-bottom:1px solid var(--line);font-weight:600}.cal .dow:first-child{color:#d0605a}.cal .dow:last-child{color:#5b6fd0}
.day{min-height:118px;border-right:1px solid #f0edf4;border-bottom:1px solid #f0edf4;padding:7px 7px 9px;text-align:left;display:flex;flex-direction:column;gap:4px;min-width:0;background:#fff}
.day:nth-child(7n){border-right:0}.day:hover{background:#fcfbff}.day.other{background:#fafafb}.day.other .dnum{color:#c9c3d1}
.day.today .dnum{background:var(--brand);color:#fff}.day.selected{box-shadow:inset 0 0 0 2px var(--brand)}
.dnum{font-size:12px;font-weight:650;width:22px;height:22px;border-radius:7px;display:grid;place-items:center;color:var(--ink-2)}
.ev{font-size:11px;line-height:1.35;border-radius:6px;padding:3px 6px;display:flex;align-items:center;gap:5px;min-width:0;white-space:nowrap;overflow:hidden}
.ev span{overflow:hidden;text-overflow:ellipsis}.ev.episode{background:#f4f2f7;color:var(--ink-2)}.ev.episode:before{content:'◆';font-size:8px;color:#b9a8e8}
.ev.post{background:var(--brand-tint);color:var(--ink)}.ev.post .dot{width:7px;height:7px;border-radius:2px;flex-shrink:0}.ev.post .dot.youtube{background:var(--yt)}.ev.post .dot.instagram{background:var(--ig)}
.ev.post.published{background:#e8f6ef}.ev.post.failed{background:#fdeeee}.ev.post.late{box-shadow:inset 0 0 0 1px var(--failed)}
.ev .who{margin-left:auto;color:var(--muted);font-size:10px;flex-shrink:0}
.more{font-size:10px;color:var(--muted);padding-left:4px}
.split{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;margin-top:18px}
.statusbox .row{display:flex;justify-content:space-between;align-items:center;padding:7px 0;font-size:12.5px;border-bottom:1px solid #f3f1f6}.statusbox .row:last-child{border:0}
.late-list li{font-size:12px;padding:6px 0;border-bottom:1px solid #f3f1f6;list-style:none}.late-list{padding:0;margin:0}

/* ---------- Drawer ---------- */
.overlay{position:fixed;inset:0;background:#23182c3d;backdrop-filter:blur(2px);z-index:60;display:flex;justify-content:flex-end}
.drawer{width:min(460px,100%);background:#fff;overflow-y:auto;box-shadow:-15px 0 60px #37244213;display:flex;flex-direction:column}
.drawer>header{padding:18px 22px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.drawer h2{font-size:17px}
.drawer .body{padding:18px 22px;flex:1}.drawer section{margin-bottom:20px}.drawer section>h3{font-size:12px;color:var(--muted);font-weight:650;margin-bottom:8px}
.item{border:1px solid var(--line);border-radius:8px;padding:12px;margin-bottom:8px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.item .grow{flex:1;min-width:0}.item b{font-size:13px}.item small{display:block;font-size:11px;color:var(--muted);margin-top:3px}
.form{display:grid;gap:12px}.form label{display:grid;gap:5px;font-size:11.5px;font-weight:650;color:var(--ink-2)}.form .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form input,.form select,.form textarea{width:100%}
.drawer footer{padding:14px 22px;border-top:1px solid var(--line);display:flex;gap:8px;justify-content:flex-end;position:sticky;bottom:0;background:#fff}

/* ---------- Channels ---------- */
.channel-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.channel-card .logo-mark{width:34px;height:34px;border-radius:7px;display:grid;place-items:center;color:#fff;font-weight:800}
.logo-mark.youtube{background:var(--yt)}.logo-mark.instagram{background:linear-gradient(135deg,#FEDA75,#D62976 50%,#4F5BD5)}
.account{display:flex;align-items:center;gap:10px;padding:12px 0;border-top:1px solid #f0edf4;font-size:12.5px}.account .grow{flex:1;min-width:0}.account small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.account .err{color:var(--failed)}
code{background:#f6f2fa;border-radius:6px;padding:2px 6px;font-size:11.5px;overflow-wrap:anywhere}
.setup li{font-size:12px;line-height:1.9;color:var(--ink-2)}

/* ---------- Misc ---------- */
.login{min-height:100vh;display:grid;place-items:center;padding:20px}.login .card{width:min(400px,100%);text-align:center;padding:36px 30px}.login img{height:34px;margin-bottom:18px}
.login p{font-size:13px;color:var(--muted);line-height:1.8;margin-bottom:22px}.login .error{color:var(--failed);font-size:12px;margin-top:14px}
.loading{padding:120px;text-align:center;color:var(--muted)}.spinner{display:inline-block;width:12px;height:12px;border:2px solid #ddd3f7;border-top-color:var(--brand);border-radius:50%;animation:spin 1s linear infinite;margin-right:6px;vertical-align:-1px}
@keyframes spin{to{transform:rotate(360deg)}}
#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);opacity:0;pointer-events:none;z-index:100;background:#2c2638;color:#fff;border-radius:7px;padding:11px 18px;font-size:12.5px;max-width:90%;transition:.2s}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ---------- Weekly snapshot / KPIs / board (structure follows sns.haxai.ai) ---------- */
.eyebrow{font-size:10px;font-weight:700;letter-spacing:2.4px;color:var(--muted);margin-bottom:6px}
.snapshot>header h2{font-size:18px}
.snap-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);border-radius:8px;overflow:hidden}
.snap-col{padding:16px 18px;border-right:1px solid var(--line);min-width:0}.snap-col:last-child{border-right:0}
.snap-col>header{display:flex;align-items:center;gap:10px;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid #f0edf4;font-size:13.5px}
.snap-col .logo-mark{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:12px}
.logo-mark.threads{background:#1E1A26}.logo-mark.tiktok{background:#25F4EE;color:#1E1A26}
.snap-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 10px}.snap-grid small{font-size:11px;color:var(--muted);display:block}
.snap-grid b{display:block;font-size:19px;letter-spacing:-.8px;margin-top:4px;font-variant-numeric:tabular-nums}.snap-grid em{font-style:normal;font-size:11px;color:var(--muted)}
.snap-col .note{margin-top:12px;font-size:11px}
.kpis.five{grid-template-columns:repeat(5,minmax(0,1fr))}.kpi.alert b{color:var(--failed)}
.progress-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.progress-chip{background:#efebf5;border-radius:6px;padding:7px 12px;font-size:12.5px;color:var(--ink-2)}.progress-chip b{color:var(--brand-ink);margin-left:2px}
.segmented{display:inline-flex;background:#f1eef6;border-radius:7px;padding:3px;gap:2px}
.segmented button{height:28px;padding:0 14px;border-radius:8px;font-size:12.5px;color:var(--muted);font-weight:600}.segmented button.active{background:#fff;color:var(--brand-ink);box-shadow:0 1px 3px #1e1a2614}
.board>header{align-items:center}.board>header>div:first-child{flex:1}
.week{display:grid;grid-template-columns:repeat(7,minmax(150px,1fr));border:1px solid var(--line);border-radius:8px;overflow-x:auto}
.week-col{border-right:1px solid #f0edf4;padding:10px 8px 14px;min-height:260px;display:flex;flex-direction:column;gap:8px;cursor:pointer}.week-col:last-child{border-right:0}
.week-col:hover{background:#fcfbff}.week-col.today{background:#f6f2ff}
.week-head{font-size:12px;color:var(--muted);padding:2px 4px 6px}.week-head b{color:var(--ink);font-size:14px;margin-right:2px}.week-col.today .week-head{color:var(--brand-ink)}
.wcard{text-align:left;border:1px solid var(--line);border-radius:7px;padding:9px 10px;background:#fff;display:grid;gap:5px;width:100%}
.wcard:hover{border-color:#cfc7de}.wcard small{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:3px;flex-wrap:wrap}
.wcard b{font-size:12.5px;line-height:1.4;letter-spacing:-.4px}.wcard em{font-style:normal;font-size:11px;color:var(--muted);display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.wcard.published{background:#f1faf5;border-color:#cfe9db}.wcard.late{background:#fff5f5;border-color:#f0b9b7}.wcard .warn{color:var(--failed);font-weight:650}
.wcard.pending{border-style:dashed;background:#fbfafd}.wcard.pending b{color:var(--ink-2)}
.week-empty{font-size:11px;color:#c3bccc;padding:4px}
@media(max-width:1100px){.snap-cols{grid-template-columns:1fr 1fr}.snap-col:nth-child(2){border-right:0}.snap-col:nth-child(-n+2){border-bottom:1px solid var(--line)}.kpis.five{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.snap-cols{grid-template-columns:1fr}.snap-col{border-right:0;border-bottom:1px solid var(--line)}.kpis.five{grid-template-columns:1fr 1fr}}

@media(max-width:1100px){.split{grid-template-columns:1fr}.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.channel-grid{grid-template-columns:1fr}}
@media(max-width:860px){
 .sidebar{position:static;width:auto;flex-direction:row;flex-wrap:wrap;align-items:center;padding:10px 16px;gap:4px;border-right:0;border-bottom:1px solid #eae7ef}
 .workspace,.navlabel,.sidebottom,.nav .soon,.nav[aria-disabled=true]{display:none}.nav{width:auto;padding:8px 10px}.main{margin-left:0}
 .topbar{padding:0 16px}.content{padding:20px 16px 50px}.day{min-height:78px;padding:4px}.ev .who,.ev span{display:none}.ev{padding:3px}.hooks .pair{grid-template-columns:1fr}
}

/* Series × day board (WBS layout) */
.wbs{border:1px solid var(--line);border-radius:8px;overflow:auto}
.wbs-row{display:grid;grid-template-columns:180px repeat(7,minmax(104px,1fr));border-top:1px solid var(--line);min-width:900px}
.wbs-row.head{border-top:0;font-size:12px;color:var(--muted);font-weight:600}.wbs-row.head>div{padding:10px}
.wbs-label{padding:12px;display:grid;gap:3px;align-content:start}.wbs-label b{font-size:13.5px;letter-spacing:-.4px}.wbs-label small{font-size:11px;color:var(--muted)}
.wbs-cell{border-left:1px solid var(--line);padding:8px 6px;display:grid;gap:5px;align-content:start;min-height:64px}.wbs-cell.today{background:#f6f2ff}.wbs-row.head .wbs-cell.today{color:var(--brand-ink)}
.wbs-pill{display:flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:6px;padding:4px 8px;background:#fff;font-size:11.5px;text-align:left;width:100%}
.wbs-pill b{font-weight:650}.wbs-pill span{color:var(--muted);flex:1}.wbs-pill .who{font-style:normal;width:18px;height:18px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:10px}
.wbs-pill.published{background:#f1faf5;border-color:#cfe9db}.wbs-pill.late{background:#fff5f5;border-color:#f0b9b7}.wbs-pill.late span{color:var(--failed)}
.wbs-pill.ready,.wbs-pill.scheduled{background:#f6f2ff;border-color:#ddd2fb}.wbs-pill.pending{border-style:dashed;color:var(--muted);background:#fbfafd}
.wbs-pill .dot{width:7px;height:7px;border-radius:2px;flex-shrink:0}.wbs-pill .dot.youtube{background:var(--yt)}.wbs-pill .dot.instagram{background:var(--ig)}
/* analytics: format tabs + detail drawer */
.format-tabs{margin-bottom:14px}.format-tabs .chip{height:32px;font-size:13px;padding:0 14px}
.drawer.wide{width:min(560px,100%)}
.yt-lite{display:flex;align-items:center;justify-content:center;width:100%;border:0;border-radius:8px;background:#111 center/cover no-repeat;margin-bottom:18px;cursor:pointer;color:#fff;text-decoration:none}
.yt-lite.short{aspect-ratio:9/16;height:min(420px,60vh);width:auto;margin-inline:auto}.yt-lite.long{aspect-ratio:16/9}
.yt-lite span{width:56px;height:56px;border-radius:50%;background:#000a;display:grid;place-items:center;font-size:20px}
iframe.yt-lite{cursor:default}
.mgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mtile{border:1px solid var(--line);border-radius:7px;padding:10px 12px}.mtile small{display:block;font-size:11px;color:var(--muted)}.mtile b{display:block;font-size:17px;margin-top:2px;font-variant-numeric:tabular-nums}.mtile span{font-size:11px}
.trend{min-height:60px}.trend-svg{width:100%;height:auto;border:1px solid var(--line);border-radius:7px;background:#fcfbfe}
.trend-svg polyline{fill:none;stroke-width:2}.trend-svg .youtube{stroke:var(--yt);fill:var(--yt)}.trend-svg polyline.youtube{fill:none}
.trend-svg .instagram{stroke:#D62976;fill:#D62976}.trend-svg polyline.instagram{fill:none}
.trend-axis{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-top:4px}
table.mini{width:100%;font-size:12px}table.mini th,table.mini td{padding:6px 4px;border-bottom:1px solid var(--line);text-align:left}table.mini .num{text-align:right}
.hooktext{font-size:13px;white-space:pre-line;background:#f6f4f9;border-radius:7px;padding:10px 12px}
@media(max-width:640px){.mgrid{grid-template-columns:1fr 1fr}}

/* ===================== Glass theme (purple → white) ===================== */
:root{--glass:rgba(255,255,255,.68);--glass-line:rgba(255,255,255,.92);--glass-shadow:0 12px 40px -20px rgba(95,59,255,.35);--btn-r:7px;--line:#E9E4F5}
body{background:linear-gradient(155deg,#E6DEFF 0%,#F3EFFF 32%,#FCFBFF 62%,#EEE8FF 100%) fixed}
.sidebar{background:rgba(255,255,255,.5);backdrop-filter:blur(22px) saturate(1.3);border-right:1px solid var(--glass-line)}
.nav{border-radius:8px}.nav:hover{background:rgba(255,255,255,.7)}.nav.active{background:#fff;color:var(--brand-ink);box-shadow:0 6px 18px -10px rgba(95,59,255,.5)}
.topbar{background:transparent;border-bottom:0}
.card,.kpi{background:var(--glass);backdrop-filter:blur(20px) saturate(1.3);border:1px solid var(--glass-line);box-shadow:var(--glass-shadow)}
.card{border-radius:10px}.kpi{border-radius:10px;padding:18px 20px}
.button{border-color:#E4DEF3;background:rgba(255,255,255,.85)}.chip{border-radius:6px;background:rgba(255,255,255,.75)}
.chip.active{background:var(--ink);border-color:var(--ink)}
input,select,textarea{border-color:#E4DEF3;background:rgba(255,255,255,.9)}
.drawer{background:rgba(255,255,255,.92);backdrop-filter:blur(24px)}.mtile{background:#fff}
.badge{background:rgba(255,255,255,.8);border-color:#E4DBF3;color:var(--brand-ink)}

/* period filter */
.period{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.period input{height:32px;border-radius:7px}
.seg{display:inline-flex;padding:3px;border-radius:6px;background:rgba(255,255,255,.7);border:1px solid var(--glass-line);box-shadow:var(--glass-shadow)}
.seg button{height:28px;padding:0 13px;border-radius:6px;font-size:12px;font-weight:600;color:#7d7589}.seg button.active{background:var(--ink);color:#fff}

/* dashboard */
.dash{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:18px;align-items:start}.dash>.card{margin:0}
.kpis.wide{grid-column:1/-1;margin:0}
.kpi span{display:block;font-size:11px;color:var(--muted);margin-top:6px}
.kpi.hl{background:var(--ink);border-color:transparent;color:#fff;box-shadow:0 18px 40px -22px rgba(30,26,38,.7)}.kpi.hl small,.kpi.hl span{color:#ffffffcc}
.dash{grid-template-areas:"hero hero" "kpi kpi" "chart up" "chart top"}.dash .strip{grid-area:hero}.dash .kpis{grid-area:kpi}.a-chart{grid-area:chart}.a-up{grid-area:up}.a-top{grid-area:top}
/* Drama strip: one wide card (the still, faces kept — only the bottom is darkened) and narrow poster cards */
.strip{display:flex;gap:10px;height:clamp(280px,25vw,340px)}
.strip .sc{position:relative;flex:1 1 0;min-width:110px;border-radius:10px;overflow:hidden;background:#100D16;color:#fff;cursor:pointer;transition:flex .6s cubic-bezier(.2,.8,.2,1);box-shadow:0 20px 40px -26px rgba(20,10,40,.8)}
.strip .sc.on{flex:4.5 1 0;cursor:default}
.strip img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .5s}
.strip .wide{object-position:center 25%;opacity:0}.strip .tall{object-position:center 30%}.strip .sc.on .wide{opacity:1}.strip .sc.on .tall{opacity:0}
.strip .shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(16,13,22,.92) 0%,rgba(16,13,22,.55) 30%,rgba(16,13,22,0) 60%)}
.strip .sc:not(.on):hover .shade{background:linear-gradient(0deg,rgba(16,13,22,.8),rgba(16,13,22,.1))}
.strip .label{position:absolute;left:12px;right:12px;bottom:14px;display:flex;flex-direction:column;gap:6px;align-items:flex-start;transition:opacity .3s}.strip .label b{font-size:14px;line-height:1.3}
.strip .sc.on .label{opacity:0;pointer-events:none}
.strip .info{position:absolute;left:28px;right:28px;bottom:24px;opacity:0;transform:translateY(8px);transition:opacity .4s .15s,transform .4s .15s;pointer-events:none}
.strip .sc.on .info{opacity:1;transform:none;pointer-events:auto}
.strip .meta{font-size:11px;letter-spacing:1.4px;font-weight:700;color:#ffffffb0;margin-bottom:8px}
.strip h2{font-size:clamp(22px,2.4vw,34px);letter-spacing:-1.4px;line-height:1.15;font-weight:800;margin:0 0 10px;text-shadow:0 4px 20px #0009;max-width:720px}
.strip p{font-size:12.5px;color:#ffffffd0;display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.strip .tag{font-size:11.5px;font-weight:600;padding:3px 8px;border-radius:5px;color:#fff;background:rgba(255,255,255,.16);backdrop-filter:blur(6px)}
.strip .actions{gap:8px}.strip .button{height:36px;padding:0 16px}
.tag{display:inline-block;font-size:11px;font-weight:600;padding:3px 7px;border-radius:5px;background:var(--brand-tint);color:var(--brand-ink)}
.tags{display:flex;gap:5px;flex-wrap:wrap}
.button.light{background:#fff;color:var(--ink);border-color:#fff}.button.light:hover:not(:disabled){background:#ffffffe0}
.button.watch{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.3);color:#fff;backdrop-filter:blur(8px)}.button.watch:hover:not(:disabled){background:rgba(255,255,255,.26)}
.pill{display:inline-block;font-size:11px;font-weight:700;padding:4px 9px;border-radius:6px;background:#ffffff33;color:#fff;backdrop-filter:blur(8px)}
.pill.ongoing{background:#22C55E;color:#fff;backdrop-filter:none}.pill.completed{background:#ECE8F3;color:var(--ink-2)}
.uplist,.toplist{list-style:none;margin:0;padding:0}
.uplist li{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #EEE9F7}.uplist li:last-child{border:0}
.uplist .dot{width:8px;height:8px;border-radius:3px;flex-shrink:0;background:var(--brand)}.uplist .dot.youtube{background:var(--yt)}.uplist .dot.instagram{background:var(--ig)}
.uplist div{flex:1;min-width:0}.uplist b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.uplist small{font-size:11px;color:var(--muted)}
.uplist .st{font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:6px;background:var(--brand-tint);color:var(--brand-ink)}.uplist .st.ready{background:#FFF4DA;color:#9A6B00}.uplist .st.planned{background:#F1EFF4;color:#7d7589}
.toplist li{display:flex;align-items:center;gap:10px;padding:8px 6px;border-radius:8px;cursor:pointer}.toplist li:hover{background:#fff}
.toplist .rk{width:18px;font-weight:800;color:var(--brand)}.toplist img,.toplist i{width:52px;height:38px;border-radius:8px;object-fit:cover;background:#eee}
.toplist div{flex:1;min-width:0}.toplist b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toplist small{font-size:11px;color:var(--muted)}.toplist strong{font-variant-numeric:tabular-nums}
.vchart{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:6px;height:220px;align-items:end;padding-top:24px}
.vchart .col{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px}
.vchart .col i{width:min(100%,38px);border-radius:4px 4px 1px 1px;background:linear-gradient(180deg,#D9CCFF,#EFE9FF);min-height:0}
.vchart .col.peak i{background:var(--brand-grad);box-shadow:var(--brand-glow)}.vchart .col.today small{color:var(--brand-ink);font-weight:800}
.vchart .col small{font-size:10.5px;color:var(--muted);height:14px}
.vchart .col em{position:absolute;top:-22px;font-style:normal;font-size:11px;font-weight:700;background:var(--ink);color:#fff;padding:2px 7px;border-radius:6px;white-space:nowrap}
.vchart.eps .col{cursor:pointer}.vchart.eps .col em{display:none}.vchart.eps .col.peak em,.vchart.eps .col:hover em{display:block}.vchart.eps .col:hover i{filter:brightness(.95)}

/* dramas */
.dgroup{margin-bottom:30px}.dgroup>h2{font-size:17px;letter-spacing:-.6px;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:18px}
.dcard{display:flex;flex-direction:column;gap:3px}.dcard b{font-size:14px;margin-top:8px}.dcard small{font-size:11px;color:var(--muted)}.dcard strong{font-size:18px;letter-spacing:-.6px}.dcard strong span{font-size:11px;color:var(--muted);margin-left:2px;font-weight:500}
.dposter{position:relative;aspect-ratio:2/3;border-radius:10px;overflow:hidden;background:var(--brand-grad);display:grid;place-items:center;color:#fff;font-weight:800;box-shadow:0 18px 36px -20px rgba(60,30,140,.6);transition:transform .2s}
.dcard:hover .dposter{transform:translateY(-4px)}.dposter img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.dposter .pill{position:absolute;left:10px;top:10px}
.dhead{display:flex;gap:24px;align-items:flex-start;flex-wrap:wrap}.dhead .grow{flex:1;min-width:240px}.dhead h1{margin:8px 0 6px}.dposter.big{width:150px;flex:0 0 auto}
.dhead .seg button{height:28px}
@media(max-width:1100px){.dash{grid-template-columns:1fr;grid-template-areas:"hero" "kpi" "chart" "up" "top"}}
@media(max-width:640px){.strip{height:360px}.strip .sc{min-width:56px}.strip .label b{display:none}.strip .info{left:16px;right:16px;bottom:18px}.content{padding:20px 16px 48px}}
.banner-preview{display:block;width:min(420px,100%);aspect-ratio:16/9;object-fit:cover;border-radius:8px;margin-top:14px;border:1px solid var(--line)}
/* platform views chart */
.plegend{display:flex;gap:26px;flex-wrap:wrap;margin:-2px 0 18px}.plegend div{display:grid;grid-template-columns:auto auto;column-gap:7px;align-items:center}.plegend div.off{opacity:.45}
.plegend i{width:9px;height:9px;border-radius:2px}.plegend small{font-size:11px;color:var(--muted)}.plegend b{grid-column:2;font-size:19px;letter-spacing:-.6px}
.plegend i.youtube,.pbars .youtube{background:#FF0033}.plegend i.instagram,.pbars .instagram{background:#D62976}.plegend i.threads,.pbars .threads{background:#1E1A26}.plegend i.tiktok,.pbars .tiktok{background:#00BFB3}
.pbars{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:6px;height:230px;align-items:end;padding-top:26px;border-bottom:1px solid #EEE9F7}
.pbars .col{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
.pbars .stack{width:min(100%,34px);display:flex;flex-direction:column-reverse;border-radius:3px 3px 0 0;overflow:hidden;min-height:0}.pbars .stack span{display:block;min-height:2px}
.pbars .col.pre::before{content:'';position:absolute;left:15%;right:15%;bottom:0;height:100%;background:repeating-linear-gradient(135deg,#F4F1FA 0 4px,transparent 4px 9px);border-radius:3px 3px 0 0}
.pbars .col:hover:not(.pre) .stack{filter:brightness(1.1)}
.pbars .col small{position:absolute;bottom:-22px;font-size:10.5px;color:var(--muted)}.pbars .col.today small{color:var(--ink);font-weight:800}
.pbars em{position:absolute;top:-22px;font-style:normal;font-size:11px;font-weight:700;background:var(--ink);color:#fff;padding:2px 7px;border-radius:5px;white-space:nowrap}
.a-chart{padding-bottom:38px}
/* uploads */
.setup-steps{list-style:none;margin:0;padding:0}.setup-steps li{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #EEE9F7}.setup-steps li:last-child{border:0}
.setup-steps .ck{width:22px;height:22px;border-radius:6px;border:1.5px solid #D9D2EA;display:grid;place-items:center;font-size:12px;font-weight:800;flex-shrink:0}.setup-steps li.ok .ck{background:var(--published);border-color:var(--published);color:#fff}
.setup-steps div{flex:1}.setup-steps b{display:block;font-size:13.5px}.setup-steps small{font-size:12px;color:var(--muted)}
.notice{font-size:12.5px;color:var(--ink-2);background:rgba(255,255,255,.75);border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:8px;padding:10px 14px;margin-bottom:18px;line-height:1.6}
.fmt{font-size:11px;font-weight:700;padding:3px 8px;border-radius:5px;background:var(--brand-tint);color:var(--brand-ink)}.fmt.long{background:#E7F0FF;color:#2456C9}
.ust{font-size:11px;font-weight:700;padding:3px 8px;border-radius:5px;background:#F1EFF4;color:#7d7589}.ust.done{background:#E3F6EC;color:var(--published)}.ust.failed{background:#FDECEC;color:var(--failed)}.ust.uploading{background:var(--brand-tint);color:var(--brand-ink)}
td small.err{display:block;color:var(--failed);font-size:11px;margin-top:3px}
.filebox{border:1px dashed #D9D2EA;border-radius:8px;padding:10px 12px;margin-bottom:12px}.filebox b{display:block;font-size:13px}.filebox small{font-size:11.5px;color:var(--muted)}
.draft-row{display:flex;align-items:center;gap:10px;margin:-4px 0 12px}.draft-row small{font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* patterns */
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.finding{position:relative;border:1px solid var(--line);background:#fff;border-radius:8px;padding:14px 16px}
.finding .fgroup{font-size:10.5px;font-weight:700;color:var(--brand-ink);background:var(--brand-tint);padding:2px 7px;border-radius:4px}
.finding>b{display:block;font-size:14px;margin:10px 0 6px;line-height:1.4;padding-right:40px}
.finding .fnum{font-size:28px;font-weight:800;letter-spacing:-1px}.finding .fnum small{font-size:13px;margin-left:2px;color:var(--muted)}
.finding p{font-size:12px;line-height:1.6;margin-top:4px}
.conf{position:absolute;top:12px;right:12px;font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:4px;background:#F1EFF4;color:#7d7589}.conf.경향{background:#FFF4DA;color:#9A6B00}.conf.패턴{background:#E3F6EC;color:var(--published)}
.dash.two{grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);grid-template-areas:none}
.example{border-bottom:1px solid #EEE9F7;padding:12px 0}.example:last-child{border:0}
.ex-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:6px}.ex-head span{font-size:11.5px;color:var(--muted)}
.example p{font-size:12.5px;line-height:1.6;margin-top:3px}.example p small{display:inline-block;min-width:66px;color:var(--muted);font-size:11px}
@media(max-width:1100px){.dash.two{grid-template-columns:1fr}}
/* grouped sidebar */
.navlabel{font-size:10.5px;letter-spacing:.3px;font-weight:700;color:#a39bab;padding:16px 12px 6px}
.sidebar{overflow-y:auto}.nav{padding:9px 12px}
/* reference channels */
.refchans{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-bottom:18px}
.refchan,.refadd{display:flex;align-items:center;gap:10px;background:var(--glass);backdrop-filter:blur(20px);border:1px solid var(--glass-line);border-radius:10px;padding:12px 14px;box-shadow:var(--glass-shadow)}
.refchan img,.refchan i{width:38px;height:38px;border-radius:50%;background:#eee;flex-shrink:0}.refchan div{flex:1;min-width:0}.refchan b{display:block;font-size:13.5px}.refchan small{display:block;font-size:11px;color:var(--muted)}.refchan small.err{color:var(--failed)}
.refadd input{flex:1;min-width:0}
.refgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.refvid{display:flex;flex-direction:column;gap:4px}.refvid b{font-size:13px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.refvid>small{font-size:11px;color:var(--muted);margin-top:4px}
.rthumb{position:relative;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:#111}.rthumb img{width:100%;height:100%;object-fit:cover}
.rthumb .rk{position:absolute;left:8px;top:8px;background:var(--ink);color:#fff;font-size:11px;font-weight:800;padding:2px 7px;border-radius:4px}
.rthumb .rdur{position:absolute;right:8px;bottom:8px;background:#000b;color:#fff;font-size:10.5px;padding:2px 6px;border-radius:4px}
.rstats{display:flex;gap:10px;font-size:11px;color:var(--muted)}.rstats em{font-style:normal;font-weight:800;color:var(--brand-ink);font-size:13px}
.md{font-size:13.5px;line-height:1.75}.md h2,.md h3,.md h4{margin:18px 0 6px;letter-spacing:-.4px}.md h2{font-size:17px}.md h3{font-size:15px}.md ul,.md ol{margin:4px 0 10px;padding-left:20px}.md p{margin:6px 0}
.refadd.inline{box-shadow:none;padding:0;border:0;background:none;backdrop-filter:none}.refadd.inline input{width:220px}
.kwchips{margin-bottom:14px}.kwchips .chip{cursor:pointer}.kwchips .chip small{opacity:.7}.kwchips .chip button{font-size:10px;opacity:.6;margin-left:2px;color:inherit}
/* 성과 보고 — spreadsheet look: white, thin rules, colour only where it means something */
.rfilter{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:12px;font-size:12px}.rfilter span{color:var(--muted);margin-right:2px}.rfilter i{width:1px;height:16px;background:var(--line);margin:0 8px}
.fchip{height:26px;padding:0 10px;border:1px solid var(--line);border-radius:5px;background:#fff;font-size:12px;color:var(--ink-2)}.fchip.on{border-color:var(--ink);color:var(--ink);font-weight:700}
.rep-wrap{overflow:auto;max-height:74vh;background:#fff;border:1px solid #D9D9D9}
table.rep{border-collapse:separate;border-spacing:0;font-size:12.5px;font-variant-numeric:tabular-nums}
.rep th,.rep td{background:#fff;border-right:1px solid #E5E5E5;border-bottom:1px solid #E5E5E5;padding:6px 10px;white-space:nowrap;height:30px}
.rep thead th{position:sticky;top:0;z-index:2;font-weight:700;font-size:12.5px;color:var(--ink);text-align:center;border-bottom:0}
.rep thead tr:nth-child(2) th{top:30px;font-weight:500;font-size:11.5px;color:var(--ink-2);border-bottom:1px solid #BFBFBF}
.rep .c1,.rep .c2{position:sticky;z-index:1;text-align:center;font-weight:500}.rep .c1{left:0;min-width:88px}.rep .c2{left:88px;min-width:128px;border-right:1px solid #BFBFBF}
.rep thead .c1,.rep thead .c2{z-index:3}.rep .c1 small{display:block;font-size:10px;color:#a39bab;font-weight:500}
.rep td.n{text-align:right;min-width:96px}.rep td.nil{color:#B5B5B5}.rep td.miss,.rep-foot .miss{color:#C2410C;font-size:11px}.rep td.neg,.rep .neg{color:#D92D20}.rep sup{color:#C2410C;margin-left:1px}
.rep .fc{background:#F2F2F2}.rep .cl{background:#FBE9DF}.rep thead .fc{background:#E8E8E8}.rep thead .cl{background:#F8DCCB}
.rep .dy{background:#FAFAFC;font-size:12px}.rep thead .dy{background:#F7F6FB;font-weight:500}
.rep td.pend{color:#8A8A8A}
.rep tr.top>*{border-top:1px solid #BFBFBF}.rep tr.sum>*{font-weight:700}.rep tr.sum.top>*{border-top:2px solid #595959}
.rep b.now{font-weight:700;color:var(--brand-ink);margin-left:4px}
.wtog{font-weight:700;font-size:12.5px;color:var(--ink);padding:0;background:none}.wtog:disabled{cursor:default}
.pin{width:100%;min-width:84px;text-align:right;border:0;background:transparent;padding:0;font:inherit;color:inherit}.pin::placeholder{color:#B5B5B5}.pin:focus{outline:2px solid var(--brand);outline-offset:3px;background:#fff}
.rep .tg{background:#fff}
button.link{color:var(--brand-ink);text-decoration:underline;font-size:11.5px;background:none;padding:0}
.rep-foot{font-size:11.5px;color:var(--muted);line-height:1.7;margin-top:10px}
.rep sup.pb,.rep-foot sup.pb{color:#7650FF}
/* Threads / TikTok / X marks wherever a platform dot or chip appears */
.logo-mark.x{background:#0F0F0F}
.pf.threads i,.ev.post .dot.threads,.wbs-pill .dot.threads,.uplist .dot.threads{background:#1E1A26}
.pf.tiktok i,.ev.post .dot.tiktok,.wbs-pill .dot.tiktok,.uplist .dot.tiktok{background:#00BFB3}
.pf.x i,.ev.post .dot.x,.wbs-pill .dot.x,.uplist .dot.x,.plegend i.x,.pbars .x{background:#5B5B66}
.tablewrap{overflow-x:auto}