/* The design system's styles (design/_ds/offr-design-system-8b092b6a-a4b0-491c-a4b8-5e010d716e91/styles.css and its tokens), in its order. Generated by dc-convert.mjs. */
@import url('/fonts/g-388e3d131334.css');
/* tokens/fonts.css */
/* Geist (variable 300–700, uses 450 for headings) + Geist Mono, via Google Fonts. Self-host for production. */

/* tokens/colors.css */
/* Brand — sampled from the Offr mark */
:root{
--offr-blue-500:#0A6FD6;--offr-indigo-500:#4D51D7;--offr-violet-500:#5B41E1;--offr-violet-600:#4B31CF;--offr-violet-700:#3F27B4;--offr-magenta-500:#C21FB0;
--offr-paper-0:#FFFFFF;--offr-paper-25:#FAFAF9;--offr-paper-50:#F5F5F4;--offr-paper-100:#EEEEEC;--offr-paper-200:#E7E6E3;--offr-paper-300:#D6D5D1;--offr-paper-400:#A8A6A2;--offr-paper-500:#737170;--offr-paper-700:#44423F;--offr-paper-900:#1A1918;
--offr-night-950:#0B0B0A;--offr-night-900:#121211;--offr-night-850:#181817;--offr-night-800:#1F1F1D;--offr-night-700:#262624;--offr-night-600:#33332F;
--panel-ink:#141413;--panel-ink-line:#2A2A27;--on-panel:#F4F3F0;--on-panel-quiet:#A8A6A2;
}

