:root { color-scheme: dark; --bg:#09120f; --side:#0b1713; --surface:#101d18; --surface2:#13241d; --line:rgba(157,201,174,.12); --text:#edf4ee; --muted:#899b90; --soft:#afc0b4; --green:#75d9a8; --mint:#9be7c0; --amber:#e2c17d; --blue:#8bb9d0; --purple:#b7a0df; font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif; }
* { box-sizing:border-box; } html { min-width:320px; min-height:100%; background:var(--bg); scroll-behavior:smooth; } body { margin:0; color:var(--text); background:radial-gradient(ellipse at 76% -22%,#17352a 0,transparent 43%),var(--bg); font-size:14px; line-height:1.45; -webkit-font-smoothing:antialiased; } button,input,select,textarea { font:inherit; } button { color:inherit; } button:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible { outline:2px solid #92e0b7; outline-offset:3px; }
.admin-layout { min-height:100vh; }.sidebar { position:fixed; inset:0 auto 0 0; z-index:5; display:flex; flex-direction:column; width:248px; padding:26px 17px 17px; background:linear-gradient(180deg,#0c1914,#0a1511); border-right:1px solid var(--line); }.admin-brand { display:flex; align-items:center; gap:11px; margin:0 7px 39px; color:var(--text); text-decoration:none; font-size:16px; font-weight:730; letter-spacing:-.04em; }.brand-symbol { width:31px; height:31px; display:grid; place-items:center; border:1px solid rgba(117,217,168,.38); border-radius:10px; color:#bcf3d1; background:linear-gradient(145deg,rgba(117,217,168,.22),rgba(117,217,168,.04)); font-size:16px; font-weight:800; }.admin-brand small { display:block; margin-top:2px; color:#728b7b; font-size:11px; font-weight:700; letter-spacing:.17em; }.workspace-label,.menu-label { margin:0 9px 9px; color:#63786a; font-size:11px; font-weight:800; letter-spacing:.16em; }.workspace-card { display:flex; align-items:center; gap:9px; padding:9px; background:rgba(255,255,255,.025); border:1px solid rgba(158,199,174,.09); border-radius:11px; }.workspace-avatar,.admin-avatar { width:31px; height:31px; display:grid; place-items:center; border-radius:10px; color:#c4f3d6; background:rgba(105,190,142,.15); font-weight:750; }.workspace-card > span:nth-child(2) { flex:1; display:grid; gap:2px; }.workspace-card strong { font-size:11px; }.workspace-card small { color:var(--muted); font-size:11px; }.workspace-caret { color:#82968a; font-size:15px; }.menu-label { margin-top:30px; }.side-nav { display:grid; gap:4px; }.side-link { width:100%; height:39px; display:flex; align-items:center; gap:10px; padding:0 10px; color:#91a196; background:transparent; border:1px solid transparent; border-radius:10px; text-align:left; font-size:12px; font-weight:580; cursor:pointer; transition:background .15s,color .15s; }.side-link:hover { color:#d4e6d7; background:rgba(255,255,255,.035); }.side-link.active { color:#baf0cd; background:rgba(93,180,127,.12); border-color:rgba(112,195,144,.12); }.side-icon { width:19px; color:#7c9c86; font-size:15px; text-align:center; }.side-link.active .side-icon { color:var(--green); }.sidebar-bottom { margin-top:auto; }.local-card { display:flex; align-items:center; gap:9px; padding:11px 9px; background:rgba(122,189,145,.065); border:1px solid rgba(122,189,145,.12); border-radius:11px; }.local-card-icon { width:27px; height:27px; display:grid; place-items:center; border-radius:9px; color:#96d7a8; background:rgba(122,189,145,.13); font-size:16px; }.local-card div { flex:1; display:grid; gap:2px; }.local-card strong { font-size:11px; }.local-card small { color:var(--muted); font-size:11px; }.local-dot { width:6px; height:6px; border-radius:50%; background:#9cdba9; box-shadow:0 0 9px rgba(156,219,169,.45); }.back-link { display:block; margin:18px 8px 4px; color:#9fb1a4; text-decoration:none; font-size:11px; }.back-link:hover { color:var(--mint); }
.admin-main { min-height:100vh; margin-left:248px; padding:0 34px 24px; }.admin-topbar { min-height:69px; display:flex; align-items:center; justify-content:space-between; gap:15px; border-bottom:1px solid var(--line); }.breadcrumbs { display:flex; align-items:center; gap:9px; color:#829388; font-size:12px; }.crumb-slash { color:#53675b; }.breadcrumbs strong { color:#cfddd1; font-weight:620; }.topbar-actions { display:flex; align-items:center; gap:13px; }.auth-note { display:flex; align-items:center; gap:7px; color:#84988a; font-size:11px; }.auth-dot { width:6px; height:6px; border-radius:50%; background:var(--amber); }.icon-button { width:31px; height:31px; display:grid; place-items:center; border:1px solid var(--line); border-radius:9px; color:#a8bcad; background:rgba(255,255,255,.025); font-size:17px; cursor:pointer; }.icon-button:hover { border-color:rgba(117,217,168,.3); color:var(--mint); }.admin-avatar { width:30px; height:30px; font-size:11px; }.sandbox-banner { display:flex; align-items:center; gap:11px; margin:21px 0 0; padding:11px 14px; border:1px solid rgba(121,198,145,.18); border-radius:12px; color:#a5c5ad; background:linear-gradient(110deg,rgba(81,149,103,.11),rgba(81,149,103,.04)); }.banner-shield { width:25px; height:25px; display:grid; place-items:center; border-radius:8px; color:#a6e4b4; background:rgba(110,190,134,.13); font-size:16px; }.sandbox-banner div { flex:1; display:grid; gap:1px; }.sandbox-banner strong { color:#d0e7d2; font-size:11px; }.sandbox-banner div span { color:#8ea895; font-size:11px; }.sandbox-label { padding:5px 7px; border:1px solid rgba(131,207,151,.17); border-radius:6px; color:#9ad4a7; font-size:11px; font-weight:800; letter-spacing:.12em; }.api-error { margin-top:12px; padding:11px 13px; border:1px solid rgba(232,133,119,.22); border-radius:10px; color:#e7aaa0; background:rgba(123,56,47,.14); font-size:11px; }.admin-view { display:none; padding-top:28px; animation:view-in .2s ease; }.admin-view.active { display:block; } @keyframes view-in { from{opacity:.5;transform:translateY(4px)}to{opacity:1;transform:none} }.view-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:21px; }.overline { margin:0 0 5px; color:#78917d; font-size:11px; font-weight:800; letter-spacing:.15em; }.view-heading h1 { margin:0; font-size:27px; font-weight:680; letter-spacing:-.05em; }.view-subtitle { margin:5px 0 0; color:var(--muted); font-size:11px; }.button { min-height:36px; display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:0 12px; border:1px solid transparent; border-radius:9px; font-size:13px; font-weight:720; cursor:pointer; transition:filter .15s,transform .15s; }.button:hover:not(:disabled) { filter:brightness(1.1); transform:translateY(-1px); }.button:disabled { opacity:.45; cursor:not-allowed; }.button-outline { color:#afd8b7; background:rgba(108,180,125,.09); border-color:rgba(108,180,125,.2); }.button-primary { min-height:41px; color:#082014; background:linear-gradient(115deg,#a3e9b4,#6fc98c); box-shadow:0 7px 18px rgba(90,176,113,.13); }
.stats-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.stat-card,.surface-card { border:1px solid var(--line); border-radius:13px; background:linear-gradient(145deg,rgba(17,31,24,.96),rgba(14,25,20,.97)); box-shadow:0 10px 30px rgba(0,0,0,.09); }.stat-card { min-height:112px; padding:14px 15px 13px; }.stat-top { display:flex; align-items:center; justify-content:space-between; gap:8px; color:#91a395; font-size:12px; }.stat-icon { width:27px; height:27px; display:grid; place-items:center; border-radius:9px; font-size:14px; }.stat-icon.mint { color:#9de1b5;background:rgba(104,194,135,.13); }.stat-icon.green { color:#97dfaa;background:rgba(83,180,110,.13); }.stat-icon.amber { color:#e4c985;background:rgba(209,172,94,.13); }.stat-icon.blue { color:#a5cde0;background:rgba(106,163,193,.13); }.stat-value { display:block; margin:10px 0 2px; color:#e2eee5; font-size:25px; line-height:1; font-weight:650; letter-spacing:-.045em; }.stat-card > small { color:#72857a; font-size:11px; }.status-mark { display:inline-block; width:5px;height:5px;margin-right:5px;border-radius:50%;background:#86d39a;vertical-align:1px; }
.content-grid { display:grid; grid-template-columns:minmax(0,1.75fr) minmax(260px,.95fr); gap:13px; margin-top:14px; }.surface-card { padding:15px; }.surface-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }.surface-heading h2 { margin:0; color:#e0ebe1; font-size:14px; font-weight:650; letter-spacing:-.02em; }.surface-heading .overline { margin-bottom:4px; }.link-button { padding:4px 0; color:#91d5a1; background:transparent; border:0; font-size:12px; cursor:pointer; }.link-button span { padding-left:3px; }.small-wave { color:#8bc799; font-size:20px; }.table-wrap { overflow:auto; }.table-wrap table { width:100%; border-collapse:collapse; text-align:left; }.table-wrap th { padding:8px 9px; color:#718579; border-bottom:1px solid var(--line); font-size:11px; font-weight:750; letter-spacing:.1em; text-transform:uppercase; white-space:nowrap; }.table-wrap td { padding:10px 9px; color:#b9c9bc; border-bottom:1px solid rgba(157,201,174,.07); font-size:12px; white-space:nowrap; }.table-wrap tr:last-child td { border-bottom:0; }.mono { color:#94ac99 !important; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px !important; }.user-name-cell { color:#e1eae2 !important; font-weight:570; }.date-cell { color:#91a297 !important; }.user-status { display:inline-flex; align-items:center; gap:5px; padding:4px 7px; border-radius:6px; font-size:11px; font-weight:700; }.user-status::before { width:5px;height:5px;border-radius:50%;content:"";background:currentColor; }.status-active { color:#9ddcb0;background:rgba(94,177,116,.1); }.status-expired { color:#dfbd79;background:rgba(192,147,67,.1); }.status-none { color:#9ba89e;background:rgba(157,175,161,.09); }.table-empty { padding:24px 10px; color:#73877b; text-align:center; font-size:11px; }.quick-metrics { padding:15px 16px 11px; }.detail-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 0; border-bottom:1px solid rgba(157,201,174,.075); color:#9aaca0; font-size:12px; }.detail-row strong { color:#d2e0d4; font-size:12px; font-weight:650; }.metrics-footnote { margin:11px 0 0; color:#718679; font-size:11px; line-height:1.5; }.campaign-preview-section { margin-top:14px; }.campaign-list { display:grid; }.campaign-row { display:flex; align-items:center; gap:11px; padding:11px 2px; border-top:1px solid rgba(157,201,174,.075); }.campaign-icon { width:29px;height:29px;display:grid;place-items:center;border:1px solid rgba(109,189,131,.13);border-radius:9px;color:#9bd5a7;background:rgba(83,163,101,.09);font-size:14px; }.campaign-content { flex:1;min-width:0;display:grid;gap:3px; }.campaign-copy { overflow:hidden;color:#d7e4d9;font-size:12px;font-weight:540;text-overflow:ellipsis;white-space:nowrap; }.campaign-meta { color:#7f9285;font-size:11px; }.campaign-result { display:grid;justify-items:end;gap:2px; }.recipient-number { color:#d7e5d8;font-size:11px; }.recipient-caption { color:#7d9183;font-size:11px; }.simulated-status { margin-left:6px;padding:4px 6px;border:1px solid rgba(124,195,140,.13);border-radius:5px;color:#a6d4a9;background:rgba(93,160,105,.08);font-size:11px;white-space:nowrap; }.admin-footer { display:flex;justify-content:space-between;gap:12px;margin-top:27px;padding-top:12px;border-top:1px solid var(--line);color:#5d7264;font-size:11px;letter-spacing:.06em; }
.records-chip { padding:5px 8px;border:1px solid var(--line);border-radius:7px;color:#9cafa0;font-size:11px; }.full-users { padding:16px; }.full-users .surface-heading { margin-bottom:12px; }.section-hint { margin:5px 0 0;color:#75877a;font-size:11px; }.full-users table { min-width:650px; }.full-users th,.full-users td { padding-top:12px;padding-bottom:12px; }.message-layout { display:grid;grid-template-columns:minmax(0,1.6fr) minmax(240px,.8fr);gap:13px;align-items:start; }.compose-card { padding:17px; }.compose-icon { width:32px;height:32px;display:grid;place-items:center;border:1px solid rgba(117,217,168,.15);border-radius:10px;color:#a9e4b6;background:rgba(103,185,126,.09); }.form-field { margin-top:17px; }.form-field label { display:block;margin-bottom:7px;color:#bdccbf;font-size:12px;font-weight:650; }.form-field textarea,.form-field select { width:100%;padding:11px 12px;border:1px solid rgba(157,201,174,.16);border-radius:9px;color:#e4eee6;background:#0b1711;font-size:13px; }.form-field textarea { min-height:160px;resize:vertical;line-height:1.55; }.form-field textarea::placeholder { color:#657a6b; }.form-field select { height:39px; }.field-meta { display:flex;justify-content:space-between;gap:10px;margin-top:6px;color:#73867a;font-size:11px; }.audience-field small { display:block;margin-top:6px;color:#74877a;font-size:11px; }.send-safety-note { display:flex;gap:9px;margin:17px 0;padding:11px;border:1px solid rgba(123,196,143,.14);border-radius:9px;color:#a1c4a5;background:rgba(81,147,95,.07); }.send-safety-note > span { color:#a8dfad;font-size:15px; }.send-safety-note p { margin:0;color:#859b89;font-size:11px;line-height:1.55; }.send-safety-note strong { color:#c5ddc6;font-size:12px; }.action-wide { width:100%;min-height:42px; }.message-side-note { padding:17px; }.side-note-icon { width:32px;height:32px;display:grid;place-items:center;margin-bottom:14px;border:1px solid rgba(118,202,143,.15);border-radius:10px;color:#a4ddb0;background:rgba(81,165,105,.08);font-size:17px; }.message-side-note h2 { margin:0;font-size:14px; }.message-side-note > p:not(.overline) { color:#899c8e;font-size:12px;line-height:1.6; }.steps { display:grid;gap:12px;margin:18px 0; }.steps > div { display:flex;align-items:center;gap:9px; }.steps > div > span { width:21px;height:21px;display:grid;place-items:center;border:1px solid rgba(128,193,142,.18);border-radius:7px;color:#a3d6a9;background:rgba(81,151,99,.08);font-size:11px; }.steps p { margin:0;color:#a3b2a5;font-size:11px; }.no-delivery { padding:10px;border-radius:8px;color:#94a99a;background:rgba(255,255,255,.025);font-size:11px;line-height:1.5; }.no-delivery-dot { display:inline-block;width:5px;height:5px;margin-right:5px;border-radius:50%;background:#b59c66; }.campaign-history { margin-top:14px; }.campaign-history .surface-heading { margin-bottom:8px; }
.preview-dialog { position:fixed;width:min(510px,calc(100% - 28px));max-width:none;max-height:calc(100% - 30px);overflow:auto;padding:23px;color:var(--text);background:#122019;border:1px solid rgba(135,197,149,.2);border-radius:17px;box-shadow:0 25px 80px rgba(0,0,0,.6); }.preview-dialog::backdrop { background:rgba(3,9,6,.76);backdrop-filter:blur(6px); }.dialog-dismiss { position:absolute;top:12px;right:12px; }.dialog-close { width:29px;height:29px;border:1px solid var(--line);border-radius:8px;color:#93a497;background:rgba(255,255,255,.025);font-size:17px;cursor:pointer; }.dialog-mark { width:34px;height:34px;display:grid;place-items:center;margin-bottom:13px;border-radius:10px;color:#a9e6b4;background:rgba(99,174,118,.12); }.preview-dialog h2 { margin:0 0 17px;font-size:19px;letter-spacing:-.03em; }.preview-audience { display:flex;align-items:center;gap:10px;padding:11px;border:1px solid rgba(150,197,159,.12);border-radius:10px;background:rgba(255,255,255,.02); }.audience-icon { width:28px;height:28px;display:grid;place-items:center;border-radius:8px;color:#a4d9ac;background:rgba(94,174,111,.12); }.preview-audience > div:nth-child(2) { flex:1;display:grid;gap:2px; }.preview-audience small { color:#74897b;font-size:11px;letter-spacing:.12em; }.preview-audience strong { color:#cfdfd0;font-size:12px; }.recipient-count { justify-items:end; }.recipient-count strong { color:#d9ead9;font-size:16px; }.recipient-count small { letter-spacing:0; }.preview-message { margin:12px 0;padding:13px;border:1px solid rgba(150,197,159,.12);border-radius:11px;background:#0d1912; }.preview-brand { display:flex;align-items:center;gap:7px; }.small-brand { width:24px;height:24px;border-radius:7px;font-size:12px; }.preview-brand strong { color:#dce8dc;font-size:12px; }.preview-brand > small { margin-left:auto;color:#718579;font-size:11px;letter-spacing:.1em; }.preview-message p { margin:12px 0 2px;color:#d5e2d6;font-size:13px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere; }.preview-expiry { margin:0 0 12px;color:#738779;font-size:11px; }.dialog-warning { display:grid;gap:4px;margin-bottom:14px;padding:10px;border-left:2px solid rgba(224,190,114,.5);color:#a99c78;background:rgba(178,135,56,.055);font-size:11px;line-height:1.5; }.dialog-warning strong { color:#d7c38f;font-size:12px; }.dialog-cancel { width:100%;margin-top:8px;padding:8px;border:0;color:#92a394;background:transparent;font-size:12px;cursor:pointer; }.toast { position:fixed;z-index:12;right:18px;bottom:18px;width:min(420px,calc(100% - 36px));margin:0 auto;padding:12px 14px;border:1px solid rgba(123,196,143,.23);border-radius:11px;color:#d8edda;background:#14271b;box-shadow:0 10px 30px rgba(0,0,0,.35);font-size:12px;opacity:0;pointer-events:none;transform:translateY(8px);transition:.2s; }.toast.visible { opacity:1;transform:translateY(0); }.toast.error { border-color:rgba(232,133,119,.24);color:#f1b7ad;background:#2b1714; }
@media (max-width:1150px) { .admin-main { padding-right:22px;padding-left:22px; }.stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.content-grid { grid-template-columns:minmax(0,1.4fr) minmax(230px,.9fr); } }
@media (max-width:900px) { .sidebar { width:205px;padding-right:13px;padding-left:13px; }.admin-main { margin-left:205px;padding-right:18px;padding-left:18px; }.auth-note { max-width:190px;font-size:11px; }.content-grid,.message-layout { grid-template-columns:1fr; }.quick-metrics { display:grid;grid-template-columns:1fr 1fr;column-gap:18px; }.quick-metrics .surface-heading,.metrics-footnote { grid-column:1/-1; }.quick-metrics .surface-heading { margin-bottom:4px; }.detail-row { padding:8px 0; } }
.translation-actions { display:flex;align-items:center;justify-content:space-between;gap:9px;flex-wrap:wrap;margin-top:12px; }.translation-actions .link-button { text-align:left; }.translation-note { margin:7px 0 0;color:#8ea894;font-size:11px;line-height:1.5; }.form-field textarea#campaign-text,.form-field textarea#campaign-text-en { min-height:125px; }.campaign-copy-en { overflow:hidden;color:#a9b9ac;font-size:11px;text-overflow:ellipsis;white-space:nowrap; }.preview-message-en { border-color:rgba(126,166,199,.17);background:#0e171b; }.preview-message-en .preview-brand > small { color:#91b1c0; }
@media (max-width:560px) { .translation-actions { align-items:stretch; }.translation-actions > * { width:100%; }.translation-actions .link-button { padding:8px 0; } }
@media (max-width:650px) { .sidebar { position:relative;inset:auto;width:auto;padding:12px 14px 10px;border-right:0;border-bottom:1px solid var(--line); }.admin-brand { margin:0 3px 12px; }.workspace-label,.workspace-card,.menu-label,.sidebar-bottom { display:none; }.side-nav { display:flex;gap:5px; }.side-link { justify-content:center;gap:6px;padding:0 8px;font-size:12px; }.side-icon { width:auto; }.admin-main { margin-left:0;padding:0 14px 18px; }.admin-topbar { min-height:55px; }.breadcrumbs { font-size:11px; }.topbar-actions { gap:8px; }.auth-note { max-width:145px;font-size:11px; }.admin-avatar { width:27px;height:27px; }.sandbox-banner { margin-top:13px;padding:10px; }.sandbox-banner div span { font-size:11px; }.sandbox-label { display:none; }.admin-view { padding-top:22px; }.view-heading { align-items:flex-start; }.view-heading h1 { font-size:23px; }.view-subtitle { max-width:260px;line-height:1.5; }.view-heading > .button { flex:0 0 auto;padding:0 9px;font-size:12px; }.stats-grid { gap:8px; }.stat-card { min-height:101px;padding:11px; }.stat-top { font-size:12px; }.stat-value { font-size:22px; }.surface-card { padding:12px; }.users-preview table { min-width:430px; }.quick-metrics { grid-template-columns:1fr; }.quick-metrics .surface-heading,.metrics-footnote { grid-column:1; }.campaign-row { gap:8px; }.campaign-result { min-width:67px; }.admin-footer { flex-direction:column;gap:4px; }.compose-card,.message-side-note { padding:13px; }.preview-dialog { padding:19px; } }
.admin-main,.admin-view,.surface-card,.content-grid > *,.message-layout > * { min-width:0; }
.table-wrap { max-width:100%; }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important;animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important; } }
.support-disclaimer { display:flex; align-items:center; gap:10px; margin:-5px 0 13px; padding:10px 13px; border:1px solid rgba(126,194,142,.17); border-radius:10px; color:#a9c5ad; background:rgba(75,132,87,.08); font-size:12px; }
.support-disclaimer strong { color:#d0e6d2; font-size:13px; white-space:nowrap; }
.support-workspace { display:grid; grid-template-columns:minmax(250px,.78fr) minmax(0,1.42fr); gap:13px; align-items:stretch; }
.support-inbox,.support-dialog { min-width:0; min-height:590px; }
.support-panel-heading,.support-dialog-heading { display:flex; align-items:center; gap:11px; min-height:45px; margin-bottom:12px; padding-bottom:12px; border-bottom:1px solid var(--line); }
.support-panel-heading > div { display:flex; flex:1; align-items:baseline; gap:9px; }
.support-panel-heading h2 { margin:0; color:#e2ece3; font-size:15px; }
.support-panel-heading > div > span { color:#8fa196; font-size:12px; }
.inbox-mark,.support-user-avatar { display:grid; flex:0 0 36px; width:36px; height:36px; place-items:center; border:1px solid rgba(122,195,144,.18); border-radius:11px; color:#a7ddb1; background:rgba(91,161,108,.1); font-size:16px; }
.support-thread-list { display:grid; gap:7px; max-height:540px; overflow:auto; }
.support-thread { display:grid; width:100%; gap:6px; padding:11px; border:1px solid transparent; border-radius:10px; color:#d9e4db; background:rgba(255,255,255,.018); text-align:left; cursor:pointer; }
.support-thread:hover:not(:disabled) { background:rgba(255,255,255,.04); }
.support-thread.active { border-color:rgba(118,201,144,.25); background:rgba(77,143,94,.11); }
.support-thread:disabled { opacity:.7; cursor:wait; }
.support-thread-top,.support-thread-meta { display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0; }
.support-thread-name { overflow:hidden; color:#e2ece3; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.support-thread-last { overflow:hidden; color:#a5b5a9; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.support-thread-meta { color:#7e9384; font-size:12px; }
.thread-badge,.thread-state { flex:0 0 auto; padding:4px 7px; border:1px solid rgba(213,175,101,.17); border-radius:999px; color:#dcc587; background:rgba(175,131,52,.08); font-size:12px; white-space:nowrap; }
.thread-badge.answered,.thread-state.answered { border-color:rgba(126,192,143,.17); color:#a9d7b0; background:rgba(85,153,100,.08); }
.support-placeholder,.support-error { padding:22px 12px; color:#94a69a; font-size:13px; text-align:center; }
.support-error { color:#e8aaa0; }
.support-dialog { display:flex; flex-direction:column; }
.support-dialog-heading { flex:0 0 auto; }
.support-user-avatar { border-radius:50%; font-weight:750; }
.support-user-title { display:grid; flex:1; min-width:0; gap:2px; }
.support-user-title strong { overflow:hidden; color:#e2ece3; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.support-user-title span { overflow:hidden; color:#8fa195; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.support-dialog-messages { display:grid; flex:1; align-content:start; gap:10px; min-height:250px; max-height:430px; overflow:auto; padding:6px 2px 14px; }
.support-message { width:fit-content; max-width:88%; padding:10px 12px 7px; border:1px solid rgba(144,187,156,.11); border-radius:5px 12px 12px 12px; color:#dbe6dd; background:#15241b; }
.support-message.from-support { justify-self:end; border-color:rgba(127,195,143,.16); border-radius:12px 5px 12px 12px; background:#182c20; }
.support-message-sender { display:block; margin-bottom:4px; color:#a9d7b1; font-size:12px; }
.support-message-copy { margin:0; color:#dce7dd; font-size:13px; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; }
.support-message-meta { display:flex; justify-content:flex-end; gap:7px; margin-top:5px; color:#81958a; font-size:12px; }
.simulated-tag { color:#97bba0; }
.support-reply { flex:0 0 auto; padding-top:12px; border-top:1px solid var(--line); }
.support-reply > label { display:block; margin-bottom:7px; color:#bdccbf; font-size:12px; font-weight:650; }
.support-reply textarea { display:block; width:100%; min-height:75px; resize:vertical; padding:10px 11px; border:1px solid rgba(157,201,174,.16); border-radius:9px; color:#e4eee6; background:#0b1711; font:inherit; font-size:13px; }
.support-reply textarea::placeholder { color:#73877a; }
.support-reply-footer { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; }
.support-reply-footer > span { color:#86988b; font-size:12px; }
.support-reply-footer .button { min-height:39px; font-size:12px; }
.support-reply-footer .button:disabled { opacity:.45; }
@media (max-width:900px) { .support-workspace { grid-template-columns:1fr; }.support-inbox { min-height:0; }.support-thread-list { max-height:300px; }.support-dialog { min-height:530px; } }
@media (max-width:650px) { .support-disclaimer { align-items:flex-start; flex-direction:column; gap:2px; }.support-workspace { gap:10px; }.support-dialog-messages { max-height:380px; }.support-reply-footer { align-items:stretch; flex-direction:column; }.support-reply-footer .button { width:100%; } }
@media (max-width:650px) { .side-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }.side-link { width:100%; justify-content:flex-start; } }

/* Delivery journal remains readable at both desktop and narrow widths. */
#delivery-table .mono small, #delivery-table td small { display: block; margin-top: 6px; overflow-wrap: anywhere; }
#delivery-table .mono { max-width: 240px; white-space: normal; overflow-wrap: anywhere; }
#delivery-table .button { white-space: nowrap; }
@media (max-width:720px) {
  .admin-view[data-view="delivery"] table { display:block; min-width:0; }
  .admin-view[data-view="delivery"] thead { display:none; }
  #delivery-table { display:block; }
  #delivery-table tr { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px 12px; padding:14px 0; border-top:1px solid var(--line); }
  #delivery-table td { display:block; padding:0; border:0; white-space:normal; min-width:0; }
  #delivery-table td:nth-child(1), #delivery-table td:nth-child(2), #delivery-table td:nth-child(3), #delivery-table td:nth-child(6) { grid-column:1/-1; }
  #delivery-table .mono { max-width:none; }
  #delivery-table td:nth-child(3)::before { content:"Доступ: "; color:#75877a; }
  #delivery-table td:nth-child(4)::before { content:"Попытки: "; color:#75877a; }
  #delivery-table td:nth-child(5)::before { content:"Обновлено: "; color:#75877a; }
  #delivery-table .button { width:100%; margin-top:6px; }
}