/* БИЗПРАВ Диск — app layer on top of Evergreen + drive + disk (ui.css). Only layout for a real
   full-screen app and the 4-level access pills; components themselves come from the approved kit. */

body { background: var(--bg); min-height: 100vh; }
#root { min-height: 100vh; }
.boot { min-height: 100vh; display: grid; place-items: center; color: var(--text-muted); }
.grow { flex: 1; min-width: 0; }
.only-phone { display: none !important; }
[hidden] { display: none !important; }

/* ── access pills: «Категория · n/4», no bars, no level names ── */
.lvl { gap: 0; padding: 0 10px; min-width: 42px; justify-content: center; font-weight: 700; letter-spacing: .01em; }
.lvl i { display: none; }
.lvl[data-l='4'] { background: color-mix(in srgb, var(--emerald) 18%, var(--md-sys-color-surface-container-high)); }
.lvl.is-need { background: transparent; }
.acc { gap: 8px; }
.acc .cat { min-width: 0; }
.ftable td:nth-child(3) .acc .cat { min-width: 112px; }
.lvlseg.lvl4, .lvlrow.lvl4, .mlvl.lvl4 { grid-template-columns: repeat(4, 1fr); }
.lvlseg button b { font-size: 1.05rem; }
.mini-pill { height: 22px !important; font-size: .7rem !important; padding: 0 8px !important; gap: 4px; }
.pill-dark { background: var(--void); color: var(--lime); }
.acc-preview { display: flex; align-items: center; gap: 8px; font-size: .875rem; color: var(--text-muted); }

