.canvas-site { --workspace-rail: 244px; --workspace-ink: #284640; --workspace-muted: #657b74; --workspace-accent: #087d77; --workspace-border: #d4e0dc; background-color: #eff4f2; background-image: radial-gradient(circle, #b9c9c2 0.8px, transparent 1px); background-size: 20px 20px; background-position: 10px 10px; background-attachment: fixed; border-top: 0; }

.canvas-site *, .canvas-site *::before, .canvas-site *::after { box-sizing: border-box; }

.workspace-sidebar [hidden], .workspace-scrim[hidden] { display: none !important; }

.canvas-site .workspace-main { margin-left: var(--workspace-rail); padding: 34px clamp(20px, 3.5vw, 64px) 64px; min-width: 0; }

.workspace-frame-label { max-width: 1020px; margin: 0 auto 10px; display: flex; justify-content: space-between; gap: 16px; align-items: center; font-size: 13px; color: #58776b; letter-spacing: .025em; }

.workspace-frame-mark { font-size: 18px; margin-right: 7px; vertical-align: middle; }

.workspace-frame-context { color: #5c7367; font-size: 12px; }

.workspace-body-label { margin-top: 36px; }

.canvas-site .paper-board { max-width: 1020px; margin: 0 auto; position: relative; background: #fff; border: 1px solid #ceded6; border-radius: 3px; box-shadow: 0 3px 8px #23463c05, 0 16px 40px #23463c04; }

.canvas-site .paper-hero::before, .canvas-site .paper-hero::after { content: ''; position: absolute; top: -4px; width: 7px; height: 7px; border: 1px solid #73aa98; background: #fff; pointer-events: none; }

.canvas-site .paper-hero::before { left: -4px; }

.canvas-site .paper-hero::after { right: -4px; }

.canvas-site .paper-hero { padding: 32px 24px 38px; }

.canvas-site .paper-hero .wrapper { max-width: 920px; padding: 0; }

.canvas-site .paper-hero h1 { font-size: clamp(30px, 3vw, 40px); line-height: 1.2; }

.canvas-site .paper-hero h4 { font-size: clamp(19px, 2vw, 23px); line-height: 1.5; margin: 20px auto 34px; max-width: 800px; }

.canvas-site .paper-hero .title-logo { width: 125px; }

.canvas-site .paper-hero .button-container { margin-top: 24px; }

.canvas-site .paper-hero .button { width: auto; min-width: 112px; }

.canvas-site .paper-body > .wrapper { max-width: 944px; padding: 32px; }

.canvas-site .paper-body .tldr-section { margin-top: 0; }

.canvas-site .wrapper { width: 100%; }

.canvas-site :where(h2[id], h3[id], .cleo-implication, .cleo-lab, .cleo-intro-demo, #overview) { scroll-margin-top: 32px; }

.workspace-ruler { position: fixed; top: 0; left: var(--workspace-rail); right: 0; height: 13px; border-bottom: 1px solid #d3dfd9; background-color: #edf3ef; background-image: repeating-linear-gradient(90deg, #acbfb4 0 1px, transparent 1px 20px); background-size: 100% 5px; background-repeat: no-repeat; background-position: bottom; z-index: 12; pointer-events: none; }

.workspace-sidebar { position: fixed; z-index: 25; top: 20px; bottom: 20px; left: 16px; width: 228px; display: flex; flex-direction: column; background: #ffffffed; border: 1px solid var(--workspace-border); border-radius: 13px; box-shadow: 0 4px 22px #29483b08; backdrop-filter: blur(12px); }

.workspace-sidebar-header { display: flex; align-items: center; gap: 6px; padding: 22px 15px 20px; }

.workspace-brand { display: flex; min-width: 0; gap: 10px; align-items: center; flex: 1; color: var(--workspace-ink) !important; text-decoration: none !important; }

.workspace-brand img { object-fit: contain; flex: 0 0 35px; }

.workspace-brand-copy { display: flex; flex-direction: column; gap: 2px; }

.workspace-brand strong { font: 600 22px 'Outfit', sans-serif; letter-spacing: .025em; }

.workspace-brand-copy > span { font-size: 12px; color: var(--workspace-muted); }

.workspace-icon-button { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; padding: 8px; min-width: 34px; min-height: 36px; border: 0; border-radius: 6px; background: transparent; color: #71877c; cursor: pointer; font: inherit; }

.workspace-icon-button:hover { background: #edf5f0; color: var(--workspace-accent); }

.workspace-icon-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

.workspace-nav-caption { padding: 0 18px 12px; font-size: 12px; letter-spacing: .1em; color: #657b74; }

.workspace-section-nav { overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #d0dfd5 transparent; flex: 1; min-height: 0; padding: 0 10px 12px; }

.workspace-nav-list, .workspace-subnav { list-style: none; padding: 0; margin: 0; }

.workspace-nav-list > li { margin: 3px 0; }

.workspace-nav-list a { display: flex; gap: 10px; align-items: center; color: #536b61; font-size: 15px; line-height: 1.35; text-decoration: none; border-radius: 6px; padding: 10px 9px; min-height: 42px; position: relative; transition: color .18s, background .18s; }

.workspace-nav-list a:hover { background: #f0f6f2; color: #244c3c; }

.workspace-nav-list a[aria-current="location"] { background: #e7f4ee; color: #07695f; font-weight: 600; }

.workspace-nav-list a[aria-current="location"]::before { content: ''; position: absolute; width: 3px; left: -3px; height: 18px; border-radius: 3px; background: #0b9d91; }

.workspace-nav-icon { flex: 0 0 24px; text-align: center; font: 400 12px 'Outfit', sans-serif; color: #80998b; }

[aria-current="location"] .workspace-nav-icon { color: #087d77; }

.workspace-family-heading { display: flex; align-items: center; }

.workspace-family-heading > a { flex: 1; min-width: 0; }

.workspace-group-toggle { border: 0; padding: 8px 4px; background: none; color: #728a7b; cursor: pointer; border-radius: 5px; flex: 0 0 25px; min-height: 36px; }

.workspace-group-toggle:hover { background: #edf5f0; }

.workspace-group-toggle svg { display: block; width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.6; transition: transform .2s; }

.workspace-group-toggle[aria-expanded="false"] svg { transform: rotate(-90deg); }

.workspace-subnav { margin: 4px 0 10px 21px; padding-left: 11px; border-left: 1px solid #deebe3; }

.workspace-subnav a { font-size: 14px; padding: 8px; gap: 9px; min-height: 35px; }

.workspace-subnav-number { font-size: 12px; color: #8a9f93; }

.workspace-nav-family.has-current > .workspace-family-heading > a { color: #087d77; }

.workspace-sidebar-footer { margin-top: auto; padding: 17px 18px 14px; border-top: 1px solid #e5eee8; }

.workspace-progress-heading { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; color: #5c7367; margin-bottom: 9px; }

[data-reading-percent] { font-variant-numeric: tabular-nums; }

.workspace-reading-progress { height: 3px; background: #e9f0eb; border-radius: 2px; overflow: hidden; }

.workspace-reading-progress > span { display: block; height: 100%; width: 0; background: #30a58c; transition: width .1s linear; }

.workspace-paper-link { display: flex; align-items: center; justify-content: space-between; margin-top: 17px; padding: 2px 0; color: #4d7662 !important; font-size: 14px; }

.workspace-paper-link > span:last-child { font-size: 19px; }

.workspace-sidebar :is(a,button):focus-visible, .workspace-mobile-bar :is(a,button):focus-visible { outline: 2px solid #287cbb; outline-offset: 2px; }

.workspace-mobile-bar, .workspace-scrim { display: none; }

.workspace-skip { position: fixed; z-index: 100; top: 8px; left: 16px; transform: translateY(-160%); background: #087d77; color: #fff !important; padding: 12px 18px; border-radius: 5px; }

.workspace-skip:focus { transform: none; }

/* Collapse to a compact rail without losing section access. */
.canvas-site.sidebar-is-collapsed { --workspace-rail: 90px; }

.sidebar-is-collapsed .workspace-sidebar { width: 74px; }

.sidebar-is-collapsed .workspace-sidebar-header { flex-direction: column; padding: 16px 8px 10px; }

.sidebar-is-collapsed .workspace-brand-copy, .sidebar-is-collapsed .workspace-nav-caption, .sidebar-is-collapsed .workspace-nav-label, .sidebar-is-collapsed .workspace-group-toggle, .sidebar-is-collapsed .workspace-subnav { display: none; }

.sidebar-is-collapsed .workspace-collapse svg { transform: rotate(180deg); }

.sidebar-is-collapsed .workspace-section-nav { padding: 0 9px 12px; }

.sidebar-is-collapsed .workspace-nav-list a { justify-content: center; padding: 12px 6px; min-height: 46px; }

.sidebar-is-collapsed .workspace-sidebar-footer { padding: 14px 12px; }

.sidebar-is-collapsed .workspace-progress-heading, .sidebar-is-collapsed .workspace-paper-link { justify-content: center; }

@media (max-width: 1100px) { .canvas-site { --workspace-rail: 0px; } .canvas-site .workspace-main { margin-left: 0; padding: 24px 22px 48px; } .workspace-ruler { display: none; } .workspace-sidebar { position: relative; top: auto; bottom: auto; left: auto; width: auto; margin: 18px 22px 0; max-height: none; } .workspace-section-nav { overflow: visible; } .canvas-site.has-workspace-nav .workspace-main { padding-top: 91px; } .has-workspace-nav .workspace-mobile-bar { display: flex; justify-content: space-between; align-items: center; position: fixed; top: 12px; left: 14px; right: 14px; z-index: 35; min-height: 54px; padding: 7px 12px 7px 16px; border: 1px solid #d3e2d9; border-radius: 10px; background: #ffffffed; box-shadow: 0 3px 15px #2b47350a; backdrop-filter: blur(14px); } .workspace-mobile-brand { color: #146b5d !important; text-decoration: none !important; font: 600 18px 'Outfit', sans-serif; } .workspace-mobile-brand span { margin-left: 9px; font: 400 12px 'Assistant', sans-serif; color: #5c7367; } .workspace-menu-toggle { gap: 7px; min-height: 40px; font-size: 14px; color: #48715c; } .has-workspace-nav .workspace-sidebar { position: fixed; top: 78px; bottom: 14px; left: 14px; width: 290px; max-width: calc(100vw - 28px); margin: 0; z-index: 45; transform: translateX(calc(-100% - 24px)); visibility: hidden; transition: transform .24s ease, visibility .24s; background: #fff; } .has-workspace-nav .workspace-section-nav { overflow-y: auto; } .has-workspace-nav .workspace-scrim { display: block; position: fixed; inset: 0; border: 0; padding: 0; z-index: 40; background: #173b3040; cursor: pointer; } .has-workspace-nav.sidebar-is-open { overflow: hidden; } .has-workspace-nav.sidebar-is-open .workspace-sidebar { transform: translateX(0); visibility: visible; } .canvas-site :where(h2[id], h3[id], .cleo-implication, .cleo-lab, .cleo-intro-demo, #overview) { scroll-margin-top: 88px; } .workspace-frame-context { display: none; } }

@media (max-width: 600px) { .canvas-site .workspace-main { padding: 22px 12px 36px; } .canvas-site .paper-hero { padding: 22px 16px 28px; } .canvas-site .paper-hero h1 { font-size: 30px; } .canvas-site .paper-hero h4 { font-size: 18px; margin-bottom: 28px; } .canvas-site .paper-hero .authors-wrapper { gap: 18px 12px; } .canvas-site .paper-hero .author-container { width: 78px; } .canvas-site .paper-body > .wrapper { padding: 20px 16px; } .canvas-site .paper-body .tldr-question { padding: 20px 16px; } .canvas-site .wrapper { max-width: 100%; } .workspace-body-label { margin-top: 24px; } .workspace-mobile-brand span { display: none; } .workspace-frame-label { padding-left: 3px; } .workspace-nav-list a { min-height: 44px; } .workspace-subnav a { min-height: 42px; } .workspace-group-toggle, .workspace-icon-button { min-width: 40px; min-height: 40px; } }

@media (prefers-reduced-motion: reduce) { .canvas-site { scroll-behavior: auto; } .workspace-sidebar, .workspace-reading-progress > span, .workspace-nav-list a, .workspace-group-toggle svg { transition: none !important; } }

/*# sourceMappingURL=workspace.css.map */