/* LIGHT — warm paper neutrals */
:root,[data-theme="light"]{
color-scheme:light;
--bg-page:#FAFAF9;--bg-surface:#FFFFFF;--bg-sunk:#F5F5F4;--bg-sunk-2:#EEEEEC;
--line:#E7E6E3;--line-strong:#D6D5D1;
--ink:#1A1918;--ink-2:#44423F;--text-quiet:#737170;--text-faint:#A8A6A2;
--ink-hover:#33312F;--on-ink:#FFFFFF;
--scrim:rgba(26,25,24,.38);
--accent:#5B41E1;--accent-hover:#4B31CF;--accent-press:#3F27B4;--on-accent:#FFFFFF;
--accent-ink:#4A30C8;--accent-soft:#F2EFFD;--accent-soft-ink:#3F27B4;
--accent-2:#4D51D7;--accent-glow:rgba(91,65,225,.32);
--accent-fill:linear-gradient(180deg,#6A52EA 0%,#5B41E1 100%); /* @kind color */
--grad-start:#0A6FD6;--grad-end:#C21FB0; /* @kind color */
--grad:linear-gradient(90deg,#0A6FD6 0%,#4D51D7 38%,#8A3BC9 72%,#C21FB0 100%); /* @kind color */
--done:#2E7D4F;--done-soft:#EAF3ED;--done-ink:#23603C;
--check:#B7791F;--check-soft:#FAF2E3;--check-ink:#7C5212;
--wrong:#C83E3E;--wrong-soft:#FBECEB;--wrong-ink:#9A2C2C;
--card-glow-1:14%;--card-glow-2:7%; /* @kind other */
}

/* DARK — warm near-black, no tint */
[data-theme="dark"]{
color-scheme:dark;
--bg-page:#0B0B0A;--bg-surface:#121211;--bg-sunk:#181817;--bg-sunk-2:#1F1F1D;
--line:#262624;--line-strong:#33332F;
--ink:#EDECE9;--ink-2:#C9C7C2;--text-quiet:#8F8D88;--text-faint:#5F5D59;
--ink-hover:#D6D4CF;--on-ink:#0B0B0A;
--scrim:rgba(0,0,0,.66);
--accent:#8B78F6;--accent-hover:#9C8BF8;--accent-press:#7A66EE;--on-accent:#FFFFFF;
--accent-ink:#A898FA;--accent-soft:rgba(139,120,246,.12);--accent-soft-ink:#C3B8FC;
--accent-2:#7C83F7;--accent-glow:rgba(139,120,246,.34);
--accent-fill:linear-gradient(180deg,#9483F8 0%,#7C66F2 100%); /* @kind color */
--on-accent:#FFFFFF;
--done:#4CC38A;--done-soft:rgba(76,195,138,.11);--done-ink:#7AD6A8;
--check:#E2B34C;--check-soft:rgba(226,179,76,.11);--check-ink:#EECB7E;
--wrong:#EE6B6B;--wrong-soft:rgba(238,107,107,.11);--wrong-ink:#F59A9A;
--panel-ink:#1A1A18;--panel-ink-line:#2E2E2B;
--card-glow-1:26%;--card-glow-2:12%; /* @kind other */
}

/* Aliases that point at other tokens are set on every themed element, so a theme set below <html> resolves them in that theme. */
:root,[data-theme]{
--move:var(--accent);--move-soft:var(--accent-soft);--move-ink:var(--accent-soft-ink);
--bar-fill:linear-gradient(90deg,var(--accent-2),var(--accent)); /* @kind color */
}

/* tokens/theme-system.css */
/* "System" theme follows the device: put data-theme="system" on <html>. */
@media (prefers-color-scheme: dark){
[data-theme="system"]{
color-scheme:dark;
--bg-page:#0B0B0A;--bg-surface:#121211;--bg-sunk:#181817;--bg-sunk-2:#1F1F1D;--line:#262624;--line-strong:#33332F;
--ink:#EDECE9;--ink-2:#C9C7C2;--text-quiet:#8F8D88;--text-faint:#5F5D59;--ink-hover:#D6D4CF;--on-ink:#0B0B0A;--scrim:rgba(0,0,0,.66);
--accent:#8B78F6;--accent-hover:#9C8BF8;--accent-press:#7A66EE;--accent-ink:#A898FA;--accent-soft:rgba(139,120,246,.12);--accent-soft-ink:#C3B8FC;--accent-2:#7C83F7;--accent-glow:rgba(139,120,246,.34);--accent-fill:linear-gradient(180deg,#9483F8 0%,#7C66F2 100%);
--done:#4CC38A;--done-soft:rgba(76,195,138,.11);--done-ink:#7AD6A8;--check:#E2B34C;--check-soft:rgba(226,179,76,.11);--check-ink:#EECB7E;--wrong:#EE6B6B;--wrong-soft:rgba(238,107,107,.11);--wrong-ink:#F59A9A;
--panel-ink:#1A1A18;--panel-ink-line:#2E2E2B;
--elev-card:none;--elev-raised:none;--elev-popover:0 12px 32px rgba(0,0,0,.55),0 0 0 1px #262624;--elev-dialog:0 28px 72px rgba(0,0,0,.7),0 0 0 1px #262624;--elev-popup:0 14px 36px rgba(0,0,0,.6),0 0 0 1px #262624;
--focus-color:#9C8BF8;
--card-glow-1:26%;--card-glow-2:12%;
}
[data-theme="system"] .ofr-cmark{background:oklch(25% .012 var(--h,60));color:oklch(84% .035 var(--h,60))}
}

/* tokens/typography.css */
:root{
--font-sans:'Geist',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
--font-mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
--weight-regular:400;--weight-heading:450;--weight-medium:500;--weight-semibold:600;
--text-display-size:48px;--text-display-line:50px;--text-display-track:-0.045em;
--text-page-title-size:32px;--text-page-title-line:36px;--text-page-title-track:-0.035em;
--text-section-title-size:15px;--text-section-title-line:22px;--text-section-title-track:-0.012em;
--text-body-size:14px;--text-body-line:21px;
--text-small-size:13px;--text-small-line:18px;
--text-caption-size:12px;--text-caption-line:16px;
--text-eyebrow-size:11px;--text-eyebrow-line:14px;
--text-label-size:11px;--text-label-line:14px;--text-label-track:.05em;
--text-figure-size:44px;--text-figure-line:46px;--text-figure-track:-0.045em;
--text-figure-sm-size:28px;--text-figure-sm-line:32px;
--numeric:tabular-nums; /* @kind other */
}

/* tokens/spacing.css */
:root{
--space-0-5:2px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;
--page-pad-desktop:32px;--page-pad-phone:16px;
--card-pad:20px;--row-pad-y:14px;--row-pad-x:20px;
--control-h:36px;--control-h-sm:32px;--control-h-lg:44px;--touch-min:44px;
--topbar-h:64px;--bottombar-h:64px;--col-centred:760px;--col-wide:1240px;
--bp-phone:720px;--bp-desktop:1024px;
--icon-sm:14px;--icon-md:16px;--icon-lg:20px;--icon-stroke:1.75; /* @kind other */
}

/* tokens/effects.css */
:root,[data-theme="light"]{
--radius-xs:5px;--radius-sm:7px;--radius-control:10px;--radius-tile:9px;--radius-card:14px;--radius-dialog:18px;--radius-pill:999px;
--elev-card:none;
--elev-raised:0 1px 1px rgba(26,25,24,.04);
--elev-popover:0 10px 28px rgba(26,25,24,.08),0 0 0 1px rgba(26,25,24,.06);
--elev-dialog:0 24px 60px rgba(26,25,24,.16),0 0 0 1px rgba(26,25,24,.05);
--elev-popup:0 12px 32px rgba(26,25,24,.12),0 0 0 1px rgba(26,25,24,.06);
--focus-color:#5B41E1;--focus-width:2px;--focus-offset:2px;
--ease:cubic-bezier(.2,.8,.2,1); /* @kind other */
--ease-spring:cubic-bezier(.34,1.56,.64,1); /* @kind other */
--dur-press:90ms; /* @kind other */
--dur-small:160ms; /* @kind other */
--dur-card:240ms; /* @kind other */
}
[data-theme="dark"]{
--elev-card:none;
--elev-raised:none;
--elev-popover:0 12px 32px rgba(0,0,0,.55),0 0 0 1px #262624;
--elev-dialog:0 28px 72px rgba(0,0,0,.7),0 0 0 1px #262624;
--elev-popup:0 14px 36px rgba(0,0,0,.6),0 0 0 1px #262624;
--focus-color:#9C8BF8;
}
/* Reduced motion: durations collapse, spinners slow down, skeletons stop shimmering. */
@media (prefers-reduced-motion: reduce){:root{
--dur-press:1ms; /* @kind other */
--dur-small:1ms; /* @kind other */
--dur-card:1ms; /* @kind other */
}}

/* tokens/base.css */
html,body{margin:0;background:var(--bg-page);color:var(--ink);font-family:var(--font-sans);font-size:var(--text-body-size);line-height:var(--text-body-line);-webkit-font-smoothing:antialiased;font-feature-settings:"ss01" on}
*,*::before,*::after{box-sizing:border-box}
a{color:var(--accent-ink);text-decoration:none}
a:hover{color:var(--accent-hover);text-decoration:underline;text-underline-offset:3px}
::selection{background:var(--accent-soft)}
button,input,select,textarea{font-family:inherit}
.ofr-f{transition-property:background,border-color,color,box-shadow,transform,outline-offset}
.ofr-f:focus-visible,.ofr-f:has(input:focus-visible){outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}
.ofr-num{font-variant-numeric:tabular-nums}
.ofr-grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.ofr-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@keyframes ofr-spin{to{transform:rotate(360deg)}}
@keyframes ofr-shimmer{0%{background-position:100% 0}100%{background-position:-100% 0}}
@keyframes ofr-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes ofr-fade{from{opacity:0}to{opacity:1}}
@keyframes ofr-pop{0%{transform:scale(.4);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes ofr-breathe{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,currentColor 0%,transparent)}50%{box-shadow:0 0 0 3px color-mix(in srgb,var(--done) 22%,transparent)}}
@keyframes ofr-sheet{from{transform:translateY(100%)}to{transform:none}}
@media (prefers-reduced-motion: reduce){.ofr-btn,.ofr-ib,.ofr-card--interactive,.ofr-plan,.ofr-chip,.ofr-avatar{transform:none!important}.ofr-btn--primary::after{display:none}.ofr-spin{animation-duration:2.4s!important}.ofr-skel{animation:none!important}.ofr-extstatus,.ofr-extstatus__body{transition:none!important}*{animation-name:none}.ofr-spin{animation-name:ofr-spin!important}}

/* tokens/components.css */
/* Offr component layer. Components in components/ apply these classes; all values come from tokens so light/dark/system work automatically. */

/* APP ROOT — phone layout follows the root's own width (container query), the window width, or data-dev="phone". */
.ofr-app{container-type:inline-size;min-height:100%}
.ofr-app--contained{contain:layout}

/* ACTIONS */
.ofr-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:var(--control-h);padding:0 14px;border-radius:var(--radius-control);border:1px solid transparent;font:500 14px/1 var(--font-sans);letter-spacing:-.005em;white-space:nowrap;cursor:pointer;text-decoration:none!important;transition:background var(--dur-small) var(--ease),border-color var(--dur-small) var(--ease),color var(--dur-small) var(--ease),box-shadow var(--dur-card) var(--ease),transform var(--dur-small) var(--ease-spring)}
.ofr-btn:hover:not(:disabled){transform:translateY(-1px)}
.ofr-btn:active:not(:disabled){transform:translateY(0) scale(.97);transition-duration:var(--dur-press)}
.ofr-btn svg{transition:transform var(--dur-small) var(--ease-spring)}
.ofr-btn:hover:not(:disabled) span+svg{transform:translateX(3px)}
.ofr-btn:hover:not(:disabled) svg:first-child:not(:only-child){transform:scale(1.08)}
.ofr-btn:disabled{opacity:.5;cursor:not-allowed}
.ofr-btn[aria-busy="true"]{opacity:.8;cursor:progress}
.ofr-btn--sm{height:var(--control-h-sm);padding:0 12px;font-size:13px;gap:6px}
.ofr-btn--lg{height:var(--control-h-lg);padding:0 18px;font-size:15px}
.ofr-btn--full{width:100%}
.ofr-btn--primary{position:relative;overflow:hidden;background:var(--accent-fill);color:var(--on-accent);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 1px 2px var(--accent-glow)}
.ofr-btn--primary::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);transform:translateX(-120%);transition:transform .6s var(--ease);pointer-events:none}
.ofr-btn--primary:hover:not(:disabled){color:var(--on-accent);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 8px 20px -6px var(--accent-glow)}
.ofr-btn--primary:hover:not(:disabled)::after{transform:translateX(120%)}
.ofr-btn--primary:active:not(:disabled){box-shadow:inset 0 1px 2px rgba(0,0,0,.18)}
.ofr-btn--secondary{background:var(--bg-surface);color:var(--ink);border-color:var(--line-strong);box-shadow:var(--elev-raised)}
.ofr-btn--secondary:hover:not(:disabled){background:var(--bg-sunk);color:var(--ink)}
.ofr-btn--quiet{background:transparent;color:var(--ink-2);padding:0 10px}
.ofr-btn--quiet:hover:not(:disabled){background:var(--bg-sunk-2);color:var(--ink)}
.ofr-btn--danger{background:var(--wrong);color:#fff}
.ofr-btn--danger:hover:not(:disabled){filter:brightness(.92);color:#fff}
.ofr-btn--danger-quiet{background:transparent;color:var(--wrong-ink);padding:0 10px}
.ofr-btn--danger-quiet:hover:not(:disabled){background:var(--wrong-soft);color:var(--wrong-ink)}
.ofr-btn--on-grad{background:#fff;color:#15141B}
.ofr-btn--on-grad:hover:not(:disabled){background:rgba(255,255,255,.88);color:#15141B}

.ofr-ib{position:relative;width:36px;height:36px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;padding:0;border-radius:var(--radius-control);border:1px solid transparent;background:transparent;color:var(--text-quiet);cursor:pointer;transition:background var(--dur-small) var(--ease),color var(--dur-small) var(--ease),transform var(--dur-press) var(--ease)}
.ofr-ib:hover:not(:disabled){background:var(--bg-sunk-2);color:var(--ink)}
.ofr-ib:active:not(:disabled){transform:scale(.9);background:var(--line);transition-duration:var(--dur-press)}
.ofr-ib svg{transition:transform var(--dur-small) var(--ease-spring)}
.ofr-ib:hover:not(:disabled) svg{transform:scale(1.1)}
.ofr-ib:disabled{opacity:.45;cursor:not-allowed}
.ofr-ib--sm{width:30px;height:30px;border-radius:8px}
.ofr-ib--round{border-radius:50%}
.ofr-ib--raised{background:var(--bg-surface);border-color:var(--line-strong);box-shadow:var(--elev-raised);color:var(--ink-2)}
.ofr-ib--raised:hover:not(:disabled){background:var(--bg-sunk)}
.ofr-ib--danger:hover:not(:disabled){background:var(--wrong-soft);color:var(--wrong-ink)}
.ofr-tipwrap{position:relative;display:inline-flex}
.ofr-tip{position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);padding:5px 8px;border-radius:6px;background:var(--ink);color:var(--bg-surface);font:500 12px/16px var(--font-sans);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity var(--dur-small) var(--ease);z-index:60}
.ofr-tip--bottom{top:calc(100% + 6px);bottom:auto}
.ofr-tipwrap:hover .ofr-tip,.ofr-tipwrap:focus-within .ofr-tip,.ofr-tip.is-open{opacity:1}

.ofr-link{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;color:var(--accent-ink);font-weight:500;text-decoration:none;cursor:pointer;background:none;border:0;padding:0;font-size:inherit;border-radius:3px}
.ofr-link:hover{color:var(--accent-hover);text-decoration:underline;text-underline-offset:3px}
.ofr-link--inline{display:inline;white-space:normal;font-weight:inherit;text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 35%,transparent);text-underline-offset:3px}
.ofr-link--standalone{font-size:14px}
.ofr-link--standalone svg{transition:transform var(--dur-small) var(--ease)}
.ofr-link--standalone:hover svg{transform:translateX(2px)}
.ofr-link--chip{flex-shrink:0;height:26px;padding:0 6px 0 10px;border-radius:var(--radius-pill);background:var(--bg-sunk-2);color:var(--ink-2);font-size:12px;gap:2px}
.ofr-link--chip:hover{background:var(--line);color:var(--ink);text-decoration:none}
.ofr-link--on-grad{background:transparent;color:var(--on-panel);box-shadow:inset 0 0 0 1px var(--panel-ink-line)}
.ofr-link--on-grad:hover{background:rgba(255,255,255,.06);color:var(--on-panel)}

.ofr-seg{display:inline-flex;padding:3px;gap:2px;background:var(--bg-sunk-2);border-radius:var(--radius-control)}
.ofr-seg__opt{height:30px;padding:0 12px;border-radius:calc(var(--radius-control) - 3px);border:0;background:transparent;color:var(--text-quiet);font:500 13px/1 var(--font-sans);white-space:nowrap;display:inline-flex;align-items:center;gap:6px;cursor:pointer;transition:background var(--dur-small) var(--ease),color var(--dur-small) var(--ease)}
.ofr-seg__opt:hover:not(:disabled){color:var(--ink)}
.ofr-seg__opt.is-on{background:var(--bg-surface);color:var(--ink);box-shadow:0 0 0 1px var(--line),0 1px 1px rgba(0,0,0,.04)}
.ofr-seg__opt:disabled{opacity:.45;cursor:not-allowed}

.ofr-tabs{display:flex;gap:24px;box-shadow:inset 0 -1px 0 var(--line);overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.ofr-tabs::-webkit-scrollbar{display:none}
.ofr-tab{height:42px;padding:0;margin:0;border:0;border-bottom:2px solid transparent;background:none;color:var(--text-quiet);font:500 14px/1 var(--font-sans);display:inline-flex;gap:8px;align-items:center;cursor:pointer;white-space:nowrap;transition:color var(--dur-small) var(--ease),border-color var(--dur-small) var(--ease)}
.ofr-tab:hover{color:var(--ink)}
.ofr-tab{position:relative}
.ofr-tab::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--accent);transform:scaleX(0);transition:transform var(--dur-card) var(--ease-spring)}
.ofr-tab.is-on{color:var(--ink);border-bottom-color:transparent}
.ofr-tab.is-on::after{transform:scaleX(1)}

.ofr-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:var(--radius-pill);background:var(--bg-sunk-2);color:var(--ink-2);font:500 11px/1 var(--font-mono)}
.ofr-count--accent{background:var(--accent);color:var(--on-accent)}
.ofr-count--alert{background:var(--wrong);color:#fff;min-width:16px;height:16px;font-size:10px;padding:0 4px;box-shadow:0 0 0 2px var(--bg-surface)}
.ofr-tab.is-on .ofr-count{background:var(--accent-soft);color:var(--accent-soft-ink)}

.ofr-mode{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ofr-mode__opt{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:var(--radius-control);border:1px solid var(--line-strong);background:var(--bg-surface);text-align:left;cursor:pointer;color:var(--ink);transition:border-color var(--dur-small) var(--ease),box-shadow var(--dur-small) var(--ease)}
.ofr-mode__opt:hover:not(:disabled){border-color:var(--text-faint)}
.ofr-mode__opt{transition:border-color var(--dur-small) var(--ease),box-shadow var(--dur-small) var(--ease),transform var(--dur-small) var(--ease-spring)}
.ofr-mode__opt:active:not(:disabled){transform:scale(.985)}
.ofr-mode__opt.is-on{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.ofr-mode__opt:disabled{opacity:.55;cursor:not-allowed}
.ofr-mode__title{display:flex;align-items:center;gap:8px;font:600 14px/20px var(--font-sans)}
.ofr-mode__desc{font-size:12px;line-height:17px;color:var(--text-quiet)}
.ofr-mode__dot{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--line-strong);flex-shrink:0}
.ofr-mode__dot{transition:border var(--dur-small) var(--ease-spring)}
.ofr-mode__opt.is-on .ofr-mode__dot{border:4px solid var(--accent)}

.ofr-menubtn{display:inline-flex;align-items:center;gap:4px;height:36px;padding:0 10px 0 12px;border-radius:var(--radius-pill);border:0;background:transparent;color:var(--ink-2);font:500 14px/1 var(--font-sans);cursor:pointer;transition:background var(--dur-small) var(--ease),color var(--dur-small) var(--ease)}
.ofr-menubtn:hover{background:var(--bg-sunk-2);color:var(--ink)}
.ofr-menubtn svg.ofr-chev{transition:transform var(--dur-small) var(--ease)}
.ofr-menubtn.is-open{background:var(--bg-sunk-2);color:var(--ink)}
.ofr-menubtn.is-open svg.ofr-chev{transform:rotate(180deg)}
.ofr-menubtn.is-current{color:var(--ink)}

/* POPOVER / MENU */
.ofr-popwrap{position:relative;display:inline-flex}
.ofr-pop{position:absolute;top:calc(100% + 6px);left:0;z-index:80;min-width:220px;background:var(--bg-surface);border-radius:var(--radius-card);box-shadow:var(--elev-popover);padding:6px;animation:ofr-rise var(--dur-small) var(--ease)}
.ofr-pop--right{left:auto;right:0}
.ofr-menu__item{display:flex;align-items:center;gap:10px;width:100%;min-height:36px;padding:8px 10px;border:0;border-radius:8px;background:none;color:var(--ink);font:500 14px/18px var(--font-sans);text-align:left;cursor:pointer;text-decoration:none!important}
.ofr-menu__item:hover{background:var(--bg-sunk-2);color:var(--ink)}
.ofr-menu__item.is-current{color:var(--accent-ink)}
.ofr-menu__item--danger{color:var(--wrong-ink)}
.ofr-menu__sep{height:1px;background:var(--line);margin:6px 4px}
.ofr-menu__label{padding:8px 10px 4px;font-size:12px;color:var(--text-quiet)}

/* INPUTS */
.ofr-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.ofr-field--beside{display:grid;grid-template-columns:180px minmax(0,1fr);align-items:start;gap:16px}
.ofr-field--beside .ofr-field__label{padding-top:10px}
.ofr-field__label{font:500 13px/18px var(--font-sans);color:var(--ink);display:flex;justify-content:space-between;gap:8px}
.ofr-field__msg{font-size:12px;line-height:16px;color:var(--text-quiet)}
.ofr-field__msg.is-error{color:var(--wrong-ink)}
.ofr-box{display:flex;align-items:center;gap:8px;min-height:var(--control-h);padding:0 12px;background:var(--bg-surface);border:1px solid var(--line-strong);border-radius:var(--radius-control);color:var(--text-quiet);transition:border-color var(--dur-small) var(--ease),box-shadow var(--dur-small) var(--ease),background var(--dur-small) var(--ease)}
.ofr-box:hover{border-color:var(--text-faint)}
.ofr-box:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.ofr-box.is-edited{background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 35%,var(--line-strong))}
.ofr-box.is-invalid{border-color:var(--wrong);box-shadow:0 0 0 3px var(--wrong-soft)}
.ofr-box.is-disabled{background:var(--bg-sunk);border-color:var(--line);cursor:not-allowed}
.ofr-box.is-disabled input,.ofr-box.is-disabled textarea{color:var(--text-quiet);cursor:not-allowed}
.ofr-box--sm{min-height:var(--control-h-sm)}
.ofr-box--area{align-items:flex-start;padding:9px 12px}
.ofr-box input,.ofr-box textarea,.ofr-box select{flex:1;min-width:0;border:0;outline:0;background:transparent;font:400 14px/20px var(--font-sans);color:var(--ink);padding:0;margin:0}
.ofr-box textarea{resize:vertical;min-height:62px}
.ofr-box--tall textarea{min-height:160px}
.ofr-box input::placeholder,.ofr-box textarea::placeholder{color:var(--text-faint)}
.ofr-box select{appearance:none;-webkit-appearance:none;height:calc(var(--control-h) - 2px);cursor:pointer;padding-right:20px}
.ofr-box--select{position:relative}
.ofr-box--select .ofr-chev{position:absolute;right:12px;pointer-events:none}
.ofr-box--code{justify-content:center;max-width:280px;min-height:52px}
.ofr-box--code input{font:500 24px/1 var(--font-mono);letter-spacing:.55em;text-align:center;padding-left:.55em}
.ofr-search{position:relative;min-width:0}
.ofr-search__results{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:70;background:var(--bg-surface);border-radius:12px;box-shadow:var(--elev-popover);padding:6px;animation:ofr-rise var(--dur-small) var(--ease)}
.ofr-search__none{padding:12px 10px;font-size:13px;color:var(--text-quiet)}

.ofr-tick{display:flex;align-items:flex-start;gap:9px;cursor:pointer;font:400 14px/20px var(--font-sans);color:var(--ink);position:relative}
.ofr-tick input{position:absolute;opacity:0;width:1px;height:1px}
.ofr-tick>:last-child,.ofr-step>:last-child,.ofr-helpgroup li a>span,.ofr-detail__note>span{flex:1 1 auto;min-width:0}
.ofr-tick__box{width:16px;height:16px;margin-top:2px;flex-shrink:0;border-radius:4px;border:1.5px solid var(--line-strong);background:var(--bg-surface);display:flex;align-items:center;justify-content:center;color:var(--on-accent);transition:background var(--dur-small) var(--ease),border-color var(--dur-small) var(--ease),transform var(--dur-small) var(--ease-spring)}
.ofr-tick:hover .ofr-tick__box{border-color:var(--text-faint)}
.ofr-tick input:checked+.ofr-tick__box{background:var(--accent);border-color:var(--accent)}
.ofr-tick:active .ofr-tick__box{transform:scale(.85)}
.ofr-tick__box svg{animation:ofr-pop var(--dur-card) var(--ease-spring)}
.ofr-tick input:focus-visible+.ofr-tick__box{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}
.ofr-tick--xs{font-size:12px;line-height:16px;gap:6px;color:var(--text-quiet)}
.ofr-tick--xs .ofr-tick__box{width:14px;height:14px;margin-top:1px;border-radius:3.5px}
.ofr-tick.is-disabled{opacity:.5;cursor:not-allowed}

.ofr-switchrow{display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer}
.ofr-switchrow.is-disabled{cursor:not-allowed}
.ofr-switch{position:relative;width:34px;height:20px;flex-shrink:0;padding:0;border:0;border-radius:var(--radius-pill);background:var(--line-strong);cursor:pointer;transition:background var(--dur-small) var(--ease)}
.ofr-switch::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform var(--dur-small) var(--ease)}
.ofr-switch[aria-checked="true"]{background:var(--accent)}
.ofr-switch[aria-checked="true"]::after{transform:translateX(14px)}
.ofr-switch::after{transition:transform var(--dur-card) var(--ease-spring),width var(--dur-small) var(--ease)}
.ofr-switch:active:not(:disabled)::after{width:20px}
.ofr-switch[aria-checked="true"]:active:not(:disabled)::after{transform:translateX(10px)}
.ofr-lswitch .ofr-switch{background:var(--accent)}
.ofr-switch:disabled{opacity:.45;cursor:not-allowed}
.ofr-label-title{font:500 14px/20px var(--font-sans);color:var(--ink)}
.ofr-label-desc{font-size:13px;line-height:18px;color:var(--text-quiet)}