/* ── app shell ── */
.app-frame { border-radius: 0; box-shadow: none; overflow: visible; background: var(--bg); min-height: 100vh; }
.app-inner { min-width: 0 !important; min-height: 100vh; align-items: start; }
.app-inner > .drawer { position: sticky; top: 12px; height: calc(100vh - 24px); min-height: 0; overflow-y: auto; scrollbar-width: none; }
.app-inner > .drawer::-webkit-scrollbar { display: none; }
.app-inner .frame-main { min-height: calc(100vh - 24px); }
.app-inner .appbar { position: sticky; top: 0; z-index: 20; }
.app-inner .frame-body { padding-bottom: 40px; }
.nav-item .grow { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nav-item.is-closed { opacity: .55; }
.drawer-foot { color: #fff; }
.drawer-foot small { display: block; }
.avatar-btn { border: 0; background: none; padding: 0; cursor: pointer; border-radius: 50%; }
.appbar .search { flex: 0 1 520px; }
.appbar .icon-btn { color: rgb(255 255 255 / .8); }
.demo-chip { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border: 0; border-radius: 999px; background: rgb(184 230 115 / .16); color: var(--lime); font: var(--type-label-large); font-size: .78rem; cursor: pointer; white-space: nowrap; }
.demo-chip:hover { background: rgb(184 230 115 / .26); }
.app-bnav { display: none; }
.drawer-scrim { display: none; }

/* list + side panel */
.list-wrap { display: flex; gap: 12px; align-items: flex-start; }
.list-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.side-host:empty { display: none; }
.side-host { position: sticky; top: calc(var(--app-bar-h) + 16px); }
.side-host .side { width: 300px; max-height: calc(100vh - var(--app-bar-h) - 40px); overflow-y: auto; }
.side-host .side.pside { width: 330px; }
.side-head b { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.side-foot { padding: 0 16px 16px; display: flex; gap: 8px; margin-top: auto; }
.side-preview { cursor: pointer; }
.kv dd.wrap { white-space: normal; display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.mini-acts { padding: 8px 16px 16px; display: flex; flex-direction: column; gap: 10px; font-size: .8125rem; }
.mini-acts small { display: block; color: var(--text-muted); font-size: .72rem; }
.side .versions { padding: 8px 8px 12px; }
.ftable tbody tr { cursor: pointer; }
.ftable tbody tr.is-locked { cursor: pointer; }
.ftable .cell-main { max-width: 46ch; overflow: hidden; text-overflow: ellipsis; display: block; }
.ftable .star { color: var(--brass, #c9a227); fill: currentColor; }
.table-foot.plain { background: none; }
.tile-thumb img { width: 100%; height: 100%; object-fit: cover; }
.tile.is-locked { opacity: .7; }
.tile-meta small { display: flex; margin-top: 6px; }
.fine-note { display: flex; align-items: center; gap: 6px; font-size: .78rem; margin: 0; }
.sel { height: 40px; padding: 0 12px; border-radius: 999px; border: 0; background: var(--md-sys-color-surface-container-high); color: var(--fg); font: var(--type-label-large); font-size: .8125rem; }
.table-toolbar .chips { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.toolbar .path { min-width: 0; }
.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.bk-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; align-items: start; }
.req-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: 12px; align-items: start; }
.req .alert { margin: 0; }
.req-deny { grid-column: 1 / -1; }
.danger-outline { color: var(--md-sys-color-error) !important; box-shadow: inset 0 0 0 1px var(--md-sys-color-error) !important; }
.role-row { margin: 0 12px 8px; border-top: 0 !important; }
.side-scroll { overflow-y: auto; }
.chain.is-bad { background: rgb(255 120 120 / .16); color: #ffb4ab; }
.jtable td { vertical-align: middle; }
.restore-steps { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 8px; line-height: 1.5; }
.xg td { max-width: 280px; overflow: hidden; text-overflow: ellipsis; }
code { font: 600 .82em ui-monospace, SFMono-Regular, Menlo, monospace; padding: 1px 6px; border-radius: 6px; background: var(--md-sys-color-surface-container-high); }
.on-ink code { background: rgb(255 255 255 / .1); color: #fff; }

/* menus, notifications, toasts */
.pop-menu { position: fixed; z-index: 120; }
.notif-menu { width: 340px; max-height: 70vh; overflow-y: auto; }
.notif { display: flex; gap: 10px; padding: 10px 12px; border-radius: 12px; font-size: .8125rem; }
.notif.is-new { background: color-mix(in srgb, var(--lime) 18%, transparent); }
.notif .icon { flex: none; margin-top: 2px; color: var(--accent-text); }
.notif b { display: block; }
.notif small { display: block; color: var(--text-muted); }
.notif i { font-style: normal; font-size: .7rem; color: var(--text-muted); }
#toasts { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 200; display: flex; flex-direction: column; gap: 8px; align-items: center; pointer-events: none; }
#toasts .snackbar { pointer-events: auto; box-shadow: var(--md-sys-elevation-level3); animation: toast-in .2s ease-out; transition: opacity .3s, transform .3s; }
#toasts .snackbar.is-out { opacity: 0; transform: translateY(8px); }
#toasts .snackbar .icon { vertical-align: -4px; color: #ffb4ab; }
@keyframes toast-in { from { opacity: 0; transform: translateY(10px); } }
.upload-queue { position: fixed; right: 24px; bottom: 24px; z-index: 150; }
.queue-head > .icon { color: var(--lime); }
body.is-dragging::after { content: 'Отпустите — откроется экран импорта'; position: fixed; inset: 12px; z-index: 300; display: grid; place-items: center; border-radius: 28px; border: 3px dashed var(--lime); background: color-mix(in srgb, var(--void) 70%, transparent); color: var(--lime); font: 800 1.5rem/1.2 var(--font); pointer-events: none; }

/* dialogs */
.scrim.top { place-items: start center; padding-top: 10vh; }
.scrim .dialog { max-height: calc(100vh - 32px); overflow-y: auto; }
.dialog .q-chips.cats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 8px; }

/* ── auth ── */
.auth-page { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; padding: 24px; background: var(--bg); }
.auth-page > .frame { width: min(1180px, 100%); }
.auth-err:empty { display: none; }
.otp.is-bad input { box-shadow: inset 0 0 0 2px var(--md-sys-color-error); }
.auth-form .otp { margin: 4px 0 18px; }
.auth-form .stepper { margin-bottom: 4px; }
.qr-img { width: 150px; height: 150px; padding: 8px; border-radius: 18px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); flex: none; image-rendering: pixelated; }
.invite-wrap { width: min(820px, 100%); }
.demo-panel { width: min(1180px, 100%); padding: 18px; border-radius: 28px; background: var(--card-bg); box-shadow: var(--shadow); }
.demo-head { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; margin-bottom: 12px; font-size: .8125rem; color: var(--text-muted); }
.demo-head b { color: var(--fg); font: var(--type-title-medium); }
.demo-head .icon { color: var(--accent-text); align-self: center; }
.demo-users { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 8px; }
.demo-user { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 0; border-radius: 16px; background: var(--md-sys-color-surface-container-high); color: var(--fg); text-align: left; cursor: pointer; font: inherit; }
.demo-user:hover, .demo-user.is-on { box-shadow: inset 0 0 0 2px var(--emerald); }
.demo-user b { display: block; font-size: .875rem; }
.demo-user small { display: block; font-size: .72rem; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── import ── */
.imp-scrim { padding: 16px; }
.imp { width: min(1200px, 100%); max-height: calc(100vh - 32px); }
.imp-files { overflow-y: auto; }
.imp-main { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.imp-body { overflow-y: auto; flex: 1; }
.imp-name { width: 100%; border: 0; background: transparent; color: var(--fg); font: var(--type-title-medium); padding: 2px 0; border-bottom: 1px dashed transparent; }
.imp-name:hover, .imp-name:focus { outline: none; border-bottom-color: var(--line); }
.imp-thumb { width: 56px; height: 56px; object-fit: cover; border-radius: 12px; }
.imp-dup { margin: 12px 24px 0; }
.q-why b { font-weight: 700; }
.ac { position: relative; }
.ac-list { position: absolute; top: calc(100% + 6px); left: 0; z-index: 5; min-width: 320px; }
.ac-list > div { cursor: pointer; }

/* ── viewer + versions ── */
.full-view { min-height: 100vh; }
.full-msg { padding: 10vh 16px; max-width: 640px; margin: 0 auto; }
.viewer-ed, .versions-ed { min-height: 100vh; grid-template-rows: auto 1fr; }
.ed-bar { position: sticky; top: 0; z-index: 10; flex-wrap: wrap; }
.ed-bar .ed-title { min-width: 0; }
.ed-bar .ed-title b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; max-width: 48vw; }
.ed-bar .lvl { background: rgb(255 255 255 / .12); color: #fff; }
.viewer-ed .oo { grid-template-rows: 1fr; min-height: calc(100vh - 90px); }
.viewer-ed .oo-canvas { overflow: auto; align-content: start; gap: 12px; }
.oo-canvas .doc-page { height: auto; aspect-ratio: auto; min-height: 780px; font-size: .9rem; line-height: 1.65; padding: 64px 72px; width: min(780px, 100%) !important; }
.doc-page h4 { font-size: 1.05rem; margin-bottom: 14px; }
.doc-page p { margin: 0 0 10px; text-align: justify; }
.oo-canvas .text-page { height: auto; aspect-ratio: auto; min-height: 600px; white-space: pre-wrap; font: .85rem/1.6 ui-monospace, SFMono-Regular, Menlo, monospace; width: min(780px, 100%) !important; }
.pdf-frame { width: min(1000px, 100%); height: calc(100vh - 130px); border: 0; border-radius: 6px; background: #fff; box-shadow: 0 2px 8px rgb(0 0 0 / .15); }
.img-stage img { max-width: 100%; max-height: calc(100vh - 140px); border-radius: 6px; box-shadow: 0 6px 20px rgb(0 0 0 / .2); }
.sheet-view { width: 100%; max-width: 1200px; overflow: hidden; color: var(--fg); font-family: var(--font); }
.sheet-scroll { overflow: auto; max-height: calc(100vh - 220px); padding: 16px; }
.oo-note { position: static; margin: 0 auto; }
.versions-ed .vd { padding: 12px; min-height: calc(100vh - 80px); align-items: start; }
.versions-ed .vd > .card { max-height: calc(100vh - 100px); overflow-y: auto; }
.ver .pick { border: 0; cursor: pointer; opacity: .35; margin-left: 2px; }
.ver .pick.is-sel { opacity: 1; }
.ver .pick:hover { opacity: .8; }
.vsum { display: block; font-size: .72rem; color: var(--text-muted); margin-top: 2px; }
.vpick { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px 0 6px; border-radius: 999px; background: var(--md-sys-color-surface-container-high); font: var(--type-label-large); font-size: .8125rem; }
.vpick .pick { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--void); color: var(--lime); font: 800 .7rem/1 var(--font); }
.vpick .pick.b { background: var(--emerald); color: var(--void); }
.pickbox { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; background: var(--void); color: var(--lime); font: 800 .62rem/1 var(--font); }
.pickbox.b { background: var(--emerald); color: var(--void); }
.chgnav [data-prev] .icon { transform: rotate(180deg); }
.diff-card { display: flex; flex-direction: column; }
.sheet-diff { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(260px, 1fr); }
.cell-side { padding: 16px 20px; border-left: 1px solid var(--line); display: flex; flex-direction: column; gap: 8px; }
.xg td.is-cur { outline: 3px solid var(--lime); }

/* inbox */
.scans .paper img { width: 100%; height: 100%; object-fit: cover; }
.scan b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }

/* ── phone ── */
@media (max-width: 760px) {
  .only-phone { display: inline-grid !important; }
  .logo.only-phone { display: inline-flex !important; }
  .mrow > .icon { transform: rotate(-90deg); }
  .hide-phone { display: none !important; }
  .app-inner { display: block !important; padding: 0 !important; }
  .app-inner > .drawer { position: fixed; z-index: 90; left: 0; top: 0; bottom: 0; height: 100vh; width: 290px; border-radius: 0 28px 28px 0; transform: translateX(-105%); transition: transform .25s ease; }
  body.drawer-open .app-inner > .drawer { transform: none; }
  body.drawer-open .drawer-scrim { display: block; position: fixed; inset: 0; z-index: 80; background: color-mix(in srgb, var(--md-sys-color-scrim) 45%, transparent); }
  .app-inner .appbar { border-radius: 0 0 24px 24px; padding: 8px 10px; gap: 6px; }
  .appbar .search kbd, .demo-chip, #themeBtn { display: none; }
  .appbar .search { flex: 1; }
  .app-inner .frame-body { padding: 12px 12px 110px; }
  .app-bnav { display: flex; position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 70; }
  .app-bnav .fab-mid { flex: none; width: 56px; align-self: center; height: 48px; border-radius: 18px; background: var(--emerald); color: var(--void); margin: 0 4px; display: grid; place-items: center; }
  .toolbar { flex-wrap: wrap; }
  .toolbar .chips { overflow-x: auto; flex-wrap: nowrap; max-width: 100%; }
  .list-wrap { display: block; }
  .side-host { position: fixed; inset: auto 0 0 0; z-index: 95; top: auto; }
  .side-host .side, .side-host .side.pside { width: 100%; max-height: 80vh; border-radius: 28px 28px 0 0; }
  .mcard { padding: 4px 12px; }
  .mrow { cursor: pointer; color: inherit; }
  .mrow .s .lvl { height: 20px; font-size: .68rem; padding: 0 6px; min-width: 0; }
  .kpi-grid { grid-template-columns: 1fr 1fr; }
  .bk-grid, .req-grid { grid-template-columns: 1fr; }
  .table-card { overflow-x: auto; }
  .imp { grid-template-columns: 1fr; border-radius: 24px; }
  .imp-files { max-height: 30vh; }
  .dialog .q-chips.cats { grid-template-columns: 1fr 1fr; }
  .auth-page { padding: 0; justify-content: flex-start; }
  .auth-page > .frame { border-radius: 0; }
  .auth-art { display: none; }
  .demo-panel { border-radius: 0; }
  .demo-users { grid-template-columns: 1fr; }
  .vd, .sheet-diff { grid-template-columns: 1fr !important; }
  .ed-bar .ed-title b { max-width: 60vw; }
  .ed-bar .ctag, .ed-bar .btn-glass { display: none; }
  .doc-page { padding: 28px 22px; min-height: 0; }
  .viewer-ed .oo { margin: 6px; }
  .settings { grid-template-columns: 1fr !important; }
  .settings .subnav { display: none; }
}

/* side panel: keep values inside 300px */
.side { overflow-x: hidden; }
.side .kv { grid-template-columns: auto minmax(0, 1fr); }
.side .kv dd { min-width: 0; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 4px; }
.side .kv dd .ctag { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ═════════ v2 ═════════ */
/* level circles: 1 blue · 2 green · 3 orange · 4 red (number inside = readable without colour) */
:root { --lv1: #2f6fd6; --lv2: #1f9d6b; --lv3: #e2841a; --lv4: #d63c3c; }
.lv { display: inline-grid; place-items: center; flex: none; width: 24px; height: 24px; border-radius: 50%; color: #fff; font: 800 .78rem/1 var(--font); font-variant-numeric: tabular-nums; box-shadow: inset 0 0 0 1px rgb(0 0 0 / .06); }
.lv1 { background: var(--lv1); } .lv2 { background: var(--lv2); } .lv3 { background: var(--lv3); } .lv4 { background: var(--lv4); }
.lv.is-need { background: transparent; color: var(--fg); box-shadow: inset 0 0 0 2px currentColor; }
.lv1.is-need { color: var(--lv1); } .lv2.is-need { color: var(--lv2); } .lv3.is-need { color: var(--lv3); } .lv4.is-need { color: var(--lv4); }
.acc { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.acc .cat { min-width: 0 !important; }
.cat .icon + .icon { margin-left: -4px; }
.cat.is-need { padding: 0 10px; height: 26px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--md-sys-color-outline); color: var(--text-muted); }
.special { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 999px; background: color-mix(in srgb, var(--lv3) 16%, transparent); color: color-mix(in srgb, var(--lv3) 70%, var(--fg)); font: 700 .66rem/1 var(--font); text-transform: uppercase; letter-spacing: .06em; }
.ro { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 999px; background: var(--md-sys-color-surface-container-high); color: var(--text-muted); font: 600 .7rem/1 var(--font); }
.ro.on-dark { background: rgb(255 255 255 / .1); color: rgb(255 255 255 / .75); height: 30px; }
.ed-bar .acc .cat { color: #fff; } .ed-bar .acc .cat .icon { color: var(--emerald-glow); }
.ed-bar .special { background: rgb(255 255 255 / .12); color: var(--lime); }

/* level pickers */
.lvpick, .lvrow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; padding: 4px; border-radius: 20px; background: var(--md-sys-color-surface-container-high); }
.lvrow { margin: 0 20px 6px; }
.lvpick button, .lvrow button { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 6px; border: 0; border-radius: 16px; background: transparent; color: var(--text-muted); font: var(--type-label-large); font-size: .72rem; cursor: pointer; text-align: center; }
.lvpick button[aria-pressed='true'], .lvrow button[aria-pressed='true'] { background: var(--md-sys-color-surface-bright); color: var(--fg); box-shadow: var(--md-sys-elevation-level1); }
.lvpick button:disabled { opacity: .35; cursor: not-allowed; }
.lvpick button .lv, .lvrow button .lv { width: 28px; height: 28px; font-size: .9rem; }

/* locked group row */
.locked-group { cursor: pointer; background: color-mix(in srgb, var(--md-sys-color-surface-container-high) 60%, transparent); }
.locked-group .cell-main { color: var(--text-muted); font-weight: 700; }
.lg-square { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 12px; color: #fff; font: 800 1rem/1 var(--font); }
.lg-square.lv1 { background: var(--lv1); } .lg-square.lv2 { background: var(--lv2); } .lg-square.lv3 { background: var(--lv3); } .lg-square.lv4 { background: var(--lv4); }
.lg-chev { transition: transform .2s; } .lg-chev.is-open { transform: rotate(180deg); }
tr.is-locked { background: color-mix(in srgb, var(--md-sys-color-surface-container-high) 35%, transparent); }

/* selection, drag & drop, sorting */
.float-selbar { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 140; display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 999px; background: var(--md-sys-color-inverse-surface); color: var(--md-sys-color-inverse-on-surface); box-shadow: var(--md-sys-elevation-level3); }
.float-selbar b { margin: 0 8px 0 2px; white-space: nowrap; }
.float-selbar .icon-btn { color: inherit; }
.danger-text { color: var(--md-sys-color-error) !important; }
tr.is-active td { background: color-mix(in srgb, var(--lime) 18%, transparent); }
tr.is-drop td, a.is-drop { background: color-mix(in srgb, var(--emerald) 22%, transparent) !important; box-shadow: inset 0 0 0 2px var(--emerald); }
tr[draggable='true'] { cursor: grab; }
.ftable th button[data-sort] { border: 0; background: none; font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; padding: 0; }
.ftable th[aria-sort] button::after { content: ' ↓'; color: var(--accent-text); }
.ftable th[aria-sort='ascending'] button::after { content: ' ↑'; }
.where-cell { color: var(--text-muted); font-size: .8125rem; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.ftype.thumb { padding: 0; overflow: hidden; }
.ftype.thumb img { width: 100%; height: 100%; object-fit: cover; }
.inherit-note { display: flex; align-items: center; gap: 8px; font-size: .8125rem; color: var(--text-muted); margin: -6px 0 0 4px; }

/* side panel preview: real text or real thumbnail */
.side-preview { overflow: hidden; }
.side-preview img { width: 100%; height: 100%; object-fit: contain; }
.snippet-paper { align-self: stretch; width: 86%; margin: 12px auto; padding: 14px 16px; background: #fff; color: #333; border-radius: 4px; box-shadow: 0 4px 14px -6px rgb(0 0 0 / .35); font: .62rem/1.5 Arial, sans-serif; overflow: hidden; mask-image: linear-gradient(#000 70%, transparent); }
.snippet-none { display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--text-muted); font-size: .75rem; }
.links { padding: 4px 8px; }
.link-row { display: flex; align-items: center; gap: 6px; padding: 8px; border-radius: 12px; }
.link-row + .link-row { border-top: 1px solid var(--line); }
.link-row b { display: block; font-size: .8125rem; } .link-row small { color: var(--text-muted); font-size: .72rem; }
.side .tabs .tab { padding: 12px 8px; font-size: .8rem; }

/* drawer: client-first */
.nav-sub { min-height: 36px !important; padding-left: 24px; font-size: .85rem !important; }
.dot-tag { display: inline-grid; place-items: center; min-width: 30px; height: 18px; padding: 0 4px; border-radius: 6px; background: rgb(255 255 255 / .1); font: 700 .58rem/1 var(--font); color: var(--emerald-glow); }
.nav-item[aria-current='page'] .dot-tag { background: rgb(10 22 14 / .12); color: var(--void); }

/* home */
.home-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding: 28px 32px; border-radius: 28px; }
.home-hero h2 { margin: 10px 0 0; font-size: 2rem; color: #fff; }
.home-search { display: flex; align-items: center; gap: 12px; flex: 0 1 520px; min-height: 56px; padding: 0 18px; border: 0; border-radius: 999px; background: rgb(255 255 255 / .1); box-shadow: inset 0 0 0 1px rgb(255 255 255 / .16); color: rgb(255 255 255 / .75); font: var(--type-body-large); cursor: pointer; text-align: left; }
.home-search span { flex: 1; } .home-search .icon { color: var(--lime); } .home-search kbd { color: #fff; background: rgb(255 255 255 / .12); }
.home-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 12px; align-items: start; }
.home-recent, .home-clients { padding: 4px 8px 10px; }
.hr-row, .hc { display: flex; align-items: center; gap: 12px; padding: 10px 10px; border-radius: 14px; color: inherit; }
.hr-row:hover, .hc:hover { background: var(--md-sys-color-surface-container-high); }
.hr-row b, .hc b { display: block; font: var(--type-label-large); font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hr-row small, .hc small { display: flex; align-items: center; gap: 6px; color: var(--text-muted); font-size: .75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hc-all { border-top: 1px solid var(--line); border-radius: 0 0 14px 14px; margin-top: 4px; }

/* pickers & dialogs */
.pick-list { max-height: 50vh; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; }
.pick-row { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 0; border-radius: 14px; background: transparent; color: var(--fg); text-align: left; cursor: pointer; font: inherit; }
.pick-row:hover { background: var(--md-sys-color-surface-container-high); }
.pick-row b { display: block; font-size: .875rem; } .pick-row small { display: block; font-size: .72rem; color: var(--text-muted); }
.pick-row > .icon { color: var(--accent-text); }
.scrim .share { max-height: calc(100vh - 32px); overflow-y: auto; width: min(560px, 100%); }
.share-body .alert { margin: 0; }
.mono.pw { font-size: 1rem; letter-spacing: .04em; color: var(--fg); }
.scrim.wide .dialog { width: min(1000px, 100%); }
.conflict .alert { margin-bottom: 12px; }
.conflict-acts { flex-wrap: wrap; }
.conflict-acts .btn { flex-direction: column; height: auto; min-height: 44px; padding-top: 8px; padding-bottom: 8px; gap: 2px; }
.conflict-acts .btn small { font-weight: 500; font-size: .68rem; opacity: .75; }
.cmp { max-height: 52vh; overflow-y: auto; border-radius: 16px; box-shadow: inset 0 0 0 1px var(--line); margin-bottom: 14px; }
.cmp > p { padding: 16px; margin: 0; }
.cmp .diff-bar { position: sticky; top: 0; z-index: 2; background: var(--md-sys-color-surface-bright); }
.cmp .cell-chg { padding: 16px; }
.cmp-vis { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 12px; }
.cmp-vis img { width: 100%; max-height: 40vh; object-fit: contain; border-radius: 8px; background: var(--md-sys-color-surface-container-high); }
.cmp-vis figcaption { text-align: center; font-size: .78rem; color: var(--text-muted); margin-top: 6px; }
.sugg.from-folder { background: var(--md-sys-color-surface-container-high); color: var(--text-muted); }
.imp-body[data-disabled] { opacity: .45; pointer-events: none; }
.sheet-scrim-l { place-items: end center; padding: 0; }
.phone-sheet { position: relative; width: 100%; max-width: 520px; }

/* people: rights per category */
.tri { display: flex; flex-direction: column; gap: 4px; padding: 0 20px 12px; }
.tri-row { display: flex; align-items: center; gap: 10px; padding: 6px 4px; font-size: .875rem; }
.tri-row > .icon { color: var(--accent-text); width: 18px; height: 18px; }
.segmented.mini button { padding: 6px 10px; font-size: .72rem; min-height: 0; }
.role-seg { margin: 0 20px 8px; display: flex; }
.role-seg button { flex: 1; }
.right { display: inline-flex; align-items: center; gap: 2px; margin-right: 8px; color: var(--accent-text); }
.right .icon { width: 16px; height: 16px; }
.right i { font-style: normal; font-size: .62rem; font-weight: 700; color: var(--text-muted); }
.right:not(.is-edit) .icon { opacity: .55; }
.tpl { display: flex; flex-direction: column; gap: 6px; }
.tpl-row { display: grid; grid-template-columns: minmax(0, 1fr) 150px 64px auto; gap: 6px; align-items: center; }
.tpl-row input.sel { border-radius: 12px; }
.dev-req { box-shadow: inset 0 0 0 2px var(--lv3), var(--shadow); }

/* viewer: real Word rendering */
.docx-host { width: 100%; display: flex; justify-content: center; }
.docx-host .docx-wrapper { background: transparent !important; padding: 0 !important; }
.docx-host section.docx { box-shadow: 0 2px 10px rgb(0 0 0 / .15) !important; margin-bottom: 16px !important; }

/* camera scan */
.scan-scrim { padding: 0; place-items: stretch; }
.scan-ui { display: grid; grid-template-rows: auto 1fr auto; height: 100vh; width: 100%; background: var(--bg); }
.scan-top, .scan-bot { display: flex; align-items: center; gap: 10px; padding: 12px 16px; }
.scan-top b { font: var(--type-title-large); }
.scan-bot { justify-content: center; border-top: 1px solid var(--line); }
.scan-pages { overflow-y: auto; padding: 12px 16px; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; align-content: start; }
.scan-page { border-radius: 16px; background: var(--card-bg); box-shadow: var(--shadow); overflow: hidden; }
.sp-img { aspect-ratio: 3/4; display: grid; place-items: center; background: var(--md-sys-color-surface-container-high); }
.sp-img img { max-width: 100%; max-height: 100%; }
.sp-acts { display: flex; align-items: center; gap: 2px; padding: 6px; }
.sp-acts b { margin: 0 auto 0 6px; }
.sp-acts [data-up] .icon { transform: rotate(90deg); }
.crop-dlg { width: min(560px, 100%); }
.crop-stage { position: relative; user-select: none; touch-action: none; margin-bottom: 14px; }
.crop-stage img { width: 100%; display: block; border-radius: 8px; }
.crop-box { position: absolute; box-shadow: 0 0 0 9999px rgb(0 0 0 / .45); outline: 2px solid var(--lime); }
.crop-box .h { position: absolute; width: 26px; height: 26px; border-radius: 50%; background: var(--lime); border: 3px solid #fff; touch-action: none; }
.crop-box .tl { left: -13px; top: -13px; } .crop-box .tr { right: -13px; top: -13px; } .crop-box .bl { left: -13px; bottom: -13px; } .crop-box .br { right: -13px; bottom: -13px; }
.crop-stage { overflow: hidden; border-radius: 8px; }

/* public pages (share / upload) */
body.public { background: var(--bg); }
.pub-bar { display: flex; align-items: center; gap: 12px; padding: 14px 20px; border-radius: 0 0 24px 24px; }
.pub-note { font-size: .78rem; color: rgb(255 255 255 / .6); }
.pub-main { max-width: 1040px; margin: 0 auto; padding: 24px 16px 60px; display: flex; flex-direction: column; gap: 16px; }
.pub-card { max-width: 520px; width: 100%; margin: 6vh auto 0; }
.pub-head { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 20px; background: var(--card-bg); box-shadow: var(--shadow); }
.pub-head b { display: block; font: var(--type-title-medium); } .pub-head small { color: var(--text-muted); }
.pub-view { display: flex; justify-content: center; }
.pub-view img { max-width: 100%; border-radius: 8px; box-shadow: var(--shadow); }
.pub-drop { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 28px 16px; border-radius: 20px; border: 2px dashed var(--md-sys-color-outline-variant); text-align: center; cursor: pointer; }
.pub-drop .icon { width: 32px; height: 32px; color: var(--accent-text); }
.pub-drop small { color: var(--text-muted); }
.pub-drop.is-over { border-color: var(--emerald); background: color-mix(in srgb, var(--emerald) 8%, transparent); }

@media (max-width: 760px) {
  .home-grid { grid-template-columns: 1fr; }
  .home-hero { padding: 22px 20px; }
  .home-hero h2 { font-size: 1.5rem; }
  .float-selbar { left: 8px; right: 8px; transform: none; bottom: 84px; overflow-x: auto; border-radius: 20px; }
  .tpl-row { grid-template-columns: 1fr 1fr; }
  .cmp-vis { grid-template-columns: 1fr; }
  .scrim.wide .dialog { padding: 16px; }
}
.side-host .side.pside { width: 384px; }
.role-seg button { padding: 8px 6px; font-size: .8rem; }
.tri-row .grow { white-space: nowrap; }
.scan-top .check { font-size: .85rem; white-space: nowrap; }
.scan-top b { white-space: nowrap; }