/* 跃传 · High-fidelity clickable prototype — independent, no external assets */
:root {
  color-scheme: light;
  --bg: #f7f9fc; --paper: #fff; --paper-2: #f2f6fb; --paper-3: #eaf1fb;
  --ink: #1b2a3e; --ink-strong: #0e1d30; --muted: #748195; --muted-2: #98a3b1;
  --border: #e5ebf2; --line: #edf1f5; --blue: #2468db; --blue-deep: #1458cb;
  --blue-light: #e9f1ff; --blue-border: #cbdffc; --success: #168664; --success-bg: #e9f7f0;
  --warning: #c38323; --warning-bg: #fff5e3; --danger: #cf5260; --danger-bg: #fff0f2;
  --shadow: 0 1px 2px rgb(22 43 72 / 2%), 0 8px 28px rgb(29 54 94 / 3%);
  --shadow-xl: 0 20px 70px rgb(16 36 69 / 14%);
  --radius: 15px; --side: 240px;
  font-family: "Segoe UI Variable", "Segoe UI", "Microsoft YaHei UI", "PingFang SC", sans-serif;
  font-size: 14px; -webkit-font-smoothing: antialiased;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg:#111821;--paper:#19222e;--paper-2:#222f3e;--paper-3:#293b50;
  --ink:#dce7f1;--ink-strong:#f4f8fd;--muted:#9eacbc;--muted-2:#8292a2;
  --border:#304051;--line:#2c3949;--blue:#85aeff;--blue-deep:#a2c4ff;
  --blue-light:#243c5b;--blue-border:#426088;--success:#6bd4a7;--success-bg:#213e36;
  --warning:#eec27a;--warning-bg:#403526;--danger:#ff949e;--danger-bg:#422c34;
  --shadow:0 7px 30px rgb(0 0 0 / 7%);--shadow-xl:0 26px 70px rgb(0 0 0 / 35%);
}
* { box-sizing:border-box }
html,body { min-height:100%;margin:0 }
body { background:var(--bg);color:var(--ink) }
button,input,select,textarea { font:inherit }
button { cursor:pointer }
button:disabled { cursor:not-allowed;opacity:.48;transform:none!important }
button,input,textarea,select { -webkit-tap-highlight-color:transparent }
:focus-visible { outline:3px solid #92b6f8;outline-offset:3px }
a { color:var(--blue) }
button { border:none }
svg { flex-shrink:0 }
::-webkit-scrollbar { width:9px;height:9px }
::-webkit-scrollbar-thumb { background:#bbc8d6;border:3px solid transparent;background-clip:padding-box;border-radius:12px }
#app { min-height:100vh }
.shell { display:grid;grid-template-columns:var(--side) minmax(0,1fr);min-height:100vh }
.sidebar { position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:28px 15px 16px 18px;background:var(--paper);border-right:1px solid var(--border);z-index:12 }
.brand { display:flex;align-items:center;gap:11px;padding:0 10px 32px;text-decoration:none;color:var(--ink);cursor:pointer }
.brand-symbol { width:40px;height:40px;display:grid;place-items:center;color:#fff;background:#276be6;border-radius:12px;box-shadow:0 8px 20px rgb(43 108 219 / 17%); }
.brand-name { font-size:19px;font-weight:750;letter-spacing:-.6px;line-height:1.3;color:var(--ink-strong) }
.brand-caption { font-size:10.5px;color:var(--muted);letter-spacing:.8px;margin-top:3px }
.nav-label { font-size:10px;text-transform:uppercase;color:var(--muted-2);letter-spacing:1.4px;font-weight:750;padding:6px 13px 12px }
.nav-group { margin-bottom:20px }
.nav-link { display:flex;width:100%;align-items:center;gap:13px;background:transparent;color:var(--muted);padding:12px 13px;border-radius:10px;text-align:left;margin:2px 0;font-size:13.5px;letter-spacing:.04px;font-weight:550;transition:background .16s,color .16s }
.nav-link:hover { color:var(--ink-strong);background:var(--paper-2) }
.nav-link.active { color:var(--blue);background:var(--blue-light);font-weight:680 }
.nav-link .nav-count { margin-left:auto;color:var(--blue);background:var(--paper);font-size:10px;min-width:21px;min-height:20px;display:grid;place-items:center;border-radius:7px;font-weight:700 }
.sidebar-spacer { flex:1 }
.sidebar-help { background:var(--paper-2);padding:15px 14px;border-radius:13px;margin:8px 2px 19px;position:relative;overflow:hidden }
.sidebar-help:before { content:"";position:absolute;width:65px;height:65px;border:12px solid var(--blue-border);opacity:.32;border-radius:50%;top:-38px;right:-27px }
.sidebar-help .heading { font-size:12px;font-weight:750;margin:10px 0 4px }
.sidebar-help p { font-size:11px;color:var(--muted);line-height:1.7;margin:0 }
.sidebar-bottom { padding:15px 9px 4px;border-top:1px solid var(--line);font-size:11px;color:var(--muted) }
.sidebar-bottom strong { color:var(--ink);font-weight:650 }
.main { min-width:0 }
.topbar { height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 45px;border-bottom:1px solid var(--border);background:var(--paper);position:sticky;top:0;z-index:10 }
.breadcrumb { display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12.5px }
.breadcrumb strong { color:var(--ink);font-weight:680 }
.top-actions { display:flex;align-items:center;gap:14px }
.top-separator { width:1px;height:27px;background:var(--border);margin:0 4px }
.top-identity { text-align:right;line-height:1.45 }
.top-identity strong { display:block;font-size:12.5px;font-weight:750 }
.top-identity span { font-size:10.5px;color:var(--muted) }
.avatar { width:36px;height:36px;border-radius:11px;background:#e0ebfe;color:#2865d3;display:grid;place-items:center;font-weight:750;font-size:13px;letter-spacing:.3px }
.icon-btn { width:36px;height:36px;border-radius:9px;background:transparent;color:var(--muted);display:grid;place-items:center }
.icon-btn:hover { background:var(--paper-2);color:var(--ink) }
.page { max-width:1510px;margin:0 auto;padding:36px 45px 72px }
.page-head { display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:30px }
.eyebrow { font-size:11px;color:var(--blue);letter-spacing:1.5px;font-weight:800;text-transform:uppercase;margin:0 0 10px }
h1,h2,h3,p { margin-top:0 }
h1 { font-size:27px;letter-spacing:-.9px;line-height:1.35;font-weight:770;color:var(--ink-strong);margin:0 0 9px }
h2 { font-size:16px;letter-spacing:-.25px;font-weight:740;color:var(--ink-strong);margin:0 }
h3 { font-size:13px;font-weight:740;margin:0 }
.subtitle { color:var(--muted);font-size:13px;margin:0;line-height:1.65 }
.preview-alert { background:var(--blue-light);border:1px solid var(--blue-border);border-radius:10px;color:var(--ink);padding:11px 15px;display:flex;align-items:flex-start;gap:9px;line-height:1.55;font-size:11.5px;margin-bottom:24px }
.preview-alert svg { color:var(--blue);margin-top:1px }
.preview-alert strong { font-weight:750 }
.card { background:var(--paper);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow) }
.card-pad { padding:25px }
.btn { display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:9px;padding:11px 17px;font-size:12.5px;font-weight:730;white-space:nowrap;transition:transform .14s,background .14s,color .14s,box-shadow .14s;letter-spacing:.1px }
.btn:not(:disabled):active { transform:translateY(1px) }
.btn-primary { background:var(--blue);color:white;box-shadow:0 5px 12px rgb(34 102 221 / 13%) }
.btn-primary:not(:disabled):hover { background:var(--blue-deep);box-shadow:0 6px 15px rgb(34 102 221 / 20%) }
.btn-quiet { background:var(--paper-2);color:var(--ink) }
.btn-quiet:hover { background:var(--paper-3) }
.btn-outline { background:var(--paper);border:1px solid var(--border);color:var(--ink) }
.btn-outline:hover { border-color:var(--blue-border);color:var(--blue) }
.btn-danger { background:var(--danger-bg);color:var(--danger) }
.btn-sm { padding:8px 11px;font-size:11px }
.btn-lg { padding:13px 21px;font-size:13px }
.btn-full { width:100% }
.btn-plain { background:none;color:var(--blue);padding:5px 0;font-size:11.5px;font-weight:700 }
.btn-plain:hover { text-decoration:underline }
.btn-group { display:flex;align-items:center;gap:9px;flex-wrap:wrap }
.round-icon { width:39px;height:39px;border-radius:11px;display:grid;place-items:center;background:var(--paper-2);color:var(--ink) }
.round-icon.blue { color:var(--blue);background:var(--blue-light) }
.round-icon.mint { background:#e9f5f1;color:#408b75 }
.round-icon.gold { background:#fff4e2;color:#b18a4a }
.round-icon.violet { background:#f1edff;color:#8b75bb }
.muted { color:var(--muted) }
.tiny { font-size:10.5px }
.small { font-size:11.5px }
.text-strong { font-weight:750;color:var(--ink-strong) }
.text-nowrap { white-space:nowrap }
.row { display:flex;align-items:center;gap:12px }
.row-between { display:flex;align-items:center;justify-content:space-between;gap:12px }
.section-head { display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:17px }
.section-head p { margin:5px 0 0;color:var(--muted);font-size:11.5px }
.soft-divider { height:1px;background:var(--line);margin:17px 0 }
.badge { display:inline-flex;align-items:center;gap:6px;padding:5px 8px;border-radius:7px;font-size:10px;line-height:1.3;font-weight:690;white-space:nowrap;background:var(--paper-2);color:var(--muted) }
.badge.blue { background:var(--blue-light);color:var(--blue) }
.badge.success { background:var(--success-bg);color:var(--success) }
.badge.warning { background:var(--warning-bg);color:var(--warning) }
.badge.danger { background:var(--danger-bg);color:var(--danger) }
.online-dot { width:7px;height:7px;border-radius:50%;background:#b9c2ce;display:inline-block }
.online-dot.on { background:#35b889;box-shadow:0 0 0 3px rgb(53 184 137 / 12%) }
.transfer-grid { display:grid;grid-template-columns:minmax(0,1.38fr) minmax(310px,.92fr);gap:22px;align-items:start }
.stack { display:flex;flex-direction:column;gap:22px;min-width:0 }
.upload-card { padding:23px }
.dropzone { min-height:224px;border:1.5px dashed #c5d6eb;border-radius:13px;background:linear-gradient(155deg, var(--paper-2), var(--paper) 94%);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:9px;cursor:pointer;transition:border .15s,background .15s,transform .15s;position:relative;overflow:hidden }
.dropzone:before { content:"";width:205px;height:205px;border:1px solid var(--blue-border);position:absolute;right:-115px;top:-130px;border-radius:50%;opacity:.35;pointer-events:none }
.dropzone.dragging,.dropzone:hover { border-color:var(--blue);background:var(--blue-light) }
.dropzone-icon { width:56px;height:56px;border-radius:17px;background:var(--paper);color:var(--blue);box-shadow:0 8px 30px rgb(25 84 171 / 8%);display:grid;place-items:center;margin-bottom:7px }
.dropzone h2 { font-size:16px }
.dropzone p { color:var(--muted);font-size:12px;margin:0 }
.dropzone .keys { display:flex;align-items:center;gap:6px;margin-top:6px }
.kbd { display:inline-flex;align-items:center;padding:4px 7px;border-radius:5px;border:1px solid var(--border);background:var(--paper);font-size:10px;color:var(--muted) }
.upload-card-title { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px }
.upload-tools { display:flex;gap:8px;flex-wrap:wrap;margin-top:16px }
.files-box { margin-top:15px;display:flex;flex-direction:column;gap:8px }
.queue-file { display:flex;align-items:center;gap:11px;padding:11px 12px;border:1px solid var(--border);border-radius:10px;background:var(--paper) }
.file-icon { width:36px;height:40px;display:grid;place-items:center;border-radius:8px;background:var(--paper-2);color:var(--muted) }
.file-icon.pdf { background:#fff0ee;color:#d35f59 } .file-icon.cad { background:#edf2ff;color:#627dd5 } .file-icon.sheet { background:#eaf7ef;color:#39875f } .file-icon.zip { background:#f5f0ff;color:#8a69c0 }
.file-content { flex:1;min-width:0 }
.filename { font-size:12px;font-weight:690;color:var(--ink);line-height:1.5;overflow-wrap:anywhere }
.file-meta { font-size:10.5px;color:var(--muted);margin-top:2px }
.progress-track { height:5px;background:var(--paper-2);border-radius:9px;overflow:hidden;margin-top:8px }
.progress-fill { height:100%;background:var(--blue);border-radius:9px;transition:width .18s ease }
.person-card { display:flex;gap:11px;align-items:center;padding:13px;border:1px solid var(--border);border-radius:12px;background:var(--paper);color:var(--ink);text-align:left;min-width:0;width:100%;position:relative;transition:border .15s,background .15s,transform .15s }
.person-card:not(:disabled):hover { border-color:var(--blue-border);background:var(--paper-2) }
.person-card.selected { border-color:var(--blue);background:var(--blue-light);box-shadow:0 0 0 1px var(--blue) inset }
.person-card .name { display:block;font-weight:700;font-size:11.5px;line-height:1.4;overflow-wrap:anywhere }
.person-card .meta { display:flex;align-items:center;gap:6px;color:var(--muted);font-size:10px;margin-top:5px }
.check-circle { display:grid;place-items:center;position:absolute;right:7px;top:7px;width:18px;height:18px;background:var(--blue);color:white;border-radius:50% }
.people-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px }
.search-box { height:40px;display:flex;align-items:center;gap:8px;padding:0 11px;border:1px solid var(--border);border-radius:9px;background:var(--paper);color:var(--muted) }
.search-box:focus-within { border-color:var(--blue-border);box-shadow:0 0 0 3px rgb(50 110 222 / 8%) }
.search-box input { flex:1;min-width:0;width:100%;background:none;color:var(--ink);border:0;outline:0;font-size:11.5px }
.search-box input::placeholder { color:var(--muted-2) }
.pill-tabs { display:flex;align-items:center;gap:5px;padding:3px;background:var(--paper-2);border-radius:9px }
.pill-tabs button { background:transparent;color:var(--muted);font-size:11px;border-radius:7px;padding:7px 12px;font-weight:650;white-space:nowrap }
.pill-tabs button.active { color:var(--ink-strong);background:var(--paper);box-shadow:0 1px 4px rgb(18 50 90 / 7%) }
.send-footer { border-top:1px solid var(--line);padding-top:16px;margin-top:19px;display:flex;justify-content:space-between;align-items:center;gap:12px }
.recipient-area { display:flex;flex-direction:column;gap:15px }
.recent-row { display:flex;align-items:center;gap:11px;padding:12px 0;border-bottom:1px solid var(--line) }
.recent-row:last-child { border-bottom:0;padding-bottom:0 }
.recent-details { flex:1;min-width:0 }
.recent-details .filename { white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
.recent-details .file-meta { margin-top:4px }
.recent-time { font-size:10px;color:var(--muted-2);white-space:nowrap }
.empty { text-align:center;padding:48px 24px;color:var(--muted) }
.empty .empty-symbol { width:66px;height:66px;margin:0 auto 16px;background:var(--paper-2);display:grid;place-items:center;border-radius:19px;color:var(--muted) }
.empty h3 { color:var(--ink);margin-bottom:7px;font-size:14px }
.empty p { max-width:330px;margin:0 auto;font-size:12px;line-height:1.7 }
.toolbar { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:13px;margin-bottom:21px }
.toolbar .search-box { min-width:240px }
.list-card { overflow:hidden }
.list-row { display:flex;align-items:center;gap:15px;padding:16px 20px;border-bottom:1px solid var(--line);min-height:74px }
.list-row:last-child { border-bottom:0 }
.list-row:hover { background:var(--paper-2) }
.list-content { min-width:0;flex:1 }
.list-content .filename { font-size:12.5px }
.list-sub { display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:5px;font-size:10.5px;color:var(--muted) }
.list-actions { display:flex;align-items:center;gap:8px;flex-shrink:0 }
.list-section-title { padding:15px 20px;font-size:11px;font-weight:750;color:var(--muted);background:var(--paper-2) }
.library-layout { display:grid;grid-template-columns:210px minmax(0,1fr);gap:22px;align-items:start }
.folder-nav { padding:16px }
.folder-nav button { background:transparent;color:var(--muted);padding:12px 12px;width:100%;display:flex;gap:11px;align-items:center;text-align:left;border-radius:9px;font-size:12px;margin:3px 0 }
.folder-nav button.active { background:var(--blue-light);color:var(--blue);font-weight:750 }
.folder-nav button:hover:not(.active) { background:var(--paper-2);color:var(--ink) }
.file-table { width:100%;border-collapse:collapse;text-align:left;font-size:11.5px }
.file-table th { color:var(--muted);font-size:10px;letter-spacing:.4px;text-transform:uppercase;font-weight:730;background:var(--paper-2);padding:12px 19px }
.file-table td { padding:14px 19px;border-top:1px solid var(--line);color:var(--muted) }
.file-table tr:hover td { background:var(--paper-2) }
.file-table .filename { color:var(--ink) }
.file-table .cell-name { display:flex;align-items:center;gap:11px }
.file-table .cell-name .file-icon { width:31px;height:35px }
.timeline { padding:26px 27px }
.timeline-item { display:flex;gap:16px;padding-bottom:27px;position:relative }
.timeline-item:last-child { padding-bottom:0 }
.timeline-item:not(:last-child):before { content:"";position:absolute;width:1px;background:var(--border);top:25px;left:13px;bottom:0 }
.time-symbol { width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:var(--blue-light);color:var(--blue);z-index:1 }
.timeline-item .description { flex:1 }
.timeline-item .description h3 { margin-top:3px;margin-bottom:5px }
.settings-grid,.admin-grid { display:grid;grid-template-columns:1fr 1fr;gap:20px }
.setting-row { display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 0;border-bottom:1px solid var(--line) }
.setting-row:last-child { border:0 }
.switch { width:41px;height:24px;background:#bcc7d3;border-radius:25px;padding:3px;position:relative;transition:background .15s }
.switch:before { content:"";width:18px;height:18px;display:block;background:#fff;border-radius:50%;box-shadow:0 1px 3px #5554;transition:transform .15s }
.switch.on { background:var(--blue) }
.switch.on:before { transform:translateX(17px) }
.admin-stat { padding:20px;border:1px solid var(--border);border-radius:12px;background:var(--paper) }
.admin-stat strong { display:block;font-size:24px;line-height:1.3;margin-top:10px;color:var(--ink-strong) }
.admin-stat span { font-size:11px;color:var(--muted) }
.avatar-row { display:flex;align-items:center;gap:10px }
.person-mini { width:32px;height:32px;border-radius:9px;display:grid;place-items:center;font-weight:700;font-size:11px;background:var(--paper-2);color:var(--ink) }
.account-menu { position:absolute;right:39px;top:69px;padding:9px;width:240px;border:1px solid var(--border);background:var(--paper);box-shadow:var(--shadow-xl);border-radius:12px;z-index:25 }
.account-menu h3 { font-size:10px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);padding:11px 10px }
.account-menu button { width:100%;text-align:left;padding:10px;display:flex;align-items:center;gap:10px;background:transparent;color:var(--ink);border-radius:7px }
.account-menu button:hover,.account-menu button.selected { background:var(--paper-2) }
.account-menu button small { color:var(--muted);display:block;font-size:10px;margin-top:2px }
.info-panel { background:var(--paper-2);padding:18px;border-radius:11px;font-size:11.5px;color:var(--muted);line-height:1.8 }
.info-panel strong { color:var(--ink);font-weight:740 }
.status-strip { display:flex;gap:9px;align-items:center;color:var(--success);font-size:11px;font-weight:650 }
.toast-wrap { position:fixed;bottom:27px;right:28px;z-index:110;display:flex;flex-direction:column;gap:9px;max-width:min(400px,calc(100vw - 36px)) }
.toast { display:flex;align-items:start;gap:10px;border:1px solid var(--border);padding:14px 16px;border-radius:12px;background:var(--paper);color:var(--ink);box-shadow:var(--shadow-xl);line-height:1.55;font-size:11.5px;animation:slide-in .22s ease-out }
.toast svg { color:var(--blue);margin-top:1px }
.modal-backdrop { position:fixed;inset:0;z-index:40;background:rgb(14 26 44 / 41%);display:flex;justify-content:flex-end;animation:fade-in .15s ease }
.drawer { height:100%;width:min(475px,100%);background:var(--paper);padding:28px 29px;box-shadow:var(--shadow-xl);display:flex;flex-direction:column;overflow:auto;animation:drawer-in .2s ease-out }
.drawer-section { padding:20px 0;border-top:1px solid var(--line) }
.detail-pair { display:grid;grid-template-columns:100px minmax(0,1fr);gap:12px;padding:9px 0;font-size:12px }
.detail-pair dt { color:var(--muted) }
.detail-pair dd { margin:0;color:var(--ink);overflow-wrap:anywhere }
.drawer-actions { margin-top:auto;padding-top:25px;display:flex;gap:10px }
.fake-file-preview { background:var(--paper-2);border:1px dashed var(--border);border-radius:12px;padding:30px 18px;text-align:center;color:var(--muted);line-height:1.8;font-size:11.5px }
.compact .list-row { min-height:58px;padding-top:9px;padding-bottom:9px }
.compact .recent-row {padding-top:7px;padding-bottom:7px}
.compact .queue-file {padding-top:7px;padding-bottom:7px}
.narrow-panel { max-width:900px }
.kpi-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:13px }
.page-caption { font-size:10.5px;color:var(--muted);margin:23px 0 0;line-height:1.7 }
.text-input { background:var(--paper);color:var(--ink);border:1px solid var(--border);border-radius:9px;padding:11px 12px;width:100%;outline:none;font-size:12px }
.text-input:focus { border-color:var(--blue);box-shadow:0 0 0 3px rgb(50 110 222 / 8%) }
.field-label { font-size:11px;font-weight:720;color:var(--muted);display:block;margin-bottom:8px }
.checkline { display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);margin-top:12px }
.checkline input { accent-color:var(--blue) }
@keyframes slide-in { from {transform:translateY(8px);opacity:0} to {transform:translateY(0);opacity:1} }
@keyframes fade-in {from{opacity:0}to{opacity:1}}
@keyframes drawer-in {from{transform:translateX(17px);opacity:.85}to{transform:translateX(0);opacity:1}}
@media (max-width:1260px) { :root {--side:209px} .topbar {padding:0 29px} .page {padding:32px 29px 60px} .transfer-grid {grid-template-columns:minmax(0,1fr) minmax(290px,.84fr)} }
@media (max-width:1040px) { :root {--side:190px} .sidebar {padding-left:10px;padding-right:10px} .transfer-grid {grid-template-columns:1fr} .recipient-area {display:grid;grid-template-columns:1fr 1fr;gap:18px} .recipient-area > * {min-width:0} .library-layout {grid-template-columns:175px minmax(0,1fr)} }
@media (max-width:770px) { .shell {display:block} .sidebar {position:static;height:auto;padding:13px 16px;background:var(--paper);border-bottom:1px solid var(--border);border-right:0} .brand {padding:3px 0 10px}.brand-symbol {width:33px;height:33px}.brand-name {font-size:15px}.sidebar .nav-label,.sidebar-help,.sidebar-bottom,.sidebar-spacer {display:none}.nav-group {display:flex;overflow-x:auto;margin:0;gap:2px;padding:3px 0}.nav-group.secondary {display:none}.nav-link {width:auto;white-space:nowrap;padding:10px;font-size:11px;gap:6px}.nav-link svg {width:16px;height:16px}.nav-link .nav-count {display:none}.topbar {height:60px;padding:0 17px}.page {padding:25px 16px 60px}.page-head {gap:12px;margin-bottom:21px}h1{font-size:23px}.top-identity{display:none}.transfer-grid{gap:15px}.recipient-area{grid-template-columns:1fr}.library-layout{grid-template-columns:1fr}.folder-nav{display:flex;overflow-x:auto;gap:5px;padding:8px}.folder-nav button {width:auto;white-space:nowrap}.settings-grid,.admin-grid {grid-template-columns:1fr}.list-row{padding:13px 12px}.file-table th:nth-child(3),.file-table td:nth-child(3){display:none}.account-menu {right:12px;top:53px}.card-pad {padding:19px} }
@media (max-width:430px) { .people-grid{grid-template-columns:1fr 1fr}.person-card{padding:10px;gap:7px}.person-card .round-icon{width:31px;height:31px}.page-head{flex-direction:column}.top-actions{gap:4px}.search-box{min-width:0!important}.toolbar{align-items:stretch}.list-row{flex-wrap:wrap}.list-actions{width:100%;justify-content:flex-end}.file-table th:nth-child(2),.file-table td:nth-child(2){display:none}.kpi-grid{grid-template-columns:1fr}.brand-caption {display:none} }
@media(prefers-reduced-motion:reduce) {*,*:before,*:after {animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important} }