.ofr-rpill{display:inline-flex;flex-wrap:wrap;gap:6px}
.ofr-rpill__opt{height:32px;padding:0 14px;border-radius:var(--radius-pill);border:1px solid var(--line-strong);background:var(--bg-surface);color:var(--ink-2);font:500 13px/1 var(--font-sans);cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background var(--dur-small) var(--ease),border-color var(--dur-small) var(--ease),color var(--dur-small) var(--ease)}
.ofr-rpill__opt:hover:not(:disabled){background:var(--bg-sunk)}
.ofr-rpill__opt:active:not(:disabled){transform:scale(.95)}
.ofr-rpill__opt.is-on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-soft-ink)}

.ofr-lswitch{display:inline-flex;align-items:center;gap:10px;font-size:13px;line-height:18px;flex-wrap:wrap}
.ofr-lswitch__side{color:var(--text-quiet);background:none;border:0;padding:0;font:inherit;cursor:pointer;transition:color var(--dur-small) var(--ease)}
.ofr-lswitch__side.is-on{color:var(--ink);font-weight:600}
.ofr-lswitch.is-disabled{opacity:.5;pointer-events:none}

.ofr-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.ofr-chip{display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 4px 0 10px;border-radius:var(--radius-pill);background:var(--bg-surface);box-shadow:inset 0 0 0 1px var(--line-strong);color:var(--ink);font:500 13px/1 var(--font-sans)}
.ofr-chip button{display:flex;padding:3px;border:0;border-radius:50%;background:none;color:var(--text-quiet);cursor:pointer}
.ofr-chip button:hover{background:var(--line);color:var(--ink)}
.ofr-chip.is-removing{opacity:.4;text-decoration:line-through}
.ofr-chip-add{height:28px;padding:0 10px;border-radius:var(--radius-pill);border:1px dashed var(--line-strong);background:none;color:var(--text-quiet);font:500 13px/1 var(--font-sans);cursor:pointer;display:inline-flex;align-items:center;gap:4px}
.ofr-chip-add:hover{color:var(--ink);border-color:var(--text-faint)}
.ofr-chip-input{height:28px;width:140px;padding:0 10px;border-radius:var(--radius-pill);border:1px solid var(--ink-2);box-shadow:0 0 0 3px color-mix(in srgb,var(--ink) 7%,transparent);background:var(--bg-surface);color:var(--ink);font:500 13px/1 var(--font-sans);outline:0}

