.customer-body { min-height: 100vh; background: var(--gray-100); }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.check-row { display: flex; align-items: flex-start; gap: 9px; color: var(--gray-700); font-size: 12px; }
.check-row input { width: 18px; height: 18px; flex: 0 0 auto; }
.button.ghost { border-color: var(--gray-300); color: var(--gray-700); }
.customer-app { min-height: 100vh; }
.customer-shell { min-height: 100vh; display: grid; grid-template-columns: 246px minmax(0,1fr); }
.customer-sidebar { position: sticky; inset-block-start: 0; height: 100vh; display: flex; flex-direction: column; border-inline-end: 1px solid var(--gray-300); background: var(--navy-950); color: var(--white); padding: 22px 14px; }
.customer-sidebar .brand { width: 124px; background: var(--white); padding: 3px; margin: 0 8px 30px; }
.customer-nav { display: grid; gap: 3px; }
.customer-nav button { width: 100%; min-height: 44px; display: grid; grid-template-columns: 26px 1fr; align-items: center; gap: 9px; border: 0; border-inline-start: 3px solid transparent; border-radius: 0; background: transparent; color: #c6d5df; padding: 9px 11px; text-align: start; cursor: pointer; }
.customer-nav button:hover, .customer-nav button:focus-visible { background: rgba(255,255,255,.08); color: var(--white); }
.customer-nav button.active { background: rgba(80,164,209,.16); border-inline-start-color: var(--blue-500); color: var(--white); }
.customer-nav button span:first-child { color: var(--blue-500); font-size: 12px; font-weight: 850; }
.customer-sidebar-foot { margin-block-start: auto; padding: 16px 9px 0; border-block-start: 1px solid rgba(255,255,255,.14); }
.customer-sidebar-foot a { color: #c6d5df; font-size: 12px; text-decoration: none; }
.customer-sidebar-foot small { display: block; color: #8fa6b5; margin-block-start: 8px; }
.customer-main { min-width: 0; }
.customer-topbar { min-height: 72px; display: flex; align-items: center; gap: 12px; position: sticky; inset-block-start: 0; z-index: 20; border-block-end: 1px solid var(--gray-300); background: rgba(255,255,255,.96); padding: 10px 26px; backdrop-filter: blur(10px); }
.customer-topbar-title { min-width: 0; margin-inline-end: auto; }
.customer-topbar-title strong, .customer-topbar-title small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.customer-topbar-title small { color: var(--gray-700); margin-block-start: 2px; }
.balance-chip, .notification-button, .profile-chip { min-height: 42px; border: 1px solid var(--gray-300); border-radius: 2px; background: var(--white); color: var(--navy-900); }
.balance-chip { padding: 8px 12px; text-align: start; cursor: pointer; }
.balance-chip small, .balance-chip strong { display: block; }
.balance-chip small { color: var(--gray-700); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.notification-button { position: relative; width: 42px; display: grid; place-items: center; cursor: pointer; }
.notification-count { position: absolute; inset-block-start: -6px; inset-inline-end: -6px; min-width: 20px; height: 20px; display: grid; place-items: center; background: var(--blue-600); color: var(--white); border: 2px solid var(--white); font-size: 9px; }
.profile-chip { display: flex; align-items: center; gap: 8px; padding: 5px 10px 5px 5px; cursor: pointer; }
.avatar { width: 32px; height: 32px; display: grid; place-items: center; background: var(--navy-800); color: var(--white); font-size: 11px; font-weight: 850; }
.profile-chip span { max-width: 130px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; font-weight: 700; }
.customer-content { padding: 28px; }
.view-header { display: flex; align-items: end; justify-content: space-between; gap: 22px; margin-block-end: 24px; }
.view-header h1 { margin: 0 0 7px; font-size: clamp(28px,3vw,42px); }
.view-header p { margin: 0; color: var(--gray-700); }
.customer-grid { display: grid; gap: 16px; }
.customer-grid.two { grid-template-columns: repeat(2,minmax(0,1fr)); }
.customer-grid.three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.customer-grid.four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.app-card { border: 1px solid var(--gray-300); border-radius: 0; background: var(--white); padding: 20px; }
.app-card.flush { padding: 0; }
.app-card.navy { background: var(--navy-900); color: var(--white); border-color: var(--navy-900); }
.app-card.blue { background: var(--blue-050); }
.app-card h2, .app-card h3 { margin-block-end: 8px; }
.app-card h2 { font-size: 20px; }
.app-card p { color: var(--gray-700); font-size: 13px; }
.app-card.navy p { color: #c6d5df; }
.app-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 17px 19px; border-block-end: 1px solid var(--gray-200); }
.app-card-head h2 { margin: 0; font-size: 16px; }
.app-card-body { padding: 19px; }
.metric-card { min-height: 132px; display: flex; flex-direction: column; justify-content: space-between; }
.metric-card small { color: var(--gray-700); text-transform: uppercase; letter-spacing: .06em; }
.metric-card strong { font-size: 29px; }
.metric-card span { color: var(--blue-700); font-size: 12px; }
.quick-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; }
.quick-action { min-height: 96px; border: 1px solid var(--gray-300); border-radius: 0; background: var(--white); color: var(--navy-900); padding: 13px; text-align: start; cursor: pointer; }
.quick-action:hover, .quick-action:focus-visible { border-color: var(--blue-600); background: var(--blue-050); }
.quick-action b { display: block; color: var(--blue-700); font-size: 12px; margin-block-end: 18px; }
.quick-action span { display: block; font-size: 13px; font-weight: 700; }

.mail-layout { display: grid; grid-template-columns: minmax(280px,.8fr) minmax(380px,1.2fr); min-height: 610px; border: 1px solid var(--gray-300); background: var(--white); }
.mail-list { border-inline-end: 1px solid var(--gray-300); }
.mail-tools { padding: 14px; border-block-end: 1px solid var(--gray-200); }
.search-input { width: 100%; min-height: 42px; border: 1px solid var(--gray-300); border-radius: 2px; padding-inline: 12px; }
.mail-item { width: 100%; display: grid; grid-template-columns: 38px 1fr auto; gap: 10px; align-items: center; border: 0; border-block-end: 1px solid var(--gray-200); border-inline-start: 4px solid transparent; background: var(--white); color: var(--navy-900); padding: 14px 12px; text-align: start; cursor: pointer; }
.mail-item:hover, .mail-item.active { background: var(--blue-050); }
.mail-item.active { border-inline-start-color: var(--blue-600); }
.mail-item.unread strong::after { content: ""; display: inline-block; width: 6px; height: 6px; background: var(--blue-600); margin-inline-start: 7px; vertical-align: middle; }
.mail-file { width: 38px; height: 46px; display: grid; place-items: center; border: 1px solid var(--gray-300); background: var(--cream); color: var(--blue-700); font-size: 9px; font-weight: 800; }
.mail-item strong, .mail-item small { display: block; }
.mail-item small { color: var(--gray-700); margin-block-start: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mail-item time { color: var(--gray-700); font-size: 10px; }
.mail-detail { min-width: 0; padding: 25px; }
.mail-detail-head { display: flex; justify-content: space-between; gap: 20px; padding-block-end: 18px; border-block-end: 1px solid var(--gray-200); }
.mail-detail-head h2 { margin: 4px 0 6px; font-size: 24px; }
.mail-detail-head p { margin: 0; color: var(--gray-700); }
.priority { height: fit-content; border: 1px solid var(--gray-300); padding: 5px 8px; font-size: 10px; text-transform: uppercase; }
.priority.high { border-color: #c98585; color: var(--danger); }
.analysis-box { margin-block: 18px; border-inline-start: 5px solid var(--blue-600); background: var(--blue-050); padding: 18px; }
.analysis-box small { color: var(--blue-700); font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.analysis-row { display: grid; grid-template-columns: 125px 1fr; gap: 14px; padding: 13px 0; border-block-end: 1px solid var(--gray-200); }
.analysis-row:last-child { border: 0; }
.analysis-row span { color: var(--gray-700); font-size: 12px; }
.analysis-row strong { font-size: 13px; line-height: 1.5; }
.inline-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-block-start: 18px; }
.assign-box { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-block-start: 16px; }
.assign-box select { min-width: 0; min-height: 44px; border: 1px solid var(--gray-300); border-radius: 2px; background: var(--white); color: var(--navy-900); padding-inline: 10px; }

.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.form-grid .full { grid-column: 1/-1; }
.app-field { display: grid; gap: 6px; }
.app-field label { color: var(--gray-700); font-size: 11px; font-weight: 700; }
.app-field input, .app-field select, .app-field textarea { width: 100%; min-height: 44px; border: 1px solid var(--gray-300); border-radius: 2px; background: var(--white); color: var(--navy-900); padding: 10px 11px; }
.app-field textarea { min-height: 88px; resize: vertical; }
.app-field input:focus, .app-field select:focus, .app-field textarea:focus { outline: 3px solid var(--blue-100); border-color: var(--blue-600); }
.form-message { display: none; margin-block-start: 12px; padding: 11px; border-inline-start: 4px solid var(--danger); background: #fff3f3; color: var(--danger); font-size: 12px; }
.form-message.show { display: block; }
.form-message.success { display: block; border-color: var(--blue-600); background: var(--blue-050); color: var(--blue-700); }
.file-drop { min-height: 150px; display: grid; place-items: center; border: 1px dashed var(--blue-600); background: var(--blue-050); text-align: center; padding: 20px; }
.file-drop input { max-width: 100%; }

.order-list, .transaction-list, .address-list, .team-list, .activity-list { display: grid; }
.list-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 14px; align-items: center; padding: 14px 0; border-block-end: 1px solid var(--gray-200); }
.list-row:last-child { border: 0; }
.list-row strong, .list-row small { display: block; }
.list-row small { color: var(--gray-700); margin-block-start: 3px; }
.amount.positive { color: var(--blue-700); }
.amount.negative { color: var(--navy-900); }
.status { display: inline-flex; align-items: center; min-height: 25px; border: 1px solid var(--gray-300); padding: 3px 7px; color: var(--gray-700); font-size: 9px; text-transform: uppercase; letter-spacing: .06em; }
.status.active, .status.analyzed, .status.scheduled { border-color: var(--blue-500); color: var(--blue-700); background: var(--blue-050); }
.tracking { display: flex; gap: 4px; margin-block-start: 9px; }
.tracking span { flex: 1; height: 4px; background: var(--gray-200); }
.tracking span.done { background: var(--blue-600); }
.service-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px; }
.service-card { min-height: 220px; display: flex; flex-direction: column; border: 1px solid var(--gray-300); background: var(--white); padding: 19px; }
.service-card b { color: var(--blue-700); font-size: 11px; margin-block-end: 26px; }
.service-card p { color: var(--gray-700); font-size: 12px; }
.service-card strong { margin-block-start: auto; }
.service-card .button { margin-block-start: 14px; }
.plan-card.active { box-shadow: inset 5px 0 0 var(--blue-600); background: var(--blue-050); }

.notifications-panel { position: fixed; z-index: 60; inset-block-start: 72px; inset-inline-end: 18px; width: min(360px,calc(100% - 36px)); max-height: 520px; overflow: auto; display: none; border: 1px solid var(--gray-300); background: var(--white); box-shadow: var(--shadow); }
.notifications-panel.open { display: block; }
.notification-row { padding: 14px; border-block-end: 1px solid var(--gray-200); }
.notification-row.unread { background: var(--blue-050); }
.notification-row p { margin: 0 0 5px; font-size: 12px; }
.notification-row time { color: var(--gray-700); font-size: 10px; }
.toast { position: fixed; z-index: 100; inset-inline-end: 22px; inset-block-end: 22px; max-width: 380px; display: none; border-inline-start: 5px solid var(--blue-600); background: var(--navy-900); color: var(--white); padding: 14px 17px; box-shadow: var(--shadow); }
.toast.show { display: block; }
.toast.error { border-color: #cf8585; }

.customer-gate { min-height: 100vh; display: grid; place-items: center; background: var(--cream); padding: 22px; }
.customer-gate-card { width: min(600px,100%); border: 1px solid var(--gray-300); background: var(--white); padding: 34px; box-shadow: var(--shadow); }
.customer-gate-card .brand { margin-block-end: 30px; }
.gate-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-block-start: 22px; }

.app-icon { width: 22px; height: 22px; display: block; flex: 0 0 auto; }
.mobile-app-bg { min-height: 100vh; display: grid; place-items: center; background: #d8e2e8; padding: 20px; }
.mobile-shell { width: min(430px,100%); height: calc(100vh - 40px); min-height: 680px; margin: 0 auto; position: relative; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #9fb1bd; border-radius: 32px; background: var(--gray-100); box-shadow: 0 26px 70px rgba(9,40,61,.22); }
.mobile-header { position: relative; z-index: 20; flex: 0 0 auto; color: var(--white); background: linear-gradient(135deg,var(--navy-950) 0%,var(--navy-800) 48%,var(--blue-700) 100%); padding: calc(12px + env(safe-area-inset-top,0px)) 14px 13px; }
.mobile-topline { min-height: 44px; display: flex; align-items: center; gap: 9px; }
.mobile-header .brand { width: 104px; margin-inline-end: auto; border-radius: 13px; background: var(--white); padding: 5px 7px; }
.mobile-header .brand-inline-mark { width: 30px; height: 30px; border-radius: 9px; }
.mobile-header .brand-inline strong { font-size: 19px; }
.mobile-header-actions { display: flex; align-items: center; gap: 7px; }
.mobile-header .language-select { width: 55px; min-height: 42px; border-color: rgba(255,255,255,.38); border-radius: 13px; background: rgba(255,255,255,.12); color: var(--white); padding-inline: 7px; }
.mobile-header .language-select option { color: var(--navy-950); background: var(--white); }
.mobile-header .notification-button,.mobile-profile { width: 42px; min-height: 42px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.38); border-radius: 13px; background: rgba(255,255,255,.1); color: var(--white); padding: 0; cursor: pointer; }
.mobile-header .notification-button:hover,.mobile-header .notification-button:focus-visible,.mobile-profile:hover,.mobile-profile:focus-visible { background: rgba(255,255,255,.2); outline: 2px solid var(--white); outline-offset: 2px; }
.mobile-profile span { font-size: 10px; font-weight: 850; letter-spacing: .04em; }
.mobile-header .notification-count { background: var(--white); color: var(--blue-700); border-color: var(--navy-800); }
.mobile-commandbar { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; margin-block-start: 12px; }
.mobile-search-command,.mobile-balance { min-height: 50px; display: flex; align-items: center; gap: 9px; border: 1px solid rgba(255,255,255,.3); border-radius: 16px; background: rgba(255,255,255,.12); color: var(--white); padding: 7px 11px; cursor: pointer; text-align: start; }
.mobile-search-command { min-width: 0; color: #d9e7ef; }
.mobile-search-command span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mobile-balance span,.mobile-balance small,.mobile-balance strong { display: block; }
.mobile-balance small { color: #c6d9e5; font-size: 8px; line-height: 1.1; text-transform: uppercase; letter-spacing: .08em; }
.mobile-balance strong { white-space: nowrap; font-size: 11px; }
.mobile-search-command:hover,.mobile-search-command:focus-visible,.mobile-balance:hover,.mobile-balance:focus-visible { background: rgba(255,255,255,.2); outline: 2px solid var(--white); outline-offset: 2px; }
.mobile-content { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; scrollbar-width: thin; scrollbar-color: var(--gray-300) transparent; padding: 14px 14px calc(92px + env(safe-area-inset-bottom,0px)); }
.mobile-content > .view-header { display: block; margin: 0 0 14px; border: 1px solid var(--gray-200); border-radius: 22px; background: var(--white); padding: 18px; box-shadow: 0 8px 24px rgba(9,40,61,.06); }
.mobile-content > .view-header h1 { margin-block-end: 5px; font-size: 27px; line-height: 1.12; }
.mobile-content > .view-header p { font-size: 12px; }
.mobile-content .customer-grid.two,.mobile-content .customer-grid.three,.mobile-content .customer-grid.four { grid-template-columns: repeat(2,minmax(0,1fr)); }
.mobile-content .app-card { border-color: var(--gray-200); border-radius: 22px; box-shadow: 0 8px 24px rgba(9,40,61,.06); }
.mobile-content .metric-card { min-height: 112px; padding: 14px; }
.mobile-content .metric-card small { font-size: 8px; }
.mobile-content .metric-card strong { font-size: 22px; }
.mobile-content .quick-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.mobile-content .mail-layout { display: block; min-height: 0; border: 0; background: transparent; }
.mobile-content .mail-list { overflow: hidden; border: 1px solid var(--gray-200); border-radius: 22px; background: var(--white); box-shadow: 0 8px 24px rgba(9,40,61,.06); }
.mobile-content .mail-detail { margin-block-start: 13px; border: 1px solid var(--gray-200); border-radius: 22px; background: var(--white); padding: 17px; box-shadow: 0 8px 24px rgba(9,40,61,.06); }
.mobile-content .mail-detail-head { display: block; }
.mobile-content .analysis-row { grid-template-columns: 1fr; gap: 4px; }
.mobile-content .form-grid { grid-template-columns: 1fr; }
.mobile-content .form-grid .full { grid-column: auto; }
.mobile-content .service-grid { grid-template-columns: 1fr; }
.mobile-content .service-card { min-height: 170px; border-color: var(--gray-200); border-radius: 22px; box-shadow: 0 8px 24px rgba(9,40,61,.06); }
.mobile-content .app-field input,.mobile-content .app-field select,.mobile-content .app-field textarea,.mobile-content .search-input { border-radius: 13px; }
.mobile-home-hero { position: relative; overflow: hidden; min-height: 255px; color: var(--white); border-radius: 26px; background: radial-gradient(circle at 85% 12%,rgba(126,196,232,.42),transparent 34%),linear-gradient(145deg,var(--navy-950) 0%,var(--blue-700) 100%); padding: 22px; box-shadow: 0 16px 36px rgba(9,40,61,.2); }
.mobile-home-hero::after { content:""; position: absolute; width: 230px; height: 230px; inset-block-start: -85px; inset-inline-end: -95px; border: 42px solid rgba(255,255,255,.08); transform: rotate(35deg); pointer-events: none; }
.mobile-hero-kicker { position: relative; z-index: 1; margin-block-end: 18px; color: #d9e9f2; font-size: 9px; font-weight: 850; letter-spacing: .18em; }
.mobile-home-hero h1 { position: relative; z-index: 1; max-width: 310px; margin: 0; font-size: 32px; line-height: 1.04; }
.mobile-home-hero > p { position: relative; z-index: 1; max-width: 320px; margin: 10px 0 20px; color: #dceaf2; font-size: 12px; }
.mobile-wallet-summary { position: relative; z-index: 1; width: 100%; min-height: 72px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 3px 12px; align-items: center; border: 1px solid rgba(255,255,255,.42); border-radius: 18px; background: rgba(255,255,255,.14); color: var(--white); padding: 11px 13px; text-align: start; cursor: pointer; backdrop-filter: blur(10px); }
.mobile-wallet-summary > span { display: flex; align-items: center; gap: 8px; }
.mobile-wallet-summary small { color: #dceaf2; font-size: 9px; }
.mobile-wallet-summary > small { grid-column: 1/-1; padding-inline-start: 30px; }
.mobile-wallet-summary strong { font-size: 18px; }
.mobile-section-head { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-block-start: 17px; }
.mobile-section-head h2 { margin: 0; font-size: 18px; }
.mobile-section-head button { min-height: 40px; border: 0; background: transparent; color: var(--blue-700); padding-inline: 0; font-size: 11px; font-weight: 800; cursor: pointer; }
.mobile-quick-strip,.mobile-stat-strip { display: grid; grid-auto-flow: column; grid-auto-columns: 132px; gap: 9px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline mandatory; scrollbar-width: none; padding-block: 2px 5px; }
.mobile-content .mobile-quick-strip.quick-grid { grid-template-columns: none; }
.mobile-quick-strip::-webkit-scrollbar,.mobile-stat-strip::-webkit-scrollbar { display: none; }
.mobile-quick-strip .quick-action,.mobile-stat-strip .metric-card { scroll-snap-align: start; }
.mobile-quick-strip .quick-action { min-height: 122px; display: flex; flex-direction: column; justify-content: space-between; border-color: var(--gray-200); border-radius: 20px; background: var(--white); padding: 14px; box-shadow: 0 8px 22px rgba(9,40,61,.07); }
.mobile-quick-strip .quick-action b { width: 40px; height: 40px; display: grid; place-items: center; margin: 0; border-radius: 13px; background: var(--blue-050); color: var(--blue-700); }
.mobile-quick-strip .quick-action span { min-height: 36px; font-size: 12px; }
.mobile-stat-strip { grid-auto-columns: 152px; margin-block-start: 13px; }
.mobile-stat-strip .metric-card { min-height: 116px; }
.mobile-mail-card,.mobile-activity-card { border-color: var(--gray-300); }
.mobile-mail-card .mail-item { min-height: 72px; grid-template-columns: 35px minmax(0,1fr) auto; padding-inline: 10px; }
.mobile-mail-card .mail-file { width: 35px; height: 42px; }
.mobile-activity-card { padding: 6px 15px; }
.mobile-activity-card .list-row { min-height: 65px; }
.mobile-bottom-nav { position: absolute; inset-inline: 0; inset-block-end: 0; z-index: 30; min-height: calc(78px + env(safe-area-inset-bottom,0px)); display: grid; grid-template-columns: repeat(5,1fr); border-block-start: 1px solid var(--gray-200); border-radius: 24px 24px 0 0; background: rgba(255,255,255,.98); padding-block-end: env(safe-area-inset-bottom,0px); box-shadow: 0 -10px 30px rgba(9,40,61,.08); backdrop-filter: blur(12px); }
.mobile-bottom-nav button { position: relative; min-width: 0; min-height: 74px; border: 0; background: transparent; color: var(--gray-500); padding: 9px 3px 6px; cursor: pointer; font-size: 9px; }
.mobile-bottom-nav button::before { content:""; position: absolute; inset-block-start: 0; inset-inline: 24%; height: 3px; background: transparent; }
.mobile-bottom-nav button b { width: 25px; height: 25px; display: grid; place-items: center; color: inherit; margin: 0 auto 4px; }
.mobile-bottom-nav button b .app-icon { width: 23px; height: 23px; }
.mobile-bottom-nav button span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mobile-bottom-nav button.active { color: var(--blue-700); font-weight: 800; }
.mobile-bottom-nav button.active::before { background: var(--blue-600); }
.more-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
.more-link { min-height: 112px; border: 1px solid var(--gray-200); border-radius: 20px; background: var(--white); color: var(--navy-900); padding: 14px; text-align: start; cursor: pointer; box-shadow: 0 8px 22px rgba(9,40,61,.06); }
.more-link b { display: block; color: var(--blue-700); margin-block-end: 22px; }

@media (max-width: 1050px) {
  .customer-shell { grid-template-columns: 205px minmax(0,1fr); }
  .customer-grid.four { grid-template-columns: repeat(2,1fr); }
  .quick-grid { grid-template-columns: repeat(2,1fr); }
  .service-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 780px) {
  .customer-shell { display: block; }
  .customer-sidebar { position: static; width: 100%; height: auto; display: block; padding: 12px; }
  .customer-sidebar .brand { margin: 0 0 12px; }
  .customer-nav { grid-template-columns: repeat(9,minmax(92px,1fr)); overflow-x: auto; overscroll-behavior-inline: contain; }
  .customer-nav button { grid-template-columns: 1fr; text-align: center; font-size: 10px; border-inline-start: 0; border-block-end: 3px solid transparent; }
  .customer-nav button.active { border-block-end-color: var(--blue-500); }
  .customer-nav button:nth-child(n+5) { display: grid; }
  .customer-sidebar-foot { display: none; }
  .customer-topbar { inset-block-start: 0; padding-inline: 14px; }
  .profile-chip span { display: none; }
  .customer-content { padding: 18px 13px; }
  .customer-grid.two, .customer-grid.three { grid-template-columns: 1fr; }
  .mail-layout { display: block; }
  .mail-list { border-inline-end: 0; border-block-end: 1px solid var(--gray-300); }
  .service-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .mobile-app-bg { padding: 0; }
  .mobile-shell { width: 100%; height: 100vh; min-height: 0; border: 0; border-radius: 0; box-shadow: none; }
  .customer-topbar-title { display: none; }
  .balance-chip { padding-inline: 8px; }
  .customer-grid.four, .quick-grid { grid-template-columns: repeat(2,1fr); }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .full { grid-column: auto; }
}
@media (max-width: 360px) {
  .mobile-header { gap: 6px; padding-inline: 8px; }
  .mobile-header .brand { width: 70px; }
  .mobile-header .language-select { width: 52px; padding-inline: 7px; }
  .mobile-balance { padding-inline: 6px; font-size: 10px; }
}