/* ============================================================
   layout.css · 应用外壳布局
   侧栏 / 顶栏 / 标签栏 / 面包屑 / 内容区栅格。
   ============================================================ */

.skip-link { position: fixed; left: 16px; top: -80px; z-index: 9999; padding: 8px 16px; background: white; }

.skip-link:focus { top: 12px; }

.app-shell { display: flex; height: 100%; overflow: hidden; }

.sidebar { overflow: hidden; height: 100%; width: var(--admin-sidebar); flex-shrink: 0; background: white; border-right: 1px solid var(--admin-border); display: flex; flex-direction: column; transition: width .18s; }

.sidebar.collapsed { width: 64px; }

.brand { flex-shrink: 0; height: var(--admin-header); display: flex; align-items: center; gap: 12px; padding: 0 20px; border-bottom: 1px solid var(--admin-border); white-space: nowrap; color: var(--admin-heading); font-size: 15px; font-weight: 600; }

.brand-mark { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 6px; background: var(--admin-primary-action); color: white; flex-shrink: 0; }

.sidebar.collapsed .brand { padding: 0 18px; }

.side-scroll { flex: 1; min-height: 0; overflow: hidden; }

.workspace-header { padding: 0; flex-shrink: 0; }

.workspace { flex: 1; min-width: 0; display: flex; flex-direction: column; }

.topbar { height: var(--admin-header); padding: 0 20px; display: flex; align-items: center; justify-content: space-between; background: white; border-bottom: 1px solid var(--admin-border); flex-shrink: 0; }

.topbar-left, .topbar-right, .inline { display: flex; align-items: center; gap: 12px; }

.system-title { color: var(--admin-heading); font-size: 15px; font-weight: 600; }

.user-avatar { background: #dbeafe; color: #1d4ed8; }

.workspace-tabs { height: var(--admin-tabs); background: white; padding: 0 16px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--admin-divider); }

.breadcrumb-row { height: var(--admin-breadcrumb); display: flex; align-items: center; padding: 0 20px; background: white; border-bottom: 1px solid var(--admin-border); }

.content { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 20px; }

.page-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }

.page-head p { margin-top: 4px; font-size: 12px; color: var(--admin-muted); }

.page-heading { display: flex; gap: 12px; align-items: center; }


/* Business composition; all colors, type sizes, spacing and widths reuse V1.1 tokens. */
.workspace{min-height:0}
.content{scrollbar-gutter:stable}
.brand-divider{color:var(--admin-border);margin:0 8px}
.language-select{width:112px}
.time-inline{margin-left:auto;color:var(--admin-muted);font-size:12px;font-variant-numeric:tabular-nums}
.heading-id{font-size:12px;font-weight:400;color:var(--admin-muted);margin-left:12px}