.ofr-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:28px 20px;border:1.5px dashed var(--line-strong);border-radius:var(--radius-card);background:var(--bg-sunk);text-align:center;transition:border-color var(--dur-small) var(--ease),background var(--dur-small) var(--ease)}
.ofr-drop.is-over{border-color:var(--accent);background:var(--accent-soft)}
.ofr-drop.is-error{border-color:var(--wrong);background:var(--wrong-soft)}
.ofr-drop>*{max-width:100%}
.ofr-drop__lead{font-size:14px;color:var(--ink-2);white-space:nowrap}
.ofr-drop__hint{font-size:12px;color:var(--text-quiet);text-wrap:balance}
.ofr-drop__file{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius-control);background:var(--bg-surface);text-align:left}

.ofr-turnstile{display:flex;align-items:center;gap:12px;width:300px;max-width:100%;height:65px;padding:0 14px;border:1px solid var(--line-strong);border-radius:6px;background:var(--bg-sunk);font-size:14px;color:var(--ink)}
.ofr-turnstile__box{width:24px;height:24px;border:2px solid var(--line-strong);border-radius:4px;background:var(--bg-surface);display:flex;align-items:center;justify-content:center;color:var(--done);cursor:pointer;flex-shrink:0}
.ofr-turnstile__brand{margin-left:auto;text-align:right;font-size:10px;line-height:13px;color:var(--text-faint)}

/* DISPLAY */
.ofr-card{background:var(--bg-surface);border:1px solid var(--line);border-radius:var(--radius-card);box-shadow:var(--elev-card);color:var(--ink);min-width:0}
.ofr-card--pad{padding:var(--card-pad)}
.ofr-card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px var(--card-pad) 0;min-height:56px}
.ofr-card__head>.ofr-card__title{flex:1 1 auto;min-width:0}
.ofr-card__head>.ofr-label-mono{white-space:nowrap}
.ofr-card__title{font:500 var(--text-section-title-size)/var(--text-section-title-line) var(--font-sans);letter-spacing:var(--text-section-title-track);margin:0}
.ofr-card__body{padding:16px var(--card-pad) var(--card-pad)}
.ofr-card--cells{display:grid;gap:1px;background:var(--line);overflow:hidden}
.ofr-card--cells>*{background:var(--bg-surface);padding:20px var(--card-pad);min-width:0}
.ofr-card--accent{position:relative;overflow:hidden;isolation:isolate}
.ofr-card--accent .ofr-prog__fill.is-default{background:var(--grad)}
.ofr-card--accent::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--grad);z-index:2;pointer-events:none}
.ofr-card--accent::after{content:"";position:absolute;width:300px;height:300px;right:-120px;top:-170px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--grad-end) var(--card-glow-1),transparent),color-mix(in srgb,var(--accent) var(--card-glow-2),transparent) 55%,transparent);z-index:-1;pointer-events:none}
.ofr-card--cells{grid-template-columns:repeat(var(--cols,2),minmax(0,1fr))}
.ofr-card--interactive{cursor:pointer;transition:border-color var(--dur-small) var(--ease),box-shadow var(--dur-card) var(--ease)}
.ofr-card--interactive{transition:border-color var(--dur-small) var(--ease),box-shadow var(--dur-card) var(--ease),transform var(--dur-card) var(--ease)}
.ofr-card--interactive:hover{border-color:var(--line-strong);transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(0,0,0,.18)}
.ofr-card--interactive:active{transform:translateY(0) scale(.995)}

.ofr-fig{display:flex;flex-direction:column;gap:10px;min-width:0}
.ofr-fig__label{display:flex;align-items:center;gap:8px;font:500 var(--text-label-size)/var(--text-label-line) var(--font-mono);letter-spacing:var(--text-label-track);text-transform:uppercase;color:var(--text-quiet)}
.ofr-fig__dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.ofr-fig__num{font:400 var(--text-figure-size)/var(--text-figure-line) var(--font-sans);letter-spacing:var(--text-figure-track);font-variant-numeric:tabular-nums;color:var(--ink)}
.ofr-fig--sm .ofr-fig__num{font-size:var(--text-figure-sm-size);line-height:var(--text-figure-sm-line);letter-spacing:-.03em}
.ofr-fig__unread{font-size:13px;color:var(--text-quiet);display:flex;align-items:center;gap:6px;height:var(--text-figure-line)}
.ofr-fig__foot{display:flex;align-items:center;gap:8px;justify-content:space-between;flex-wrap:wrap}
.ofr-fig__note{font:400 12px/16px var(--font-mono);color:var(--text-quiet)}
.ofr-fig__foot>.ofr-fig__note{flex:1 1 auto;min-width:0}
.ofr-card .ofr-fig__label{font-size:12px;color:var(--ink-2)}
.ofr-card--cells .ofr-fig__foot{justify-content:flex-start}
.ofr-fig--on-grad .ofr-fig__label,.ofr-fig--on-grad .ofr-fig__note{color:var(--on-panel-quiet)}
.ofr-fig--on-grad .ofr-fig__num{color:var(--on-panel)}

.ofr-statrow{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
.ofr-statrow>*{padding:22px var(--card-pad) 24px;border-left:1px solid var(--line)}
.ofr-statrow>*:first-child{border-left:0}

.ofr-prog{display:flex;flex-direction:column;gap:8px}
.ofr-prog__top{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:13px;line-height:18px}
.ofr-prog__label{font-weight:500;color:var(--ink)}
.ofr-prog__val{color:var(--text-quiet);font:400 12px/18px var(--font-mono)}
.ofr-prog__track{display:flex;gap:2px;height:6px;border-radius:var(--radius-pill);background:var(--bg-sunk-2);overflow:hidden}
.ofr-prog__track--sm{height:4px}
.ofr-prog__fill.is-default{background:var(--bar-fill)}
.ofr-prog__fill{height:100%;border-radius:var(--radius-pill);transition:width var(--dur-card) var(--ease)}
.ofr-prog__pair{display:grid;grid-template-columns:200px minmax(0,1fr) 40px;gap:10px;align-items:center;font-size:13px}
.ofr-prog__pair>:first-child{color:var(--text-quiet);min-width:0}
.ofr-prog__legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--text-quiet)}
.ofr-prog__legend span{display:inline-flex;align-items:center;gap:6px}
.ofr-prog__legend i{width:8px;height:8px;border-radius:2px;display:inline-block}

.ofr-chart{position:relative}
.ofr-chart__val,.ofr-chart__lbl{position:absolute;transform:translateX(-50%);white-space:nowrap;font:500 11px/14px var(--font-mono);font-variant-numeric:tabular-nums;color:var(--text-quiet);pointer-events:none}
.ofr-chart__val.is-last{color:var(--ink)}
.ofr-chart__dot{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--bg-surface);box-shadow:inset 0 0 0 1.5px var(--accent);transform:translate(-50%,-50%);pointer-events:none}
.ofr-chart__dot.is-last{width:9px;height:9px;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.ofr-chart__lbl{font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:var(--text-faint)}
.ofr-chart__lbl.is-first{transform:none}
.ofr-chart__lbl.is-last{transform:translateX(-100%)}
.ofr-chart__short{display:none}
.ofr-pill{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:var(--radius-pill);font:500 12px/1 var(--font-sans);white-space:nowrap}
.ofr-pill__dot{width:6px;height:6px;border-radius:50%;background:var(--tone,currentColor);flex-shrink:0}
.ofr-tone-done{--tone:var(--done);background:var(--done-soft);color:var(--done-ink)}
.ofr-tone-check{--tone:var(--check);background:var(--check-soft);color:var(--check-ink)}
.ofr-tone-wrong{--tone:var(--wrong);background:var(--wrong-soft);color:var(--wrong-ink)}
.ofr-tone-move{--tone:var(--accent);background:var(--move-soft);color:var(--move-ink)}
.ofr-tone-neutral{--tone:var(--text-faint);background:var(--bg-sunk-2);color:var(--ink-2)}
.ofr-pill{padding:0 9px 0 8px}

.ofr-tag{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 6px;border-radius:var(--radius-xs);font:500 10.5px/1 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.ofr-tag--outline{background:transparent;box-shadow:inset 0 0 0 1px var(--line-strong);color:var(--text-quiet)}

.ofr-cmark{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-weight:500;letter-spacing:-.02em;background:oklch(94% .035 var(--h,60));color:oklch(42% .1 var(--h,60));box-shadow:inset 0 0 0 1px color-mix(in srgb,currentColor 9%,transparent)}
[data-theme="dark"] .ofr-cmark{background:oklch(27% .04 var(--h,60));color:oklch(84% .09 var(--h,60))}
.ofr-fmark{position:relative;display:inline-flex;align-items:flex-end;justify-content:center;flex-shrink:0;width:28px;height:34px;padding-bottom:6px;border-radius:3px 8px 3px 3px;background:var(--bg-surface);box-shadow:inset 0 0 0 1px var(--line-strong);color:var(--ink-2);font:500 8.5px/1 var(--font-mono);letter-spacing:.02em}
.ofr-fmark::before{content:"";position:absolute;top:8px;left:6px;right:9px;height:1.5px;border-radius:1px;background:var(--line-strong);box-shadow:0 4px 0 var(--line-strong)}
.ofr-paper{position:relative;flex-shrink:0;width:32px;height:40px;border-radius:3px 9px 3px 3px;background:var(--bg-surface);border:1px solid var(--line-strong);box-shadow:var(--elev-raised);padding:12px 6px 0;display:flex;flex-direction:column;gap:3px;overflow:hidden}
.ofr-paper::before{content:"";position:absolute;top:-1px;right:-1px;width:9px;height:9px;background:var(--bg-sunk-2);border-left:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);border-radius:0 0 0 3px}
.ofr-paper i{display:block;height:2px;border-radius:1px;background:var(--line-strong)}
.ofr-paper i:first-child{background:var(--ink-2);opacity:.55;width:60%}

.ofr-avatar{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;background:var(--accent-soft);color:var(--accent-soft-ink);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 20%,transparent);font-weight:500;border:0;padding:0;cursor:default;transition:box-shadow var(--dur-small) var(--ease)}
button.ofr-avatar{cursor:pointer}
button.ofr-avatar:hover{box-shadow:0 0 0 3px var(--line)}

