
:root{
 --bg:#030817;--panel:#08172c;--line:rgba(135,177,255,.15);--text:#f7f9ff;--muted:#93a8c6;
 --blue:#2a7dff;--violet:#8a4dff;--green:#27dea0;--gold:#ffbe32;--red:#ff536b;
 --shadow:0 22px 70px rgba(0,0,0,.34);--safe:env(safe-area-inset-bottom,0px)
}
*{box-sizing:border-box} html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:radial-gradient(900px 500px at 70% -5%,rgba(98,55,255,.15),transparent 60%),var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
button,input,textarea{font:inherit}button,a{color:inherit}a{text-decoration:none}img{display:block;max-width:100%}
.app{display:grid;grid-template-columns:215px 1fr;min-height:100vh}
.sidebar{position:sticky;top:0;height:100vh;background:rgba(2,8,22,.9);border-right:1px solid var(--line);padding:17px 12px;z-index:30;backdrop-filter:blur(18px)}
.brand{font-size:29px;font-weight:950;letter-spacing:.6px;margin:3px 10px 18px}
.nav{display:grid;gap:5px}.nav button{border:0;background:transparent;padding:11px 12px;border-radius:12px;display:flex;gap:10px;align-items:center;text-align:left;cursor:pointer;color:#b7c8df}
.nav button:hover,.nav button.active{background:linear-gradient(135deg,rgba(42,125,255,.25),rgba(138,77,255,.14));color:#fff}
.nav i{font-style:normal;width:21px;text-align:center}
.main{min-width:0}.top{position:sticky;top:0;z-index:25;height:62px;padding:10px 16px;display:flex;gap:10px;align-items:center;background:rgba(3,8,23,.75);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.05)}
.mobile-logo{display:none;font-size:20px;font-weight:900}.search{flex:1;max-width:720px}.search input{width:100%;background:#08162a;border:1px solid #18385e;border-radius:13px;color:white;padding:11px 14px;outline:none}
.topright{margin-left:auto;display:flex;gap:8px}.pill{background:#08162a;border:1px solid var(--line);border-radius:999px;padding:8px 10px;font-size:12px;color:#cbd8e9}
.content{max-width:1540px;margin:auto;padding:16px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.65fr) 360px;gap:11px}
.hero{position:relative;overflow:hidden;min-height:390px;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}
.hero picture,.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,8,23,.96),rgba(2,8,23,.74) 46%,rgba(2,8,23,.17))}
.hero-copy{position:relative;z-index:2;padding:34px;max-width:680px}.kicker{display:inline-flex;gap:7px;align-items:center;padding:6px 10px;border-radius:999px;background:rgba(36,92,190,.16);border:1px solid rgba(84,138,255,.23);font-size:11px}
.dot-live{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}
.hero h1{font-size:54px;line-height:.97;margin:18px 0 10px;letter-spacing:-2px}.hero h1 span{color:#5c94ff}.hero p{color:#c6d2e5;font-size:17px;line-height:1.48}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:19px}.btn{border:1px solid transparent;background:#102641;border-radius:12px;padding:11px 16px;font-weight:800;cursor:pointer}.btn.primary{background:linear-gradient(135deg,#1978ff,#7148ff)}.btn.gold{background:linear-gradient(135deg,#a96f0b,#df9f17)}.btn.ghost{border-color:#21446d;background:#0a1d37}
.statusbox{border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,#07172c,#061226);padding:15px}
.statusbox h3{margin:0 0 10px;font-size:15px}.statusrow{display:flex;justify-content:space-between;gap:10px;border-top:1px solid rgba(255,255,255,.05);padding:9px 0;font-size:12px}.ok{color:#60efba}.bad{color:#ff7488}.warn{color:#ffd26a}
.miniwidgets{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}.mini{border:1px solid var(--line);background:#07162a;border-radius:14px;padding:12px}.mini b{font-size:22px}.mini small{display:block;color:var(--muted);margin-top:4px}
.quick{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:11px}.q{border:1px solid var(--line);background:#07162a;border-radius:14px;padding:11px;display:flex;gap:9px;align-items:center;cursor:pointer}.q:hover{border-color:rgba(100,150,255,.36)}.qi{width:35px;height:35px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,#143d83,#2879ff);flex:0 0 auto}.q b{font-size:12px;display:block}.q small{display:block;font-size:10px;color:var(--muted);margin-top:2px}
.section{content-visibility:auto;contain-intrinsic-size:500px}.section-head{display:flex;align-items:flex-end;justify-content:space-between;margin:22px 2px 10px;gap:12px}.section-head h2{margin:0;font-size:23px}.section-head p{margin:3px 0 0;color:var(--muted);font-size:12px}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.card{border:1px solid var(--line);background:linear-gradient(145deg,#07182e,#061226);border-radius:16px;padding:13px;min-height:170px;display:flex;flex-direction:column;cursor:pointer}.card:hover{transform:translateY(-1px);border-color:rgba(96,145,255,.38)}.chead{display:flex;gap:9px}.ico{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,#133f89,#277cff)}.ico.v{background:linear-gradient(135deg,#3a2088,#8050ff)}.ico.g{background:linear-gradient(135deg,#075a47,#12c88d)}.ico.y{background:linear-gradient(135deg,#72500a,#cb9514)}.ico.r{background:linear-gradient(135deg,#77192e,#d43d57)}.card h3{font-size:14px;margin:1px 0 4px}.state{font-size:10px;color:#66efb8}.state.dev{color:#ffd36b}.card p{font-size:12px;line-height:1.4;color:var(--muted);margin:11px 0}.card .go{margin-top:auto;padding:8px;border-radius:9px;background:#0e294b;border:1px solid #153a62;text-align:center;font-size:11px}
.gallery{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:9px}.visual{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:18px;min-height:235px;background:#061326}.visual.big{grid-row:span 2;min-height:480px}.visual img{width:100%;height:100%;object-fit:cover}.visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(2,8,23,.94))}.vcopy{position:absolute;left:14px;right:14px;bottom:13px;z-index:2}.vcopy b{font-size:16px}.vcopy p{font-size:11px;color:#c2cee0;margin:4px 0 0}
.panel{display:none;margin-top:12px;border:1px solid rgba(138,77,255,.28);background:#07152b;border-radius:18px;padding:14px}.panel.open{display:block}.products{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.product{border:1px solid rgba(255,190,50,.2);background:#11140d;border-radius:13px;padding:13px}.product p{font-size:11px;color:#afbdd1;min-height:32px}.product .btn{width:100%;padding:9px}
.ai-log{height:240px;overflow:auto;border:1px solid rgba(255,255,255,.06);background:#020a18;border-radius:12px;padding:10px}.msg{max-width:82%;padding:8px 10px;border-radius:10px;margin:6px 0;white-space:pre-wrap;line-height:1.4}.msg.me{margin-left:auto;background:#174d9f}.msg.ai{background:#10213b}.aiform{display:flex;gap:7px;margin-top:8px}.aiform textarea{flex:1;min-height:50px;background:#07162a;color:white;border:1px solid #17395f;border-radius:11px;padding:10px;resize:vertical}
.drawer{position:fixed;inset:0;z-index:80;display:none;background:rgba(1,5,15,.68);backdrop-filter:blur(7px);padding:18px}.drawer.open{display:flex;align-items:center;justify-content:center}.drawerbox{width:min(780px,100%);max-height:min(780px,92vh);overflow:auto;border:1px solid rgba(110,145,255,.26);border-radius:22px;background:linear-gradient(145deg,#091a32,#061124);box-shadow:var(--shadow);padding:18px}.drawerhead{display:flex;justify-content:space-between;gap:12px;align-items:center}.drawerhead h2{margin:0}.close{border:1px solid var(--line);background:#10243f;border-radius:10px;padding:8px 11px;cursor:pointer}.modulegrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:13px}.moduleitem{padding:12px;border:1px solid var(--line);border-radius:13px;background:#091a32}.moduleitem b{display:block}.moduleitem small{display:block;color:var(--muted);margin-top:4px;line-height:1.4}.moduleactions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.bottom{display:none}
.toast{position:fixed;right:15px;bottom:15px;z-index:110;background:#0a1c35;border:1px solid var(--line);border-radius:11px;padding:11px 13px}.toast:not(.show){display:none}
@media(max-width:1180px){.app{grid-template-columns:82px 1fr}.sidebar{padding:12px 8px}.brand{font-size:18px;text-align:center;margin:5px 0 15px}.nav span{display:none}.nav button{justify-content:center}.hero-grid{grid-template-columns:1fr}.statusbox{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.quick{grid-template-columns:repeat(4,1fr)}.cards{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.app{grid-template-columns:1fr}.sidebar{display:none}.mobile-logo{display:block}.top{padding:9px 12px}.content{padding:11px}.hero{min-height:470px}.hero:after{background:linear-gradient(180deg,rgba(2,8,23,.28),rgba(2,8,23,.72) 48%,rgba(2,8,23,.96))}.hero-copy{padding:240px 20px 19px}.hero h1{font-size:42px}.statusbox{grid-template-columns:1fr}.quick{display:flex;overflow:auto;scroll-snap-type:x mandatory}.q{min-width:155px;scroll-snap-align:start}.gallery{grid-template-columns:1fr 1fr}.visual.big{grid-column:1/-1;grid-row:auto;min-height:330px}.cards{grid-template-columns:repeat(2,1fr)}.products{grid-template-columns:repeat(2,1fr)}.bottom{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:9px;right:9px;bottom:calc(8px + var(--safe));z-index:60;background:rgba(6,16,32,.92);border:1px solid var(--line);border-radius:18px;padding:6px;backdrop-filter:blur(18px)}.bottom button{border:0;background:none;font-size:10px;color:#a9bbd4;padding:6px 1px}.bottom strong{display:block;font-size:17px;color:white;margin-bottom:2px}body{padding-bottom:calc(78px + var(--safe))}}
@media(max-width:540px){.search{display:none}.statuspill{display:none}.hero{min-height:540px}.hero-copy{padding:285px 17px 17px}.hero h1{font-size:37px}.hero p{font-size:14px}.actions .btn{flex:1}.cards{grid-template-columns:1fr}.gallery{display:flex;overflow:auto}.visual,.visual.big{min-width:82vw;min-height:310px}.products{grid-template-columns:1fr}.aiform{flex-direction:column}.aiform .btn{width:100%}.modulegrid{grid-template-columns:1fr}.drawer{padding:8px}.drawerbox{border-radius:17px}}
