:root{
  --bg:#f4f6f9;
  --panel:#ffffff;
  --panel-soft:#f8fafc;
  --ink:#172033;
  --muted:#6b7587;
  --line:#e2e7ee;
  --line-strong:#d4dbe5;
  --nav:#111827;
  --nav-2:#182235;
  --nav-text:#cbd5e1;
  --primary:#2563eb;
  --primary-dark:#1d4ed8;
  --primary-soft:#eaf1ff;
  --accent:#0f766e;
  --accent-soft:#e8f5f3;
  --sand:#f6efe3;
  --danger:#c2414d;
  --danger-soft:#fff0f1;
  --success:#18794e;
  --success-soft:#eaf7f0;
  --shadow:0 8px 24px rgba(15,23,42,.055);
  --shadow-sm:0 2px 10px rgba(15,23,42,.045);
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--ink);font-size:13px;line-height:1.45;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button{appearance:none}
.app-shell{min-height:100vh;display:flex}
.sidebar{width:218px;background:linear-gradient(180deg,var(--nav) 0%,#0f172a 100%);color:#f8fafc;padding:16px 12px;position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column;border-right:1px solid rgba(255,255,255,.04);z-index:20}
.brand{display:flex;gap:10px;align-items:center;padding:4px 7px 18px;margin-bottom:7px;border-bottom:1px solid rgba(255,255,255,.07)}
.brand-mark,.auth-logo>span{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;display:grid;place-items:center;font-size:18px;font-weight:900;box-shadow:0 6px 18px rgba(37,99,235,.25)}
.brand strong,.brand small{display:block}.brand strong{font-size:13px;letter-spacing:.01em}.brand small{color:#94a3b8;font-size:10px;margin-top:1px}
.sidebar nav{display:grid;gap:4px;margin-top:4px}
.nav-link{display:flex;gap:10px;align-items:center;padding:9px 10px;border-radius:9px;color:var(--nav-text);font-size:12.5px;font-weight:600;transition:.18s ease}
.nav-link span{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;text-align:center;background:rgba(255,255,255,.045);font-size:13px;color:#9fb2c9}
.nav-link:hover{background:rgba(255,255,255,.06);color:#fff}.nav-link.active{background:#1f2b40;color:#fff;box-shadow:inset 3px 0 0 #3b82f6}.nav-link.active span{background:#2563eb;color:#fff}
.side-bottom{margin-top:auto;padding:12px 8px 4px;border-top:1px solid rgba(255,255,255,.07)}.side-bottom a{font-size:11.5px;color:#94a3b8}.side-bottom a:hover{color:#fff}
.main{margin-left:218px;width:calc(100% - 218px);min-height:100vh;display:flex;flex-direction:column}
.topbar{min-height:72px;padding:14px 24px 10px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(226,231,238,.8);background:rgba(244,246,249,.86);backdrop-filter:blur(8px);position:sticky;top:0;z-index:10}
.topbar h1{font-size:22px;line-height:1.15;margin:0;font-weight:800;letter-spacing:-.025em}.topbar p{margin:4px 0 0;color:var(--muted);font-size:11.5px;max-width:740px}
.user-pill{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:7px 10px;font-size:11.5px;font-weight:650;box-shadow:var(--shadow-sm)}
.content{width:100%;padding:16px 24px 20px;flex:1}.footer{padding:7px 24px 16px;color:#8c96a8;font-size:10.5px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-sm)}
.hero-card{min-height:124px;background:linear-gradient(125deg,#172033 0%,#1e3a5f 62%,#245c91 100%);color:#fff;border:1px solid rgba(255,255,255,.04);border-radius:14px;padding:20px 22px;display:flex;justify-content:space-between;gap:22px;align-items:center;box-shadow:0 12px 26px rgba(15,23,42,.12);position:relative;overflow:hidden}
.hero-card:after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;right:-90px;top:-120px;background:radial-gradient(circle,rgba(96,165,250,.28),rgba(96,165,250,0) 70%)}
.hero-card>div,.hero-card>a{position:relative;z-index:1}.hero-card h2{margin:4px 0 6px;font-size:23px;line-height:1.18;letter-spacing:-.025em;max-width:760px}.hero-card p{max-width:760px;opacity:.78;margin:0;line-height:1.45;font-size:12px}.eyebrow{font-size:9.5px;letter-spacing:.14em;font-weight:850;opacity:.72;text-transform:uppercase}
.btn{border:1px solid var(--line-strong);background:#fff;color:var(--ink);padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:750;font-size:11.5px;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:.16s ease;box-shadow:0 1px 2px rgba(15,23,42,.025)}
.btn:hover{transform:translateY(-1px);border-color:#bac4d2;box-shadow:0 5px 12px rgba(15,23,42,.07)}.btn.primary{background:var(--primary);color:#fff;border-color:var(--primary)}.btn.primary:hover{background:var(--primary-dark);border-color:var(--primary-dark)}.hero-card .btn.primary{background:#fff;color:#17365c;border-color:#fff;min-width:124px}.btn.small{padding:6px 9px;font-size:10.5px}.fullw{width:100%}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0}.stat{background:#fff;border:1px solid var(--line);border-radius:11px;padding:12px 14px;position:relative;overflow:hidden}.stat:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:#dce5f5}.stat span{display:block;color:var(--muted);font-size:10.5px;font-weight:650}.stat b{font-size:23px;line-height:1.1;display:block;margin-top:3px;letter-spacing:-.03em}.stat:nth-child(2):before{background:#bfd8ff}.stat:nth-child(3):before{background:#bfe3dc}.stat:nth-child(4):before{background:#e6d7b9}
.two-col{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.8fr);gap:12px}.card-head{display:flex;justify-content:space-between;align-items:center;padding:13px 15px 8px}.card-head h3,.form-card h3,.roadmap h3,.action-card h3{margin:0;font-size:13px;letter-spacing:-.01em}.card-head a{font-size:10.5px;color:var(--primary);font-weight:700}.list{padding:0 7px 8px}.list-row{display:flex;justify-content:space-between;align-items:center;padding:9px 8px;border-top:1px solid #edf0f4;min-height:46px}.list-row:first-child{border-top:0}.list-row b{font-size:11.5px}.list-row small{display:block;color:var(--muted);margin-top:2px;font-size:9.5px}.badge{display:inline-flex;align-items:center;padding:4px 7px;border-radius:999px;background:var(--primary-soft);color:#2856a7;font-size:9.5px;font-weight:800;white-space:nowrap}.checklist{padding:5px 15px 13px;display:grid;gap:0}.check{color:#8b95a5;padding:8px 0;border-top:1px solid #edf0f4;font-size:11.5px}.check:first-child{border-top:0}.check.done{color:var(--success);font-weight:650}.check small{float:right;color:#8c96a8;font-size:9.5px}.empty,.empty-cell{padding:22px;color:var(--muted);text-align:center}.empty.big{margin-top:12px}.toolbar{display:flex;justify-content:flex-end;margin-bottom:10px}.table-card{overflow:hidden}table{width:100%;border-collapse:collapse}th,td{padding:10px 12px;border-bottom:1px solid #edf0f4;text-align:left;font-size:11.5px}tbody tr:hover{background:#fafcff}th{background:#f8fafc;color:#768196;font-size:9px;text-transform:uppercase;letter-spacing:.075em;font-weight:800}.form-card{padding:17px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid .full{grid-column:1/-1}.stack{display:grid;gap:11px}label{display:grid;gap:5px;font-size:10.5px;font-weight:760;color:#536073}input,textarea,select{width:100%;border:1px solid #d6dde7;background:#fff;border-radius:8px;padding:8px 10px;color:var(--ink);outline:none;font-size:11.5px;transition:.15s ease}textarea{resize:vertical;line-height:1.45}input:focus,textarea:focus,select:focus{border-color:#7aa7ef;box-shadow:0 0 0 3px #eaf1ff}.action-row{display:flex;justify-content:flex-end;gap:8px}.section-title{grid-column:1/-1;font-size:11px;font-weight:900;margin-top:3px;padding-top:3px;color:#263247}.hint{font-weight:400;color:var(--muted);font-size:9.5px}.notice{background:var(--primary-soft);color:#35578f;padding:10px 11px;border:1px solid #d9e6ff;border-radius:9px;font-size:11px;margin-bottom:13px}.muted{color:var(--muted)}.ok{color:var(--success)}.bad{color:var(--danger)}
.roadmap{margin-top:12px;padding:15px}.integration{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-top:1px solid #edf0f4}.integration:first-of-type{margin-top:6px}.integration b{font-size:11.5px}.integration small{display:block;color:var(--muted);margin-top:2px;font-size:9.5px}.soon{background:var(--sand);color:#775f35;border-radius:999px;padding:4px 7px;font-size:9px;font-weight:750}
.campaign-top{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(260px,.55fr);gap:12px}.campaign-summary,.action-card{padding:15px}.meta-row{display:flex;gap:7px;align-items:center;color:var(--muted);font-size:10.5px;flex-wrap:wrap}.campaign-summary p{font-size:11.5px;line-height:1.5;margin:8px 0}.action-card p{color:var(--muted);font-size:11px}.strategy{padding:13px 15px;margin:12px 0}.strategy p{margin:4px 0 0;font-size:11.5px}.creative-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.creative{padding:16px;position:relative;overflow:hidden}.creative-no{position:absolute;right:12px;top:5px;font-size:38px;font-weight:900;color:#edf1f6}.angle{font-size:9px;font-weight:850;color:#5a749b;text-transform:uppercase;letter-spacing:.09em}.creative h3{font-size:18px;line-height:1.2;margin:7px 46px 8px 0;letter-spacing:-.02em}.caption{font-size:11.5px;line-height:1.48}.tags{display:flex;flex-wrap:wrap;gap:5px}.tags span{font-size:9px;background:#f1f4f8;color:#5f6978;padding:4px 6px;border-radius:6px}.visual-box{background:#f7f9fc;border:1px solid #edf0f4;border-radius:9px;padding:9px;margin:10px 0;font-size:10.5px}.visual-box p{margin:3px 0 0;color:var(--muted)}.image-form{display:grid;gap:7px}.asset-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin:10px 0}.asset-gallery img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:9px;border:1px solid var(--line)}
.studio{display:grid;grid-template-columns:220px minmax(0,1fr);gap:10px;height:calc(100vh - 128px);min-height:520px}.thread-list{display:flex;flex-direction:column;gap:6px;min-height:0;overflow:auto;padding-right:2px}.thread{background:#fff;border:1px solid var(--line);padding:9px 10px;border-radius:9px;transition:.15s ease}.thread:hover{border-color:#c7d2e2}.thread.active{border-color:#9dbcf0;background:#f0f5ff;box-shadow:inset 3px 0 0 var(--primary)}.thread b,.thread small{display:block}.thread b{font-size:10.5px}.thread small{font-size:8.8px;color:var(--muted);margin-top:3px}.chat-card{display:flex;flex-direction:column;overflow:hidden;min-height:0}.chat-messages{padding:15px;flex:1;display:flex;flex-direction:column;gap:9px;overflow:auto}.chat-welcome{text-align:center;margin:auto;color:var(--muted);max-width:470px}.chat-welcome span{font-size:30px;color:var(--primary)}.chat-welcome h2{color:var(--ink);font-size:18px;margin:8px 0}.chat-welcome p{font-size:11.5px}.bubble{max-width:82%;padding:10px 11px;border-radius:11px;font-size:11.5px;line-height:1.5}.bubble.user{margin-left:auto;background:#1f3a5f;color:#fff;border-bottom-right-radius:4px}.bubble.assistant{background:#f2f5f8;border:1px solid #e7ebf0;border-bottom-left-radius:4px}.bubble small{display:block;margin-top:5px;opacity:.55;font-size:8px}.chat-form{border-top:1px solid var(--line);padding:9px;display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end;background:#fbfcfe}.chat-form textarea{min-height:62px;max-height:120px}
.auth-body{min-height:100vh;background:radial-gradient(circle at 20% 15%,#dbeafe 0,transparent 32%),linear-gradient(135deg,#eef2f7,#f8fafc);display:grid;place-items:center;padding:24px}.auth-card,.setup-card{width:min(420px,100%);background:#fff;border:1px solid var(--line);border-radius:15px;padding:22px;box-shadow:0 18px 50px rgba(15,23,42,.12)}.setup-card{width:min(720px,100%)}.auth-logo{display:flex;align-items:center;gap:10px;margin-bottom:18px}.auth-logo b,.auth-logo small{display:block}.auth-logo b{font-size:13px}.auth-logo small{color:var(--muted);margin-top:2px;font-size:10px}.alert{margin:8px 24px 0;border-radius:9px;padding:9px 11px;font-size:11px}.auth-card .alert,.setup-card .alert{margin:8px 0}.alert.success{background:var(--success-soft);color:#276445;border:1px solid #d6ecdf}.alert.error{background:var(--danger-soft);color:#9a3641;border:1px solid #f6d5d9}.setup-note{color:var(--muted);font-size:10px;line-height:1.45;margin-bottom:0}.asset-item{display:grid;gap:6px}.asset-item .btn.small{font-size:9.5px;padding:6px 8px;text-align:center}.old-demo-asset{padding:14px;border:1px dashed #d2c4a8;border-radius:10px;background:#fcf8ef;color:#5b5142;display:grid;gap:4px}.old-demo-asset small{line-height:1.4;color:#7a6f60;font-size:9.5px}
@media(max-width:1180px){.sidebar{width:196px}.main{margin-left:196px;width:calc(100% - 196px)}.content,.topbar{padding-left:18px;padding-right:18px}.two-col{grid-template-columns:1.25fr .85fr}.studio{grid-template-columns:205px minmax(0,1fr)}}
@media(max-width:900px){.sidebar{width:68px;padding:14px 8px}.brand>div:not(.brand-mark),.nav-link b,.side-bottom{display:none}.brand{padding-left:8px}.nav-link{justify-content:center;padding:8px}.nav-link.active{box-shadow:none}.main{margin-left:68px;width:calc(100% - 68px)}.content,.topbar{padding-left:14px;padding-right:14px}.stats-grid{grid-template-columns:repeat(2,1fr)}.two-col,.campaign-top,.creative-grid,.studio{grid-template-columns:1fr}.studio{height:auto;min-height:0}.thread-list{display:none}.chat-card{min-height:65vh}.topbar{position:static}}
@media(max-width:560px){.sidebar{display:none}.main{margin:0;width:100%}.topbar{padding:14px 12px 9px;min-height:62px}.content{padding:10px 12px 18px}.topbar h1{font-size:19px}.topbar p{font-size:10.5px}.user-pill{display:none}.hero-card{align-items:flex-start;flex-direction:column;min-height:0;padding:17px}.hero-card h2{font-size:20px}.stats-grid{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.creative-grid{grid-template-columns:1fr}.alert{margin:7px 12px 0}.chat-form{grid-template-columns:1fr}.asset-gallery{grid-template-columns:1fr 1fr}table{min-width:680px}.table-card{overflow:auto}.footer{padding-left:12px;padding-right:12px}}