.ofr-spin{display:inline-block;flex-shrink:0;border-radius:50%;border:1.5px solid currentColor;border-right-color:transparent;animation:ofr-spin .7s linear infinite}

.ofr-skel{display:block;border-radius:6px;background:linear-gradient(90deg,var(--bg-sunk-2) 0%,var(--bg-sunk) 50%,var(--bg-sunk-2) 100%);background-size:200% 100%;animation:ofr-shimmer 1.4s ease-in-out infinite}

.ofr-divider{height:1px;background:var(--line);border:0;margin:0}
.ofr-divider--v{width:1px;height:16px;display:inline-block;vertical-align:middle}

.ofr-crumbs{display:flex;align-items:center;gap:8px;font:400 12px/16px var(--font-mono);text-transform:uppercase;letter-spacing:.04em;color:var(--text-quiet);flex-wrap:wrap}
.ofr-crumbs a{color:var(--text-quiet)}
.ofr-crumbs a:hover{color:var(--ink)}
.ofr-crumbs [aria-current]{color:var(--ink);font-weight:500}

.ofr-fold__btn{display:flex;align-items:center;gap:6px;padding:0;border:0;background:none;color:var(--ink-2);font:500 13px/18px var(--font-sans);cursor:pointer}
.ofr-fold__btn:hover{color:var(--ink)}
.ofr-fold__btn svg{transition:transform var(--dur-small) var(--ease)}
.ofr-fold.is-open>.ofr-fold__btn svg{transform:rotate(90deg)}
.ofr-fold__body{padding-top:10px;font-size:13px;line-height:19px;color:var(--ink-2)}
.ofr-fold--card{border-top:1px solid var(--line);padding:14px var(--card-pad)}

/* ROWS */
.ofr-list{display:flex;flex-direction:column}
.ofr-list>*+*{border-top:1px solid var(--line)}
.ofr-row{display:flex;align-items:center;gap:16px;padding:var(--row-pad-y) var(--row-pad-x);min-width:0;transition:background var(--dur-small) var(--ease)}
.ofr-row--hover{cursor:pointer}
.ofr-row--hover:hover{background:var(--bg-sunk)}
.ofr-row.is-move{background:var(--move-soft)}
.ofr-row__main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ofr-row__title{font:500 14px/20px var(--font-sans);color:var(--ink);overflow-wrap:anywhere;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.ofr-row__sub{font-size:13px;line-height:18px;color:var(--text-quiet);overflow-wrap:anywhere;text-wrap:pretty}
.ofr-row__meta{font:400 12px/16px var(--font-mono);color:var(--text-quiet);white-space:nowrap}
.ofr-row__actions{display:flex;align-items:center;gap:4px;flex-shrink:0}
.ofr-row__report{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;margin-top:10px;border-radius:var(--radius-control);background:var(--bg-surface);box-shadow:inset 0 0 0 1px var(--line);font-size:13px;line-height:18px;color:var(--ink-2);white-space:normal}

.ofr-record{display:flex;flex-direction:column}
.ofr-record__head{display:flex;align-items:center;gap:12px;padding:var(--row-pad-y) var(--row-pad-x);cursor:pointer;background:none;border:0;width:100%;text-align:left;color:inherit;font:inherit}
.ofr-record__head:hover{background:var(--bg-sunk)}
.ofr-record.is-open .ofr-record__head{background:transparent}
.ofr-record.is-pending{background:var(--bg-sunk)}
.ofr-record.is-pending .ofr-row__title{color:var(--text-quiet);text-decoration:line-through}
.ofr-editor{padding:4px var(--row-pad-x) var(--card-pad) 52px}
.ofr-editor__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px}
.ofr-editor__src{font-size:11px;color:var(--text-faint)}

.ofr-detail{display:grid;grid-template-columns:180px minmax(0,1fr);gap:16px;align-items:start;padding:12px 0}
.ofr-detail .ofr-box,.ofr-detail input{min-width:0}
.ofr-detail input{width:100%}
.ofr-detail__label{padding-top:10px;font:500 13px/18px var(--font-sans);color:var(--ink-2)}
.ofr-detail__note{display:flex;gap:6px;align-items:center;margin-top:6px;font-size:12px;line-height:16px}

.ofr-finding{border:1px solid var(--line);border-radius:var(--radius-card);overflow:hidden;background:var(--bg-surface)}
.ofr-finding__grid{display:grid;grid-template-columns:110px minmax(0,1fr);font-size:13px;line-height:19px}
.ofr-finding__grid>dt{padding:10px 16px;color:var(--text-quiet);font:500 11px/19px var(--font-mono);letter-spacing:.04em;text-transform:uppercase;border-top:1px solid var(--line)}
.ofr-finding__grid>dd{margin:0;padding:10px 16px;border-top:1px solid var(--line);color:var(--ink)}
.ofr-finding__change{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ofr-finding__change s{color:var(--text-quiet);text-decoration-color:var(--text-faint)}
.ofr-finding__grid>*:nth-child(-n+2){border-top:0}
.ofr-finding__foot{display:flex;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--line);background:var(--bg-sunk)}

.ofr-answer{padding:var(--row-pad-y) var(--row-pad-x);display:flex;flex-direction:column;gap:6px}
.ofr-answer__q{display:flex;justify-content:space-between;gap:12px;font:500 14px/20px var(--font-sans)}
.ofr-answer__date{font:400 11px/20px var(--font-mono);color:var(--text-faint);white-space:nowrap}
.ofr-answer__a{font-size:14px;line-height:21px;color:var(--ink-2);white-space:pre-wrap}
.ofr-answer__a.is-folded{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ofr-answer__foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap}

.ofr-review{display:flex;flex-direction:column;gap:12px;padding:20px;border-radius:var(--radius-card);background:var(--bg-surface);box-shadow:inset 0 0 0 1px var(--line)}
.ofr-review__step{font:500 11px/14px var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--text-quiet)}
.ofr-review__img{height:90px;border-radius:8px;background:repeating-linear-gradient(135deg,var(--bg-sunk-2) 0 8px,var(--bg-surface) 8px 16px);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font:500 12px var(--font-mono);color:var(--text-quiet)}

.ofr-resume{display:flex;flex-direction:column;gap:16px;padding:var(--card-pad)}
.ofr-resume__top{display:flex;align-items:center;gap:14px}

.ofr-tick-tile{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:inset 0 0 0 1px var(--line-strong);color:var(--done)}

.ofr-helpgroup h3{margin:0 0 10px;font:500 var(--text-label-size)/var(--text-label-line) var(--font-mono);letter-spacing:var(--text-label-track);text-transform:uppercase;color:var(--text-quiet)}
.ofr-helpgroup ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ofr-helpgroup li a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 0;border-top:1px solid var(--line);font-size:14px;color:var(--ink-2)}
.ofr-helpgroup li a:hover{color:var(--accent-ink);text-decoration:none}

.ofr-step{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:21px;color:var(--ink-2)}
.ofr-step__n{width:24px;height:24px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px var(--line-strong);color:var(--ink-2);font:500 11px/1 var(--font-mono);margin-top:-1px}

