@panphora/bevel 0.1.0

package/examples/components/reference/fable/as-authored/fable.css

@@ -0,0 +1,823 @@
+/* fable.css — the Fable seat's refinement layer. Loads after bevel.css and the
+   inherited base-astra.css / base-parent.css. Organised by component. */
+
+/* ============================ FRAME ============================ */
+[hidden]{display:none!important}
+[data-ref-state]{position:relative}
+body{font-size:15px;line-height:1.5}
+.r-static-note{padding:10px 20px;border-top:1px solid var(--bevel-line);color:var(--bevel-muted);font:11px/1.5 var(--bevel-font-mono)}
+.specimen,.reference-stage{padding:32px 36px 36px;min-height:580px}
+.specimen>header{margin-bottom:26px;padding-bottom:18px;border-bottom:1px solid var(--bevel-line-2)}
+.specimen>header p,.p-header p{color:var(--bevel-ink-2);margin-top:8px;font-size:14px;max-width:520px}
+.p-header{margin-bottom:26px;padding-bottom:18px}
+h1{font-size:36px;line-height:1.08;letter-spacing:-.022em}
+.specimen>header .eyebrow,.p-header .p-eyebrow{color:var(--bevel-brass);letter-spacing:.16em;font-weight:500;margin-bottom:10px}
+.eyebrow,.p-eyebrow{font:500 10px/1.6 var(--bevel-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--bevel-muted)}
+.bevel-button{font-size:14px;padding:6px 14px;gap:7px}
+.bevel-button--small{font-size:13px;padding:4px 11px;gap:6px}
+.bevel-button svg{flex-shrink:0}
+.bevel-button--quiet{color:var(--bevel-brass)}
+.note,.p-caption{font-size:12.5px;color:var(--bevel-muted)}
+kbd,.f-keys kbd{font:500 10.5px/1 var(--bevel-font-mono);color:var(--bevel-muted);background:var(--bevel-sunk);border:1px solid var(--bevel-line-2);padding:2.5px 5px;white-space:nowrap}
+.f-mono{font-family:var(--bevel-font-mono);font-size:12px}
+mark{background:var(--bevel-brass-soft);color:inherit;padding:0 1px}
+
+/* shared: icon button, avatar palette, status line, field error, tags */
+.f-icon-button{width:32px;height:32px;display:inline-grid;place-items:center;padding:0;border:2px solid;border-color:var(--bevel-edge-hi) var(--bevel-edge-lo) var(--bevel-edge-lo) var(--bevel-edge-hi);background:var(--bevel-face);color:var(--bevel-ink);cursor:pointer;flex-shrink:0}
+.f-icon-button:hover{background:color-mix(in srgb,var(--bevel-face),var(--bevel-edge-hi) 45%)}
+.f-icon-button[aria-pressed="true"],.f-icon-button[aria-expanded="true"]{background:var(--bevel-face-in);border-color:var(--bevel-edge-in) var(--bevel-edge-in-hi) var(--bevel-edge-in-hi) var(--bevel-edge-in)}
+.f-icon-button[aria-pressed="true"] svg,.f-icon-button[aria-expanded="true"] svg{translate:1px 1px}
+.f-icon-button:disabled{opacity:.45;cursor:not-allowed}
+.f-avatar{display:inline-grid;place-items:center;width:34px;height:34px;flex-shrink:0;font:500 11px/1 var(--bevel-font-mono);letter-spacing:.02em;border:1px solid var(--bevel-line-2);background:var(--bevel-sunk);color:var(--bevel-ink-2)}
+.f-avatar.small{width:26px;height:26px;font-size:9.5px}
+.f-avatar[data-who="MC"]{background:var(--bevel-brass-soft);color:var(--bevel-brass);border-color:color-mix(in srgb,var(--bevel-brass) 30%,var(--bevel-brass-soft))}
+.f-avatar[data-who="AR"]{background:var(--bevel-teal-soft);color:var(--bevel-teal);border-color:color-mix(in srgb,var(--bevel-teal) 30%,var(--bevel-teal-soft))}
+.f-avatar[data-who="SP"]{background:var(--bevel-sunk);color:var(--bevel-ink-2);border-color:var(--bevel-line-2)}
+.f-avatar[data-who="JP"]{background:var(--bevel-ink);color:var(--bevel-ground);border-color:var(--bevel-ink)}
+.f-avatar-more{background:var(--bevel-surface);color:var(--bevel-muted);border:1px dashed var(--bevel-line-2)}
+.f-status-line{display:flex;align-items:center;gap:10px;margin-top:22px;padding:12px 14px;font-size:13.5px;color:var(--bevel-ink-2);border-top:1px solid var(--bevel-line);padding-left:0;padding-right:0}
+.f-status-line.good{color:var(--bevel-teal)}
+.f-status-line.good strong{color:var(--bevel-teal);font-weight:500}
+.f-status-line.good span{color:var(--bevel-ink-2)}
+.f-status-line .bevel-button{margin-left:auto}
+.f-field-error{display:flex;align-items:center;gap:6px;color:var(--bevel-ox);font-size:12.5px;font-weight:500;margin-top:6px}
+.f-field-error svg{flex-shrink:0}
+.field{font-size:13px;font-weight:500;color:var(--bevel-ink)}
+.f-label-dot{display:inline-block;width:8px;height:8px;background:var(--bevel-muted)}
+[data-label="design"].f-label-dot,[data-label="design"].f-tag{--tone:var(--bevel-brass);--tone-soft:var(--bevel-brass-soft)}
+[data-label="editorial"].f-label-dot,[data-label="editorial"].f-tag{--tone:var(--bevel-teal);--tone-soft:var(--bevel-teal-soft)}
+[data-label="engineering"].f-label-dot,[data-label="engineering"].f-tag{--tone:var(--bevel-ink-2);--tone-soft:var(--bevel-sunk)}
+[data-label="research"].f-label-dot,[data-label="research"].f-tag{--tone:var(--bevel-ox);--tone-soft:var(--bevel-ox-soft)}
+.f-label-dot{background:var(--tone,var(--bevel-muted))}
+.f-tag{display:inline-flex;align-items:center;gap:7px;padding:3px 6px 3px 9px;font-size:12.5px;background:var(--tone-soft);color:var(--bevel-ink);border:1px solid color-mix(in srgb,var(--tone) 28%,var(--tone-soft))}
+.f-tag::before{content:"";width:7px;height:7px;background:var(--tone)}
+.f-tag button{display:inline-grid;place-items:center;width:18px;height:18px;border:0;background:none;color:var(--bevel-muted);padding:0;cursor:pointer}
+.f-tag button:hover{color:var(--bevel-ink)}
+.f-file-icon{display:inline-grid;place-items:center;width:34px;height:34px;background:var(--bevel-sunk);border:1px solid var(--bevel-line);color:var(--bevel-muted);flex-shrink:0}
+.f-archive-card{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--bevel-sunk);border:1px solid var(--bevel-line);color:var(--bevel-ink)}
+.f-archive-card>svg{color:var(--bevel-muted);flex-shrink:0}
+.f-archive-card>div{flex:1;min-width:0}
+.f-archive-card strong{display:block;font-weight:500;font-size:14px}
+.f-archive-card small{display:block;color:var(--bevel-muted);margin-top:2px}
+.f-keys{display:inline-flex;gap:6px;align-items:center;font:11px var(--bevel-font-mono);color:var(--bevel-muted);white-space:nowrap}
+.bevel-seg .bevel-button{padding:5px 12px;font-size:13px;font-family:var(--bevel-font-sans);letter-spacing:0;text-transform:none}
+.tk-tag{color:var(--bevel-teal)}.tk-attr{color:var(--bevel-brass)}.tk-str{color:var(--bevel-ink-2)}
+.badge{font:500 11px/1.4 var(--bevel-font-mono);letter-spacing:.02em;padding:3px 7px;background:var(--bevel-sunk);color:var(--bevel-muted);border:1px solid var(--bevel-line)}
+.badge.good{background:var(--bevel-teal-soft);color:var(--bevel-teal);border-color:color-mix(in srgb,var(--bevel-teal) 28%,var(--bevel-teal-soft))}
+.badge.bad{background:var(--bevel-ox-soft);color:var(--bevel-ox);border-color:color-mix(in srgb,var(--bevel-ox) 28%,var(--bevel-ox-soft))}
+.badge.accent{background:var(--bevel-brass-soft);color:var(--bevel-brass);border-color:color-mix(in srgb,var(--bevel-brass) 28%,var(--bevel-brass-soft))}
+.badge svg{vertical-align:-1px;margin-right:3px}
+.p-badge{font:500 10.5px/1.3 var(--bevel-font-mono)}
+table td{color:var(--bevel-ink)}
+th{font:500 10.5px/1.4 var(--bevel-font-mono);letter-spacing:.1em;padding:11px 12px;background:var(--bevel-sunk);border-bottom:1px solid var(--bevel-line-2)}
+td{padding:13px 12px}
+
+/* ============================ MODAL ============================ */
+.overlay-scene{background:light-dark(rgb(43 36 27 / .16),rgb(0 0 0 / .55));padding:40px 28px}
+.micromodal__container{border:2px solid var(--bevel-ink);outline:0;box-shadow:var(--bevel-shadow)}
+.micromodal__inner{padding:34px 38px 28px}
+.micromodal__inner .eyebrow{color:var(--bevel-brass);margin-bottom:14px;padding-right:56px}
+.micromodal__heading{font-size:31px;letter-spacing:-.018em;margin-bottom:10px;padding-right:40px}
+.micromodal__content>p{color:var(--bevel-ink-2);margin-bottom:22px;font-size:14px;line-height:1.55}
+.micromodal__content .stack{gap:16px}
+.micromodal__buttons{border-top:1px solid var(--bevel-line);padding-top:18px;margin-top:26px;gap:8px}
+body[data-component="modal"] .micromodal__close,.r-diagonal-close,.f-crop-modal .micromodal__close{position:absolute;top:-2px;right:-2px;width:64px;height:64px;padding:0;border:0;background:none;cursor:pointer;clip-path:polygon(0 4%,0 0,100% 0,100% 100%,94% 100%);z-index:2}
+body[data-component="modal"] .micromodal__close svg,.r-diagonal-close svg,.f-crop-modal .micromodal__close svg{display:block;width:100%;height:100%}
+.micromodal__close-bg{fill:var(--bevel-ink)}
+.micromodal__close:hover .micromodal__close-bg,.r-diagonal-close:hover .micromodal__close-bg{fill:color-mix(in srgb,var(--bevel-ink),var(--bevel-ground) 14%)}
+.micromodal__close-x{fill:var(--bevel-ground)}
+.f-scroll-copy{max-height:200px;overflow:auto;padding-right:16px;scrollbar-width:thin;scrollbar-color:var(--bevel-line-2) transparent;border-bottom:1px solid var(--bevel-line)}
+.f-scroll-copy h3{font-size:17px;margin-top:16px}
+.f-scroll-copy h3:first-child{margin-top:0}
+.f-scroll-copy p{margin:6px 0 14px;color:var(--bevel-ink-2);font-size:14px;line-height:1.55}
+.f-scroll-hint{font:11px var(--bevel-font-mono);color:var(--bevel-muted);margin-top:8px;letter-spacing:.04em}
+
+/* ============================ POPOVER MENU ============================ */
+.anchor-stage{min-height:360px;padding:22px 24px;border:1px solid var(--bevel-line)}
+.anchor-stage .row.between strong{font-size:15px;font-weight:500}
+.f-menu-trigger{width:34px;height:34px}
+.anchor-stage .menu{margin-top:6px;width:272px;padding:6px;border-color:var(--bevel-line-2)}
+.menu button{padding:8px 10px;gap:11px;font-size:14px;color:var(--bevel-ink)}
+.menu button>span:first-child{display:inline-grid;place-items:center;width:18px;color:var(--bevel-muted)}
+.menu button:hover{background:var(--bevel-sunk)}
+.menu button:disabled{color:var(--bevel-faint)}
+.menu button:disabled>span:first-child{color:var(--bevel-faint)}
+.menu button.danger,.menu button.danger>span:first-child{color:var(--bevel-ox)}
+.menu button.danger:hover{background:var(--bevel-ox-soft)}
+.menu kbd{margin-left:auto;font-size:10px;padding:2px 5px}
+.menu hr{margin:5px 4px}
+.menu-title{padding:8px 10px 6px;font:500 10px/1.4 var(--bevel-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--bevel-muted)}
+.f-anchor-note{margin-top:120px;font-size:12.5px;color:var(--bevel-muted);text-align:center}
+
+/* ============================ DRAWER ============================ */
+.drawer-scene{grid-template-columns:1fr minmax(320px,430px)}
+.drawer-underlay{padding:32px 26px;color:var(--bevel-ink-2)}
+.drawer-underlay h2{margin-top:6px}
+.drawer-underlay .note{margin:8px 0 18px}
+.f-underlay-row{display:flex;gap:14px;padding:12px 10px;border-top:1px solid var(--bevel-line);font-size:13px;color:var(--bevel-muted)}
+.f-underlay-row:last-child{border-bottom:1px solid var(--bevel-line)}
+.f-underlay-row.is-open{background:var(--bevel-surface);color:var(--bevel-ink);box-shadow:inset 2px 0 var(--bevel-brass)}
+.drawer-panel{position:relative;border-left:2px solid var(--bevel-ink);box-shadow:var(--bevel-shadow)}
+.drawer-panel header{padding:30px 28px 20px}
+.drawer-panel header>.row:first-child{padding-right:48px;min-height:20px}
+.drawer-panel header h2{font-size:28px;margin-top:4px}
+.f-drawer-amount{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:14px}
+.f-drawer-amount .mono{font-size:26px;letter-spacing:-.03em}
+.drawer-panel main{padding:22px 28px}
+.f-detail-grid{grid-template-columns:96px 1fr;gap:12px 16px;font-size:13.5px}
+.f-detail-grid dt{font:500 10px/1.8 var(--bevel-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--bevel-muted)}
+.f-detail-grid dd{color:var(--bevel-ink)}
+.drawer-panel .rule{margin-top:18px;padding-top:16px}
+.drawer-panel .listrow{padding:11px 0;font-size:13.5px}
+.drawer-panel .listrow .mono.muted{width:20px;font-size:11px}
+.drawer-panel .listrow small{color:var(--bevel-muted)}
+.drawer-panel footer{padding:16px 28px}
+.drawer-panel footer small{color:var(--bevel-muted)}
+body[data-component="drawer"] .specimen .rule.row{margin-top:18px}
+
+/* ============================ POPCONFIRM ============================ */
+.p-panel{padding:22px 24px}
+.f-popconfirm-trigger{width:34px;height:34px}
+.p-popconfirm{position:relative;margin:14px 0 0 auto;padding:18px 20px 16px;max-width:340px;box-shadow:var(--bevel-shadow)}
+.p-popconfirm::before{content:"";position:absolute;right:11px;top:-7px;width:12px;height:12px;background:var(--bevel-surface);border-top:1px solid var(--bevel-line-2);border-left:1px solid var(--bevel-line-2);transform:rotate(45deg)}
+.f-popconfirm-head{display:flex;align-items:center;gap:9px;color:var(--bevel-ox)}
+.f-popconfirm-head h3{font-size:15.5px;font-weight:600;color:var(--bevel-ink)}
+.p-popconfirm p{font-size:13.5px;color:var(--bevel-ink-2);margin-top:8px;line-height:1.5}
+.p-popconfirm .p-actions{margin-top:16px;gap:8px}
+
+/* ============================ COMBOBOX ============================ */
+.p-picker{width:440px}
+.p-field{font-size:13px;font-weight:500}
+.f-search{padding:0 4px 0 12px;gap:10px;min-height:42px;transition:border-color .14s,outline-color .14s}
+.f-search>svg{color:var(--bevel-muted)}
+.f-search input{font-size:15px;padding:8px 0}
+.f-search.is-open{border-color:var(--bevel-brass);outline:2px solid var(--bevel-brass);outline-offset:1px}
+.f-combo-toggle{width:30px;height:30px;border-width:1px;border-color:transparent;background:none}
+.f-combo-toggle svg{transition:transform .14s}
+.f-combo-toggle[aria-expanded="true"]{background:none;border-color:transparent}
+.f-combo-toggle[aria-expanded="true"] svg{transform:rotate(180deg);translate:0}
+.p-options{padding:5px;border-color:var(--bevel-line-2);box-shadow:var(--bevel-shadow)}
+.p-option{padding:8px 10px;gap:12px}
+.p-option[aria-selected="true"]{background:var(--bevel-sunk);box-shadow:inset 2px 0 var(--bevel-brass)}
+.p-option[aria-selected="true"]>svg{color:var(--bevel-brass)}
+.p-person strong{font-size:14px;font-weight:500;color:var(--bevel-ink)}
+.p-person strong mark{background:var(--bevel-brass-soft);color:var(--bevel-brass);font-weight:600}
+.p-person small{font-size:12px}
+.f-empty{padding:26px 18px;color:var(--bevel-muted)}
+.f-empty>svg{color:var(--bevel-faint);margin-bottom:10px}
+.f-empty h3{font-size:15px;font-weight:500;margin-bottom:4px;color:var(--bevel-ink)}
+.f-empty p{max-width:32ch;margin:0 auto;font-size:13px}
+.f-empty .bevel-button{margin-top:14px}
+.p-picker-foot{padding:10px 12px;font-size:10.5px}
+
+/* ============================ MULTI-SELECT ============================ */
+.f-tag-field{display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-height:48px;padding:8px 10px;background:var(--bevel-surface);border:1px solid var(--bevel-line-2)}
+.f-tag-field .p-row{gap:8px}
+.f-tag-field.is-open{border-color:var(--bevel-brass);outline:2px solid var(--bevel-brass);outline-offset:1px}
+.f-tag-field [data-tag-placeholder]{color:var(--bevel-faint);font-size:14px;padding-left:2px}
+.f-tag-popover{margin-top:6px;box-shadow:var(--bevel-shadow)}
+.f-tag-popover .p-search{padding:0 12px;gap:10px;min-height:40px;border-color:var(--bevel-line-2)}
+.f-tag-popover .p-search input{font-size:14px;padding:8px 0}
+.f-tag-popover .p-search svg{color:var(--bevel-muted)}
+.f-tag-popover .p-options{box-shadow:none}
+.f-tag-popover .p-option{padding:7px 10px}
+.f-tag-popover .bevel-checkbox{gap:10px;font-size:14px}
+.f-tag-popover .bevel-checkbox .f-label-dot{margin-right:2px}
+body[data-component="multi-select-picker"] .p-picker-foot{border:0;padding:12px 2px 0}
+
+/* ============================ SELECTABLE CARDS ============================ */
+.choice{padding:18px 22px;gap:16px;align-items:flex-start}
+.choice strong{font-size:15.5px;font-weight:500;color:var(--bevel-ink)}
+.choice p{font-size:13.5px;color:var(--bevel-ink-2);margin:5px 0 10px}
+.choice:has(:checked){background:color-mix(in srgb,var(--bevel-brass-soft) 60%,var(--bevel-surface));box-shadow:inset 3px 0 var(--bevel-brass)}
+.choice:has(:disabled){opacity:.7}
+.choice:has(:disabled) strong{color:var(--bevel-muted)}
+.choice .bevel-radio__ring,.choice .bevel-checkbox__box{margin-top:1px}
+.choice .badge svg{color:var(--bevel-muted)}
+
+/* ============================ UPLOAD DROPZONE ============================ */
+.p-dropzone{border:1px dashed var(--bevel-line-2);padding:34px 20px;transition:padding .14s}
+.p-dropzone>svg{color:var(--bevel-brass);margin-bottom:10px}
+.p-dropzone h3{font-size:15.5px;font-weight:500}
+.p-dropzone p{margin:5px 0 16px;color:var(--bevel-muted)}
+.p-dropzone.is-compact{display:flex;align-items:center;gap:14px;text-align:left;padding:12px 16px;margin-bottom:6px}
+.p-dropzone.is-compact>svg{margin:0;width:22px;height:22px}
+.p-dropzone.is-compact h3{font-size:14px}
+.p-dropzone.is-compact p{margin:0;flex:1}
+.p-dropzone.is-compact .bevel-button{margin-left:auto}
+.f-upload-row{padding:14px 0;gap:14px}
+.f-upload-row img{width:48px;height:40px;border:1px solid var(--bevel-line-2)}
+.f-upload-row strong{font-size:13.5px;font-weight:500}
+.f-upload-row p{margin-top:2px;font-size:12.5px}
+.p-progress{background:var(--bevel-line);margin-top:9px;height:4px}
+.p-progress span{background:var(--bevel-ink)}
+.f-file-pct{font:500 12px var(--bevel-font-mono);color:var(--bevel-ink)}
+.f-file-state{display:inline-flex;align-items:center;gap:5px;font:500 11px var(--bevel-font-mono);text-transform:uppercase;letter-spacing:.06em}
+.f-file-state.good{color:var(--bevel-teal)}
+.f-file-state.bad{color:var(--bevel-ox)}
+.f-file-actions{display:inline-flex;align-items:center;gap:12px}
+.f-crop-head{margin:20px 0 10px}
+.f-crop-head strong{font-size:14px;font-weight:500}
+.qc-box{box-shadow:0 0 0 1000px rgb(0 0 0 / .5)}
+body[data-component="upload-dropzone"] .p-actions{margin-top:16px;padding-top:14px}
+
+/* ============================ INLINE EDIT ============================ */
+.f-inline-wrap{max-width:520px;margin:38px auto 0}
+.inline-title{padding:18px 0;margin-top:22px}
+.inline-title h2{font-size:32px}
+.f-inline-hint{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:22px}
+.f-inline-hint .eyebrow{color:var(--bevel-brass)}
+.r-inline-name{position:relative;margin:0;padding:18px 0 16px;min-height:0;font-size:32px;border-top:1px solid var(--bevel-line);border-bottom:2px solid var(--bevel-brass);background:linear-gradient(transparent,transparent);outline:0}
+.r-inline-name::after{content:"";display:inline-block;vertical-align:-4px;height:30px;margin-left:2px;border-left:1.5px solid var(--bevel-ink);animation:f-caret 1s steps(1) infinite}
+@keyframes f-caret{50%{opacity:0}}
+.r-inline-name[aria-invalid="true"]{border-bottom-color:var(--bevel-ox);color:var(--bevel-faint)}
+.r-inline-name[aria-invalid="true"]::after{display:inline-block;border-color:var(--bevel-ox);margin-left:0}
+.r-inline-name .r-placeholder{font-style:italic;color:var(--bevel-faint)}
+body[data-component="inline-edit"] .actions{margin-top:18px}
+.f-inline-saved{margin-top:12px;border:0;padding:0}
+.f-inline-saved span{color:var(--bevel-teal)}
+
+/* ============================ SETTINGS ROWS ============================ */
+.f-setting{grid-template-columns:1fr 190px;gap:24px;padding:20px 0;align-items:center}
+.f-setting strong{font-size:15px;font-weight:500;color:var(--bevel-ink)}
+.f-setting p{font-size:13px;color:var(--bevel-ink-2);margin-top:4px;max-width:44ch}
+.f-setting>.bevel-toggle,.f-setting>.bevel-button,.f-setting>.bevel-select{justify-self:end}
+.f-setting .bevel-toggle__label{font-size:13.5px}
+.f-setting .bevel-select{width:190px}
+.f-setting .bevel-select__field{font-size:14px;padding:6px 32px 6px 11px}
+.f-setting>.bevel-button{min-width:120px}
+.f-settings-disabled{opacity:.62}
+.f-locked{color:var(--bevel-muted);font-size:13px;margin-top:20px}
+.f-locked svg{color:var(--bevel-muted)}
+
+/* ============================ FORM ERROR SUMMARY ============================ */
+.f-error-summary{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;font-size:13.5px;line-height:1.5}
+.f-error-summary>svg{flex-shrink:0;margin-top:2px}
+.f-error-summary strong{display:block;font-weight:600;color:var(--bevel-ink)}
+.notice.error.f-error-summary{color:var(--bevel-ink)}
+.notice.error.f-error-summary>svg{color:var(--bevel-ox)}
+.notice.success.f-error-summary{color:var(--bevel-ink)}
+.notice.success.f-error-summary>svg{color:var(--bevel-teal)}
+.notice.success.f-error-summary strong{color:var(--bevel-teal)}
+.notice.success.f-error-summary span{color:var(--bevel-ink-2)}
+.f-error-summary ul{margin:6px 0 0;padding-left:18px;display:grid;gap:3px}
+.f-error-summary a{color:var(--bevel-ox);font-weight:500;text-decoration-color:color-mix(in srgb,var(--bevel-ox) 50%,transparent)}
+.f-error-summary a:hover{text-decoration-color:var(--bevel-ox)}
+body[data-component="form-error-summary"] .stack{margin-top:22px;gap:18px}
+.f-field.is-invalid{color:var(--bevel-ox)}
+.f-field .f-field-error{margin-top:0}
+body[data-component="form-error-summary"] .actions{margin-top:22px;padding-top:18px;border-top:1px solid var(--bevel-line)}
+
+/* ============================ SPLIT BUTTON ============================ */
+.p-split-button{display:inline-flex;align-items:stretch;height:36px;border:2px solid;border-color:var(--bevel-edge-hi) var(--bevel-edge-lo) var(--bevel-edge-lo) var(--bevel-edge-hi);background:var(--bevel-face)}
+.p-split-button>button{height:32px;min-height:0;border:0;background:var(--bevel-face);color:var(--bevel-ink);box-shadow:none;transform:none;font-size:13.5px;cursor:pointer}
+.p-split-button>.bevel-button{padding:0 12px 0 11px;gap:7px}
+.p-split-button>.bevel-button .bevel-button__label{display:inline-flex;align-items:center;gap:7px}
+.p-split-button>.bevel-button .bevel-button__label svg{color:var(--bevel-muted)}
+.p-split-button>button:hover{background:color-mix(in srgb,var(--bevel-face),var(--bevel-edge-hi) 45%)}
+.f-split-caret{display:inline-grid;place-items:center;width:30px;padding:0}
+.p-split-button[data-divider="line"]>.f-split-caret{border-left:1px solid color-mix(in srgb,var(--bevel-edge-lo) 70%,var(--bevel-ink))}
+.p-split-button[data-divider="inset"]>.f-split-caret{border-left:1px solid var(--bevel-edge-lo);box-shadow:inset 1px 0 var(--bevel-edge-hi)}
+.p-split-button>.f-split-caret[aria-expanded="true"]{background:var(--bevel-face-in);box-shadow:inset 1px 1px var(--bevel-edge-in),inset -1px -1px var(--bevel-edge-in-hi)}
+.p-split-button>.f-split-caret[aria-expanded="true"] svg{transform:rotate(180deg)}
+.p-split-button:has(:disabled){opacity:.5}
+.p-split-button:has(:disabled)>button{cursor:not-allowed}
+.r-split-label{display:flex;align-items:center;gap:8px;font:11px var(--bevel-font-mono);color:var(--bevel-muted);margin-bottom:16px;letter-spacing:.04em}
+.f-variant{display:inline-grid;place-items:center;width:18px;height:18px;border:1px solid var(--bevel-line-2);font-weight:600;color:var(--bevel-ink)}
+.f-split-menu{margin:8px 0 0 auto;width:236px;box-shadow:var(--bevel-shadow)}
+.f-split-menu button{padding:9px 10px;gap:10px}
+.f-split-menu button svg:first-child{color:var(--bevel-muted)}
+.f-split-menu button[aria-checked="true"] svg:last-child{color:var(--bevel-brass)}
+.f-split-menu .p-menu-title{padding:8px 10px 6px}
+.f-split-note{margin-top:38px}
+body[data-component="split-button"] .p-between h2{font-size:26px}
+
+/* ============================ SIDEBAR NAV ============================ */
+.p-app-shell{min-height:380px}
+.p-sidebar{position:relative;width:212px}
+.p-sidebar.compact{width:68px}
+.p-sidebar-brand{padding:16px 12px 16px 16px;gap:9px;min-height:64px;align-items:center}
+.p-sidebar-brand>svg{width:18px;height:18px;color:var(--bevel-brass)}
+.p-sidebar-brand strong{font-size:18px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.p-sidebar-brand>.r-collapse{width:26px;height:26px;margin-left:auto;flex-shrink:0}
+.p-sidebar.compact .p-sidebar-brand{flex-direction:column;gap:12px;padding:16px 8px}
+.p-sidebar.compact .r-collapse{margin:0}
+.p-sidebar-links{padding:14px 9px}
+.p-sidebar-links .p-eyebrow{padding:0 9px 8px;color:var(--bevel-muted)}
+.p-nav-item{padding:8px 9px;margin:2px 0;font-size:13.5px;color:var(--bevel-ink-2)}
+.p-nav-item svg{color:var(--bevel-muted)}
+.p-nav-item.active{color:var(--bevel-ink);background:var(--bevel-surface);box-shadow:inset 2px 0 var(--bevel-brass),0 0 0 1px var(--bevel-line)}
+.p-nav-item.active svg{color:var(--bevel-ink)}
+.f-count{font:500 10.5px var(--bevel-font-mono);color:var(--bevel-muted);background:var(--bevel-sunk);border:1px solid var(--bevel-line);padding:1px 5px}
+.p-nav-item.active .f-count{color:var(--bevel-ink);background:var(--bevel-brass-soft);border-color:color-mix(in srgb,var(--bevel-brass) 25%,var(--bevel-brass-soft))}
+.p-sidebar.compact .p-nav-item{justify-content:center;padding:10px 0}
+.p-sidebar footer.r-identity{gap:10px;padding:12px 12px 12px 14px;border-top:1px solid var(--bevel-line-2);font-size:12px;position:relative}
+.r-identity>span:nth-child(2){flex:1;min-width:0}
+.r-identity strong{display:block;font-size:13px;font-weight:500;color:var(--bevel-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.r-identity small{display:block;font-size:11px;color:var(--bevel-muted);margin-top:1px}
+.f-identity-more{display:inline-grid;place-items:center;width:22px;height:22px;border:0;background:none;color:var(--bevel-muted);padding:0;cursor:pointer}
+.p-sidebar.compact .r-identity>span:nth-child(2),.p-sidebar.compact .f-identity-more{display:none}
+.p-sidebar.compact footer.r-identity{justify-content:center;padding:12px 8px}
+.p-app-content{padding:22px 26px}
+.p-app-content h2{margin-top:2px}
+.p-app-content>p{margin:8px 0 14px}
+.f-doc-row{padding:14px 0;gap:14px}
+.f-doc-row>svg:first-child{color:var(--bevel-muted)}
+.f-doc-row strong{font-size:14px;font-weight:500;color:var(--bevel-ink)}
+.f-doc-row p{font-size:12px;margin-top:2px}
+.f-doc-row>svg:last-child{color:var(--bevel-faint)}
+
+/* ============================ APP TOOLBAR ============================ */
+.f-toolbar{padding:10px 12px;gap:8px;border-color:var(--bevel-line-2);background:var(--bevel-surface)}
+.f-toolbar-sep{width:1px;height:24px;background:var(--bevel-line-2);margin:0 2px}
+.f-toolbar .f-icon-button{width:34px;height:34px}
+.f-toolbar-seg{display:inline-flex}
+.f-toolbar-seg .f-icon-button+.f-icon-button{margin-left:-2px}
+.f-toolbar-seg .f-icon-button[aria-pressed="true"]{position:relative;z-index:1}
+.f-toolbar .bevel-button{height:34px;padding:0 12px;font-size:13.5px}
+.f-toolbar .bevel-button svg{color:var(--bevel-muted)}
+.f-toolbar-search{display:flex;align-items:center;gap:8px;width:220px;height:34px;padding:0 8px 0 10px;background:var(--bevel-surface);border:1px solid var(--bevel-line-2);color:var(--bevel-muted)}
+.f-toolbar-search input{border:0;background:none;padding:0;font-size:13.5px;flex:1;min-width:0;height:100%;outline:0}
+.f-toolbar-search:focus-within{border-color:var(--bevel-brass);outline:2px solid var(--bevel-brass);outline-offset:1px}
+.f-toolbar-search kbd{font-size:10px}
+body[data-component="app-toolbar"] .rule.row.between{margin-top:22px}
+body[data-component="app-toolbar"] .listrow{padding:12px 0;gap:14px}
+body[data-component="app-toolbar"] .listrow strong{font-size:14px;font-weight:500}
+body[data-component="app-toolbar"] .listrow small{color:var(--bevel-muted)}
+.f-overflow-anchor{display:flex;justify-content:flex-end;margin-top:6px}
+.f-overflow-menu{width:230px;box-shadow:var(--bevel-shadow)}
+.f-overflow-menu button{gap:10px;font-size:13.5px}
+.f-overflow-menu button>span{display:inline-grid;place-items:center;width:18px;color:var(--bevel-muted)}
+
+/* ============================ BREADCRUMBS ============================ */
+.f-breadcrumb{gap:8px;font-size:13.5px;padding:12px 0 14px}
+.f-breadcrumb a{color:var(--bevel-brass);text-decoration:none;padding:2px 0}
+.f-breadcrumb a:hover{text-decoration:underline}
+.f-breadcrumb span[aria-hidden]{display:inline-grid;color:var(--bevel-faint)}
+.f-breadcrumb strong{font-weight:500;color:var(--bevel-ink)}
+.f-crumb-more{display:none;border:1px solid var(--bevel-line-2);background:var(--bevel-surface);color:var(--bevel-muted);font:600 13px/1 var(--bevel-font-mono);padding:3px 7px 5px;cursor:pointer}
+.f-crumb-more-sep{display:none}
+body[data-component="breadcrumbs"] .specimen>div[style]{padding-top:32px!important}
+body[data-component="breadcrumbs"] .specimen h1{font-size:40px}
+body[data-component="breadcrumbs"] .specimen p.muted{color:var(--bevel-ink-2);font-size:15px}
+body[data-component="breadcrumbs"] .rule.row{margin-top:24px}
+body[data-component="breadcrumbs"] .rule.row small{color:var(--bevel-muted)}
+
+/* ============================ PAGINATION ============================ */
+.f-pager-row{margin-top:18px;padding-top:16px;gap:14px}
+.f-pager-row small{font:12px var(--bevel-font-mono);color:var(--bevel-muted)}
+.f-pagination{gap:4px}
+.f-pagination .bevel-button{min-width:34px;height:34px;padding:0 8px;font:500 13px var(--bevel-font-mono)}
+.f-pagination .bevel-button svg{color:var(--bevel-ink)}
+.f-pagination .bevel-button:disabled svg{color:var(--bevel-muted)}
+.f-pagination .current{background:var(--bevel-face-in);border-color:var(--bevel-edge-in) var(--bevel-edge-in-hi) var(--bevel-edge-in-hi) var(--bevel-edge-in);color:var(--bevel-ink)}
+.f-pagination .current .bevel-button__label{translate:1px 1px}
+.f-page-gap{display:inline-grid;place-items:center;min-width:24px;height:34px;color:var(--bevel-faint);font:13px var(--bevel-font-mono);letter-spacing:.1em}
+body[data-component="pagination"] .note{margin-top:14px}
+
+/* ============================ TREE VIEW ============================ */
+.p-tree{padding:6px 8px 8px;max-width:480px}
+.p-tree-head{padding:12px 10px 12px;margin-bottom:6px}
+.p-tree summary{display:flex;align-items:center;gap:8px;padding:0 8px;height:28px;margin:4px 0;font-size:14px;font-weight:500;color:var(--bevel-ink);list-style:none}
+.p-tree summary::-webkit-details-marker{display:none}
+.p-tree summary:hover{background:var(--bevel-sunk)}
+.p-tree summary svg{margin:0;color:var(--bevel-muted)}
+.f-tree-caret{display:inline-grid;place-items:center;width:14px;height:14px;color:var(--bevel-muted)}
+.f-tree-caret svg{transition:transform .14s}
+details[open]>summary .f-tree-caret svg{transform:rotate(90deg)}
+.p-tree-children{margin-left:15px;padding-left:12px;border-left:1px solid var(--bevel-line)}
+.p-tree-leaf{display:flex;align-items:center;gap:8px;height:28px;padding:0 8px 0 10px;margin:4px 0;font-size:13.5px;color:var(--bevel-ink-2);border-left:2px solid transparent;line-height:1}
+.p-tree-leaf:hover{background:var(--bevel-sunk)}
+.p-tree-leaf svg{color:var(--bevel-muted)}
+.p-tree-leaf.selected{background:var(--bevel-brass-soft);border-left-color:var(--bevel-brass);color:var(--bevel-ink);font-weight:500}
+.p-tree-leaf.selected svg{color:var(--bevel-brass)}
+.f-tree-open{font-size:9.5px;padding:2px 5px;color:var(--bevel-brass);background:none;border-color:color-mix(in srgb,var(--bevel-brass) 40%,transparent)}
+.p-tree summary .p-badge{font-size:9.5px;padding:1px 5px;margin-left:2px}
+.p-tree-empty{display:flex;align-items:center;gap:8px;height:28px;margin:4px 0 4px 15px;padding:0 10px 0 12px;border-left:1px dashed var(--bevel-line-2);font-size:12.5px;color:var(--bevel-muted)}
+.p-tree-empty svg{color:var(--bevel-faint)}
+
+/* ============================ WIZARD SHELL ============================ */
+.f-wizard{grid-template-columns:176px 1fr;gap:34px}
+.wizard-steps{border-right:1px solid var(--bevel-line);padding-right:22px;position:relative}
+.wizard-step{position:relative;padding:0 0 26px 40px;color:var(--bevel-muted);font-size:13px;line-height:1.35}
+.wizard-step::before{content:"";position:absolute;left:14px;top:30px;bottom:-2px;width:1px;background:var(--bevel-line-2)}
+.wizard-step:last-child::before{display:none}
+.wizard-step b{position:absolute;left:0;top:-1px;display:grid;place-items:center;width:30px;height:30px;margin:0;border:1px solid var(--bevel-line-2);font:500 12px/1 var(--bevel-font-mono);color:var(--bevel-muted);background:var(--bevel-surface)}
+.wizard-step[data-step="done"] b{color:var(--bevel-teal);border-color:color-mix(in srgb,var(--bevel-teal) 45%,var(--bevel-line-2));background:var(--bevel-teal-soft)}
+.wizard-step[data-step="done"]{color:var(--bevel-ink-2)}
+.wizard-step[data-step="done"]::before{background:var(--bevel-teal)}
+.wizard-step.current{color:var(--bevel-ink);font-weight:600}
+.wizard-step.current b{background:var(--bevel-ink);color:var(--bevel-ground);border-color:var(--bevel-ink);box-shadow:0 0 0 3px var(--bevel-brass-soft)}
+.f-step-note{display:block;margin-top:3px;font:400 11px var(--bevel-font-mono);color:var(--bevel-muted);letter-spacing:.02em}
+.wizard-step[data-step="done"] .f-step-note{color:var(--bevel-teal)}
+.wizard-step.current .f-step-note{color:var(--bevel-brass)}
+.f-wizard>div:last-child .eyebrow{color:var(--bevel-brass)}
+.f-wizard h2{font-size:27px;margin-top:6px}
+.f-wizard-lede{font-size:14px;margin:10px 0 22px;color:var(--bevel-ink-2)}
+.f-wizard .actions{margin-top:22px;padding-top:18px;border-top:1px solid var(--bevel-line)}
+.f-wizard .note{margin-top:14px}
+.f-wizard .badge.good svg{color:var(--bevel-teal)}
+
+/* ============================ TOAST STACK ============================ */
+.f-toast-stage{padding:22px;min-height:330px;justify-content:flex-end;align-items:flex-end;gap:10px}
+.f-toast{width:400px;padding:14px 12px 14px 16px;gap:12px;border-left-width:3px;box-shadow:var(--bevel-shadow);flex-wrap:nowrap}
+.f-toast .p-toast-icon{padding-top:1px;color:var(--bevel-brass)}
+.f-toast.success .p-toast-icon{color:var(--bevel-teal)}
+.f-toast.error .p-toast-icon{color:var(--bevel-ox)}
+.f-toast h3{font-size:14px;font-weight:600;color:var(--bevel-ink)}
+.f-toast p{font-size:12.5px;color:var(--bevel-ink-2);margin-top:3px}
+.f-toast-action{margin-top:10px;height:26px;padding:0 9px;font-size:12px}
+.f-toast-action svg{color:var(--bevel-muted)}
+.f-toast-close{width:24px;height:24px;display:inline-grid;place-items:center;border:0;background:none;color:var(--bevel-muted);padding:0;cursor:pointer;flex-shrink:0;margin:-2px -2px 0 0}
+.f-toast-close:hover{color:var(--bevel-ink);background:var(--bevel-sunk)}
+
+/* ============================ PERSISTENT BANNER ============================ */
+.f-banner{border-top:0;border-left:3px solid var(--bevel-brass);padding:16px 18px;gap:14px;align-items:center;background:color-mix(in srgb,var(--bevel-brass-soft) 70%,var(--bevel-surface))}
+.f-banner>span:first-child{color:var(--bevel-brass);display:inline-grid;place-items:center;width:36px;height:36px;background:var(--bevel-surface);border:1px solid color-mix(in srgb,var(--bevel-brass) 25%,var(--bevel-line))}
+.f-banner h3{font-size:15px;font-weight:600}
+.f-banner p{font-size:13px;color:var(--bevel-ink-2);margin-top:3px}
+.f-banner-actions{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
+.f-banner-meta{font:10.5px var(--bevel-font-mono);color:var(--bevel-muted);letter-spacing:.02em;white-space:nowrap}
+.f-banner.resolved{border-left-color:var(--bevel-teal);background:color-mix(in srgb,var(--bevel-teal-soft) 70%,var(--bevel-surface))}
+.f-banner.resolved>span:first-child{color:var(--bevel-teal);border-color:color-mix(in srgb,var(--bevel-teal) 25%,var(--bevel-line))}
+.f-banner-page{margin-top:18px;padding:22px 24px}
+.f-banner-page h2{font-size:26px}
+.f-banner-page p{margin-top:10px;font-size:14px}
+
+/* ============================ SAVED ============================ */
+.f-saved-page{min-height:580px;padding:32px 36px;position:relative}
+.f-saved-page header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:16px;border-bottom:1px solid var(--bevel-line-2)}
+.f-saved-page header .eyebrow{color:var(--bevel-brass)}
+.f-saved-meta{display:inline-flex;gap:10px;align-items:center}
+.f-saved-meta .mono{font-size:11px}
+.f-saved-page article{max-width:480px;margin:48px auto}
+.f-saved-page article .eyebrow{color:var(--bevel-muted)}
+.f-saved-page h1{font:38px/1.12 var(--bevel-font-serif);letter-spacing:-.02em;margin:14px 0 18px}
+.f-saved-page p{font-size:15.5px;line-height:1.7;color:var(--bevel-ink-2);margin:0 0 14px}
+.r-saved-chip{position:absolute;right:16px;bottom:16px;display:inline-flex;align-items:center;gap:6px;padding:4px 12px 4px 10px;border-radius:999px;font:13px/1.6 var(--bevel-font-sans);background:var(--bevel-ink);color:var(--bevel-ground);border:0;box-shadow:var(--bevel-shadow);pointer-events:none}
+.r-saved-chip svg{color:color-mix(in srgb,var(--bevel-teal) 70%,var(--bevel-ground))}
+
+/* ============================ CODE BLOCK ============================ */
+.f-code{border-color:var(--bevel-line-2)}
+.f-code .code-head{padding:10px 12px 10px 16px;gap:10px;border-bottom:1px solid var(--bevel-line-2);background:var(--bevel-surface)}
+.f-code-name{display:inline-flex;align-items:center;gap:8px;font:500 12.5px var(--bevel-font-mono);color:var(--bevel-ink)}
+.f-code-name svg{color:var(--bevel-muted)}
+.f-code-meta{font:11px var(--bevel-font-mono);color:var(--bevel-muted)}
+.f-code .bevel-button[aria-pressed="true"]{background:var(--bevel-face-in);border-color:var(--bevel-edge-in) var(--bevel-edge-in-hi) var(--bevel-edge-in-hi) var(--bevel-edge-in)}
+.f-code .bevel-button svg{color:var(--bevel-muted)}
+.f-code-lines{margin:0;padding:14px 0;list-style:none;counter-reset:line;overflow:auto;scrollbar-width:thin;scrollbar-color:var(--bevel-line-2) transparent;font:12.5px/1.9 var(--bevel-font-mono);color:var(--bevel-ink);background:var(--bevel-sunk);white-space:pre}
+.f-code-lines li{counter-increment:line;display:grid;grid-template-columns:44px 1fr;padding:0 18px 0 0;min-width:max-content}
+.f-code-lines li::before{content:counter(line);text-align:right;padding-right:14px;color:var(--bevel-faint);user-select:none;border-right:1px solid var(--bevel-line);margin-right:14px;position:sticky;left:0;background:var(--bevel-sunk)}
+.f-code-lines li:hover{background:color-mix(in srgb,var(--bevel-surface) 50%,var(--bevel-sunk))}
+.f-code-lines.wrap-code{white-space:pre-wrap}
+.f-code-lines.wrap-code li{min-width:0}
+.f-code-lines.wrap-code code{overflow-wrap:anywhere;white-space:pre-wrap}
+.f-code code{font:inherit}
+body[data-component="code-block"] .note{margin-top:14px}
+
+/* ============================ DIFF VIEW ============================ */
+.f-diff>header{padding:10px 12px 10px 16px;font:500 12.5px var(--bevel-font-mono);border-bottom:1px solid var(--bevel-line-2)}
+.f-diff>header .p-row{gap:8px}
+.f-diff>header svg{color:var(--bevel-muted)}
+.f-diff-seg .bevel-button{font-size:12.5px;padding:3px 10px}
+.f-diff-seg .bevel-button[aria-pressed="true"]{background:var(--bevel-face-in);border-color:var(--bevel-edge-in) var(--bevel-edge-in-hi) var(--bevel-edge-in-hi) var(--bevel-edge-in)}
+.p-diff-hunk{padding:7px 16px;font-size:11px}
+.f-diff-line{padding:6px 12px;font:12px/1.7 var(--bevel-font-mono);gap:10px;color:var(--bevel-ink)}
+.f-diff-line>span:first-child{width:22px;color:var(--bevel-faint)}
+.f-diff-line>span:nth-child(2){width:12px;text-align:center;font-weight:600}
+.f-diff-line.removed>span:nth-child(2){color:var(--bevel-ox)}
+.f-diff-line.added>span:nth-child(2){color:var(--bevel-teal)}
+.removed{background:color-mix(in srgb,var(--bevel-ox-soft) 70%,var(--bevel-surface))}
+.added{background:color-mix(in srgb,var(--bevel-teal-soft) 70%,var(--bevel-surface))}
+.removed mark{background:color-mix(in srgb,var(--bevel-ox) 30%,transparent);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--bevel-ox) 60%,transparent)}
+.added mark{background:color-mix(in srgb,var(--bevel-teal) 32%,transparent)}
+.f-diff-split{display:grid;grid-template-columns:1fr 1fr}
+.f-diff-split section+section{border-left:1px solid var(--bevel-line-2)}
+.f-diff-split h3{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font:500 10.5px/1.4 var(--bevel-font-mono);text-transform:uppercase;letter-spacing:.1em;padding:9px 16px;background:var(--bevel-sunk);border-bottom:1px solid var(--bevel-line);color:var(--bevel-ink-2)}
+.f-diff-split h3 small{font-size:10px;text-transform:none;letter-spacing:0;color:var(--bevel-faint)}
+.f-diff footer{padding:10px 16px;font-size:11px}
+
+/* ============================ ACTIVITY FEED ============================ */
+.f-day{display:flex;align-items:center;gap:12px;margin:0 0 16px;color:var(--bevel-brass)}
+.f-day::after{content:"";flex:1;height:1px;background:var(--bevel-line)}
+.f-day+.timeline{margin-top:0}
+.timeline{margin-left:17px;padding-left:28px;border-left:1px solid var(--bevel-line-2);margin-bottom:8px}
+.f-event{padding-bottom:20px;position:relative}
+.f-event .f-avatar{position:absolute;left:-46px;top:-2px;width:34px;height:34px;box-shadow:0 0 0 4px var(--bevel-ground)}
+.f-event-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap}
+.f-event-head p{font-size:14px;color:var(--bevel-ink-2);margin:0}
+.f-event-head p strong{color:var(--bevel-ink);font-weight:500}
+.f-event-head time{font:11px var(--bevel-font-mono);color:var(--bevel-muted);margin:0;display:inline}
+.f-event-detail{font-size:13px;color:var(--bevel-muted);margin-top:4px}
+.f-show-more{margin-left:0;margin-top:4px}
+.f-show-more svg{color:var(--bevel-muted)}
+body[data-component="activity-feed"] .timeline+.f-day{margin-top:24px}
+
+/* ============================ STAT TILES ============================ */
+.stat-grid{border-color:var(--bevel-line-2)}
+.stat{padding:22px 22px 20px}
+.f-stat-label{color:var(--bevel-muted);margin-bottom:0}
+.stat-value{font-size:38px;letter-spacing:-.05em;margin:10px 0 6px;color:var(--bevel-ink);line-height:1}
+.f-delta{display:inline-flex;align-items:center;gap:4px;font:500 11.5px var(--bevel-font-mono);color:var(--bevel-muted)}
+.f-delta.good{color:var(--bevel-teal)}
+.f-delta.bad{color:var(--bevel-ox)}
+.sparkline{height:40px;margin-top:20px;color:var(--bevel-brass)}
+.f-spark-flat{color:var(--bevel-line-2)}
+.f-stat-foot{margin-top:18px;padding-top:14px}
+.f-stat-foot small{font-size:12.5px;color:var(--bevel-ink-2)}
+
+/* ============================ AVATAR GROUP ============================ */
+.f-avatar-stack{display:flex;align-items:center;margin:24px 0;padding-left:5px}
+.f-avatar-stack>*{margin-left:-5px;box-shadow:0 0 0 3px var(--bevel-surface)}
+.f-avatar-stack .f-avatar,.f-avatar-stack .p-avatar-photo{width:42px;height:42px}
+.f-avatar-stack .p-avatar-photo{border:1px solid var(--bevel-line-2);object-fit:cover}
+.f-avatar-stack .p-avatar-wrap{display:inline-flex}
+.p-presence{width:10px;height:10px;right:-1px;bottom:-1px;border:2px solid var(--bevel-surface)}
+.f-avatar-list{gap:0;padding-top:6px;margin-top:6px}
+.f-avatar-list .p-row{gap:12px;padding:10px 0;border-bottom:1px solid var(--bevel-line)}
+.f-avatar-list .p-row:last-child{border-bottom:0}
+.f-avatar-list strong{font-size:13.5px;font-weight:500;color:var(--bevel-ink)}
+.f-avatar-list p{font-size:12px;margin-top:1px}
+.f-presence-dot{display:inline-block;width:7px;height:7px;background:var(--bevel-teal);margin-right:6px;vertical-align:1px}
+body[data-component="avatar-group"] .p-panel h2{font-size:26px}
+body[data-component="avatar-group"] .p-between p{margin-top:5px}
+
+/* ============================ SMALL CHARTS ============================ */
+.f-chart text{fill:var(--bevel-muted);font:500 11px var(--bevel-font-mono)}
+.f-chart .grid{stroke:var(--bevel-line)}
+.f-chart .data{fill:var(--bevel-brass)}
+.f-chart .line{stroke:var(--bevel-brass);stroke-width:2.5}
+.f-chart-legend{margin-top:16px;padding-top:14px}
+.f-chart-legend small{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--bevel-ink-2)}
+.f-swatch{display:inline-block;width:9px;height:9px;background:var(--bevel-brass)}
+.f-spark-row{display:flex;align-items:flex-end;gap:36px;margin:8px 0 0}
+.f-spark-figure .stat-value{margin:0 0 6px}
+.f-spark-body{flex:1;min-width:0}
+.f-sparkline{display:block;width:100%;height:64px;margin:0}
+.f-spark-days{display:grid;grid-template-columns:repeat(7,1fr);margin-top:8px;padding-top:8px;border-top:1px solid var(--bevel-line)}
+.f-spark-days span{display:grid;justify-items:center;gap:2px;font:10px var(--bevel-font-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--bevel-faint)}
+.f-spark-days b{font-size:12px;font-weight:500;color:var(--bevel-ink);letter-spacing:0}
+.f-spark-days .is-peak b{color:var(--bevel-brass)}
+body[data-component="small-charts"] .specimen h2{font-size:30px}
+
+/* ============================ FILTER BUILDER ============================ */
+body[data-component="filter-builder"] .panel.pad{padding:20px 22px}
+body[data-component="filter-builder"] .panel .row.between{margin-bottom:18px!important}
+body[data-component="filter-builder"] .panel .row.between strong{font-size:15px;font-weight:500}
+.filters{gap:10px}
+.f-filter-row{grid-template-columns:52px 1fr 1fr 1.1fr 32px;gap:8px}
+.f-rule-word{font:500 10.5px var(--bevel-font-mono);letter-spacing:.1em;color:var(--bevel-muted);text-align:right;padding-right:4px}
+.f-filter-row .bevel-select__field{font-size:13px;padding:7px 28px 7px 10px}
+.f-filter-row .bevel-input{font-size:13px;padding:7px 10px}
+.f-rule-remove{width:32px;height:32px;border-color:transparent;background:none;color:var(--bevel-muted)}
+.f-rule-remove:hover{background:var(--bevel-sunk);color:var(--bevel-ink)}
+.f-empty-rules{display:flex;align-items:center;gap:12px;padding:16px 18px;border:1px dashed var(--bevel-line-2);color:var(--bevel-muted);font-size:13.5px}
+.f-empty-rules svg{color:var(--bevel-faint);flex-shrink:0}
+body[data-component="filter-builder"] .actions{margin-top:18px;padding-top:16px;border-top:1px solid var(--bevel-line)}
+body[data-component="filter-builder"] .actions .bevel-button svg{color:var(--bevel-muted)}
+.f-result-label{display:block;margin-bottom:6px}
+body[data-component="filter-builder"] .listrow.between strong{font-size:14.5px;font-weight:500}
+body[data-component="filter-builder"] .listrow.between .mono{font-size:15px}
+
+/* ============================ COLUMN MANAGER ============================ */
+.f-column-panel{max-width:470px;margin:auto}
+.f-column-head{padding:18px 20px 16px;border-bottom:1px solid var(--bevel-line)}
+.f-column-head h2{font-size:24px}
+.f-column-head .note{margin-top:6px}
+.f-column-item{padding:8px 12px 8px 10px;gap:10px}
+.f-column-item label{flex:1}
+.f-column-item .bevel-checkbox__label{font-size:14px;color:var(--bevel-ink)}
+.f-column-item:has(:disabled) .bevel-checkbox__label{color:var(--bevel-ink-2)}
+.f-column-item:has(input:not(:checked)) .bevel-checkbox__label{color:var(--bevel-muted)}
+.f-grip{display:inline-grid;place-items:center;width:16px;color:var(--bevel-faint);cursor:grab}
+.f-order-n{display:inline-flex;align-items:center;gap:6px;min-width:18px;font:500 11px var(--bevel-font-mono);color:var(--bevel-muted);justify-content:flex-end}
+.f-order-n i{font:500 9.5px var(--bevel-font-mono);font-style:normal;letter-spacing:.08em;text-transform:uppercase;color:var(--bevel-brass);padding:1px 5px;background:var(--bevel-brass-soft)}
+.f-column-item .badge{font-size:9.5px;padding:2px 6px}
+.f-order-btn{width:28px;height:28px}
+.f-column-item.is-moved{background:color-mix(in srgb,var(--bevel-brass-soft) 45%,var(--bevel-surface));box-shadow:inset 2px 0 var(--bevel-brass)}
+.f-column-foot{display:flex;align-items:center;gap:8px;padding:12px 20px;background:var(--bevel-sunk);color:var(--bevel-muted);font-size:12px}
+.f-column-foot svg{color:var(--bevel-faint);flex-shrink:0}
+.f-order-summary{font:11px var(--bevel-font-mono)}
+
+/* ============================ EDITABLE GRID CELLS ============================ */
+.f-grid-table td{vertical-align:middle;padding:0 12px;height:48px}
+.f-grid-table td.numeric{height:48px}
+.f-grid-table tr.is-editing-row td{background:color-mix(in srgb,var(--bevel-brass-soft) 40%,var(--bevel-surface))}
+.f-cell{position:relative}
+.f-cell-button{display:inline-flex;align-items:center;gap:8px;margin:0 -8px 0 0;padding:4px 8px;border:1px dashed transparent;background:none;font:inherit;color:var(--bevel-ink);cursor:text}
+.f-cell-button span{text-decoration:underline dotted var(--bevel-faint);text-underline-offset:4px}
+.f-cell-button svg{color:var(--bevel-faint)}
+.f-cell-button:hover{border-color:var(--bevel-line-2);background:var(--bevel-surface)}
+.f-cell-button:hover svg{color:var(--bevel-brass)}
+.f-cell-editor{display:inline-flex;align-items:stretch;justify-content:flex-end;height:32px;margin-right:-8px;background:var(--bevel-surface);border:1px solid var(--bevel-brass);outline:2px solid var(--bevel-brass);outline-offset:1px}
+.f-cell-prefix{display:inline-grid;place-items:center;padding:0 0 0 8px;color:var(--bevel-muted);font-size:12px}
+.f-cell-input{width:92px;border:0;background:none;padding:0 6px 0 4px;font:13px var(--bevel-font-mono);text-align:right;color:var(--bevel-ink);outline:0;min-width:0}
+.f-cell-editor .f-icon-button{width:28px;height:30px;border-width:0 0 0 1px;border-left:1px solid var(--bevel-line);background:var(--bevel-sunk);color:var(--bevel-muted)}
+.f-cell-editor .f-cell-ok{color:var(--bevel-teal)}
+.f-cell-editor .f-cell-cancel{color:var(--bevel-ox)}
+.f-cell-editor .f-icon-button:hover{background:var(--bevel-face)}
+.f-cell.is-invalid .f-cell-editor{border-color:var(--bevel-ox);outline-color:var(--bevel-ox);background:color-mix(in srgb,var(--bevel-ox-soft) 40%,var(--bevel-surface))}
+.f-cell.is-invalid .f-cell-input{color:var(--bevel-ox)}
+.f-cell-error{position:absolute;right:12px;top:calc(50% + 20px);display:inline-flex;align-items:center;gap:5px;font:500 11px var(--bevel-font-mono);color:var(--bevel-ox);white-space:nowrap;background:var(--bevel-surface);border:1px solid var(--bevel-ox);padding:3px 7px;z-index:1;box-shadow:var(--bevel-shadow)}
+.f-grid-table tr.is-editing-row td.f-cell.is-invalid{height:48px}
+.f-edit-note{display:flex;align-items:center;gap:8px;margin-top:16px}
+.f-edit-note svg{color:var(--bevel-faint)}
+.f-edit-note kbd{margin:0 2px}
+
+/* ============================ SPLIT PANES ============================ */
+.f-split-panes{grid-template-columns:minmax(0,var(--split)) 10px minmax(0,1fr);min-height:300px}
+.p-pane{padding:18px 14px}
+.p-pane .p-eyebrow{padding:0 7px 8px}
+.p-pane-divider{background:var(--bevel-face);color:var(--bevel-muted);border-inline:1px solid var(--bevel-line-2);cursor:col-resize}
+.p-pane-divider:hover{background:var(--bevel-face-in)}
+.p-pane-item{margin:2px 0;padding:8px 8px;font-size:13.5px;color:var(--bevel-ink-2);gap:9px;border-left:2px solid transparent}
+.p-pane-item svg{color:var(--bevel-muted)}
+.p-pane-item.active{background:var(--bevel-surface);border-left-color:var(--bevel-brass);color:var(--bevel-ink);font-weight:500}
+.p-pane-item.active svg{color:var(--bevel-brass)}
+.p-pane pre{font:12px/1.8 var(--bevel-font-mono);color:var(--bevel-ink);padding:6px 8px;margin:0}
+.p-pane-detail{padding:22px 26px}
+.p-pane-detail h2{font-size:27px;margin-top:2px}
+.p-pane-detail p{margin-top:12px;font-size:14px;color:var(--bevel-ink-2)}
+.f-pane-byline{margin-top:22px;padding-top:16px;border-top:1px solid var(--bevel-line);gap:10px}
+.f-pane-caption{display:flex;align-items:center;gap:8px;margin-top:14px;font:11px var(--bevel-font-mono);color:var(--bevel-muted)}
+
+/* ============================ RICH TEXT TOOLBAR ============================ */
+.f-rt-toolbar{padding:8px;gap:3px;border-color:var(--bevel-line-2);background:var(--bevel-sunk)}
+.f-rt-toolbar .richclay-button{min-width:32px;min-height:32px;padding:0 7px;display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:14px}
+.f-rt-toolbar .richclay-button[aria-pressed="true"] > *{translate:1px 1px}
+.f-rt-toolbar .richclay-button:disabled{opacity:.45;cursor:not-allowed}
+.f-rt-toolbar [data-richclay-control="blockMenu"]{padding:0 8px 0 11px;font-size:13.5px;min-width:118px;justify-content:space-between}
+.f-rt-toolbar [data-richclay-control="blockMenu"] svg{color:var(--bevel-muted)}
+.f-rt-toolbar [aria-expanded="true"]{background:var(--bevel-face-in);border-color:var(--bevel-edge-in) var(--bevel-edge-in-hi) var(--bevel-edge-in-hi) var(--bevel-edge-in)}
+.f-rt-toolbar .richclay-separator{height:22px;margin:0 5px;border-left:1px solid var(--bevel-line-2)}
+.f-rt-menu{top:38px;left:0;width:210px;padding:5px;box-shadow:var(--bevel-shadow)}
+.f-rt-menu .richclay-menu-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px}
+.f-rt-menu .richclay-menu-item[aria-checked="true"]{background:var(--bevel-sunk);box-shadow:inset 2px 0 var(--bevel-brass)}
+.f-rt-menu .richclay-menu-item svg{color:var(--bevel-brass)}
+.f-rt-p{font-size:14px}.f-rt-h1{font:500 18px var(--bevel-font-serif)}.f-rt-h2{font:500 15.5px var(--bevel-font-serif)}.f-rt-q{font:italic 14px var(--bevel-font-serif);padding-left:8px;border-left:2px solid var(--bevel-brass)}
+.f-rt-editor{padding:28px 30px;min-height:240px;border-color:var(--bevel-line-2);position:relative}
+.f-rt-editor h2{font-size:29px}
+.f-rt-editor p{font-size:14.5px;line-height:1.7;color:var(--bevel-ink-2);margin:14px 0}
+.f-rt-editor p strong{color:var(--bevel-ink)}
+.f-rt-editor blockquote{border-left:2px solid var(--bevel-brass);margin:20px 0;padding-left:18px;font:21px var(--bevel-font-serif);color:var(--bevel-ink)}
+.f-rt-editor a{color:var(--bevel-brass)}
+.f-rt-editor a.is-editing{background:var(--bevel-brass-soft);outline:1px solid var(--bevel-brass);outline-offset:2px}
+.f-rt-link{position:relative;display:block;width:min(100%,360px);margin:16px 0 0;padding:14px 16px 12px;border:1px solid var(--bevel-line-2);background:var(--bevel-surface);box-shadow:var(--bevel-shadow)}
+.f-rt-link::before{content:"";position:absolute;left:22px;top:-7px;width:12px;height:12px;background:var(--bevel-surface);border-top:1px solid var(--bevel-line-2);border-left:1px solid var(--bevel-line-2);transform:rotate(45deg)}
+.f-rt-link-head{display:flex;align-items:center;gap:8px;margin-bottom:12px;color:var(--bevel-muted)}
+.f-rt-link-head .eyebrow{flex:1;color:var(--bevel-ink)}
+.f-rt-link .field{margin-top:10px;display:grid;gap:5px;font-size:12px}
+.f-rt-link .field:first-of-type{margin-top:0}
+.f-rt-link-actions{display:flex;align-items:center;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--bevel-line)}
+.f-rt-link-actions .bevel-button--quiet{padding-left:4px;color:var(--bevel-ox)}
+.f-rt-link-actions .bevel-button--quiet svg{color:var(--bevel-ox)}
+.f-rt-editor.is-floating{border-top:1px solid var(--bevel-line-2);margin-top:0}
+.f-rt-float{position:relative;display:inline-flex;align-items:center;gap:3px;padding:5px;margin:8px 0 -4px 0;background:var(--bevel-sunk);border:1px solid var(--bevel-line-2);box-shadow:var(--bevel-shadow)}
+.f-rt-float::after{content:"";position:absolute;left:18px;bottom:-7px;width:12px;height:12px;background:var(--bevel-sunk);border-right:1px solid var(--bevel-line-2);border-bottom:1px solid var(--bevel-line-2);transform:rotate(45deg)}
+.f-rt-float .richclay-button{min-width:30px;min-height:30px;padding:0 6px;display:inline-flex;align-items:center;justify-content:center;font-size:14px}
+.f-rt-float .richclay-separator{height:20px;margin:0 4px;border-left:1px solid var(--bevel-line-2)}
+.f-selection{background:color-mix(in srgb,var(--bevel-brass) 28%,var(--bevel-surface));color:var(--bevel-ink);padding:1px 0}
+
+/* ============================ HYPERCMS CONTEXT ============================ */
+.hcms-context{grid-template-columns:1fr 360px}
+.hcms-preview{padding:36px 28px}
+.hcms-preview h1{font-size:40px}
+.hcms-preview img{border:1px solid var(--bevel-line-2)}
+.hcms-preview p.muted{color:var(--bevel-ink-2);font-size:14.5px;line-height:1.6}
+.f-hcms-byline{display:flex;align-items:center;gap:10px}
+.f-hcms-byline small{color:var(--bevel-muted)}
+.hcms-shell{border-left:2px solid var(--bevel-ink)}
+.hcms-shell-header{align-items:center;margin-bottom:18px}
+.hcms-shell-eyebrow{color:var(--bevel-brass);letter-spacing:.14em;font-weight:500}
+.hcms-shell-title{font-size:27px}
+.f-hcms-close{width:30px;height:30px}
+.hcms-form{gap:14px}
+.hcms-field{gap:6px}
+.hcms-label{font-size:11.5px;font-weight:500;color:var(--bevel-ink-2)}
+.hcms-field textarea{font-size:13px;padding:7px 9px;min-height:34px;border-color:var(--bevel-line-2)}
+.hcms-object-title,.hcms-array-title{font:500 10.5px/1.4 var(--bevel-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--bevel-muted);margin-bottom:12px}
+.hcms-array-title .f-count{margin-left:6px;text-transform:none;letter-spacing:0}
+.hcms-object-fields{border-left:1px solid var(--bevel-line-2);padding-left:14px}
+.hcms-card{padding:12px;gap:10px;background:var(--bevel-sunk);border-color:var(--bevel-line-2)}
+.hcms-drag-handle{color:var(--bevel-faint);padding-top:2px}
+.hcms-card-controls{position:static;text-align:right;margin-top:8px}
+.hcms-card-controls .bevel-button{font-size:12px;padding:2px 8px}
+.f-hcms-upload{align-items:center;gap:12px}
+.f-hcms-upload img{width:88px;height:60px;border:1px solid var(--bevel-line-2)}
+.f-hcms-upload small{color:var(--bevel-muted)}
+.hcms-shell-error.f-error-summary{margin-bottom:16px;padding:12px 14px;font-size:13px}
+.hcms-shell-error.f-error-summary strong{font-weight:500;color:var(--bevel-ink)}
+.hcms-error.f-field-error{font-size:11.5px;margin-top:2px}
+.hcms-shell-footer{margin-top:18px;padding-top:16px}
+
+/* ============================ QUICKCROP CONTEXT ============================ */
+.p-crop-context{padding:24px;background:light-dark(rgb(43 36 27 / .16),rgb(0 0 0 / .55))}
+.f-crop-modal{width:100%;padding:30px 30px 24px;border:2px solid var(--bevel-ink);box-shadow:var(--bevel-shadow);position:relative}
+.f-crop-modal .p-eyebrow{color:var(--bevel-brass);padding-right:56px}
+.f-crop-modal .f-crop-head{margin:0 0 16px}
+.f-crop-modal .f-crop-head h2{font-size:28px}
+.f-crop-modal .qc-stage{border:1px solid var(--bevel-line-2)}
+.p-crop-size{font-size:10.5px;padding:5px 8px}
+.p-crop-actions{margin-top:18px;gap:14px}
+.f-crop-seg .bevel-button{font:500 12.5px var(--bevel-font-mono);padding:4px 12px}
+.f-crop-note{display:inline-flex;align-items:center;gap:6px}
+.f-crop-note svg{color:var(--bevel-muted)}
+.qc-bar{margin-left:auto}
+.qc-bar .bevel-button svg{color:var(--bevel-muted)}
+
+/* ============================ NARROW ============================ */
+@media(max-width:540px){
+  .specimen,.reference-stage{padding:24px 20px 28px}
+  h1{font-size:31px}
+  .specimen>header,.p-header{margin-bottom:20px;padding-bottom:14px}
+  .overlay-scene{padding:24px 16px}
+  .micromodal__inner{padding:30px 22px 22px}
+  .micromodal__heading{font-size:27px}
+  .drawer-scene{grid-template-columns:1fr}
+  .drawer-underlay{display:none}
+  .drawer-panel{border-left:0}
+  .drawer-panel header,.drawer-panel main,.drawer-panel footer{padding-left:20px;padding-right:20px}
+  .f-detail-grid{grid-template-columns:84px 1fr}
+  .anchor-stage{padding:16px}
+  .anchor-stage .menu{max-width:100%}
+  .p-picker{width:100%}
+  .f-setting{grid-template-columns:1fr;gap:12px;padding:16px 0}
+  .f-setting>.bevel-toggle,.f-setting>.bevel-button,.f-setting>.bevel-select{justify-self:start}
+  .f-setting .bevel-select{width:100%}
+  .f-split-note{margin-top:24px}
+  body[data-component="split-button"] .p-between{flex-wrap:wrap}
+  .p-app-shell{min-height:0}
+  .p-sidebar:not(.compact){width:160px}
+  .p-sidebar-brand{padding:12px 8px 12px 12px;gap:6px}
+  .p-sidebar-brand>svg{display:none}
+  .p-sidebar-brand strong{font-size:16px}
+  .p-sidebar-brand>.r-collapse{width:24px;height:24px}
+  .p-sidebar-links{padding:10px 6px}
+  .p-nav-item{font-size:12.5px;gap:7px;padding:7px 7px}
+  .p-sidebar footer.r-identity{padding:10px 8px}
+  .p-app-content{padding:18px 14px}
+  .f-toolbar{gap:6px}
+  .f-toolbar .bevel-button{display:none}
+  .f-toolbar-search{width:100%;order:9}
+  .f-toolbar .spacer{display:none}
+  .f-toolbar-more{margin-left:auto}
+  .f-crumb-mid{display:none!important}
+  .f-crumb-more,.f-crumb-more-sep{display:inline-grid}
+  body[data-component="breadcrumbs"] .specimen h1{font-size:32px}
+  .f-pager-row{flex-direction:column;align-items:flex-start}
+  .f-wizard{grid-template-columns:1fr;gap:18px}
+  .wizard-steps{display:flex;gap:6px;border-right:0;border-bottom:1px solid var(--bevel-line);padding:0 0 14px}
+  .wizard-step{flex:1;padding:0 0 0 36px;font-size:11.5px}
+  .wizard-step::before{display:none}
+  .wizard-step b{width:28px;height:28px;top:0}
+  .f-step-note{display:none}
+  .f-toast-stage{padding:14px;min-height:0}
+  .f-toast{width:100%;padding:12px 10px 12px 14px}
+  .f-banner{padding:14px 14px 14px 16px;flex-wrap:wrap}
+  .f-banner-actions{align-items:flex-start;width:100%}
+  .f-saved-page{padding:24px 20px}
+  .f-saved-page h1{font-size:32px}
+  .f-code .code-head{padding:10px 12px}
+  .f-code-meta{display:none}
+  .f-diff-split{grid-template-columns:1fr}
+  .f-diff-split section+section{border-left:0;border-top:1px solid var(--bevel-line-2)}
+  .timeline{margin-left:14px;padding-left:24px}
+  .f-event .f-avatar{left:-41px;width:30px;height:30px;font-size:10px}
+  .stat-grid{grid-template-columns:1fr}
+  .stat{display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 16px;padding:14px 0}
+  .stat+.stat{border-left:0;border-top:1px solid var(--bevel-line)}
+  .stat .f-stat-label{grid-column:1}
+  .stat-value{grid-column:1;margin:4px 0 0;font-size:30px}
+  .stat .f-delta{grid-column:2;grid-row:1/3;justify-self:end}
+  .stat .sparkline{display:none}
+  .f-spark-row{flex-direction:column;align-items:stretch;gap:16px}
+  .f-spark-days span{font-size:9px}
+  .f-filter-row{grid-template-columns:1fr 1fr 32px;gap:6px}
+  .f-filter-row .f-rule-word{grid-column:1/-1;text-align:left;padding:0}
+  .f-filter-row .bevel-input{grid-column:1/3}
+  .f-filter-row .f-rule-remove{grid-column:3;grid-row:2/4}
+  .f-column-item{padding:8px 8px}
+  .f-grid-table td{padding:0 8px}
+  .f-split-panes{grid-template-columns:minmax(0,38%) 10px minmax(0,1fr)}
+  .p-pane{padding:12px 8px}
+  .p-pane-item{font-size:12px;padding:7px 6px}
+  .p-pane-detail{padding:16px 12px}
+  .p-pane-detail h2{font-size:22px}
+  .f-rt-editor{padding:20px 18px}
+  .f-rt-editor blockquote{font-size:18px}
+  .f-rt-toolbar [data-richclay-control="blockMenu"]{min-width:0}
+  .hcms-context{grid-template-columns:1fr}
+  .hcms-preview{display:none}
+  .hcms-shell{border-left:0}
+  .p-crop-context{padding:12px}
+  .f-crop-modal{padding:24px 18px 18px}
+  .f-crop-modal .f-crop-head{flex-wrap:wrap;gap:8px}
+  .f-crop-modal .f-crop-head h2{font-size:24px}
+  .p-crop-actions{gap:10px}
+  .qc-bar{margin-left:0;width:100%;justify-content:flex-end}
+  .choice{padding:16px}
+  .f-status-line{flex-wrap:wrap}
+  .f-inline-wrap{margin-top:24px}
+  .inline-title h2,.r-inline-name{font-size:27px}
+  .f-toolbar .f-icon-button{width:32px;height:32px}
+}