/* YSnow CRM: arctic workspace, navy navigation, Feishu blue actions. */
:root{--blue:#3370ff;--blue-hover:#245bdb;--blue-soft:#edf3ff;--ink:#21324b;--muted:#607087;--quiet:#66768b;--line:#e5eaf2;--paper:#f5f7fb;--white:#fff;--green:#27833d;--amber:#a66d0d;--sidebar-width:224px;--navy:#162b49;--font:"PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.6 var(--font);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.48}
a{text-decoration:none;color:inherit}
button,a{transition:background-color .15s,color .15s,border-color .15s}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
[hidden]{display:none!important}
.icon{width:18px;height:18px;display:block;flex-shrink:0}
.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar-width);background:var(--navy);border-right:1px solid #203754;padding:28px 16px 20px;display:flex;flex-direction:column}
.brand{display:flex;align-items:center;gap:12px;padding:0 10px 28px;font-size:18px;font-weight:600;letter-spacing:.3px;color:#fff}
.brand small{display:block;margin-top:2px;font-size:10px;font-weight:500;letter-spacing:.4px;color:#92a6bf}
.brand-mark{width:38px;height:40px;display:grid;place-items:center;background:#3370ff;color:var(--white);border:1px solid #6492ff;border-radius:11px;box-shadow:0 4px 12px #07182a30}
.brand-mark svg{width:32px;height:32px}
.nav-group-label{font-size:11px;color:#91a4bd;padding:22px 13px 8px}
.nav-item{width:100%;display:flex;align-items:center;gap:11px;text-align:left;border:0;background:transparent;border-radius:8px;padding:11px 13px;margin:4px 0;color:#b9c8dc;font-size:13px;min-height:43px}
.nav-item:hover{background:#213b5b;color:#fff}
.nav-item.active{background:#3370ff;color:#fff;font-weight:600;box-shadow:0 4px 12px #07182a24}
.nav-item.active .nav-icon{color:#fff}
.nav-icon{color:#8fa7c5;display:flex}
.sidebar-bottom{margin-top:auto;border-top:1px solid #2a3f5d;padding:20px 8px 0;display:flex;align-items:center;gap:10px;color:#d6dfeb;font-size:12px}
.avatar{width:30px;height:30px;border-radius:50%;background:#2b4363;color:#c6d5e9;display:grid;place-items:center}
.avatar .icon{width:16px;height:16px}
.local-dot,.connection i{width:6px;height:6px;background:#34b764;border-radius:50%;display:inline-block;flex-shrink:0}
.local-dot{margin-left:auto}
.shell{margin-left:var(--sidebar-width)}
.topbar{height:58px;background:var(--white);border-bottom:1px solid var(--line);padding:0 36px;display:flex;align-items:center;justify-content:space-between;font-size:12px}
.crumb{color:var(--quiet)}
.top-actions{display:flex;gap:24px;align-items:center}
.connection{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px}
.connection.error i{background:#df5b50}
.top-actions a{color:var(--muted);display:flex;align-items:center;gap:6px}
.top-actions a:hover{color:var(--blue)}
.top-actions a .icon{width:13px;height:13px}
main{max-width:1680px;padding:30px 36px 40px;margin:0 auto;outline:none}
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}
h1{margin:0;font-size:24px;line-height:1.5;font-weight:600;letter-spacing:-.5px}
.primary,.secondary{border-radius:7px;min-height:38px;padding:8px 16px;font-size:13px;line-height:20px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap}
.primary{border:1px solid var(--blue);background:var(--blue);color:var(--white);box-shadow:0 2px 4px #3370ff1c,inset 0 1px 0 #ffffff1c}
.primary:hover{background:var(--blue-hover);border-color:var(--blue-hover)}
.primary .icon{width:16px;height:16px}
.secondary{border:1px solid #dfe1e5;background:var(--white);color:var(--ink)}
.secondary:hover{background:#f5f7fa;border-color:#b9c0cb}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));min-height:84px;padding:0;background:transparent;margin:0 0 22px}
.metric{font:inherit;display:flex;flex-direction:column;align-items:flex-start;text-align:left;background:transparent;border:0;padding:10px 22px;min-width:0;border-radius:5px;color:var(--ink)}
.metric:first-child{padding-left:0}
.metric+.metric{border-left:1px solid #e1e4e9;border-radius:0}
button.metric:hover{background:#eef2f9}
.metric-top{display:block;font-size:12px;line-height:20px;color:var(--muted)}
.metric-value{display:block;font-size:26px;line-height:32px;font-weight:600;letter-spacing:-.3px;margin-top:4px;font-variant-numeric:tabular-nums}
.metric-unit{font-size:12px;font-weight:400;color:var(--quiet);letter-spacing:0;margin-left:7px}
.metric.amber .metric-value{color:var(--amber)}
.metric.green .metric-value{color:var(--green)}
.metric.blue .metric-value{color:var(--blue)}
.panel{background:var(--white);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 3px 14px #19375704}
.panel-heading{min-height:62px;height:auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.tabs{display:flex;min-height:62px;gap:8px;align-items:center;overflow-x:auto;scrollbar-width:thin}
.tab{position:relative;display:flex;align-items:center;gap:7px;background:transparent;border:0;padding:7px 12px;border-radius:6px;font-size:13px;white-space:nowrap;color:var(--muted)}
.tab.active{font-weight:600;color:var(--blue);background:var(--blue-soft)}
.tab:hover:not(.active){background:#f6f8fb;color:var(--ink)}
.tab:after{content:"";position:absolute;bottom:0;left:2px;right:2px;height:2px;background:transparent;border-radius:2px}
.tab.active:after{background:transparent}
.tab em{font-style:normal;font-weight:500;font-size:11px;line-height:19px;min-width:20px;text-align:center;border-radius:4px;padding:0 5px;background:#f2f3f5;color:var(--quiet);font-variant-numeric:tabular-nums}
.tab.active em{background:#dce7ff;color:#245bdb}
.sync-actions{display:flex;align-items:center;gap:9px;color:var(--quiet);font-size:11px;font-variant-numeric:tabular-nums}
.icon-button{display:grid;place-items:center;border:0;background:transparent;border-radius:5px;width:30px;height:30px;color:var(--muted)}
.icon-button:hover{background:#f2f3f5;color:var(--blue)}
.icon-button .icon{width:16px;height:16px}
.toolbar{padding:20px 24px;display:flex;align-items:center;gap:10px}
.search{display:flex;align-items:center;gap:8px;border:1px solid #e1e7ef;border-radius:7px;height:38px;padding:0 12px;width:330px;color:var(--quiet);background:var(--white)}
.search:focus-within{border-color:var(--blue);box-shadow:0 0 0 2px #3370ff12}
.search .icon{width:15px;height:15px}
.search input{border:0;outline:0;flex:1;width:0;font-size:13px;color:var(--ink);background:transparent}
.search input:focus-visible{outline:0}
.search input::placeholder{color:var(--quiet)}
.toolbar select{height:38px;max-width:180px;border:1px solid #e1e7ef;border-radius:7px;background:var(--white);padding:0 30px 0 11px;color:var(--muted);font-size:12px}
.result-count{margin-left:auto;color:var(--quiet);font-size:12px;white-space:nowrap;font-variant-numeric:tabular-nums}
.table-scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%;text-align:left;white-space:nowrap;font-variant-numeric:tabular-nums}
thead{background:#f8fafd;color:var(--muted);font-size:12px}
th{font-weight:500;padding:13px 18px;border-top:1px solid #eef0f3;border-bottom:1px solid #eef0f3}
th:first-child,td:first-child{padding-left:24px}
th:last-child,td:last-child{padding-right:24px}
td{padding:18px 18px;color:var(--muted);font-size:13px;border-bottom:1px solid #eff0f2}
td:first-child{font-size:12px;color:var(--quiet)}
td small{display:block;color:var(--quiet);font-size:12px;margin-top:4px}
td strong{font-weight:500;color:var(--ink)}
tbody tr:hover{background:#f8faff}
.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 7px;border-radius:4px;font-size:12px;line-height:18px;color:#94600b;background:#fff5df}
.pill:before{content:"";width:4px;height:4px;border-radius:50%;background:currentColor}
.pill.green{color:#27833d;background:#edf8ef}
.pill.blue{color:#3366cc;background:#edf2ff}
.pill.gray{color:#747a84;background:#f0f2f4}
.action-link{border:0;background:transparent;color:var(--blue);font-size:12px;padding:7px 4px}
.action-link:hover{color:var(--blue-hover);text-decoration:underline;text-underline-offset:3px}
.action-link+.action-link{margin-left:8px}
.empty-state{min-height:380px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 22px 48px}
.empty-icon{position:relative;width:64px;height:64px;display:grid;place-items:center;color:#6688ba;margin-bottom:18px}
.empty-icon:before{content:"";position:absolute;inset:0;border-radius:17px;background:#f0f5fd;border:1px solid #e1e9f7}
.empty-icon .icon{position:relative;width:30px;height:30px;stroke-width:1.25}
.empty-state h3{font-size:14px;font-weight:500;color:var(--muted);margin:0 0 20px}
.empty-state .secondary{font-size:12px;min-height:32px;padding:5px 13px;color:var(--blue);border-color:#d9e3ff;background:#fff}
.empty-state .secondary:hover{background:var(--blue-soft)}
.global-error{margin-bottom:20px;border:1px solid #f6d2c7;background:#fff3ef;color:#a84b32;font-size:13px;border-radius:6px;padding:12px 16px;line-height:1.7}
dialog{position:fixed;inset:0 0 0 auto;margin:0;padding:0;border:0;width:600px;max-width:100vw;height:100dvh;max-height:100dvh;background:var(--white);color:var(--ink);box-shadow:-8px 0 32px #1f232914}
dialog::backdrop{background:#14294559}
dialog[open]{animation:drawer-open .18s ease-out}
dialog form{display:flex;flex-direction:column;height:100%}
.drawer-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:26px 30px;border-bottom:1px solid var(--line)}
.drawer-header h2{margin:0;font-size:20px;line-height:28px;font-weight:600}
.close-button{width:30px;height:30px;display:grid;place-items:center;border:0;background:transparent;border-radius:5px;color:var(--quiet)}
.close-button:hover{background:#f2f3f5;color:var(--ink)}
.drawer-body{flex:1;padding:28px 30px 32px;overflow-y:auto;overscroll-behavior:contain}
.drawer-footer{display:flex;justify-content:flex-end;gap:10px;padding:18px 30px;border-top:1px solid var(--line);background:#fbfcfe}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 18px}
.form-field{display:flex;flex-direction:column;gap:8px;min-width:0;color:var(--muted);font-size:13px}
.form-field.wide{grid-column:1/-1}
.form-field label span{color:#d3493d;margin-left:3px}
.form-field input,.form-field select,.form-field textarea{width:100%;min-height:40px;border:1px solid #dce3ed;border-radius:7px;background:var(--white);color:var(--ink);font-size:13px;padding:8px 10px;min-width:0;outline:0;transition:border-color .15s,box-shadow .15s}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--blue);box-shadow:0 0 0 2px #3370ff15}
.form-field textarea{resize:vertical;min-height:76px}
.form-section{display:flex;align-items:center;gap:14px;color:var(--ink);font-size:14px;font-weight:600;margin:30px 0 18px}
.form-section:after{content:"";height:1px;background:#edf0f3;flex:1}
.form-section:first-child{margin-top:0}
.form-hint{font-size:13px;color:var(--quiet);background:#f7f8fa;border-radius:5px;padding:12px;margin:18px 0}
.source-card{padding:15px 17px;border:1px solid #dce5fa;border-left:3px solid var(--blue);border-radius:5px;background:#f8faff;margin-bottom:24px}
.source-card small{font-size:12px;color:var(--quiet);font-variant-numeric:tabular-nums}
.source-card h3{font-size:16px;line-height:24px;margin:6px 0 4px;font-weight:600}
.source-card p{font-size:12px;color:var(--muted);line-height:1.8;margin:0}
.check-row{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--muted);margin-top:24px;line-height:24px}
.check-row input{margin-top:5px;accent-color:var(--blue)}
.form-error{padding:12px 14px;margin:0 28px 16px;background:#fff3ef;border-radius:5px;color:#a84b32;font-size:13px;line-height:1.7}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px 18px;margin:0;font-size:13px}
.detail-grid dt{color:var(--quiet);font-size:12px;margin-bottom:5px}
.detail-grid dd{margin:0;overflow-wrap:anywhere;color:var(--ink);line-height:1.7}
.detail-grid .wide{grid-column:1/-1}
.attachment-section{margin-top:28px;border-top:1px solid var(--line);padding-top:20px}
.attachment-section p{font-size:12px;line-height:1.8;color:var(--quiet)}
.attachment-section p a{color:var(--blue)}
.attachment-section input{max-width:100%;font-size:12px;margin-bottom:12px}
.attachment-name{padding:10px 12px;background:#f5f7fa;border-radius:5px;color:var(--muted);font-size:12px;margin:6px 0}
.toast{position:fixed;left:calc(50% + var(--sidebar-width)/2);bottom:28px;transform:translateX(-50%);padding:12px 18px;max-width:min(560px,85vw);font-size:13px;color:var(--white);background:#303744;border-radius:6px;box-shadow:0 4px 18px #1f23291f;z-index:20;line-height:1.7}
@keyframes drawer-open{from{transform:translateX(20px);opacity:.5}to{transform:translateX(0);opacity:1}}
@media(min-width:1500px){main{padding:30px 36px 40px}.topbar{padding:0 40px}.empty-state{min-height:370px}}
@media(max-width:1100px){:root{--sidebar-width:200px}.sidebar{padding:24px 12px 18px}.brand{gap:8px;font-size:17px;padding-left:4px}.brand-mark{width:34px;height:36px}.brand-mark svg{width:29px;height:29px}.brand small{font-size:8px}main{padding:26px 24px}.topbar{padding:0 24px}.metric{padding:0 20px}.metric-top{font-size:11px}.sync-actions>span{display:none}}
@media(max-width:760px){.sidebar{position:static;width:100%;padding:12px 16px;flex-direction:row;align-items:center;gap:10px;border-right:0;border-bottom:1px solid var(--line)}.brand{font-size:16px;padding:0;gap:8px}.brand small{display:none}.brand-mark{width:30px;height:32px;border-radius:8px}.brand-mark svg{width:26px;height:26px}.nav-group-label,.sidebar-bottom{display:none}.sidebar nav{display:flex;margin-left:auto;gap:3px}.nav-item{padding:8px 9px;min-height:36px;font-size:12px;margin:0;gap:6px}.nav-icon .icon{width:16px;height:16px}.shell{margin-left:0}.topbar{height:46px;padding:0 18px;font-size:11px}.top-actions{gap:14px}.connection{font-size:10px}.top-actions a{font-size:11px}.connection i{width:5px;height:5px}main{padding:22px 16px 30px}.page-heading{margin-bottom:18px;gap:12px}h1{font-size:22px}.primary{min-height:34px;font-size:12px;padding:6px 12px}.metrics{grid-template-columns:1fr 1fr;padding:0;margin-bottom:18px;min-height:186px}.metric{padding:15px 18px}.metric+.metric{border:0}.metric:nth-child(even){border-left:1px solid #eceef0}.metric:nth-child(n+3){border-top:1px solid #eceef0}.metric-top{font-size:11px}.metric-value{font-size:26px;line-height:32px;margin-top:3px}.panel-heading{min-height:52px;padding:0 16px;gap:10px}.tab{font-size:13px}.tabs{gap:17px;flex:1;min-width:0}.toolbar{padding:14px 16px;flex-wrap:wrap;gap:10px}.search{width:100%;height:36px}.toolbar select{height:32px;font-size:12px}.result-count{font-size:11px}.empty-state{min-height:280px;padding:32px 16px}.empty-icon{width:56px;height:56px}.empty-state h3{font-size:13px}th{font-size:11px;padding:10px 15px}td{font-size:12px;padding:14px 15px}.drawer-header{padding:20px}.drawer-body{padding:22px 20px}.drawer-footer{padding:14px 20px}.form-grid{gap:18px 12px}.form-field{font-size:12px}.form-error{margin:0 20px 12px}.toast{left:50%;max-width:90vw;width:max-content}.detail-grid{gap:18px 12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* CRM controls */
.skip-link{position:fixed;left:16px;top:12px;transform:translateY(-180%);background:var(--blue);color:#fff;padding:9px 14px;border-radius:5px;z-index:100}
.skip-link:focus{transform:translateY(0)}
.crumb-slash{margin:0 9px;color:#c0c5cd}
button,a,input,select,textarea{touch-action:manipulation}
h1,h2,h3{text-wrap:balance;scroll-margin-top:20px}
.sync-actions{flex-shrink:0}
td{max-width:310px;overflow:hidden;text-overflow:ellipsis}
tbody tr{content-visibility:auto;contain-intrinsic-size:auto 74px}
.pagination{display:flex;align-items:center;justify-content:space-between;padding:13px 22px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.pagination>div{display:flex;align-items:center;gap:15px}
.page-button{font-size:12px;background:#fff;border:1px solid var(--line);border-radius:5px;padding:5px 9px;color:var(--muted)}
.page-button:hover:not(:disabled){color:var(--blue);border-color:#9eb9ff;background:#f8faff}
@media(max-width:760px){.metrics{background:transparent;border:0;min-height:160px;margin-bottom:16px}.metric,.metric:first-child{padding:12px 15px}.metric-top{font-size:11px}.metric:nth-child(even){border-color:#e1e4e9}.sidebar{padding:12px}.brand{font-size:14px;gap:6px}.nav-icon{display:none}.nav-item{font-size:11px;padding:8px}.panel-heading{align-items:stretch}.sync-actions{padding-left:5px}.pagination{padding:12px 16px}.page-button{font-size:11px}.topbar .crumb{display:none}.result-count{font-size:11px}.tabs{scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}}
@media(max-width:390px){.brand-mark{display:none}.sidebar{gap:5px}.sidebar nav{gap:0}.nav-item{padding:7px}.brand{font-size:13px}}

/* Employee sign-in */
.login-page{min-height:100dvh;display:grid;place-items:center;background:#f5f6f7;padding:24px}
.login-card{width:min(100%,400px);background:#fff;border:1px solid #e4e7ed;border-radius:12px;padding:40px;box-shadow:0 8px 32px #1f232908}
.login-brand{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:600;color:#1f2329;margin-bottom:36px}
.login-brand .brand-mark{width:36px;height:36px}
.login-card h1{font-size:24px;letter-spacing:-.4px;margin:0 0 12px}
.login-card p{color:#646a73;font-size:14px;margin:0 0 28px}
.login-button{display:flex;align-items:center;justify-content:center;gap:20px;text-decoration:none;min-height:44px;width:100%}
.login-error{font-size:13px;line-height:1.6;color:#c53030;margin-bottom:20px;overflow-wrap:anywhere}
.login-error:empty{display:none}
.sidebar-bottom #employee-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.logout-button{border:0;background:transparent;color:#a6b8ce;font:inherit;font-size:12px;padding:6px;cursor:pointer;white-space:nowrap}
.logout-button:hover{color:#fff;background:#294463;border-radius:4px}
@media(max-width:480px){.login-card{padding:28px}}

/* API monitor: the same compact workspace, with emphasis on request volume. */
.monitor-controls,.monitor-ranges{display:flex;align-items:center;gap:10px}
.monitor-ranges{gap:2px;padding:3px;border:1px solid var(--line);border-radius:6px;background:#fff}
.monitor-ranges button{border:0;background:transparent;color:var(--muted);font-size:12px;border-radius:4px;padding:6px 12px;min-height:30px;white-space:nowrap}
.monitor-ranges button[aria-pressed="true"]{color:var(--blue);background:var(--blue-soft);font-weight:600}
.monitor-ranges button:hover{color:var(--blue)}
.monitor-controls .secondary .icon{width:15px;height:15px}
.monitor-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr);gap:18px;margin-bottom:20px;align-items:stretch}
.monitor-page h2{font-size:14px;font-weight:600;line-height:22px;margin:0}
.monitor-subtle{color:var(--quiet);font-size:11px;font-variant-numeric:tabular-nums}
.monitor-chart{padding:24px 18px 14px;position:relative;min-height:205px;display:flex;flex-direction:column;justify-content:center}
.monitor-chart svg{display:block;width:100%;min-height:180px;overflow:visible}
.chart-grid{stroke:#eef0f3;stroke-width:1}
.chart-label{fill:#646a73;font-size:12px;font-family:var(--font);font-variant-numeric:tabular-nums}
.chart-success{fill:#3370ff}
.chart-failed{fill:#d34545}
.chart-no-calls{text-align:center;font-size:12px;color:var(--quiet);margin:0}
.monitor-legend{display:flex;align-items:center;gap:16px;color:var(--muted);font-size:11px}
.monitor-legend span{display:flex;align-items:center;gap:6px}
.monitor-legend span:before{content:"";width:7px;height:7px;border-radius:2px;background:var(--blue)}
.monitor-legend .legend-failed:before{background:#d34545}
.monitor-endpoints td{padding:10px 18px;font-size:12px}
.monitor-endpoints td:first-child{padding-left:22px}
.monitor-endpoints th{border-top:0}
.monitor-endpoints small{font-size:11px;margin-top:2px}
.monitor-endpoints td:not(:first-child),.monitor-endpoints th:not(:first-child){text-align:right}
.monitor-endpoints tbody tr:last-child td{border-bottom:0}
.monitor-endpoints{table-layout:fixed}
.monitor-endpoints th:first-child{width:65%}
.monitor-red,.metric.monitor-red .metric-value{color:#bf3737}
.monitor-failed{color:#bf3737;background:#fff0ef}
.monitor-filter{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);white-space:nowrap}
.monitor-toolbar{gap:24px;flex-wrap:wrap}
.monitor-toolbar select{width:132px}
.monitor-logs td{padding-top:13px;padding-bottom:13px}
.monitor-logs td:first-child{color:var(--muted);white-space:nowrap}
.monitor-logs td:last-child,.monitor-logs th:last-child{text-align:right}
.monitor-endpoint{font-size:11px;white-space:normal;overflow-wrap:anywhere}
.monitor-empty{text-align:center;color:var(--quiet);padding:40px 20px!important;font-size:13px}
.monitor-footnote{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;color:var(--quiet);font-size:11px;margin-top:15px}
@media(max-width:1100px){.monitor-grid{grid-template-columns:minmax(0,1fr)}.monitor-chart svg{max-height:215px}.monitor-endpoints th:first-child{width:65%}}
@media(max-width:760px){.monitor-heading{align-items:flex-start;flex-wrap:wrap;gap:14px}.monitor-controls{gap:8px}.monitor-ranges button{padding:5px 9px}.monitor-toolbar{gap:12px;padding:14px 16px}.monitor-filter{gap:5px;font-size:11px}.monitor-toolbar select{width:108px}.monitor-footnote{line-height:1.7}.monitor-grid{gap:16px}.monitor-logs{min-width:660px}.monitor-endpoints{min-width:0}.monitor-subtle{font-size:10px}}
.monitor-trend{display:flex;flex-direction:column}
.monitor-trend .monitor-chart{flex:1}

/* Natural-month quota accounting. */
.monitor-month-label{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted)}
.monitor-month-label select{background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:6px;height:36px;padding:0 30px 0 12px;font-size:13px}
.quota-panel{padding:18px 22px;margin:0 0 20px}
.quota-heading,.quota-details{display:flex;align-items:center;justify-content:space-between;gap:14px}
.quota-heading strong{font-size:13px;font-weight:500;margin-right:20px}
#quota-percent{font-size:14px;font-weight:600;color:var(--blue);font-variant-numeric:tabular-nums}
#quota-progress{display:block;appearance:none;-webkit-appearance:none;border:0;border-radius:5px;overflow:hidden;background:#edf0f5;width:100%;height:8px;margin:14px 0 12px}
#quota-progress::-webkit-progress-bar{background:#edf0f5}
#quota-progress::-webkit-progress-value{background:var(--blue);border-radius:5px}
#quota-progress::-moz-progress-bar{background:var(--blue);border-radius:5px}
#quota-progress.quota-high::-webkit-progress-value{background:#bf3737}
#quota-progress.quota-high::-moz-progress-bar{background:#bf3737}
.quota-details{font-size:11px;color:var(--muted);flex-wrap:wrap}
#quota-uncertain,.billing-unknown{color:var(--amber)}
.billing-counted{color:var(--blue)}
.billing-free{color:var(--muted)}
.chart-free{fill:#c6ceda}.chart-unknown{fill:#d8a03d}
.monitor-legend .legend-free:before{background:#c6ceda}.monitor-legend .legend-unknown:before{background:#d8a03d}
@media(max-width:760px){.quota-heading>div{display:flex;flex-direction:column;gap:5px}.quota-panel{padding:16px}.monitor-month-label{gap:5px}.monitor-month-label select{max-width:180px;font-size:12px}.monitor-logs{min-width:760px}.monitor-legend{gap:10px;font-size:10px}}

/* Employee access management */
.directory-status{margin:16px 20px 0;padding:12px 16px;background:#fff8eb;border:1px solid #f5ddb1;border-radius:6px;color:#805500;font-size:13px;line-height:1.7}
.employees-page .panel-heading h2{font-size:15px;margin:0}.employees-page table{min-width:830px}.employee-person{display:flex;gap:12px;align-items:center}.employee-initial{display:grid;place-items:center;width:34px;height:34px;background:#edf2ff;color:#3370ff;border-radius:50%;font-weight:600}.employee-person small{color:#86909c}.employee-menus{display:flex;flex-wrap:wrap;gap:5px;max-width:280px}.employee-menu{background:#f2f3f5;color:#646a73;padding:3px 7px;border-radius:4px;font-size:12px}.permission-labels{display:grid;grid-template-columns:130px 1fr;font-size:12px;color:#86909c;border-bottom:1px solid #e8ebef;padding:24px 0 12px}.permission-group{display:grid;grid-template-columns:130px 1fr;gap:10px;border-bottom:1px solid #eff0f1;padding:20px 0}.permission-menu{font-weight:600}.permission-checks{display:flex;flex-wrap:wrap;gap:16px 20px}.permission-group label{display:flex;align-items:center;gap:7px;cursor:pointer;font-size:13px}.permission-group input,.access-toggle input{accent-color:#3370ff;width:16px;height:16px;margin:0;flex-shrink:0}.permission-group input:disabled{cursor:not-allowed}.access-toggle{display:flex;align-items:center;justify-content:space-between;padding:16px;background:#f7f9fc;border-radius:8px}.access-toggle small{display:block;color:#86909c;font-size:12px;margin-top:6px}.access-toggle input{width:20px;height:20px}.permission-note{font-size:12px;color:#86909c;line-height:1.8;margin-top:20px}#permission-person{margin:8px 0 0}#permission-drawer{width:min(620px,100vw)}#permission-drawer .drawer-body{padding-top:24px}.employees-page .metric-value{margin-top:8px}.employees-page .metric-top{font-size:13px}.employees-page .page-heading h1{margin:0}.employee-protected{font-size:11px;color:#3370ff;background:#edf2ff;padding:2px 6px;border-radius:3px;margin-left:7px}[hidden]{display:none!important}
@media(max-width:650px){.permission-labels,.permission-group{grid-template-columns:105px 1fr}.permission-checks{gap:14px}.employees-page .page-heading{gap:12px}.employees-page .page-heading button{font-size:12px}}

/* Reference direction: periwinkle accents, pale blue canvas and soft white surfaces. */
:root{--blue:#637dff;--blue-hover:#4d65e4;--blue-soft:#eef1ff;--ink:#344164;--muted:#65728d;--quiet:#6d7993;--line:#edf0fa;--paper:#eaf1ff;--navy:#eaf1ff;--sidebar-width:208px}
body{background:var(--paper)}
.sidebar{inset:0 auto 0 0;padding:26px 14px 14px;border:0;border-radius:0;background:var(--paper)}
.brand{color:#526ce7;gap:9px;padding:0 9px 25px;font-size:17px;letter-spacing:.2px}.brand small{color:#6c7fe0;letter-spacing:.5px;font-size:10px}.brand-mark{width:34px;height:38px;border:0;background:transparent;color:var(--blue);box-shadow:none;border-radius:0}.brand-mark svg{width:34px;height:34px}
.sidebar nav{margin:0;flex:1;background:#fff;border-radius:16px 16px 0 0;padding:8px 7px 12px}.nav-group-label{font-size:10px;color:#7884a1;padding:17px 11px 7px}.nav-item{position:relative;color:#65728d;border-radius:7px;gap:10px;font-size:13px;padding:11px;margin:4px 0;min-height:43px}.nav-item:hover{background:#f5f6ff;color:#526ce7}.nav-icon{color:#6d83ff}.nav-item .nav-icon{width:18px}.nav-item.active{background:#eef1ff;color:#526ce7;box-shadow:none;font-weight:600}.nav-item.active:after{content:"";position:absolute;right:-7px;top:7px;bottom:7px;width:3px;background:var(--blue);border-radius:3px}.nav-item.active .nav-icon{color:#637dff}
.sidebar-bottom{margin-top:0;border:0;border-radius:0 0 16px 16px;padding:18px 12px;background:#fff;color:#65728d;gap:8px}.sidebar-bottom .avatar{background:#edf1ff;color:#6f82df;border:1px solid #e6ebff}.sidebar-bottom #employee-name{font-weight:500}.logout-button{color:#6d7993}.logout-button:hover{color:#526ce7;background:#f0f3ff}
.shell{margin:0 0 0 var(--sidebar-width);min-height:100dvh;background:var(--paper);border-radius:0;overflow:hidden}
.topbar{height:70px;padding:0 32px;border:0;border-radius:0 20px 16px 16px;background:#fff;box-shadow:0 2px 0 #758bd205}
.crumb{font-size:12px;color:#6e7c98}#breadcrumb{font-weight:500;color:#5369c1}.crumb-slash{color:#c5cce7;margin:0 12px}
.connection{border:0;border-radius:20px;padding:5px 11px;background:#f4f6ff;font-size:11px;color:#687799}.connection i{width:5px;height:5px;background:#55ac96}
main{padding:28px 32px 38px}.page-heading{margin-bottom:23px}h1{font-size:24px;font-weight:600;letter-spacing:-.4px;color:#536ee5}
.primary,.secondary{border-radius:9px;min-height:38px}.primary{background:var(--blue);border-color:var(--blue);box-shadow:0 5px 12px #637dff25,inset 0 1px 0 #ffffff20}.primary:hover{background:var(--blue-hover);border-color:var(--blue-hover);box-shadow:0 6px 14px #637dff30}.secondary{border-color:#e7ebf8;color:#65739b;background:#fff}.secondary:hover{background:#f5f7ff;border-color:#cdd6ff}
.panel{border:1px solid #ffffffb3;border-radius:17px;box-shadow:0 9px 26px #6275b516;background:#fff}.panel-heading{min-height:62px;padding:0 24px;border-bottom:1px solid #f0f2fa}.panel-heading h2{color:#566dd0}.tabs{min-height:62px;align-items:center;gap:8px}.tab{padding:7px 12px;border-radius:8px;color:#697693}.tab:hover:not(.active){background:#f5f7ff;color:#526ce7}.tab.active{color:#526ce7;background:#eef1ff}.tab:after{display:none}.tab em{background:#f1f3fa;color:#6c7995;border-radius:5px}.panel .tabs .tab em{font-size:10px;line-height:18px;min-width:19px;padding:0 5px}.tab.active em{background:#dfe6ff;color:#526ce7}
.sync-actions{color:#74809b}.sync-actions .icon-button{width:29px;height:29px;border-radius:8px;background:#f5f7ff;color:#6b80df;border:0}.sync-actions .icon-button:hover{background:#e9eeff;color:#526ce7}
.toolbar{padding:18px 24px;gap:12px}.toolbar .search{height:38px;background:#f4f6ff;border:1px solid #f0f2fc;border-radius:9px;width:330px}.toolbar .search:focus-within{background:#fff;border-color:#8a9dff;box-shadow:0 0 0 3px #637dff12}.search .icon{color:#8494c0}.search input{font-size:12px}.search input::placeholder{color:#7885a3}.toolbar select{height:38px;border:1px solid #edf0fb;border-radius:9px;background:#f8f9ff;color:#657496}.result-count{color:#74809b;font-size:12px}
thead{background:#f7f9ff}th{color:#69789b;letter-spacing:.1px;font-size:12px;padding:13px 18px;border-color:#f0f2fa}td{padding:18px;color:#66748f;border-bottom-color:#f0f2f9}td strong{color:#38496e}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:#f2f5ff}.action-link{font-size:12px;font-weight:500;color:#5e77ed}.action-link:hover{color:#4c61d0}.pill{border-radius:6px;padding:3px 8px;font-size:11px}.pill.blue{background:#edf1ff;color:#586fd7}.pill.gray{background:#f2f4f9;color:#697891}.pill.green{background:#edf8f3;color:#35806a}
.empty-state{min-height:360px}.empty-icon{color:#8296ee;margin-bottom:18px}.empty-icon:before{background:#f1f4ff;border:1px solid #e9eeff;border-radius:20px}.empty-state h3{font-weight:400;color:#71809e;font-size:14px;margin-bottom:20px}.empty-state .secondary{color:#6178dc;border-color:#e2e8ff;border-radius:9px;background:#fff;min-height:34px}.empty-state .secondary:hover{background:#f3f6ff}
.metrics{gap:16px;margin-bottom:24px;padding:0;min-height:104px}.metric,.metric:first-child{background:#fff;border:1px solid #ffffffb3;border-radius:13px;box-shadow:0 7px 20px #6275b50e;padding:17px 20px;gap:4px}.metric+.metric{border-left:1px solid #ffffffb3;border-radius:13px}.metric-top,.employees-page .metric-top{font-size:12px;color:#6c7d9a}.metric-value{font-size:27px;color:#5d77ee;line-height:34px;margin-top:2px}.metric-unit{font-size:11px;color:#7a88a6}.metric.blue{background:var(--blue);border-color:var(--blue);box-shadow:0 8px 20px #637dff25}.metric.blue .metric-top,.metric.blue .metric-value,.metric.blue .metric-unit{color:#fff}button.metric:hover{background:#f7f9ff}button.metric.blue:hover{background:var(--blue-hover)}
dialog{width:600px;box-shadow:-10px 0 44px #5267a41e;border-radius:18px 0 0 18px}dialog::backdrop{background:#63769b3d}.drawer-header{padding:24px 30px;border-bottom-color:#f0f2fa}.drawer-header h2{font-size:20px;color:#526ad8}.close-button{width:30px;height:30px;border:0;border-radius:9px;color:#8490ae;background:#f5f7ff}.close-button:hover{color:#526ce7;background:#eaf0ff}.drawer-body{padding:27px 30px 32px}.drawer-footer{padding:18px 30px;background:#fbfcff;border-top-color:#eef1fa}.form-section{color:#576caa;font-size:13px}.form-section:after{background:#edf1fb}.form-field label{color:#6d7a96}.form-field input,.form-field select,.form-field textarea{background:#f8faff;border:1px solid #e9edf9;border-radius:9px;min-height:40px;color:#344669}.form-field input:hover,.form-field select:hover,.form-field textarea:hover{border-color:#c3cdf6}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{background:#fff;border-color:var(--blue);box-shadow:0 0 0 3px #637dff12}.source-card{border-color:#e0e7ff;border-left-color:var(--blue);background:#f7f9ff;border-radius:10px}
.employee-initial{width:35px;height:35px;background:#eef2ff;color:#7388eb;border-radius:50%;border:1px solid #e8edff}.employee-person strong{font-weight:500}.employee-menu{background:#f1f4ff;color:#6376bb;border-radius:5px}.employee-protected{background:#edf1ff;color:#6078df}.employees-page .panel-heading h2{font-size:14px}.permission-labels{padding-top:26px;border-bottom-color:#edf1fa}.permission-group{padding:21px 0;border-bottom-color:#edf1fa}.permission-checks label{color:#627196}.access-toggle{background:#f4f7ff;border:1px solid #e8edff;border-radius:12px}.permission-group input,.access-toggle input{accent-color:var(--blue)}
.monitor-month-label select{border-radius:9px;border-color:#e6ebfb;color:#63749a}.chart-success{fill:var(--blue)}.chart-free{fill:#cdd6f3}.chart-unknown{fill:#f3a9ce}.monitor-legend .legend-free:before{background:#cdd6f3}.monitor-legend .legend-unknown:before{background:#f3a9ce}.chart-label{fill:#687c9e}.chart-grid{stroke:#edf1fb}.quota-panel{border-radius:15px}.monitor-page h2{color:#566dd0}#quota-progress{height:7px;background:#edf1ff}#quota-progress::-webkit-progress-bar{background:#edf1ff}#quota-progress::-webkit-progress-value{background:var(--blue)}#quota-progress::-moz-progress-bar{background:var(--blue)}.monitor-footnote{color:#6d7d9b}
.login-page{background:#eaf1ff}.login-card{border-color:#fff;border-radius:20px;padding:42px;box-shadow:0 15px 50px #6275b51a}.login-brand{color:#526ce7}.login-brand .brand-mark{box-shadow:none}.login-card h1{color:#536ee5}
@media(min-width:1500px){main{padding:32px 40px 40px}.topbar{padding:0 40px}}
@media(max-width:1100px) and (min-width:761px){:root{--sidebar-width:190px}.sidebar{padding:24px 10px 12px}.brand{font-size:16px;padding-left:6px;gap:7px}.brand-mark{width:30px}.nav-item{padding:10px;gap:8px}main{padding:27px 24px}.topbar{padding:0 24px}.metrics{gap:12px}.metric,.metric:first-child{padding:16px}.search{width:290px}}
@media(max-width:760px){body{background:#eaf1ff}.sidebar{position:static;inset:auto;width:auto;display:block;padding:18px 16px 12px;border-radius:0;background:#fff}.brand{width:max-content;color:#526ce7;padding:0 0 13px;font-size:16px}.brand-mark{width:29px;height:30px;background:transparent;box-shadow:none}.brand-mark svg{width:29px;height:29px}.sidebar nav{display:flex;flex:none;overflow-x:auto;background:transparent;border-radius:0;padding:0;margin:0 -3px;gap:3px;scrollbar-width:none}.sidebar nav::-webkit-scrollbar{display:none}.nav-item{flex:0 0 auto;width:auto;margin:0;min-height:36px;padding:7px 11px;font-size:12px;white-space:nowrap;border-radius:8px;color:#65728d}.nav-item.active{background:#edf1ff;color:#526ce7;box-shadow:none}.nav-item.active:after{display:none}.nav-group-label,.sidebar-bottom,.nav-icon{display:none}.shell{margin:0;min-height:calc(100dvh - 110px);border-radius:0;overflow:visible}.topbar{height:44px;padding:0 18px;border-radius:0;background:#fff;box-shadow:none;border-top:1px solid #f1f3fb}.connection{font-size:10px;padding:3px 8px}main{padding:24px 16px 30px}h1{font-size:22px}.page-heading{margin-bottom:19px}.panel{border-radius:14px;box-shadow:0 7px 20px #6275b510}.panel-heading{min-height:57px;padding:0 15px}.tabs{min-height:57px;gap:2px}.tab{padding:7px 8px;font-size:12px}.toolbar{padding:15px;gap:10px}.toolbar .search{width:100%;height:38px}.toolbar select{height:34px}.empty-state{min-height:300px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-height:0;margin-bottom:20px}.metric,.metric:first-child{padding:14px 16px;min-height:94px}.metric+.metric,.metric:nth-child(even),.metric:nth-child(n+3){border:1px solid #ffffffb3;border-radius:12px}.metric-value{font-size:25px}.metric-top,.employees-page .metric-top{font-size:11px}dialog{border-radius:14px 0 0 14px}.drawer-header{padding:22px 20px}.drawer-body{padding:24px 20px}.drawer-footer{padding:16px 20px}.drawer-header h2{font-size:19px}.form-field input,.form-field select,.form-field textarea{font-size:16px}.monitor-controls{flex-wrap:wrap}.monitor-legend{gap:8px}.permission-labels,.permission-group{grid-template-columns:100px 1fr}.permission-checks{gap:12px 14px}.employee-initial{width:32px;height:32px}.login-card{padding:30px}.login-brand .brand-mark{display:grid}}

/* Venue picker: themed listbox with native-equivalent keyboard selection. */
.panel:has(.venue-select){overflow:visible}.panel:has(.venue-select) .table-scroll{border-radius:0}.venue-select{position:relative;flex:0 0 auto;width:158px}.venue-trigger{display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;min-height:38px;border:1px solid #e8ecfa;border-radius:9px;background:#f8f9ff;padding:8px 12px;color:#657496;font-size:12px;text-align:left;box-shadow:0 1px 2px #6678b504}.venue-trigger>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.venue-trigger>svg{width:14px;height:14px;flex-shrink:0;color:#7b8bb8;transition:transform .15s}.venue-trigger:hover{background:#f2f5ff;border-color:#d3dcff}.venue-trigger[aria-expanded="true"]{background:#fff;border-color:#8b9eff;box-shadow:0 0 0 3px #637dff12}.venue-trigger[aria-expanded="true"]>svg{transform:rotate(180deg)}.venue-trigger:focus-visible{outline:2px solid #8296ff;outline-offset:2px}.venue-options{position:absolute;top:calc(100% + 7px);left:0;z-index:40;min-width:100%;width:max-content;max-width:min(280px,calc(100vw - 40px));max-height:320px;overflow-y:auto;overscroll-behavior:contain;background:#fff;border:1px solid #e8edfb;border-radius:12px;padding:6px;box-shadow:0 12px 32px #5b6ba324,0 2px 6px #5b6ba30a;scrollbar-width:thin;scrollbar-color:#d8dff7 transparent}.venue-option{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:35px;padding:8px 10px;border-radius:7px;font-size:12px;line-height:19px;color:#657496;white-space:nowrap;cursor:pointer;user-select:none}.venue-option>svg{width:14px;height:14px;flex-shrink:0;visibility:hidden;color:#637dff}.venue-option:hover,.venue-option.keyboard-active{background:#f3f5ff;color:#536de3}.venue-option[aria-selected="true"]{background:#edf1ff;color:#536de3;font-weight:500}.venue-option[aria-selected="true"]>svg{visibility:visible}.venue-option+ .venue-option{margin-top:2px}@media(max-width:760px){.venue-select{width:158px}.venue-trigger{min-height:36px}.venue-options{max-height:260px}}

/* Flat, borderless table headers. */
thead,thead tr,thead th{border:0;border-radius:0}

/* Reference text hierarchy: neutral content, quiet labels, selective blue accents. */
:root{--ink:#303541;--muted:#687182;--quiet:#798295}
h1,.drawer-header h2,.login-card h1{color:#303541}
.panel-heading h2,.monitor-page h2,.form-section{color:#454c5b}
#breadcrumb{color:#555e6d}.crumb,.connection,.sync-actions,.result-count,.monitor-subtle,.monitor-footnote{color:#798295}
.nav-item:not(.active){color:#687182}.sidebar-bottom{color:#626b7b}
thead,th{color:#7b8495;font-weight:400}
td{color:#424854}td:first-child{color:#778092}td strong,.employee-person strong{color:#303541;font-weight:500}td small{color:#7d8696}
.form-field label,.detail-grid dt,.permission-labels,.permission-note{color:#778091}
.form-field input,.form-field select,.form-field textarea,.detail-grid dd,.source-card h3,.permission-menu,.access-toggle strong{color:#303541}
.permission-checks label,.toolbar select,.venue-trigger,.venue-option{color:#687182}
.venue-option[aria-selected="true"],.venue-option.keyboard-active,.venue-option:hover{color:#536de3}
.metric-top,.employees-page .metric-top{color:#7b8495}.metric.blue .metric-top,.metric.blue .metric-value,.metric.blue .metric-unit{color:#fff}
body:has(.nav-item.active[data-page="sales"]) #table-body td:nth-child(4){color:#637dff;font-weight:500}
.empty-state h3{color:#7d8696}.search input{color:#303541}.search input::placeholder{color:#858d9d}

/* Blue headings and white-on-blue selected navigation. */
h1,.drawer-header h2,.login-card h1,.panel-heading h2,.monitor-page h2{color:#536ee5}
.nav-item:not(.active){color:#252a34}.nav-item:not(.active):hover{color:#252a34;background:#f2f5ff}
.nav-item.active{background:#637dff;color:#fff;box-shadow:0 4px 12px #637dff20}
.nav-item.active .nav-icon{color:#fff}
.tab.active{background:#637dff;color:#fff}.tab.active em{background:#ffffff26;color:#fff}
@media(max-width:760px){.nav-item.active{background:#637dff;color:#fff}}
/* A single full-width target for desktop drops and the native mobile photo picker. */
.wechat-screenshot .wechat-dropzone{height:96px;min-height:96px;width:100%;box-sizing:border-box;margin:0;border:1px dashed #bdc9ec;border-radius:10px;background:#f7f9ff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s;overflow:hidden}
.wechat-screenshot .wechat-dropzone:hover,.wechat-screenshot .wechat-dropzone.drag-over{background:#edf1ff;border-color:#637dff}
.wechat-screenshot .wechat-dropzone:focus-visible{outline:2px solid #637dff;outline-offset:3px}
.wechat-screenshot .wechat-upload-icon{display:flex;color:#536ee5;pointer-events:none}
.wechat-upload-icon[hidden]{display:none}
.wechat-upload-icon .icon{width:25px;height:25px}
.wechat-image-preview{display:flex;width:100%;height:100%;align-items:center;justify-content:center;padding:7px;box-sizing:border-box;pointer-events:none}
.wechat-image-preview[hidden]{display:none}
.wechat-image-preview img{max-width:100%;max-height:100%;object-fit:contain;border-radius:5px}
.wechat-ocr-result{display:flex;align-items:center;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:#68748a;line-height:1.6}

.form-field label .field-note{color:#8790a2;font-size:11px;font-weight:400;margin-left:5px}

@media(max-width:760px){.form-field label{font-size:14px;line-height:1.5}.form-field label .field-note{font-size:12px}}

/* One select treatment across sales, delivery and administration. */
.ui-select{position:relative;display:inline-block;min-width:0;vertical-align:middle;max-width:100%}
.ui-select-native{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;border:0!important;opacity:0;pointer-events:none;overflow:hidden;clip-path:inset(50%)}
.ui-select-trigger,.venue-trigger{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:40px;padding:9px 12px;border:1px solid #e3e8f3;border-radius:9px;background:#f8faff;color:#303541;font:400 13px/20px var(--font);text-align:left;box-shadow:none}
.ui-select-trigger:hover,.venue-trigger:hover{border-color:#bac7ee;background:#f5f7ff}
.ui-select-trigger[aria-expanded="true"],.venue-trigger[aria-expanded="true"]{border-color:#7086ed;background:#fff;box-shadow:0 0 0 3px #536ee512}
.ui-select-trigger:focus-visible,.venue-trigger:focus-visible{outline:2px solid #7086ed;outline-offset:2px}
.ui-select-value{display:block;min-width:0;min-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-select-trigger>svg,.venue-trigger>svg{width:16px;height:16px;flex:none;color:#7e89a3;transition:transform .15s}
.ui-select-trigger[aria-expanded="true"]>svg,.venue-trigger[aria-expanded="true"]>svg{transform:rotate(180deg);color:#536ee5}
.form-field>.ui-select{display:block;width:100%}
.toolbar>.ui-select{min-width:140px}.monitor-filter>.ui-select{min-width:126px}.monitor-month-label>.ui-select{min-width:162px}
.toolbar .ui-select-trigger,.monitor-month-label .ui-select-trigger,.venue-trigger{min-height:38px;font-size:12px;padding:8px 12px}
.ui-select-menu,.venue-options{z-index:1000;background:#fff;border:1px solid #e5eaf5;border-radius:10px;padding:5px;box-shadow:0 10px 28px #3b4b7524,0 2px 6px #3b4b7508;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d6def1 transparent}
.ui-select-menu{position:fixed;margin:0}
.ui-select-option,.venue-option{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:36px;padding:8px 10px;border-radius:6px;color:#303541;font:400 13px/20px var(--font);cursor:pointer;user-select:none;white-space:normal;overflow-wrap:anywhere}
.ui-select-option>span,.venue-option>span{min-width:0;flex:1}.ui-select-option>svg,.venue-option>svg{width:15px;height:15px;flex:none;visibility:hidden;color:#536ee5}
.ui-select-option+.ui-select-option,.venue-option+.venue-option{margin-top:2px}
.ui-select-option:hover,.ui-select-option.keyboard-active,.venue-option:hover,.venue-option.keyboard-active{background:#f2f5ff;color:#536ee5}
.ui-select-option[aria-selected="true"],.venue-option[aria-selected="true"]{background:#edf1ff;color:#536ee5;font-weight:500}
.ui-select-option[aria-selected="true"]>svg,.venue-option[aria-selected="true"]>svg{visibility:visible}
.ui-select-option[aria-disabled="true"]{opacity:.4;cursor:not-allowed;background:transparent;color:#687182}
.ui-select-trigger[aria-invalid="true"]{border-color:#d94b55}.ui-select-error{display:block;color:#c43c49;font-size:12px;line-height:18px;margin-top:5px}
@media(max-width:760px){.ui-select-trigger{min-height:44px;font-size:16px;padding:11px 12px}.ui-select-option,.venue-option{min-height:44px;font-size:14px;padding:11px 12px}.toolbar .ui-select-trigger,.monitor-month-label .ui-select-trigger,.venue-trigger{min-height:40px;font-size:13px}.monitor-controls{gap:10px}.monitor-month-label{flex-wrap:wrap}.monitor-toolbar{flex-wrap:wrap}.monitor-filter{flex-wrap:wrap;gap:6px}.ui-select-menu{border-radius:10px}}
@media(prefers-reduced-motion:reduce){.ui-select-trigger>svg,.venue-trigger>svg{transition:none}}

/* Client origin is visible at the start of registration, with no preselection. */
.customer-source{border:0;padding:0;margin:0;min-inline-size:0}
.customer-source legend{padding:0;margin-bottom:9px;color:#6d7a96;font:400 13px/20px var(--font)}
.customer-source legend>span{color:#d3493d}
.source-options{display:flex;gap:12px;flex-wrap:wrap}
.form-field .source-option{display:flex;align-items:center;gap:9px;min-width:120px;min-height:42px;margin:0;padding:10px 16px;border:1px solid #e3e8f3;border-radius:9px;background:#f8faff;cursor:pointer}
.form-field .source-option>span{margin:0;color:#303541;font-size:13px;line-height:20px}
.form-field .source-option>input{appearance:auto;width:16px;height:16px;min-height:0;flex:none;padding:0;margin:0;accent-color:#536ee5;box-shadow:none}
.source-option:hover{border-color:#bac7ee;background:#f2f5ff}
.source-option:has(input:checked){border-color:#7086ed;background:#edf1ff}
.form-field .source-option:has(input:checked)>span{color:#536ee5;font-weight:500}
.source-option:has(input:focus-visible){outline:2px solid #7086ed;outline-offset:2px}
@media(max-width:760px){.customer-source legend{font-size:14px;line-height:21px}.form-field .source-option{min-height:44px;flex:1;justify-content:center}.form-field .source-option>span{font-size:14px}}
.action-link.danger-link{color:#c34650}.action-link.danger-link:hover{color:#a52d38;background:#fff1f2}.void-confirm-message{margin:22px 0 0;color:#4b5262;font-size:14px;line-height:1.8}

/* A compact confirmation keeps the decision and its record in one view. */
dialog:has(.void-confirm-message){inset:0;margin:auto;width:440px;max-width:calc(100vw - 32px);height:fit-content;max-height:calc(100dvh - 40px);border-radius:16px;box-shadow:0 20px 64px #26385a30}
dialog:has(.void-confirm-message) form{height:auto}
dialog:has(.void-confirm-message) .drawer-body{max-height:55dvh}
dialog:has(.void-confirm-message) .primary{background:#c34650;border-color:#c34650}
dialog:has(.void-confirm-message) .primary:hover{background:#ac3540;border-color:#ac3540}

/* Calendar and time controls share the select component's quiet blue treatment. */
.dt-control{position:relative;display:block;min-width:0;width:100%}
.form-field .dt-native{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;border:0!important;opacity:0;pointer-events:none;clip-path:inset(50%)}
.dt-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:40px;padding:9px 12px;border:1px solid #e3e8f3;border-radius:9px;background:#f8faff;color:#303541;font:400 13px/20px var(--font);text-align:left}
.dt-trigger:hover{background:#f5f7ff;border-color:#bac7ee}.dt-trigger[aria-expanded="true"]{background:#fff;border-color:#7086ed;box-shadow:0 0 0 3px #536ee512}.dt-trigger:focus-visible{outline:2px solid #7086ed;outline-offset:2px}.dt-value{min-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}.dt-trigger>svg{width:18px;height:18px;flex:none;stroke:#7e89a3;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.dt-trigger[aria-expanded="true"]>svg{stroke:#536ee5}
.dt-panel{position:fixed;z-index:1010;overflow-y:auto;overscroll-behavior:contain;border:1px solid #e5eaf5;border-radius:12px;padding:0;background:#fff;box-shadow:0 12px 32px #3b4b7524,0 2px 6px #3b4b7508;color:#303541;font:400 13px/1.5 var(--font)}
.dt-content{display:grid;grid-template-columns:minmax(0,1fr) 118px;padding:14px;gap:14px}.dt-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;height:30px}.dt-header button{border:0;background:transparent;color:#536ee5;border-radius:6px;height:30px}.dt-heading{font-weight:600;font-size:14px;padding:0 10px}.dt-nav{width:30px;font:24px/1 var(--font)}.dt-header button:hover{background:#f0f3ff}
.dt-week,.dt-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}.dt-week{margin-bottom:5px;color:#8a94a6;font-size:12px;text-align:center;line-height:26px}.dt-day{display:grid;place-items:center;border:0;min-width:0;min-height:34px;padding:0;border-radius:7px;background:transparent;color:#303541;font:400 13px/1 var(--font);font-variant-numeric:tabular-nums}.dt-day.adjacent-month{color:#aeb6c5}.dt-day[aria-current="date"]{box-shadow:inset 0 0 0 1px #ccd6fa;color:#536ee5}.dt-day:hover{background:#f0f3ff;color:#536ee5}.dt-day[aria-pressed="true"]{background:#536ee5;color:white;box-shadow:0 3px 8px #536ee528;font-weight:600}
.dt-months{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-height:247px;align-content:start}.dt-months button{min-height:42px;background:transparent;color:#4b5262;border:0;border-radius:7px}.dt-months button:hover,.dt-months button[aria-pressed="true"]{background:#edf1ff;color:#536ee5}
.dt-time-area{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;border-left:1px solid #edf0f7;padding-left:12px}.dt-time-caption{height:31px;text-align:center;color:#8a94a6;font-size:12px;line-height:30px;margin-bottom:9px}.dt-time-list{height:247px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d9e0f0 transparent;border-radius:7px;outline-offset:1px}.dt-time-option{display:flex;align-items:center;justify-content:center;min-height:36px;border-radius:6px;font-size:13px;cursor:pointer;font-variant-numeric:tabular-nums;user-select:none}.dt-time-option:hover,.dt-time-option.keyboard-active{background:#f0f3ff;color:#536ee5}.dt-time-option[aria-selected="true"]{background:#edf1ff;color:#536ee5;font-weight:600}
.dt-footer{display:flex;align-items:center;gap:6px;border-top:1px solid #edf0f7;padding:10px 12px}.dt-footer button{min-height:32px;border-radius:6px;padding:5px 10px;font:400 12px/20px var(--font)}.dt-text-button{border:0;background:transparent;color:#687182}.dt-text-button:hover{background:#f0f3ff;color:#536ee5}.dt-actions{margin-left:auto;display:flex;gap:8px}.dt-cancel{border:1px solid #e3e8f3;background:#fff;color:#687182}.dt-confirm{border:1px solid #536ee5;background:#536ee5;color:#fff}.dt-confirm:hover{background:#455ed1}.dt-confirm:disabled{opacity:.4;cursor:not-allowed}.dt-trigger[aria-invalid="true"]{border-color:#d94b55}.dt-error{display:block;color:#c43c49;font-size:12px;line-height:18px;margin-top:5px}
@media(max-width:760px){.dt-trigger{min-height:44px;font-size:16px;padding:11px 12px}.dt-content{grid-template-columns:minmax(0,1fr);gap:12px;padding:14px}.dt-day{min-height:38px;font-size:14px}.dt-header{margin-bottom:9px}.dt-time-area{border-left:0;border-top:1px solid #edf0f7;padding:8px 0 0;gap:12px}.dt-time-caption{height:24px;line-height:24px;margin-bottom:4px}.dt-time-list{height:100px;background:#f8faff}.dt-time-option{min-height:36px;font-size:14px}.dt-footer button{min-height:40px;font-size:13px}.dt-months{min-height:260px}.dt-months button{min-height:48px}}