:root { --blue: #4263eb; --muted: #6b7792; --line: #e5eaf4; color: #263650; background: #f6f8fe; font-family: 'Segoe UI', 'Microsoft YaHei UI', sans-serif; }
button, .button-link, input, select, textarea { border-radius: 9px; }
button, .button-link { transition: background .16s, border-color .16s; color: #405579; }
button:hover, .button-link:hover { background: #edf2ff; border-color: #b4c5fb; }
.primary { background: #4263eb; border-color: #4263eb; color: white; }
.primary:hover { background: #3452d2; border-color: #3452d2; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid #8daaff; outline-offset: 3px; }
input, select, textarea { background: #fff; color: #263650; min-height: 42px; }
input::placeholder, textarea::placeholder { color: #8893a8; }
.app-shell { grid-template-columns: 242px minmax(0,1fr); }
.sidebar { padding: 30px 18px 20px; background: #fff; }
.brand { color: #304c95; gap: 12px; }
.brand small { color: #74819d; }
.brand .app-mark, .app-mark { display: block; flex: 0 0 auto; width: 40px; height: 40px; border-radius: 0; background: transparent; object-fit: contain; }
.login-story .app-mark { width: 56px; height: 56px; }
nav { gap: 3px; }
nav a { min-height: 42px; padding: 7px 11px; color: #52617c; border-radius: 10px; font-size: 13px; }
nav a:hover { background: #f2f5ff; }
nav a[aria-current='page'] { background: #edf2ff; color: #3555cf; box-shadow: inset 3px 0 #5878f2; }
.nav-icon { display: block; flex: 0 0 28px; width: 28px; height: 28px; padding: 4px; border-radius: 8px; background: var(--icon-bg,#edf2ff); }
nav a[aria-current='page'] .nav-icon { background: #fff; }
.nav-group-icon{display:block;flex:0 0 23px;width:23px;height:23px;padding:3px;border-radius:7px;background:#eef2fb}
.nav-section>summary>span{flex:1;min-width:0}
.nav-favorites{padding:7px 0 9px;margin:4px 0 5px;border-top:1px solid #edf1f7;border-bottom:1px solid #edf1f7}
.nav-favorites-heading{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:1px 8px 5px 10px;color:#536582;font-size:12px;font-weight:700}
.nav-favorites-heading>span{display:flex;align-items:center;gap:7px}
.nav-favorites-heading .nav-group-icon{background:#fff7e5}
.nav-favorites-heading button{display:inline-flex;align-items:center;gap:3px;padding:4px 6px;min-height:26px;border:0;background:transparent;color:#536aa0;font-size:11px}
.nav-favorites-heading button svg{width:15px;height:15px}
.nav-favorites-links{display:grid;gap:2px;padding:0 4px}
.nav-favorites-links a{min-height:37px;padding:6px 9px;font-size:12px}
.nav-favorites-links .nav-icon{width:24px;height:24px;flex-basis:24px}
.nav-favorites-empty{margin:3px 10px 5px;color:#8896a8;font-size:11px;line-height:1.5}
/* Keep sidebar rows compact; page-level summary spacing must not affect navigation. */
#main-navigation { padding: 24px 14px 16px; max-height: none; }
#main-navigation > .brand { margin-bottom: 18px; gap: 10px; }
#main-navigation > nav { display: flex; flex: 0 0 auto; flex-direction: column; gap: 2px; }
#main-navigation .nav-section { margin: 0; min-width: 0; }
#main-navigation .nav-section > summary { margin: 0; min-height: 38px; padding: 7px 10px; gap: 8px; line-height: 20px; }
#main-navigation .nav-section > summary > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#main-navigation .nav-group-icon { flex-basis: 22px; width: 22px; height: 22px; }
#main-navigation .nav-section > summary::after { width: 16px; height: 16px; font-size: 15px; }
#main-navigation .nav-section:not([open]) > .nav-section-links { display: none; }
#main-navigation .nav-section-links { grid-template-columns: minmax(0, 1fr); gap: 2px; padding: 0 4px 4px; }
#main-navigation nav a { min-height: 36px; padding: 6px 10px; gap: 8px; line-height: 22px; white-space: nowrap; }
#main-navigation nav a .nav-icon { flex-basis: 22px; width: 22px; height: 22px; padding: 3px; border-radius: 6px; }
#main-navigation .nav-section-links a { padding-left: 14px; font-size: 12px; }
#main-navigation .nav-favorites { margin: 4px 0; padding: 6px 0; }
#main-navigation .nav-favorites-heading { padding: 0 10px 4px; }
#main-navigation .nav-favorites-links { padding: 0 0 0 20px; }
#main-navigation > .aside-note { flex: 0 0 auto; padding: 18px 10px 0; }
.nav-group { color: #7d88a2; letter-spacing: 1px; padding: 19px 13px 9px; }
.technical-nav { border-top: 1px solid var(--line); margin-top: 16px; padding-top: 10px; }
.technical-nav summary { color: #6d7c9c; }
.technical-nav summary .nav-icon { display: inline-block; vertical-align: middle; margin: 0 9px 2px 0; width: 26px; height: 26px; }
.mobile-menu .nav-icon { width: 24px; height: 24px; padding: 2px; background: transparent; }
@media(max-width:600px){.nav-favorites{grid-column:1/-1}}
.favorites-dialog{width:min(740px,calc(100vw - 24px));max-height:90dvh;box-sizing:border-box}
.favorites-dialog .section-heading{margin-bottom:6px}
.favorites-dialog .section-heading p{margin:4px 0 0;font-size:12px;color:#74839a}
.favorites-editor{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px}
.favorites-editor h3{font-size:13px;margin:0 0 8px;color:#40567c}
.favorites-current,.favorites-available{min-height:190px;max-height:48dvh;overflow:auto;border:1px solid #e1e7f1;border-radius:10px;padding:7px;background:#f9fbff}
.favorites-row{display:flex;align-items:center;gap:7px;min-height:40px;padding:6px;margin-bottom:5px;border:1px solid #e6ebf4;border-radius:8px;background:#fff;font-size:12px}
.favorites-row[draggable=true]{cursor:grab}
.favorites-row.is-dragging{opacity:.45}
.favorites-row.is-drop-target{border-color:#6d8bea;background:#edf3ff}
.favorites-row>.nav-icon{width:24px;height:24px;flex:0 0 24px}
.favorites-row strong{min-width:0;flex:1;font-weight:600}
.favorites-row small{display:block;color:#8391a5;font-size:10px;font-weight:400}
.favorites-row button{display:inline-flex;align-items:center;justify-content:center;gap:4px;flex:none;min-width:28px;min-height:28px;padding:4px 6px;font-size:11px}
.favorites-row button svg,.favorites-dialog .dialog-actions button svg{width:15px;height:15px;flex:none}
.favorites-handle{width:16px;height:16px;flex:none;color:#8995a8}
.favorites-search{width:100%;min-height:34px;margin-bottom:8px;font-size:12px}
.favorites-dialog .dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
.favorites-dialog .dialog-actions button{display:inline-flex;align-items:center;gap:5px}
.favorites-error{min-height:18px;margin:8px 0 0;color:#b43b3b;font-size:12px}
@media(max-width:650px){.favorites-editor{grid-template-columns:1fr}.favorites-current,.favorites-available{max-height:28dvh}}
.aside-note { padding-top: 24px; }
.main-area { background: #f6f8fe; }
.page-header { padding: 26px 34px 22px; border-bottom: 1px solid #e5eaf4; background: #fff; }
h1 { font-size: 24px; letter-spacing: -.5px; color: #263b65; }
h2 { color: #2e426b; }
.eyebrow { color: #7b88ad; font-size: 9px; letter-spacing: 2px; }
.toolbar { gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.toolbar button { padding: 7px 11px; font-size: 12px; background: #fff; }
.toolbar .primary { color: #4263eb; }
.content-area { padding: 28px 34px 40px; }
.card, .stat { border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 3px 12px #20433503; }
.card { padding: 24px; }
.stat { border-top: 3px solid #6284f3; padding: 20px 22px; }
.stat:nth-child(2) { border-top-color: #2bbcad; }.stat:nth-child(3) { border-top-color: #efa84d; }.stat:nth-child(4) { border-top-color: #a07ae8; }
.stat .number { font-size: 32px; line-height: 1.5; letter-spacing: -1px; font-weight: 600; }
.stat a { color: #6c7a99; font-size: 11px; }
.metrics { gap: 16px; margin-bottom: 24px; }
.section-heading { margin-bottom: 20px; }
.section-heading p { font-size: 12px; }
.badge.blue { background: #edf1ff; color: #4a63c0; border-color: #dbe4ff; }
.welcome-panel { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 30px 34px; margin-bottom: 24px; border: 1px solid #dfe7ff; border-radius: 16px; background: linear-gradient(115deg,#eaf3ff 0%,#f1edff 64%,#fff2e9 100%); }
.welcome-label { font-size: 11px; color: #6178bd; letter-spacing: 1px; margin-bottom: 9px; }
.welcome-panel h2 { font-size: 25px; font-weight: 600; margin-bottom: 9px; letter-spacing: -.4px; }
.welcome-panel p { color: #6b7896; font-size: 13px; }
.welcome-actions { display: flex; gap: 12px; margin-top: 23px; flex-wrap: wrap; }
.welcome-actions .button-link { background: #ffffffba; border-color: #d4def8; }
.welcome-note { padding: 10px 26px; border-left: 1px solid #d6d8f0; min-width: 210px; }
.welcome-note strong { display: block; font-size: 13px; margin-bottom: 6px; }
.welcome-note-mark { display: grid; place-items: center; background: #daf4ec; color: #178c74; width: 38px; height: 38px; border-radius: 12px; margin-bottom: 12px; }
.desk-grid { grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); gap: 22px; }
.desk-actions { display: grid; gap: 8px; margin-top: 18px; }
.desk-actions .button-link { justify-content: flex-start; padding: 13px 10px; border: 0; background: #f5f8f5; flex-wrap: wrap; text-align: left; }
.desk-actions .button-link span { background: #e5eee5; border-radius: 6px; padding: 3px 6px; color: #6a8776; font-size: 10px; margin-right: 6px; }
.desk-actions .button-link small { margin-left: auto; color: #87968b; font-size: 11px; }
.empty-state { padding: 46px 18px; background: #f9fbf8; border: 1px dashed #dce5dc; border-radius: 10px; color: #819082; text-align: center; }
.customer-card { padding: 22px; border-color: #dfe8de; border-radius: 12px; background: #fafcf9; }
.customer-card h3 { font-size: 16px; }
.customer-card button { margin-top: 14px; }
.table-wrap { border-color: #e3e9e3; border-radius: 10px; }
th { background: #f4f8f4; color: #718273; font-weight: 500; font-size: 12px; white-space: nowrap; }
td { padding-top: 15px; padding-bottom: 15px; }
tbody tr:hover { background: #fafcf8; }
td button { font-size: 12px; padding: 5px 9px; }
.manage-actions { gap: 8px; flex-wrap: wrap; }
dialog { color: #203b36; border: 1px solid #d9e6de; border-radius: 18px; padding: 28px; box-shadow: 0 24px 100px #19352a30; max-width: calc(100vw - 32px); max-height: calc(100dvh - 40px); }
dialog::backdrop { background: #183d3066; backdrop-filter: blur(3px); }
dialog h2 { font-size: 21px; }
dialog .section-heading button { padding: 4px 10px; }
/* Keep grid field contents at their natural height when a neighbour has help text. */
label { color: #536d60; font-size: 13px; align-content: start; min-width: 0; }
label small { font-weight: 400; }
.wechat-binding-actions { margin-bottom: 20px; }
.staff-chat-links { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.staff-chat-dialog { width: min(1180px,calc(100vw - 32px)); height: min(960px,94dvh); max-height: 94dvh; padding: 20px 24px; overflow: hidden; }
.staff-chat-dialog[open] { display: flex; flex-direction: column; }
.staff-chat-dialog>.section-heading { flex: none; margin-bottom: 8px; }
.staff-chat-dialog [data-staff-chat-tabs],.staff-chat-dialog [role=tabpanel] { display: flex; flex-direction: column; min-height: 0; flex: 1; }
.staff-chat-dialog .page-tabs { flex: none; margin-bottom: 10px; padding-bottom: 8px; }
.staff-chat-dialog .page-tabs>button { padding: 6px 12px; font-size: 13px; }
.staff-chat-filters { display: grid; grid-template-columns: minmax(180px,1fr) 196px 196px max-content; gap: 8px 12px; align-items: end; flex: none; }
.staff-chat-filters label { margin: 0; gap: 4px; font-size: 12px; }
.staff-chat-filters input,.staff-chat-filters select { height: 36px; min-height: 36px; padding: 6px 9px; font-size: 12px; }
.staff-chat-filters>.manage-actions { flex-wrap: nowrap; gap: 8px; margin: 0; }
.staff-chat-filters button { height: 36px; padding: 6px 12px; font-size: 12px; white-space: nowrap; }
.staff-chat-dialog [data-staff-chat-status],.staff-chat-dialog [data-staff-chat-context-info] { margin: 7px 0; font-size: 12px; }
.staff-chat-scroll { overflow: auto; min-height: 0; flex: 1; overscroll-behavior: contain; padding: 2px 6px; }
.staff-chat-footer { display: flex; justify-content: center; gap: 12px; padding-top: 8px; flex: none; }
.staff-chat-footer:has(>button:not([hidden])) { padding-top: 8px; }
.staff-chat-footer:not(:has(>button:not([hidden]))) { padding: 0; }
.staff-chat-footer button { padding: 5px 12px; font-size: 12px; }
.staff-chat-dialog .chat-message { padding: 8px 12px; margin: 6px 0; border-radius: 8px; }
.staff-message-header { display: flex; align-items: center; gap: 8px; min-width: 0; }
.staff-message-header>strong { flex: 0 1 auto; max-width: 160px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 13px; }
.staff-message-time { flex: none; color: var(--muted); font-size: 11px; white-space: nowrap; }
.staff-message-source { flex: 1; min-width: 0; color: var(--muted); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.staff-message-header .badge { flex: none; font-size: 11px; white-space: nowrap; }
.staff-message-context { flex: none; margin-left: auto; padding: 2px 8px; font-size: 12px; line-height: 20px; }
.staff-chat-dialog .chat-message p { margin: 4px 0 0; font-size: 13px; line-height: 1.6; }
.staff-message-note { display: block; margin-top: 4px; }
.staff-chat-dialog .staff-chat-target { border: 2px solid #5578e6; background: #f1f5ff; }
.staff-chat-target .badge { margin-left: 10px; }
@media(max-width:860px) { .staff-chat-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }.staff-chat-dialog { padding: 16px; }.staff-chat-dialog h2 { font-size: 18px; } }
@media(max-width:540px) { .staff-chat-filters { grid-template-columns: 1fr; }.staff-message-header { flex-wrap: wrap; }.staff-message-source { order: 4; flex-basis: 100%; }.staff-message-header>strong { max-width: 100px; } }
.wechat-picker-dialog { width: 950px; }
.wechat-picker-filters { display: grid; grid-template-columns: minmax(180px,1fr) 150px auto; gap: 14px; align-items: end; }
.wechat-picker-filters label { margin: 0; }
.wechat-picker-dialog .table-wrap { max-height: 42dvh; overflow: auto; }
.wechat-picker-dialog th { position: sticky; top: 0; z-index: 1; }
.wechat-picker-dialog td { vertical-align: top; overflow-wrap: anywhere; }
.wechat-picker-dialog td small { display: block; }
.wechat-picker-dialog .wechat-picked { background: #edf2ff; }
.wechat-picker-dialog .dialog-actions { justify-content: space-between; }
@media(max-width:600px) { .wechat-picker-filters { grid-template-columns: 1fr; }.wechat-picker-dialog .table-wrap { max-height: 35dvh; } }
.opening-dialog { width: 650px; }
.opening-dialog label { display: grid; gap: 6px; }
.opening-dialog fieldset { padding: 0; margin: 20px 0; border: 0; min-width: 0; }
.opening-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.opening-grid .wide { grid-column: 1 / -1; }
.opening-grid textarea { width: 100%; resize: vertical; min-height: 74px; }
.opening-hint { padding: 12px 15px; background: #f1f6ed; border-radius: 9px; font-size: 12px; color: #6b7e61; }
.opening-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; }
.opening-footer small { max-width: 280px; }
.login-screen { min-height: 100dvh; display: grid; grid-template-columns: minmax(350px,.95fr) minmax(480px,1.05fr); place-items: stretch; gap: 0; padding: 0; background: #fff; }
.login-story { background: radial-gradient(ellipse at 0 0,#c9edff 0%,transparent 52%),radial-gradient(ellipse at 100% 100%,#ffe2cc 0%,transparent 48%),linear-gradient(145deg,#ecf3ff,#eee5ff); color: #324b80; min-height: 100dvh; padding: 54px 12%; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; }
.login-story .brand { font-size: 20px; }
.login-story-copy { max-width: 450px; padding: 50px 0; }
.story-kicker { display: block; color: #687cc6; letter-spacing: 3px; font-size: 11px; margin-bottom: 18px; }
.login-story h2 { font-size: clamp(30px,3.2vw,46px); line-height: 1.55; letter-spacing: -1px; font-weight: 500; }
.login-story-copy p { max-width: 345px; margin: 26px 0 38px; font-size: 14px; color: #65749a; line-height: 2; }
.story-flow { display: flex; align-items: center; gap: 12px; font-size: 12px; color: #5269b5; }
.story-flow span { background: #ffffff99; border: 1px solid #d6e1ff; border-radius: 9px; padding: 9px 12px; }.story-flow span:nth-of-type(2) { color: #8b5bb8; border-color: #e6d6fb; }.story-flow span:nth-of-type(3) { color: #b97427; border-color: #f4ddc3; }.story-flow i { font-style: normal; color: #a4a8d0; }
.login-entry { padding: 70px 9%; align-self: center; width: 100%; max-width: 620px; justify-self: center; }
.login-card { width: 100%; max-width: none; background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0; }
#staff-login { display: grid; gap: 22px; }
#staff-login .story-kicker { margin-bottom: -10px; }
#staff-login h1 { font-size: 29px; }
#staff-login > p { margin-top: -14px; font-size: 13px; }
#staff-login label { display: grid; gap: 8px; }
#staff-login input { padding: 12px 14px; width: 100%; }
#staff-login .primary { min-height: 46px; font-size: 14px; }
.installer-entry { margin-top: 35px; border-top: 1px solid #e5eaf4; padding-top: 20px; color: #75829e; font-size: 12px; }
.installer-entry summary { cursor: pointer; }.installer-entry form { margin-top: 22px; display: grid; gap: 12px; }
.auth-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; margin-bottom: 30px; border-radius: 12px; background: #edf1f8; }
.auth-switch button { min-height: 40px; border: 0; border-radius: 9px; background: transparent; color: #66758f; font-weight: 600; cursor: pointer; }
.auth-switch button[aria-selected="true"] { background: #fff; color: #304886; box-shadow: 0 2px 9px #24396b18; }
#staff-login[hidden],#user-register[hidden],.installer-entry[hidden] { display: none; }
#user-register { display: grid; gap: 14px; }
#user-register .story-kicker { margin-bottom: -8px; }
#user-register h1 { font-size: 27px; }
#user-register > p { font-size: 13px; line-height: 1.7; margin-top: -8px; }
#user-register label { display: grid; gap: 6px; font-size: 13px; }
#user-register label > input:not([type="range"]) { width: 100%; padding: 11px 13px; }
#user-register .primary { min-height: 45px; }
.registration-puzzle { padding: 13px; border: 1px solid #dce4f0; border-radius: 12px; background: #f8faff; }
.puzzle-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 9px; font-size: 13px; }
.puzzle-heading button { border: 0; background: none; color: #4565aa; cursor: pointer; font-size: 12px; }
.puzzle-board { width: min(100%,320px); aspect-ratio: 320 / 150; position: relative; overflow: hidden; border-radius: 8px; background: #dcecf0; margin-inline: auto; }
.puzzle-board [data-puzzle-board] { display: block; width: 100%; height: 100%; }
.puzzle-board [data-puzzle-piece] { position: absolute; left: 0; height: auto; filter: drop-shadow(0 2px 3px #173c4880); pointer-events: none; }
.registration-puzzle label { margin-top: 10px; }
.registration-puzzle input[type="range"] { width: min(100%,320px); accent-color: #526fc4; cursor: grab; margin-inline: auto; }
.registration-puzzle small { display: block; min-height: 17px; margin-top: 4px; color: #66758f; }
@media(max-width:760px) { .auth-switch { margin-bottom: 22px; }.login-entry { padding-top: 28px; }.registration-puzzle { padding: 10px; } }
.staff-key-scope-dialog form { display: grid; gap: 12px; }
.staff-key-scope-dialog .scope-mode { display: flex; align-items: center; gap: 9px; font-weight: 600; }
.staff-key-options { max-height: min(42dvh,360px); overflow: auto; border: 1px solid #dce4ee; border-radius: 10px; padding: 6px 12px; }
.staff-key-options label { display: flex; gap: 10px; align-items: flex-start; padding: 9px 3px; border-bottom: 1px solid #e9eef4; }
.staff-key-options label:last-child { border-bottom: 0; }
.staff-key-options label small { display: block; color: #728098; margin-top: 3px; }
.mobile-menu { display: none; }
#biz-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 20px; margin: 22px 0; }
#biz-fields > label { margin: 0; }
#biz-fields > p, #biz-fields > section, #biz-fields > div, #biz-fields > label:has(textarea), #biz-fields > label:has(select[multiple]) { grid-column: 1 / -1; }
#biz-stage { background: #edf4e9; color: #68805c; border-radius: 9px; padding: 12px 15px; font-size: 12px; }
#biz-fields #customer-submission { padding: 15px; font-size: 12px; box-shadow: none; margin: 0; background: #f9fbf7; }
@media(max-width:760px) { #biz-fields { grid-template-columns: 1fr; } }
@media(min-width:1600px) { .content-area > section { max-width: 1420px; margin-left: auto; margin-right: auto; } }
@media(max-width:1150px) { .app-shell { grid-template-columns: 210px minmax(0,1fr); }.page-header { padding: 22px; }.content-area { padding: 22px; }.welcome-panel { padding: 25px; }.welcome-note { display: none; }.desk-grid { grid-template-columns: 1fr; }.toolbar { max-width: 270px; }.metrics { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:760px) { .app-shell { display: flex; }.main-area { width: 100%; }.sidebar { display: none; position: fixed; z-index: 30; top: 78px; bottom: 0; left: 0; width: min(290px,85vw); box-shadow: 16px 0 40px #16392a24; }.app-shell.nav-open .sidebar { display: flex; }.mobile-menu { display: inline-flex; flex: 0 0 auto; font-size: 19px; padding: 5px 10px; }.page-header { gap: 12px; padding: 14px 16px; min-height: 78px; flex-wrap: wrap; }.page-heading { flex: 1; }.page-heading h1 { font-size: 20px; }.page-heading p,.eyebrow { display: none; }.toolbar { margin-left: auto; max-width: none; }.toolbar .badge,#refresh { display: none; }.toolbar button { max-width: 175px; overflow: hidden; text-overflow: ellipsis; }.content-area { padding: 16px; }.welcome-panel { padding: 22px; }.welcome-panel h2 { font-size: 21px; }.welcome-panel p { font-size: 12px; }.welcome-actions { gap: 8px; }.welcome-actions button,.welcome-actions a { font-size: 12px; }.metrics { gap: 10px; }.stat { padding: 15px; }.stat .number { font-size: 27px; }.card { padding: 18px; }.customer-cards { grid-template-columns: 1fr; }.section-heading { flex-wrap: wrap; gap: 10px; }.manage-dialog,dialog { padding: 22px; }.opening-grid { grid-template-columns: 1fr; }.opening-footer { flex-wrap: wrap; }.opening-footer button { width: 100%; }.login-screen { display: block; }.login-story { min-height: 0; padding: 26px; }.login-story .brand { margin: 0; }.login-story-copy,.login-story>small { display: none; }.login-entry { padding: 40px 26px; }.desk-actions .button-link small { font-size: 10px; }.notice { margin: 12px 16px 0; } }
@media(prefers-reduced-motion:reduce) { * { transition: none!important; scroll-behavior: auto!important; } }
.chat-message { padding: 14px 16px; border: 1px solid var(--line); border-radius: 10px; background: #fff; margin: 10px 0; overflow-wrap: anywhere; }
.chat-message p { white-space: pre-wrap; margin: 9px 0; line-height: 1.65; }
.chat-message small { color: var(--muted); }
#customer-chat h3 { margin: 22px 0 10px; }
/* Function tabs and focused management screens */
.page-tabs{display:flex;gap:6px;overflow-x:auto;padding:3px 0 12px;margin:0 0 20px;border-bottom:1px solid #dfe5ef;scrollbar-width:thin}
.page-tabs>button{flex:0 0 auto;background:transparent;border:1px solid transparent;color:#64748b;padding:9px 16px;font-size:14px;font-weight:600;white-space:nowrap;border-radius:8px}
.page-tabs>button[aria-selected="true"]{background:#edf0ff;border-color:#d8defb;color:#4457b3}
.page-tabs>button:focus-visible{outline:2px solid #667de1;outline-offset:2px}
[data-ui-panel]>.card{margin-bottom:16px}
[data-ui-panel] .page-tabs{margin-top:4px;font-size:13px}
.list-filters{display:grid;grid-template-columns:minmax(220px,2fr) repeat(2,minmax(140px,1fr));gap:14px;margin-bottom:20px;align-items:end}
.list-filters label,.compact-dialog label,[data-access-form]>label{display:grid;gap:7px}
.list-count{font-size:13px;color:#75829e;margin:10px 0}
.table-pagination{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin:10px 0;font-size:12px;color:#68717e}
.table-pagination button{padding:6px 12px;font-size:12px}
.customer-list{display:block}
.customer-list td:last-child{min-width:240px}
.compact-dialog{width:680px}.account-dialog{width:440px}
.dialog-actions{display:flex;gap:16px;align-items:center;border-top:1px solid #e4e9f2;padding-top:18px;margin-top:20px}
.menu-matrix{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0}
.menu-matrix fieldset,[data-access-form] fieldset{min-width:0;border:1px solid #e1e6f1;border-radius:10px;padding:14px 16px;margin:10px 0}
.menu-matrix fieldset{margin:0}
.menu-matrix legend,[data-access-form] legend{font-size:13px;font-weight:600;color:#52648b;padding:0 5px}
.permission-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.permission-choice{display:flex!important;flex-direction:row;align-items:center;gap:8px;margin:0!important;font-size:13px}
.manage-dialog [data-profile-selection]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}
.manage-dialog [data-profile-selection][hidden]{display:none}
.permission-choice input{width:auto!important;min-height:0;margin:0;accent-color:#6673c5}
.directory-editor-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid #e2e8ee;margin-top:18px;padding-top:16px;background:#fff}
.directory-editor-footer p{margin:0;font-size:13px}.directory-editor-footer .error-text:not(:empty){margin-top:6px}.directory-editor-buttons{display:flex;gap:10px;flex-shrink:0}
.permission-editor-dialog{width:min(1080px,calc(100vw - 32px));height:min(820px,92dvh);max-height:92dvh;overflow:hidden;padding:24px;box-sizing:border-box}
.permission-editor-dialog[open]{display:flex;flex-direction:column}.permission-editor-dialog>.section-heading{flex:none;margin-bottom:16px}.permission-editor-dialog h2{font-size:22px}
.permission-editor-dialog form,.permission-editor-dialog [data-editor],.permission-editor-dialog #permission-edit-rules-panel,.permission-editor-dialog [data-matrix]{display:flex;flex-direction:column;min-height:0;flex:1}
.permission-editor-dialog [role=tabpanel][hidden]{display:none!important}.permission-editor-dialog #permission-edit-profile-panel{overflow:auto;flex:1}.permission-editor-dialog .page-tabs{flex:none;margin-bottom:14px}
.permission-editor-dialog .directory-editor-footer{flex:none;margin-top:0;padding-top:16px}.permission-help{margin:0 0 12px;font-size:12px;color:#657587;line-height:1.6}
.permission-toolbar{display:flex;gap:14px;align-items:end;margin-bottom:14px;flex:none}.permission-toolbar label{display:flex;flex-direction:column;gap:6px;margin:0;font-size:12px;color:#50647a}.permission-search{flex:1}.permission-toolbar select{min-width:130px}.permission-toolbar input,.permission-toolbar select{min-height:40px}
.permission-layout{display:grid;grid-template-columns:204px minmax(0,1fr);min-height:0;flex:1;border:1px solid #dfe6ed;border-radius:12px;overflow:hidden}
.permission-sections{padding:10px;background:#f6f8fb;border-right:1px solid #e1e7ee;overflow:auto}.permission-sections button{display:flex;align-items:center;justify-content:space-between;gap:7px;width:100%;padding:12px 10px;margin-bottom:5px;text-align:left;border:1px solid transparent;border-radius:8px;background:transparent;color:#546578;font-size:13px}.permission-sections small{font-size:11px;white-space:nowrap;color:#77879a}.permission-sections button[aria-pressed=true]{background:#eaf0ff;border-color:#ccd9fb;color:#314da0;font-weight:600}.permission-sections button[aria-pressed=true] small{color:#536eaf}
.permission-content{display:flex;flex-direction:column;min-width:0;min-height:0}.permission-bulk{padding:12px 14px;background:#fff;border-bottom:1px solid #e5eaf0;flex:none}.permission-bulk p{font-size:12px;margin:0 0 9px;color:#607087}.permission-bulk>div{display:flex;gap:8px;flex-wrap:wrap}.permission-bulk button{font-size:12px;padding:6px 10px;min-height:30px}
.permission-grid-head,.permission-row{display:grid;grid-template-columns:minmax(110px,1.1fr) minmax(118px,.9fr) minmax(220px,2.8fr);gap:12px;align-items:start;padding:14px 16px}.permission-grid-head{background:#f7f9fb;padding-top:10px;padding-bottom:10px;color:#718093;font-size:12px;flex:none;border-bottom:1px solid #e5eaf0}
.permission-rows{min-height:0;overflow:auto;overscroll-behavior:contain;flex:1;scrollbar-gutter:stable}.permission-row{border-bottom:1px solid #edf0f4;min-height:70px}.permission-row:last-child{border-bottom:0}.permission-row:hover{background:#fafbfe}.permission-menu strong{display:block;font-size:13px;color:#2d435d;line-height:30px}.permission-menu small{display:block;font-size:11px;color:#8290a1;margin-top:2px}
.permission-operations{display:flex;flex-wrap:wrap;gap:7px}.permission-toggle{display:inline-flex!important;align-items:center;gap:7px;margin:0!important;padding:6px 8px;border:1px solid #e0e5ec;border-radius:6px;font-size:12px;line-height:18px;cursor:pointer;background:#fff;white-space:nowrap;color:#647286}.permission-toggle.is-checked{border-color:#ccd7fb;background:#eff3ff;color:#3857a6}.permission-toggle input{width:14px!important;height:14px;min-height:0;margin:0;accent-color:#506be3}.permission-toggle:focus-within{outline:2px solid #7893ef;outline-offset:2px}.permission-readonly{display:block;font-size:12px;color:#8a95a3;line-height:32px}
.permission-feedback{min-height:19px;font-size:12px;color:#536a84;margin:8px 0}.permission-empty{padding:45px 18px;text-align:center;color:#66778b}.permission-empty strong{font-size:15px}.permission-empty p{font-size:13px}.permission-empty button{margin-top:10px}.permission-rows:focus-visible{outline:2px solid #7893ef;outline-offset:-2px}
.permission-sections{display:flex;flex-direction:column;justify-content:flex-start;gap:3px}
.permission-sections button{flex:none;height:36px;min-height:36px;padding:7px 9px;margin:0;line-height:20px}
.permission-section-label{display:flex;align-items:center;gap:6px;min-width:0;white-space:nowrap;font-size:12px}
.permission-section-label svg{width:18px;height:18px;flex:none}
.permission-menu-select{display:flex!important;flex-direction:row!important;align-items:center;gap:7px;margin:0!important;cursor:pointer}.permission-menu-select input{width:14px!important;height:14px;min-height:0;margin:0;accent-color:#506be3}.permission-select-all{background:#eef2ff;border-color:#c8d5fb;color:#3554b5;font-weight:600}
.permission-toggle{flex-direction:row!important;min-height:30px;padding:5px 7px;box-sizing:border-box}
.permission-row{min-height:50px;padding-top:10px;padding-bottom:10px;align-items:center}
.permission-menu{display:flex;flex-wrap:wrap;align-items:center;column-gap:8px}.permission-menu strong{line-height:30px}.permission-menu small{margin:0;font-size:10px}
@media(max-width:760px){.permission-sections{flex-direction:row}}
.permission-feedback:empty{display:none}
@media(max-height:850px){.permission-editor-dialog{height:94dvh;max-height:94dvh;padding:18px}.permission-editor-dialog>.section-heading{margin-bottom:8px}.permission-editor-dialog h2{font-size:20px}.permission-editor-dialog .page-tabs{margin-bottom:8px}.permission-editor-dialog .page-tabs>button{padding:7px 12px}.permission-help{font-size:11px;line-height:1.4;margin-bottom:8px}.permission-toolbar{margin-bottom:10px}.permission-toolbar label{gap:4px;line-height:16px}.permission-toolbar input,.permission-toolbar select{min-height:34px;padding-top:7px;padding-bottom:7px}.permission-bulk{padding:9px 12px}.permission-bulk p{margin-bottom:6px}.permission-grid-head{padding-top:8px;padding-bottom:8px}.permission-editor-dialog .directory-editor-footer{padding-top:12px}.permission-feedback{min-height:16px;margin:6px 0;font-size:11px}}
@media(max-width:760px){.permission-editor-dialog{padding:16px;width:calc(100vw - 16px);height:94dvh;max-height:94dvh}.permission-editor-dialog h2{font-size:19px}.permission-layout{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr)}.permission-sections{display:flex;gap:5px;overflow:auto;border-right:0;border-bottom:1px solid #e1e7ee;padding:7px}.permission-sections button{width:auto;flex:none;margin:0;padding:8px;font-size:12px}.permission-grid-head{display:none}.permission-row{grid-template-columns:minmax(110px,1fr) 140px;gap:7px;padding:12px}.permission-operations{grid-column:1/-1}.permission-menu small{display:none}.permission-toolbar{gap:8px}.permission-toolbar select{min-width:95px}.permission-help{font-size:11px}.directory-editor-footer{gap:8px}.directory-editor-footer p{font-size:11px}.permission-bulk{padding:9px}.permission-bulk button{font-size:11px}.permission-feedback{font-size:11px}}
[data-access-form]>label{max-width:560px;margin:16px 0}
.scope-options{max-height:280px;overflow:auto;padding:4px}
[data-access-form]>.primary{margin-top:16px}
#chat-messages,#chat-context{max-height:58vh;overflow:auto;overscroll-behavior:contain}
#biz-history{max-height:55vh;overflow:auto}
#directory-editor .table-wrap{max-height:300px;overflow:auto}
#table-settings-entry-panel .section-heading{margin-top:0}
#customer>.form-actions{margin-top:18px;padding-top:18px;border-top:1px solid #e5eaf2}
@media(max-width:760px){.page-tabs{gap:2px;margin-bottom:15px}.page-tabs>button{padding:9px 12px;font-size:13px}.list-filters{grid-template-columns:1fr}.menu-matrix{grid-template-columns:1fr}.permission-choices{grid-template-columns:1fr 1fr}.compact-dialog{width:calc(100vw - 28px)}.dialog-actions{flex-wrap:wrap}.table-pagination{justify-content:flex-start;flex-wrap:wrap}}
.search-toolbar{padding:16px 24px}.search-toolbar label{margin:0}
.manage-fields-tabs>.page-tabs{margin-bottom:16px}.manage-fields-tabs .form-grid>label:has(textarea){grid-column:1/-1}
#business-ticket-fields>div[role="tabpanel"] dl{margin:12px 0}#manage-form>details{margin:12px 0;color:#6b7792;font-size:13px}
#manage-context{max-height:240px;overflow:auto;white-space:pre-wrap}
#directory-editor [data-directory-fields]>p{margin-top:4px}
/* Customer management shares the staff list's compact, task-oriented layout. */
.customer-management{padding:22px 24px}.customer-page-heading{margin-bottom:18px;align-items:center}.customer-page-heading h2{font-size:19px;margin:0 0 5px}.customer-page-heading p{font-size:12px;margin:0;line-height:1.5;color:#788596}.customer-page-heading .manage-actions{margin:0;gap:8px;flex-wrap:wrap}
.customer-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:end;margin:0 0 12px}.customer-filters label{display:flex;flex-direction:column;gap:5px;margin:0;font-size:12px;color:#5f6f80;flex:0 1 145px;min-width:110px}.customer-filters .customer-keyword{flex:1 1 230px;max-width:380px;min-width:180px}.customer-filters input,.customer-filters select{min-height:36px;height:36px;padding:7px 10px;font-size:12px}.customer-filter-actions{display:flex;gap:7px;align-items:center;flex:none}.customer-filter-actions button,.customer-filters>button{min-height:36px;padding:7px 12px;font-size:12px}
.customer-list-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#718095;font-size:12px;margin:12px 0}.customer-management .table-wrap{margin-top:0}.customer-management th,.customer-management td{font-size:12px;padding:12px 10px;vertical-align:middle}.customer-management td strong{font-size:13px}.customer-management td small{display:block;color:#8390a0;font-size:11px;margin-top:4px;max-width:280px;overflow-wrap:anywhere}.customer-management td:first-child{min-width:135px}.customer-management td:nth-child(3){max-width:250px;overflow-wrap:anywhere}.customer-platform{display:block;font-size:10px;color:#768696;margin-bottom:3px}.customer-amount{white-space:nowrap;font-variant-numeric:tabular-nums}
.customer-row-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;min-width:112px;max-width:240px}.customer-row-actions button{font-size:12px;line-height:18px;padding:5px 9px;min-height:30px;white-space:nowrap}.customer-row-actions button[data-delete-kind]{margin:0}.customer-management .page-tabs{margin-bottom:16px;padding-bottom:10px}.customer-management .page-tabs button{padding:7px 13px;font-size:13px}
.customer-detail-dialog{width:min(980px,calc(100vw - 36px));max-height:90dvh}.customer-detail-dialog td{font-size:12px;padding:10px}.customer-detail-dialog td small{display:block;color:#7a899a;margin-top:4px}.customer-detail-dialog [data-detail-add]{margin-bottom:12px}.customer-inline-form{display:flex;gap:10px;align-items:end;margin:18px 0}.customer-inline-form label{display:flex;flex-direction:column;gap:5px;min-width:240px;margin:0}.customer-summary{display:grid;grid-template-columns:100px 1fr;font-size:13px;gap:12px}.customer-summary dd{margin:0}.customer-chat-dialog{width:min(1100px,calc(100vw - 32px));height:91dvh;max-height:91dvh;overflow:auto}.customer-chat-dialog #customer-chat>.section-heading{display:none}.customer-chat-dialog #customer-chat>.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.customer-chat-dialog #customer-chat>.manage-actions{margin:10px 0}.customer-chat-dialog #chat-messages,.customer-chat-dialog #chat-context{max-height:50dvh}.customer-chat-dialog .chat-message{padding:10px 12px;margin:7px 0}.customer-chat-dialog .chat-message p{margin:6px 0;line-height:1.5;font-size:13px}.customer-chat-dialog .chat-message small{font-size:11px}
#manage-dialog:has(#manage-fields.manage-fields-tabs){width:min(850px,calc(100vw - 32px));max-height:92dvh}#manage-dialog [data-ui-panel] .form-grid{gap:14px 18px}#manage-dialog [data-ui-panel] label{font-size:13px;margin:0}#manage-dialog [data-ui-panel] input,#manage-dialog [data-ui-panel] select{min-height:38px}#manage-dialog [data-ui-panel] small{font-size:11px;line-height:1.5}#manage-dialog [name=manageReason]{min-height:62px;height:62px}#manage-dialog .manage-actions{position:sticky;bottom:-24px;background:white;padding:12px 0;margin:12px 0 0;border-top:1px solid #e7ebf2}#manage-dialog>.section-heading h2{font-size:21px}
.customer-group-dialog{width:min(900px,calc(100vw - 32px))}.customer-group-dialog [data-profile-selection]{max-height:240px;overflow:auto}.customer-group-dialog [data-members],.customer-group-dialog [data-keys]{max-height:300px;overflow:auto}
@media(min-width:1500px){.customer-management[data-customer-page=accounts] .customer-filters{flex-wrap:nowrap}.customer-management[data-customer-page=accounts] .customer-filters label:not(.customer-keyword){flex-basis:125px}.customer-management[data-customer-page=accounts] .customer-filters .customer-keyword{max-width:310px}}
@media(max-width:760px){.customer-management{padding:16px}.customer-page-heading{align-items:start}.customer-filters label,.customer-filters .customer-keyword{flex:1 1 calc(50% - 10px);min-width:130px;max-width:none}.customer-filters .customer-keyword{flex-basis:100%}.customer-list-meta{align-items:start;flex-direction:column}.customer-detail-dialog{padding:16px}.customer-inline-form{align-items:stretch;flex-direction:column}.customer-inline-form label{min-width:0}.customer-chat-dialog #customer-chat>.form-grid{grid-template-columns:1fr}.customer-row-actions{max-width:180px}}
.customer-management[data-customer-page=accounts] .customer-filters{gap:8px}.customer-management[data-customer-page=accounts] .customer-filters>label{flex:0 1 128px;min-width:100px}.customer-management[data-customer-page=accounts] .customer-filters>.customer-keyword{flex:1 1 200px;min-width:170px;max-width:320px}.customer-advanced{position:relative;font-size:12px;color:#697d95}.customer-advanced summary{cursor:pointer;list-style:none;white-space:nowrap;border:1px solid #dfe5ee;border-radius:7px;min-height:36px;padding:8px 10px;box-sizing:border-box}.customer-advanced summary::after{content:' ▾'}.customer-advanced[open] summary{background:#eff3ff;color:#4d61bf}.customer-advanced>div{position:absolute;right:0;top:42px;z-index:4;background:white;box-shadow:0 8px 24px #253b5b26;border:1px solid #dfe5ee;border-radius:10px;padding:14px;width:230px;display:grid;gap:12px}.customer-advanced label{flex:none;width:100%}.customer-list-meta{justify-content:flex-start;margin:8px 0 10px}.customer-management .table-pagination{margin:-29px 0 10px;min-height:30px}.customer-management td{padding-top:10px;padding-bottom:10px}.customer-row-actions{max-width:none;flex-wrap:nowrap;min-width:0}.customer-row-actions button{flex:none;padding:5px 7px}.customer-management[data-customer-page=accounts] td:nth-child(3){min-width:175px}.customer-management[data-customer-page=accounts] td:first-child{min-width:115px}.customer-management[data-customer-page=accounts] td:nth-child(2){min-width:145px}
@media(max-width:760px){.customer-management[data-customer-page=accounts] .customer-filters>.customer-keyword{max-width:none;flex-basis:100%}.customer-management[data-customer-page=accounts] .customer-filters>label{flex:1 1 calc(33% - 8px);min-width:90px}.customer-management .table-pagination{margin:8px 0 10px}.customer-row-actions{flex-wrap:wrap}.customer-advanced>div{right:auto;left:0}}
.customer-chat-filters{display:flex;align-items:end;gap:10px}.customer-chat-filters label{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0;margin:0;font-size:12px}.customer-chat-filters select{height:38px;min-height:38px;font-size:12px}.customer-chat-filters>button{flex:none;height:38px;min-height:38px;font-size:12px;padding:7px 11px}.customer-chat-line{display:flex;align-items:center;justify-content:space-between;gap:10px}.customer-chat-line>div{display:flex;align-items:center;flex-wrap:wrap;gap:5px 10px;min-width:0}.customer-chat-line button{flex:none;font-size:11px;padding:4px 8px}.customer-chat-line strong{font-size:12px}.customer-chat-conversation{max-width:330px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.customer-chat-dialog #chat-status{font-size:12px;margin:8px 0}.customer-chat-dialog #customer-chat>.manage-actions:empty{display:none}
@media(max-width:760px){.customer-chat-filters{flex-wrap:wrap}.customer-chat-filters label{flex-basis:100%}.customer-chat-conversation{max-width:220px}}
@media(min-width:761px) and (max-width:1200px){.customer-management[data-customer-page=accounts] td:first-child{min-width:90px}.customer-management[data-customer-page=accounts] td:nth-child(2){min-width:110px}.customer-management[data-customer-page=accounts] td:nth-child(3){min-width:140px}.customer-management[data-customer-page=accounts] .customer-row-actions{display:grid;grid-template-columns:repeat(2,max-content);gap:5px}.customer-management[data-customer-page=accounts] td,.customer-management[data-customer-page=accounts] th{padding-left:8px;padding-right:8px}}
[data-customer-users-list] td{vertical-align:middle;min-width:100px}[data-customer-users-list] td:nth-last-child(2){min-width:60px}[data-customer-users-list] td small{max-width:200px}.customer-inline-link{display:block;margin-top:5px;font-size:11px;padding:3px 8px;min-height:26px}.customer-business-entry{font-size:12px;margin:0 0 14px}.customer-business-entry a{color:#5266c6}#customer-keys-card table{min-width:1000px}#customer-keys-card td{font-size:12px;vertical-align:middle;padding:12px 9px}#customer-keys-card td:first-child{min-width:145px}#customer-keys-card td small{display:block;color:#8290a2;font-size:11px;margin-top:4px;overflow-wrap:anywhere}#customer-keys-card td:nth-child(5){min-width:145px}#customer-keys-card td button{font-size:11px;padding:4px 8px}.key-secret-masked{display:block;letter-spacing:1px;color:#8492a3}#customer-keys-card .customer-filters{margin-bottom:14px}#customer-keys-card .table-wrap{margin-top:4px}.wechat-picker-dialog{max-height:92dvh}.wechat-picker-dialog .section-heading p{font-size:12px;margin-bottom:0}
#customer-keys-card td:first-child,#customer-keys-card th:first-child{position:sticky;left:0;z-index:1;background:#fff;box-shadow:3px 0 5px #20365f08}#customer-keys-card td:last-child,#customer-keys-card th:last-child{position:sticky;right:0;z-index:1;background:#fff;box-shadow:-3px 0 5px #20365f10;min-width:145px}#customer-keys-card th:first-child,#customer-keys-card th:last-child{background:#f5f9f6}.customer-detail-dialog .customer-inline-form{flex-wrap:wrap}.customer-detail-dialog .customer-inline-form label{min-width:150px;flex:1}
#business-ticket-fields{display:block}
#balance-query,#balance-baseline,#upstream-alert{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 20px;margin:16px 0}
#balance-query>label,#balance-baseline>label,#upstream-alert>label{margin:0;display:grid;gap:6px}
#balance-query>button,#balance-baseline>button,#upstream-alert>button{justify-self:start}
#balance-baseline>label:has(textarea),#upstream-alert>label:has(textarea),#upstream-alert>p{grid-column:1/-1}
@media(max-width:760px){#balance-query,#balance-baseline,#upstream-alert{grid-template-columns:1fr}}
/* Deletion is a separate, administrator-only operation. */
.archive-record-button { display: none !important; }
body.gfs-can-archive .archive-record-button { display: inline-flex !important; }
.danger { color: #b42318; border-color: #efb5ae; }
button.danger:hover:not(:disabled) { background: #fff1f0; }
.delete-dialog { max-width: 640px; }
.delete-dialog [data-blockers] { max-height: 260px; overflow: auto; }
.delete-dialog textarea { min-height: 76px; }

/* Shared catalog picker: search, fixed add action and per-option maintenance. */
.entity-picker{position:relative;min-width:0}.entity-picker-head{display:flex;gap:6px;align-items:center}.entity-picker-head>input{flex:1;min-width:0;width:0;margin:0}.entity-picker-head>.entity-add{flex:none;padding:8px 10px;white-space:nowrap;min-height:38px}.entity-options{position:absolute;z-index:15;top:44px;left:0;right:0;max-height:248px;overflow:auto;background:#fff;border:1px solid #d9e1ee;border-radius:9px;box-shadow:0 9px 24px #263b5f20;padding:5px}.entity-option{display:flex;align-items:center;gap:5px;border-bottom:1px solid #f0f3f8}.entity-option:last-child{border:0}.entity-option>[data-choose]{flex:1;min-width:0;text-align:left;border:0;background:transparent;padding:9px 8px;white-space:normal;overflow-wrap:anywhere}.entity-option>[aria-selected=true]{background:#edf2ff;color:#425dd0}.entity-option small{display:block;color:#8895a7;font-size:11px}.entity-option-actions{display:flex;flex:none;gap:2px}.entity-option-actions button{padding:6px 8px;min-height:31px;font-size:16px;border-color:transparent}.entity-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}.entity-chips:empty{display:none}.entity-chips>span{display:inline-flex;align-items:center;gap:5px;background:#edf2ff;border:1px solid #dde6ff;border-radius:6px;padding:3px 7px;font-size:12px}.entity-chips button{border:0;background:transparent;padding:0 3px;min-height:20px}.entity-picker [data-error]:empty{display:none}.entity-picker[inert]{opacity:.65}.catalog-editor .form-grid{gap:14px}.catalog-editor textarea{min-height:64px}.model-key-editor{width:min(960px,calc(100vw - 32px));max-height:94dvh;padding:24px}.model-key-editor #manage-form>.section-heading{margin-bottom:12px}.model-key-editor #manage-form>details{display:none}.model-key-editor #manage-fields .form-grid{gap:12px 20px}.model-key-editor #manage-fields label:has(textarea){grid-column:1/-1}.model-key-editor textarea{font:inherit;border:1px solid #d7e0ed;border-radius:8px;padding:9px 11px;resize:vertical;min-height:60px}.model-key-editor [name=manageReason]{min-height:42px;height:42px}.model-key-editor #manage-form>label{margin-top:16px}.model-key-editor #manage-form>.manage-actions{margin-top:12px;border-top:1px solid #e4eaf3;padding-top:12px}.model-key-editor #manage-form>p.muted:last-child{display:none}.model-key-editor #manage-fields input[type=hidden]{display:none}.model-key-editor .page-tabs{margin-bottom:15px}.model-key-editor [role=tabpanel]{padding-top:3px}.model-key-editor #manage-fields small{font-size:11px;line-height:1.5}

/* Daily Key billing: compact filters and summary leave room for the chart. */
.billing-dashboard .card {padding:14px 16px;margin-bottom:10px;}
.billing-dashboard .section-heading {margin:0 0 10px;align-items:center;}
.billing-dashboard h2,.billing-dashboard h3 {font-size:15px;margin:0;}
.billing-dashboard .section-heading p {font-size:12px;margin:5px 0 0;}
.billing-filters {gap:8px;margin:10px 0;}
.billing-filters label {font-size:11px;line-height:16px;gap:3px;flex-basis:118px;min-width:105px;}
.billing-filters input,.billing-filters select {min-height:32px;height:32px;padding:5px 8px;font-size:12px;}
.billing-filters button {min-height:32px;height:32px;padding:5px 11px;font-size:12px;}
.billing-filters label:has([name=grain]),.billing-filters label:has([name=currency]) {min-width:65px;flex-basis:68px;}
.billing-dashboard .billing-metrics {gap:8px;}
.billing-dashboard .billing-metrics>div {padding:9px 12px;}
.billing-dashboard .billing-metrics strong {font-size:18px;line-height:24px;}
.billing-dashboard .billing-metrics span {font-size:11px;margin-bottom:3px;}
.billing-dashboard .billing-coverage {margin:8px 0;padding:6px 8px;font-size:11px;line-height:16px;}
.billing-dashboard .page-tabs {margin:0 0 8px;}
.billing-dashboard .page-tabs button {padding:7px 12px;font-size:12px;}
.billing-dashboard .billing-chart {height:280px;}
.billing-dashboard [role=alert]:empty {display:none;}
.billing-dashboard td small {display:block;color:#7c899a;margin-top:3px;font-size:11px;}

.billing-dashboard>.card>.section-heading>div:first-child {display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.billing-dashboard>.card>.section-heading p {margin:0;}
.billing-dashboard>.card>.section-heading .manage-actions {margin:0;}
@media(min-width:1000px){.main-area:has([data-view="billing"]:not([hidden])) .page-header {padding-top:14px;padding-bottom:12px;}.main-area:has([data-view="billing"]:not([hidden])) .eyebrow{display:none;}.main-area:has([data-view="billing"]:not([hidden])) .content-area{padding-top:14px;}}
@media(min-width:1000px) and (max-height:800px){
  [data-view="billing"]>.page-tabs{margin-bottom:12px;padding-bottom:8px;}
  [data-view="billing"]>.page-tabs>button{padding:7px 12px;}
  .billing-dashboard .section-heading button{min-height:32px;padding:5px 10px;font-size:12px;}
  .billing-dashboard .billing-metrics>div{padding:6px 10px;}
  .billing-dashboard .billing-metrics strong{font-size:17px;line-height:22px;}
  .billing-dashboard .billing-coverage{padding:4px 8px;margin:6px 0;}
  .billing-dashboard .page-tabs{padding-bottom:6px;}
  .billing-dashboard .billing-chart{height:220px;}
  .billing-dashboard [data-period-table] details{margin:4px 0;font-size:11px;}
}

/* Calculator options are compact checkboxes, not full-width text fields. */
#transfer-calc > label:has(input[type="checkbox"]) { display:flex;align-items:center;gap:8px;margin:10px 0; }
#transfer-calc input[type="checkbox"] { width:16px!important;height:16px;min-height:0;margin:0;flex:0 0 16px; }

#pricing-forms{position:relative}.pricing-tools{position:absolute;right:0;top:0;margin:0}#pricing-forms>.page-tabs{padding-right:130px}.pricing-calculator-dialog{width:min(820px,calc(100vw - 32px));max-height:90dvh}.pricing-calculator-dialog #transfer-calc{border:0;padding:0;box-shadow:none}.pricing-calculator-dialog #transfer-calc>h2{display:none}

#transfer-channel-form > label:has(input[type="checkbox"]) {display:flex;align-items:center;gap:8px} #transfer-channel-form input[type="checkbox"] {width:16px;min-height:0;height:16px}

#manage-dialog.model-key-editor [name=manageReason]{min-height:42px;height:42px}
#manage-dialog.model-key-editor textarea{display:block;width:100%;min-width:0;max-width:100%;line-height:1.6}
#manage-dialog.model-key-editor #manage-fields .form-grid>.key-note-details{grid-column:1/-1;min-width:0;border:1px solid #e4eaf3;border-radius:9px;padding:12px 14px;background:#fafbfe}
#manage-dialog.model-key-editor .key-note-details>summary{cursor:pointer;color:#536782;font-size:12px;font-weight:600}
#manage-dialog.model-key-editor .key-note-details[open]>summary{margin-bottom:12px}
#manage-dialog.model-key-editor .key-note-details>label{display:flex;flex-direction:column;gap:8px;margin:0}
#manage-dialog.model-key-editor .key-note-details textarea{min-height:144px}
#manage-dialog.model-key-editor .key-note-details small{overflow-wrap:anywhere}
.receiving-accounts{margin-top:18px}.receiving-accounts td small{display:block;margin-top:4px}.receiving-accounts .account-number{font-variant-numeric:tabular-nums;white-space:nowrap}
.desk-bi:not([hidden]){margin:20px 0}.desk-bi .section-heading{margin-bottom:12px}.desk-bi .section-heading p{margin:3px 0 0;font-size:12px}.desk-bi .manage-actions{margin:0}
.desk-bi-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.desk-bi-metrics>div{padding:11px 14px;background:#f5f8fc;border:1px solid #e2eaf5;border-radius:9px}.desk-bi-metrics span{display:block;font-size:12px;color:#6b7896}.desk-bi-metrics strong{display:block;font-size:21px;margin-top:5px;overflow-wrap:anywhere}
.desk-bi-trend{margin-top:15px;width:100%;height:270px}.desk-bi>p.muted{font-size:12px;margin:11px 0 0}
@media(max-width:760px){.desk-bi-metrics{grid-template-columns:1fr 1fr}.desk-bi-metrics>div:first-child{grid-column:1/-1}.desk-bi .manage-actions{width:100%;justify-content:space-between}}
/* Inline company/person relationships share the parent row's pagination. */
.company-expansion > td { padding: 0 16px 16px; background: #f5f8ff; }
.company-expansion-content { padding: 16px; border: 1px solid #dce5fa; border-radius: 10px; background: #fff; }
.company-expansion-content h4 { margin: 0 0 12px; color: #244475; }
.company-expansion-content .table-wrap { margin: 0; }
button[data-company-view][aria-expanded="true"], button[data-person-companies][aria-expanded="true"] { background: #e8efff; border-color: #7898ef; }

/* Keep dialog titles and dismiss controls on one row, including narrow screens. */
dialog > .section-heading,
dialog > form > .section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 12px;
}
dialog > .section-heading > :first-child,
dialog > form > .section-heading > :first-child {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}
dialog > .section-heading h2,
dialog > form > .section-heading h2 {
  margin-top: 0;
  margin-bottom: 0;
}
dialog > .section-heading > button,
dialog > form > .section-heading > button {
  flex: none;
  align-self: flex-start;
  margin-left: auto;
  white-space: nowrap;
}

.key-detail-dialog { width: min(1040px, calc(100vw - 32px)); }
.key-detail-dialog td small { display:block; color:#74839a; margin-top:4px; }
#key-bill-context p { margin: 6px 0; }
#workbook-summary { white-space: pre-wrap; overflow-wrap: anywhere; }
.key-detail-dialog [data-billing] { margin-top:24px; }

.key-detail-dialog [data-profile] { grid-template-columns: 90px minmax(0,1fr) 90px minmax(0,1fr); }
@media (max-width:760px) { .key-detail-dialog [data-profile] { grid-template-columns: 80px minmax(0,1fr); } }

/* Choice controls need a horizontal label, independently of text-field layouts. */
label:has(> input:is([type=checkbox], [type=radio])) {
  display: flex; flex-direction: row; align-items: center; gap: 9px; cursor: pointer;
}
input:is([type=checkbox], [type=radio]) {
  width: 18px; height: 18px; min-height: 18px; min-width: 18px;
  flex: 0 0 18px; margin: 0; padding: 0; accent-color: var(--blue); cursor: pointer;
}
label:has(> input:disabled) { cursor: default; }
.choice-field > span, .staff-key-options label > span { min-width: 0; overflow-wrap: anywhere; }
.choice-field small { display: block; color: var(--muted); margin-top: 2px; font-weight: 400; }
.error-text, .success-text, .section-heading p { overflow-wrap: anywhere; }
.error-text:empty, .success-text:empty { margin: 0; min-height: 0; padding: 0; }

/* Keep editing readable on wide monitors; lists retain their available width. */
.editor-form { width: 100%; max-width: 960px; margin-inline: auto; }
.editor-form > h2 { margin-bottom: 4px; }
.editor-form > h2 + p { margin: 0 0 20px; line-height: 1.6; }
.form-section { min-width: 0; border: 0; padding: 0; margin: 0 0 18px; }
.form-section > legend { width: 100%; padding: 0 0 10px; font-size: 14px; font-weight: 600; color: #344b70; }
.form-section .form-grid { gap: 12px 20px; }
.form-section label { margin: 0; }
.form-section label small { color: var(--muted); font-size: 12px; }
.editor-actions { position: sticky; bottom: -24px; z-index: 3; margin-top: 16px; padding: 12px 0; border-top: 1px solid var(--line); background: #fff; }
.editor-actions .manage-actions { margin: 0; }
.editor-actions .error-text:not(:empty) { margin: 0 0 10px; }
.channel-status { margin-top: 14px !important; padding: 10px 12px; background: #f6f8fc; border: 1px solid #e5eaf4; border-radius: 9px; }
#transfer-channel-form .section-heading { margin-bottom: 16px; }
#transfer-channel-form .section-heading h2 { font-size: 19px; }
#transfer-channel-form .section-heading > button { flex: none; white-space: nowrap; }
#transfer-channel-form textarea { min-height: 76px; }
#transfer-channel-form .section-heading p { margin-top: 3px; }
#transfer-channel-filters { margin-bottom: 14px; }
#transfer-channel-count { align-self: center; font-size: 12px; }
#transfer-channel-feedback:not(:empty) { padding: 10px 12px; border-radius: 8px; background: #eef8f1; margin: 0 0 14px; }
.channel-list > .section-heading > .manage-actions { margin: 0; }
#bill-backup, #bill-restore, .snapshot-form { max-width: 680px; }
.snapshot-form > button { margin-bottom: 16px; }
#insight-form { max-width: 720px; }
#insight-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px 20px; }
#insight-form > label { margin: 0; }
#insight-form > .manage-actions { grid-column: 1 / -1; margin: 0; }
#balance-baseline, #upstream-alert { max-width: 960px; }
#content-area label:has(> input[type=search]):not(.customer-keyword) { max-width: 560px; }
.self-service-pagination { justify-content: flex-end; align-items: center; }
.self-service-pagination > [data-page] { margin-right: auto; color: var(--muted); font-size: 12px; }
[data-view=self-service] [data-list][aria-busy=true] { opacity: .55; pointer-events: none; }
.list-toolbar { display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: 12px 20px; margin-bottom: 18px; }
.list-toolbar > label { flex: 1 1 280px; max-width: 560px; margin: 0; }
.list-toolbar > .manage-actions { margin: 0; }
#business-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
#business-links > p { margin: 0; }
#business-links > p.muted { flex-basis: 100%; margin-top: 4px; }
#content-area { scroll-padding-bottom: 100px; }
@media (max-width:900px) {
  .editor-form { max-width: 100%; }
  .form-section .form-grid { grid-template-columns: minmax(0,1fr); gap: 12px; }
  #insight-form { grid-template-columns: minmax(0,1fr); }
  .form-section > legend { padding-bottom: 8px; }
  .editor-actions { bottom: -13px; padding: 10px 0 max(10px,env(safe-area-inset-bottom)); }
  .editor-actions .manage-actions > button { flex: 1; }
  #transfer-channel-form .section-heading { align-items: flex-start; flex-wrap: nowrap; }
  #transfer-channel-form .section-heading h2 { font-size: 18px; }
}