/* Shared white agent portal shell; package-card layout remains view-specific. */
.agent-page :is(button,input,select):focus-visible { outline:3px solid #6598ff; outline-offset:3px; }
.agent-page { background:#f6f9fe; color:#101a40; --canvas:#f6f9fe; --accent:#2e70ff; --accent-dark:#1e60e8; --accent-soft:#edf4ff; }
.agent-page .agent-shell { grid-template-columns:230px minmax(0,1fr); }
.agent-page .agent-sidebar { background:#fff; color:#64759c; padding:28px 14px; gap:52px; border-right:1px solid #edf2fa; }
.agent-page .agent-brand { color:#101a40; padding:0 12px; }
.agent-page .agent-brand small { color:#7b8baa; }
.agent-page .agent-sidebar nav button { display:flex; align-items:center; gap:18px; padding:18px 20px; color:#677ca3; border-radius:12px; font-size:17px!important; }
.agent-page .agent-sidebar nav button .ti { font-size:24px!important; }
.agent-page .agent-sidebar nav button.active { background:#eaf1ff; color:#2668ff; }
.agent-page .agent-sidebar nav button:hover { background:#f1f6ff; }
.agent-page .agent-contact { color:#889bb8; font-size:12px!important; }
.agent-page .agent-main { padding:0 24px 36px 20px; }
.agent-page .agent-topbar { min-height:88px; padding:20px 4px; max-width:1500px; }
.agent-page .agent-topbar #agent-name { color:#52678f; }
.agent-page .agent-topbar .secondary-button { border-color:#dae4f3; color:#7181a0; }
.agent-page #agent-content { max-width:1500px; }
.agent-page .primary-button { background:#2e70ff; border-color:#2e70ff; }
.agent-page .primary-button:hover { background:#1e60e8; border-color:#1e60e8; }
.agent-page .secondary-button { background:#fff; border-color:#dae4f3; color:#627598; }
.agent-page .secondary-button:hover { background:#f1f6ff; border-color:#9dbbfa; color:#2668ff; }
.agent-page .agent-balance-card { max-width:1500px; background:#fff; border-color:#e1e9f5; }
.agent-page .agent-balance-card strong { color:#2869ff; }
.agent-page .agent-quote { background:#f1f6ff; }
.agent-page .agent-quote strong { color:#2869ff; }
.agent-page .agent-login-intro { background:#fff; color:#101a40; border-right:1px solid #edf2fa; }
.agent-page .agent-login-intro p,.agent-page .agent-login-footnote { color:#627598; }
.agent-page .agent-login-panel { background:#f6f9fe; }
.agent-page .agent-eyebrow,.agent-page .agent-login-intro .agent-eyebrow { color:#2668ff; }
.agent-page .agent-dialog { background:#fff; color:#101a40; }
.agent-page .agent-notice { background:#fff; color:#263a60; border:1px solid #dbe5f3; box-shadow:0 8px 28px #14203518; }
.agent-generator-view .ag-breadcrumb { display:flex; align-items:center; gap:17px; margin-top:-58px; margin-bottom:39px; width:fit-content; color:#8495b7; height:20px; }
.agent-generator-view .ag-breadcrumb strong { color:#213659; font-weight:600!important; }
.agent-page .agent-owner-preview:not(.hidden)~#agent-name { margin-left:auto; }
.agent-generator-view:has(.agent-owner-preview:not(.hidden)) .ag-breadcrumb { margin-top:0; margin-bottom:20px; }
.agent-generator-view .ag-generator { display:grid; grid-template-columns:minmax(0,1fr) 420px; gap:20px; align-items:stretch; width:100%; max-width:1500px; }
.agent-generator-view :is(.agent-delegation-note,.agent-pending-banner,.ag-records) { max-width:1500px; }
.agent-generator-view .ag-config,.agent-generator-view .ag-confirm { border-radius:14px; background:#fff; min-width:0; }
.agent-generator-view .ag-config { padding:20px; }
.agent-generator-view .ag-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:16px; }
.agent-generator-view .ag-heading h1 { font-size:32px!important; letter-spacing:-.8px; line-height:1.3; color:#0b163b; }
.agent-generator-view .ag-heading p { margin:6px 0 0; color:#7c8eb0; font-size:15px!important; line-height:1.5; }
.agent-generator-view .ag-history-button { display:flex; align-items:center; justify-content:center; gap:8px; white-space:nowrap; background:#fff; border:1px solid #dce5f4; border-radius:9px; color:#6b7fa5; font-size:15px!important; padding:11px 14px; margin-top:4px; cursor:pointer; }
.agent-generator-view .ag-history-button:hover { border-color:#9dbbfa; color:#2969f6; }
.agent-generator-view .ag-tiers { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.agent-generator-view .ag-tier { --tier:#008bbe; --tier-line:#8ed8f2; --tier-bg:#f5fcff; border:1px solid var(--tier-line); background:var(--tier-bg); border-radius:10px; padding:12px 14px 8px; min-width:0; }
.agent-generator-view .ag-tier[data-tier=PRO] { --tier:#501afb; --tier-line:#c2abff; --tier-bg:#faf7ff; }
.agent-generator-view .ag-tier[data-tier=FLAGSHIP] { --tier:#bf710c; --tier-line:#f2cd9d; --tier-bg:#fffbf6; }
.agent-generator-view .ag-tier.has-selection { border-color:var(--tier); }
.agent-generator-view .ag-tier header { display:flex; align-items:center; gap:10px; height:48px; }
.agent-generator-view .ag-tier header img { width:46px; height:52px; object-fit:contain; mix-blend-mode:multiply; clip-path:polygon(50% 7%,91% 25%,91% 74%,50% 94%,9% 74%,9% 25%); }
.agent-generator-view .ag-tier header h2 { font-size:20px!important; font-weight:700!important; margin:0; white-space:nowrap; color:#0f1b40; }
.agent-generator-view .ag-price-label { margin:8px 0; font-size:13px!important; color:#647a9c; }
.agent-generator-view .ag-package-row { min-height:44px; display:flex; align-items:center; gap:8px; border:1px solid transparent; border-top-color:#e4edf7; cursor:pointer; margin:0 -5px; padding:0 9px; border-radius:0; position:relative; }
.agent-generator-view .ag-package-row:first-child { border-top-color:transparent; }
.agent-generator-view .ag-package-row.selected { border-color:var(--tier); border-radius:9px; box-shadow:inset 0 0 0 1px var(--tier); background:#fff; }
.agent-generator-view .ag-package-row:not(.unavailable):hover { background:#ffffffbd; }
.agent-generator-view .ag-package-row input { accent-color:var(--tier); width:19px; height:19px; flex:0 0 19px; margin:0; cursor:pointer; }
.agent-generator-view .ag-package-row>span { color:#6d7fa5; font-size:16px!important; white-space:nowrap; }
.agent-generator-view .ag-package-row strong { font:700 24px/1.2 Arial,sans-serif!important; color:var(--tier); margin-left:auto; white-space:nowrap; }
.agent-generator-view .ag-package-row strong small { font:700 17px Arial,sans-serif!important; margin-right:3px; }
.agent-generator-view .ag-package-row.unavailable { opacity:.5; cursor:not-allowed; }
.agent-generator-view .ag-settings { margin-top:20px; }
.agent-generator-view .ag-settings h2 { font-size:20px!important; margin:0 0 12px; }
.agent-generator-view .ag-quantity-line { display:flex; align-items:center; gap:14px; }
.agent-generator-view .ag-quantity-line>label { margin-right:12px; font-size:15px!important; font-weight:600!important; color:#263a60; }
.agent-generator-view .ag-stepper { display:flex; align-items:stretch; height:44px; border:1px solid #dbe4f4; border-radius:8px; overflow:hidden; }
.agent-generator-view .ag-stepper button { width:43px; background:#f8faff; color:#7a8eb6; border:0; cursor:pointer; }
.agent-generator-view .ag-stepper input { width:80px; text-align:center; border:0; border-left:1px solid #dbe4f4; border-right:1px solid #dbe4f4; border-radius:0; padding:0 4px; background:#fff; font-size:21px!important; font-weight:600!important; color:#152044; appearance:textfield; }
.agent-generator-view .ag-stepper input::-webkit-inner-spin-button,.agent-generator-view .ag-stepper input::-webkit-outer-spin-button { appearance:none; margin:0; }
.agent-generator-view .ag-quantity-line>span { color:#768bb0; }
.agent-generator-view .ag-quick-counts { display:flex; gap:9px; margin-left:auto; }
.agent-generator-view .ag-quick-counts button { min-width:65px; min-height:44px; padding:10px; border:1px solid transparent; border-radius:8px; background:#f5f7fc; color:#657b9d; cursor:pointer; }
.agent-generator-view .ag-quick-counts button.active { border-color:#5990ff; color:#276bff; background:#f7faff; }
.agent-generator-view .ag-remark-label { display:block; margin:16px 0 8px; color:#20375d; font-size:15px!important; }
.agent-generator-view .ag-remark-label span { color:#7f91b2; }
.agent-generator-view .ag-remark-field { display:flex; align-items:center; border:1px solid #d6e1f2; border-radius:8px; padding:0 13px; height:44px; }
.agent-generator-view .ag-remark-field:focus-within { border-color:#719ffc; box-shadow:0 0 0 3px #286cff10; }
.agent-generator-view .ag-remark-field input { width:100%; min-width:0; outline:none; border:0; background:transparent; padding:0; height:100%; color:#233656; font-size:16px!important; }
.agent-generator-view .ag-remark-field input::placeholder { color:#9caeca; }
.agent-generator-view .ag-remark-field>span { color:#98a8c5; margin-left:8px; }
.agent-generator-view .ag-confirm { padding:20px 24px; }
.agent-generator-view .ag-confirm>h2 { font-size:24px!important; line-height:1.4; margin:0 0 12px; }
.agent-generator-view .ag-selected { display:flex; align-items:center; gap:12px; min-height:64px; padding-bottom:12px; }
.agent-generator-view .ag-selected img { width:48px; height:52px; object-fit:contain; clip-path:polygon(50% 7%,91% 25%,91% 74%,50% 94%,9% 74%,9% 25%); }
.agent-generator-view .ag-selected h3 { font-size:21px!important; font-weight:600!important; color:#101a40; margin:0; line-height:1.5; white-space:nowrap; }
.agent-generator-view .ag-selected p { margin:7px 0 0; color:#8e9db8; font-size:12px!important; }
.agent-generator-view .ag-confirm-details { margin:0; }
.agent-generator-view .ag-confirm-details>div { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:44px; padding:8px 0; border-top:1px solid #e3eaf6; }
.agent-generator-view .ag-confirm-details dt { color:#768aad; font-size:16px!important; white-space:nowrap; }
.agent-generator-view .ag-confirm-details dd { margin:0; text-align:right; font-size:18px!important; font-weight:600!important; overflow-wrap:anywhere; }
.agent-generator-view #agent-selected-retail { color:#5120f5; font-size:23px!important; font-family:Arial,"Microsoft YaHei UI",sans-serif; white-space:nowrap; }
.agent-generator-view #agent-selected-remark { color:#899bb9; font-size:14px!important; max-width:170px; font-weight:400!important; }
.agent-generator-view .ag-accounting { border-top:1px solid #e3eaf6; border-bottom:1px solid #e3eaf6; padding:8px 0; margin:8px 0 12px; }
.agent-generator-view .ag-accounting>div { display:flex; justify-content:space-between; align-items:center; gap:10px; line-height:1.4; margin-bottom:3px; color:#7b8dab; }
.agent-generator-view .ag-accounting strong { font-weight:600!important; color:#4e648b; }
.agent-generator-view #agent-debit-total { color:#2869ff; font-size:20px!important; }
.agent-generator-view .ag-accounting>p { display:flex; align-items:center; gap:8px; margin:8px 0 0; color:#899bb8; }
.agent-generator-view .ag-accounting>p>button { border:0; background:none; color:#3878ff; padding:0; margin-left:auto; cursor:pointer; }
.agent-generator-view .ag-generate-button { display:block; width:100%; min-height:46px; border:0; border-radius:9px; background:#2e70ff; font-size:18px!important; font-weight:500!important; margin-top:10px; cursor:pointer; }
.agent-generator-view .ag-generate-button:hover { background:#1e60e8; border-color:#1e60e8; }
.agent-generator-view .ag-generation-hint { color:#889aba; font-size:13px!important; line-height:1.6; text-align:center; margin:10px 0 0; }
.agent-generator-view .ag-confirm>.form-error:empty { display:none; }
.agent-generator-view .ag-confirm>.form-error { line-height:1.7; }
.agent-generator-view .ag-records { margin-top:30px; }
.agent-generator-view .ag-record-remark { min-width:130px; max-width:200px; overflow-wrap:anywhere; }
.agent-page .agent-card-result .primary-button { background:#2e70ff; border-color:#2e70ff; }
.agent-generator-view :is(.ag-heading p,.ag-package-row>span,.ag-confirm-details dt,.ag-generation-hint,.ag-selected p,.ag-accounting>div,.ag-accounting>p,#agent-selected-remark,.ag-remark-field>span) { color:#627598; }
.agent-generator-view .ag-stepper .ti { font-size:19px!important; }
.agent-generator-view .ag-config .ag-history-button .ti { font-size:19px!important; }
@media(prefers-reduced-motion:reduce) { .agent-page * { scroll-behavior:auto!important; transition:none!important; } }
@media(max-width:1350px) {
  .agent-page .agent-shell { grid-template-columns:200px minmax(0,1fr); }
  .agent-generator-view .ag-generator { grid-template-columns:minmax(0,1fr) 294px; gap:16px; }
  .agent-generator-view .ag-config { padding:20px; }
  .agent-generator-view .ag-confirm { padding:20px; }
  .agent-generator-view .ag-tier { padding:15px 11px 8px; }
  .agent-generator-view .ag-tier header { gap:8px; }
  .agent-generator-view .ag-tier header img { width:49px; height:55px; }
  .agent-generator-view .ag-tier header h2 { font-size:20px!important; }
  .agent-generator-view .ag-package-row { gap:6px; padding:0 6px; }
  .agent-generator-view .ag-package-row strong { font-size:24px!important; }
  .agent-generator-view .ag-package-row>span { font-size:14px!important; }
  .agent-generator-view .ag-package-row input { width:16px; height:16px; flex-basis:16px; }
  .agent-generator-view .ag-heading h1 { font-size:28px!important; }
  .agent-generator-view .ag-heading p { font-size:15px!important; }
  .agent-generator-view .ag-quantity-line { flex-wrap:wrap; }
  .agent-generator-view .ag-quick-counts { width:100%; justify-content:flex-end; }
  .agent-generator-view .ag-selected { gap:10px; }
  .agent-generator-view .ag-selected img { width:52px; height:59px; }
  .agent-generator-view .ag-selected h3 { font-size:18px!important; }
}
@media(max-width:1100px) {
  .agent-page .agent-shell { grid-template-columns:174px minmax(0,1fr); }
  .agent-page .agent-sidebar nav button { padding:16px 12px; gap:10px; font-size:15px!important; }
  .agent-generator-view .ag-generator { grid-template-columns:1fr; }
  .agent-generator-view .ag-confirm { display:grid; grid-template-columns:1fr 1fr; column-gap:30px; }
  .agent-generator-view .ag-confirm>h2 { grid-column:1/-1; }
  .agent-generator-view .ag-selected { grid-column:1; }
  .agent-generator-view .ag-confirm-details { grid-column:1; grid-row:3/6; }
  .agent-generator-view .ag-accounting { grid-column:2; grid-row:2/4; margin-top:0; }
  .agent-generator-view .ag-confirm>.form-error,.agent-generator-view .ag-generate-button,.agent-generator-view .ag-generation-hint { grid-column:2; }
  .agent-generator-view .ag-quick-counts { width:auto; }
}
@media(max-width:700px) {
  .agent-page .agent-shell { display:block; }
  .agent-page .agent-sidebar { padding:16px; gap:18px; }
  .agent-page .agent-sidebar nav { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
  .agent-page .agent-sidebar nav button { justify-content:center; gap:6px; padding:12px 4px; font-size:12px!important; }
  .agent-page .agent-sidebar nav button .ti { display:none; }
  .agent-page .agent-main { padding:0 14px 25px; }
  .agent-page .agent-topbar { min-height:62px; padding:12px 0; }
  .agent-generator-view .ag-breadcrumb { margin:0 0 20px; }
  .agent-generator-view .ag-config { padding:23px 16px; }
  .agent-generator-view .ag-heading { gap:12px; }
  .agent-generator-view .ag-heading h1 { font-size:28px!important; }
  .agent-generator-view .ag-history-button { padding:9px; font-size:12px!important; }
  .agent-generator-view .ag-heading p { font-size:13px!important; }
  .agent-generator-view .ag-tiers { grid-template-columns:1fr; gap:16px; }
  .agent-generator-view .ag-tier { padding:12px 18px 8px; }
  .agent-generator-view .ag-tier header { height:58px; }
  .agent-generator-view .ag-price-label { margin:7px 0; }
  .agent-generator-view .ag-package-row { min-height:53px; }
  .agent-generator-view .ag-package-row strong { font-size:27px!important; }
  .agent-generator-view .ag-settings { margin-top:28px; }
  .agent-generator-view .ag-quantity-line { gap:10px; }
  .agent-generator-view .ag-quick-counts { width:100%; justify-content:flex-start; margin-top:10px; }
  .agent-generator-view .ag-stepper button { width:38px; }
  .agent-generator-view .ag-confirm { display:block; padding:24px 22px; }
  .agent-generator-view .ag-confirm-details>div { min-height:65px; }
  .agent-generator-view .ag-accounting { margin-top:16px; }
  .agent-generator-view .ag-records { margin-top:20px; }
}
