/* ARX account workspace v2. Loaded last to isolate the customer portal. */
body:has(.account-portal){background:
 radial-gradient(circle at 8% 7%,rgba(91,210,157,.12),transparent 24rem),
 radial-gradient(circle at 92% 22%,rgba(178,224,255,.14),transparent 28rem),
 #f4f7f5}
body:has(.account-portal) .site-header{max-width:1240px}
.account-portal{max-width:1240px;padding-inline:32px}
.account-portal.account-tabs-ready [hidden]{display:none!important}
.account-portal .account-tabs .tab-count{display:grid;min-width:18px;height:18px;place-items:center;margin-left:1px;padding:0 5px;border-radius:999px;background:#d84c4c;color:#fff;font-size:9px}
.account-overview{animation:account-panel-in .2s ease}
.account-portal .account-section:not([hidden]),.account-portal .account-two-column:not([hidden]){animation:account-panel-in .2s ease}
@keyframes account-panel-in{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:none}}
.overview-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.overview-actions a{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:center;padding:20px;border:1px solid rgba(24,74,59,.08);border-radius:18px;background:#fff;box-shadow:0 10px 32px rgba(18,59,46,.055);transition:transform .18s ease,box-shadow .18s ease}
.overview-actions a:hover{transform:translateY(-2px);box-shadow:0 15px 36px rgba(18,59,46,.09)}
.overview-actions span{grid-row:1/3;display:grid;width:38px;height:38px;place-items:center;border-radius:12px;background:#e8f6ef;color:#087c56;font-weight:850}
.overview-actions strong,.overview-actions small{display:block}
.overview-actions strong{font-size:12px}
.overview-actions small{color:#71827b;font-size:9px}

/* Header and navigation */
.account-portal .customer-head{overflow:hidden;padding:30px 32px;border:0;background:
 linear-gradient(115deg,rgba(255,255,255,.98),rgba(238,249,243,.94));
 box-shadow:0 1px 0 rgba(14,54,42,.05),0 24px 70px rgba(22,66,52,.08)}
.account-portal .customer-head:after{position:absolute;right:-60px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,#baf0d5,transparent 68%);opacity:.5;content:"";pointer-events:none}
.account-portal .customer-head{position:relative}
.account-portal .customer-head>*{position:relative;z-index:1}
.account-portal .account-nav{top:12px;z-index:10;justify-content:center;padding:8px;border:1px solid rgba(17,73,55,.08);background:rgba(250,252,251,.9);box-shadow:0 12px 35px rgba(18,59,46,.08)}
.account-portal .account-nav a{min-height:42px;padding:9px 13px}

/* Protection hero — deliberately distinct from the content cards */
.account-portal .protection-hero{min-height:190px;margin:0 0 22px;padding:36px 40px;border:0!important;background:
 linear-gradient(120deg,#0b2e25 0%,#0d5b43 64%,#138960 100%)!important;color:#fff}
.account-portal .protection-hero>div>span{display:inline-flex;margin-bottom:8px;padding:5px 9px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.08);color:#d6f5e8;font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.account-portal .protection-hero h2{margin:0 0 8px;font-size:clamp(28px,4vw,42px);letter-spacing:-.045em}
.account-portal .protection-hero p{max-width:650px;margin:0;color:#c6ded5;font-size:13px}
.account-portal .protection-hero .button{background:#d7ff91;color:#10231d;box-shadow:none}

/* Information cards */
.account-portal .account-status-grid{gap:14px}
.account-portal .account-status-grid article{overflow:hidden;min-height:136px;padding:22px;border:0;background:#fff;box-shadow:0 10px 36px rgba(18,59,46,.065)}
.account-portal .account-status-grid article:nth-child(2){background:linear-gradient(145deg,#fff,#f1f8ff)}
.account-portal .account-status-grid article:nth-child(3){background:linear-gradient(145deg,#fff,#f3faf5)}
.account-portal .account-status-grid article:nth-child(4){background:linear-gradient(145deg,#fff,#faf7ef)}
.account-portal .account-status-grid strong{font-size:21px}

/* Base section: real internal spacing, no content on rounded edges */
.account-portal .account-section{position:relative;overflow:hidden;margin:22px 0;border:0;border-radius:24px;background:#fff;box-shadow:0 12px 42px rgba(18,59,46,.065)}
.account-portal .account-section>.panel-head{min-height:108px;padding:28px 32px 22px;border-bottom:1px solid #edf2ef}
.account-portal .account-section>.panel-head:before{align-self:flex-start;width:5px;height:42px;margin-right:13px;border-radius:99px;background:#28a978;content:""}
.account-portal .account-section>.panel-head>div:first-child{flex:1}
.account-portal .account-section>.panel-head h2{font-size:24px}

/* Every direct content type receives a safe gutter. */
.account-portal .account-section>form,
.account-portal .account-section>.notification-list,
.account-portal .account-section>.quick-security-actions,
.account-portal .account-section>.travel-mode,
.account-portal .account-section>.schedule-list,
.account-portal .account-section>.family-list,
.account-portal .account-section>.remote-list,
.account-portal .account-section>.case-list,
.account-portal .account-section>.recovery-codes,
.account-portal .account-section>.security-explainer,
.account-portal .account-section>details,
.account-portal .account-section>p{margin:0;padding:26px 32px}
.account-portal .account-section>form+form,
.account-portal .account-section>form+.table-wrap,
.account-portal .account-section>p+form,
.account-portal .account-section>.case-list+form{padding-top:0}
.account-portal .account-section>.table-wrap{margin:0 32px 30px;border:1px solid #e4ece8;border-radius:15px}
.account-portal .account-section>p{color:#5f746c}
.account-portal .account-section>p a:not(.button){color:#087a54;font-weight:750;text-decoration:underline;text-underline-offset:3px}

/* Forms no longer look like loose text dropped into a panel. */
.account-portal label{margin:0;color:#29443a;font-size:11px;letter-spacing:.01em}
.account-portal input:not([type=checkbox]):not([type=radio]),
.account-portal select,.account-portal textarea{min-height:47px;border:1px solid #dbe6e0;border-radius:12px;background:#f9fbfa;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
.account-portal textarea{min-height:120px;resize:vertical}
.account-portal input:focus,.account-portal select:focus,.account-portal textarea:focus{border-color:#42a984;background:#fff;box-shadow:0 0 0 4px rgba(38,167,119,.11)}
.account-portal .account-settings-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.account-portal .account-settings-form>.preference-grid,
.account-portal .account-settings-form>button,
.account-portal .account-settings-form>label:last-of-type{grid-column:1/-1}
.account-portal .preference-grid{gap:10px}
.account-portal .preference-grid label{position:relative;min-height:92px;padding:17px 17px 17px 45px;border:1px solid #e1ebe6;border-radius:15px;background:#fafcfb}
.account-portal .preference-grid input{position:absolute;top:18px;left:16px;width:18px;height:18px}
.account-portal .quick-security-actions{margin:0;border-top:1px solid #edf2ef;background:#f8fbf9}
.account-portal .quick-security-actions form{padding:20px;border:1px solid #e2ebe6;border-radius:16px;background:#fff}

/* Devices */
.account-portal .devices-section>.panel-head:before{background:#178fca}
.account-portal .devices-section{background:linear-gradient(180deg,#fff,#f8fbfd)}
.account-portal .android-auto-card{margin:26px 32px 20px;padding:18px 20px;border:0;background:#edf2f4;box-shadow:inset 0 0 0 1px rgba(40,74,88,.07)}
.account-portal .devices-section .device-list{padding-inline:32px}
.account-portal .devices-section .device{border:0;box-shadow:0 8px 28px rgba(21,56,45,.08),inset 0 0 0 1px #e7eeea}
.account-portal .setup-guide{margin-inline:32px}
.account-portal .connection-test{margin:0 32px 32px}

/* Give feature areas their own identity instead of identical white boxes. */
.account-portal #notifications{background:#fffcf5}
.account-portal #notifications>.panel-head:before{background:#e5a329}
.account-portal #notifications .notification-list{background:rgba(255,250,235,.55)}
.account-portal .profile-automation{background:linear-gradient(145deg,#fff,#f7f5ff)}
.account-portal .profile-automation>.panel-head:before{background:#8067cf}
.account-portal .profile-automation>.travel-mode{display:flex;align-items:center;gap:18px;background:#f5f1ff}
.account-portal .profile-automation>.travel-mode small{color:#6c6188}
.account-portal .profile-automation>.form-grid{border-top:1px solid #ece8f6}
.account-portal .security-report{padding-bottom:28px;background:
 radial-gradient(circle at 90% 20%,rgba(87,210,161,.16),transparent 18rem),
 linear-gradient(145deg,#0b2922,#123d32)}
.account-portal .security-report>.panel-head{border-color:rgba(255,255,255,.09)}
.account-portal .security-report>.panel-head:before{background:#c9ff75}
.account-portal .security-report .report-metrics{margin:0;padding:8px 32px 20px}
.account-portal .security-report>p{padding:0 32px;color:#b8cec6}
.account-portal #remote-work{background:linear-gradient(145deg,#fff,#f2f8ff)}
.account-portal #remote-work>.panel-head:before{background:#368ed0}
.account-portal #support>.panel-head:before{background:#e59842}
.account-portal #recovery{background:linear-gradient(145deg,#fff,#f4fbf7)}
.account-portal #recovery>.panel-head:before{background:#20a871}
.account-portal #payments>.panel-head:before{background:#ff5b24}
.account-portal #privacy{background:linear-gradient(145deg,#fff,#f7f5ff)}
.account-portal #privacy>.panel-head:before{background:#7b68c7}
.account-portal #family>.panel-head:before{background:#d56f91}
.account-portal #referral>.panel-head:before{background:#e2a229}

/* Customer report: concise first, documented depth on demand. */
.account-portal .report-workspace{padding-bottom:34px;background:#fff;color:#17372d}
.account-portal .report-workspace>.panel-head{border-color:#e8efeb;background:linear-gradient(120deg,#eef9f4,#f7fbf9)}
.account-portal .report-workspace>.panel-head:before{background:#17a672}
.account-portal .report-workspace>.panel-head p{color:#62776e}
.report-freshness{padding:6px 9px;border-radius:999px;background:#fff;color:#61766d!important;font-size:9px!important;white-space:nowrap}
.report-hero-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:26px 32px 12px}
.report-hero-kpis article{position:relative;overflow:hidden;min-height:125px;padding:20px;border:1px solid #deebe5;border-radius:17px;background:linear-gradient(145deg,#fff,#f4faf7)}
.report-hero-kpis article:after{position:absolute;right:-22px;bottom:-28px;width:80px;height:80px;border-radius:50%;background:#dff5eb;content:""}
.report-hero-kpis article.attention{border-color:#f1cbc5;background:#fff6f4}
.report-hero-kpis article.attention:after{background:#f8deda}
.report-hero-kpis span,.report-hero-kpis strong,.report-hero-kpis small{position:relative;z-index:1;display:block}
.report-hero-kpis span{color:#61766d;font-size:9px;font-weight:850;letter-spacing:.06em;text-transform:uppercase}
.report-hero-kpis strong{margin:10px 0 5px;font-size:28px;letter-spacing:-.04em}
.report-hero-kpis small{color:#71847c;font-size:9px}
.report-chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;padding:10px 32px 26px}
.report-chart-grid>article{min-width:0;padding:20px;border:1px solid #e1ebe6;border-radius:18px;background:#fbfdfc}
.report-chart-grid h3{margin:0;font-size:13px}
.report-chart-grid article>div>small{color:#72847d;font-size:9px}
.report-chart{height:170px;margin-top:14px}
.report-chart svg{display:block;width:100%;height:100%}
.report-chart .grid{stroke:#e5eee9;stroke-width:1}
.report-chart .line{fill:none;stroke:#15986b;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.report-chart .area{fill:url(#report-area)}
.report-chart .line.secondary{stroke:#4b91c5}
.report-chart .empty-chart{display:grid;height:100%;place-items:center;border:1px dashed #d9e5df;border-radius:12px;color:#71837c;font-size:10px;text-align:center}
.report-bars{display:grid;align-content:center;gap:9px;min-height:170px;margin-top:12px}
.report-bar{display:grid;grid-template-columns:minmax(80px,1fr) 2fr auto;gap:9px;align-items:center}
.report-bar span,.report-bar b{font-size:9px}
.report-bar span{overflow:hidden;color:#5e7169;text-overflow:ellipsis;white-space:nowrap}
.report-bar i{height:8px;border-radius:999px;background:#e7efeb;overflow:hidden}
.report-bar i:after{display:block;width:var(--bar);height:100%;border-radius:inherit;background:linear-gradient(90deg,#13976a,#67d5a9);content:""}
.report-bars.severity .report-bar i:after{background:linear-gradient(90deg,#e59a35,#dd5b4e)}
.report-bars .empty-chart{padding:35px;border:1px dashed #d9e5df;border-radius:12px;color:#71837c;font-size:10px;text-align:center}
.report-data-note{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;margin:0 32px 28px;padding:16px 18px;border:1px solid #cfe5da;border-radius:15px;background:#eff9f4}
.report-data-note strong{font-size:10px;white-space:nowrap}
.report-data-note span{color:#526e63;font-size:9px;line-height:1.55}
.report-detail-intro{display:flex;justify-content:space-between;align-items:end;gap:20px;padding:27px 32px 18px;border-top:1px solid #e8efeb}
.report-detail-intro h3{margin:3px 0;font-size:22px}
.report-detail-intro p{margin:0;color:#6e8179;font-size:10px}
.report-groups{display:grid;gap:10px;padding:0 32px}
.report-group{overflow:hidden;border:1px solid #dfe9e4;border-radius:16px;background:#fafcfb}
.report-group summary{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;min-height:62px;padding:16px 19px;cursor:pointer;list-style:none}
.report-group summary::-webkit-details-marker{display:none}
.report-group summary>span{font-size:12px;font-weight:850}
.report-group summary small{color:#71847c;font-size:9px}
.report-group summary i{display:grid;width:27px;height:27px;place-items:center;border-radius:9px;background:#e9f3ee;color:#177654;font-style:normal;transition:transform .18s ease}
.report-group[open] summary{border-bottom:1px solid #e3ece7;background:#fff}
.report-group[open] summary i{transform:rotate(45deg)}
.report-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:14px}
.report-detail-card{min-width:0;min-height:190px;padding:16px;border:1px solid #e1eae6;border-radius:14px;background:#fff}
.report-detail-card>div{display:flex;justify-content:space-between;align-items:center}
.report-number{color:#8ba097;font-size:9px;font-weight:850}
.report-quality{padding:4px 7px;border-radius:999px;background:#e5f5ed;color:#117453;font-size:7px;font-weight:850;letter-spacing:.05em;text-transform:uppercase}
.report-detail-card.derived .report-quality{background:#eaf1f8;color:#3c6e94}
.report-detail-card.unavailable{background:#f7f8f7}
.report-detail-card.unavailable .report-quality{background:#ecefed;color:#75827d}
.report-detail-card>strong{display:block;overflow-wrap:anywhere;margin:17px 0 8px;color:#143d31;font-size:20px;line-height:1.2}
.report-detail-card>strong small{color:#60766c;font-size:9px}
.report-detail-card h4{margin:0 0 7px;font-size:11px}
.report-detail-card p{margin:0;color:#6c7e76;font-size:9px;line-height:1.5}
.report-na{color:#87938e;font-size:12px;font-weight:650}

/* Lists become deliberate rows. */
.account-portal .notification-list,
.account-portal .family-list,
.account-portal .remote-list,
.account-portal .case-list,
.account-portal .schedule-list{display:grid;gap:10px}
.account-portal .notification-list>p,
.account-portal .family-list>p{margin:0;padding:20px;border:1px dashed #d9e4df;border-radius:14px;color:#6a7c75;text-align:center}
.account-portal .remote-list article,
.account-portal .case-list article,
.account-portal .schedule-list article{padding:16px 18px;border:1px solid #e2ebe6;border-radius:14px;background:#fff}
.account-portal .remote-list strong,.account-portal .remote-list span,
.account-portal .case-list strong,.account-portal .case-list span{display:block}
.account-portal .remote-list span,.account-portal .case-list span{margin-top:4px;color:#6b7e76;font-size:10px}
.account-portal .account-two-column{gap:22px}
.account-portal .account-two-column .account-section{height:max-content;margin:0}

@media(max-width:760px){
 body:has(.account-portal) .site-header{height:66px}
 .account-portal{padding-inline:14px}
 .account-portal .customer-head{padding:22px}
 .account-portal .protection-hero{min-height:0;padding:28px 24px}
 .account-portal .account-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .account-portal .account-section{border-radius:19px}
 .account-portal .account-section>.panel-head{min-height:0;padding:22px 20px}
 .account-portal .account-section>.panel-head:before{display:none}
 .account-portal .account-section>form,
 .account-portal .account-section>.notification-list,
 .account-portal .account-section>.quick-security-actions,
 .account-portal .account-section>.travel-mode,
 .account-portal .account-section>.schedule-list,
 .account-portal .account-section>.family-list,
 .account-portal .account-section>.remote-list,
 .account-portal .account-section>.case-list,
 .account-portal .account-section>.recovery-codes,
 .account-portal .account-section>.security-explainer,
 .account-portal .account-section>details,
 .account-portal .account-section>p{padding:20px}
 .account-portal .account-section>.table-wrap{margin:0 20px 22px}
 .account-portal .account-settings-form{grid-template-columns:1fr}
 .account-portal .account-settings-form>*{grid-column:1!important}
 .account-portal .android-auto-card{margin:20px}
 .account-portal .devices-section .device-list{padding-inline:20px}
 .account-portal .setup-guide{margin-inline:20px}
 .account-portal .connection-test{margin:0 20px 22px}
 .account-portal .security-report .report-metrics{padding:4px 20px 18px}
 .account-portal .security-report>p{padding:0 20px}
 .overview-actions{grid-template-columns:1fr}
 .report-hero-kpis{grid-template-columns:repeat(2,1fr);padding:20px}
 .report-chart-grid{grid-template-columns:1fr;padding:0 20px 20px}
 .report-data-note{grid-template-columns:1fr;margin:0 20px 22px}
 .report-detail-intro{align-items:flex-start;flex-direction:column;padding:24px 20px 16px}
 .report-groups{padding:0 20px}
 .report-detail-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:440px){
 .account-portal .account-status-grid{grid-template-columns:1fr}
 .account-portal .account-status-grid article{min-height:112px}
 .account-portal .profile-automation>.travel-mode{align-items:stretch;flex-direction:column}
 .report-hero-kpis,.report-detail-grid{grid-template-columns:1fr}
 .report-group summary{grid-template-columns:1fr auto}
 .report-group summary small{display:none}
}
