@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Outfit:wght@400;500;600;700;800&display=swap');
:root{--bg:#071b16;--sidebar:#0b241c;--surface:#102d23;--surface2:#15372a;--line:#284839;--mint:#b8df76;--light:#f2f4e9;--muted:#a0b6aa;--gold:#cfb577;--err:#ffb0a5}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--light);font:14px 'DM Sans',system-ui,sans-serif}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:'Outfit',sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:var(--mint)}.shell{display:flex;min-height:100vh}.sidebar{width:255px;min-height:100vh;background:var(--sidebar);border-right:1px solid #244333;display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;padding:28px 19px;z-index:5}.brand{display:flex;align-items:center;gap:10px;margin-bottom:43px}.brand-mark{width:42px;height:42px;display:grid;place-items:center;color:var(--bg);font-family:'Outfit';font-size:29px;font-weight:800;border-radius:13px;background:var(--mint);position:relative}.brand-mark span{font-size:11px;position:absolute;bottom:4px;right:5px}.brand strong{font-size:18px;letter-spacing:-.5px;display:block}.brand small{color:var(--mint);font-size:9px;letter-spacing:2.2px}.workspace{color:#759281;font-size:9px;letter-spacing:2px;padding:0 10px;margin-bottom:12px;font-weight:800}.workspace span{float:right}.nav{display:flex;align-items:center;gap:13px;border:0;background:transparent;width:100%;color:#a1bdad;border-radius:10px;text-align:left;padding:15px 13px;margin:3px 0;font-size:13px;font-weight:700;transition:.2s}.nav span{width:18px;color:#88aa98;font-size:19px;text-align:center}.nav i{font-style:normal;margin-left:auto;font-size:10px;background:#274837;padding:3px 7px;border-radius:7px}.nav.active,.nav:hover{color:var(--mint);background:#1b412d}.nav.active span{color:var(--mint)}.sidebar-bottom{margin-top:auto}.sidebar-card{border:1px solid #35523d;background:linear-gradient(135deg,#183f2b,#0f2e24);padding:18px;border-radius:15px}.sidebar-card b{font-size:13px;color:var(--mint)}.sidebar-card p{font-size:11px;line-height:1.65;color:#9eb8a5;margin:10px 0 0}.copyright{color:#557d67;font-size:10px;text-align:center;margin:22px 0 0}.main-wrapper{margin-left:255px;width:calc(100% - 255px)}.topbar{height:80px;border-bottom:1px solid #214233;display:flex;align-items:center;justify-content:space-between;padding:0 39px;gap:15px}.breadcrumb{font-size:10px;letter-spacing:2px;color:#7b9b89}.breadcrumb span{margin:0 10px;color:#436c53}.breadcrumb b{color:#c5debb}.top-actions{display:flex;align-items:center;gap:15px}.pill{font-size:10px;font-weight:800;letter-spacing:.5px;padding:10px 14px;border:1px solid #796741;border-radius:20px;white-space:nowrap}.pill i{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:#d5b75f}.pill.green{color:var(--mint);border-color:#406d48}.pill.green i{background:var(--mint)}.content{max-width:1440px;margin:auto;padding:34px 39px 85px}.panel{display:none}.panel.active{display:block}.hero{min-height:380px;display:grid;grid-template-columns:1.35fr .65fr;overflow:hidden;border:1px solid #335640;border-radius:20px;background:radial-gradient(ellipse at 65% 50%,#295239 0%,#102e23 46%,#0c281e 100%)}.hero-text{padding:48px 46px;align-self:center;position:relative;z-index:1}.eyebrow,.section-title small{font-size:10px;font-weight:800;letter-spacing:2.1px;color:var(--mint)}.hero h1{max-width:640px;font-weight:700;font-size:clamp(34px,4.1vw,62px);line-height:1.04;letter-spacing:-2.4px;margin:22px 0}.hero h1 em{font-style:normal;color:var(--mint)}.hero p{max-width:545px;line-height:1.75;color:#b1c8b8;font-size:14px}.hero-actions{display:flex;gap:11px;margin-top:24px;flex-wrap:wrap}.btn{border-radius:9px;font-weight:800;padding:12px 16px;border:1px solid #355d42;transition:.2s;color:var(--light);background:#173b2b}.btn:hover{filter:brightness(1.12);transform:translateY(-1px)}.btn.primary{background:var(--mint);color:#112417;border-color:var(--mint)}.btn.ghost{background:#173c2b}.btn.subtle{background:transparent;color:#b7d0be}.btn.wide{width:100%;margin-top:13px}.hero-visual{height:380px;position:relative;min-width:0}.hero-visual img{height:100%;width:100%;object-fit:cover;object-position:center 38%;mask-image:linear-gradient(90deg,transparent 0%,#000 22%)}.portrait-label{position:absolute;bottom:19px;right:18px;background:rgba(8,30,19,.85);border:1px solid #51744f;border-radius:9px;padding:10px 14px}.portrait-label small{display:block;font-size:8px;letter-spacing:1.2px;color:var(--mint)}.portrait-label b{font-size:11px}.section-title{display:flex;align-items:end;justify-content:space-between;gap:18px;margin:35px 0 18px}.section-title h2,.section-title h1{font-size:27px;margin:6px 0 0;letter-spacing:-.5px}.section-title p{color:var(--muted);margin:10px 0 0}.subtle-text{color:#6f9580;font-size:11px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.metric,.card{background:var(--surface);border:1px solid var(--line);border-radius:14px}.metric{padding:22px}.metric-head{font-size:19px;color:var(--mint)}.metric-head span{color:#9fbaa8;margin-left:9px;font-size:9px;letter-spacing:1px;font-weight:800}.big-number{font-size:38px;font-family:'Outfit';font-weight:750;margin:12px 0 0}.big-number small{font-size:16px;color:var(--mint)}.metric-foot{border-top:1px solid #294b38;padding-top:14px;color:#8fa99a;font-size:10px}.two-col{display:grid;grid-template-columns:1.05fr .95fr;gap:19px;margin-top:22px}.card{padding:24px}.card h3{font-size:19px;margin-bottom:13px}.card p{line-height:1.65}.card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.micro-tag{color:var(--mint);border:1px solid #436b4d;font-size:9px;font-weight:800;padding:7px;border-radius:7px}.steps{margin-top:16px}.step{display:flex;gap:13px;align-items:center;padding:14px 0;border-bottom:1px solid #294838}.step:last-child{border:0}.step>span{width:30px;height:30px;border-radius:9px;color:var(--mint);font-family:Outfit;font-weight:700;border:1px solid #3b6548;display:grid;place-items:center}.step b{font-size:13px;display:block}.step small{color:#839f8c;font-size:11px;margin-top:4px;display:block}.mini-picture{height:225px;overflow:hidden;position:relative;border-radius:13px 13px 0 0}.mini-picture img{width:100%;height:100%;object-fit:cover;object-position:center 43%}.mini-picture:after{content:'';position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#102d23)}.small-muted{font-size:12px;color:#91ad9b;line-height:1.75}.filters{display:flex;gap:11px;align-items:center;margin:25px 0 10px}.filters input{flex:1}.filters select{min-width:220px}input,textarea,select{display:block;width:100%;border:1px solid #365c47;background:#0a2119;color:var(--light);border-radius:9px;padding:13px 14px;outline:none}input:focus,textarea:focus,select:focus{border-color:var(--mint)}::placeholder{color:#73927d}.result-summary{color:#84a08e;font-size:12px;margin:13px 0}.reels-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.reel-card{background:var(--surface);border:1px solid var(--line);border-radius:13px;overflow:hidden;display:flex;flex-direction:column}.reel-card:hover{border-color:#7a9b56}.reel-card-top{background:linear-gradient(140deg,#1d4a32,#153c2c);padding:15px;min-height:145px;position:relative}.reel-id{font-size:11px;color:var(--mint);font-weight:800;letter-spacing:1px}.reel-card-top h3{font-size:21px;max-width:300px;line-height:1.19;margin:24px 0 0}.reel-cat{position:absolute;right:12px;top:12px;color:#d5e7d2;font-size:9px;background:#315e42;border-radius:5px;padding:5px}.reel-card-bottom{padding:16px;flex:1;display:flex;flex-direction:column}.reel-card-bottom p{font-size:12px;color:#a1b6a7;line-height:1.55;min-height:57px}.card-actions{margin-top:auto;display:flex;gap:7px}.card-actions .btn{flex:1;font-size:12px;padding:10px 8px}.status-chip{font-size:9px;color:#a3b6a1;margin-bottom:11px}.status-chip b{color:var(--gold)}.status-chip.online b{color:var(--mint)}.pagination{display:flex;justify-content:center;align-items:center;gap:20px;margin:28px 0}.pagination span{font-size:12px;color:var(--muted)}.form-label{display:block;color:#c2d6c7;margin:15px 0 8px;font-size:11px;font-weight:700}.simulation-result{background:#0a2419;border:1px dashed #416145;margin-top:17px;border-radius:12px;padding:16px;line-height:1.65;color:#b2c7b2;white-space:pre-wrap;font-size:12px}.phone{border:7px solid #1e4733;padding:17px;border-radius:22px;background:#092017;max-width:330px;margin:24px auto}.phone-title{padding:9px;border-bottom:1px solid #3b6346;font-weight:800}.phone-title span{font-size:9px;color:#b0c8b9;float:right}.message{font-size:11px;line-height:1.5;max-width:88%;margin:18px 0;padding:12px;border-radius:13px}.message.green{background:#2a5d37;color:#f2ffed;border-bottom-left-radius:2px}.message.user{background:#345169;margin-left:auto;border-bottom-right-radius:2px}.connection-row{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid #294838;font-size:12px;gap:10px}.connection-row strong{font-size:11px;color:var(--gold);text-align:right}.copy-field{display:flex;align-items:center;gap:10px;border:1px solid #375e47;background:#0b261c;padding:10px;border-radius:9px;margin:19px 0;overflow:hidden}.copy-field code{font-size:11px;color:#a2db91;overflow-wrap:anywhere;flex:1}.permission{display:inline-block;margin:3px 5px 3px 0;padding:8px;background:#1b4630;border-radius:7px;font-size:11px;color:#a9d3a2}.guide h3{color:var(--mint);margin:24px 0 7px}.guide h3:first-child{margin-top:0}.guide p{color:#a4bbaa;line-height:1.75;margin:0}.guide code{color:#d8d8a7}.empty-state{text-align:center;padding:45px;color:#a0b7a4}.overlay{position:fixed;inset:0;background:rgba(2,14,9,.78);display:flex;align-items:center;justify-content:center;z-index:60;padding:20px}.hidden{display:none!important}.modal,.login-box{background:#102b21;border:1px solid #456c4e;border-radius:18px;box-shadow:0 25px 100px rgba(0,0,0,.45);color:var(--light)}.modal{width:min(670px,98vw);max-height:92vh;display:flex;flex-direction:column}.modal-head{padding:23px 26px;border-bottom:1px solid #2e4e3b;display:flex;justify-content:space-between}.modal-head h2{margin:8px 0 0}.x-btn{color:#a4c6b0;border:0;background:transparent;font-size:20px;align-self:flex-start}.modal-body{padding:22px 25px;overflow-y:auto;min-height:120px}.modal-foot{display:flex;justify-content:flex-end;gap:12px;border-top:1px solid #305441;padding:18px 25px}.tab-mini{display:flex;gap:8px;margin-bottom:18px}.tab-mini button{background:#153728;color:#a0b6a8;padding:9px 15px;border:1px solid #355b43;border-radius:7px}.tab-mini button.selected{background:var(--mint);color:#0b2517}.editor-pane{font-size:13px;line-height:1.65;white-space:pre-wrap;color:#bbd2bf}.editor-pane h4{font-size:13px;color:var(--mint);margin:14px 0 6px}.editor-pane textarea{white-space:normal}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.checkboxline{display:flex;gap:9px;align-items:center;margin:17px 0}.checkboxline input{width:18px;height:18px}.notice{font-size:11px;color:#d4c18b;background:#3a331f;border-radius:7px;padding:11px}.login-box{width:min(400px,98vw);padding:28px}.login-box p{font-size:12px;color:var(--muted);line-height:1.6}.login-box .brand-mark{margin-bottom:20px}.login-box .modal-foot{margin:20px -28px -28px}.error{color:var(--err);font-size:12px;margin-top:10px}.toast{position:fixed;bottom:22px;right:22px;max-width:320px;z-index:100;border:1px solid #8ab46e;background:#1a4730;color:#e7f9e7;border-radius:11px;padding:14px 18px;box-shadow:0 6px 30px #0007;font-size:12px}
@media(max-width:1100px){.reels-grid{grid-template-columns:repeat(2,1fr)}.metrics{grid-template-columns:repeat(2,1fr)}.hero-text{padding:33px}.hero h1{font-size:38px}.hero-visual{height:360px}.hero{min-height:360px}}@media(max-width:800px){.sidebar{position:static;width:100%;min-height:auto;padding:14px 16px}.brand{margin:0 0 15px}.workspace,.sidebar-bottom{display:none}#mainNav{display:flex;overflow-x:auto;gap:5px}.nav{white-space:nowrap;width:auto;padding:9px 12px;font-size:11px}.nav span{display:none}.nav i{display:none}.shell{display:block}.main-wrapper{margin:0;width:100%}.topbar{height:auto;min-height:58px;padding:10px 17px;flex-wrap:wrap}.breadcrumb{font-size:8px}.content{padding:17px 16px 55px}.hero{grid-template-columns:1fr;min-height:unset}.hero-visual{height:185px;order:-1}.hero-visual img{object-position:center 36%;mask-image:linear-gradient(0deg,transparent 0%,black 25%)}.hero-text{padding:20px 24px 30px}.hero h1{font-size:33px;letter-spacing:-1px}.hero p{font-size:12px}.two-col{grid-template-columns:1fr}.reels-grid{grid-template-columns:1fr 1fr}.section-title h1{font-size:22px}.section-title{align-items:start}.section-title .btn{font-size:10px}.top-actions{gap:7px}.pill{font-size:9px;padding:7px}.topbar .btn{padding:8px;font-size:11px}}@media(max-width:530px){.reels-grid{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(2,1fr);gap:9px}.metric{padding:13px}.big-number{font-size:30px}.metric-head span{font-size:8px}.metric-foot{font-size:9px}.filters{flex-direction:column}.filters select{min-width:100%}.form-grid{grid-template-columns:1fr}.hero-actions .btn{font-size:11px}.modal-head{padding:15px}.modal-body{padding:15px}.modal-foot{padding:14px}.section-title{flex-direction:column}.sidebar{overflow:hidden}}