:root {
  --navy: #142d48;
  --blue: #2c61ac;
  --blue-700: #234e8a;
  --ink: #131e30;
  --muted: #69778c;
  --line: #e1e7ef;
  --soft: #f5f7fa;
  --success: #347c4d;
  --danger: #bf3445;
  --sidebar: 246px;
}

* { box-sizing: border-box; }
html { font-size: 15px; }
body { font-family: Inter, system-ui, -apple-system, sans-serif; color: var(--ink); margin: 0; background: #f5f7fa; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.app-body { min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 50; width: var(--sidebar); padding: 25px 17px 18px; background: #fff; border-right: 1px solid var(--line); display: flex; flex-direction: column; }
.sidebar-brand { display: flex; align-items: center; gap: 11px; min-height: 44px; padding: 0 8px; }
.sidebar-brand img { width: 38px; height: 38px; object-fit: contain; }
.sidebar-brand > span:last-child { min-width: 0; }
.sidebar-brand strong { display: block; font-size: .89rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sidebar-brand small { display: block; color: var(--muted); margin-top: 2px; font-size: .68rem; }
.brand-mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; flex: 0 0 auto; background: var(--navy); color: #fff; font-size: 1.35rem; }
.sidebar-nav { display: flex; flex-direction: column; gap: 4px; margin-top: 28px; }
.sidebar-nav .nav-label { margin: 19px 11px 6px; color: #98a3b3; font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.sidebar-nav a { display: flex; gap: 11px; align-items: center; min-height: 43px; padding: 0 12px; border-radius: 8px; color: #506078; font-size: .86rem; font-weight: 600; text-decoration: none; transition: .18s ease; }
.sidebar-nav a > span { width: 19px; color: #738198; text-align: center; font-size: 1rem; }
.sidebar-nav a:hover { background: #f5f8fc; color: var(--brand-primary); }
.sidebar-nav a.active { background: var(--brand-soft); color: var(--brand-primary); box-shadow: inset 3px 0 0 var(--brand-accent); }
.sidebar-nav a.active > span { color: var(--brand-accent); }
.sidebar-footer { margin-top: auto; padding: 14px 8px 0; border-top: 1px solid var(--line); }
.profile-mini { display: flex; align-items: center; gap: 9px; min-width: 0; }
.profile-mini > span:last-child { min-width: 0; }
.profile-mini strong, .profile-mini small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.profile-mini strong { font-size: .79rem; }
.profile-mini small { font-size: .65rem; color: var(--muted); margin-top: 2px; }
.avatar { display: grid; place-items: center; width: 35px; height: 35px; flex: 0 0 auto; border-radius: 50%; background: var(--brand-soft, #eaf2ff); color: var(--brand-primary, var(--navy)); font-size: .71rem; font-weight: 800; }
.avatar.small { width: 32px; height: 32px; font-size: .65rem; }
.logout-link { display: flex; justify-content: space-between; width: 100%; padding: 12px 2px 0; border: 0; background: transparent; color: #78869a; font-size: .75rem; }
.app-shell { margin-left: var(--sidebar); min-height: 100vh; }
.topbar { height: 76px; padding: 0 34px; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; z-index: 40; }
.topbar > div span, .topbar > div strong { display: block; }
.topbar-eyebrow { color: #8390a3; font-size: .64rem; text-transform: uppercase; letter-spacing: .09em; font-weight: 700; margin-bottom: 2px; }
.topbar strong { font-size: .94rem; }
.topbar-widget { color: var(--brand-accent); font-size: .77rem; font-weight: 700; text-decoration: none; padding: 8px 11px; border: 1px solid #cfdcf0; border-radius: 7px; }
.mobile-menu { display: none; border: 0; background: transparent; font-size: 1.3rem; }
.main-content { padding: 32px 34px 56px; max-width: 1540px; margin: 0 auto; }
.app-alert { border: 1px solid; border-radius: 9px; font-size: .84rem; padding: 12px 15px; }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.page-heading.compact { align-items: center; }
.eyebrow { display: block; color: var(--brand-accent, var(--blue)); font-size: .67rem; font-weight: 800; letter-spacing: .105em; text-transform: uppercase; margin-bottom: 8px; }
.page-heading h1 { margin: 0; font-size: clamp(1.65rem, 3vw, 2.1rem); line-height: 1.1; letter-spacing: -.035em; font-weight: 750; color: #0b1d38; }
.page-heading p { color: var(--muted); font-size: .85rem; margin: 7px 0 0; }
.back-link { display: inline-block; color: var(--brand-accent); text-decoration: none; font-size: .75rem; font-weight: 700; margin-bottom: 9px; }
.heading-actions { display: flex; gap: 9px; }
.btn-primary-app, .btn-secondary-app, .btn-danger-outline { border: 0; border-radius: 8px; min-height: 42px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; font-size: .78rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.btn-primary-app { color: #fff; background: var(--brand-accent, var(--blue)); box-shadow: 0 4px 10px rgba(36,107,219,.16); }
.btn-primary-app:hover { color: #fff; background: var(--blue-700); }
.btn-secondary-app { color: var(--brand-primary, var(--navy)); background: #fff; border: 1px solid #cfd8e5; }
.btn-danger-outline { color: var(--danger); background: #fff; border: 1px solid #e8bec5; }
.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 15px; margin-bottom: 18px; }
.stat-card { min-height: 137px; padding: 19px; background: #fff; border: 1px solid var(--line); border-radius: 10px; position: relative; }
.stat-card > span { color: #66758c; font-size: .73rem; font-weight: 600; display: block; }
.stat-card > strong { font-size: 1.75rem; letter-spacing: -.04em; display: block; margin: 11px 0 2px; color: #102342; }
.stat-card > small { color: #929dad; font-size: .65rem; }
.stat-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; position: absolute; top: 16px; right: 16px; font-weight: 800; }
.stat-icon.blue { background: #edf3fa; color: var(--blue); }.stat-icon.green { background: #edf8f1; color: #347c4d; }.stat-icon.violet { background: #f0edff; color: #684ec9; }.stat-icon.amber { background: #fff4df; color: #b87611; }
.panel { background: #fff; border: 1px solid var(--line); border-radius: 10px; }
.content-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 18px; }
.content-grid > *, .detail-layout > *, .widget-install-grid > *, .settings-grid > * { min-width: 0; }
.dashboard-grid { grid-template-columns: minmax(0,2.1fr) minmax(260px,.9fr); }
.panel-heading { min-height: 75px; padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid #edf0f4; }
.panel-heading h2 { margin: 0; font-size: .98rem; font-weight: 750; letter-spacing: -.015em; }
.panel-heading p { margin: 4px 0 0; font-size: .7rem; color: var(--muted); }
.panel-heading > a { color: var(--brand-accent); text-decoration: none; font-size: .72rem; font-weight: 700; }
.table-wrap { overflow-x: auto; }
.app-table { border-collapse: collapse; width: 100%; min-width: 740px; }
.app-table th { height: 39px; padding: 0 16px; background: #f8fafc; color: #78869a; border-bottom: 1px solid var(--line); text-align: left; text-transform: uppercase; font-size: .61rem; letter-spacing: .06em; font-weight: 750; }
.app-table td { padding: 12px 16px; border-bottom: 1px solid #edf0f4; font-size: .73rem; color: #536178; vertical-align: middle; }
.app-table tr:last-child td { border-bottom: 0; }
.app-table tbody tr:hover { background: #fbfcfe; }
.app-table td > strong, .app-table td > small { display: block; }
.app-table td > strong { color: #253650; font-size: .74rem; }.app-table td > small { color: #929daf; font-size: .63rem; margin-top: 3px; }
.person-cell { display: flex; align-items: center; gap: 10px; min-width: 155px; }
.person-cell strong, .person-cell small { display: block; }.person-cell strong { color: #253650; font-size: .74rem; }.person-cell small { color: #919cad; font-size: .63rem; margin-top: 3px; }
.value-cell { color: #162b4b !important; font-weight: 750; white-space: nowrap; }
.status-pill { display: inline-flex; padding: 4px 8px; border-radius: 20px; font-size: .61rem; font-weight: 700; white-space: nowrap; }
.status-new { color: #a5630c; background: #fff3d7; }.status-contacted { color: #1e63b6; background: #e7f1ff; }.status-appointment,.status-requested { color: #6150b4; background: #efeaff; }.status-won { color: #16714b; background: #e4f6ed; }.status-lost { color: #9b3c49; background: #fae8eb; }
.row-action { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 6px; border: 1px solid #d8e0ea; color: var(--brand-accent); text-decoration: none; font-weight: 700; }
.empty-cell { text-align: center; color: var(--muted) !important; padding: 50px 20px !important; }
.quick-panel { padding-bottom: 14px; }
.quick-panel > a { margin: 0 16px; padding: 13px 4px; border-bottom: 1px solid #edf0f4; display: flex; align-items: center; gap: 11px; text-decoration: none; }
.quick-panel > a .stat-icon { position: static; flex: 0 0 auto; }.quick-panel > a > span:nth-child(2) { flex: 1; }.quick-panel > a strong,.quick-panel > a small { display: block; }.quick-panel > a strong { font-size: .75rem; }.quick-panel > a small { color: var(--muted); font-size: .63rem; margin-top: 3px; }.quick-panel > a > b { color: #9aa5b5; }
.demo-notice { margin: 15px 16px 0; padding: 12px; border-left: 3px solid #d59a39; background: #fffbf2; }.demo-notice strong { font-size: .69rem; color: #7b5412; }.demo-notice p { color: #7d6b4c; font-size: .63rem; margin: 4px 0 0; line-height: 1.5; }
.filterbar { padding: 14px 16px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--line); }
.search-field { height: 39px; width: min(410px,100%); border: 1px solid #d6dee8; border-radius: 7px; display: flex; align-items: center; gap: 8px; padding: 0 11px; background: #fff; }.search-field span { color: #8591a3; }.search-field input { border: 0; outline: 0; width: 100%; font-size: .75rem; }.filterbar select,.status-form select { height: 39px; border: 1px solid #d6dee8; border-radius: 7px; padding: 0 31px 0 11px; background: #fff; font-size: .75rem; color: #43536b; }.filterbar .btn-secondary-app { min-height: 39px; }.clear-filter { font-size: .7rem; color: var(--muted); }
.quiet-link { color: #3c5c85; text-decoration: none; }
.detail-layout { display: grid; grid-template-columns: minmax(0,1.9fr) minmax(270px,.8fr); gap: 18px; }.detail-main,.detail-aside { display: flex; flex-direction: column; gap: 18px; }
.lead-hero { min-height: 155px; padding: 25px; background: linear-gradient(100deg,var(--brand-primary),#17447c); color: #fff; border: 0; display: flex; justify-content: space-between; align-items: center; overflow: hidden; }.lead-hero .eyebrow { color: #bcd2ee; }.lead-hero > div:first-child strong { display: block; font-size: 2.1rem; margin: 4px 0; letter-spacing: -.04em; }.lead-hero > div:first-child > span:last-child { color: #ccdaec; font-size: .72rem; }.value-visual { width: 42%; }.value-visual > span { color: #dce7f5; font-size: .63rem; }.value-visual > span:last-child { float: right; }.value-visual i { display: block; position: relative; height: 8px; background: rgba(255,255,255,.2); border-radius: 9px; margin: 10px 0; }.value-visual i:after { content:""; position:absolute; inset:0 25%; background:#7fdda8; border-radius:8px; }.value-visual i b { position: absolute; z-index: 1; left: 50%; top: -5px; width: 18px; height: 18px; background: #fff; border: 5px solid var(--brand-accent); border-radius:50%; transform:translateX(-50%); }
.detail-list { display: grid; grid-template-columns: 1fr 1fr; margin: 0; }.detail-list.cols { grid-template-columns: 1fr 1fr; }.detail-list > div { padding: 14px 20px; border-right: 1px solid #edf0f4; border-bottom: 1px solid #edf0f4; }.detail-list > div:nth-child(even) { border-right: 0; }.detail-list > div:nth-last-child(-n+2) { border-bottom: 0; }.detail-list dt,.mini-list dt { color: #8793a4; font-size: .63rem; font-weight: 600; margin-bottom: 4px; }.detail-list dd,.mini-list dd { margin:0;color:#263850;font-size:.75rem;font-weight:600; }.detail-list a { color: var(--brand-accent); }.energy-label { display:inline-grid;place-items:center;width:27px;height:24px;background:#259959;color:#fff;border-radius:4px;font-size:.66rem; }
.note-form { padding: 16px 20px; border-bottom:1px solid #edf0f4; }.note-form textarea { width:100%;min-height:82px;border:1px solid #d6dee8;border-radius:8px;padding:11px;font-size:.75rem;resize:vertical;margin-bottom:9px; }.note-form .btn-primary-app { min-height:37px; }.notes-list { padding: 4px 20px 15px; }.empty-note { color:var(--muted);font-size:.72rem;margin:15px 0; }.note { display:flex;gap:10px;padding:15px 0;border-bottom:1px solid #edf0f4; }.note:last-child{border:0}.note strong,.note small { display:block; }.note strong{font-size:.72rem}.note small{font-size:.61rem;color:#929dac;margin-top:2px}.note p{font-size:.72rem;color:#526178;margin:7px 0 0;line-height:1.55}
.status-form { padding:16px 20px 20px; }.status-form select,.status-form .btn-primary-app { width:100%; }.status-form .btn-primary-app{margin-top:9px}.mini-list{margin:0;padding:9px 20px 16px}.mini-list>div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #edf0f4}.mini-list>div:last-child{border:0}.mini-list dt{margin:0}.mini-list dd{text-align:right;font-size:.68rem}.consent-box{margin:16px 20px 10px;padding:11px;background:#eef9f4;display:flex;gap:8px;border-radius:7px;color:#176c4a}.consent-box>span{font-weight:800}.consent-box strong,.consent-box small{display:block;font-size:.68rem}.consent-box small{font-weight:400;color:#5b7e70;margin-top:3px}.detail-aside blockquote{font-size:.64rem;color:#6e7b8d;margin:0 20px 18px;padding:0 0 0 10px;border-left:2px solid #dce3eb;line-height:1.5}.danger-panel{padding:18px 20px}.danger-panel h2{font-size:.84rem}.danger-panel p{font-size:.65rem;color:var(--muted);line-height:1.5}.danger-panel button{border:1px solid #e4b8bf;background:#fff;color:var(--danger);border-radius:7px;min-height:36px;padding:0 10px;font-size:.68rem;font-weight:700;width:100%}.danger-panel button:disabled{opacity:.5;cursor:default}
.button-pair{display:flex;gap:6px}.mini-button{display:inline-flex;align-items:center;min-height:31px;padding:0 9px;border-radius:6px;background:var(--brand-accent);color:white;text-decoration:none;font-size:.64rem;font-weight:700}.mini-button.secondary{background:#fff;color:#475a73;border:1px solid #d5dde8}
.widget-install-grid { display:grid;grid-template-columns:1fr minmax(330px,.72fr);gap:18px;align-items:start }.widget-install-grid>div{display:flex;flex-direction:column;gap:14px}.install-card{padding:20px;display:flex;gap:14px}.step-number{display:grid;place-items:center;width:29px;height:29px;flex:0 0 auto;border-radius:50%;background:var(--brand-soft);color:var(--brand-accent);font-weight:800;font-size:.72rem}.install-card h2{font-size:.92rem;margin:5px 0}.install-card p{font-size:.7rem;color:var(--muted);line-height:1.55}.code-block{display:flex;background:#0f213d;border-radius:8px;overflow:hidden;margin-top:13px}.code-block code{padding:12px;color:#d6e5fa;font-size:.61rem;line-height:1.45;word-break:break-all;flex:1}.code-block button{border:0;background:#1a3b69;color:white;font-size:.65rem;font-weight:700;padding:0 13px}.security-card{display:flex;gap:12px;padding:17px;background:#f1f9f5;border-color:#d5eadf}.security-card>span{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#25915e;color:white;flex:0 0 auto}.security-card h3{font-size:.78rem;margin:1px 0 4px}.security-card p{font-size:.65rem;color:#597266;margin:0;line-height:1.5}.preview-panel{overflow:hidden;position:sticky;top:92px}.preview-top{height:48px;background:#f7f9fc;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 13px}.preview-top>span{display:flex;gap:5px}.preview-top i{width:7px;height:7px;border-radius:50%;background:#d2dae5}.preview-top i:first-child{background:#ed9e95}.preview-top i:nth-child(2){background:#edce7e}.preview-top i:nth-child(3){background:#87cfa3}.preview-top strong{font-size:.67rem}.preview-top small{text-align:right;color:var(--muted);font-size:.57rem}.preview-panel iframe{width:100%;height:620px;border:0;background:#f5f7fa}
.settings-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.72fr);gap:18px;align-items:start}.settings-grid>div{display:flex;flex-direction:column;gap:16px}.form-panel .form-grid{padding:19px 20px}.form-grid{display:grid;gap:15px}.form-grid.two{grid-template-columns:1fr 1fr}.form-grid label{display:flex;flex-direction:column;gap:6px;color:#44536a;font-size:.68rem;font-weight:700}.form-grid label.full{grid-column:1/-1}.form-grid input,.form-grid textarea{width:100%;border:1px solid #d5dde7;border-radius:7px;min-height:40px;padding:9px 10px;color:#22354f;font-size:.73rem;outline:0}.form-grid input:focus,.form-grid textarea:focus{border-color:var(--brand-accent);box-shadow:0 0 0 3px rgba(36,107,219,.08)}.field-hint{color:#929dab;font-size:.6rem;font-weight:400;float:right}.color-input{display:flex;gap:7px}.color-input input[type=color]{width:42px;padding:3px;flex:0 0 auto}.settings-save{align-self:flex-end}.brand-preview{position:sticky;top:92px;padding:16px}.preview-label{color:#7f8b9c;text-transform:uppercase;font-size:.6rem;letter-spacing:.08em;font-weight:700;margin-bottom:12px}.mock-widget{background:linear-gradient(145deg,#fff,var(--brand-soft));padding:27px 24px;border:1px solid #e2e8f0;border-radius:8px;min-height:420px}.mock-brand{display:flex;align-items:center;gap:8px;margin-bottom:34px}.mock-brand .brand-mark{width:30px;height:30px;font-size:1rem}.mock-brand strong{font-size:.76rem}.mock-widget h2{font-size:1.45rem;line-height:1.2;margin:7px 0;color:var(--brand-primary)}.mock-widget>p{font-size:.68rem;color:#64748b;line-height:1.5}.mock-fields{display:grid;grid-template-columns:1.5fr 1fr;gap:7px;margin-top:25px}.mock-fields span{background:#fff;border:1px solid #d6dee9;border-radius:6px;padding:11px;font-size:.67rem;color:#708096}.mock-widget button{border:0;border-radius:7px;background:var(--brand-accent);color:white;width:100%;min-height:42px;margin-top:9px;font-size:.69rem;font-weight:700}.mock-widget footer{margin-top:22px;font-size:.57rem;color:#6b7b91;text-align:center}.brand-preview>small{display:block;color:#8793a5;font-size:.61rem;line-height:1.45;margin-top:10px}

/* Authentication */
.auth-body{min-height:100vh;background:#fafbf9;color:var(--ink);font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.auth-shell{min-height:100vh;display:grid;grid-template-columns:minmax(580px,1.15fr) minmax(440px,.85fr)}
.auth-panel{min-width:0;padding:27px 27px 20px;background:#f2f1ed;display:flex;flex-direction:column;gap:20px}
.auth-brand{display:inline-flex;align-items:center;align-self:flex-start;text-decoration:none}
.auth-brand img{display:block;width:174px;height:auto}
.auth-media{position:relative;min-height:0;flex:1;overflow:hidden;border:1px solid #dbe1e8;border-radius:8px;background:#c4cacc}
.auth-media picture,.auth-media img{display:block;width:100%;height:100%}
.auth-media picture{position:absolute;inset:0}
.auth-media img{object-fit:cover;object-position:center}
.auth-copy{position:absolute;left:27px;bottom:27px;width:min(520px,calc(100% - 54px));padding:29px 31px;background:#fff;border:1px solid #cad5df}
.auth-kicker{margin:0 0 13px;color:#647184;font-size:15px;font-weight:500}
.auth-copy h1{max-width:470px;margin:0;color:var(--navy);font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:clamp(35px,3.3vw,55px);font-weight:650;line-height:1.08;letter-spacing:-.05em}
.auth-copy>p:not(.auth-kicker){max-width:470px;margin:17px 0 0;color:#566478;font-size:16px;line-height:1.65}
.auth-benefits{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:24px 0 0;padding:20px 0 0;border-top:1px solid #dbe1e8;list-style:none}
.auth-benefits li{display:flex;align-items:flex-start;gap:9px}
.auth-benefits i{display:grid;place-items:center;flex:0 0 20px;width:20px;height:20px;margin-top:1px;border-radius:50%;background:#edf8f1;color:#347c4d;font-size:11px;font-style:normal;font-weight:700}
.auth-benefits strong,.auth-benefits small{display:block}
.auth-benefits strong{color:var(--ink);font-size:13px;font-weight:650;line-height:1.35}
.auth-benefits small{margin-top:4px;color:#647184;font-size:11px;line-height:1.5}
.auth-foot{color:#647184;font-size:12px}
.login-panel{position:relative;display:grid;place-items:center;padding:90px clamp(42px,6vw,90px) 60px;background:#fafbf9;border-left:1px solid #dbe1e8}
.auth-back{position:absolute;top:35px;right:42px;color:#44536a;font-size:14px;font-weight:550;text-decoration:none}
.auth-back:hover{color:var(--blue)}
.login-card{width:min(440px,100%)}
.mobile-auth-brand{display:none}
.login-card h2{margin:0;color:var(--navy);font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:clamp(35px,3vw,48px);font-weight:650;line-height:1.12;letter-spacing:-.045em}
.login-card>p{max-width:390px;margin:15px 0 31px;color:#647184;font-size:16px;line-height:1.65}
.login-card .alert{margin-bottom:20px;border-radius:4px;font-size:14px}
.login-form{display:flex;flex-direction:column;gap:20px}
.login-form label{color:#27364b;font-size:14px;font-weight:600}
.login-form input{display:block;width:100%;height:54px;margin-top:8px;padding:0 14px;border:1px solid #cbd4df;border-radius:4px;outline:0;background:#fff;color:var(--ink);font-size:16px}
.login-form input:focus{border-color:var(--blue);box-shadow:0 0 0 2px rgba(44,97,172,.12)}
.password-field{position:relative}
.password-field input{padding-right:78px}
.password-field button{position:absolute;right:12px;top:24px;padding:3px;border:0;background:transparent;color:var(--blue);font-size:13px;font-weight:600}
.login-form .btn-primary-app{width:100%;height:54px;margin-top:2px;border:1px solid var(--blue);border-radius:4px;background:var(--blue);box-shadow:none;color:#fff;font-size:16px;font-weight:600}
.login-form .btn-primary-app:hover{background:var(--blue-700);border-color:var(--blue-700)}
.login-contact{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:28px;padding-top:23px;border-top:1px solid #dbe1e8}
.login-contact p{margin:0;color:#647184;font-size:13px}
.login-contact a{color:var(--blue);font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}

/* Admin */
.admin-body{background:#f5f7fa}.admin-header{height:70px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(25px,calc((100vw - 1240px)/2));position:sticky;top:0;z-index:20}.admin-brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:#102342}.admin-brand strong span{color:var(--blue)}.admin-brand em{font-size:.6rem;font-style:normal;text-transform:uppercase;letter-spacing:.08em;color:#8995a5;padding:4px 7px;background:#f1f4f8;border-radius:4px}.admin-user{display:flex;align-items:center;gap:13px;font-size:.7rem;color:var(--muted)}.admin-user form{margin:0}.admin-user button{border:1px solid #d3dce7;background:#fff;border-radius:6px;padding:6px 10px;font-size:.64rem;color:#4d5e74}.admin-main{max-width:1240px;margin:0 auto;padding:35px 25px 60px}.admin-stats{grid-template-columns:repeat(3,1fr)}.status-text{font-size:1.15rem!important}.status-text.active{color:#168357}.status-text.inactive{color:#b33d4b}.color-swatches{display:flex;gap:8px;padding:17px 20px;border-top:1px solid var(--line)}.color-swatches span{font-size:.61rem;padding:6px 8px 6px 26px;border:1px solid var(--line);border-radius:5px;position:relative}.color-swatches span:before{content:"";position:absolute;left:5px;top:5px;width:16px;height:16px;background:var(--swatch);border-radius:3px}.users-list{padding:5px 20px}.users-list>div{display:flex;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid #edf0f4}.users-list>div:last-child{border:0}.users-list>div>span:nth-child(2){flex:1}.users-list strong,.users-list small{display:block}.users-list strong{font-size:.71rem}.users-list small{font-size:.62rem;color:var(--muted);margin-top:3px}.users-list em{font-size:.58rem;font-style:normal;background:#edf3fb;color:#45698f;padding:4px 6px;border-radius:4px}

/* Shared HuisMax identity */
.sidebar-brand img.platform-logo{width:104px;height:auto;object-fit:contain}
.auth-panel .auth-brand{padding:0;background:transparent}
.auth-panel .auth-brand img{display:block;width:174px;height:auto}
.admin-brand{gap:12px}
.admin-brand img{display:block;width:156px;height:auto}

@media (max-width: 1100px){.stat-grid{grid-template-columns:1fr 1fr}.dashboard-grid,.widget-install-grid,.settings-grid{grid-template-columns:1fr}.preview-panel,.brand-preview{position:static}.preview-panel iframe{height:680px}}
@media (max-width: 900px){:root{--sidebar:225px}.main-content{padding:25px 22px}.topbar{padding:0 22px}.detail-layout{grid-template-columns:1fr}.auth-shell{grid-template-columns:1fr}.auth-panel{display:none}.login-panel{min-height:100vh}.mobile-auth-brand{display:flex;align-items:center;margin-bottom:45px}.mobile-auth-brand img{display:block;width:180px;height:auto}.admin-header{padding:0 18px}}
@media (max-width: 720px){.sidebar{transform:translateX(-102%);transition:transform .2s ease;box-shadow:10px 0 30px rgba(15,35,65,.12)}.sidebar.open{transform:translateX(0)}.app-shell{margin-left:0}.mobile-menu{display:block}.topbar{height:65px;padding:0 15px}.topbar-widget{display:none}.main-content{padding:21px 14px 45px}.page-heading{align-items:flex-start;flex-direction:column}.page-heading .btn-primary-app{width:100%}.heading-actions{width:100%;flex-direction:column}.stat-grid,.admin-stats{grid-template-columns:1fr 1fr}.content-grid{grid-template-columns:1fr}.form-grid.two{grid-template-columns:1fr}.form-grid label.full{grid-column:auto}.detail-list,.detail-list.cols{grid-template-columns:1fr}.detail-list>div{border-right:0}.detail-list>div:nth-last-child(-n+2){border-bottom:1px solid #edf0f4}.detail-list>div:last-child{border-bottom:0}.lead-hero{align-items:flex-start;flex-direction:column;gap:22px}.value-visual{width:100%}.filterbar{align-items:stretch;flex-direction:column}.search-field{width:100%}.auth-body{background:#fff}.login-panel{padding:28px 22px;background:#fff}.admin-brand em,.admin-user>span{display:none}.admin-main{padding:25px 14px}.settings-save{width:100%}}
@media (max-width: 440px){.stat-grid,.admin-stats{grid-template-columns:1fr}.page-heading h1{font-size:1.65rem}.stat-card{min-height:123px}.login-card h2{font-size:1.35rem}}

@media (max-width:1100px){.auth-shell{grid-template-columns:minmax(470px,1fr) minmax(400px,.82fr)}.auth-copy{padding:25px}.auth-benefits{grid-template-columns:1fr}.auth-benefits li:nth-child(2){display:none}}
@media (max-width:900px){.auth-shell{display:block}.auth-panel{display:none}.login-panel{min-height:100vh;padding:40px 32px;background:#fafbf9;border-left:0}.auth-back{top:31px;right:32px}.mobile-auth-brand{display:inline-flex;margin:0 0 75px}.mobile-auth-brand img{display:block;width:174px;height:auto}}
@media (max-width:600px){.login-panel{display:block;padding:25px 22px 45px}.auth-back{top:29px;right:22px;font-size:0}.auth-back::after{content:'← Website';font-size:13px}.mobile-auth-brand{margin-bottom:70px}.mobile-auth-brand img{width:145px}.login-card h2{font-size:36px}.login-card>p{font-size:15px;margin-bottom:27px}.login-contact{display:block}.login-contact a{display:inline-block;margin-top:6px}}