.ofr-plan{display:flex;flex-direction:column;gap:18px;padding:var(--card-pad);border-radius:var(--radius-card);border:1px solid var(--line);background:var(--bg-surface);position:relative}
.ofr-plan{transition:transform var(--dur-card) var(--ease),box-shadow var(--dur-card) var(--ease)}
.ofr-plan:not(.is-current):hover{transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(0,0,0,.18)}
.ofr-plan.is-current{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.ofr-plan__price{font:400 40px/44px var(--font-sans);letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.ofr-plan__price small{font-size:14px;font-weight:400;letter-spacing:0;color:var(--text-quiet)}
.ofr-plan__facts{display:flex;flex-direction:column;gap:8px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;color:var(--text-quiet)}
.ofr-plan__facts b{font:500 12px/18px var(--font-mono);color:var(--ink)}
.ofr-plan__facts div{display:flex;justify-content:space-between;gap:8px}

/* FEEDBACK */
.ofr-notice{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:var(--radius-card);font-size:13px;line-height:19px}
.ofr-notice[class*="ofr-tone-"]{background:var(--bg-surface);color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line)}
.ofr-notice__icon{padding-top:1px;flex-shrink:0;color:var(--tone)}
.ofr-notice__title{color:var(--ink)}
.ofr-notice__body{flex:1;min-width:0}
.ofr-notice__title{font-weight:600}
.ofr-notice.ofr-tone-neutral{background:var(--bg-sunk)}

.ofr-result{display:inline-flex;align-items:center;gap:6px;font-size:13px;line-height:18px;animation:ofr-fade var(--dur-small) var(--ease)}
.ofr-result.is-success{color:var(--done-ink)}
.ofr-result.is-error{color:var(--wrong-ink)}

.ofr-toasts{position:fixed;right:24px;bottom:24px;z-index:900;display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.ofr-toast{display:flex;align-items:flex-start;gap:12px;width:360px;max-width:calc(100vw - 32px);padding:14px 12px 14px 16px;border-radius:var(--radius-card);background:var(--bg-surface);box-shadow:var(--elev-popup);color:var(--ink);animation:ofr-rise var(--dur-card) var(--ease)}
.ofr-toast__title{font:500 14px/20px var(--font-sans)}
.ofr-toast__desc{font-size:13px;line-height:18px;color:var(--text-quiet);margin-top:1px}

.ofr-savebar{position:sticky;bottom:16px;z-index:50;display:flex;flex-direction:column;background:var(--ink);color:var(--bg-surface);border-radius:var(--radius-card);box-shadow:var(--elev-popup);overflow:hidden;animation:ofr-rise var(--dur-card) var(--ease)}
.ofr-savebar__main{display:flex;align-items:center;gap:12px;padding:10px 10px 10px 18px}
.ofr-savebar__count{flex:1;font:500 14px/20px var(--font-sans);display:flex;align-items:center;gap:8px;background:none;border:0;color:inherit;padding:0;cursor:pointer;text-align:left}
.ofr-savebar__list{margin:0;padding:4px 18px 12px 36px;font-size:13px;line-height:20px;color:color-mix(in srgb,var(--bg-surface) 72%,transparent)}
.ofr-savebar .ofr-btn--quiet{color:var(--bg-surface)}
.ofr-savebar .ofr-btn--quiet:hover:not(:disabled){background:color-mix(in srgb,var(--bg-surface) 12%,transparent);color:var(--bg-surface)}

.ofr-bell{width:360px;max-width:calc(100vw - 32px);padding:0!important}
.ofr-bell__head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);font:500 var(--text-label-size)/20px var(--font-mono);letter-spacing:var(--text-label-track);text-transform:uppercase;color:var(--text-quiet)}
.ofr-bell__item{display:flex;gap:12px;padding:14px 18px;align-items:flex-start}
.ofr-bell__dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;margin-top:7px}
.ofr-bell__item+.ofr-bell__item{border-top:1px solid var(--line)}
.ofr-bell__icon{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ofr-bell__empty{padding:28px 16px;text-align:center;font-size:13px;color:var(--text-quiet)}

.ofr-scrim{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--scrim);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:ofr-fade var(--dur-small) var(--ease)}
.ofr-dialog{position:relative;width:100%;max-height:100%;overflow:auto;background:var(--bg-surface);color:var(--ink);border-radius:var(--radius-dialog);box-shadow:var(--elev-dialog);animation:ofr-rise var(--dur-card) var(--ease);outline:0}
.ofr-dialog--sm{max-width:400px}
.ofr-dialog--md{max-width:520px}
.ofr-dialog--lg{max-width:760px}
.ofr-dialog--welcome{max-width:520px}
.ofr-dialog__banner{position:relative;overflow:hidden;height:136px;background:var(--panel-ink);display:flex;align-items:flex-end;padding:20px 24px;color:var(--on-panel)}
.ofr-dialog__banner::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--grad)}
.ofr-dialog__head{display:flex;align-items:flex-start;gap:12px;padding:22px 20px 0 24px}
.ofr-dialog__title{margin:0;font:500 18px/24px var(--font-sans);letter-spacing:-.015em}
.ofr-dialog__desc{margin:6px 0 0;font-size:14px;line-height:21px;color:var(--text-quiet)}
.ofr-dialog__body{padding:18px 24px 0}
.ofr-dialog__foot{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:22px 24px 22px}
.ofr-paper-preview{aspect-ratio:8.5/11;max-height:56vh;max-width:100%;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:4px;box-shadow:var(--elev-popover);padding:28px 30px;display:flex;flex-direction:column;gap:7px;color:#15141B}
.ofr-paper-preview i{display:block;height:5px;border-radius:2px;background:#E6E6EC}

.ofr-sheet-scrim{position:fixed;inset:0;z-index:1000;background:var(--scrim);animation:ofr-fade var(--dur-small) var(--ease)}
.ofr-sheet{position:fixed;left:0;right:0;bottom:0;z-index:1001;background:var(--bg-surface);border-radius:20px 20px 0 0;box-shadow:var(--elev-dialog);padding:8px 12px calc(16px + env(safe-area-inset-bottom));animation:ofr-sheet var(--dur-card) var(--ease)}
.ofr-sheet__grip{width:36px;height:4px;border-radius:2px;background:var(--line-strong);margin:4px auto 10px}
.ofr-sheet .ofr-menu__item{min-height:var(--touch-min);font-size:15px}

.ofr-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px 20px;text-align:center;font-size:14px;line-height:21px;color:var(--text-quiet)}
.ofr-state--inline{flex-direction:row;justify-content:flex-start;padding:20px;text-align:left}
.ofr-pagestate{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;text-align:center;background:var(--bg-page)}
.ofr-pagestate h1{margin:4px 0 0;font:var(--weight-heading) 22px/28px var(--font-sans);letter-spacing:-.02em;color:var(--ink)}
.ofr-pagestate p{margin:0;max-width:380px;font-size:14px;line-height:21px;color:var(--text-quiet)}

/* NAV & FRAME */
.ofr-topbar{position:sticky;top:0;z-index:40;height:var(--topbar-h);display:flex;align-items:center;gap:20px;border-bottom:1px solid var(--line);padding:0 var(--page-pad-desktop);background:color-mix(in srgb,var(--bg-page) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.ofr-topbar__nav{display:flex;align-items:center;gap:4px;flex:1;align-self:stretch}
.ofr-topbar__right{display:flex;align-items:center;gap:6px}
.ofr-navlink{display:inline-flex;align-items:center;height:var(--topbar-h);padding:0 12px;border-radius:0;border:0;background:transparent;color:var(--ink-2);font:500 14px/1 var(--font-sans);cursor:pointer;text-decoration:none!important;transition:background var(--dur-small) var(--ease),color var(--dur-small) var(--ease)}
.ofr-navlink:hover{background:transparent;color:var(--ink)}
.ofr-navlink{position:relative}
.ofr-navlink::after,.ofr-topbar .ofr-menubtn::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;border-radius:2px;background:var(--accent);transform:scaleX(0);transition:transform var(--dur-card) var(--ease-spring)}
.ofr-navlink:hover::after{transform:scaleX(.35)}
.ofr-navlink.is-current{background:transparent;color:var(--ink)}
.ofr-navlink.is-current::after,.ofr-topbar .ofr-menubtn.is-current::after{transform:scaleX(1)}
.ofr-topbar .ofr-menubtn{height:var(--topbar-h);border-radius:0;padding:0 10px 0 12px;background:transparent}
.ofr-topbar .ofr-menubtn:hover,.ofr-topbar .ofr-menubtn.is-open{background:transparent;color:var(--ink)}
.ofr-topbar .ofr-menubtn{position:relative}
.ofr-logo-text{font:700 22px/1 var(--font-sans);letter-spacing:-.04em;color:var(--ink)}
.ofr-bellbtn{position:relative}
.ofr-bellbtn .ofr-count--alert{position:absolute;top:3px;right:3px}


.ofr-phonebar{position:sticky;top:0;z-index:40;height:56px;display:flex;align-items:center;gap:8px;padding:0 var(--page-pad-phone);background:color-mix(in srgb,var(--bg-page) 86%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.ofr-bottombar{position:sticky;bottom:0;z-index:40;height:var(--bottombar-h);display:grid;grid-template-columns:repeat(3,1fr);background:color-mix(in srgb,var(--bg-surface) 92%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.ofr-bottombar__item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:var(--touch-min);border:0;background:none;color:var(--text-quiet);font:500 11px/1 var(--font-sans);cursor:pointer}
.ofr-bottombar__item.is-current{color:var(--ink)}
.ofr-bottombar__item.is-current svg{color:var(--accent)}

.ofr-pagehead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.ofr-pagehead>:first-child{flex:1 1 320px;min-width:0}
.ofr-pagehead__eyebrow{font:500 var(--text-eyebrow-size)/var(--text-eyebrow-line) var(--font-mono);letter-spacing:var(--text-label-track);text-transform:uppercase;color:var(--text-quiet);margin-bottom:12px}
.ofr-pagehead__title{overflow-wrap:anywhere;margin:0;font:var(--weight-heading) var(--text-page-title-size)/var(--text-page-title-line) var(--font-sans);letter-spacing:var(--text-page-title-track);color:var(--ink)}
.ofr-pagehead__desc{margin:8px 0 0;font-size:15px;line-height:22px;color:var(--text-quiet);max-width:560px}

.ofr-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ofr-tools__spacer{flex:1}

.ofr-bg{min-height:100%;background:var(--bg-page)}
.ofr-bg__grid{position:sticky;top:0;height:640px;margin-bottom:-640px;pointer-events:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:32px 32px;background-position:center -1px;opacity:.7;-webkit-mask-image:radial-gradient(ellipse 80% 75% at 50% 0%,#000 30%,transparent 100%);mask-image:radial-gradient(ellipse 80% 75% at 50% 0%,#000 30%,transparent 100%)}
.ofr-bg__content{position:relative}
.ofr-fade{position:sticky;left:0;right:0;height:24px;pointer-events:none;z-index:39}
.ofr-fade--top{top:var(--topbar-h);margin-bottom:-24px;background:linear-gradient(var(--bg-page),transparent)}
.ofr-fade--bottom{bottom:var(--bottombar-h);margin-top:-24px;background:linear-gradient(transparent,var(--bg-page))}

.ofr-page{margin:0 auto;padding:24px var(--page-pad-desktop) 80px;display:flex;flex-direction:column;gap:28px}
.ofr-page--centred{max-width:calc(var(--col-centred) + var(--page-pad-desktop) * 2)}
.ofr-page--wide{max-width:calc(var(--col-wide) + var(--page-pad-desktop) * 2)}
.ofr-auth{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--bg-page)}
.ofr-auth__card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%;max-width:1040px;min-height:600px;padding:8px;background:var(--bg-surface);border-radius:var(--radius-dialog);box-shadow:0 0 0 1px var(--line)}
.ofr-auth__pic{position:relative;border-radius:calc(var(--radius-dialog) - 4px);background:var(--panel-ink);color:var(--on-panel);padding:36px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.ofr-auth__form{display:flex;flex-direction:column;justify-content:center;padding:40px 56px;max-width:440px;width:100%;margin:0 auto;gap:20px}



.ofr-label-mono{font:500 var(--text-label-size)/var(--text-label-line) var(--font-mono);letter-spacing:var(--text-label-track);text-transform:uppercase;color:var(--text-quiet)}
.ofr-auth__pic::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--grad)}
.ofr-runlog{display:flex;flex-direction:column;gap:9px;font:400 12.5px/18px var(--font-mono);color:var(--on-panel-quiet)}
.ofr-runlog b{font-weight:400;color:var(--on-panel)}
.ofr-runlog .ok{color:#7AD6A8}
.ofr-section{display:grid;grid-template-columns:200px minmax(0,1fr);gap:32px;padding-top:24px;border-top:1px solid var(--line)}
.ofr-section__label{display:flex;flex-direction:column;gap:6px}
.ofr-section__label p{margin:0;font-size:13px;line-height:19px;color:var(--text-quiet)}
.ofr-statrow--ruled{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ofr-statrow--ruled>*{padding-left:0}
.ofr-statrow--ruled>*+*{padding-left:var(--card-pad)}

/* Links: animated underline */
.ofr-link--standalone,.ofr-link--inline{text-decoration:none!important;background-image:linear-gradient(currentColor,currentColor);background-size:0% 1px;background-position:0 100%;background-repeat:no-repeat;transition:background-size var(--dur-card) var(--ease),color var(--dur-small) var(--ease)}
.ofr-link--inline{background-size:100% 1px;background-image:linear-gradient(color-mix(in srgb,currentColor 35%,transparent),color-mix(in srgb,currentColor 35%,transparent))}
.ofr-link--standalone:hover{background-size:100% 1px}
.ofr-link--chip{transition:background var(--dur-small) var(--ease),transform var(--dur-small) var(--ease-spring)}
.ofr-link--chip:active{transform:scale(.95)}
.ofr-link--chip svg{transition:transform var(--dur-small) var(--ease-spring)}
.ofr-link--chip:hover svg{transform:translateX(2px)}
/* Secondary + quiet buttons */
.ofr-btn--secondary:hover:not(:disabled){border-color:var(--text-faint);box-shadow:0 4px 12px -6px rgba(0,0,0,.14)}
/* Rows */
.ofr-row--hover{transition:background var(--dur-small) var(--ease)}
.ofr-row--hover:active{background:var(--bg-sunk-2)}
/* Chips, pills, menus */
.ofr-chip{transition:transform var(--dur-small) var(--ease-spring),background var(--dur-small) var(--ease)}
.ofr-chip:hover{transform:translateY(-1px)}
.ofr-chip-add:active,.ofr-menubtn:active{transform:scale(.96)}
.ofr-menubtn,.ofr-chip-add{transition:background var(--dur-small) var(--ease),color var(--dur-small) var(--ease),transform var(--dur-small) var(--ease-spring)}
.ofr-menu__item{transition:background var(--dur-press) var(--ease),padding var(--dur-small) var(--ease)}
.ofr-menu__item:hover{padding-left:13px}
.ofr-seg__opt:active:not(:disabled){transform:scale(.96)}
.ofr-seg__opt{transition:background var(--dur-small) var(--ease),color var(--dur-small) var(--ease),box-shadow var(--dur-small) var(--ease),transform var(--dur-small) var(--ease-spring)}
.ofr-avatar{transition:box-shadow var(--dur-small) var(--ease),transform var(--dur-small) var(--ease-spring)}
button.ofr-avatar:hover{transform:scale(1.06)}
button.ofr-avatar:active{transform:scale(.94)}

/* EXTENSION STATUS + APPLICATIONS-LEFT CHIP */
.ofr-statusslot{position:relative;flex:none;height:32px}
.ofr-statusslot__ghost{display:flex;align-items:center;gap:8px;visibility:hidden}
.ofr-statusslot__ghost>i{width:56px;height:32px;flex:none}
.ofr-statusslot__live{position:absolute;right:0;top:0;z-index:5;display:flex;align-items:center;gap:8px}
.ofr-extstatus{height:32px;max-width:56px;display:flex;align-items:center;gap:8px;padding:0 4px 0 0;border-radius:var(--radius-pill);border:1px solid var(--line-strong);background:var(--bg-surface);overflow:hidden;white-space:nowrap;transition:max-width 360ms var(--ease-spring),box-shadow var(--dur-small) var(--ease)}
.ofr-extstatus.is-open{max-width:680px;box-shadow:0 8px 24px -12px rgba(0,0,0,.25)}
.ofr-extstatus--compact.is-open{max-width:250px}
.ofr-extstatus__btn{flex:none;display:flex;align-items:center;gap:8px;height:30px;padding:0 7px 0 11px;border:0;border-radius:var(--radius-pill);background:transparent;color:var(--ink-2);cursor:pointer;transition:color var(--dur-small) var(--ease)}
.ofr-extstatus__btn:hover{color:var(--ink)}
.ofr-extstatus__dot{width:7px;height:7px;border-radius:50%;flex:none;animation:ofr-breathe 2.4s ease-in-out infinite}
.ofr-extstatus__body{display:flex;align-items:center;gap:8px;min-width:0;opacity:0;transition:opacity 220ms var(--ease)}
.ofr-extstatus.is-open .ofr-extstatus__body{opacity:1;transition-delay:120ms}
.ofr-extstatus__title{flex:none;font:500 13px/18px var(--font-sans);color:var(--ink)}
.ofr-extstatus__text{flex:none;font-size:13px;line-height:18px;color:var(--text-quiet)}
.ofr-extstatus--compact .ofr-extstatus__text{display:none}
.ofr-extstatus__end{width:6px;flex:none}
.ofr-usagechip{flex:none;display:flex;align-items:center;gap:6px;height:32px;padding:0 12px 0 10px;border-radius:var(--radius-pill);border:1px solid var(--line-strong);background:var(--bg-surface);color:var(--ink);cursor:pointer;transition:background var(--dur-small) var(--ease),transform var(--dur-small) var(--ease-spring)}
.ofr-usagechip:hover{background:var(--bg-sunk)}
.ofr-usagechip:active{transform:scale(.96)}
.ofr-usagechip__n{font:500 13px/1 var(--font-mono);font-variant-numeric:tabular-nums}
.ofr-usagechip.is-empty .ofr-usagechip__n{color:var(--wrong-ink)}

/* STACKED SECTION */
.ofr-stack{display:flex;flex-direction:column;gap:12px;padding-top:24px;border-top:1px solid var(--line);min-width:0}
.ofr-stack__head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:28px}
.ofr-stack__desc{margin:-6px 0 0;font-size:13px;line-height:19px;color:var(--text-quiet)}

/* OVERVIEW */
.ofr-ov{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:20px;align-items:start}
.ofr-ov__col{display:flex;flex-direction:column;gap:20px;min-width:0}
.ofr-ov__item{min-width:0}
.ofr-ov--single{grid-template-columns:minmax(0,1fr)}
.ofr-gs__mark{width:28px;height:28px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px var(--line-strong);color:var(--ink-2);font:500 12px/1 var(--font-mono);transition:background var(--dur-small) var(--ease),color var(--dur-small) var(--ease)}
.ofr-gs__mark.is-done{background:var(--done-soft);color:var(--done-ink);box-shadow:none}
.ofr-gs__mark.is-done svg{animation:ofr-pop var(--dur-card) var(--ease-spring)}
.ofr-list>.ofr-row.ofr-gs__row{flex-wrap:nowrap}
.ofr-gs__text{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.ofr-gs__text>b{font:500 14px/20px var(--font-sans)}
.ofr-gs__text>b.is-done{color:var(--text-quiet)}
.ofr-goal__num{display:flex;align-items:baseline;gap:8px}
.ofr-goal__num>b{font:400 36px/40px var(--font-sans);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.ofr-goal__num>span{color:var(--text-quiet);white-space:nowrap}
.ofr-ans{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;padding:14px var(--row-pad-x)}
.ofr-ans__main{flex:1 1 260px;min-width:0;display:flex;flex-direction:column;gap:2px}
.ofr-ans__q{font-weight:500;text-wrap:pretty}
.ofr-ans__a{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ofr-tipcard__p{margin:0;font-size:15px;line-height:22px;text-wrap:pretty}
.ofr-quick{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;padding-top:20px;border-top:1px solid var(--line)}
.ofr-quick>.ofr-label-mono{flex:1 1 auto}
.ofr-quick__btns{display:flex;flex-wrap:wrap;gap:8px}

/* OVERVIEW v2 */
.ofr-needs__row{display:flex;align-items:center;gap:14px;padding:14px var(--row-pad-x)}
.ofr-needs__dot{width:7px;height:7px;border-radius:50%;flex:none;align-self:flex-start;margin-top:7px}
.ofr-needs__text{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.ofr-needs__title{font:500 14px/20px var(--font-sans);color:var(--ink);text-wrap:pretty}
.ofr-needs__sub{font-size:13px;line-height:18px;color:var(--text-quiet);text-wrap:pretty}
.ofr-needs__empty{display:flex;align-items:center;gap:10px;padding:8px var(--row-pad-x) 20px;color:var(--text-quiet)}
.ofr-act__figs{display:flex;flex-wrap:wrap;gap:16px 44px;padding:12px var(--card-pad) 20px}
.ofr-act__fig{display:flex;flex-direction:column;gap:4px;min-width:0}
.ofr-act__num{font:400 32px/36px var(--font-sans);letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:var(--ink)}
.ofr-act__label{font-size:13px;line-height:18px;color:var(--ink-2)}
.ofr-act__chart{padding:20px var(--card-pad) 12px;border-top:1px solid var(--line)}
.ofr-setup{container-type:inline-size}
.ofr-setup__row{display:grid;grid-template-columns:96px minmax(0,1fr) auto;column-gap:16px;align-items:start;padding:14px var(--row-pad-x)}
.ofr-setup__label{font-size:13px;line-height:20px;color:var(--text-quiet)}
.ofr-setup__val{display:flex;flex-direction:column;gap:6px;min-width:0}
.ofr-setup__main{display:flex;align-items:center;gap:8px;font:500 14px/20px var(--font-sans);color:var(--ink);overflow-wrap:anywhere}
.ofr-setup__dot{width:7px;height:7px;border-radius:50%;flex:none}
.ofr-setup__meta{font-size:12.5px;line-height:17px;color:var(--text-quiet);text-wrap:pretty}
.ofr-setup__act{font-size:13px;line-height:20px}
.ofr-setup__more{grid-column:1 / -1;padding-top:12px}
@container (max-width:400px){.ofr-setup__row{grid-template-columns:minmax(0,1fr) auto;row-gap:2px}.ofr-setup__label{grid-column:1 / -1}}
.ofr-tipline{display:flex;align-items:flex-start;gap:10px;padding:2px 4px 0 6px;font-size:13px;line-height:20px;color:var(--ink-2)}

/* PHONE — the same rules three ways: narrow window, narrow .ofr-app container (side panel, phone frame), or a data-dev="phone" switch on any ancestor. */
@media (max-width:720px){
.ofr-topbar{padding:0 var(--page-pad-phone)}
.ofr-page{padding:8px var(--page-pad-phone) 40px}
.ofr-field--beside,.ofr-detail{grid-template-columns:1fr;gap:6px}
.ofr-field--beside .ofr-field__label,.ofr-detail__label{padding-top:0}
.ofr-statrow{grid-auto-flow:row}
.ofr-statrow>*{border-left:0;border-top:1px solid var(--line)}
.ofr-statrow>*:first-child{border-top:0}
.ofr-statrow--ruled>*+*{padding-left:0}
.ofr-editor{padding-left:20px}
.ofr-editor__grid{grid-template-columns:1fr}
.ofr-auth{padding:12px}
.ofr-auth__card{grid-template-columns:1fr;min-height:0}
.ofr-auth__pic{min-height:180px;padding:24px}
.ofr-auth__form{padding:28px 16px}
.ofr-btn,.ofr-ib{min-height:var(--touch-min)}
.ofr-ib{min-width:var(--touch-min)}
.ofr-toasts{left:16px;right:16px;bottom:calc(var(--bottombar-h) + 12px);align-items:stretch}
.ofr-toast{width:auto}
.ofr-section{grid-template-columns:1fr;gap:12px}
.ofr-seg{max-width:100%;overflow-x:auto}
.ofr-finding__change{flex-direction:column;align-items:flex-start;gap:2px}
.ofr-finding__change>span:first-of-type{transform:rotate(90deg)}
.ofr-row{flex-wrap:wrap;row-gap:10px;column-gap:12px}
.ofr-row__main{flex:1 1 200px}
.ofr-record__head .ofr-row__main{flex:1 1 auto}
.ofr-row__actions{margin-left:auto}
.ofr-row:has(>.ofr-cmark)>.ofr-row__main~*:nth-child(3){margin-left:48px}
.ofr-row:has(>svg:first-child)>.ofr-row__main~*:nth-child(3){margin-left:28px}
.ofr-dialog__body{padding:16px 16px 0}
.ofr-dialog__foot{padding:18px 16px;flex-wrap:wrap}
.ofr-prog__pair{grid-template-columns:minmax(0,1fr) 32px;row-gap:6px}
.ofr-prog__pair>:first-child{grid-column:1 / -1}
.ofr-chart__long{display:none}
.ofr-chart__short{display:inline}
.ofr-card--cells{grid-template-columns:repeat(var(--cols-phone,var(--cols,2)),minmax(0,1fr))}
.ofr-extstatus.is-open{max-width:250px}
.ofr-extstatus__text{display:none}
.ofr-ov{display:flex;flex-direction:column;align-items:stretch;gap:16px}
.ofr-ov__col{display:contents}
.ofr-ov__item{order:var(--po,0)}
.ofr-setup__row{grid-template-columns:minmax(0,1fr) auto;row-gap:2px}
.ofr-setup__label{grid-column:1 / -1}
.ofr-needs__row{flex-wrap:wrap;row-gap:10px}
.ofr-needs__row>.ofr-btn{margin-left:21px}
.ofr-act__figs{gap:16px 28px}
}
@container (max-width:720px){
.ofr-topbar{padding:0 var(--page-pad-phone)}
.ofr-page{padding:8px var(--page-pad-phone) 40px}
.ofr-field--beside,.ofr-detail{grid-template-columns:1fr;gap:6px}
.ofr-field--beside .ofr-field__label,.ofr-detail__label{padding-top:0}
.ofr-statrow{grid-auto-flow:row}
.ofr-statrow>*{border-left:0;border-top:1px solid var(--line)}
.ofr-statrow>*:first-child{border-top:0}
.ofr-statrow--ruled>*+*{padding-left:0}
.ofr-editor{padding-left:20px}
.ofr-editor__grid{grid-template-columns:1fr}
.ofr-auth{padding:12px}
.ofr-auth__card{grid-template-columns:1fr;min-height:0}
.ofr-auth__pic{min-height:180px;padding:24px}
.ofr-auth__form{padding:28px 16px}
.ofr-btn,.ofr-ib{min-height:var(--touch-min)}
.ofr-ib{min-width:var(--touch-min)}
.ofr-toasts{left:16px;right:16px;bottom:calc(var(--bottombar-h) + 12px);align-items:stretch}
.ofr-toast{width:auto}
.ofr-section{grid-template-columns:1fr;gap:12px}
.ofr-seg{max-width:100%;overflow-x:auto}
.ofr-finding__change{flex-direction:column;align-items:flex-start;gap:2px}
.ofr-finding__change>span:first-of-type{transform:rotate(90deg)}
.ofr-row{flex-wrap:wrap;row-gap:10px;column-gap:12px}
.ofr-row__main{flex:1 1 200px}
.ofr-record__head .ofr-row__main{flex:1 1 auto}
.ofr-row__actions{margin-left:auto}
.ofr-row:has(>.ofr-cmark)>.ofr-row__main~*:nth-child(3){margin-left:48px}
.ofr-row:has(>svg:first-child)>.ofr-row__main~*:nth-child(3){margin-left:28px}
.ofr-dialog__body{padding:16px 16px 0}
.ofr-dialog__foot{padding:18px 16px;flex-wrap:wrap}
.ofr-prog__pair{grid-template-columns:minmax(0,1fr) 32px;row-gap:6px}
.ofr-prog__pair>:first-child{grid-column:1 / -1}
.ofr-chart__long{display:none}
.ofr-chart__short{display:inline}
.ofr-card--cells{grid-template-columns:repeat(var(--cols-phone,var(--cols,2)),minmax(0,1fr))}
.ofr-extstatus.is-open{max-width:250px}
.ofr-extstatus__text{display:none}
.ofr-ov{display:flex;flex-direction:column;align-items:stretch;gap:16px}
.ofr-ov__col{display:contents}
.ofr-ov__item{order:var(--po,0)}
.ofr-setup__row{grid-template-columns:minmax(0,1fr) auto;row-gap:2px}
.ofr-setup__label{grid-column:1 / -1}
.ofr-needs__row{flex-wrap:wrap;row-gap:10px}
.ofr-needs__row>.ofr-btn{margin-left:21px}
.ofr-act__figs{gap:16px 28px}
}
[data-dev="phone"] .ofr-topbar{padding:0 var(--page-pad-phone)}
[data-dev="phone"] .ofr-page{padding:8px var(--page-pad-phone) 40px}
[data-dev="phone"] .ofr-field--beside,[data-dev="phone"] .ofr-detail{grid-template-columns:1fr;gap:6px}
[data-dev="phone"] .ofr-field--beside .ofr-field__label,[data-dev="phone"] .ofr-detail__label{padding-top:0}
[data-dev="phone"] .ofr-statrow{grid-auto-flow:row}
[data-dev="phone"] .ofr-statrow>*{border-left:0;border-top:1px solid var(--line)}
[data-dev="phone"] .ofr-statrow>*:first-child{border-top:0}
[data-dev="phone"] .ofr-statrow--ruled>*+*{padding-left:0}
[data-dev="phone"] .ofr-editor{padding-left:20px}
[data-dev="phone"] .ofr-editor__grid{grid-template-columns:1fr}
[data-dev="phone"] .ofr-auth{padding:12px}
[data-dev="phone"] .ofr-auth__card{grid-template-columns:1fr;min-height:0}
[data-dev="phone"] .ofr-auth__pic{min-height:180px;padding:24px}
[data-dev="phone"] .ofr-auth__form{padding:28px 16px}
[data-dev="phone"] .ofr-btn,[data-dev="phone"] .ofr-ib{min-height:var(--touch-min)}
[data-dev="phone"] .ofr-ib{min-width:var(--touch-min)}
[data-dev="phone"] .ofr-toasts{left:16px;right:16px;bottom:calc(var(--bottombar-h) + 12px);align-items:stretch}
[data-dev="phone"] .ofr-toast{width:auto}
[data-dev="phone"] .ofr-section{grid-template-columns:1fr;gap:12px}
[data-dev="phone"] .ofr-seg{max-width:100%;overflow-x:auto}
[data-dev="phone"] .ofr-finding__change{flex-direction:column;align-items:flex-start;gap:2px}
[data-dev="phone"] .ofr-finding__change>span:first-of-type{transform:rotate(90deg)}
[data-dev="phone"] .ofr-row{flex-wrap:wrap;row-gap:10px;column-gap:12px}
[data-dev="phone"] .ofr-row__main{flex:1 1 200px}
[data-dev="phone"] .ofr-record__head .ofr-row__main{flex:1 1 auto}
[data-dev="phone"] .ofr-row__actions{margin-left:auto}
[data-dev="phone"] .ofr-row:has(>.ofr-cmark)>.ofr-row__main~*:nth-child(3){margin-left:48px}
[data-dev="phone"] .ofr-row:has(>svg:first-child)>.ofr-row__main~*:nth-child(3){margin-left:28px}
[data-dev="phone"] .ofr-dialog__body{padding:16px 16px 0}
[data-dev="phone"] .ofr-dialog__foot{padding:18px 16px;flex-wrap:wrap}
[data-dev="phone"] .ofr-prog__pair{grid-template-columns:minmax(0,1fr) 32px;row-gap:6px}
[data-dev="phone"] .ofr-prog__pair>:first-child{grid-column:1 / -1}
[data-dev="phone"] .ofr-chart__long{display:none}
[data-dev="phone"] .ofr-chart__short{display:inline}
[data-dev="phone"] .ofr-card--cells{grid-template-columns:repeat(var(--cols-phone,var(--cols,2)),minmax(0,1fr))}
[data-dev="phone"] .ofr-extstatus.is-open{max-width:250px}
[data-dev="phone"] .ofr-extstatus__text{display:none}
[data-dev="phone"] .ofr-ov{display:flex;flex-direction:column;align-items:stretch;gap:16px}
[data-dev="phone"] .ofr-ov__col{display:contents}
[data-dev="phone"] .ofr-ov__item{order:var(--po,0)}
[data-dev="phone"] .ofr-setup__row{grid-template-columns:minmax(0,1fr) auto;row-gap:2px}
[data-dev="phone"] .ofr-setup__label{grid-column:1 / -1}
[data-dev="phone"] .ofr-needs__row{flex-wrap:wrap;row-gap:10px}
[data-dev="phone"] .ofr-needs__row>.ofr-btn{margin-left:21px}
[data-dev="phone"] .ofr-act__figs{gap:16px 28px}

