:root{
  --primary:#3D5F90;--primary-dark:#27476F;--surface:#F6F8FC;--card:#fff;--outline:#D9E0EA;
  --text:#172033;--muted:#6F7A8F;--green:#168066;--green-bg:#E7F5F0;--orange:#C86B2C;
  --orange-bg:#FFF0E5;--blue:#356DB4;--blue-bg:#EAF1FB;--violet:#7756A8;--violet-bg:#F0EBF7;
  --red:#B3261E;--red-bg:#FDECEA;--gold:#8A5A00;--gold-bg:#FFF1C7;--shadow:0 10px 28px rgba(29,48,76,.08);
}
*{box-sizing:border-box}html{font-family:system-ui,-apple-system,"Segoe UI",Tahoma,Arial,sans-serif;color:var(--text);background:var(--surface)}
body{margin:0;min-height:100vh;background:var(--surface)}button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:22px;background:radial-gradient(circle at 85% 15%,#e7eefb 0,transparent 36%),linear-gradient(135deg,#f8faff,#eef3fb)}
.login-card{width:min(430px,100%);background:#fff;border:1px solid var(--outline);border-radius:28px;padding:34px;box-shadow:0 24px 70px rgba(30,53,88,.13);text-align:center}
.brand-mark{width:66px;height:66px;margin:0 auto 16px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(145deg,var(--primary),var(--primary-dark));color:#fff;font-size:29px;font-weight:900;box-shadow:0 12px 26px rgba(61,95,144,.25)}
.brand-mark.small{width:42px;height:42px;margin:0;border-radius:13px;font-size:19px;box-shadow:none}.eyebrow{font-size:12px;font-weight:900;color:var(--primary);letter-spacing:.04em}.login-card h1{font-size:27px;margin:7px 0 8px}.login-card p{color:var(--muted);line-height:1.7;margin:0 0 24px}
.field-label{display:block;text-align:right;font-size:13px;font-weight:800;margin:0 2px 7px}.password-wrap{position:relative}.password-wrap input{padding-left:48px}.password-wrap .icon-btn{position:absolute;left:7px;top:7px}
input,select,textarea{width:100%;border:1px solid var(--outline);background:#fff;color:var(--text);border-radius:14px;padding:12px 13px;outline:none;transition:.18s}
input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(61,95,144,.10)}textarea{resize:vertical}.form-error{min-height:22px;color:var(--red);font-size:13px;margin-top:8px}.login-meta{margin-top:18px;font-size:12px;color:var(--muted)}
.btn{border:0;border-radius:13px;padding:11px 15px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:7px;transition:.18s}.btn:hover{transform:translateY(-1px)}.btn.primary{background:linear-gradient(145deg,var(--primary),var(--primary-dark));color:#fff;box-shadow:0 7px 18px rgba(61,95,144,.20)}.btn.soft{background:#edf2f9;color:var(--primary-dark)}.btn.danger{background:var(--red-bg);color:var(--red)}.btn.good{background:var(--green-bg);color:var(--green)}.wide{width:100%}.login-card .btn{margin-top:14px}
.icon-btn{width:36px;height:36px;border:0;border-radius:11px;background:#eef2f8;color:var(--muted);display:grid;place-items:center}.app-shell{display:flex;min-height:100vh}.sidebar{position:fixed;top:0;right:0;bottom:0;width:258px;background:#fff;border-left:1px solid var(--outline);padding:18px 14px;display:flex;flex-direction:column;z-index:30}.sidebar-brand{display:flex;align-items:center;gap:10px;padding:4px 4px 22px}.sidebar-brand strong{display:block;font-size:14px}.sidebar-brand span{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.nav-list{display:flex;flex-direction:column;gap:6px}.nav-item{width:100%;border:0;background:transparent;color:#4c586d;border-radius:13px;padding:11px 12px;display:flex;align-items:center;gap:10px;text-align:right;font-weight:800}.nav-item:hover{background:#f2f5fa}.nav-item.active{background:#eaf0f9;color:var(--primary-dark)}.nav-icon{width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:rgba(61,95,144,.08);font-size:15px}.nav-item.active .nav-icon{background:var(--primary);color:#fff}.pro-pill{margin-right:auto;background:var(--gold-bg);color:var(--gold);border-radius:999px;padding:3px 7px;font-size:9px;font-weight:900}.pro-pill.large{font-size:10px;padding:5px 9px}.sidebar-foot{margin-top:auto}.release-card{background:linear-gradient(145deg,#f3f6fb,#e9eff8);border:1px solid #dde5f0;border-radius:15px;padding:12px;margin:0 3px 9px}.release-card span,.release-card small{display:block;color:var(--muted);font-size:10px}.release-card strong{display:block;margin:3px 0;font-size:15px;color:var(--primary-dark)}.danger-nav{color:var(--red)}
.main-area{margin-right:258px;min-width:0;width:calc(100% - 258px)}.topbar{height:78px;position:sticky;top:0;z-index:20;background:rgba(246,248,252,.92);backdrop-filter:blur(12px);border-bottom:1px solid rgba(217,224,234,.75);padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}.topbar-title{display:flex;align-items:center;gap:10px}.topbar-title h2{font-size:20px;margin:0}.topbar-title p{font-size:11px;color:var(--muted);margin:3px 0 0}.topbar-actions{display:flex;gap:8px}.menu-btn{display:none;border:0;background:#eef2f8;border-radius:11px;width:40px;height:40px;color:var(--primary-dark)}
.content{padding:22px 24px 36px;max-width:1500px;margin:0 auto}.page-section{display:none}.page-section.active{display:block}.hero-card{border-radius:24px;padding:24px;background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;display:flex;justify-content:space-between;align-items:center;gap:20px;box-shadow:0 16px 35px rgba(39,71,111,.20);margin-bottom:16px}.hero-card h3{margin:7px 0;font-size:23px}.hero-card p{margin:0;color:#dbe6f6;line-height:1.7}.hero-tag{display:inline-block;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.18);padding:5px 9px;border-radius:999px;font-size:10px;font-weight:900}.hero-status{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.16);padding:12px 14px;border-radius:16px;min-width:180px}.hero-status strong,.hero-status small{display:block}.hero-status small{font-size:10px;color:#d8e3f3;margin-top:3px}.pulse{width:10px;height:10px;border-radius:50%;background:#6fe0ac;box-shadow:0 0 0 6px rgba(111,224,172,.15)}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}.stat-card{background:#fff;border:1px solid var(--outline);border-radius:18px;padding:16px;display:flex;align-items:center;gap:13px;box-shadow:0 5px 16px rgba(31,54,86,.035)}.stat-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:20px;font-weight:900;flex:0 0 auto}.stat-icon.blue{background:var(--blue-bg);color:var(--blue)}.stat-icon.green{background:var(--green-bg);color:var(--green)}.stat-icon.gold{background:var(--gold-bg);color:var(--gold)}.stat-icon.violet{background:var(--violet-bg);color:var(--violet)}.stat-icon.red{background:var(--red-bg);color:var(--red)}.stat-card span{font-size:11px;color:var(--muted);font-weight:700}.stat-card strong{display:block;font-size:26px;margin:2px 0}.stat-card small{font-size:9.5px;color:#97a0b0}.automation-stats{grid-template-columns:repeat(5,minmax(0,1fr))}
.overview-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:14px;margin-bottom:16px}.panel{background:#fff;border:1px solid var(--outline);border-radius:20px;padding:17px;box-shadow:0 5px 18px rgba(31,54,86,.035);margin-bottom:16px}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.panel-head h3{margin:0 0 4px;font-size:16px}.panel-head p{margin:0;color:var(--muted);font-size:11px}.muted-chip{background:#f1f4f8;color:var(--muted);font-size:10px;padding:5px 8px;border-radius:999px}.plan-bars{display:grid;gap:12px}.plan-row{display:grid;grid-template-columns:90px 1fr 36px;align-items:center;gap:8px;font-size:11px}.plan-label{font-weight:800}.bar-track{height:8px;border-radius:999px;background:#edf1f6;overflow:hidden}.bar-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--primary),#7896c2);min-width:2px}.plan-row strong{text-align:left;font-size:11px}.mini-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:17px}.mini-stats div{background:#f7f9fc;border-radius:12px;padding:9px;text-align:center}.mini-stats span{font-size:9px;color:var(--muted);display:block}.mini-stats strong{font-size:17px;margin-top:2px;display:block}.smart-panel{background:linear-gradient(155deg,#fff,#f9f6ff)}.automation-snapshot{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.automation-snapshot>div{background:#fff;border:1px solid #e7e8ee;border-radius:13px;padding:11px;position:relative}.automation-snapshot b{font-size:20px;display:block;margin-right:15px}.automation-snapshot small{font-size:9.5px;color:var(--muted);margin-right:15px}.status-dot{position:absolute;right:10px;top:14px;width:7px;height:7px;border-radius:50%}.green-dot{background:var(--green)}.blue-dot{background:var(--blue)}.amber-dot{background:var(--orange)}.violet-dot{background:var(--violet)}.section-jump{margin-top:12px}.link-btn{border:0;background:transparent;color:var(--primary);font-weight:800;font-size:11px}
.filters-row{display:grid;grid-template-columns:minmax(240px,1fr) 180px 180px;gap:9px;margin-bottom:12px}.search-box{position:relative}.search-box span{position:absolute;right:12px;top:10px;color:var(--muted);font-size:18px}.search-box input{padding-right:38px}.table-wrap{overflow:auto;border:1px solid #e5eaf1;border-radius:14px}.table-wrap.compact{border:0}.table-wrap table{width:100%;border-collapse:collapse;min-width:760px}.licenses-table{min-width:1180px!important}th{background:#f6f8fb;color:#657086;font-size:10px;font-weight:900;text-align:right;padding:11px 10px;white-space:nowrap}td{border-top:1px solid #edf0f4;padding:10px;font-size:11px;vertical-align:middle;white-space:nowrap}tbody tr:hover{background:#fafcff}.customer-cell strong,.customer-cell span{display:block}.customer-cell span{color:var(--muted);font-size:9.5px;margin-top:3px}.badge{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:4px 8px;font-size:9.5px;font-weight:900}.badge.active,.badge.connected{background:var(--green-bg);color:var(--green)}.badge.suspended,.badge.expired,.badge.failed,.badge.error{background:var(--red-bg);color:var(--red)}.badge.trial,.badge.disconnected{background:#eef1f5;color:#657086}.badge.monthly,.badge.six_months,.badge.yearly,.badge.lifetime{background:var(--gold-bg);color:var(--gold)}.badge.starting,.badge.awaiting_code,.badge.awaiting_qr,.badge.authenticated,.badge.waiting,.badge.queued{background:var(--blue-bg);color:var(--blue)}.code-box{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;direction:ltr;background:#f5f7fa;padding:5px 7px;border-radius:8px;font-size:10px}.copy-mini{border:0;background:#edf2f8;color:var(--primary);border-radius:8px;padding:5px 7px;font-size:9px;font-weight:800;margin-right:4px}.actions{display:flex;gap:5px}.action-btn{border:0;border-radius:8px;padding:6px 8px;font-size:9.5px;font-weight:800;background:#eef2f8;color:var(--primary-dark)}.action-btn.danger{background:var(--red-bg);color:var(--red)}.action-btn.good{background:var(--green-bg);color:var(--green)}.table-footer{padding:10px 3px 0;color:var(--muted);font-size:10px}
.notice-card{display:flex;align-items:flex-start;gap:13px;padding:16px;border:1px solid #eadfb8;background:linear-gradient(140deg,#fffdf6,#fff9e7);border-radius:18px;margin-bottom:14px}.notice-icon{width:42px;height:42px;border-radius:13px;background:var(--gold-bg);color:var(--gold);display:grid;place-items:center;font-size:20px}.notice-card h3{margin:1px 0 5px}.notice-card p{margin:0;color:#766b50;font-size:11px;line-height:1.6}.activity-list{display:grid;gap:8px}.activity-item{display:flex;align-items:center;gap:11px;padding:11px;border:1px solid #e9edf3;border-radius:13px}.activity-icon{width:38px;height:38px;border-radius:11px;background:#eef3fa;color:var(--primary);display:grid;place-items:center;font-weight:900}.activity-body{flex:1;min-width:0}.activity-body strong{display:block;font-size:11px}.activity-body span{font-size:9.5px;color:var(--muted);display:block;margin-top:3px}.activity-time{font-size:9px;color:var(--muted);direction:ltr}.empty-state{text-align:center;padding:28px;color:var(--muted);font-size:11px}
.modal-backdrop{position:fixed;inset:0;background:rgba(20,29,45,.38);backdrop-filter:blur(3px);display:grid;place-items:center;padding:18px;z-index:70}.modal{width:min(650px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:22px;border:1px solid var(--outline);box-shadow:0 30px 90px rgba(20,35,57,.22);padding:18px}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:17px}.modal-head h3{margin:4px 0 0;font-size:19px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.form-grid label span{display:block;font-size:10.5px;font-weight:800;margin:0 2px 6px;color:#4d596d}.form-grid .full{grid-column:1/-1}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px;padding-top:14px;border-top:1px solid #edf0f4}.toast{position:fixed;left:22px;bottom:22px;z-index:100;background:#1e293b;color:#fff;padding:12px 15px;border-radius:12px;box-shadow:var(--shadow);transform:translateY(20px);opacity:0;pointer-events:none;transition:.2s;font-size:11px}.toast.show{transform:none;opacity:1}
@media(max-width:1100px){.stats-grid{grid-template-columns:repeat(2,1fr)}.automation-stats{grid-template-columns:repeat(3,1fr)}.overview-grid{grid-template-columns:1fr}.filters-row{grid-template-columns:1fr 1fr}.search-box{grid-column:1/-1}}
@media(max-width:820px){.sidebar{transform:translateX(100%);transition:.22s;box-shadow:-18px 0 45px rgba(22,36,57,.12)}.sidebar.open{transform:none}.main-area{margin-right:0;width:100%}.menu-btn{display:grid;place-items:center}.topbar{padding:10px 14px}.topbar-actions .btn.soft{display:none}.content{padding:15px}.hero-card{align-items:flex-start;flex-direction:column}.hero-status{width:100%}.panel-head.responsive{align-items:stretch;flex-direction:column}.filters-row{grid-template-columns:1fr}.search-box{grid-column:auto}}
@media(max-width:560px){.login-card{padding:26px 18px;border-radius:22px}.topbar-title p{display:none}.topbar-title h2{font-size:17px}.topbar-actions .btn.primary{font-size:0;padding:10px 12px}.topbar-actions .btn.primary::after{content:'＋';font-size:20px}.stats-grid,.automation-stats{grid-template-columns:1fr 1fr}.stat-card{padding:12px}.stat-icon{width:40px;height:40px}.stat-card strong{font-size:22px}.mini-stats{grid-template-columns:1fr 1fr}.automation-snapshot{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.modal-actions .btn{flex:1}}
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.price-card{position:relative;border:1px solid var(--outline);background:#fff;border-radius:16px;padding:13px 11px;text-align:right;color:var(--text);display:flex;flex-direction:column;gap:3px;transition:.18s}.price-card:hover,.price-card.selected{border-color:var(--primary);box-shadow:0 0 0 3px rgba(61,95,144,.09);transform:translateY(-1px)}.price-card.popular{background:linear-gradient(145deg,#fffdf6,#fff8df)}.price-card b{font-size:12px}.price-card strong{font-size:22px;color:var(--primary-dark)}.price-card small{font-size:9px;color:var(--muted);line-height:1.4}.save-tag{position:absolute;left:8px;top:8px;background:var(--gold-bg);color:var(--gold);border-radius:999px;padding:3px 6px;font-size:8px;font-weight:900}.pro-benefits{background:linear-gradient(145deg,#f8fbff,#f7f5ff);border:1px solid #e1e7f0;border-radius:16px;padding:13px}.benefits-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.benefits-head strong,.benefits-head small{display:block}.benefits-head small{color:var(--muted);font-size:9.5px;margin-top:3px}.benefits-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px 14px}.benefits-grid span{font-size:10px;color:#40506a;line-height:1.5}@media(max-width:560px){.pricing-grid,.benefits-grid{grid-template-columns:1fr}.price-card{padding:11px}}

.form-section-label{display:block;font-size:10.5px;font-weight:800;margin:0 2px 7px;color:#4d596d}
.login-password-label{margin-top:13px}.badge.basic_lifetime{background:var(--green-bg);color:var(--green)}.cloud-cell{white-space:normal;min-width:120px;line-height:1.45}.cloud-cell small{color:var(--muted)}
.basic-benefits{background:linear-gradient(145deg,#f0faf6,#f8fcfb);border:1px solid #cfe8de;border-radius:15px;padding:12px 14px}.basic-benefits strong,.basic-benefits small{display:block}.basic-benefits strong{color:var(--green);font-size:12px}.basic-benefits small{color:var(--muted);font-size:10px;line-height:1.7;margin-top:4px}
.compact-modal{width:min(610px,100%)}.device-list{display:grid;gap:9px}.device-card{border:1px solid var(--outline);border-radius:14px;padding:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff}.device-card.revoked{opacity:.62;background:#f8f8fa}.device-main{min-width:0}.device-main strong,.device-main span,.device-main small{display:block}.device-main strong{font-size:12px}.device-main span{font-size:9.5px;color:var(--muted);direction:ltr;text-align:right;margin-top:4px}.device-main small{font-size:9px;color:#8c96a7;margin-top:4px}.switch-line{display:flex!important;align-items:center;gap:9px;background:#f7f9fc;border-radius:12px;padding:10px}.switch-line input{width:auto;accent-color:var(--primary)}.switch-line span{margin:0!important}.sidebar-brand span#signedUser{max-width:155px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:560px){.device-card{align-items:stretch;flex-direction:column}.device-card .action-btn{width:100%}}