:root{--on-navy:#07162f;--on-navy-2:#0b234f;--on-navy-3:#10366f;--on-blue:#24558b;--on-orange:#f59f00;--on-orange-2:#ffb316;--on-paper:#f4f7fb;--on-card:#fff;--on-text:#0b1930;--on-muted:#6b7d94;--on-line:#dde5ef;--on-success:#168a4b;--on-danger:#b23a3a;--on-shadow:0 18px 50px rgba(13,29,55,.09)}
*{box-sizing:border-box}html{background:var(--on-paper)}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--on-text);background:var(--on-paper)}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}.on-portal-body{min-height:100vh}.on-portal-app{display:grid;grid-template-columns:270px minmax(0,1fr);min-height:100vh}.on-sidebar{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,#07162f,#081b3c 74%,#0b234b);color:#fff;padding:24px 18px 18px;display:flex;flex-direction:column;z-index:50;box-shadow:18px 0 45px rgba(4,18,42,.08)}.on-sidebar-brand{display:flex;align-items:center;gap:13px;padding:0 8px 24px;border-bottom:1px solid rgba(255,255,255,.09)}.on-sidebar-brand img{width:74px;height:44px;object-fit:contain;background:#fff;border-radius:12px;padding:6px}.on-sidebar-brand strong{display:block;font-size:17px}.on-sidebar-brand span{display:block;margin-top:3px;color:#93a7c5;font-size:11px}.on-side-nav{display:grid;gap:7px;margin-top:22px}.on-side-nav a,.on-sidebar-bottom a{display:grid;grid-template-columns:28px 1fr 16px;align-items:center;gap:10px;min-height:50px;padding:0 13px;border-radius:13px;color:#c8d4e7;font-weight:750;font-size:13px;transition:.18s}.on-side-nav a i,.on-sidebar-bottom a i{font-style:normal;font-size:16px;text-align:center}.on-side-nav a b{font-size:18px;color:#6f88ab}.on-side-nav a:hover,.on-side-nav a.active{background:rgba(255,255,255,.075);color:#fff}.on-side-nav a.active{box-shadow:inset 3px 0 0 var(--on-orange)}.on-side-nav a.active i{color:var(--on-orange)}.on-sidebar-bottom{margin-top:auto;display:grid;gap:4px;padding-top:18px;border-top:1px solid rgba(255,255,255,.09)}.on-sidebar-bottom a{grid-template-columns:28px 1fr;color:#9fb0c8}.on-sidebar-bottom a:hover{background:rgba(255,255,255,.06);color:#fff}.on-portal-main{min-width:0}.on-topbar{height:80px;background:rgba(255,255,255,.95);display:flex;align-items:center;padding:0 30px;border-bottom:1px solid var(--on-line);position:sticky;top:0;z-index:35;backdrop-filter:blur(12px)}.on-topbar-title span{display:block;color:var(--on-orange);font-size:9px;letter-spacing:.16em;font-weight:900}.on-topbar-title strong{display:block;margin-top:4px;font-size:19px}.on-user-chip{margin-left:auto;display:flex;align-items:center;gap:10px}.on-user-avatar{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,#0c2a5d,#15427f);color:#fff;font-weight:900}.on-user-name strong{display:block;font-size:12px}.on-user-name small{display:block;margin-top:2px;color:var(--on-muted);font-size:9px}.on-mobile-menu{display:none}.on-portal-content{padding:30px;max-width:1500px;margin:0 auto}.on-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.on-page-head>div>span{display:block;color:var(--on-orange);font-size:9px;letter-spacing:.16em;font-weight:900}.on-page-head h1{margin:7px 0 5px;font-size:30px;letter-spacing:-.035em}.on-page-head p{margin:0;color:var(--on-muted);font-size:13px;line-height:1.45}.on-primary,.on-secondary-button,.on-danger-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;border-radius:11px;padding:0 16px;border:0;font-weight:850;cursor:pointer}.on-primary{background:linear-gradient(135deg,#ffb51b,#f49300);color:#fff;box-shadow:0 9px 20px rgba(244,147,0,.18)}.on-secondary-button{background:#fff;border:1px solid var(--on-line);color:#203a5e}.on-secondary-button:hover{border-color:#bac8da}.on-danger-button{background:#fff1f1;color:#a93232;border:1px solid #f0cdcd}.on-alert{margin:0 0 18px;padding:12px 15px;border-radius:11px;font-size:12px;font-weight:750;transition:.3s}.on-alert-success{background:#eaf8ef;color:#197343;border:1px solid #cfead8}.on-alert-error{background:#fff0f0;color:#9d3030;border:1px solid #f0caca}.on-alert.fade{opacity:.18}.on-stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px}.on-stats-grid article{background:#fff;border:1px solid var(--on-line);border-radius:17px;padding:18px 20px;box-shadow:0 8px 22px rgba(11,28,54,.035);position:relative;overflow:hidden}.on-stats-grid article:after{content:"";position:absolute;right:-30px;bottom:-40px;width:110px;height:110px;border-radius:50%;background:radial-gradient(circle,rgba(31,91,159,.08),transparent 65%)}.on-stats-grid article.priority:after{background:radial-gradient(circle,rgba(245,159,0,.14),transparent 65%)}.on-stats-grid span{display:block;color:#7c8da2;text-transform:uppercase;font-size:9px;letter-spacing:.06em;font-weight:900}.on-stats-grid strong{display:block;margin-top:7px;font-size:30px;letter-spacing:-.04em}.on-stats-grid .priority strong{color:#d87900}.on-stats-grid small{display:block;margin-top:3px;color:#9aa8ba;font-size:9px}.on-filter-card{display:grid;grid-template-columns:repeat(3,minmax(140px,1fr)) auto;gap:10px;align-items:end;background:#fff;border:1px solid var(--on-line);border-radius:16px;padding:14px;margin-bottom:18px}.on-filter-card label>span,.on-field>span{display:block;margin-bottom:6px;color:#66798f;font-size:9px;letter-spacing:.05em;text-transform:uppercase;font-weight:900}.on-filter-card select,.on-field input,.on-field textarea{width:100%;border:1px solid #ccd7e4;border-radius:10px;background:#fff;color:#172b46;outline:0;transition:.16s}.on-filter-card select{height:42px;padding:0 11px}.on-field input{height:44px;padding:0 12px}.on-field textarea{padding:11px 12px;resize:vertical;min-height:86px}.on-filter-card select:focus,.on-field input:focus,.on-field textarea:focus{border-color:#e9a521;box-shadow:0 0 0 3px rgba(245,159,0,.10)}.on-filter-submit{height:42px;min-height:42px}.on-table-card{background:#fff;border:1px solid var(--on-line);border-radius:17px;box-shadow:var(--on-shadow);overflow:visible}.on-table-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 18px;border-bottom:1px solid #e9eef4}.on-table-toolbar strong{display:block;font-size:14px}.on-table-toolbar span{display:block;margin-top:2px;color:var(--on-muted);font-size:9px}.on-table-count{margin:0!important;padding:6px 9px;border-radius:999px;background:#f0f5fa;color:#667b95!important;font-weight:800}.on-table-scroll{overflow-x:auto}.on-leads-table{width:100%;border-collapse:collapse;min-width:980px}.on-leads-table th{text-align:left;background:#f8fafc;color:#73859c;font-size:8px;letter-spacing:.06em;text-transform:uppercase;padding:11px 13px;border-bottom:1px solid #e8edf3}.on-leads-table td{padding:13px;border-bottom:1px solid #edf1f5;font-size:11px;white-space:nowrap;vertical-align:middle}.on-leads-table tr:last-child td{border-bottom:0}.on-leads-table td strong{font-size:11px}.on-wa-link{color:#09884d;font-weight:800}.on-status{display:inline-flex;align-items:center;justify-content:center;padding:7px 9px;border-radius:999px;font-size:8px;font-weight:900;text-transform:uppercase}.on-status.pending{background:#fff1c7;color:#b76400;border:1px solid #f5d577}.on-status.contacted{background:#e9f8ef;color:#3c8757;border:1px solid #caead6}.on-row-menu{border:0;background:transparent;color:#8191a4;cursor:pointer;font-size:14px}.on-leads-table td:last-child{position:relative}.on-row-actions{display:none;position:absolute;right:12px;top:42px;min-width:160px;padding:6px;background:#fff;border:1px solid var(--on-line);border-radius:11px;box-shadow:0 14px 34px rgba(10,26,50,.16);z-index:10}.on-row-actions.open{display:grid}.on-row-actions a{padding:9px 10px;border-radius:8px;font-size:10px}.on-row-actions a:hover{background:#f4f7fb}.on-row-actions a.danger{color:#aa3636}.on-empty{text-align:center!important;color:#7d8da1;padding:28px!important}.on-mobile-leads{display:none}.on-form-card{background:#fff;border:1px solid var(--on-line);border-radius:18px;box-shadow:var(--on-shadow);overflow:hidden}.on-form-section-head{padding:18px 20px 0}.on-form-section-head strong{display:block;font-size:15px}.on-form-section-head span{display:block;margin-top:3px;color:var(--on-muted);font-size:10px}.on-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:18px 20px 22px}.on-field.full{grid-column:1/-1}.on-form-divider{height:1px;background:#e9eef4}.on-form-actions{display:flex;justify-content:flex-end;padding:0 20px 20px}.on-help-card{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-bottom:16px;padding:13px 15px;background:#fff;border:1px solid var(--on-line);border-radius:13px;color:#5c7089;font-size:10px}.on-help-card strong{color:#1a314f}.on-help-card code{padding:3px 6px;border-radius:6px;background:#edf4fa;color:#1c4c7b;font-weight:850}.on-help-card span{flex-basis:100%}.on-content-form{display:grid;gap:10px}.on-editor-section{background:#fff;border:1px solid var(--on-line);border-radius:15px;overflow:hidden;box-shadow:0 7px 18px rgba(10,28,52,.03)}.on-editor-section>summary{list-style:none;cursor:pointer;padding:15px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fbfcfe}.on-editor-section>summary::-webkit-details-marker{display:none}.on-editor-section>summary span{font-size:13px;font-weight:900}.on-editor-section>summary small{color:#8998aa;font-size:9px;font-weight:700}.on-editor-section>summary:after{content:"+";margin-left:8px;color:#71849b;font-size:18px}.on-editor-section[open]>summary:after{content:"−"}.on-editor-grid{border-top:1px solid #edf1f5}.on-sticky-save{position:sticky;bottom:14px;display:flex;justify-content:flex-end;pointer-events:none;margin-top:4px}.on-sticky-save .on-primary{pointer-events:auto;box-shadow:0 14px 32px rgba(244,147,0,.28)}.on-sidebar-backdrop{display:none}.on-remember{display:flex;gap:8px;align-items:center;margin:11px 0 16px;color:#63778f;font-size:10px}.on-remember input{accent-color:var(--on-orange)}.on-password-wrap{position:relative}.on-password-wrap input{padding-right:70px}.on-password-toggle{position:absolute;right:7px;top:7px;height:30px;border:0;border-radius:8px;background:#eef3f8;color:#355376;font-size:9px;font-weight:850;padding:0 10px;cursor:pointer}.on-login-submit{width:100%;min-height:48px}.on-login-security{text-align:center;margin-top:12px;color:#8a9aad;font-size:9px}.on-portal-login-body{min-height:100vh;background:#07162f}.on-login-layout{min-height:100vh;display:grid;grid-template-columns:minmax(420px,1.05fr) minmax(440px,.95fr)}.on-login-brand{position:relative;padding:70px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(145deg,#07162f,#0a2553 62%,#12376e);overflow:hidden}.on-login-brand:before{content:"";position:absolute;left:-18%;bottom:-34%;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(245,159,0,.21),transparent 60%)}.on-login-orb{position:absolute;right:12%;top:15%;width:210px;height:210px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#fff5c8,#ffc02d 24%,#f79300 63%,rgba(247,147,0,.08) 70%,transparent 72%);filter:drop-shadow(0 0 42px rgba(245,159,0,.28));opacity:.85}.on-login-logo{position:relative;width:112px;background:#fff;border-radius:15px;padding:8px}.on-login-copy{position:relative;margin-top:44px;max-width:650px}.on-login-copy>span,.on-login-card-head>span{display:block;color:#ffb320;font-size:9px;letter-spacing:.17em;font-weight:900}.on-login-copy h1{margin:12px 0 14px;color:#fff;font-size:clamp(42px,5vw,68px);line-height:1.01;letter-spacing:-.045em}.on-login-copy p{margin:0;color:#cbd8ea;font-size:16px;line-height:1.6;max-width:560px}.on-login-panel{display:grid;place-items:center;background:#f6f8fb;padding:40px}.on-login-card{width:min(100%,430px);background:#fff;border:1px solid var(--on-line);border-radius:22px;padding:30px;box-shadow:0 24px 60px rgba(12,29,55,.13)}.on-login-card-head{margin-bottom:20px}.on-login-card-head h2{margin:8px 0 4px;font-size:29px;letter-spacing:-.03em}.on-login-card-head p{margin:0;color:var(--on-muted);font-size:11px}.on-login-card .on-field{display:block;margin-bottom:13px}
@media(max-width:1100px){.on-portal-app{grid-template-columns:230px minmax(0,1fr)}.on-sidebar{padding-inline:14px}.on-sidebar-brand img{width:62px}.on-portal-content{padding:24px}.on-filter-card{grid-template-columns:1fr 1fr}.on-filter-submit{grid-column:1/-1}.on-login-brand{padding:48px}.on-login-layout{grid-template-columns:1fr 1fr}}
@media(max-width:820px){body.on-nav-open{overflow:hidden}.on-portal-app{display:block}.on-sidebar{position:fixed;left:0;top:0;width:min(290px,84vw);transform:translateX(-104%);transition:.22s;height:100vh;z-index:80}.on-sidebar.open{transform:translateX(0)}.on-sidebar-backdrop{position:fixed;inset:0;background:rgba(5,17,39,.46);z-index:70}.on-sidebar-backdrop.open{display:block}.on-topbar{height:68px;padding:0 16px}.on-mobile-menu{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--on-line);border-radius:11px;background:#fff;margin-right:11px}.on-mobile-menu span,.on-mobile-menu span:before,.on-mobile-menu span:after{content:"";display:block;width:19px;height:2px;background:#183453;border-radius:6px;position:relative}.on-mobile-menu span:before{position:absolute;top:-6px}.on-mobile-menu span:after{position:absolute;top:6px}.on-user-name{display:none}.on-portal-content{padding:18px 14px 26px}.on-page-head{align-items:flex-start}.on-stats-grid{grid-template-columns:1fr 1fr}.on-stats-grid article:last-child{grid-column:1/-1}.on-filter-card{grid-template-columns:1fr}.on-filter-submit{grid-column:auto}.on-table-card{display:none}.on-mobile-leads{display:grid;gap:11px}.on-lead-card{background:#fff;border:1px solid var(--on-line);border-radius:15px;padding:14px;box-shadow:0 8px 20px rgba(11,28,52,.04)}.on-lead-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.on-lead-card-head strong{display:block;font-size:14px}.on-lead-card-head span:not(.on-status){display:block;margin-top:3px;color:#8594a6;font-size:8px}.on-lead-card dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}.on-lead-card dl div{padding:9px;border-radius:10px;background:#f7f9fc}.on-lead-card dt{color:#7c8da2;text-transform:uppercase;font-size:7px;font-weight:900}.on-lead-card dd{margin:3px 0 0;font-size:10px;font-weight:800}.on-lead-card-actions{display:grid;grid-template-columns:1fr auto;gap:8px}.on-lead-card-actions .on-primary,.on-lead-card-actions .on-danger-button{min-height:39px;font-size:9px}.on-form-grid{grid-template-columns:1fr}.on-field.full{grid-column:auto}.on-sticky-save{bottom:8px}.on-login-layout{grid-template-columns:1fr}.on-login-brand{min-height:310px;padding:34px 26px}.on-login-orb{width:150px;height:150px;right:6%;top:8%}.on-login-copy{margin-top:24px}.on-login-copy h1{font-size:40px;max-width:500px}.on-login-copy p{font-size:12px}.on-login-panel{padding:24px 16px 34px}.on-login-card{padding:23px;border-radius:18px;margin-top:-18px;position:relative;z-index:3}}
@media(max-width:520px){.on-topbar-title span{font-size:7px}.on-topbar-title strong{font-size:14px}.on-user-avatar{width:32px;height:32px}.on-page-head{display:grid}.on-page-head h1{font-size:25px}.on-page-head p{font-size:10px}.on-page-head .on-secondary-button{width:100%;min-height:40px;font-size:9px}.on-stats-grid{gap:8px}.on-stats-grid article{padding:14px}.on-stats-grid strong{font-size:24px}.on-filter-card{padding:11px}.on-filter-card label>span,.on-field>span{font-size:7px}.on-filter-card select,.on-field input{height:39px;font-size:10px}.on-field textarea{font-size:10px}.on-form-section-head{padding:15px 14px 0}.on-form-section-head strong{font-size:13px}.on-form-grid{padding:14px}.on-form-actions{padding:0 14px 14px}.on-editor-section>summary{padding:13px 14px}.on-editor-section>summary span{font-size:11px}.on-help-card{font-size:8px}.on-login-brand{min-height:280px}.on-login-logo{width:90px}.on-login-copy h1{font-size:33px}.on-login-copy p{font-size:10px}.on-login-card-head h2{font-size:24px}.on-login-card{padding:20px}.on-login-submit{min-height:44px}.on-status{font-size:7px;padding:6px 7px}}

/* v0.7.2 — portal refinement */
.on-login-orb{display:none!important}
.on-login-solar-art{position:absolute;right:8%;top:12%;width:320px;height:250px;pointer-events:none;filter:drop-shadow(0 22px 36px rgba(2,16,39,.28))}
.on-login-sun{position:absolute;right:22px;top:0;width:96px;height:96px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#fff9d9 0 8%,#ffe58d 20%,#ffc23b 48%,#f59600 82%,#e87500 100%);box-shadow:0 0 26px rgba(255,191,48,.45),0 0 72px rgba(245,159,0,.20);animation:onSolarFloat 5.4s ease-in-out infinite}
.on-login-sun:after{content:"";position:absolute;width:46px;height:46px;border-radius:50%;left:12px;top:14px;background:radial-gradient(circle,rgba(255,255,246,.92),rgba(255,242,192,.52) 30%,transparent 72%);filter:blur(2px);animation:onSolarHotspot 6.8s ease-in-out infinite alternate}
.on-login-light-beam{position:absolute;right:54px;top:72px;width:210px;height:110px;background:linear-gradient(200deg,rgba(255,218,119,.26),rgba(255,201,68,0) 72%);clip-path:polygon(70% 0,100% 12%,38% 100%,0 82%);filter:blur(5px);opacity:.72}
.on-login-panel-3d{position:absolute;left:22px;right:70px;bottom:26px;height:112px;border-radius:16px;background:linear-gradient(115deg,transparent 0 20%,rgba(255,255,255,.46) 30%,rgba(255,255,255,.04) 41%,transparent 50%),linear-gradient(rgba(72,140,218,.30) 1px,transparent 1px),linear-gradient(90deg,rgba(72,140,218,.30) 1px,transparent 1px),linear-gradient(145deg,#17427f,#0b2c66 52%,#071d49);background-size:auto,34px 27px,34px 27px,auto;border:1px solid rgba(129,181,232,.46);transform:perspective(620px) rotateX(57deg) rotateZ(-8deg);box-shadow:0 28px 34px rgba(1,14,35,.26),inset 0 0 38px rgba(0,0,0,.12);overflow:hidden}
.on-login-panel-3d span{position:absolute;top:-15%;left:-32%;width:28%;height:130%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent);filter:blur(5px);transform:rotate(12deg);animation:onPanelSheen 5.1s ease-in-out infinite}
.on-login-energy-dot{position:absolute;left:88px;bottom:44px;width:13px;height:13px;border-radius:50%;background:#fff8d2;box-shadow:0 0 0 7px rgba(255,180,0,.13),0 0 22px rgba(255,173,0,.65);animation:onEnergyDrift 3.4s ease-in-out infinite}
@keyframes onSolarFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes onSolarHotspot{0%{transform:translate(0,0) scale(.94)}45%{transform:translate(25px,7px) scale(1.05)}100%{transform:translate(8px,27px) scale(1.08)}}
@keyframes onPanelSheen{0%{left:-35%;opacity:.08}38%{opacity:.7}66%{left:112%;opacity:.24}100%{left:112%;opacity:0}}
@keyframes onEnergyDrift{0%,100%{transform:translate(0,0)}50%{transform:translate(22px,-10px)}}
.on-login-panel{place-items:center;justify-items:start;padding-left:clamp(38px,7vw,120px)}
.on-login-options{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:11px 0 16px}
.on-login-options .on-remember{margin:0;min-width:0}
.on-forgot-password{color:#315b87;font-size:10px;font-weight:800;white-space:nowrap}
.on-forgot-password:hover{text-decoration:underline}

.on-content-page-head{align-items:center}
.on-page-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap}
.on-save-status{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 10px;border-radius:999px;font-size:9px;font-weight:850;border:1px solid #d7e4ee;background:#fff;color:#5c7188;transition:.18s}
.on-save-status i{font-style:normal;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:#e9f7ef;color:#178449}
.on-save-status.is-dirty{background:#fff8e5;border-color:#f4d58a;color:#9b6200}
.on-save-status.is-dirty i{background:#ffe7a4;color:#a96800}
.on-preview-button{color:#143e70;border-color:#b9caDC;background:#f8fbff}
.on-token-card{align-items:center}
.on-token{border:0;padding:4px 7px;border-radius:7px;background:#edf4fa;color:#174e80;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px;font-weight:850;cursor:pointer;transition:.15s}
.on-token:hover{background:#dfeefa;transform:translateY(-1px)}
.on-editor-section>summary small{display:flex;align-items:center;gap:9px}
.on-section-status{display:inline-flex;align-items:center;min-height:20px;padding:0 7px;border-radius:999px;font-size:8px;font-weight:850}
.on-section-status.complete{background:#eaf8ef;color:#197343}
.on-section-status.incomplete{background:#fff2d2;color:#9b6400}
.on-field-title{display:flex!important;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px!important}
.on-field-title>span{color:#66798f;font-size:9px;letter-spacing:.05em;text-transform:uppercase;font-weight:900}
.on-reset-field{border:0;background:transparent;color:#748aa2;padding:2px 0;font-size:8px;font-weight:800;cursor:pointer;opacity:.72}
.on-reset-field:hover{color:#d47b00;opacity:1;text-decoration:underline}
.on-field-hint{display:block;margin-top:6px;color:#8292a5;font-size:8px;line-height:1.45;text-transform:none;letter-spacing:0;font-weight:500}
.on-change-bar{align-items:center;gap:10px;padding:10px;border:1px solid #f0d287;border-radius:15px;background:rgba(255,250,235,.96);box-shadow:0 15px 34px rgba(74,53,7,.14);backdrop-filter:blur(10px);pointer-events:auto}
.on-change-bar[hidden]{display:none!important}
.on-change-copy{margin-right:auto;min-width:0}
.on-change-copy strong{display:block;color:#835500;font-size:11px}
.on-change-copy span{display:block;margin-top:2px;color:#8b795b;font-size:8px}
.on-discard-button{min-height:40px;border:1px solid #e3d7bf;border-radius:10px;background:#fff;color:#6a5d47;padding:0 14px;font-weight:850;font-size:9px;cursor:pointer}
.on-change-bar .on-primary{min-height:40px;font-size:10px}

.on-history-card{margin-top:18px;background:#fff;border:1px solid var(--on-line);border-radius:17px;box-shadow:0 8px 22px rgba(10,28,52,.035);overflow:hidden}
.on-history-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:18px 20px;border-bottom:1px solid #edf1f5}
.on-history-head>div>span{display:block;color:var(--on-orange);font-size:8px;letter-spacing:.15em;font-weight:900}
.on-history-head h2{margin:5px 0 3px;font-size:16px}
.on-history-head p{margin:0;color:var(--on-muted);font-size:9px}
.on-history-head>small{color:#8293a6;font-size:8px;font-weight:800}
.on-history-list{display:grid}
.on-history-item{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:11px;align-items:center;padding:13px 18px;border-bottom:1px solid #edf1f5}
.on-history-item:last-child{border-bottom:0}
.on-history-avatar{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#edf4fa;color:#214d7d;font-weight:900;font-size:11px}
.on-history-main strong{font-size:10px}.on-history-main>span{margin-left:7px;color:#8999aa;font-size:8px}.on-history-main p{margin:4px 0 0;color:#65798f;font-size:8px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.on-history-count{padding:5px 7px;border-radius:999px;background:#f2f6fa;color:#70839a;font-size:7px;font-weight:850}
.on-history-empty{padding:20px;color:#8393a5;font-size:9px;text-align:center}

@media(max-width:1100px){
  .on-login-panel{justify-items:center;padding-left:40px;padding-right:40px}
  .on-login-solar-art{right:3%;width:270px;height:220px;opacity:.9}
  .on-page-actions{max-width:520px}
}
@media(max-width:820px){
  .on-login-solar-art{right:4%;top:6%;width:220px;height:170px;opacity:.82}.on-login-sun{width:70px;height:70px}.on-login-panel-3d{height:80px;bottom:18px}.on-login-energy-dot{bottom:32px}
  .on-content-page-head{display:grid;align-items:start}.on-page-actions{justify-content:flex-start;max-width:none}.on-page-actions .on-secondary-button{flex:1;min-width:180px}
  .on-change-bar{bottom:8px;display:grid;grid-template-columns:1fr auto auto}.on-change-copy{grid-column:auto}.on-history-item{grid-template-columns:32px minmax(0,1fr)}.on-history-count{grid-column:2;justify-self:start}
}
@media(max-width:520px){
  .on-login-solar-art{width:170px;height:130px;right:1%;top:4%;opacity:.72}.on-login-sun{width:52px;height:52px}.on-login-panel-3d{left:10px;right:45px;height:61px;bottom:13px}.on-login-light-beam{display:none}.on-login-energy-dot{display:none}
  .on-login-options{align-items:flex-start;gap:8px}.on-forgot-password{font-size:8px}.on-login-options .on-remember{font-size:8px}
  .on-page-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.on-save-status{grid-column:1/-1;justify-self:start}.on-page-actions .on-secondary-button{min-width:0;width:100%;font-size:8px;padding:0 9px;min-height:38px}
  .on-editor-section>summary small{gap:5px}.on-editor-section>summary small>span:first-child{display:none}.on-section-status{font-size:7px}
  .on-field-title>span{font-size:7px}.on-reset-field{font-size:7px}.on-field-hint{font-size:7px}
  .on-change-bar{grid-template-columns:1fr 1fr;padding:8px}.on-change-copy{grid-column:1/-1}.on-discard-button,.on-change-bar .on-primary{width:100%;min-height:38px;font-size:8px}
  .on-history-head{align-items:flex-start;padding:14px;}.on-history-head p{font-size:8px}.on-history-item{padding:11px 13px}.on-history-main>span{display:block;margin:2px 0 0}.on-history-main p{white-space:normal}
}
@media(prefers-reduced-motion:reduce){.on-login-sun,.on-login-sun:after,.on-login-panel-3d span,.on-login-energy-dot{animation:none!important}}


/* v0.8.0 — ON users and role-based access */
.on-access-section{margin-top:26px;padding-top:4px;border-top:1px solid var(--on-line)}
.on-access-head{margin:24px 0 16px}
.on-access-head h1{font-size:23px}
.on-access-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,.85fr);gap:16px;align-items:start}
.on-user-create-card,.on-user-list-card{margin:0}
.on-field select{width:100%;height:44px;padding:0 12px;border:1px solid #ccd7e4;border-radius:10px;background:#fff;color:#172b46;outline:0}
.on-field select:focus{border-color:#e9a521;box-shadow:0 0 0 3px rgba(245,159,0,.10)}
.on-role-explainer{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:0 14px 14px}
.on-role-explainer article{padding:12px;border:1px solid #e4eaf1;border-radius:12px;background:#f8fafc}
.on-role-explainer strong{display:block;color:#17375e;font-size:10px}
.on-role-explainer span{display:block;margin-top:4px;color:#708196;font-size:8px;line-height:1.45}
.on-user-access-list{display:grid;padding:0 14px 14px}
.on-user-access-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid #edf1f5}
.on-user-access-row:last-child{border-bottom:0}
.on-user-access-avatar{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(145deg,#0c2a5d,#15427f);color:#fff;font-weight:900;font-size:11px}
.on-user-access-main{min-width:0}
.on-user-access-main strong{display:block;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.on-user-access-main span{display:block;margin-top:3px;color:#7b8da2;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.on-role-badge{display:inline-flex;align-items:center;min-height:24px;padding:0 8px;border-radius:999px;font-size:7px;font-weight:900;white-space:nowrap}
.on-role-badge.admin{background:#e8f0ff;color:#1e4f8e}
.on-role-badge.consultant{background:#fff2d8;color:#9a6100}
.on-user-access-empty{padding:20px 4px;color:#8293a6;font-size:9px;text-align:center}
@media(max-width:1050px){.on-access-grid{grid-template-columns:1fr}}
@media(max-width:520px){
  .on-access-head h1{font-size:19px}.on-access-grid{gap:12px}
  .on-role-explainer{grid-template-columns:1fr;padding:0 10px 10px}
  .on-user-access-list{padding:0 10px 10px}
  .on-user-access-row{grid-template-columns:32px minmax(0,1fr);padding:10px 0}
  .on-user-access-avatar{width:30px;height:30px}
  .on-role-badge{grid-column:2;justify-self:start}
}


/* v0.8.2 — HD realistic solar login artwork + animated light/fire effects */
.on-portal-login-body{background:#07162f}
.on-login-brand{
  isolation:isolate;
  background:#06162f url('../img/login-solar-hd-desktop.webp') center center/cover no-repeat!important;
}
.on-login-brand:before{
  content:"";
  position:absolute;
  inset:0;
  width:auto;height:auto;border-radius:0;
  background:linear-gradient(180deg,rgba(2,16,39,.03),rgba(2,16,39,.08) 72%,rgba(2,16,39,.22));
  z-index:1;
  pointer-events:none;
}
.on-login-brand>.on-login-logo,
.on-login-brand>.on-login-copy{opacity:0;visibility:hidden;pointer-events:none}
.on-login-hd-effects{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}

/* Animated irregular corona around the existing photorealistic sun. */
.on-login-fire-corona{
  position:absolute;right:7.1%;top:5.2%;width:190px;height:190px;border-radius:50%;
  background:
    repeating-conic-gradient(from 12deg,
      rgba(255,222,108,.0) 0 5deg,
      rgba(255,192,34,.72) 7deg 10deg,
      rgba(255,111,0,.32) 11deg 13deg,
      rgba(255,224,121,0) 15deg 20deg);
  -webkit-mask:radial-gradient(circle,transparent 0 42%,#000 51% 62%,rgba(0,0,0,.55) 69%,transparent 78%);
  mask:radial-gradient(circle,transparent 0 42%,#000 51% 62%,rgba(0,0,0,.55) 69%,transparent 78%);
  filter:blur(4px) brightness(1.24) saturate(1.2);
  opacity:.72;
  mix-blend-mode:screen;
  animation:onHdFireRotate 11s linear infinite,onHdFireBreathe 2.7s ease-in-out infinite;
}
.on-login-fire-corona:before,
.on-login-fire-corona:after{
  content:"";position:absolute;border-radius:50%;inset:18px;
  background:conic-gradient(from 40deg,
    transparent 0 9%,rgba(255,234,153,.62) 12%,transparent 16% 32%,
    rgba(255,145,0,.55) 37%,transparent 43% 60%,rgba(255,214,91,.48) 66%,transparent 73% 100%);
  filter:blur(6px);mix-blend-mode:screen;
}
.on-login-fire-corona:after{inset:27px;animation:onHdFireReverse 7.6s linear infinite;opacity:.72}
.on-login-fire-bloom{
  position:absolute;right:8.15%;top:7.1%;width:154px;height:154px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,248,205,.16) 0 25%,rgba(255,178,24,.18) 48%,rgba(255,113,0,.08) 62%,transparent 74%);
  box-shadow:0 0 36px rgba(255,177,17,.26),0 0 92px rgba(255,123,0,.15);
  mix-blend-mode:screen;animation:onHdBloom 2.15s ease-in-out infinite;
}

/* Glass reflection travels over the photographic photovoltaic module. */
.on-login-panel-glint{
  position:absolute;left:34%;top:35.8%;width:54%;height:30%;
  clip-path:polygon(15% 10%,95% 0,100% 70%,8% 100%);
  overflow:hidden;opacity:.72;mix-blend-mode:screen;
}
.on-login-panel-glint:before{
  content:"";position:absolute;top:-24%;left:-34%;width:19%;height:150%;
  background:linear-gradient(90deg,transparent,rgba(255,255,245,.1) 24%,rgba(255,246,198,.68) 50%,rgba(255,255,255,.16) 70%,transparent);
  filter:blur(5px);transform:rotate(13deg);animation:onHdPanelSweep 4.8s cubic-bezier(.34,.05,.24,1) infinite;
}
.on-login-energy-trace{
  position:absolute;left:39%;top:34.8%;width:40%;height:2px;border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(255,244,190,.9),rgba(255,151,0,.85),transparent);
  transform:rotate(-38deg);transform-origin:left center;
  filter:drop-shadow(0 0 7px rgba(255,174,0,.9));
  opacity:.48;animation:onHdTrace 3.1s ease-in-out infinite;
}
.on-login-spark{position:absolute;width:5px;height:5px;border-radius:50%;background:#fff6ce;box-shadow:0 0 9px #ffc12d,0 0 18px rgba(255,130,0,.7);mix-blend-mode:screen;opacity:0}
.on-login-spark-a{right:18%;top:25%;animation:onHdSparkA 3.8s ease-out infinite}
.on-login-spark-b{right:24%;top:32%;animation:onHdSparkB 4.5s 1.1s ease-out infinite}
.on-login-spark-c{right:13%;top:37%;animation:onHdSparkC 4.1s 2s ease-out infinite}

@keyframes onHdFireRotate{to{transform:rotate(360deg)}}
@keyframes onHdFireReverse{to{transform:rotate(-360deg)}}
@keyframes onHdFireBreathe{0%,100%{scale:.95;opacity:.55}50%{scale:1.07;opacity:.88}}
@keyframes onHdBloom{0%,100%{transform:scale(.95);opacity:.58}50%{transform:scale(1.08);opacity:1}}
@keyframes onHdPanelSweep{0%{left:-34%;opacity:0}22%{opacity:.72}65%{left:117%;opacity:.48}78%,100%{left:117%;opacity:0}}
@keyframes onHdTrace{0%,100%{opacity:.18;filter:drop-shadow(0 0 3px rgba(255,174,0,.35))}50%{opacity:.68;filter:drop-shadow(0 0 11px rgba(255,174,0,1))}}
@keyframes onHdSparkA{0%,36%{transform:translate(0,0) scale(.5);opacity:0}43%{opacity:.9}100%{transform:translate(-38px,-65px) scale(1.5);opacity:0}}
@keyframes onHdSparkB{0%,30%{transform:translate(0,0) scale(.5);opacity:0}38%{opacity:.78}100%{transform:translate(28px,-74px) scale(1.2);opacity:0}}
@keyframes onHdSparkC{0%,44%{transform:translate(0,0) scale(.55);opacity:0}50%{opacity:.76}100%{transform:translate(-18px,-58px) scale(1.35);opacity:0}}

@media(max-width:1100px) and (min-width:821px){
  .on-login-fire-corona{right:4.5%;top:5%;width:160px;height:160px}
  .on-login-fire-bloom{right:5.7%;top:7%;width:130px;height:130px}
}
@media(max-width:820px){
  .on-login-brand{
    min-height:350px!important;
    background:linear-gradient(145deg,#07162f,#0a2553 62%,#12376e)!important;
    justify-content:flex-end!important;
  }
  .on-login-brand:before{background:radial-gradient(circle at 78% 18%,rgba(255,174,0,.14),transparent 28%),linear-gradient(180deg,transparent,rgba(3,19,45,.22))}
  .on-login-brand>.on-login-logo,.on-login-brand>.on-login-copy{opacity:1;visibility:visible;pointer-events:auto;z-index:4}
  .on-login-logo{width:82px!important;padding:6px!important}
  .on-login-copy{max-width:62%!important;margin-top:18px!important}
  .on-login-copy h1{font-size:31px!important}.on-login-copy p{font-size:10px!important}
  .on-login-hd-effects{
    left:auto;right:1%;top:2%;bottom:auto;width:58%;height:235px;
    background:url('../img/login-solar-hd-mobile.webp') center/contain no-repeat;
    overflow:visible;
  }
  .on-login-fire-corona{right:3%;top:0;width:106px;height:106px;opacity:.58}
  .on-login-fire-bloom{right:5%;top:4%;width:88px;height:88px}
  .on-login-panel-glint{left:7%;top:49%;width:88%;height:39%}
  .on-login-energy-trace{display:none}.on-login-spark{display:none}
}
@media(max-width:520px){
  .on-login-brand{min-height:315px!important;padding:28px 20px!important}
  .on-login-hd-effects{width:61%;height:190px;right:-2%;top:2%}
  .on-login-fire-corona{width:82px;height:82px;right:3%;top:1%}
  .on-login-fire-bloom{width:68px;height:68px;right:5.5%;top:5%}
  .on-login-panel-glint{top:50%;height:35%}
  .on-login-copy{max-width:68%!important;margin-top:14px!important}
  .on-login-copy h1{font-size:26px!important;line-height:1.02}.on-login-copy p{font-size:9px!important;line-height:1.45}
}
@media(prefers-reduced-motion:reduce){
  .on-login-fire-corona,.on-login-fire-corona:after,.on-login-fire-bloom,.on-login-panel-glint:before,.on-login-energy-trace,.on-login-spark{animation:none!important}
}


/* v0.8.3 — mobile login composition + sun effect alignment */
/* Desktop: move the animated corona/bloom to the true center of the sun in the HD artwork. */
@media(min-width:821px){
  .on-login-fire-corona{top:7.5%}
  .on-login-fire-bloom{top:9.6%}
}

/* Mobile/tablet: the HD artwork is now integrated full-width into the brand panel,
   instead of appearing as a detached rectangle in the upper-right corner. */
@media(max-width:820px){
  .on-login-brand{
    --on-mobile-art-h:min(63.8vw,446px);
    min-height:calc(var(--on-mobile-art-h) + 205px)!important;
    padding:calc(var(--on-mobile-art-h) - 8px) 24px 26px!important;
    justify-content:flex-start!important;
    background:
      linear-gradient(180deg,
        rgba(7,22,47,0) 0 38%,
        rgba(7,22,47,.06) 47%,
        rgba(7,22,47,.58) 57%,
        #07162f 66%,
        #07162f 100%),
      url('../img/login-solar-hd-mobile.webp') top center/100% auto no-repeat,
      linear-gradient(145deg,#07162f,#0a2553 64%,#12376e)!important;
    overflow:hidden!important;
  }
  .on-login-brand:before{
    background:
      radial-gradient(circle at 76% 18%,rgba(255,183,35,.11),transparent 24%),
      linear-gradient(180deg,transparent 0 48%,rgba(3,19,45,.12) 58%,rgba(3,19,45,.24) 100%)!important;
    z-index:1;
  }
  .on-login-hd-effects{
    left:0!important;right:auto!important;top:0!important;bottom:auto!important;
    width:100%!important;height:var(--on-mobile-art-h)!important;
    background:none!important;overflow:hidden!important;
    z-index:2!important;
  }

  /* Sun center in login-solar-hd-mobile.webp ≈ x 75.5%, y 37.6%.
     Percent-based anchoring keeps the plasma centered at every mobile width. */
  .on-login-fire-corona{
    left:60.5%!important;right:auto!important;top:14.1%!important;
    width:30%!important;height:auto!important;aspect-ratio:1!important;
    transform-origin:50% 50%!important;
    opacity:.64!important;
  }
  .on-login-fire-bloom{
    left:63.5%!important;right:auto!important;top:18.8%!important;
    width:24%!important;height:auto!important;aspect-ratio:1!important;
    transform-origin:50% 50%!important;
  }

  /* Reflection follows the actual module area in the mobile artwork. */
  .on-login-panel-glint{
    left:11%!important;top:76%!important;width:84%!important;height:23%!important;
    clip-path:polygon(10% 12%,96% 0,100% 68%,4% 100%)!important;
    opacity:.62!important;
  }
  .on-login-energy-trace,.on-login-spark{display:none!important}

  .on-login-brand>.on-login-logo,
  .on-login-brand>.on-login-copy{
    opacity:1!important;visibility:visible!important;pointer-events:auto!important;z-index:4!important;
  }
  .on-login-logo{
    width:78px!important;
    padding:6px!important;
    border-radius:14px!important;
    box-shadow:0 12px 28px rgba(0,0,0,.18)!important;
  }
  .on-login-copy{
    max-width:560px!important;
    margin-top:14px!important;
  }
  .on-login-copy h1{
    max-width:520px!important;
    margin-top:9px!important;
    font-size:30px!important;
    line-height:1.02!important;
    letter-spacing:-.035em!important;
  }
  .on-login-copy p{
    max-width:520px!important;
    font-size:10px!important;
    line-height:1.5!important;
  }
  .on-login-panel{
    padding:24px 16px 34px!important;
  }
  .on-login-card{
    margin-top:-14px!important;
  }
}

@media(max-width:520px){
  .on-login-brand{
    --on-mobile-art-h:63.8vw;
    min-height:calc(var(--on-mobile-art-h) + 196px)!important;
    padding:calc(var(--on-mobile-art-h) - 6px) 18px 24px!important;
  }
  .on-login-logo{width:68px!important;padding:5px!important;border-radius:12px!important}
  .on-login-copy{max-width:100%!important;margin-top:11px!important}
  .on-login-copy>span{font-size:8px!important}
  .on-login-copy h1{font-size:27px!important;max-width:330px!important;margin:8px 0 9px!important}
  .on-login-copy p{font-size:9px!important;max-width:320px!important}
  .on-login-panel{padding:21px 11px 28px!important}
  .on-login-card{width:min(100%,390px)!important;margin-top:-10px!important;padding:19px!important;border-radius:18px!important}
  .on-login-card-head{margin-bottom:16px!important}
}

/* v0.9.0 — Bot → humano lead workflow */
.on-stats-grid-four{grid-template-columns:repeat(4,minmax(0,1fr))}
.on-stats-grid article.bot{background:linear-gradient(145deg,#f3f8ff,#fff);border-color:#d7e5f5}
.on-stats-grid article.bot strong{color:#245fa5}
.on-stats-grid article.qualified{background:linear-gradient(145deg,#f1fbf6,#fff);border-color:#d7eee0}
.on-stats-grid article.qualified strong{color:#16834e}
.on-triage-filter{grid-template-columns:1.15fr .9fr .9fr 1fr auto}
.on-filter-card input[type="search"]{width:100%;height:43px;border:1px solid var(--on-line);border-radius:11px;background:#fff;padding:0 13px;color:var(--on-ink);outline:none}
.on-filter-card input[type="search"]:focus{border-color:#e8a31c;box-shadow:0 0 0 3px rgba(244,159,0,.09)}
.on-active-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-4px 0 16px;padding:0 4px;color:#70829a;font-size:9px}
.on-active-filters>span{font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.on-active-filters b{font-weight:800;color:#315372;background:#eef4f9;border:1px solid #dce7f0;border-radius:999px;padding:6px 9px}
.on-active-filters a{margin-left:auto;color:#b15f00;font-weight:850}
.on-triage-table th{white-space:nowrap}
.on-triage-table td{vertical-align:middle}
.on-cell-sub{display:block;margin-top:4px;color:#8091a5;font-size:8px;font-weight:600;line-height:1.35}
.on-cell-sub a{color:#13884d;font-weight:800}
.on-muted{color:#8a9aac;font-size:9px}
.on-stage-badge,.on-qualification{display:inline-flex;align-items:center;width:max-content;max-width:100%;border-radius:999px;padding:6px 9px;font-size:8px;font-weight:900;white-space:nowrap;border:1px solid #d9e4ee;background:#f4f7fa;color:#526d87}
.on-stage-badge.received{background:#f5f7fa;color:#60758c;border-color:#dde5ec}
.on-stage-badge.triage_active{background:#eef6ff;color:#276399;border-color:#cfe2f5}
.on-stage-badge.qualified{background:#edf9f2;color:#147947;border-color:#cbe8d6}
.on-stage-badge.awaiting_human{background:#fff5df;color:#a65b00;border-color:#f0d28f}
.on-stage-badge.in_service{background:#edf3ff;color:#1d56a3;border-color:#cadbf4}
.on-stage-badge.completed{background:#eef7f0;color:#4b765a;border-color:#d5e5da}
.on-stage-badge.not_qualified{background:#f8f1f1;color:#8c5050;border-color:#ead7d7}
.on-qualification.high{background:#fff1df;color:#b85f00;border-color:#f1cc91}
.on-qualification.medium{background:#fff9e9;color:#8e7200;border-color:#eadca8}
.on-qualification.low{background:#f1f5f8;color:#637588;border-color:#dce4eb}
.on-qualification.unknown{background:#f5f7fa;color:#7b8b9c;border-color:#e0e6ec}
.on-row-actions .strong{color:#0b6f42;font-weight:900}
.on-row-actions .on-action-button{display:block;width:100%;padding:8px 12px;border:0;background:transparent;text-align:left;color:#2d4f71;font:inherit;cursor:pointer}
.on-triage-summary-row td{padding:0!important;background:#f8fbfe}
.on-triage-summary{margin:0 14px 13px;padding:13px 16px;border:1px solid #dbe8f3;border-radius:12px;background:linear-gradient(145deg,#f5faff,#fff)}
.on-triage-summary strong{font-size:10px;color:#173e67}.on-triage-summary p{margin:6px 0 5px;color:#516d89;font-size:10px;line-height:1.55}.on-triage-summary small{color:#8a99aa;font-size:8px}
.on-mobile-badges{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:9px}
.on-assignee{display:inline-flex;align-items:center;padding:6px 8px;border-radius:999px;background:#eef3f8;color:#4c6680;font-size:8px;font-weight:850}
.on-mobile-triage{margin:3px 0 12px;border:1px solid #dce7f1;border-radius:11px;background:#f8fbfd;box-shadow:none}
.on-mobile-triage summary{padding:10px 11px;font-size:9px;color:#315a7c}.on-mobile-triage p{padding:0 11px 11px;font-size:9px;line-height:1.5;color:#58718c}
.on-bot-working{margin:3px 0 12px;padding:10px 11px;border-radius:10px;background:#eef6ff;color:#34688e;font-size:9px;line-height:1.45}
.on-handoff-actions{grid-template-columns:minmax(0,1fr) auto auto}
.on-handoff-actions .on-intervene{background:linear-gradient(135deg,#315f91,#163c6d)}
.on-complete-button{min-height:39px;padding:0 12px;border:1px solid #cbe2d2;border-radius:10px;background:#f2faf4;color:#247548;display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-weight:900}
.on-action-wait{grid-column:1/-1;display:flex;min-height:39px;align-items:center;justify-content:center;border:1px dashed #d5e1ec;border-radius:10px;background:#f8fafc;color:#8291a2;font-size:9px;font-weight:800}

/* Bot integration settings */
.on-bot-integration-box{padding:0 20px 18px}
.on-bot-toggle{display:flex;align-items:flex-start;gap:11px;margin-bottom:16px;padding:14px;border:1px solid #dce7f0;border-radius:13px;background:linear-gradient(145deg,#f6faff,#fff)}
.on-bot-toggle input{width:17px;height:17px;margin-top:2px;accent-color:var(--on-orange)}
.on-bot-toggle strong,.on-bot-toggle small{display:block}.on-bot-toggle strong{font-size:11px}.on-bot-toggle small{margin-top:3px;color:#71839a;font-size:9px;line-height:1.45}
.on-field small{display:block;margin-top:6px;color:#8393a5;font-size:8px;line-height:1.45}.on-field code{padding:2px 5px;border-radius:5px;background:#eef3f8;color:#294f74;font-size:.95em}
.on-secret-field{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:7px}.on-secret-field input{min-width:0}.on-secret-field button{height:43px;padding:0 12px;border:1px solid #d6e2ec;border-radius:10px;background:#f7fafc;color:#345675;font-size:9px;font-weight:850;cursor:pointer}
.on-integration-flow{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:7px;padding:13px;border-radius:12px;background:#071f4e;color:#fff;font-size:9px;font-weight:900}.on-integration-flow span{padding:7px 10px;border:1px solid rgba(255,255,255,.18);border-radius:9px;background:rgba(255,255,255,.06)}.on-integration-flow b{color:#ffb51c}
.on-integration-note{margin:10px 0 0;color:#60758d;font-size:9px;line-height:1.55}

@media(max-width:1180px){.on-stats-grid-four{grid-template-columns:1fr 1fr}.on-triage-filter{grid-template-columns:1fr 1fr}.on-triage-filter .on-filter-submit{grid-column:1/-1}}
@media(max-width:820px){.on-stats-grid-four{grid-template-columns:1fr 1fr}.on-triage-filter{grid-template-columns:1fr}.on-triage-filter .on-filter-submit{grid-column:auto}.on-active-filters a{margin-left:0}.on-handoff-actions{grid-template-columns:1fr auto}.on-handoff-actions .on-danger-button{grid-column:auto}.on-triage-lead-card{border-left:3px solid #dce6ef}.on-triage-lead-card:has(.on-stage-badge.awaiting_human){border-left-color:#f3aa1d}.on-triage-lead-card:has(.on-stage-badge.qualified){border-left-color:#39a768}.on-triage-lead-card:has(.on-stage-badge.in_service){border-left-color:#3b73bd}}
@media(max-width:520px){.on-stats-grid-four{grid-template-columns:1fr 1fr}.on-stats-grid-four article{padding:12px}.on-stats-grid-four article:last-child{grid-column:auto}.on-stats-grid-four strong{font-size:22px}.on-triage-filter{padding:10px}.on-filter-card input[type="search"]{height:39px;font-size:10px}.on-stage-badge,.on-qualification{font-size:7px;padding:5px 7px}.on-handoff-actions{grid-template-columns:1fr auto}.on-secret-field{grid-template-columns:1fr 1fr}.on-secret-field input{grid-column:1/-1}.on-secret-field button{height:37px}.on-bot-integration-box{padding:0 14px 14px}.on-integration-flow{gap:6px;padding:10px;font-size:7px}.on-integration-flow span{padding:6px 7px}}
.on-triage-facts{display:flex;gap:7px;flex-wrap:wrap;margin:9px 0}.on-triage-facts span{display:inline-flex;gap:5px;align-items:center;padding:6px 8px;border-radius:8px;background:#eef4f9;color:#486682;font-size:8px}.on-triage-facts span b{font-size:7px;text-transform:uppercase;letter-spacing:.04em;color:#7b8ea2}.on-triage-facts.mobile{padding:0 10px 10px;margin:0}.on-triage-facts.mobile span{width:100%;justify-content:space-between}
.on-integration-error{display:block;margin-top:5px;color:#b34b35;font-size:7px;font-weight:850;line-height:1.3}.on-integration-error.mobile{width:max-content;margin:7px 0 0;padding:5px 7px;border-radius:7px;background:#fff1ed;border:1px solid #f1d1c7}

/* v0.10.0 — flow selector + campaign builder */
.on-flow-mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 22px 18px}.on-flow-mode-card{position:relative;display:grid;grid-template-columns:44px 1fr;gap:4px 12px;align-items:center;padding:16px;border:1px solid var(--on-line);border-radius:16px;background:#fff;cursor:pointer;transition:.18s}.on-flow-mode-card:hover{border-color:#e7b252;transform:translateY(-1px)}.on-flow-mode-card.selected{border-color:#f2a91f;box-shadow:0 0 0 3px rgba(242,169,31,.08);background:#fffaf0}.on-flow-mode-card input{position:absolute;right:14px;top:14px;accent-color:#e99b13}.on-flow-mode-icon{grid-row:1/3;width:44px;height:44px;border-radius:13px;background:#fff3d8;display:grid;place-items:center;font-size:19px}.on-flow-mode-card strong{font-size:13px;color:var(--on-ink);padding-right:24px}.on-flow-mode-card small{font-size:9px;color:var(--on-muted);line-height:1.45;padding-right:20px}.on-flow-banner{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:-4px 0 16px;padding:10px 13px;border-radius:13px;border:1px solid #d8e5ef;background:#f7fbfe;color:#385773;font-size:9px}.on-flow-banner strong{color:#0f3156}.on-flow-banner span{color:#76899e}.on-flow-banner.capture_campaign{background:#fff9ed;border-color:#f1ddb1}.on-campaign-card{margin:0 0 16px;border:1px solid var(--on-line);border-radius:17px;background:#fff;box-shadow:0 9px 26px rgba(11,28,52,.05);overflow:hidden}.on-campaign-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 18px;border-bottom:1px solid #e8eef4;background:linear-gradient(90deg,#f7fafc,#fffaf0)}.on-campaign-head>div>span{display:block;color:#d27b00;font-size:7px;letter-spacing:.13em;font-weight:900}.on-campaign-head strong{display:block;margin-top:4px;font-size:14px}.on-campaign-head small{display:block;margin-top:3px;color:var(--on-muted);font-size:9px}.on-campaign-head>b{white-space:nowrap;padding:7px 10px;border-radius:999px;background:#0b2c63;color:#fff;font-size:8px}.on-campaign-body{padding:14px 18px 16px}.on-campaign-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}.on-campaign-tools span{margin-left:auto;color:#6d8198;font-size:8px}.on-campaign-tools code{padding:3px 5px;border-radius:6px;background:#edf3f7;color:#355673}.on-campaign-body textarea{width:100%;border:1px solid var(--on-line);border-radius:12px;padding:12px;color:var(--on-ink);resize:vertical;outline:none;font:inherit;font-size:11px;line-height:1.5}.on-campaign-body textarea:focus{border-color:#e8a31c;box-shadow:0 0 0 3px rgba(244,159,0,.08)}.on-campaign-preview{margin-top:10px;padding:12px;border:1px solid #e4cf93;border-radius:12px;background:#fffbef}.on-campaign-preview strong{font-size:9px}.on-campaign-preview p{white-space:pre-wrap;margin:6px 0 0;color:#425d78;font-size:10px;line-height:1.5}.on-campaign-confirm{display:flex;align-items:flex-start;gap:8px;margin:11px 0 0;color:#526a82;font-size:8px}.on-campaign-confirm input{accent-color:#e69a13}.on-campaign-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.on-campaign-actions .on-primary,.on-campaign-actions .on-secondary-button{min-height:38px;font-size:8px}.on-campaign-send{background:#0e7d55!important}.on-campaign-success{color:#198054;font-size:9px;font-weight:800}.on-campaign-error{color:#b34031;font-size:9px;font-weight:800}.on-select-col{width:34px;text-align:center!important}.on-select-col input,.on-mobile-select input{accent-color:#e89e17}.on-mobile-select{display:none;color:#5e748d;font-size:8px;font-weight:800;margin-bottom:9px}.on-mobile-select input{vertical-align:middle;margin-right:5px}
@media(max-width:820px){.on-flow-mode-grid{grid-template-columns:1fr;padding:0 14px 14px}.on-campaign-head{align-items:flex-start}.on-campaign-tools span{width:100%;margin-left:0}.on-campaign-actions{display:grid;grid-template-columns:1fr}.on-campaign-actions>*{width:100%}.on-mobile-select{display:block}.on-select-col{display:none}}
@media(max-width:520px){.on-flow-mode-card{padding:13px;grid-template-columns:38px 1fr}.on-flow-mode-icon{width:38px;height:38px}.on-flow-mode-card strong{font-size:11px}.on-flow-mode-card small{font-size:8px}.on-campaign-head{padding:13px}.on-campaign-head strong{font-size:12px}.on-campaign-head small{font-size:8px}.on-campaign-body{padding:11px 12px 13px}.on-campaign-body textarea{font-size:9px}.on-flow-banner{font-size:8px}}
.on-flow-origin-mobile{display:block;margin-top:5px;color:#8091a5;font-size:7px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}

/* v0.10.2 — senha temporária e primeiro acesso obrigatório */
.on-login-card.is-first-access .on-login-card-head p{max-width:390px}
.on-first-access-note{display:grid;gap:3px;margin:-2px 0 15px;padding:12px 13px;border:1px solid #dce7f2;border-radius:12px;background:#f7faff;color:#17395f}
.on-first-access-note strong{font-size:11px}.on-first-access-note span{font-size:9px;line-height:1.45;color:#67809a}
.on-password-requirements{margin:-5px 0 15px;font-size:9px;line-height:1.45;color:#71879e}
.on-first-access-logout{display:block;margin:12px auto 0;text-align:center;color:#315b87;font-size:9px;font-weight:800}
.on-first-access-logout:hover{text-decoration:underline}
.on-user-access-badges{display:flex;align-items:flex-end;justify-content:center;gap:6px;flex-direction:column}
.on-first-access-badge{display:inline-flex;align-items:center;justify-content:center;padding:5px 8px;border-radius:999px;background:#fff7df;border:1px solid #f5d786;color:#9b6300;font-size:7px;font-weight:900;white-space:nowrap}
@media(max-width:760px){.on-user-access-badges{align-items:flex-start}.on-first-access-note{padding:10px 11px}.on-password-requirements{font-size:8px}}

/* v0.10.3 — novo visual premium para login / primeiro acesso
   Mantém a autenticação e regras intactas; somente composição, hierarquia e responsividade. */
.on-portal-login-body{
  min-height:100vh!important;
  background:
    radial-gradient(circle at 12% 12%,rgba(18,72,137,.08),transparent 30%),
    radial-gradient(circle at 86% 88%,rgba(245,159,0,.08),transparent 26%),
    #eef3f8!important;
  padding:clamp(14px,2.2vw,30px)!important;
}
.on-login-layout{
  width:min(1500px,100%)!important;
  min-height:calc(100vh - clamp(28px,4.4vw,60px))!important;
  margin:0 auto!important;
  grid-template-columns:minmax(520px,1.12fr) minmax(430px,.88fr)!important;
  border-radius:30px!important;
  overflow:hidden!important;
  background:#fff!important;
  box-shadow:0 30px 90px rgba(9,28,54,.16),0 2px 8px rgba(9,28,54,.04)!important;
  border:1px solid rgba(197,210,225,.76)!important;
}
.on-login-brand{
  min-height:760px!important;
  padding:56px clamp(38px,4.5vw,70px)!important;
  justify-content:flex-start!important;
  background:
    radial-gradient(circle at 77% 16%,rgba(255,177,24,.12),transparent 28%),
    radial-gradient(circle at 14% 82%,rgba(31,89,164,.22),transparent 34%),
    linear-gradient(145deg,#041327 0%,#071a38 53%,#0b2c5c 100%)!important;
  isolation:isolate!important;
}
.on-login-brand:before{
  left:0!important;bottom:0!important;width:100%!important;height:100%!important;border-radius:0!important;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
    radial-gradient(circle at 20% 84%,rgba(245,159,0,.10),transparent 23%)!important;
  background-size:46px 46px,46px 46px,auto!important;
  opacity:.78!important;
  z-index:0!important;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.2),rgba(0,0,0,.85));
}
.on-login-brand:after{
  content:"";
  position:absolute;
  right:5.5%;top:7%;
  width:min(58%,560px);
  aspect-ratio:580/386;
  border-radius:26px;
  background:
    linear-gradient(180deg,transparent 62%,rgba(3,16,34,.28)),
    url('../img/login-solar-hd-mobile.webp') center/cover no-repeat;
  box-shadow:0 30px 70px rgba(0,0,0,.30),inset 0 0 0 1px rgba(255,255,255,.11);
  border:1px solid rgba(255,255,255,.08);
  z-index:1;
  pointer-events:none;
}
.on-login-brand>.on-login-logo,
.on-login-brand>.on-login-copy{
  opacity:1!important;visibility:visible!important;pointer-events:auto!important;z-index:5!important;
}
.on-login-logo{
  width:92px!important;
  padding:7px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.97)!important;
  box-shadow:0 16px 34px rgba(0,0,0,.22)!important;
}
.on-login-copy{
  margin-top:auto!important;
  max-width:610px!important;
  padding-top:330px!important;
}
.on-login-copy>span{
  display:inline-flex!important;align-items:center!important;gap:8px!important;
  color:#ffb51b!important;font-size:10px!important;letter-spacing:.18em!important;
}
.on-login-copy>span:before{
  content:"";width:8px;height:8px;border-radius:50%;background:#ffb316;box-shadow:0 0 0 5px rgba(255,179,22,.12),0 0 18px rgba(255,179,22,.45);
}
.on-login-copy h1{
  margin:14px 0 16px!important;
  max-width:600px!important;
  font-size:clamp(43px,4.1vw,66px)!important;
  line-height:.99!important;
  letter-spacing:-.05em!important;
  text-wrap:balance;
}
.on-login-copy p{
  max-width:520px!important;
  color:#b9cae0!important;
  font-size:14px!important;
  line-height:1.65!important;
}
.on-login-hd-effects{
  left:auto!important;right:5.5%!important;top:7%!important;bottom:auto!important;
  width:min(58%,560px)!important;height:auto!important;aspect-ratio:580/386!important;
  background:none!important;border-radius:26px!important;overflow:hidden!important;
  z-index:3!important;
}
/* Sun center from the clean scene asset: ~76%, 38%. */
.on-login-fire-corona{
  left:62.5%!important;right:auto!important;top:17.2%!important;
  width:27%!important;height:auto!important;aspect-ratio:1!important;
  opacity:.48!important;transform-origin:50% 50%!important;
}
.on-login-fire-bloom{
  left:65.3%!important;right:auto!important;top:21.4%!important;
  width:21.5%!important;height:auto!important;aspect-ratio:1!important;
  opacity:.66!important;transform-origin:50% 50%!important;
}
.on-login-panel-glint{
  left:4%!important;top:72%!important;width:93%!important;height:24%!important;
  opacity:.42!important;clip-path:polygon(6% 4%,97% 0,100% 62%,0 100%)!important;
}
.on-login-energy-trace,.on-login-spark{display:none!important}
.on-login-panel{
  position:relative!important;
  place-items:center!important;justify-items:center!important;
  padding:clamp(34px,5vw,72px)!important;
  background:
    radial-gradient(circle at 52% 10%,rgba(255,255,255,.98),rgba(255,255,255,.72) 24%,transparent 44%),
    linear-gradient(145deg,#f8fafc,#edf3f8)!important;
  overflow:hidden!important;
}
.on-login-panel:before{
  content:"";position:absolute;right:-110px;top:-110px;width:300px;height:300px;border-radius:50%;
  border:1px solid rgba(28,70,124,.08);box-shadow:0 0 0 44px rgba(28,70,124,.025),0 0 0 88px rgba(28,70,124,.018);
}
.on-login-panel:after{
  content:"";position:absolute;left:-95px;bottom:-105px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,rgba(245,159,0,.10),transparent 68%);
}
.on-login-card{
  position:relative!important;z-index:2!important;
  width:min(100%,500px)!important;
  padding:clamp(28px,3.1vw,42px)!important;
  border-radius:26px!important;
  border:1px solid rgba(205,216,229,.92)!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 26px 60px rgba(14,35,65,.12),inset 0 1px 0 rgba(255,255,255,.85)!important;
  backdrop-filter:blur(16px);
}
.on-login-card:before{
  content:"";position:absolute;left:34px;right:34px;top:0;height:3px;border-radius:0 0 999px 999px;
  background:linear-gradient(90deg,transparent,#ffad0d 24%,#f59f00 76%,transparent);
  opacity:.92;
}
.on-login-card-head{margin-bottom:26px!important}
.on-login-card-head>span{
  display:inline-flex!important;align-items:center!important;gap:7px!important;
  padding:6px 9px!important;border-radius:999px!important;
  background:#fff6e4!important;color:#c56c00!important;
  border:1px solid #ffe2a7!important;font-size:8px!important;letter-spacing:.15em!important;
}
.on-login-card-head>span:before{content:"";width:6px;height:6px;border-radius:50%;background:#f59f00;box-shadow:0 0 0 3px rgba(245,159,0,.12)}
.on-login-card-head h2{
  margin:13px 0 6px!important;font-size:32px!important;line-height:1.04!important;letter-spacing:-.04em!important;
}
.on-login-card-head p{font-size:12px!important;line-height:1.55!important;color:#71839a!important}
.on-login-card .on-field{margin-bottom:15px!important}
.on-login-card .on-field>span{margin-bottom:7px!important;color:#425c7a!important;font-size:8px!important;letter-spacing:.08em!important}
.on-login-card .on-field input{
  height:52px!important;border-radius:13px!important;border-color:#cad6e4!important;
  background:#fbfdff!important;padding:0 14px!important;font-size:14px!important;
  box-shadow:inset 0 1px 2px rgba(12,31,56,.02)!important;
}
.on-login-card .on-field input:focus{
  background:#fff!important;border-color:#f0a11b!important;box-shadow:0 0 0 4px rgba(245,159,0,.10)!important;
}
.on-login-card .on-password-wrap input{padding-right:72px!important}
.on-login-card .on-password-toggle{
  right:8px!important;top:8px!important;height:36px!important;border-radius:10px!important;
  background:#edf3f8!important;color:#0d315e!important;font-size:9px!important;font-weight:900!important;
}
.on-login-options{margin:13px 0 20px!important}
.on-login-options .on-remember,.on-forgot-password{font-size:10px!important}
.on-forgot-password{color:#164a85!important;font-weight:850!important}
.on-login-submit{
  min-height:54px!important;border-radius:13px!important;font-size:15px!important;
  box-shadow:0 12px 28px rgba(245,159,0,.22)!important;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease!important;
}
.on-login-submit:hover{transform:translateY(-1px);box-shadow:0 16px 32px rgba(245,159,0,.28)!important;filter:saturate(1.05)}
.on-login-security{margin-top:15px!important;font-size:9px!important;color:#8a9aad!important}
.on-first-access-note{
  border-radius:14px!important;padding:14px 15px!important;
  background:linear-gradient(135deg,#f3f7fb,#f8fbfd)!important;
  border-color:#d7e2ed!important;
}
.on-first-access-note strong{color:#173a65!important}
.on-password-requirements{font-size:9px!important;line-height:1.5!important}
.on-first-access-logout{margin-top:14px!important;font-size:9px!important}

@media(max-width:1180px) and (min-width:821px){
  .on-login-layout{grid-template-columns:1fr .92fr!important}
  .on-login-brand{padding:44px 38px!important}
  .on-login-brand:after,.on-login-hd-effects{right:4%!important;width:60%!important}
  .on-login-copy{padding-top:300px!important}
  .on-login-copy h1{font-size:44px!important;max-width:500px!important}
  .on-login-copy p{font-size:12px!important;max-width:450px!important}
  .on-login-panel{padding:36px!important}
  .on-login-card{padding:30px!important}
}

@media(max-width:820px){
  .on-portal-login-body{padding:0!important;background:#edf3f8!important}
  .on-login-layout{
    display:block!important;width:100%!important;min-height:100vh!important;border-radius:0!important;border:0!important;box-shadow:none!important;
  }
  .on-login-brand{
    --on-mobile-art-h:210px!important;
    min-height:305px!important;
    padding:22px 20px 70px!important;
    display:block!important;
    background:
      radial-gradient(circle at 78% 18%,rgba(255,177,24,.12),transparent 30%),
      linear-gradient(145deg,#041327,#071d3e 58%,#0b2f63)!important;
  }
  .on-login-brand:before{opacity:.55!important}
  .on-login-brand:after{
    right:0!important;top:0!important;width:100%!important;height:210px!important;aspect-ratio:auto!important;border-radius:0!important;
    background:
      linear-gradient(180deg,rgba(3,17,36,.04) 42%,rgba(4,19,40,.78) 100%),
      url('../img/login-solar-hd-mobile.webp') center 42%/cover no-repeat!important;
    border:0!important;box-shadow:none!important;
    mask-image:linear-gradient(to bottom,#000 0 72%,transparent 100%);
  }
  .on-login-hd-effects{
    left:0!important;right:auto!important;top:0!important;width:100%!important;height:210px!important;aspect-ratio:auto!important;border-radius:0!important;overflow:hidden!important;
  }
  .on-login-fire-corona{left:63.4%!important;top:16.5%!important;width:25.5%!important;opacity:.42!important}
  .on-login-fire-bloom{left:66.2%!important;top:20.6%!important;width:20%!important;opacity:.60!important}
  .on-login-panel-glint{left:7%!important;top:77%!important;width:90%!important;height:20%!important;opacity:.34!important}
  .on-login-logo{
    position:relative!important;z-index:6!important;width:66px!important;padding:5px!important;border-radius:13px!important;
  }
  .on-login-copy{
    position:absolute!important;left:20px!important;right:20px!important;bottom:24px!important;
    max-width:none!important;margin:0!important;padding:0!important;z-index:6!important;
  }
  .on-login-copy>span{font-size:7px!important}
  .on-login-copy>span:before{width:6px;height:6px;box-shadow:0 0 0 4px rgba(255,179,22,.10)}
  .on-login-copy h1{
    margin:7px 0 0!important;max-width:310px!important;font-size:27px!important;line-height:1.02!important;letter-spacing:-.04em!important;
  }
  .on-login-copy p{display:none!important}
  .on-login-panel{
    min-height:calc(100vh - 305px)!important;padding:0 14px 34px!important;overflow:visible!important;
    background:linear-gradient(180deg,#edf3f8,#f7f9fb 52%,#eef3f8)!important;
  }
  .on-login-panel:before,.on-login-panel:after{display:none!important}
  .on-login-card{
    width:min(100%,430px)!important;margin:-34px auto 0!important;padding:25px!important;border-radius:22px!important;
    box-shadow:0 22px 50px rgba(11,30,57,.14)!important;
  }
  .on-login-card-head{margin-bottom:20px!important}
  .on-login-card-head h2{font-size:27px!important}
  .on-login-card-head p{font-size:10px!important}
  .on-login-card .on-field input{height:48px!important;font-size:13px!important}
  .on-login-submit{min-height:50px!important;font-size:13px!important}
}

@media(max-width:480px){
  .on-login-brand{min-height:286px!important;padding:18px 16px 66px!important}
  .on-login-brand:after,.on-login-hd-effects{height:194px!important}
  .on-login-logo{width:58px!important;border-radius:12px!important}
  .on-login-copy{left:16px!important;right:16px!important;bottom:21px!important}
  .on-login-copy h1{font-size:24px!important;max-width:285px!important}
  .on-login-panel{min-height:calc(100vh - 286px)!important;padding:0 10px 26px!important}
  .on-login-card{margin-top:-30px!important;padding:21px!important;border-radius:20px!important}
  .on-login-card:before{left:26px;right:26px}
  .on-login-card-head>span{font-size:7px!important;padding:5px 8px!important}
  .on-login-card-head h2{font-size:24px!important}
  .on-login-card .on-field>span{font-size:7px!important}
  .on-login-card .on-field input{height:46px!important;font-size:12px!important}
  .on-login-options{align-items:flex-start!important;gap:8px!important}
  .on-login-options .on-remember,.on-forgot-password{font-size:8px!important}
  .on-login-submit{min-height:48px!important;font-size:12px!important}
  .on-login-security{font-size:8px!important}
}

@media(prefers-reduced-motion:reduce){
  .on-login-submit{transition:none!important}
}

/* v0.10.4 — cena solar HD aprovada integrada ao login.
   A imagem é a autoridade visual; nenhum halo/feixe CSS é sobreposto. */
.on-login-hd-effects{display:none!important}

@media(min-width:821px){
  .on-login-brand{
    padding:48px clamp(38px,4.5vw,70px) 54px!important;
    min-height:760px!important;
    background:
      radial-gradient(circle at 12% 90%,rgba(28,88,161,.22),transparent 30%),
      linear-gradient(145deg,#041327 0%,#071a38 58%,#0a2854 100%)!important;
  }
  .on-login-brand:before{
    opacity:.50!important;
    background:
      linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),
      linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px)!important;
    background-size:46px 46px!important;
    mask-image:linear-gradient(to bottom,transparent 0 42%,rgba(0,0,0,.72) 67%,#000 100%)!important;
  }
  .on-login-brand:after{
    content:""!important;
    position:absolute!important;
    left:0!important;right:0!important;top:0!important;
    width:100%!important;height:56%!important;aspect-ratio:auto!important;
    border:0!important;border-radius:0!important;box-shadow:none!important;
    background:
      linear-gradient(180deg,rgba(3,16,34,.01) 0 66%,rgba(5,22,47,.44) 82%,#071a38 100%),
      url('../img/login-solar-scene-desktop.webp') center 48%/cover no-repeat!important;
    z-index:1!important;
    pointer-events:none!important;
  }
  .on-login-logo{
    position:relative!important;
    z-index:6!important;
    width:88px!important;
  }
  .on-login-copy{
    position:relative!important;
    z-index:6!important;
    margin-top:auto!important;
    padding-top:430px!important;
    max-width:620px!important;
  }
  .on-login-copy h1{
    max-width:610px!important;
    font-size:clamp(43px,4.05vw,64px)!important;
  }
}

@media(max-width:820px){
  .on-login-brand{
    min-height:356px!important;
    padding:18px 18px 72px!important;
    background:linear-gradient(145deg,#041327 0%,#071d3e 62%,#0a2b5b 100%)!important;
    overflow:hidden!important;
  }
  .on-login-brand:before{
    opacity:.42!important;
    mask-image:linear-gradient(to bottom,transparent 0 54%,#000 82%)!important;
  }
  .on-login-brand:after{
    content:""!important;
    position:absolute!important;
    left:0!important;right:0!important;top:0!important;
    width:100%!important;height:258px!important;aspect-ratio:auto!important;
    border:0!important;border-radius:0!important;box-shadow:none!important;
    background:
      linear-gradient(180deg,rgba(3,16,34,0) 0 66%,rgba(5,21,45,.46) 82%,#071b3a 100%),
      url('../img/login-solar-scene-mobile.webp') center center/cover no-repeat!important;
    mask-image:none!important;
    z-index:1!important;
  }
  .on-login-logo{
    position:relative!important;
    z-index:6!important;
    width:62px!important;
    margin:0!important;
  }
  .on-login-copy{
    position:absolute!important;
    z-index:6!important;
    left:18px!important;right:18px!important;bottom:23px!important;
    margin:0!important;padding:0!important;max-width:none!important;
  }
  .on-login-copy h1{
    margin:7px 0 0!important;
    max-width:330px!important;
    font-size:27px!important;
    line-height:1.01!important;
  }
  .on-login-copy p{display:none!important}
  .on-login-panel{
    min-height:calc(100vh - 356px)!important;
    padding:0 14px 34px!important;
  }
  .on-login-card{margin:-32px auto 0!important}
}

@media(max-width:480px){
  .on-login-brand{
    min-height:334px!important;
    padding:15px 15px 68px!important;
  }
  .on-login-brand:after{height:238px!important}
  .on-login-logo{width:57px!important}
  .on-login-copy{left:15px!important;right:15px!important;bottom:20px!important}
  .on-login-copy h1{font-size:24px!important;max-width:300px!important}
  .on-login-panel{min-height:calc(100vh - 334px)!important;padding:0 10px 26px!important}
  .on-login-card{margin-top:-28px!important}
}

/* v0.10.5 — login viewport-fit.
   A cena solar aprovada permanece inteira; o texto usa somente uma placa translúcida local,
   e a composição responde também à ALTURA da tela para evitar cortes. */
.on-portal-login-body{
  min-height:100dvh!important;
  height:100dvh!important;
  padding:clamp(10px,1.45vw,22px)!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 7% 8%,rgba(20,74,137,.07),transparent 28%),
    radial-gradient(circle at 91% 91%,rgba(245,159,0,.055),transparent 24%),
    #eef3f8!important;
}
.on-login-layout{
  width:min(1600px,100%)!important;
  height:calc(100dvh - clamp(20px,2.9vw,44px))!important;
  min-height:0!important;
  max-height:none!important;
  grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr)!important;
  border-radius:26px!important;
}
.on-login-brand{
  min-height:0!important;
  height:100%!important;
  padding:clamp(22px,2.7vh,34px) clamp(28px,3vw,46px) clamp(24px,3vh,38px)!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 13% 91%,rgba(27,90,165,.18),transparent 30%),
    linear-gradient(150deg,#031225 0%,#061a38 56%,#092954 100%)!important;
}
.on-login-brand:after{display:none!important}
.on-login-brand:before{
  opacity:.38!important;
  z-index:0!important;
  mask-image:linear-gradient(to bottom,transparent 0 48%,#000 80%)!important;
}
.on-login-scene{
  position:absolute;
  z-index:1;
  left:clamp(12px,1.5vw,24px);
  right:clamp(12px,1.5vw,24px);
  top:clamp(10px,1.4vh,20px);
  height:clamp(390px,61%,610px);
  display:flex;
  align-items:flex-start;
  justify-content:center;
  pointer-events:none;
}
.on-login-scene img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center top;
  border:0;
  filter:saturate(1.02) contrast(1.01);
}
.on-login-logo{
  position:relative!important;
  z-index:6!important;
  width:clamp(64px,5.2vw,82px)!important;
  margin:0!important;
  padding:6px!important;
  border-radius:15px!important;
  box-shadow:0 12px 28px rgba(0,0,0,.20)!important;
}
.on-login-copy{
  position:relative!important;
  z-index:6!important;
  margin:0!important;
  padding:clamp(14px,1.8vh,20px) clamp(16px,1.7vw,24px)!important;
  max-width:min(620px,84%)!important;
  background:linear-gradient(100deg,rgba(4,21,47,.84),rgba(4,21,47,.66) 68%,rgba(4,21,47,.18) 100%)!important;
  border:1px solid rgba(121,163,215,.20)!important;
  border-radius:18px!important;
  box-shadow:0 18px 34px rgba(0,0,0,.12)!important;
  backdrop-filter:blur(5px)!important;
}
.on-login-copy>span{font-size:8px!important;letter-spacing:.17em!important}
.on-login-copy h1{
  margin:9px 0 8px!important;
  max-width:560px!important;
  font-size:clamp(31px,3.25vw,50px)!important;
  line-height:1.01!important;
}
.on-login-copy p{
  margin:0!important;
  max-width:500px!important;
  font-size:clamp(10px,.85vw,13px)!important;
  line-height:1.45!important;
  color:#c3d2e5!important;
}
.on-login-panel{
  min-height:0!important;
  height:100%!important;
  padding:clamp(22px,3.2vh,42px)!important;
  overflow:auto!important;
  scrollbar-width:thin;
}
.on-login-card{
  width:min(100%,500px)!important;
  padding:clamp(24px,2.6vh,34px)!important;
  border-radius:24px!important;
  flex:none!important;
}
.on-login-card-head{margin-bottom:clamp(18px,2.1vh,24px)!important}
.on-login-card-head h2{font-size:clamp(27px,2.3vw,32px)!important}
.on-login-card .on-field{margin-bottom:clamp(11px,1.4vh,15px)!important}
.on-login-card .on-field input{height:clamp(46px,5.2vh,52px)!important}
.on-login-options{margin:clamp(9px,1.2vh,13px) 0 clamp(14px,1.8vh,20px)!important}
.on-login-submit{min-height:clamp(48px,5.4vh,54px)!important}
.on-login-security{margin-top:clamp(10px,1.4vh,15px)!important}

/* Notebooks e monitores baixos: preserva todos os controles na mesma viewport. */
@media(min-width:821px) and (max-height:820px){
  .on-portal-login-body{padding:10px!important}
  .on-login-layout{height:calc(100dvh - 20px)!important;border-radius:22px!important}
  .on-login-brand{padding:18px 28px 22px!important}
  .on-login-scene{top:8px!important;left:10px!important;right:10px!important;height:58%!important}
  .on-login-logo{width:62px!important;padding:5px!important;border-radius:12px!important}
  .on-login-copy{max-width:560px!important;padding:12px 16px!important;border-radius:15px!important}
  .on-login-copy>span{font-size:7px!important}
  .on-login-copy h1{margin:7px 0 6px!important;font-size:clamp(29px,3.15vw,42px)!important}
  .on-login-copy p{font-size:10px!important;line-height:1.35!important}
  .on-login-panel{padding:20px 28px!important}
  .on-login-card{padding:24px 28px!important}
  .on-login-card-head{margin-bottom:17px!important}
  .on-login-card-head h2{font-size:27px!important}
  .on-login-card-head p{font-size:10px!important}
  .on-login-card .on-field{margin-bottom:10px!important}
  .on-login-card .on-field input{height:46px!important}
  .on-login-options{margin:9px 0 13px!important}
  .on-login-submit{min-height:48px!important}
  .on-login-security{margin-top:9px!important}
  .on-first-access-note{padding:10px 12px!important;margin-bottom:11px!important}
  .on-password-requirements{margin-top:-2px!important;margin-bottom:9px!important}
}

/* Mobile: a arte inteira é mostrada, texto sobe e o card é compactado para caber na tela. */
@media(max-width:820px){
  .on-portal-login-body{
    height:auto!important;
    min-height:100dvh!important;
    padding:0!important;
    overflow:auto!important;
    background:#edf3f8!important;
  }
  .on-login-layout{
    width:100%!important;
    height:auto!important;
    min-height:100dvh!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:auto 1fr!important;
    border-radius:0!important;
  }
  .on-login-brand{
    height:clamp(280px,39dvh,330px)!important;
    min-height:0!important;
    padding:14px 15px 14px!important;
    display:flex!important;
    overflow:hidden!important;
  }
  .on-login-scene{
    left:8px!important;
    right:8px!important;
    top:4px!important;
    height:clamp(185px,27dvh,230px)!important;
    align-items:flex-start!important;
  }
  .on-login-scene img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
  .on-login-logo{
    width:56px!important;
    padding:4px!important;
    border-radius:11px!important;
    margin:0!important;
  }
  .on-login-copy{
    position:relative!important;
    left:auto!important;right:auto!important;bottom:auto!important;
    margin-top:auto!important;
    width:min(100%,350px)!important;
    max-width:88%!important;
    padding:10px 12px!important;
    border-radius:13px!important;
    background:linear-gradient(100deg,rgba(4,21,47,.86),rgba(4,21,47,.58) 78%,rgba(4,21,47,.10))!important;
    box-shadow:0 10px 24px rgba(0,0,0,.10)!important;
  }
  .on-login-copy>span{font-size:6px!important;gap:5px!important}
  .on-login-copy>span:before{width:5px!important;height:5px!important;box-shadow:0 0 0 3px rgba(255,179,22,.10)!important}
  .on-login-copy h1{
    margin:5px 0 0!important;
    max-width:310px!important;
    font-size:clamp(20px,6.4vw,25px)!important;
    line-height:1.01!important;
  }
  .on-login-copy p{display:none!important}
  .on-login-panel{
    height:auto!important;
    min-height:0!important;
    padding:10px 10px max(14px,env(safe-area-inset-bottom))!important;
    overflow:visible!important;
    align-items:start!important;
  }
  .on-login-card{
    width:min(100%,430px)!important;
    margin:-8px auto 0!important;
    padding:clamp(16px,2.2dvh,21px)!important;
    border-radius:20px!important;
  }
  .on-login-card:before{left:24px!important;right:24px!important}
  .on-login-card-head{margin-bottom:13px!important}
  .on-login-card-head>span{font-size:6px!important;padding:4px 7px!important}
  .on-login-card-head h2{margin:8px 0 4px!important;font-size:clamp(21px,6.2vw,25px)!important}
  .on-login-card-head p{font-size:9px!important;line-height:1.35!important}
  .on-login-card .on-field{margin-bottom:9px!important}
  .on-login-card .on-field>span{margin-bottom:5px!important;font-size:6px!important}
  .on-login-card .on-field input{height:44px!important;font-size:11px!important;border-radius:11px!important}
  .on-login-card .on-password-toggle{top:6px!important;right:6px!important;height:32px!important}
  .on-login-options{margin:8px 0 11px!important;gap:7px!important}
  .on-login-options .on-remember,.on-forgot-password{font-size:7px!important}
  .on-login-submit{min-height:45px!important;font-size:11px!important;border-radius:11px!important}
  .on-login-security{margin-top:8px!important;font-size:7px!important;line-height:1.3!important}
  .on-first-access-note{padding:9px 10px!important;margin-bottom:10px!important;border-radius:11px!important}
  .on-first-access-note strong{font-size:9px!important}
  .on-first-access-note span{font-size:7px!important}
  .on-password-requirements{font-size:7px!important;line-height:1.35!important;margin:0 0 8px!important}
  .on-first-access-logout{margin-top:8px!important;font-size:7px!important}
}

/* Celulares baixos: reduz somente espaçamentos, nunca oculta campos. */
@media(max-width:820px) and (max-height:740px){
  .on-login-brand{height:260px!important;padding:10px 12px!important}
  .on-login-scene{height:180px!important;top:2px!important}
  .on-login-logo{width:49px!important}
  .on-login-copy{max-width:86%!important;padding:8px 10px!important}
  .on-login-copy h1{font-size:19px!important}
  .on-login-panel{padding:7px 8px 10px!important}
  .on-login-card{margin-top:-5px!important;padding:14px 16px!important;border-radius:17px!important}
  .on-login-card-head{margin-bottom:10px!important}
  .on-login-card-head h2{font-size:21px!important}
  .on-login-card .on-field{margin-bottom:7px!important}
  .on-login-card .on-field input{height:41px!important}
  .on-login-options{margin:6px 0 8px!important}
  .on-login-submit{min-height:42px!important}
  .on-login-security{margin-top:6px!important}
}

/* v0.10.5 fine-tune — aproxima o texto da arte sem ampliar a placa de destaque. */
@media(min-width:821px){
  .on-login-copy{margin-bottom:clamp(28px,5vh,54px)!important}
}
@media(min-width:821px) and (max-height:820px){
  .on-login-copy{margin-bottom:28px!important}
}

/* v0.10.6 — cena solar integral.
   A arte nunca usa cover/crop: desktop e mobile preservam 100% do quadro original.
   Em telas muito baixas, reduzimos o tamanho da arte em vez de cortar suas laterais. */
.on-login-brand{
  overflow:hidden!important;
}
.on-login-scene{
  overflow:visible!important;
}
.on-login-scene img{
  display:block!important;
  max-width:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
}

@media(min-width:821px){
  .on-login-brand{
    padding:0 0 clamp(22px,2.8vh,34px)!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
  }
  .on-login-scene{
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    flex:0 0 auto!important;
    width:min(100%,calc((100dvh - 238px) * 1.77683))!important;
    height:auto!important;
    aspect-ratio:1672/941!important;
    margin:0 auto!important;
    pointer-events:none!important;
  }
  .on-login-scene img{
    width:100%!important;
    height:100%!important;
  }
  .on-login-logo{
    position:absolute!important;
    top:clamp(20px,2.4vh,30px)!important;
    left:clamp(22px,2.8vw,44px)!important;
    margin:0!important;
  }
  .on-login-copy{
    position:relative!important;
    left:auto!important;right:auto!important;bottom:auto!important;top:auto!important;
    margin:clamp(10px,1.6vh,18px) clamp(28px,3.2vw,48px) 0!important;
    padding:clamp(13px,1.65vh,18px) clamp(15px,1.55vw,22px)!important;
    max-width:min(620px,calc(100% - 56px))!important;
    background:linear-gradient(100deg,rgba(4,21,47,.78),rgba(4,21,47,.54) 72%,rgba(4,21,47,.08) 100%)!important;
    border:1px solid rgba(121,163,215,.16)!important;
    border-radius:17px!important;
    box-shadow:0 14px 28px rgba(0,0,0,.10)!important;
    backdrop-filter:blur(3px)!important;
  }
  .on-login-copy h1{
    margin:8px 0 7px!important;
    font-size:clamp(32px,3.05vw,48px)!important;
    line-height:1.01!important;
  }
  .on-login-copy p{
    font-size:clamp(9px,.78vw,12px)!important;
  }
}

@media(min-width:821px) and (max-height:780px){
  .on-login-scene{
    width:min(100%,calc((100dvh - 214px) * 1.77683))!important;
  }
  .on-login-copy{
    margin-top:7px!important;
    padding:10px 14px!important;
  }
  .on-login-copy h1{
    margin:6px 0 5px!important;
    font-size:clamp(28px,2.85vw,40px)!important;
  }
  .on-login-copy p{font-size:9px!important;line-height:1.35!important}
}

@media(max-width:820px){
  .on-login-brand{
    height:auto!important;
    min-height:0!important;
    padding:0 0 12px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    overflow:hidden!important;
  }
  .on-login-scene{
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:1672/941!important;
    margin:0!important;
    flex:0 0 auto!important;
  }
  .on-login-scene img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center center!important;
  }
  .on-login-logo{
    position:absolute!important;
    top:13px!important;
    left:14px!important;
    margin:0!important;
    width:56px!important;
  }
  .on-login-copy{
    position:relative!important;
    inset:auto!important;
    margin:7px 12px 0!important;
    width:auto!important;
    max-width:min(350px,calc(100% - 24px))!important;
    padding:9px 11px!important;
    background:linear-gradient(100deg,rgba(4,21,47,.80),rgba(4,21,47,.52) 76%,rgba(4,21,47,.06) 100%)!important;
    border:1px solid rgba(121,163,215,.15)!important;
    border-radius:12px!important;
    box-shadow:0 9px 20px rgba(0,0,0,.08)!important;
    backdrop-filter:blur(2px)!important;
  }
  .on-login-copy h1{
    margin:5px 0 0!important;
    max-width:320px!important;
    font-size:clamp(20px,6.1vw,24px)!important;
    line-height:1.02!important;
  }
  .on-login-copy p{display:none!important}
  .on-login-panel{
    min-height:0!important;
    height:auto!important;
    padding:7px 9px max(14px,env(safe-area-inset-bottom))!important;
  }
  .on-login-card{
    margin:0 auto!important;
  }
}

@media(max-width:820px) and (max-height:700px){
  .on-login-copy{
    margin-top:4px!important;
    padding:7px 9px!important;
  }
  .on-login-copy h1{font-size:19px!important}
  .on-login-panel{padding-top:5px!important}
}

/* v0.10.6 hard override: elimina o antigo background em cover para não existir
   uma segunda cópia recortada da cena por trás do <picture>. */
.on-login-brand:after{
  content:none!important;
  display:none!important;
  background:none!important;
}


/* v0.10.7 — login sem rolagem interna + mobile integralmente navy.
   Desktop: o formulário nunca cria sua própria barra de rolagem.
   Mobile: toda a área externa ao card permanece azul e o formulário fica centralizado. */
@media(min-width:821px){
  .on-login-panel{
    overflow:hidden!important;
    overflow-x:hidden!important;
    overflow-y:hidden!important;
    min-width:0!important;
    width:100%!important;
    align-content:center!important;
    justify-content:center!important;
  }
  .on-login-card{
    max-width:min(500px,calc(100% - 8px))!important;
    margin:auto!important;
  }
}

/* Em notebooks muito baixos, compacta o card em vez de criar scroll interno. */
@media(min-width:821px) and (max-height:680px){
  .on-login-panel{padding:12px 22px!important}
  .on-login-card{padding:18px 24px!important}
  .on-login-card-head{margin-bottom:12px!important}
  .on-login-card-head h2{margin:8px 0 3px!important;font-size:24px!important}
  .on-login-card-head p{font-size:9px!important}
  .on-login-card .on-field{margin-bottom:7px!important}
  .on-login-card .on-field input{height:42px!important}
  .on-login-options{margin:6px 0 9px!important}
  .on-login-submit{min-height:44px!important}
  .on-login-security{margin-top:6px!important}
  .on-first-access-note{padding:8px 10px!important;margin-bottom:8px!important}
  .on-password-requirements{margin:0 0 6px!important;font-size:7px!important}
  .on-first-access-logout{margin-top:6px!important}
}

@media(max-width:820px){
  html,
  body.on-portal-login-body{
    background:#07162f!important;
  }
  body.on-portal-login-body{
    min-height:100dvh!important;
    overflow-x:hidden!important;
  }
  .on-login-layout{
    width:100%!important;
    min-height:100dvh!important;
    background:#07162f!important;
    grid-template-rows:auto auto!important;
  }
  .on-login-brand{
    background:linear-gradient(180deg,#041327 0%,#071a38 62%,#08224a 100%)!important;
    padding-bottom:14px!important;
  }
  .on-login-panel{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-height:0!important;
    padding:18px 14px max(28px,env(safe-area-inset-bottom))!important;
    background:#07162f!important;
    overflow:visible!important;
  }
  .on-login-panel:before,
  .on-login-panel:after{display:none!important}
  .on-login-card{
    width:min(100%,390px)!important;
    max-width:calc(100vw - 28px)!important;
    margin:0 auto!important;
    flex:0 0 auto!important;
    border-radius:20px!important;
  }
  .on-login-copy{
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

@media(max-width:520px){
  .on-login-panel{padding:18px 14px max(26px,env(safe-area-inset-bottom))!important}
  .on-login-card{
    width:min(100%,370px)!important;
    max-width:calc(100vw - 28px)!important;
    margin:0 auto!important;
  }
}

@media(max-width:820px) and (max-height:700px){
  .on-login-panel{padding-top:12px!important}
}

/* v0.10.8 — refinamento final do login + gestão segura de usuários */
@media(min-width:821px){
  .on-login-card{width:min(100%,452px)!important;max-width:min(452px,calc(100% - 8px))!important}
}
@media(max-width:820px){
  .on-login-brand{padding-bottom:4px!important}
  .on-login-copy{margin-top:6px!important;margin-bottom:0!important}
  .on-login-panel{padding-top:10px!important;padding-bottom:max(24px,env(safe-area-inset-bottom))!important}
  .on-login-card{margin:0 auto!important}
}
@media(max-width:520px){
  .on-login-panel{padding-top:8px!important}
}

.on-recovery-note{display:grid;gap:6px;margin:2px 0 18px;padding:14px 15px;border:1px solid #dbe5f0;border-radius:13px;background:#f7fafd;color:#526b87;font-size:10px;line-height:1.55}
.on-recovery-note strong{color:#183654;font-size:12px}
.on-recovery-back{text-decoration:none!important}

.on-password-policy-box{display:grid;gap:5px;margin:0 20px 20px;padding:13px 14px;border:1px solid #dce6f1;border-radius:12px;background:#f7fafe;color:#667c95;font-size:9px;line-height:1.45}
.on-password-policy-box strong{color:#1c3a5e;font-size:10px;margin-bottom:2px}
.on-user-recovery-info{display:grid;gap:4px;margin:14px 14px 4px;padding:12px 13px;border:1px solid #e0e8f1;border-radius:11px;background:#f8fbfe;color:#667b92;font-size:9px;line-height:1.45}
.on-user-recovery-info strong{color:#1d3b5d;font-size:10px}
.on-reset-receipt{display:grid;gap:12px;margin:14px;padding:14px;border:1px solid #bfe2ca;border-radius:13px;background:#effaf2}
.on-reset-receipt>div:first-child{display:grid;gap:4px}
.on-reset-receipt-kicker{color:#18814b;font-size:8px;letter-spacing:.12em;font-weight:900}
.on-reset-receipt strong{color:#163d2a;font-size:13px}
.on-reset-receipt small{color:#537565;font-size:9px;line-height:1.45}
.on-reset-password-value{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.on-reset-password-value code{flex:1;min-width:180px;padding:11px 12px;border:1px dashed #9bc7a8;border-radius:9px;background:#fff;color:#153b28;font-size:13px;font-weight:900;letter-spacing:.04em;overflow-wrap:anywhere}
.on-user-access-row{grid-template-columns:36px minmax(0,1fr) auto minmax(150px,auto)!important}
.on-user-access-main strong em{font-style:normal;color:#7d8fa4;font-size:8px;font-weight:800}
.on-user-access-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.on-user-access-actions form{margin:0}
.on-user-action-button{min-height:31px;padding:0 9px;border-radius:8px;border:1px solid #d7e1eb;background:#fff;color:#345270;font-size:8px;font-weight:850;cursor:pointer}
.on-user-action-button:hover{border-color:#b6c7d8;background:#f7fafe}
.on-user-action-button.delete{border-color:#efd0d0;background:#fff7f7;color:#a53b3b}
.on-user-action-button.delete:hover{background:#fff0f0}
.on-user-action-note{max-width:150px;color:#8a99a9;font-size:8px;line-height:1.35;text-align:right}
.on-protected-account-badge{display:inline-flex;padding:4px 7px;border-radius:999px;background:#edf2f7;color:#61758d;font-size:7px;font-weight:850;white-space:nowrap}

@media(max-width:980px){
  .on-user-access-row{grid-template-columns:34px minmax(0,1fr)!important}
  .on-user-access-badges,.on-user-access-actions{grid-column:2;justify-content:flex-start;align-items:flex-start}
  .on-user-access-badges{flex-direction:row!important;flex-wrap:wrap!important}
  .on-user-action-note{text-align:left;max-width:none}
}
@media(max-width:520px){
  .on-password-policy-box{margin:0 12px 14px}
  .on-user-recovery-info,.on-reset-receipt{margin:10px}
  .on-reset-password-value{align-items:stretch}
  .on-reset-password-value code{min-width:100%;width:100%}
  .on-reset-password-value .on-secondary-button{width:100%}
  .on-user-access-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .on-user-access-actions form,.on-user-action-button{width:100%}
  .on-user-action-note{grid-column:1/-1}
}

/* v0.11.0 — commercial rules and service strategy */
.on-commercial-rules-card{margin:0 22px 18px;padding:18px;border:1px solid var(--on-line);border-radius:16px;background:linear-gradient(180deg,#fff,#fbfcfe)}
.on-commercial-rules-card .on-form-grid{padding:0}
.on-commercial-scale{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:10px;margin-top:14px;padding:13px;border-radius:13px;background:#f5f8fb}
.on-commercial-scale>span{display:flex;min-height:58px;flex-direction:column;justify-content:center;padding:10px 12px;border-radius:11px;font-size:9px;font-weight:900;text-align:center}
.on-commercial-scale>span small{display:block;margin-top:3px;font-size:7px;font-weight:700;opacity:.74}
.on-commercial-scale .low{background:#f3f5f7;color:#617286}.on-commercial-scale .normal{background:#edf7f1;color:#23704c}.on-commercial-scale .high{background:#fff3df;color:#ad6900}.on-commercial-scale>b{color:#8ca0b3}
.on-commercial-note{margin:12px 2px 0;color:#60758b;font-size:8px;line-height:1.5}
.on-service-mode-grid .on-flow-mode-card{min-height:118px}
.on-mode-explainer{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 22px 18px}
.on-mode-explainer article{display:flex;gap:10px;padding:13px;border:1px solid var(--on-line);border-radius:13px;background:#fff}.on-mode-explainer article>span{flex:0 0 26px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#0b2c63;color:#fff;font-size:8px;font-weight:900}.on-mode-explainer strong{display:block;font-size:9px}.on-mode-explainer small{display:block;margin-top:3px;color:var(--on-muted);font-size:7.5px;line-height:1.45}
.on-internal-sender-box{margin:0 22px 18px;padding:0 18px 18px;border:1px solid var(--on-line);border-radius:16px;background:#fbfcfe}
.on-advanced-message-details{margin-top:12px;border-top:1px solid var(--on-line);padding-top:12px}.on-advanced-message-details summary{cursor:pointer;color:#284866;font-size:9px;font-weight:900}.on-advanced-message-details .on-form-grid{padding:12px 0 0}.on-advanced-message-details>small{display:block;color:#6c8196;font-size:8px;line-height:1.45}
@media(max-width:820px){.on-commercial-rules-card,.on-internal-sender-box{margin-left:14px;margin-right:14px}.on-commercial-scale{grid-template-columns:1fr;gap:6px}.on-commercial-scale>b{transform:rotate(90deg);justify-self:center}.on-mode-explainer{grid-template-columns:1fr;margin-left:14px;margin-right:14px}}
@media(max-width:520px){.on-commercial-rules-card{padding:13px}.on-commercial-scale>span{min-height:48px}.on-internal-sender-box{padding:0 12px 12px}.on-mode-explainer article{padding:11px}}

/* v0.11.0 — simplified lead operations */
.on-service-banner{background:#f7fbfe!important;border-color:#d8e5ef!important}.on-commercial-priority,.on-delivery-badge,.on-mode-chip{display:inline-flex;align-items:center;white-space:nowrap;border-radius:999px;padding:5px 8px;font-size:7.5px;font-weight:900}.on-commercial-priority.normal{background:#eef3f7;color:#5c7186}.on-commercial-priority.high{background:#fff1d9;color:#b66700}.on-delivery-badge.sent{background:#e9f7ef;color:#177247}.on-delivery-badge.pending{background:#eef3f7;color:#536d86}.on-delivery-badge.failed{background:#fff0ed;color:#b53d2e}.on-delivery-badge.not_configured{background:#fff7e9;color:#9a680f}.on-mode-chip{background:#edf3fb;color:#355c83}.on-high-priority-row{background:linear-gradient(90deg,rgba(255,247,232,.62),transparent 28%)}.on-commercial-lead-card.is-high{border-color:#f0d4a2;box-shadow:0 10px 26px rgba(184,109,0,.08)}

/* v0.11 — automatic WhatsApp sender, simplified operational UX */
.on-sender-status-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:4px 0 16px}.on-sender-status-copy{display:flex;align-items:center;gap:12px;min-width:0}.on-sender-status-copy>div{display:flex;flex-direction:column;gap:3px}.on-sender-status-copy strong{color:#10223c;font-size:14px}.on-sender-status-copy small{color:#708097;line-height:1.45}.on-sender-status-dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 0 5px rgba(245,158,11,.12);background:#f59e0b}.on-sender-status-dot.ready{background:#16a34a;box-shadow:0 0 0 5px rgba(22,163,74,.12)}.on-sender-toggle{margin-left:auto;max-width:330px}.on-sender-flow{margin:0 0 14px}.on-sender-advanced{border:1px solid #e5eaf1;border-radius:14px;background:#f9fbfd;padding:0 14px}.on-sender-advanced>summary,.on-message-envelope-details>summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 2px;font-weight:800;color:#17304f}.on-sender-advanced>summary::-webkit-details-marker,.on-message-envelope-details>summary::-webkit-details-marker{display:none}.on-sender-advanced>summary span,.on-message-envelope-details>summary span{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#f47a22;background:#fff1e7;border-radius:999px;padding:5px 8px}.on-advanced-helper{margin:0 0 14px;color:#65758b;font-size:13px;line-height:1.55}.on-message-envelope-details{margin:14px 0;border-top:1px solid #e5eaf1}.on-message-envelope-details[open]{padding-bottom:12px}
@media(max-width:760px){.on-sender-status-row{align-items:flex-start;flex-direction:column}.on-sender-toggle{margin-left:0;max-width:none;width:100%}.on-sender-flow{overflow-x:auto;justify-content:flex-start;padding-bottom:6px}.on-sender-flow span{white-space:nowrap}}
.on-delivery-badge.paused{background:#f1f5f9;color:#64748b;border-color:#dbe3ec}
.on-sender-status-dot.paused{background:#64748b;box-shadow:0 0 0 5px rgba(100,116,139,.12)}
