/* ZaxSocial · css/base.css — reset, shell frame (#zs-app, header, view, tab bar, sidebar, panes), splash, unsupported
   notice, focus, 44 px hit areas, overlays (sheet/dialog/popover/menu), toasts, and the UI-kit parts the design file lacks.
   Owner: U3. Docs: 02-backbone-frontend-b.md §1.1, §1.3, §3; amendments F6/F8; 15-C §15. Tokens only. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--zs-bg)}
html[data-platform="ios"]{--zs-font:var(--zs-font-ios)}
html[data-platform="android"]{--zs-font:var(--zs-font-android)}
body{margin:0;min-height:100dvh;background:var(--zs-bg);color:var(--zs-text);font-family:var(--zs-font);font-size:var(--zs-body-size);line-height:var(--zs-body-lh);letter-spacing:var(--zs-body-track);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent}
:where(h1,h2,h3,h4,p,ul,ol,dl,dd,figure){margin:0}
:where(button){appearance:none;margin:0;padding:0;border:0;background:none;font:inherit;color:inherit;text-align:inherit;cursor:pointer}
:where(a[class]){color:inherit;text-decoration:none}
:where(img,svg,video){max-width:100%}
:where(input,select,textarea){font:inherit}
[hidden]{display:none}
:focus-visible{outline:2px solid var(--zs-accent);outline-offset:2px}
[tabindex="-1"]:focus,.zs-input:focus-visible,.zs-textarea:focus-visible{outline:none}
::selection{background:var(--zs-accent-soft-2)}
/* shell */
#zs-app{position:relative;display:flex;flex-direction:column;min-height:100dvh;height:auto;overflow:visible}
#zs-header[hidden],#zs-tabbar[hidden],#zs-sidebar[hidden]{display:none}
.zs-view{position:relative;flex:1;min-width:0}
.zs-screen{position:relative;min-height:100%;outline:none}
.zs-screen>h1[tabindex="-1"]{outline:none}
#zs-app.has-tabbar .zs-view{padding-bottom:calc(var(--zs-tabbar-h) + 28px + var(--zs-safe-bottom))}
#zs-app.has-tabbar[data-tabbar="material"] .zs-view,#zs-app.has-tabbar[data-tabbar^="wa"] .zs-view,#zs-app.has-tabbar[data-tabbar^="tg"] .zs-view{padding-bottom:calc(var(--zs-tabbar-h) + 16px + var(--zs-safe-bottom))}
#zs-tabbar{position:fixed;left:0;right:0;bottom:0;z-index:var(--zs-z-tabbar)}
#zs-tabbar.zs-tabbar:not(.zs-tabbar--material){left:14px;right:14px;bottom:max(12px,calc(var(--zs-safe-bottom) - 12px));max-width:520px;margin:0 auto}
.zs-tabbar.has-pill .zs-tab{z-index:1;background:none}
.zs-tabbar__pill{position:absolute;left:0;top:0;border-radius:28px;background:var(--zs-accent-soft);opacity:0;pointer-events:none}
.zs-tabbar__pill--m{border-radius:16px;background:var(--zs-accent-soft-2)}
.zs-tabbar--material.has-pill .zs-tab.is-active .zs-tab__icon{background:none}
.zs-tab__label{white-space:nowrap}
html.is-kb-open #zs-tabbar,html.is-kb-open .zs-savebar,html.is-kb-open .zs-wa-fab,html.is-kb-open .zs-tg-fab{display:none}
.zs-banners{display:grid;gap:8px;padding:0 var(--zs-gutter)}
.zs-banners:not(:empty){padding-top:8px}
/* split + desktop layouts (02-b §1.1 breakpoints) */
@media (min-width:768px) and (min-height:560px){
  #zs-app.has-sidebar{display:grid;grid-template-columns:var(--zs-sidebar-w-collapsed) minmax(0,1fr);grid-template-rows:auto auto 1fr;align-items:start}
  #zs-app.has-sidebar>#zs-sidebar{grid-row:1/span 3;position:sticky;top:0;height:100dvh;overflow-y:auto;overscroll-behavior:contain}
  #zs-app.has-sidebar>#zs-header,#zs-app.has-sidebar>.zs-banners,#zs-app.has-sidebar>.zs-view{grid-column:2}
  #zs-app.has-sidebar>#zs-tabbar{display:none}
  #zs-app.has-sidebar .zs-view{padding-bottom:24px}
  .zs-sidebar .zs-sidebar__label,.zs-sidebar .zs-sidebar__section{display:none}
  .zs-sidebar .zs-sidebar__item{justify-content:center;padding:0;height:44px}
  .zs-sidebar .zs-sidebar__brand{justify-content:center;padding:4px 0 18px}
  #zs-view.has-panes,#zs-view:has(>.zs-pane--list){display:grid;grid-template-columns:minmax(320px,400px) minmax(0,1fr);align-items:start}
  .zs-pane--list{position:sticky;top:0;height:100dvh;overflow-y:auto;border-right:1px solid var(--zs-hairline)}
  .zs-pane--detail{min-width:0;min-height:100dvh}
}
@media (min-width:1024px){
  #zs-app.has-sidebar{grid-template-columns:var(--zs-sidebar-w) minmax(0,1fr)}
  .zs-sidebar:not(.is-collapsed) .zs-sidebar__label{display:inline}
  .zs-sidebar:not(.is-collapsed) .zs-sidebar__section{display:block}
  .zs-sidebar:not(.is-collapsed) .zs-sidebar__item{justify-content:flex-start;padding:0 12px;height:38px}
  .zs-sidebar:not(.is-collapsed) .zs-sidebar__brand{justify-content:flex-start;padding:4px 10px 18px}
  #zs-app.has-sidebar:has(>.zs-sidebar.is-collapsed){grid-template-columns:var(--zs-sidebar-w-collapsed) minmax(0,1fr)}
}
.zs-sidebar__item{position:relative}
.zs-sidebar__item .zs-badge{margin-left:auto}
.zs-sidebar__toggle{align-self:flex-end;margin-top:8px}
.zs-sidebar.is-collapsed .zs-sidebar__toggle .zi{transform:rotate(180deg)}
/* splash (F6) — auto-hides after 3 s so a JS failure never leaves it up */
.zs-splash{position:fixed;inset:0;z-index:var(--zs-z-modal);display:none;place-content:center;justify-items:center;gap:16px;background:var(--zs-bg)}
html.js .zs-splash{display:grid;animation:zs-splash-out var(--zs-dur-base) var(--zs-ease-standard) 3s forwards}
html.is-ready .zs-splash{animation:zs-splash-out var(--zs-dur-base) var(--zs-ease-standard) forwards}
.zs-splash__mark{display:grid;place-items:center;width:76px;height:76px;border-radius:24px;color:var(--zs-lit-ffffff);background:var(--zs-gradient-brand);box-shadow:0 18px 44px -14px var(--zs-lit-6b4eff-75);animation:zs-splash-mark var(--zs-dur-slow) var(--zs-ease-emphasized) both}
.zs-splash__mark .zi{width:70%;height:70%;--zi-stroke:2.6}
.zs-splash__word{font-size:24px;font-weight:800;letter-spacing:-.035em;animation:zs-fade-up var(--zs-dur-slow) var(--zs-ease-decelerate) 80ms both}
.zs-splash__word span{color:var(--zs-accent-text)}
.zs-unsupported-notice{display:none}
html.zs-unsupported .zs-unsupported-notice{display:block;position:fixed;left:12px;right:12px;bottom:calc(12px + var(--zs-safe-bottom));z-index:var(--zs-z-modal);padding:14px 16px;border-radius:16px;background:var(--zs-warning-soft);color:var(--zs-warning-ink);font-size:14px;line-height:20px;box-shadow:var(--zs-shadow-lg)}
/* hit areas ≥ 44 px (F6) */
.zs-iconbtn::after{content:"";position:absolute;inset:-1px;border-radius:50%}
.zs-iconbtn--sm::after{inset:-5px}
.zs-chip,.zs-tour__skip{position:relative}
.zs-btn--sm::before,.zs-chip::before,.zs-tour__skip::before{content:"";position:absolute;inset:-5px 0}
.zs-chip--sm::before{inset:-8px 0}
.zs-ripple-host{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none}
.zs-ripple{position:absolute;border-radius:50%;background:var(--zs-ripple);opacity:0;pointer-events:none}
/* header */
.zs-topbar__title{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0}
.zs-topbar__titletext{max-width:100%}
.zs-topbar__subtitle{font-size:12px;line-height:15px;font-weight:500;color:var(--zs-text-secondary)}
.zs-topbar__title:has(.zs-topbar__mark){flex-direction:row;gap:6px}
.zs-topbar__actions{margin-left:auto}
.zs-topbar__back{background:none}
.zs-topbar .zs-mark.zs-topbar__mark,.zs-largetitle .zs-mark{width:20px;height:20px;border-radius:6px;box-shadow:none}
.zs-largetitle{display:flex;align-items:center;gap:8px;transform-origin:left center}
.zs-topbar.has-large [data-hdr-title]{opacity:0;transition:opacity var(--zs-dur-fast) var(--zs-ease-standard)}
.zs-topbar.has-large.is-collapsed [data-hdr-title]{opacity:1}
.zs-topbar--channel{padding-top:0;background:none;border-bottom:0;-webkit-backdrop-filter:none;backdrop-filter:none}
.zs-topbar--wa{color:var(--zs-wa-text);background:var(--zs-wa-bg)}
.zs-topbar--tg{color:var(--zs-tg-text);background:var(--zs-tg-bg)}
.zs-tg-appbar .zs-iconbtn,.zs-tg-appbar .zs-tg-icon{color:inherit}
.zs-wa-iosbar .zs-topbar__back,.zs-tg-iosbar .zs-topbar__back{color:var(--zs-ch-accent,var(--zs-wa-accent))}
@media (max-width:379px){.zs-topbar [data-fold]{display:none}}
.zs-topbar [data-folded]{display:none}
/* overlays: sheets, dialogs, popovers, menus */
.zs-overlay{position:fixed;inset:0;z-index:var(--zs-z-sheet)}
.zs-overlay .zs-scrim{position:fixed;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
html[data-lowend] .zs-overlay .zs-scrim{-webkit-backdrop-filter:none;backdrop-filter:none}
.zs-overlay .zs-sheet{position:fixed;display:flex;flex-direction:column;max-height:calc(var(--zs-vvh) - var(--zs-safe-top) - 12px);outline:none;touch-action:none;will-change:transform}
.zs-overlay .zs-sheet.zs-sheet--full{height:calc(var(--zs-vvh) - var(--zs-safe-top) - 8px)}
.zs-sheet__body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;margin:0 -16px;padding:0 16px}
.zs-sheet__heading{flex:1;min-width:0}
.zs-sheet__close{margin:-4px -4px 0 0}
.zs-sheet__actions{flex:none}
.zs-overlay .zs-dialog{left:50%;top:50%;right:auto;bottom:auto;width:min(440px,calc(100vw - 32px));max-height:calc(var(--zs-vvh) - 48px);padding:20px;border-radius:28px;translate:-50% -50%;box-shadow:var(--zs-shadow-xl),var(--zs-ring-inset)}
.zs-dialog .zs-sheet__body{margin:0 -20px;padding:0 20px}
.zs-dialog .zs-sheet__head{padding:0 0 8px}
.zs-dialog__text{font-size:15px;line-height:22px;color:var(--zs-text-secondary)}
.zs-dialog__form{display:grid;gap:14px}
.zs-overlay--popover{background:transparent}
.zs-overlay .zs-popover{left:0;top:0;right:auto;bottom:auto;min-width:232px;max-width:min(360px,calc(100vw - 16px));max-height:min(70vh,560px);padding:6px;border-radius:18px;box-shadow:var(--zs-shadow-lg),0 0 0 1px var(--zs-hairline)}
.zs-popover__body{overflow-y:auto}
.zs-popover--menu .zs-menu{min-width:0;padding:0;box-shadow:none;background:none}
.zs-menu__item{width:100%;text-align:left;cursor:pointer}
.zs-menu__item:hover,.zs-menu__item:focus-visible{background:var(--zs-surface-2);outline:none}
.zs-menu__item[disabled]{opacity:.4;cursor:default}
.zs-menu__text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zs-menu__check{color:var(--zs-accent-text)}
.zs-menu--sheet{min-width:0;padding:4px;border-radius:18px;background:var(--zs-fill);box-shadow:none}
.zs-menu--sheet .zs-menu__item{height:52px;font-size:16px}
.zs-sheet--menu .zs-sheet__actions{margin-top:10px}
/* toasts (F3) */
.zs-toasts{position:fixed;left:0;right:0;bottom:calc(16px + var(--zs-safe-bottom));z-index:var(--zs-z-toast);display:grid;justify-items:center;padding:0 16px;pointer-events:none}
#zs-app.has-tabbar~.zs-toasts{bottom:calc(var(--zs-tabbar-h) + 24px + var(--zs-safe-bottom))}
html.is-kb-open .zs-toasts{bottom:calc(var(--zs-kb) + 76px)}
.zs-toasts>.zs-toast{grid-area:1/1;position:relative;max-width:min(520px,100%);overflow:hidden;pointer-events:auto;touch-action:pan-y;transition:transform var(--zs-dur-base) var(--zs-ease-standard)}
.zs-toast__text{min-width:0}
.zs-toast__action{background:none;border:0;cursor:pointer;color:var(--zs-violet-300);white-space:nowrap}
.zs-toast__icon--warning{background:var(--zs-warning)}
.zs-toast__progress{position:absolute;left:18px;right:18px;bottom:3px;height:2px;border-radius:1px;background:currentColor;opacity:.22;transform-origin:left center}
@media (min-width:1024px){.zs-toasts,#zs-app.has-tabbar~.zs-toasts{top:calc(16px + var(--zs-safe-top));bottom:auto;justify-items:end;padding:0 24px}}
/* lists, rows, kv, tables */
button.zs-item,label.zs-item{width:100%;text-align:left;cursor:pointer}
.zs-item.is-toggle{cursor:pointer}
.zs-listgroup+.zs-listgroup .zs-list__header{padding-top:26px}
.zs-kv{display:grid}
.zs-kv__row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px solid var(--zs-hairline)}
.zs-kv__row:last-child{border-bottom:0}
.zs-kv__k{font-size:14px;color:var(--zs-text-secondary)}
.zs-kv__v{min-width:0;text-align:right;font-size:14px;font-weight:600;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.zs-table tr.is-clickable{cursor:pointer}
.zs-table tbody tr.is-clickable:hover td{background:var(--zs-overlay-hover)}
.zs-table tbody tr.is-selected td{background:var(--zs-accent-soft)}
.zs-table__sel{width:52px}
.zs-pagination{display:flex;justify-content:center;padding:16px}
/* skeletons */
.zs-skeleton{display:block}
.zs-skel-row{min-height:72px}
.zs-skel-row--item{min-height:52px}
.zs-skel--tile{border-radius:9px;flex:none}
.zs-skel--circle{flex:none}
.zs-skel-chat{display:flex;flex-direction:column;gap:10px;padding:16px}
.zs-skel-bubble{display:flex}
.zs-skel-bubble.is-out{justify-content:flex-end}
.zs-skel--bubble{border-radius:14px}
.zs-skel-cards,.zs-skel-article,.zs-skel-para,.zs-skel-card,.zs-skel-stack,.zs-skel-stat{display:grid;gap:10px}
.zs-skel-stack{flex:1}
.zs-skel-stats{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.zs-skel-table{padding:0;overflow:hidden}
.zs-skel-trow{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:16px;align-items:center;padding:13px 16px;border-bottom:1px solid var(--zs-hairline)}
.zs-skel-cell{display:flex;align-items:center;gap:10px}
.zs-skel-cell .zs-skel{flex:1}
.zs-skel-profile{display:grid;justify-items:center;gap:10px;padding:24px 0}
.zs-skel-profile .zs-list{width:calc(100% - 32px);margin-top:14px}
.zs-skel-article{gap:18px}
/* feedback: empty/error, rings, banners, avatars, badges */
.zs-empty__art svg:not(.zi){width:100%;height:100%;overflow:visible}
.zs-empty--compact{padding:20px 16px}
.zs-empty__art--sm{width:72px;height:72px;border-radius:24px}
.zs-empty--compact .zs-empty__title{margin-top:24px;font-size:16px}
.zs-empty__ref{margin-top:6px;font-family:var(--zs-font-mono);font-size:12px;color:var(--zs-text-tertiary)}
.zs-empty__actions{flex-wrap:wrap;justify-content:center}
.zs-ring{position:relative;display:inline-grid;place-items:center;flex:none}
.zs-ring>svg{position:absolute;inset:0}
.zs-ring__track{fill:none;stroke:var(--zs-surface-3)}
.zs-ring__arc{fill:none;stroke:var(--zs-accent);stroke-linecap:round}
.zs-ring__center{position:relative;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.zs-ring.is-indeterminate>svg{animation:zs-spin 1s linear infinite}
.zs-banner__body{flex:1;min-width:0}
.zs-banner__action{margin-left:6px;font-weight:650;text-decoration:underline;color:inherit}
.zs-banner__close{display:grid;place-items:center;width:28px;height:28px;margin:-4px -6px -4px 0;border-radius:50%;opacity:.75;position:relative}
.zs-banner__close::after{content:"";position:absolute;inset:-8px}
.zs-banner--success{background:var(--zs-success-soft);color:var(--zs-success-ink)}
.zs-tip{margin:12px var(--zs-gutter) 0}
.zs-avatar__img{position:absolute;inset:0;width:100%;height:100%;border-radius:inherit;object-fit:cover}
.zs-badge{overflow:hidden}
.zs-badge__n{display:inline-block}
/* controls */
.zs-chips--scroll{overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
.zs-chips--scroll::-webkit-scrollbar,.zs-tabs::-webkit-scrollbar{display:none}
.zs-chip{cursor:pointer;flex:none}
.zs-field__foot{display:flex;gap:8px}
.zs-field__foot>.zs-hint[hidden]+.zs-field__counter,.zs-field__counter{margin-left:auto}
.zs-field__foot:not(:has(:not([hidden]))){display:none}
.zs-input-wrap.has-end>.zs-input{padding-right:52px}
.zs-input-wrap:not(.has-icon)>.zs-input{padding-left:16px}
.zs-input-wrap__end>.zi{pointer-events:none;color:var(--zs-text-tertiary)}
.zs-input-wrap>.zs-input,.zs-input-wrap>.zs-textarea{flex:1}
.zs-input-wrap.is-error .zs-textarea,.zs-textarea.is-error{border-color:var(--zs-danger);box-shadow:0 0 0 4px var(--zs-danger-soft)}
.zs-select-native{appearance:none;cursor:pointer}
.zs-textarea{display:block}
.zs-switch{cursor:pointer;border:0;padding:0}
.zs-switch:disabled{opacity:.45;cursor:default}
.zs-seg{position:relative}
.zs-seg__item{position:relative;z-index:1;cursor:pointer}
.zs-seg__thumb{position:absolute;left:0;top:3px;bottom:3px;border-radius:9px;background:var(--zs-control-active);box-shadow:0 1px 3px var(--zs-lit-101028-10),0 1px 1px var(--zs-lit-101028-05);opacity:0;pointer-events:none}
.zs-seg--pill .zs-seg__thumb{border-radius:var(--zs-r-pill)}
.zs-seg.has-thumb .zs-seg__item.is-active{background:none;box-shadow:none}
.zs-checkrow{display:inline-flex;align-items:center;gap:10px;min-height:44px;cursor:pointer}
.zs-checkrow__text{font-size:15px}
.zs-checkrow input:focus-visible+.zs-check,label:has(input:focus-visible)>.zs-radio{outline:2px solid var(--zs-accent);outline-offset:2px}
.zs-radiogroup--option{display:grid;gap:8px}
.zs-radiogroup--option .zs-option+.zs-option{margin-top:0}
.zs-option{cursor:pointer;transition:box-shadow var(--zs-dur-base) var(--zs-ease-standard),background-color var(--zs-dur-base)}
.zs-searchbox .zs-search__input{flex:1;min-width:0;height:100%;padding:0;border:0;outline:none;background:none;color:inherit;font:inherit;letter-spacing:inherit}
.zs-search .zs-search__input{color:var(--zs-text)}
.zs-search__input::-webkit-search-cancel-button{display:none}
.zs-search__input::placeholder{color:var(--zs-text-tertiary)}
.zs-search__clear{display:grid;place-items:center;width:32px;height:32px;margin-right:-6px;border-radius:50%;color:var(--zs-text-tertiary)}
.zs-copyfield{display:flex;align-items:center;gap:2px;min-height:50px;padding:4px 6px 4px 16px;border-radius:14px;background:var(--zs-surface-2)}
.zs-copyfield__value{flex:1;min-width:0;font-size:14px;overflow-wrap:anywhere}
.zs-copyfield__value.is-mono{font-family:var(--zs-font-mono);font-size:13px}
.zs-savebar{position:sticky;bottom:calc(12px + var(--zs-safe-bottom));z-index:var(--zs-z-sticky);display:flex;justify-content:center;margin-top:16px;padding:0 var(--zs-gutter)}
.zs-savebar__inner{display:flex;align-items:center;gap:8px;width:100%;max-width:640px;padding:8px 8px 8px 18px;border-radius:var(--zs-r-pill);background:var(--zs-elevated);box-shadow:var(--zs-shadow-lg),0 0 0 1px var(--zs-hairline)}
.zs-savebar__text{flex:1;font-size:14px;color:var(--zs-text-secondary)}
.zs-btn.is-saved{color:var(--zs-lit-ffffff);background:var(--zs-success);box-shadow:none}
.zs-tabs{position:relative;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.zs-tabs--underline{border-bottom:1px solid var(--zs-hairline)}
.zs-tabs__item{position:relative;z-index:1;display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 14px;font-size:14.5px;font-weight:600;color:var(--zs-text-secondary);white-space:nowrap}
.zs-tabs__item.is-active{color:var(--zs-text)}
.zs-tabs__item .zs-badge{height:18px;min-width:18px;line-height:18px;font-size:11px}
.zs-tabs__ind{position:absolute;left:0;bottom:-1px;height:2.5px;border-radius:2px;background:var(--zs-accent);opacity:0;pointer-events:none}
.zs-tabs--pill{padding:3px;border-radius:var(--zs-r-pill);background:var(--zs-surface-2)}
.zs-tabs--pill .zs-tabs__item{height:34px;border-radius:var(--zs-r-pill)}
.zs-tabs--pill .zs-tabs__ind{top:3px;bottom:auto;border-radius:var(--zs-r-pill);background:var(--zs-control-active);box-shadow:var(--zs-shadow-sm)}
/* gestures: swipe rows, pull-to-refresh, swipe-to-reply */
.zs-swipe{position:relative;overflow:hidden}
.zs-swipe__content{position:relative;z-index:1;background:var(--zs-ch-bg,var(--zs-surface));touch-action:pan-y}
.zs-swipe__actions{position:absolute;top:0;bottom:0;display:flex;visibility:hidden}
.zs-swipe__actions--left{left:0}
.zs-swipe__actions--right{right:0}
.zs-swipe__action{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:76px;color:var(--zs-lit-ffffff);font-size:12px;font-weight:600;transition:flex-grow var(--zs-dur-fast) var(--zs-ease-standard)}
.zs-swipe__action .zi{width:22px;height:22px}
.zs-swipe__action--archive{background:var(--zs-ch-accent,var(--zs-accent))}
.zs-swipe__action--read{background:var(--zs-info)}
.zs-swipe__action--pin,.zs-swipe__action--more{background:var(--zs-tile-gray)}
.zs-swipe__action--danger{background:var(--zs-danger)}
.zs-swipe__actions.is-full{left:0;right:0}
.zs-swipe__actions--left.is-full .zs-swipe__action:first-child,.zs-swipe__actions--right.is-full .zs-swipe__action:last-child{flex:1}
.zs-ptr{position:absolute;top:0;left:50%;z-index:var(--zs-z-raised);display:grid;place-items:center;width:36px;height:36px;margin-top:-42px;border-radius:50%;background:var(--zs-elevated);box-shadow:var(--zs-shadow-md),0 0 0 1px var(--zs-hairline);pointer-events:none;opacity:0}
.zs-ptr--fixed{position:fixed;top:calc(var(--zs-safe-top) + var(--zs-topbar-h))}
.zs-ptr__spin{width:20px;height:20px;border-radius:50%;border:2.25px solid var(--zs-accent-soft-2);border-top-color:var(--zs-accent)}
.zs-ptr.is-armed .zs-ptr__spin{border-color:var(--zs-accent);border-top-color:var(--zs-accent-soft-2)}
.zs-ptr.is-loading .zs-ptr__spin{animation:zs-spin .8s linear infinite}
.zs-reply-hint{position:absolute;left:8px;top:50%;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--zs-overlay-press);color:var(--zs-text-secondary);opacity:0;pointer-events:none}
.zs-confetti{position:fixed;inset:0;z-index:var(--zs-z-tooltip);overflow:hidden;pointer-events:none}
.zs-confetti__p{position:absolute;width:8px;height:12px;margin:-6px 0 0 -4px;border-radius:2px;background:var(--zs-chart-1)}
.zs-confetti__p--2{background:var(--zs-chart-2)}.zs-confetti__p--3{background:var(--zs-chart-3)}.zs-confetti__p--4{background:var(--zs-chart-4)}.zs-confetti__p--5{background:var(--zs-chart-5)}
.zs-confetti__p.is-round{width:9px;height:9px;border-radius:50%}
/* charts (design .zs-chart + series slots, tooltip, table toggle) */
.zs-chartbox{position:relative;display:grid;gap:10px;min-width:0}
.zs-chart__stage{position:relative;min-width:0}
.zs-chart__host>svg{display:block;width:100%;height:auto}
.zs-chart:focus-visible{outline:2px solid var(--zs-accent);outline-offset:4px;border-radius:8px}
.zs-chart__s1{--c:var(--zs-chart-1)}.zs-chart__s2{--c:var(--zs-chart-2)}.zs-chart__s3{--c:var(--zs-chart-3)}.zs-chart__s4{--c:var(--zs-chart-4)}.zs-chart__s5{--c:var(--zs-chart-5)}
.zs-chart__line{stroke:var(--c,var(--zs-chart-1));stroke-width:2}
.zs-chart__line.zs-chart__line--muted{stroke:var(--zs-text-tertiary);stroke-width:1.5}
.zs-chart__area{fill:var(--c,var(--zs-chart-1));fill-opacity:.1}
.zs-chart__bar{fill:var(--c,var(--zs-chart-1));transition:opacity var(--zs-dur-fast)}
.zs-chart__bar:hover{opacity:.8}
.zs-chart__dot{fill:var(--c,var(--zs-chart-1));stroke:var(--zs-surface);stroke-width:2}
.zs-chart__endlabel,.zs-chart__value{fill:var(--zs-text-secondary);font-size:11.5px;font-weight:650;font-variant-numeric:tabular-nums}
.zs-chart__axis--cat{fill:var(--zs-text-secondary);font-size:12px}
.zs-chart__cross{stroke:var(--zs-chart-axis);stroke-width:1;pointer-events:none}
.zs-chart__hit{fill:transparent;cursor:crosshair}
.zs-chart__track{fill:none;stroke:var(--zs-surface-2)}
.zs-chart__seg{fill:none;stroke:var(--c);cursor:pointer}
.zs-legend__item{display:inline-flex;align-items:center}
.zs-legend .zs-legend__key{background:var(--c,var(--zs-chart-1))}
.zs-legend .zs-legend__key--line{width:14px;height:3px;border-radius:2px;vertical-align:middle}
.zs-legend__scale{display:inline-flex;align-items:center;gap:4px}
.zs-legend .zs-heat__key{width:12px;height:12px;margin:0;border-radius:3px;background:var(--zs-chart-1)}
.zs-legend .zs-heat__cell--0{background:var(--zs-surface-2)}
.zs-heat__cell--0{fill:var(--zs-surface-2)}
.zs-heat__cell--1,.zs-heat__cell--2,.zs-heat__cell--3,.zs-heat__cell--4,.zs-heat__cell--5{fill:var(--zs-chart-1)}
.zs-heat__cell--1{fill-opacity:.2;opacity:.2}.zs-heat__cell--2{fill-opacity:.38;opacity:.38}.zs-heat__cell--3{fill-opacity:.56;opacity:.56}.zs-heat__cell--4{fill-opacity:.76;opacity:.76}
svg .zs-heat__cell--1,svg .zs-heat__cell--2,svg .zs-heat__cell--3,svg .zs-heat__cell--4{opacity:1}
.zs-chart__tip-box{position:absolute;left:0;top:0;z-index:2;min-width:110px;padding:8px 10px;border-radius:12px;background:var(--zs-elevated);box-shadow:var(--zs-shadow-lg),0 0 0 1px var(--zs-hairline);font-size:12.5px;line-height:18px;pointer-events:none;transition:transform 100ms var(--zs-ease-standard)}
.zs-chart__tip-title{margin-bottom:2px;font-size:11.5px;color:var(--zs-text-tertiary)}
.zs-chart__tip-row{display:flex;align-items:center;gap:6px;white-space:nowrap}
.zs-chart__tip-row b{font-variant-numeric:tabular-nums}
.zs-chart__tip-row span{color:var(--zs-text-secondary)}
.zs-chart__tip-key{width:12px;height:3px;border-radius:2px;background:var(--c)}
.zs-chart__foot{display:flex;justify-content:flex-end}
.zs-chart__toggle{padding:6px 0;font-size:12.5px}
.zs-chart__empty{padding:20px;text-align:center;font-size:13px;color:var(--zs-text-tertiary)}
.zs-donut{position:relative;margin:0 auto}
.zs-donut>svg{display:block}
.zs-donut__center{position:absolute;inset:0;display:grid;place-content:center;text-align:center;pointer-events:none}
.zs-donut__center b{font-size:22px;line-height:26px;font-weight:750;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.zs-donut__center span{font-size:12px;color:var(--zs-text-secondary)}
.zs-funnel{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.zs-funnel__top{display:flex;justify-content:space-between;gap:12px;margin-bottom:6px;font-size:13.5px}
.zs-funnel__value{font-variant-numeric:tabular-nums}
.zs-funnel__value span,.zs-funnel__conv{color:var(--zs-text-tertiary)}
.zs-funnel__track{height:10px;border-radius:5px;background:var(--zs-surface-2);overflow:hidden}
.zs-funnel__fill{display:block;height:100%;border-radius:5px;background:var(--c)}
.zs-funnel__conv{margin-top:4px;font-size:11.5px}
/* QR */
.zs-qr{display:block;max-width:100%;height:auto;border-radius:14px}
.zs-qr__bg,.zs-qr__plate{fill:var(--zs-lit-ffffff)}
.zs-qr__dots{fill:var(--zs-lit-16161c)}
.zs-qr__logo{fill:var(--zs-violet-500)}
.zs-qr__logo--whatsapp-glyph{fill:var(--zs-wa-green-strong)}
.zs-qr__logo--telegram-glyph{fill:var(--zs-tg-accent)}
.zs-qr__glyph{color:var(--zs-lit-ffffff);--zi-stroke:2.4}
/* tour (02-b §4) */
.zs-tour{position:fixed;inset:0;z-index:var(--zs-z-modal)}
.zs-tour__mask{position:absolute;inset:0;width:100%;height:100%}
.zs-tour__scrim{fill:var(--zs-tour-scrim)}
.zs-tour__ring{stroke:var(--zs-tour-ring);stroke-width:2;stroke-opacity:.6;pointer-events:none}
.zs-tour__card{position:fixed;left:0;top:0;width:min(320px,calc(100vw - 32px));padding:16px;border-radius:20px;background:var(--zs-elevated);color:var(--zs-text);box-shadow:var(--zs-shadow-xl),0 0 0 1px var(--zs-hairline);outline:none}
.zs-tour__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.zs-tour__progress{font-family:var(--zs-font-mono);font-size:12px;font-weight:600;color:var(--zs-accent-text)}
.zs-tour__skip{height:32px;padding:0 4px;font-size:13.5px;font-weight:600;color:var(--zs-text-secondary)}
.zs-tour__title{font-size:17px;line-height:22px;font-weight:700;letter-spacing:-.015em}
.zs-tour__text{margin-top:4px;font-size:14px;line-height:20px;color:var(--zs-text-secondary)}
.zs-tour__actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}