:root{
  --page:#F5F7FB;--card:#FFFFFF;--float:#FFFFFF;
  --line:rgba(15,23,42,.08);--line2:rgba(15,23,42,.14);
  --green:#16A34A;--amber:#D97706;--red:#DC2626;
  --text:#0F172A;--sub:#475569;--placeholder:#94A3B8;
  color-scheme:light;
}
d1-brand-mark{display:block;flex:0 0 auto;line-height:0}
d1-brand-mark svg{display:block;width:100%;height:100%;overflow:visible}
.sidebar-logo{width:39px;height:26px;margin-left:-3px}
.sidebar.collapsed .sidebar-logo{width:39px;height:26px;margin:0}
.login-prototype::before,.login-prototype::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(255,212,0,.14),transparent 68%);filter:blur(8px);pointer-events:none;animation:login-particle 8s ease-in-out infinite}
.login-prototype::before{left:13%;top:14%}.login-prototype::after{right:12%;bottom:10%;animation-delay:-4s;transform:scale(.72)}
.login-card{width:min(400px,calc(100% - 30px));padding:28px 32px 22px}
.login-theme-toggle{position:absolute;right:14px;top:14px;border-color:var(--line)}
.login-identity{display:grid;justify-items:center;text-align:center}
.login-logo{width:165px;height:110px}
.login-product{margin:-2px 0 0!important;font-size:16px!important;font-weight:600;letter-spacing:.04em}
.login-slogan{margin:22px 0 23px;text-align:center;font-size:26px;font-weight:700;letter-spacing:.18em;white-space:nowrap;color:var(--text)}
.login-slogan em{font-style:normal;color:#FFD400;text-shadow:-2px 3px 8px rgba(0,0,0,.25)}
.login-form{display:grid;gap:2px}
.login-form>label{display:grid;gap:6px;margin:8px 0;font-weight:600}
.login-form input:not([type=checkbox]){height:42px;border:1px solid var(--line2);border-radius:8px;background:#0b1019;color:#fff;padding:0 11px}
.login-submit svg{animation:none}
.login-prototype.loading .login-submit svg{animation:login-spin .85s linear infinite}
.server-health{justify-content:center;gap:14px;margin-top:19px;padding-top:14px}
.server-health span:first-child{margin-right:0}
.server-health .health-item{display:inline-flex;align-items:center;gap:5px}
.server-health .health-item i{width:7px;height:7px;margin:0;border-radius:50%}
.server-health .health-item.db i{background:var(--green)}
.server-health .health-item.tg i{background:var(--amber)}
.health-version{margin-left:auto;color:var(--placeholder);font:10px ui-monospace,monospace}
@keyframes login-spin{to{transform:rotate(360deg)}}
@keyframes login-particle{0%,100%{opacity:.45;transform:translate3d(0,0,0) scale(.85)}50%{opacity:1;transform:translate3d(22px,-14px,0) scale(1.08)}}
html[data-theme="dark"]{
  --page:#0B0F17;--card:#10151F;--float:#151C2A;
  --line:rgba(255,255,255,.06);--line2:rgba(255,255,255,.11);
  --green:#22D3AA;--amber:#F5A524;--red:#F0483E;
  --text:#E8ECF4;--sub:#9AA3B5;--placeholder:#5A6478;
  color-scheme:dark;
}
html[data-theme="light"] body,html[data-theme="light"] .main-wrap{background:#F5F7FB;color:#0F172A}
html[data-theme="light"] .sidebar,html[data-theme="light"] .card,html[data-theme="light"] .glow-card,
html[data-theme="light"] .topbar,html[data-theme="light"] .drawer,html[data-theme="light"] .command-palette,
html[data-theme="light"] .assistant-panel,html[data-theme="light"] .tour-card,html[data-theme="light"] .toast{background:#FFF;color:#0F172A}
html[data-theme="light"] .topbar{background:rgba(255,255,255,.9)}
html[data-theme="light"] .nav-item:hover{background:#F1F5F9;color:#0F172A}
html[data-theme="light"] .nav-item.active{background:linear-gradient(90deg,rgba(61,123,255,.14),rgba(61,123,255,.035));color:#0F172A}
html[data-theme="light"] .global-search,html[data-theme="light"] .search-input,html[data-theme="light"] .filter-select,
html[data-theme="light"] .date-input,html[data-theme="light"] .field input,html[data-theme="light"] .field select,
html[data-theme="light"] .field textarea,html[data-theme="light"] .tag-editor,html[data-theme="light"] .assistant-panel form input,
html[data-theme="light"] .reply-box textarea{background:#FFF;color:#0F172A}
html[data-theme="light"] .quick-btn,html[data-theme="light"] .preview-box,html[data-theme="light"] .segment,
html[data-theme="light"] .directory-item,html[data-theme="light"] .template-downloads{background:#F8FAFC;color:#475569}
html[data-theme="light"] .data-table th,html[data-theme="light"] .data-table th:first-child{background:#F8FAFC;color:#64748B}
html[data-theme="light"] .data-table td:first-child{background:#FFF}
html[data-theme="light"] .data-table tr:hover td,html[data-theme="light"] .data-table tr:hover td:first-child{background:#F6F9FF}
html[data-theme="light"] .phone-preview{background:linear-gradient(#EFF4FA,#E7EEF7);border-color:#CBD5E1}
html[data-theme="light"] .phone-preview::before{background:#94A3B8}
html[data-theme="light"] .tg-message,html[data-theme="light"] .message-bubble{background:#F1F5F9;color:#475569}
html[data-theme="light"] .message-bubble.agent{background:#E8F0FF;color:#1E3A8A}
html[data-theme="light"] .chat-bubble{background:#F1F5F9;color:#475569}
html[data-theme="light"] .chat-bubble.user{background:#E8F0FF;color:#1E3A8A}
html[data-theme="light"] .progress,html[data-theme="light"] .switch{background:#E2E8F0}
html[data-theme="light"] .batch-bar{background:#EEF4FF}
html[data-theme="light"] .skeleton-page{background:linear-gradient(100deg,#FFF 20%,#EEF2F7 40%,#FFF 60%);background-size:200% 100%}
html[data-theme="light"] .login-prototype{background:radial-gradient(circle at 50% 16%,rgba(61,123,255,.14),transparent 34%),#F5F7FB}
html[data-theme="light"] .login-grid{background-image:linear-gradient(rgba(61,123,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(61,123,255,.07) 1px,transparent 1px)}
html[data-theme="light"] .login-card{background:rgba(255,255,255,.78);border-color:rgba(15,23,42,.1);box-shadow:0 30px 90px rgba(15,23,42,.16)}
html[data-theme="light"] .login-card input:not([type=checkbox]){background:#FFF;color:#0F172A;border-color:rgba(15,23,42,.14)}
html[data-theme="light"] .login-card .ghost-btn{color:#475569}
html[data-theme="light"] .drawer-backdrop,html[data-theme="light"] .palette-backdrop{background:rgba(15,23,42,.22)}
html[data-theme="light"] .status-pill{background:#F1F5F9;color:#475569}
html[data-theme="light"] .status-pill.success{background:#ECFDF3;color:#15803D}
html[data-theme="light"] .status-pill.warning{background:#FFF7ED;color:#C2410C}
html[data-theme="light"] .status-pill.danger{background:#FEF2F2;color:#B91C1C}
html[data-theme="light"] .status-pill.info{background:#EFF6FF;color:#2563EB}
html[data-theme="light"] .help-strip{background:#FFF;color:#475569}
html[data-theme="light"] .empty-state{color:#94A3B8}
html[data-theme="light"] .offline-banner{background:#FEF2F2;color:#B91C1C;border-color:#FECACA}
html[data-theme="light"] .bot-state{background:#FFF}
html[data-theme="light"] .ghost-btn{background:#FFF;color:#475569}
html[data-theme="light"] .ghost-btn:hover{background:#F8FAFC;color:#0F172A}
.nav-item{height:auto;min-height:47px}
.nav-copy{display:grid;text-align:left;line-height:1.25;min-width:0}
.nav-copy>b{font-size:13px;font-weight:600}
.nav-copy>small{font-size:11px;color:var(--placeholder);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:145px}
.sidebar.collapsed .nav-copy{display:none}
.theme-toggle{border-color:var(--line)}
.theme-toggle svg{color:#D97706}
html[data-theme="dark"] .theme-toggle svg{color:#93C5FD}
.login-error{min-height:20px;margin:2px 0 5px;color:var(--red);font-size:12px}
.server-health{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:16px;padding-top:13px;border-top:1px solid var(--line);font-size:11px;color:var(--sub)}
.server-health span:first-child{margin-right:auto}.server-health i{display:inline-block;width:7px;height:7px;margin-right:5px;border-radius:50%;background:var(--amber)}
.server-health.ok i{background:var(--green)}
.ticket-filter-card{cursor:pointer;transition:.16s}
.ticket-filter-card.active{border-color:rgba(61,123,255,.5);box-shadow:0 0 0 2px rgba(61,123,255,.1)}
.ticket-list{max-height:720px}
.ticket-list-head{position:sticky;top:0;z-index:3;background:var(--card)}
.ticket-row{position:relative;padding:12px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:20px 32px minmax(150px,1fr) auto;gap:8px 10px;cursor:pointer}
.ticket-row:hover,.ticket-row.active{background:rgba(61,123,255,.055)}
.ticket-row.overdue{border-left:3px solid var(--amber);padding-left:9px}
.ticket-main{display:grid}.ticket-main small{color:var(--sub)}
.ticket-meta{grid-column:3/5;display:grid;grid-template-columns:1fr auto;gap:5px;color:var(--sub);font-size:11px}
.ticket-owner{color:var(--text)}
.ticket-row-actions{grid-column:3/5;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.status-segment{display:inline-flex;max-width:100%;border:1px solid var(--line2);border-radius:7px;overflow:hidden;background:var(--card)}
.status-segment button{height:28px;padding:0 7px;border:0;border-right:1px solid var(--line);background:transparent;color:var(--placeholder);font-size:10px;cursor:pointer;white-space:nowrap}
.status-segment button:last-child{border-right:0}.status-segment button.active{background:rgba(61,123,255,.13);color:#3D7BFF}
.ticket-take{min-width:58px}
.ticket-batch{display:flex!important;margin:0 0 12px}
.conversation .card-head.ticket-conversation-head{position:sticky;top:0;z-index:2;min-height:76px;background:var(--card);flex-wrap:wrap}
.conversation-ticket-title{display:grid}.conversation-ticket-title small{color:var(--sub)}
.conversation-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:100%}
.current-account-chip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:14px;background:rgba(61,123,255,.1);color:#3D7BFF;font-weight:600}
.account-role-select{min-width:108px;height:30px;border:1px solid var(--line2);border-radius:7px;background:var(--card);color:var(--text)}
.account-actions{display:flex;gap:5px}.account-actions button{white-space:nowrap}
.read-only-note{padding:8px 10px;border-radius:7px;background:rgba(217,119,6,.08);color:var(--amber);font-size:11px}
@media(max-width:900px){
  .nav-item{min-height:51px}.nav-copy>small{max-width:155px}
  .ticket-row{grid-template-columns:20px 30px 1fr}.ticket-row>.status-pill{grid-column:3}.ticket-meta,.ticket-row-actions{grid-column:2/4}
  .status-segment{overflow-x:auto}.status-segment button{padding:0 6px}
  .conversation-controls{align-items:flex-start}.template-downloads{overflow-x:auto;flex-wrap:nowrap}
}

/* 全消息按钮系统 */
.template-button-table .data-table{min-width:1180px}
.template-copy{max-width:315px;white-space:pre-wrap;overflow:hidden;text-overflow:ellipsis}
.row-actions.always{opacity:1;display:flex;gap:4px}
.preview-gallery{margin-top:14px}
.preview-gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:14px}
.preview-gallery-grid>article{padding:12px;border:1px solid var(--line);border-radius:9px;background:color-mix(in srgb,var(--card) 92%,var(--blue) 8%)}
.preview-gallery-grid h4{margin:0 0 9px;font-size:12px}
.tg-inline-preview{border:1px solid var(--line2);border-radius:11px;background:#132033;padding:10px;color:#E8ECF4;box-shadow:inset 0 1px rgba(255,255,255,.04)}
.tg-preview-head{display:flex;align-items:center;gap:6px;margin-bottom:7px;color:#8DB1FF;font-size:10px}.tg-preview-head small{margin-left:auto;color:#8290A7}
.tg-preview-message{padding:9px 10px;border-radius:9px 9px 9px 3px;background:#1B2A3D;color:#E5EDF8;font-size:11px;min-height:46px}
.tg-inline-keyboard{display:grid;grid-template-columns:repeat(var(--tg-cols),minmax(0,1fr));gap:4px;margin-top:5px}
.tg-inline-keyboard button{min-height:31px;padding:4px 6px;border:1px solid rgba(75,139,255,.27);border-radius:6px;background:#1C3352;color:#8FBAFF;font-size:10px;cursor:pointer}
.tg-inline-keyboard button:hover{background:#25466F;color:#FFF}
.tg-inline-keyboard button.style-default{background:#223347;color:#FFF}.tg-inline-keyboard button.style-primary{background:#2B6CB0;color:#FFF}.tg-inline-keyboard button.style-success{background:#16A34A;color:#FFF}.tg-inline-keyboard button.style-danger{background:#DC2626;color:#FFF}
.callback-result{min-height:0;margin-top:0;padding:0;border-radius:6px;color:#A9F0D8;font-size:10px;transition:.16s}
.callback-result:not(:empty){min-height:34px;margin-top:6px;padding:7px;background:rgba(34,211,170,.09);border:1px solid rgba(34,211,170,.18)}
html[data-theme="light"] .preview-gallery-grid>article{background:#F8FAFC}
html[data-theme="light"] .tg-inline-preview{background:#E8EEF6;color:#0F172A}
html[data-theme="light"] .tg-preview-message{background:#FFF;color:#334155}
html[data-theme="light"] .tg-inline-keyboard button{background:#DCE9FF;color:#1D4ED8;border-color:#B7D0FF}
html[data-theme="light"] .tg-inline-keyboard button.style-default{background:#223347;color:#FFF}html[data-theme="light"] .tg-inline-keyboard button.style-primary{background:#2B6CB0;color:#FFF}html[data-theme="light"] .tg-inline-keyboard button.style-success{background:#16A34A;color:#FFF}html[data-theme="light"] .tg-inline-keyboard button.style-danger{background:#DC2626;color:#FFF}
html[data-theme="light"] .callback-result:not(:empty){background:#ECFDF5;color:#166534}
.button-audit-card{margin-top:14px}
.audit-list{display:grid}.audit-list>div{display:grid;grid-template-columns:150px 130px 160px 150px minmax(260px,1fr);gap:10px;align-items:center;min-height:42px;padding:0 14px;border-bottom:1px solid var(--line)}
.audit-list code{color:var(--blue)}.audit-list small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--placeholder)}
.message-button-editor{display:grid;gap:13px;padding-top:4px}
.button-editor-title{display:flex;align-items:flex-start;gap:10px}.button-editor-title h3{margin:3px 0}.button-editor-title p{margin:0;color:var(--sub);font-size:11px}
.layout-controls{display:flex;align-items:center;gap:8px;padding:10px;border:1px solid var(--line);border-radius:8px;background:color-mix(in srgb,var(--card) 95%,var(--blue) 5%)}
.layout-controls label{display:flex;align-items:center;gap:5px}.layout-controls select{height:30px;border:1px solid var(--line2);border-radius:6px;background:var(--card);color:var(--text)}
.button-card-list{display:grid;gap:9px}
.button-config-card{border:1px solid var(--line);border-radius:9px;background:var(--card);overflow:hidden}
.button-config-card.dragging{opacity:.48;border-color:var(--blue)}
.button-config-head{height:38px;padding:0 9px;display:flex;align-items:center;gap:7px;border-bottom:1px solid var(--line)}
.drag-handle{color:var(--placeholder);cursor:grab}.drag-handle svg{width:15px}
.button-field-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:10px}
.button-field-grid>label{display:grid;gap:5px;color:var(--sub);font-size:11px}
.button-field-grid input,.button-field-grid select{min-width:0;height:34px;border:1px solid var(--line2);border-radius:7px;background:var(--card);color:var(--text);padding:0 8px}
.button-field-grid .wide{grid-column:1/-1}.field-placeholder{height:34px;display:flex;align-items:center;padding:0 8px;border:1px dashed var(--line2);border-radius:7px;color:var(--placeholder)}
.button-field-grid fieldset{border:1px solid var(--line);border-radius:7px;padding:5px 9px}.button-field-grid legend{color:var(--sub);font-size:11px}.role-check{display:inline-flex;align-items:center;gap:4px;margin-right:13px;color:var(--text)}.role-check input{height:auto;accent-color:var(--blue)}
.editor-preview-head{display:flex;align-items:center}.editor-preview-head .mini-tabs{margin-left:auto}
.editor-preview{padding:10px;border:1px solid var(--line);border-radius:9px;background:color-mix(in srgb,var(--card) 96%,var(--blue) 4%)}
.empty-state.compact{padding:22px}
.preview-note{padding:10px;color:var(--sub);font-size:11px}
@media(max-width:1050px){.preview-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.preview-gallery-grid{grid-template-columns:1fr}.button-field-grid{grid-template-columns:1fr}.button-field-grid .wide{grid-column:1}.audit-list>div{grid-template-columns:1fr;gap:3px;padding:9px 12px}.layout-controls{flex-wrap:wrap}}