@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{--navy:#0b1730;--navy-2:#12213e;--blue:#2563eb;--blue-soft:#eaf1ff;--bg:#f4f7fb;--surface:#fff;--border:#e3e9f2;--text:#172033;--muted:#6b768a;--success:#16865c;--danger:#c63e4b;--warning:#b77816;--shadow:0 14px 40px rgba(20,39,74,.08);--radius:16px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;color:var(--text);background:var(--bg);line-height:1.55}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}.muted{color:var(--muted)}.eyebrow{font-size:.72rem;letter-spacing:.16em;font-weight:800;color:var(--blue)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:42px;padding:.65rem 1rem;border:1px solid transparent;border-radius:10px;font-weight:700;transition:.18s ease}.button:hover{transform:translateY(-1px)}.button.primary{background:var(--blue);color:#fff;box-shadow:0 8px 18px rgba(37,99,235,.2)}.button.secondary{background:#fff;border-color:var(--border);color:var(--text)}.button.ghost{border-color:rgba(255,255,255,.24);color:#fff}.button.small{min-height:34px;padding:.4rem .7rem;font-size:.78rem}.button.full,.full{grid-column:1/-1;width:100%}
.brand-mark{width:38px;height:38px;border-radius:11px;background:linear-gradient(145deg,#3b82f6,#1d4ed8);color:#fff;display:grid;place-items:center;font-size:.72rem;font-weight:800;box-shadow:0 8px 20px rgba(37,99,235,.3)}.brand-mark.large{width:54px;height:54px;border-radius:15px;font-size:.92rem}
.app-shell{min-height:100vh;display:flex}.sidebar{position:fixed;inset:0 auto 0 0;width:260px;background:var(--navy);color:#d8e1f1;padding:20px 14px 16px;display:flex;flex-direction:column;z-index:20;transition:width .2s ease,transform .2s ease;overflow-y:auto;scrollbar-width:none}.sidebar::-webkit-scrollbar{display:none}.sidebar-brand{display:flex;align-items:center;gap:12px;padding:0 8px 20px;border-bottom:1px solid rgba(255,255,255,.08)}.sidebar-brand b{display:block;color:#fff;font-size:.92rem}.sidebar-brand small{display:block;color:#7f8da6;font-size:.66rem;margin-top:1px}.sidebar-nav{display:flex;flex-direction:column;gap:5px;padding:18px 0;flex:1}.nav-item{display:flex;align-items:center;gap:12px;min-height:45px;padding:8px 11px;border-radius:11px;color:#9cabc3;font-size:.86rem;font-weight:600}.nav-item:hover{background:rgba(255,255,255,.06);color:#fff}.nav-item.active{background:linear-gradient(90deg,rgba(59,130,246,.26),rgba(59,130,246,.08));color:#fff;box-shadow:inset 3px 0 #60a5fa}.nav-icon{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.07);font-size:.68rem}.sidebar-footer{border-top:1px solid rgba(255,255,255,.08);padding:14px 5px 0}.user-chip{display:flex;align-items:center;gap:9px}.user-chip .avatar{width:33px;height:33px;border-radius:50%;background:#263b60;color:#fff;display:grid;place-items:center;font-weight:700}.user-chip b,.user-chip small{display:block}.user-chip b{font-size:.78rem;color:#fff}.user-chip small{font-size:.65rem;color:#7f8da6;text-transform:uppercase}.logout-button{margin-top:10px;width:100%;border:0;background:rgba(255,255,255,.06);color:#b9c5d8;border-radius:9px;padding:8px;font-size:.75rem}.main-column{margin-left:260px;min-width:0;flex:1;transition:margin-left .2s ease}.topbar{height:82px;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:14px;padding:0 28px;position:sticky;top:0;z-index:15}.topbar h1{margin:0;font-size:1.08rem}.topbar p{margin:2px 0 0;color:var(--muted);font-size:.7rem}.icon-button{width:37px;height:37px;border:1px solid var(--border);background:#fff;border-radius:9px}.top-action{margin-left:auto;color:var(--blue);font-size:.78rem;font-weight:700}.content{padding:26px;max-width:1600px;margin:0 auto}.sidebar-collapsed .sidebar{width:82px}.sidebar-collapsed .sidebar-brand span:last-child,.sidebar-collapsed .nav-item span:last-child,.sidebar-collapsed .sidebar-footer{display:none}.sidebar-collapsed .sidebar-brand{justify-content:center;padding-inline:0}.sidebar-collapsed .nav-item{justify-content:center}.sidebar-collapsed .main-column{margin-left:82px}
.alert{padding:12px 15px;border-radius:11px;margin-bottom:18px;font-size:.82rem;font-weight:600}.alert.success{background:#e9f8f2;color:#0b6846;border:1px solid #c8eddf}.alert.danger{background:#fff0f1;color:#a52836;border:1px solid #f3cdd1}.badge{display:inline-flex;padding:5px 8px;border-radius:999px;font-size:.68rem;font-weight:700}.badge.success{background:#e7f7f0;color:var(--success)}.badge.danger{background:#fff0f1;color:var(--danger)}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}.stat-card,.panel,.welcome-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.stat-card{padding:19px;position:relative;overflow:hidden}.stat-card:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;background:var(--blue-soft);right:-35px;top:-35px}.stat-card span,.stat-card small{display:block;color:var(--muted)}.stat-card span{font-size:.74rem;font-weight:700}.stat-card strong{display:block;font-size:1.65rem;margin:8px 0 3px;letter-spacing:-.04em}.stat-card small{font-size:.67rem}.panel-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:18px}.split-grid{display:grid;grid-template-columns:minmax(340px,.8fr) minmax(480px,1.2fr);gap:18px}.panel{padding:20px;min-width:0}.panel.wide{min-width:0}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}.panel-head h2{font-size:.94rem;margin:0}.panel-head p{font-size:.7rem;color:var(--muted);margin:4px 0 0}.panel-head>a{font-size:.72rem;color:var(--blue);font-weight:700}.setup-list{margin:0;padding:0;list-style:none;counter-reset:item}.setup-list li{position:relative;padding:11px 0 11px 39px;border-bottom:1px solid var(--border)}.setup-list li:last-child{border:0}.setup-list li:before{counter-increment:item;content:counter(item);position:absolute;left:0;top:11px;width:27px;height:27px;border-radius:8px;background:var(--blue-soft);color:var(--blue);display:grid;place-items:center;font-size:.7rem;font-weight:800}.setup-list b,.setup-list span{display:block}.setup-list b{font-size:.77rem}.setup-list span{font-size:.68rem;color:var(--muted);margin-top:2px}
.table-wrap{overflow:auto;scrollbar-width:thin}.table-wrap.compact{margin-top:18px}table{width:100%;border-collapse:collapse;font-size:.75rem}th{text-align:left;color:var(--muted);font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;padding:10px;border-bottom:1px solid var(--border);white-space:nowrap}td{padding:12px 10px;border-bottom:1px solid #edf1f7;vertical-align:middle}td b,td small{display:block}td small{color:var(--muted);font-size:.65rem;margin-top:2px}code,.code-box{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#f1f5fa;color:#33435e;border-radius:6px;padding:3px 6px;font-size:.68rem}.code-box{padding:10px;overflow-wrap:anywhere}.empty{text-align:center;color:var(--muted);padding:28px}.status{display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border-radius:999px;background:#eef2f7;color:#59657a;font-size:.64rem;font-weight:800;text-transform:uppercase}.status:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.status.active,.status.completed,.status.paid,.status.success{background:#e8f7f1;color:var(--success)}.status.pending,.status.processing,.status.running,.status.unpaid,.status.started{background:#fff6e6;color:var(--warning)}.status.suspended,.status.failed,.status.error,.status.overdue,.status.terminated,.status.rolled_back{background:#fff0f1;color:var(--danger)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.stack-form{display:flex;flex-direction:column;gap:14px}label{display:flex;flex-direction:column;gap:6px;color:#3b465a;font-size:.7rem;font-weight:700}input,select,textarea{width:100%;border:1px solid #d9e1ec;border-radius:9px;background:#fbfcfe;color:var(--text);padding:10px 11px;outline:none;font-size:.78rem}input:focus,select:focus,textarea:focus{border-color:#8fb3ff;box-shadow:0 0 0 3px rgba(37,99,235,.09);background:#fff}textarea{resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.check{flex-direction:row;align-items:center;align-self:center}.check input{width:auto}.inline-form{display:flex;align-items:center;gap:6px}.inline-form select{min-width:125px;padding:7px}.server-list,.backup-list{display:flex;flex-direction:column;gap:9px}.server-row,.backup-row{border:1px solid var(--border);border-radius:12px;padding:12px;display:flex;align-items:center;gap:11px}.server-icon{width:38px;height:38px;border-radius:10px;background:var(--blue-soft);color:var(--blue);display:grid;place-items:center;font-weight:800;font-size:.7rem}.server-row>div:nth-child(2){min-width:0;flex:1}.server-row b,.server-row span,.server-row small{display:block}.server-row b{font-size:.78rem}.server-row span,.server-row small{font-size:.65rem;color:var(--muted)}.server-row small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.server-meta{text-align:right}.server-meta small{margin:4px 0}.link-button{border:0;background:none;padding:0;color:var(--blue);font-size:.65rem;font-weight:700}.empty-card{border:1px dashed #cbd6e5;border-radius:12px;padding:24px;text-align:center;color:var(--muted);font-size:.75rem}.gateway-title{display:flex;align-items:center;gap:12px;margin-bottom:19px}.gateway-title h2,.gateway-title p{margin:0}.gateway-title h2{font-size:1rem}.gateway-title p{font-size:.7rem;color:var(--muted)}.gateway-logo{width:45px;height:45px;border-radius:12px;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:800}.update-hero{display:flex;align-items:center;gap:16px;border-bottom:1px solid var(--border);padding-bottom:18px;margin-bottom:17px}.update-icon{width:58px;height:58px;border-radius:16px;background:var(--blue-soft);color:var(--blue);display:grid;place-items:center;font-size:1.8rem}.update-hero h2,.update-hero p{margin:0}.update-hero h2{font-size:1.45rem}.update-hero p{font-size:.7rem;color:var(--muted)}.update-steps{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:17px}.update-steps span{font-size:.68rem;background:#f7f9fc;border:1px solid var(--border);padding:8px;border-radius:8px}.notice{margin-top:17px;background:#f3f7ff;border:1px solid #dce7ff;border-radius:10px;padding:12px}.notice b,.notice p{font-size:.7rem}.notice p{color:var(--muted);margin:3px 0}.backup-row{justify-content:space-between}.backup-row b,.backup-row small{display:block}.backup-row b{font-size:.72rem}.backup-row small{font-size:.62rem;color:var(--muted)}
.welcome-card{display:flex;align-items:center;justify-content:space-between;padding:24px;margin-bottom:18px;background:linear-gradient(120deg,#fff,#f2f7ff)}.welcome-card h2{margin:4px 0;font-size:1.35rem}.welcome-card p{margin:0;color:var(--muted);font-size:.76rem}.service-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.service-cards.expanded{grid-template-columns:repeat(3,minmax(230px,1fr))}.service-card{border:1px solid var(--border);border-radius:13px;padding:15px;background:#fff}.service-card>div:first-child{display:flex;justify-content:space-between;align-items:center}.service-kind{font-size:.62rem;font-weight:800;color:var(--blue);letter-spacing:.08em}.service-card h3{font-size:.87rem;margin:10px 0 3px}.service-card p{font-size:.68rem;color:var(--muted);margin:0 0 13px}.service-card>div:last-child{display:flex;justify-content:space-between;align-items:center}.service-card>div:last-child small{font-size:.62rem;color:var(--muted)}.service-card dl{margin:12px 0}.service-card dl>div{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid #edf1f6;font-size:.67rem}.service-card dt{color:var(--muted)}.service-card dd{margin:0;font-weight:600}.invoice-row{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid var(--border)}.invoice-row:last-child{border:0}.invoice-row b,.invoice-row small{display:block;font-size:.7rem}.invoice-row small{font-size:.62rem;color:var(--muted);margin-top:2px}.invoice-row>span:last-child{text-align:right}
.login-page{min-height:100vh;display:grid;grid-template-columns:1.2fr .8fr;background:#fff}.login-panel{background:radial-gradient(circle at 80% 10%,#214987 0,var(--navy) 45%,#071021 100%);color:#fff;padding:8vw;display:flex;flex-direction:column;justify-content:space-between}.login-panel h1{font-size:clamp(2.2rem,4vw,4.2rem);line-height:1.06;letter-spacing:-.055em;max-width:750px;margin:16px 0}.login-panel p{max-width:630px;color:#a9b8cf;font-size:1rem}.login-features{display:flex;gap:8px;flex-wrap:wrap}.login-features span{border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.06);padding:8px 10px;border-radius:8px;font-size:.7rem}.login-card{align-self:center;width:min(410px,86%);margin:auto}.login-card h2{font-size:1.45rem;margin:30px 0 4px}.login-card>.muted{font-size:.76rem}.login-card small.muted{display:block;text-align:center;margin-top:25px}.back-link{font-size:.72rem;color:var(--blue);font-weight:700}
.storefront{background:#fff}.store-header{height:74px;display:flex;align-items:center;max-width:1200px;margin:auto;padding:0 24px}.store-brand{display:flex;align-items:center;gap:10px}.store-header nav{margin-left:auto;display:flex;align-items:center;gap:25px;font-size:.76rem;font-weight:600}.hero{min-height:650px;background:linear-gradient(145deg,#071427,#0c2345 55%,#123a6e);color:#fff;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px;padding:70px max(24px,calc((100vw - 1200px)/2));overflow:hidden}.hero h1{font-size:clamp(2.7rem,5vw,5rem);letter-spacing:-.06em;line-height:1.02;margin:14px 0 20px}.hero p{color:#adbbcf;max-width:620px}.hero-actions{display:flex;gap:10px;margin-top:28px}.hero-console{border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(4,13,29,.65);box-shadow:0 35px 100px rgba(0,0,0,.35);transform:perspective(1000px) rotateY(-4deg)}.console-head{height:48px;border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center;gap:6px;padding:0 15px}.console-head span{width:8px;height:8px;border-radius:50%;background:#41506a}.console-head b{font-size:.62rem;letter-spacing:.12em;color:#8392aa;margin-left:8px}.console-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:15px}.console-grid article{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:18px}.console-grid article.wide{grid-column:1/-1}.console-grid small,.console-grid span{display:block;color:#8192ac;font-size:.62rem}.console-grid strong{display:block;font-size:1.8rem;margin:8px 0}.infra-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.infra-tags span{color:#d7e3f6;background:rgba(59,130,246,.16);padding:6px 8px;border-radius:6px}.store-section{max-width:1200px;margin:auto;padding:90px 24px}.section-heading{text-align:center;margin-bottom:34px}.section-heading h2{font-size:2rem;letter-spacing:-.04em;margin:8px}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.product-card{border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:0 10px 35px rgba(20,39,74,.06)}.product-type{color:var(--blue);font-size:.63rem;font-weight:800;letter-spacing:.1em}.product-card h3{margin:10px 0 7px}.product-card p{color:var(--muted);font-size:.76rem;min-height:48px}.price{margin:20px 0}.price strong{font-size:1.6rem}.price small{color:var(--muted)}.infra-section{max-width:1150px;margin:0 auto 70px;background:var(--navy);color:#fff;border-radius:22px;padding:45px;display:flex;align-items:center;justify-content:space-between;gap:30px}.infra-section h2{margin:7px 0}.flow-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.flow-row span{padding:10px 12px;border:1px solid rgba(255,255,255,.13);border-radius:8px;font-size:.72rem}.flow-row i{color:#5f78a0}.store-footer{text-align:center;border-top:1px solid var(--border);padding:28px;color:var(--muted);font-size:.7rem}
.install-page{min-height:100vh;display:grid;place-items:center;padding:30px;background:linear-gradient(145deg,#eef3fb,#f8faff)}.install-card{width:min(780px,100%);background:#fff;border:1px solid var(--border);box-shadow:var(--shadow);border-radius:20px;padding:30px}.install-card h1{margin:15px 0 2px}.requirement-grid{display:flex;gap:6px;flex-wrap:wrap;margin:18px 0}.error-page{min-height:100vh;display:grid;place-items:center;text-align:center;background:var(--bg);padding:24px}.error-page>div{max-width:580px}.error-page strong{font-size:5rem;color:var(--blue)}.error-page h1{margin:0 0 15px}.error-page p{color:var(--muted)}
@media(max-width:1050px){.stat-grid{grid-template-columns:1fr 1fr}.split-grid,.panel-grid{grid-template-columns:1fr}.service-cards.expanded{grid-template-columns:1fr 1fr}.hero{grid-template-columns:1fr;padding-top:90px}.hero-console{max-width:700px}.product-grid{grid-template-columns:1fr 1fr}.infra-section{margin-inline:20px;flex-direction:column;align-items:flex-start}}
@media(max-width:720px){.sidebar{transform:translateX(-100%);width:260px}.sidebar-open .sidebar{transform:translateX(0)}.main-column,.sidebar-collapsed .main-column{margin-left:0}.sidebar-collapsed .sidebar{width:260px}.sidebar-collapsed .sidebar-brand span:last-child,.sidebar-collapsed .nav-item span:last-child,.sidebar-collapsed .sidebar-footer{display:block}.sidebar-collapsed .nav-item{justify-content:flex-start}.topbar{height:70px;padding:0 15px}.topbar .top-action{display:none}.content{padding:15px}.stat-grid{grid-template-columns:1fr 1fr;gap:10px}.stat-card{padding:15px}.stat-card strong{font-size:1.3rem}.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.service-cards,.service-cards.expanded{grid-template-columns:1fr}.login-page{grid-template-columns:1fr}.login-panel{display:none}.login-card{padding:50px 0}.store-header nav>a:not(.button){display:none}.hero{min-height:auto;padding:80px 22px}.hero-console{transform:none}.product-grid{grid-template-columns:1fr}.store-section{padding:65px 20px}.infra-section{padding:28px}.welcome-card{align-items:flex-start;flex-direction:column;gap:15px}.update-steps{grid-template-columns:1fr}}
.ticket-thread{display:flex;flex-direction:column;gap:10px;margin:16px 0 20px}.ticket-message{border:1px solid var(--border);border-radius:12px;padding:13px;background:#fbfcfe}.ticket-message.staff{background:#eef5ff;border-color:#d5e4ff}.ticket-message>div{display:flex;justify-content:space-between}.ticket-message b{font-size:.72rem}.ticket-message small{font-size:.62rem;color:var(--muted)}.ticket-message p{font-size:.76rem;margin:9px 0 0}
.alert.warning{background:#fff8e6;color:#7a4b00;border:1px solid #f1d89a}.badge.warning{background:#fff6df;color:#8a5600}.install-card h3{margin:18px 0 10px;font-size:.88rem}.install-card code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.78rem}
