:root {
      color-scheme: light;
      --shell: #183247;
      --shell-2: #24465f;
      --shell-text: #f4f8f7;
      --canvas: #f3f7fb;
      --surface: #ffffff;
      --surface-2: #f7fafd;
      --surface-3: #eaf1f7;
      --ink: #172430;
      --muted: #586a78;
      --subtle: #596d7b;
      --border: #d2dee8;
      --border-strong: #aabcc9;
      --primary: #2b78a6;
      --primary-strong: #1f628a;
      --primary-soft: #e1f2fc;
      --success: #287a47;
      --success-soft: #e3f3e8;
      --warning: #8d5700;
      --warning-soft: #fff1d7;
      --danger: #b42318;
      --danger-soft: #fee9e7;
      --info: #5669b2;
      --info-soft: #eceffd;
      --shadow: 0 10px 30px rgba(24, 38, 43, .08);
      --display: "General Sans", "Source Sans 3", sans-serif;
      --body: "Source Sans 3", sans-serif;
      --mono: "IBM Plex Mono", monospace;
    }

    html[data-theme="dark"] {
      color-scheme: dark;
      --shell: #101f2d;
      --shell-2: #18364b;
      --canvas: #111c25;
      --surface: #182630;
      --surface-2: #20313d;
      --surface-3: #293d4a;
      --ink: #edf5fa;
      --muted: #abc0cf;
      --subtle: #879dac;
      --border: #354b5a;
      --border-strong: #526b7b;
      --primary: #67b4e0;
      --primary-strong: #8acbf0;
      --primary-soft: #17394f;
      --success: #71c98c;
      --success-soft: #1d3b29;
      --warning: #e6aa4a;
      --warning-soft: #3f311a;
      --danger: #f27970;
      --danger-soft: #48211f;
      --info: #91a3f0;
      --info-soft: #202c51;
      --shadow: 0 10px 30px rgba(0, 0, 0, .22);
    }

    * { box-sizing: border-box; }
    html { max-width: 100%; overflow-x: hidden; }
    body { max-width: 100%; margin: 0; overflow-x: hidden; background: var(--canvas); color: var(--ink); font: 15px/1.45 var(--body); }
    button, input, select, textarea { font: inherit; }
    button { color: inherit; }
    button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
      outline: 3px solid color-mix(in srgb, var(--info) 65%, transparent);
      outline-offset: 2px;
    }
    h1, h2, h3, p { margin: 0; }
    h1 { font: 700 24px/1.15 var(--display); letter-spacing: -.025em; }
    h2 { font: 700 18px/1.25 var(--display); letter-spacing: -.015em; }
    h3 { font: 650 14px/1.3 var(--display); }
    a { color: var(--primary-strong); }
    svg { display: block; }

    .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
    .mono { font-family: var(--mono); font-size: .84em; }
    .muted { color: var(--muted); }
    .eyebrow { color: var(--subtle); font-size: 11px; font-weight: 700; letter-spacing: .095em; text-transform: uppercase; }

    .global-bar {
      position: sticky; top: 0; z-index: 30; height: 52px; display: grid;
      grid-template-columns: 250px minmax(260px, 680px) 1fr; align-items: center;
      gap: 20px; padding: 0 20px; background: var(--shell); color: var(--shell-text);
    }
    .brand { display: flex; align-items: center; gap: 10px; min-width: 0; color: var(--shell-text); text-decoration: none; }
    .brand-mark { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid #73bfe8; color: #a3d9f5; font: 700 12px var(--mono); }
    .brand-name { font-weight: 700; letter-spacing: -.01em; }
    .workspace { color: #a9bab5; font-size: 12px; white-space: nowrap; }
    .global-search { position: relative; }
    .global-search svg { position: absolute; left: 11px; top: 9px; width: 16px; height: 16px; color: #a9bab5; pointer-events: none; }
    .global-search input { width: 100%; height: 34px; padding: 0 42px 0 34px; border: 1px solid #45627a; border-radius: 3px; background: #203b4f; color: white; }
    .global-search input::placeholder { color: #a9bab5; }
    .shortcut { position: absolute; right: 9px; top: 8px; color: #a9bab5; font: 11px var(--mono); }
    .global-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
    .shell-button { min-height: 32px; display: inline-flex; align-items: center; gap: 7px; padding: 0 9px; border: 1px solid transparent; border-radius: 3px; background: transparent; color: #dce7e4; cursor: pointer; }
    .shell-button:hover { background: var(--shell-2); }
    .shell-button svg { width: 16px; height: 16px; }
    .ready-dot { width: 7px; height: 7px; border-radius: 50%; background: #66d29b; box-shadow: 0 0 0 3px rgba(102,210,155,.14); }
    .avatar { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; background: #dceef9; color: #244f6e; font-weight: 700; font-size: 12px; }

    .primary-nav { height: 43px; display: flex; align-items: stretch; gap: 2px; padding: 0 16px; overflow-x: auto; border-bottom: 1px solid var(--border); background: var(--surface); }
    .nav-item { position: relative; display: flex; align-items: center; gap: 7px; min-width: max-content; padding: 0 12px; border: 0; background: transparent; color: var(--muted); font-size: 13px; font-weight: 600; cursor: pointer; }
    .nav-item:hover { color: var(--ink); background: var(--surface-2); }
    .nav-item.active { color: var(--primary); }
    .nav-item.active::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 0; height: 3px; background: var(--primary); }
    .nav-item svg { width: 15px; height: 15px; }
    .nav-spacer { flex: 1; min-width: 12px; }
    .nav-admin { border-left: 1px solid var(--border); }

    .view { display: none; min-height: calc(100vh - 95px); }
    .view.active { display: block; }
    .workspace-layout { display: grid; grid-template-columns: 232px minmax(0, 1fr); min-height: calc(100vh - 95px); }
    .context-rail { background: var(--surface); border-right: 1px solid var(--border); }
    .rail-head { height: 54px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; border-bottom: 1px solid var(--border); }
    .rail-section { padding: 13px 11px; border-bottom: 1px solid var(--border); }
    .persona-form { display: grid; gap: 7px; margin-top: 8px; }
    .persona-form select { width: 100%; height: 34px; padding: 0 8px; border: 1px solid var(--border-strong); border-radius: 3px; background: var(--surface); color: var(--ink); }
    .persona-form .button { width: 100%; }
    details.rail-section { padding: 0; }
    details.rail-section > summary { padding: 0 11px; }
    details.rail-section > .muted, details.rail-section > .operation-list { margin: 0 11px 11px; }
    .operation-list { max-height: 180px; padding-left: 18px; overflow: auto; font: 11px/1.45 "IBM Plex Mono", monospace; overflow-wrap: anywhere; }
    .rail-title { display: flex; align-items: center; justify-content: space-between; margin: 0 5px 7px; color: var(--subtle); font-size: 10px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
    .rail-link { width: 100%; min-height: 34px; display: flex; align-items: center; gap: 9px; padding: 5px 8px; border: 0; border-left: 3px solid transparent; background: transparent; color: var(--muted); text-align: left; cursor: pointer; }
    .rail-link:hover { background: var(--surface-2); color: var(--ink); }
    .rail-link.active { border-left-color: var(--primary); background: var(--primary-soft); color: var(--primary-strong); font-weight: 650; }
    .rail-link svg { width: 15px; height: 15px; }
    .rail-link .count { margin-left: auto; color: var(--subtle); font: 11px var(--mono); }
    .filter-row { display: flex; align-items: center; gap: 8px; padding: 6px 5px; color: var(--muted); font-size: 13px; }
    .filter-row input { accent-color: var(--primary); }

    .main-pane { min-width: 0; }
    .page-header { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 22px; border-bottom: 1px solid var(--border); background: var(--surface); }
    .title-line { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
    .page-copy { margin-top: 5px; color: var(--muted); font-size: 13px; }
    .header-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    .content-area { padding: 18px 22px 32px; }
    .button { min-height: 34px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 0 12px; border: 1px solid var(--border-strong); border-radius: 3px; background: var(--surface); color: var(--ink); font-size: 13px; font-weight: 650; text-decoration: none; cursor: pointer; }
    .button:hover { background: var(--surface-2); }
    .button.primary { border-color: var(--primary); background: var(--primary); color: #fff; }
    .button.primary:hover { background: var(--primary-strong); }
    .button.danger { border-color: color-mix(in srgb, var(--danger) 45%, var(--border)); color: var(--danger); }
    .button.ghost { border-color: transparent; background: transparent; }
    .button svg { width: 15px; height: 15px; }
    .icon-button { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 3px; background: var(--surface); cursor: pointer; }
    .icon-button:hover { background: var(--surface-2); }
    .icon-button svg { width: 16px; height: 16px; }
    .tag { min-height: 23px; display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-2); color: var(--muted); font-size: 11px; font-weight: 650; white-space: nowrap; }
    .tag.success { border-color: color-mix(in srgb, var(--success) 30%, var(--border)); background: var(--success-soft); color: var(--success); }
    .tag.warning { border-color: color-mix(in srgb, var(--warning) 32%, var(--border)); background: var(--warning-soft); color: var(--warning); }
    .tag.info { border-color: color-mix(in srgb, var(--info) 28%, var(--border)); background: var(--info-soft); color: var(--info); }
    .tag.danger { border-color: color-mix(in srgb, var(--danger) 30%, var(--border)); background: var(--danger-soft); color: var(--danger); }
    .tag .dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }

    .metric-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--border); background: var(--surface); }
    .work-metrics { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .metric { min-height: 86px; padding: 13px 15px; border-right: 1px solid var(--border); }
    .metric:last-child { border-right: 0; }
    .metric-value { margin-top: 6px; font: 700 25px/1 var(--display); letter-spacing: -.03em; }
    .metric-note { margin-top: 5px; color: var(--muted); font-size: 12px; }
    .section-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 20px 0 8px; }
    .segmented { display: inline-flex; border: 1px solid var(--border); border-radius: 3px; overflow: hidden; }
    .segmented button { min-height: 31px; padding: 0 10px; border: 0; border-right: 1px solid var(--border); background: var(--surface); color: var(--muted); font-size: 12px; cursor: pointer; }
    .segmented button:last-child { border-right: 0; }
    .segmented button.active { background: var(--primary-soft); color: var(--primary-strong); font-weight: 700; }

    .data-table { width: 100%; border: 1px solid var(--border); border-collapse: collapse; background: var(--surface); font-size: 13px; }
    .data-table th { height: 34px; padding: 0 11px; border-bottom: 1px solid var(--border-strong); background: var(--surface-2); color: var(--subtle); font-size: 10px; letter-spacing: .075em; text-align: left; text-transform: uppercase; }
    .data-table td { height: 46px; padding: 7px 11px; border-bottom: 1px solid var(--border); vertical-align: middle; }
    .data-table tr:last-child td { border-bottom: 0; }
    .data-table tbody tr:hover { background: var(--surface-2); }
    .record-cell { display: flex; align-items: center; gap: 10px; }
    .record-icon { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid var(--border); background: var(--surface-2); color: var(--primary); }
    .record-icon svg { width: 15px; height: 15px; }
    .record-name { font-weight: 650; }
    .record-meta { color: var(--muted); font: 11px var(--mono); }
    .due { color: var(--warning); font-weight: 650; }
    .agent-event { display: inline-flex; align-items: center; gap: 6px; color: var(--info); font-size: 12px; }
    .agent-event svg { width: 14px; height: 14px; }

    .task-banner { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 10px 14px; border-bottom: 1px solid color-mix(in srgb, var(--warning) 36%, var(--border)); background: var(--warning-soft); color: var(--ink); }
    .task-banner strong { font-size: 13px; }
    .task-banner p { margin-top: 2px; color: var(--muted); font-size: 12px; }
    .lifecycle { display: grid; grid-template-columns: repeat(5, 1fr); min-height: 38px; border-bottom: 1px solid var(--border); background: var(--surface); }
    .stage { position: relative; display: grid; place-items: center; padding: 0 14px 0 20px; color: var(--subtle); font-size: 11px; font-weight: 650; text-align: center; }
    .stage::after { content: ""; position: absolute; right: -9px; z-index: 2; width: 17px; height: 17px; border-top: 1px solid var(--border); border-right: 1px solid var(--border); background: inherit; transform: rotate(45deg); }
    .stage:last-child::after { display: none; }
    .stage.done { background: var(--success-soft); color: var(--success); }
    .stage.current { background: var(--primary-soft); color: var(--primary-strong); }
    .review-grid { display: grid; grid-template-columns: minmax(410px, 1.5fr) minmax(250px, .72fr) minmax(270px, .78fr); height: calc(100vh - 271px); min-height: 570px; }
    .review-pane { min-width: 0; overflow: auto; border-right: 1px solid var(--border); background: var(--surface); }
    .review-pane:last-child { border-right: 0; }
    .pane-toolbar { position: sticky; top: 0; z-index: 3; height: 43px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 10px; border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(7px); }
    .tool-group { display: flex; align-items: center; gap: 3px; }
    .paper-wrap { min-height: 100%; padding: 28px; background: #dfe5e2; }
    .paper { position: relative; max-width: 720px; min-height: 820px; margin: 0 auto; padding: 55px 55px 80px; overflow: hidden; background: #fff; color: #15221e; box-shadow: 0 5px 16px rgba(31,47,43,.16); }
    .paper-kicker { color: #347da5; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
    .paper h2 { max-width: 420px; margin-top: 18px; font-size: 34px; line-height: 1.05; }
    .paper-lead { max-width: 430px; margin-top: 18px; color: #455c6b; font-size: 16px; }
    .paper-rule { width: 80px; height: 5px; margin: 28px 0; background: #2b78a6; }
    .paper-stat { width: 58%; display: grid; grid-template-columns: 88px 1fr; gap: 14px; align-items: center; margin: 22px 0; }
    .paper-number { font: 700 34px var(--display); color: #2b78a6; }
    .paper-shape { position: absolute; right: -110px; top: 130px; width: 320px; height: 320px; border: 55px solid #dceef8; border-radius: 50%; }
    .paper-footer { position: absolute; left: 55px; right: 55px; bottom: 35px; display: flex; justify-content: space-between; border-top: 1px solid #d5e0e8; padding-top: 12px; color: #687985; font-size: 10px; }
    .anchor { position: absolute; width: 22px; height: 22px; display: grid; place-items: center; border: 2px solid white; border-radius: 50%; background: #5669b2; color: white; font: 700 10px var(--mono); box-shadow: 0 1px 5px rgba(0,0,0,.22); }
    .anchor.one { right: 130px; top: 285px; }
    .anchor.two { left: 47px; top: 480px; }
    .thread { padding: 12px; border-bottom: 1px solid var(--border); }
    .thread.active { background: var(--info-soft); box-shadow: inset 3px 0 var(--info); }
    .thread-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
    .thread-author { display: flex; gap: 8px; }
    .mini-avatar { width: 25px; height: 25px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--surface-3); color: var(--muted); font-size: 10px; font-weight: 700; }
    .thread p { margin: 8px 0 0 33px; font-size: 12px; }
    .thread-time { color: var(--subtle); font: 10px var(--mono); white-space: nowrap; }
    .required { color: var(--danger); font-size: 10px; font-weight: 700; text-transform: uppercase; }
    .thread-link { margin: 8px 0 0 33px; border: 0; background: transparent; color: var(--info); font-size: 11px; cursor: pointer; }
    .reply-box { margin: 12px; }
    .reply-box textarea { width: 100%; min-height: 72px; resize: vertical; padding: 9px; border: 1px solid var(--border-strong); border-radius: 3px; background: var(--surface); color: var(--ink); font: 12px var(--body); }
    .reply-actions { display: flex; justify-content: flex-end; margin-top: 6px; }
    details { border-bottom: 1px solid var(--border); background: var(--surface); }
    summary { min-height: 41px; display: flex; align-items: center; gap: 8px; padding: 0 12px; cursor: pointer; font-size: 12px; font-weight: 700; list-style: none; }
    summary::-webkit-details-marker { display: none; }
    summary::before { content: "›"; color: var(--subtle); transform: rotate(0); transition: transform .14s ease; }
    details[open] summary::before { transform: rotate(90deg); }
    .detail-grid { display: grid; grid-template-columns: 115px 1fr; gap: 9px 12px; padding: 2px 15px 15px 28px; font-size: 12px; }
    .detail-grid dt { color: var(--subtle); }
    .detail-grid dd { margin: 0; font-weight: 550; }
    .evidence-spine { margin: 12px; padding: 12px 12px 12px 16px; border: 1px solid var(--border); border-left: 3px solid var(--info); background: var(--surface-2); }
    .evidence-spine h2, .evidence-spine h3 { color: var(--info); }
    .trace-step { position: relative; margin: 11px 0 0 7px; padding-left: 18px; font-size: 11px; }
    .trace-step::before { content: ""; position: absolute; left: 0; top: 5px; width: 7px; height: 7px; border-radius: 50%; background: var(--info); }
    .trace-step::after { content: ""; position: absolute; left: 3px; top: 12px; width: 1px; height: 18px; background: color-mix(in srgb, var(--info) 35%, var(--border)); }
    .trace-step:last-child::after { display: none; }

    .library-toolbar { display: grid; grid-template-columns: minmax(260px, 540px) auto; justify-content: space-between; gap: 18px; align-items: center; margin-bottom: 13px; }
    .search-field { position: relative; }
    .search-field svg { position: absolute; left: 10px; top: 10px; width: 15px; height: 15px; color: var(--subtle); }
    .search-field input { width: 100%; height: 35px; padding: 0 10px 0 33px; border: 1px solid var(--border-strong); border-radius: 3px; background: var(--surface); color: var(--ink); }
    .library-grid { display: grid; grid-template-columns: repeat(4, minmax(180px, 1fr)); gap: 12px; }
    .asset-card { min-width: 0; border: 1px solid var(--border); background: var(--surface); transition: transform .14s ease, box-shadow .14s ease; }
    .asset-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
    .asset-preview { position: relative; height: 145px; display: grid; place-items: center; overflow: hidden; background: var(--surface-3); }
    .asset-preview .sheet { width: 86px; height: 112px; padding: 12px; background: white; color: #31443e; box-shadow: 0 2px 9px rgba(24,38,43,.13); }
    .sheet-line { height: 5px; margin: 5px 0; background: #d7e5ee; }
    .sheet-line.dark { width: 62%; background: #4a7d9d; }
    .sheet-block { height: 30px; margin: 9px 0; background: #dcedf7; }
    .asset-status { position: absolute; left: 8px; top: 8px; }
    .favorite { position: absolute; right: 8px; top: 8px; }
    .asset-body { padding: 11px; }
    .asset-body h3 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .asset-body p { margin-top: 4px; color: var(--muted); font-size: 11px; }
    .asset-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--border); color: var(--subtle); font-size: 10px; }
    .asset-actions { display: flex; gap: 3px; }
    .asset-actions button { width: 25px; height: 25px; display: grid; place-items: center; border: 0; background: transparent; color: var(--muted); cursor: pointer; }
    .asset-actions svg { width: 14px; height: 14px; }

    .access-layout { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr); gap: 14px; }
    .panel { border: 1px solid var(--border); background: var(--surface); }
    .panel-head { min-height: 43px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 13px; border-bottom: 1px solid var(--border); }
    .panel-body { padding: 14px; }
    .facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; border: 1px solid var(--border); background: var(--border); }
    .fact { min-height: 77px; padding: 12px; background: var(--surface); }
    .fact strong { display: block; margin-top: 7px; font-size: 14px; }
    .proposal { margin-top: 14px; padding: 15px; border: 1px solid color-mix(in srgb, var(--primary) 35%, var(--border)); background: var(--primary-soft); }
    .proposal-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
    .proposal p { margin-top: 7px; color: var(--muted); font-size: 13px; }
    .permission-row { display: grid; grid-template-columns: 1fr 90px 90px; gap: 10px; align-items: center; min-height: 43px; padding: 6px 12px; border-bottom: 1px solid var(--border); font-size: 12px; }
    .permission-row:last-child { border-bottom: 0; }
    .permission-row.header { min-height: 31px; background: var(--surface-2); color: var(--subtle); font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
    .deny { color: var(--danger); font-weight: 700; }
    .allow { color: var(--success); font-weight: 700; }
    .match-card { padding: 12px; border-bottom: 1px solid var(--border); }
    .match-card:last-child { border-bottom: 0; }
    .match-card p { margin-top: 5px; color: var(--muted); font-size: 12px; }
    .source-line { display: flex; gap: 7px; align-items: center; margin-top: 8px; color: var(--subtle); font: 10px var(--mono); }
    .source-line svg { width: 13px; height: 13px; }

    .admin-section { display: none; }
    .admin-section.active { display: block; }
    .admin-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
    .admin-stat { min-height: 92px; padding: 14px; border: 1px solid var(--border); background: var(--surface); }
    .admin-stat strong { display: block; margin-top: 6px; font: 700 25px/1 var(--display); }
    .admin-stat span:last-child { display: block; margin-top: 7px; color: var(--muted); font-size: 11px; }
    .admin-toolbar { display: grid; grid-template-columns: minmax(260px, 480px) auto; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
    .admin-grid { display: grid; grid-template-columns: minmax(560px, 1fr) 330px; gap: 12px; align-items: start; }
    .admin-record { cursor: pointer; }
    .admin-record.selected { background: var(--primary-soft); box-shadow: inset 3px 0 var(--primary); }
    .user-id { display: flex; align-items: center; gap: 9px; }
    .user-avatar { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--surface-3); color: var(--primary-strong); font-size: 11px; font-weight: 700; }
    .record-detail { position: sticky; top: 110px; }
    .record-detail-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 14px; border-bottom: 1px solid var(--border); }
    .record-detail-head .user-avatar { width: 38px; height: 38px; }
    .detail-section { padding: 13px 14px; border-bottom: 1px solid var(--border); }
    .detail-section:last-child { border-bottom: 0; }
    .detail-section-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 9px; }
    .detail-list { display: grid; gap: 8px; }
    .detail-line { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; font-size: 12px; }
    .detail-line span:first-child { color: var(--muted); }
    .assignment { padding: 8px 9px; border: 1px solid var(--border); background: var(--surface-2); }
    .assignment strong { display: block; font-size: 12px; }
    .assignment span { color: var(--muted); font-size: 11px; }
    .text-button { padding: 0; border: 0; background: transparent; color: var(--primary); font-size: 11px; font-weight: 700; cursor: pointer; }
    .admin-note { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 14px; padding: 11px 12px; border: 1px solid color-mix(in srgb, var(--info) 28%, var(--border)); background: var(--info-soft); font-size: 12px; }
    .admin-note svg { width: 16px; height: 16px; flex: 0 0 auto; color: var(--info); }
    .split-actions { display: flex; gap: 7px; align-items: center; }

    dialog { width: min(760px, calc(100vw - 32px)); max-height: calc(100vh - 48px); padding: 0; overflow: auto; border: 1px solid var(--border-strong); border-radius: 4px; background: var(--surface); color: var(--ink); box-shadow: 0 24px 70px rgba(16,31,45,.28); }
    dialog::backdrop { background: rgba(16,31,45,.48); }
    .dialog-head { position: sticky; top: 0; z-index: 2; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 16px 18px; border-bottom: 1px solid var(--border); background: var(--surface); }
    .dialog-head p { margin-top: 4px; color: var(--muted); font-size: 12px; }
    .dialog-body { padding: 17px 18px; }
    .dialog-section + .dialog-section { margin-top: 20px; padding-top: 17px; border-top: 1px solid var(--border); }
    .dialog-section h3 { margin-bottom: 11px; }
    .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .field { display: grid; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 650; }
    .field input, .field select, .field textarea { width: 100%; padding: 0 9px; border: 1px solid var(--border-strong); border-radius: 3px; background: var(--surface); color: var(--ink); }
    .field input, .field select { height: 36px; }
    .field textarea { min-height: 88px; padding-block: 8px; resize: vertical; }
    .choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .choice { display: flex; align-items: flex-start; gap: 9px; min-height: 55px; padding: 9px; border: 1px solid var(--border); background: var(--surface-2); font-size: 12px; }
    .choice input { margin-top: 3px; accent-color: var(--primary); }
    .choice span { color: var(--muted); font-size: 11px; }
    .dialog-foot { position: sticky; bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 18px; border-top: 1px solid var(--border); background: var(--surface); }
    .state-preview-banner { display: grid; grid-template-columns: auto 1fr auto; gap: 11px; align-items: center; margin: 12px 18px 0; padding: 11px 13px; border: 1px solid var(--border-strong); border-left: 3px solid var(--info); background: var(--info-soft); }
    .state-preview-banner[hidden] { display: none; }
    .state-preview-banner.danger { border-left-color: var(--danger); background: var(--danger-soft); }
    .state-preview-banner.warning { border-left-color: var(--warning); background: var(--warning-soft); }
    .state-preview-banner.success { border-left-color: var(--success); background: var(--success-soft); }
    .state-preview-banner strong, .state-preview-banner span { display: block; }
    .state-preview-banner span { color: var(--muted); font-size: 11px; }
    .state-preview-icon { width: 26px; height: 26px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; color: var(--info); font: 700 11px var(--mono); }
    .persona-grid, .state-option-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .persona-option, .state-option { min-height: 74px; padding: 10px; border: 1px solid var(--border); background: var(--surface-2); color: var(--ink); text-align: left; cursor: pointer; }
    .persona-option:hover, .state-option:hover, .persona-option:focus-visible, .state-option:focus-visible { border-color: var(--primary); background: var(--primary-soft); }
    .persona-option strong, .persona-option span, .state-option strong, .state-option span { display: block; }
    .persona-option span, .state-option span { margin-top: 3px; color: var(--muted); font-size: 11px; }
    .flow-summary { padding: 12px; border: 1px solid var(--border); background: var(--surface-2); }
    .flow-summary + .flow-summary { margin-top: 8px; }
    .flow-summary strong, .flow-summary span { display: block; }
    .flow-summary span { margin-top: 4px; color: var(--muted); font-size: 11px; }
    .validation-list { display: grid; gap: 7px; margin-top: 11px; }
    .validation-item { display: grid; grid-template-columns: 140px 1fr; gap: 10px; padding: 8px 9px; border: 1px solid var(--border); font-size: 11px; }
    .access-state-card { margin-bottom: 12px; padding: 13px; border: 1px solid var(--border); background: var(--surface); }
    .access-state-switcher { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 11px; }
    .access-state-switcher button { min-height: 30px; padding: 0 9px; border: 1px solid var(--border); background: var(--surface-2); color: var(--muted); font-size: 10px; font-weight: 700; cursor: pointer; }
    .access-state-switcher button.active { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-strong); }
    .access-state-result { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: end; }
    .access-state-result p { margin-top: 5px; color: var(--muted); font-size: 12px; }
    .review-targets { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .review-target { min-height: 54px; padding: 9px; border: 1px solid var(--border); background: var(--surface-2); color: var(--ink); text-align: left; cursor: pointer; }
    .review-target.active { border-color: var(--primary); background: var(--primary-soft); }
    .review-target span { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; }
    .dialog-state[hidden] { display: none; }

    .object-grid { display: grid; grid-template-columns: minmax(540px, 1fr) 360px; gap: 12px; align-items: start; }
    .object-detail { position: sticky; top: 110px; }
    .subtabs { display: flex; gap: 0; overflow-x: auto; border-bottom: 1px solid var(--border); background: var(--surface); }
    .subtab { position: relative; min-height: 40px; padding: 0 13px; border: 0; background: transparent; color: var(--muted); font-size: 12px; font-weight: 650; cursor: pointer; }
    .subtab.active { color: var(--primary); }
    .subtab.active::after { content: ""; position: absolute; right: 10px; bottom: 0; left: 10px; height: 2px; background: var(--primary); }
    .subpanel { display: none; }
    .subpanel.active { display: block; }
    .claim-statement { padding: 15px; border-left: 3px solid var(--primary); background: var(--primary-soft); font: 600 17px/1.4 var(--display); }
    .relation-list { display: grid; gap: 8px; }
    .relation-card { display: grid; grid-template-columns: 42px 1fr auto; gap: 10px; align-items: center; padding: 10px; border: 1px solid var(--border); background: var(--surface); }
    .relation-icon { width: 40px; height: 48px; display: grid; place-items: center; border: 1px solid var(--border); background: var(--surface-3); color: var(--primary); }
    .relation-icon svg { width: 18px; height: 18px; }
    .scope-tags { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 7px; }
    .timeline-list { display: grid; gap: 0; }
    .timeline-item { position: relative; min-height: 54px; padding: 10px 12px 10px 33px; border-left: 1px solid var(--border); font-size: 12px; }
    .timeline-item::before { content: ""; position: absolute; left: -5px; top: 17px; width: 9px; height: 9px; border: 2px solid var(--surface); border-radius: 50%; background: var(--primary); box-shadow: 0 0 0 1px var(--primary); }

    .module-shell { display: grid; grid-template-columns: 245px minmax(0, 1fr) 310px; min-height: 660px; border: 1px solid var(--border); background: var(--surface); }
    .module-nav { border-right: 1px solid var(--border); }
    .module-nav-item { width: 100%; min-height: 45px; padding: 8px 12px; border: 0; border-bottom: 1px solid var(--border); background: transparent; text-align: left; cursor: pointer; }
    .module-nav-item.active { background: var(--primary-soft); box-shadow: inset 3px 0 var(--primary); }
    .module-nav-item strong, .module-nav-item span { display: block; }
    .module-nav-item span { color: var(--muted); font-size: 11px; }
    .module-canvas { min-width: 0; padding: 15px; background: var(--canvas); }
    .module-section + .module-section { margin-top: 18px; }
    .module-section-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
    .module-section-head .text-button, .portal-wrap .text-button { color: var(--primary-strong); }
    .module-assets { display: grid; grid-template-columns: repeat(2, minmax(190px, 1fr)); gap: 8px; }
    .module-asset { position: relative; min-height: 105px; padding: 11px; border: 1px solid var(--border); background: var(--surface); }
    .module-asset.must-use::after { content: "Must use"; position: absolute; top: 8px; right: 8px; padding: 2px 6px; border-radius: 999px; background: var(--warning-soft); color: var(--warning); font-size: 9px; font-weight: 700; text-transform: uppercase; }
    .asset-kind { color: var(--subtle); font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
    .module-asset strong { display: block; margin-top: 14px; }
    .module-asset p { margin-top: 5px; color: var(--muted); font-size: 11px; }
    .module-side { border-left: 1px solid var(--border); }
    .combination { width: 100%; padding: 10px 12px; border: 0; border-bottom: 1px solid var(--border); background: transparent; text-align: left; cursor: pointer; }
    .combination.active { background: var(--info-soft); box-shadow: inset 3px 0 var(--info); }
    .combination span { display: block; color: var(--muted); font-size: 11px; }
    .rule-line { display: flex; gap: 8px; align-items: flex-start; padding: 9px 0; border-bottom: 1px solid var(--border); font-size: 11px; }
    .rule-line:last-child { border-bottom: 0; }
    .rule-number { width: 20px; height: 20px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--primary-soft); color: var(--primary-strong); font: 700 10px var(--mono); }
    .module-preview { min-height: 175px; margin-top: 10px; padding: 20px; border: 1px solid var(--border); background: #fff; color: #172430; box-shadow: 0 4px 14px rgba(24,50,71,.08); }
    .module-preview h3 { margin-top: 12px; font-size: 20px; }
    .module-preview p { margin-top: 9px; color: #526776; font-size: 12px; }

    .dashboard-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 12px; }
    .chart-card { min-height: 250px; padding: 14px; border: 1px solid var(--border); background: var(--surface); }
    .chart-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 16px; }
    .bar-chart { height: 160px; display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; align-items: end; padding-top: 10px; border-bottom: 1px solid var(--border-strong); }
    .bar { position: relative; min-height: 10px; background: var(--primary); }
    .bar::after { content: attr(data-label); position: absolute; top: calc(100% + 6px); left: 50%; color: var(--muted); font: 10px var(--mono); transform: translateX(-50%); }
    .donut-wrap { display: grid; grid-template-columns: 150px 1fr; gap: 16px; align-items: center; }
    .donut { width: 142px; height: 142px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--success) 0 46%, var(--info) 46% 68%, var(--warning) 68% 86%, var(--surface-3) 86% 100%); }
    .donut::after { content: "24\A records"; white-space: pre; width: 82px; height: 82px; display: grid; place-items: center; border-radius: 50%; background: var(--surface); color: var(--ink); font: 700 13px/1.2 var(--display); text-align: center; }
    .legend { display: grid; gap: 8px; font-size: 11px; }
    .legend-row { display: grid; grid-template-columns: 9px 1fr auto; gap: 7px; align-items: center; }
    .legend-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--primary); }
    .trend { display: inline-flex; align-items: center; gap: 4px; color: var(--success); font-size: 11px; font-weight: 700; }

    .portal-surface { min-height: calc(100vh - 95px); background: #eef5fa; }
    .portal-hero { padding: 30px max(24px, calc((100vw - 1200px)/2)); background: var(--shell); color: white; }
    .portal-hero-inner { display: grid; grid-template-columns: 1fr 420px; gap: 40px; align-items: center; }
    .portal-hero h1 { font-size: 32px; }
    .portal-hero p { max-width: 620px; margin-top: 8px; color: #d6e9f5; }
    .portal-search { position: relative; }
    .portal-search svg { position: absolute; left: 13px; top: 13px; width: 17px; height: 17px; color: #607887; }
    .portal-search input { width: 100%; height: 43px; padding: 0 12px 0 40px; border: 0; border-radius: 3px; background: white; color: #172430; box-shadow: 0 8px 22px rgba(9,31,46,.16); }
    .portal-wrap { max-width: 1200px; margin: 0 auto; padding: 22px 24px 48px; }
    .announcement { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px; border: 1px solid #bdd7e8; background: #fff; }
    .category-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; margin-top: 16px; }
    .category-tile { min-height: 88px; display: grid; place-items: center; gap: 4px; padding: 10px; border: 1px solid #ccdde8; background: white; color: #36576c; text-align: center; font-size: 11px; font-weight: 700; cursor: pointer; }
    .category-tile:hover, .category-tile.active { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-strong); }
    .category-tile svg { width: 22px; height: 22px; }
    .portal-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
    .portal-card { overflow: hidden; border: 1px solid #ccdde8; background: white; }
    .portal-art { height: 120px; display: grid; place-items: center; background: var(--surface-3); }
    .portal-art .brand-mark { color: var(--primary-strong); border-color: var(--primary-strong); }
    .portal-scope { max-width: 1200px; margin: 14px auto 0; }
    .portal-art svg { width: 36px; height: 36px; color: var(--primary); }
    .portal-card-body { padding: 11px; }
    .portal-card-body p { margin-top: 4px; color: var(--muted); font-size: 11px; }
    .portal-card-actions { display: flex; gap: 6px; margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--border); }

    .studio-grid { display: grid; grid-template-columns: minmax(600px, 1fr) 380px; gap: 12px; align-items: start; }
    .operation-name { font-family: var(--mono); font-size: 11px; font-weight: 600; }
    .mode-control { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
    .mode-option { min-height: 55px; padding: 8px; border: 1px solid var(--border); background: var(--surface); text-align: left; cursor: pointer; }
    .mode-option.active { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-strong); }
    .mode-option strong, .mode-option span { display: block; }
    .mode-option span { margin-top: 3px; color: var(--muted); font-size: 10px; }
    .code-block { margin-top: 8px; padding: 10px; overflow: auto; border: 1px solid var(--border); background: var(--surface-2); color: var(--muted); font: 10px/1.6 var(--mono); white-space: pre-wrap; }
    .inspector { margin-top: 12px; border: 1px solid var(--border); background: var(--surface); }
    .inspector-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; padding: 9px 11px; border-bottom: 1px solid var(--border); font-size: 11px; }
    .inspector-row:last-child { border-bottom: 0; }

    .system-wrap { max-width: 1200px; margin: 0 auto; padding: 28px 24px 60px; }
    .system-intro { display: grid; grid-template-columns: 1fr 360px; gap: 50px; align-items: end; padding-bottom: 25px; border-bottom: 1px solid var(--border-strong); }
    .system-intro h1 { max-width: 660px; font-size: clamp(34px, 5vw, 64px); line-height: .98; }
    .system-intro p { color: var(--muted); }
    .system-section { padding: 28px 0; border-bottom: 1px solid var(--border); }
    .system-section > h2 { margin-bottom: 17px; }
    .swatches { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
    .swatch { min-height: 125px; display: flex; flex-direction: column; justify-content: flex-end; padding: 10px; border: 1px solid var(--border); color: #fff; }
    .swatch.light { color: #172430; }
    .swatch span { display: block; font: 11px var(--mono); }
    .type-specimen { display: grid; grid-template-columns: 170px 1fr; gap: 25px; padding: 18px 0; border-top: 1px solid var(--border); }
    .type-display { font: 700 clamp(34px, 4vw, 58px)/1 var(--display); letter-spacing: -.035em; }
    .type-body { max-width: 720px; font-size: 18px; }
    .type-data { font: 16px/1.7 var(--mono); }
    .component-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    .component-card { min-height: 170px; padding: 16px; border: 1px solid var(--border); background: var(--surface); }
    .component-card h3 { margin-bottom: 15px; }
    .component-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
    .sample-input { height: 36px; width: 100%; max-width: 310px; padding: 0 10px; border: 1px solid var(--border-strong); border-radius: 3px; background: var(--surface); color: var(--ink); }
    .alert { margin-top: 9px; padding: 10px 12px; border-left: 3px solid var(--info); background: var(--info-soft); color: var(--ink); font-size: 12px; }

    .toast { position: fixed; right: 18px; bottom: 18px; z-index: 50; max-width: 360px; padding: 11px 14px; border: 1px solid #526f85; border-radius: 3px; background: #183247; color: white; box-shadow: var(--shadow); transform: translateY(20px); opacity: 0; pointer-events: none; transition: .16s ease; }
    .toast.show { transform: translateY(0); opacity: 1; }

    @media (max-width: 1180px) {
      .global-bar { grid-template-columns: 215px minmax(200px, 1fr) auto; }
      .shell-button .label, .workspace { display: none; }
      .review-grid { grid-template-columns: minmax(390px, 1.4fr) minmax(240px, .75fr) minmax(250px, .85fr); }
      .library-grid { grid-template-columns: repeat(3, minmax(170px, 1fr)); }
      .access-layout { grid-template-columns: 1fr; }
      .admin-grid { grid-template-columns: 1fr; }
      .object-grid, .studio-grid { grid-template-columns: 1fr; }
      .object-detail { position: static; }
      .portal-grid { grid-template-columns: repeat(3, 1fr); }
      .category-grid { grid-template-columns: repeat(4, 1fr); }
      .record-detail { position: static; }
    }
    @media (max-width: 900px) {
      .global-bar { grid-template-columns: auto 1fr auto; padding: 0 12px; gap: 10px; }
      .brand-name, .global-search .shortcut, .webmcp-label { display: none; }
      .workspace-layout { grid-template-columns: 1fr; }
      .context-rail { display: none; }
      .metric-strip { grid-template-columns: repeat(2, 1fr); }
      .metric:nth-child(2) { border-right: 0; }
      .metric:nth-child(-n+2) { border-bottom: 1px solid var(--border); }
      .review-grid { display: block; height: auto; }
      .review-pane { min-height: 460px; border-right: 0; border-bottom: 1px solid var(--border); }
      .review-pane.comments { min-height: 330px; }
      .review-pane.metadata { min-height: 0; }
      .library-grid { grid-template-columns: repeat(2, minmax(160px, 1fr)); }
      .facts { grid-template-columns: 1fr 1fr; }
      .admin-overview { grid-template-columns: repeat(2, 1fr); }
      .module-shell { grid-template-columns: 190px 1fr; }
      .module-side { grid-column: 1 / -1; border-top: 1px solid var(--border); border-left: 0; }
      .dashboard-grid { grid-template-columns: 1fr; }
      .portal-hero-inner { grid-template-columns: 1fr; gap: 18px; }
      .portal-grid { grid-template-columns: repeat(2, 1fr); }
      .system-intro { grid-template-columns: 1fr; gap: 18px; }
      .swatches { grid-template-columns: repeat(3, 1fr); }
      .type-specimen { grid-template-columns: 1fr; gap: 8px; }
    }
    @media (max-width: 620px) {
      .global-search { display: none; }
      .global-bar { grid-template-columns: 1fr auto; }
      .primary-nav { padding: 0 8px; }
      .page-header { align-items: flex-start; padding: 13px 15px; }
      .content-area { padding: 14px 12px 28px; overflow-x: auto; }
      .lifecycle { grid-template-columns: repeat(5, minmax(0, 1fr)); }
      .stage { min-width: 0; padding: 0 7px; }
      .header-actions .button:not(.primary) { display: none; }
      .metric-strip, .facts, .component-grid { grid-template-columns: 1fr; }
      .metric { border-right: 0; border-bottom: 1px solid var(--border); }
      .metric:last-child { border-bottom: 0; }
      .data-table th:nth-child(3), .data-table td:nth-child(3), .data-table th:nth-child(5), .data-table td:nth-child(5) { display: none; }
      .library-toolbar { grid-template-columns: 1fr; }
      .library-grid { grid-template-columns: 1fr; }
      .permission-row { grid-template-columns: 1fr 65px 65px; }
      .admin-overview, .form-grid, .choice-grid, .persona-grid, .state-option-grid, .review-targets { grid-template-columns: 1fr; }
      .state-preview-banner, .access-state-result { grid-template-columns: 1fr; }
      .validation-item { grid-template-columns: 1fr; }
      .admin-toolbar { grid-template-columns: 1fr; }
      .module-shell { display: block; }
      .module-nav { border-right: 0; }
      .module-assets, .portal-grid, .category-grid { grid-template-columns: 1fr; }
      .donut-wrap { grid-template-columns: 1fr; }
      .swatches { grid-template-columns: repeat(2, 1fr); }
      .paper-wrap { padding: 12px; }
      .paper { padding: 35px 30px 70px; }
      .paper h2 { font-size: 27px; }
    }

    .skip-link { position: fixed; left: 8px; top: 8px; z-index: 100; transform: translateY(-150%); background: var(--surface); color: var(--primary-strong); padding: 8px 12px; border: 2px solid var(--primary); }
    .skip-link:focus { transform: none; }
    .brand, .nav-item, .shell-button { text-decoration: none; }
    .global-search { margin: 0; max-width: none; display: block; }
    .global-search input { width: 100%; min-height: 34px; background: var(--shell-2); border-color: #46647a; color: var(--shell-text); }
    .global-search input::placeholder { color: #bed0dc; }
    main { min-height: calc(100vh - 95px); background: var(--canvas); }
    .page-shell { padding: 20px 22px 32px; }
    .metric-strip { margin-bottom: 16px; }
    .table-link { color: var(--primary-strong); font-weight: 700; }
    .operation-name { display: block; font-family: var(--mono); font-size: 12px; margin-top: 2px; }
    .result-output { max-height: 360px; overflow: auto; padding: 12px; border: 1px solid var(--border); border-radius: 3px; background: var(--surface-3); color: var(--ink); font: 12px/1.5 var(--mono); white-space: pre-wrap; }
    .action-launcher[open] { width: min(560px, calc(100vw - 32px)); }
    .action-list { display: grid; gap: 8px; }
    .action-list a { display: grid; gap: 3px; padding: 12px; border: 1px solid var(--border); color: var(--ink); text-decoration: none; }
    .action-list a:hover, .action-list a:focus-visible { border-color: var(--primary); background: var(--primary-soft); }
    .empty-state { padding: 32px; border: 1px dashed var(--border-strong); background: var(--surface); }
    @media (max-width: 620px) { .global-shell { grid-template-columns: auto 1fr auto; height: auto; min-height: 52px; } .workspace, .global-search, .global-shell > .shell-button:first-of-type { display: none; } .page-shell { padding: 16px 12px 28px; } }
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
    }