/*!
 * ============================================================================
 * DIALEDRIDE™ | DIALEDRIDE KINEMETRIC™
 * Biomechanical Telemetry & Trigonometric Coordinate Engine
 *
 * Copyright (c) 2025–2026 John Gould, trading as DialedRide. All rights reserved.
 * @license Proprietary
 *
 * PROPRIETARY AND CONFIDENTIAL.
 * This software, including its algorithms, analytical models, scoring methods,
 * thresholds and interface designs, is the intellectual property of John Gould
 * and contains confidential information and trade secrets.
 *
 * Use is licensed only under the DialedRide KineMetric Terms of Use or a separate
 * written licence. Copying, modifying, distributing, decompiling or reverse
 * engineering this software is not permitted, except where the law allows it.
 * ============================================================================
 */
 /**/ html.ops-ui, html.ops-ui.dark { color-scheme: light; --ui-ink: #18221c; /**/ --ui-muted: #59635d; --ui-subtle: #636e67; --ui-line: #dfe5e1; --ui-line-soft: #e9eeeb; --ui-paper: #f4f7f4; --ui-white: #ffffff; --ui-green: #173e2b; --ui-green-2: #245b41; --ui-green-soft: #eef5f0; --ui-lime: #c9f85d; --ui-violet: #6757d9; --ui-violet-soft: #eeebff; --ui-mint: #dff6e9; --ui-amber: #fff0cc; --ui-rose: #ffe5e8; --ui-danger: #a63843; --ui-success: #287952; --ui-warning: #8a5c06; --ui-shadow: 0 18px 55px rgba(31, 55, 41, 0.1); --ui-shadow-soft: 0 8px 28px rgba(31, 55, 41, 0.07); --ui-radius: 14px; --ui-radius-sm: 9px; /**/ --field-paper: var(--ui-paper); --field-paper-strong: var(--ui-white); --field-ink: var(--ui-ink); --field-ink-soft: #33443a; --field-muted: var(--ui-muted); --field-faint: #66736b; --field-line: var(--ui-line); --field-line-strong: #cbd5cf; --field-rust: var(--ui-green-2); --field-rust-dark: var(--ui-green); --field-teal: var(--ui-violet); --field-green: var(--ui-success); --field-yellow: var(--ui-warning); --field-red: var(--ui-danger); --field-shadow: var(--ui-shadow); --bg: var(--ui-paper); --surface: var(--ui-white); --surface-raised: var(--ui-white); --surface-soft: var(--ui-green-soft); --border: var(--ui-line); --border-strong: #cbd5cf; --gold: var(--ui-green-2); --accent: var(--ui-violet); --text: var(--ui-ink); --muted: var(--ui-muted); --muted-soft: var(--ui-subtle); --danger: var(--ui-danger); --warning: var(--ui-warning); --success: var(--ui-success); --info: var(--ui-violet); --color-primary: 23 62 43; --color-accent: 201 248 93; --dr-bg: var(--ui-paper); --dr-bg-grid: rgba(23, 62, 43, 0.025); --dr-surface: var(--ui-white); --dr-surface-strong: var(--ui-white); --dr-surface-soft: var(--ui-green-soft); --dr-surface-1: var(--ui-white); --dr-surface-2: var(--ui-white); --dr-surface-3: #e9f0eb; --dr-elevated: var(--ui-white); --dr-border: var(--ui-line); --dr-border-soft: var(--ui-line-soft); --dr-border-strong: #b8c8be; --dr-text: var(--ui-ink); --dr-text-primary: var(--ui-ink); --dr-text-secondary: var(--ui-muted); --dr-text-muted: var(--ui-subtle); --dr-muted: var(--ui-muted); --dr-subtle: var(--ui-subtle); --dr-input-bg: #f9fbf9; --dr-accent: var(--ui-green); --dr-accent-soft: rgba(36, 91, 65, 0.1); --dr-accent-border: rgba(36, 91, 65, 0.28); --dr-success: var(--ui-success); --dr-success-soft: var(--ui-mint); --dr-warning: var(--ui-warning); --dr-warning-soft: var(--ui-amber); --dr-danger: var(--ui-danger); --dr-danger-soft: var(--ui-rose); --dr-info: var(--ui-violet); --dr-info-soft: var(--ui-violet-soft); --dr-shadow: var(--ui-shadow-soft); --dr-radius-xl: 16px; --dr-radius-lg: 14px; --dr-radius-md: 10px; --dr-radius-sm: 8px; /**/ --dr-fs-label: 11px; /**/ --dr-fs-meta: 12px; /**/ --dr-fs-body: 13px; /**/ --dr-fs-metric: 13px; /**/ --dr-fs-card-title: 15px; /**/ --dr-lh-body: 1.55; --dr-lh-tight: 1.3; /**/ --dr-type-page: 700 clamp(24px, 3vw, 34px) / 1.08 "DM Sans", system-ui, sans-serif; --dr-type-section: 750 clamp(20px, 2.4vw, 26px) / 1.12 "DM Sans", system-ui, sans-serif; --dr-type-card: 740 var(--dr-fs-card-title) / 1.25 "DM Sans", system-ui, sans-serif; /**/ --dr-space-1: 4px; --dr-space-2: 8px; --dr-space-3: 12px; --dr-space-4: 16px; --dr-space-5: 20px; --dr-space-6: 28px; --dr-space-card: 18px; /**/ --dr-space-gap: 18px; /**/ } html.ops-ui { min-width: 320px; scroll-behavior: smooth; background: var(--ui-paper); font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; } html.ops-ui *, html.ops-ui *::before, html.ops-ui *::after { box-sizing: border-box; } html.ops-ui body { min-width: 320px; margin: 0; background: var(--ui-paper) !important; background-image: none !important; color: var(--ui-ink) !important; font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important; font-feature-settings: normal; } html.ops-ui body::before, html.ops-ui body::after { content: none !important; display: none !important; } html.ops-ui h1, html.ops-ui h2, html.ops-ui h3, html.ops-ui h4, html.ops-ui h5, html.ops-ui h6, html.ops-ui .font-display, html.ops-ui .font-condensed, html.ops-ui .brand-title, html.ops-ui .section-title, html.ops-ui .dr-client-title, html.ops-ui .dr-settings-title, html.ops-ui .dr-settings-group-title { color: var(--ui-ink); font-family: "DM Sans", system-ui, sans-serif !important; font-variant: normal; text-transform: none; } html.ops-ui .font-mono, html.ops-ui code, html.ops-ui kbd, html.ops-ui .eyebrow, html.ops-ui .ui-eyebrow, html.ops-ui .dr-kicker, html.ops-ui .dr-kicker-compact { font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important; } html.ops-ui button, html.ops-ui input, html.ops-ui select, html.ops-ui textarea { font: inherit; } html.ops-ui button, html.ops-ui a, html.ops-ui summary, html.ops-ui label { -webkit-tap-highlight-color: transparent; } html.ops-ui :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid rgba(103, 87, 217, 0.28) !important; outline-offset: 2px !important; box-shadow: none; } html.ops-ui ::selection { background: rgba(201, 248, 93, 0.7); color: var(--ui-green); } html.ops-ui [hidden] { display: none !important; } .ui-skip { position: fixed; z-index: 10000; top: 12px; left: 12px; transform: translateY(-150%); padding: 10px 14px; border-radius: 8px; background: var(--ui-green); color: #fff; font-size: 13px; font-weight: 700; text-decoration: none; transition: transform 160ms ease; } .ui-skip:focus { transform: translateY(0); } .sr-only, .ui-sr-only { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .ui-eyebrow, .eyebrow { margin: 0; color: #59675f; font-size: 10px; font-weight: 600; letter-spacing: 0.13em; line-height: 1.4; text-transform: uppercase; } .ui-page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 28px; } .ui-page-heading h1 { margin: 6px 0 7px; font-size: clamp(30px, 4vw, 44px); font-weight: 700; letter-spacing: -0.045em; line-height: 1.05; } .ui-page-heading p:not(.ui-eyebrow):not(.eyebrow) { max-width: 680px; margin: 0; color: var(--ui-muted); font-size: 14px; line-height: 1.6; } /**/ .ui-shell { display: grid; grid-template-columns: 244px minmax(0, 1fr); min-height: 100vh; background: var(--ui-paper); } .ui-sidebar { position: sticky; z-index: 70; top: 0; display: flex; height: 100vh; flex-direction: column; padding: 22px 16px 16px; overflow-y: auto; background: var(--ui-green); color: #fff; } .ui-wordmark { display: flex; align-items: center; gap: 11px; margin: 0 8px 34px; color: #fff; text-decoration: none; } .ui-wordmark__icon { display: grid; width: 36px; height: 36px; flex: 0 0 auto; place-items: center; border-radius: 10px; background: var(--ui-lime); color: var(--ui-green); font-size: 18px; transform: rotate(-3deg); } .ui-wordmark strong, .ui-wordmark small { display: block; } .ui-wordmark strong { color: #fff; font-size: 15px; letter-spacing: 0.08em; line-height: 1.1; text-transform: uppercase; } .ui-wordmark small { margin-top: 3px; color: rgba(255, 255, 255, 0.58); font: 500 9px "IBM Plex Mono", monospace; letter-spacing: 0.11em; text-transform: uppercase; } .ui-nav { display: flex; flex-direction: column; gap: 5px; } .ui-nav__label { margin: 17px 12px 7px; color: rgba(255, 255, 255, 0.42); font: 600 9px "IBM Plex Mono", monospace; letter-spacing: 0.14em; text-transform: uppercase; } .ui-nav__item { display: flex; min-height: 44px; align-items: center; gap: 11px; padding: 0 12px; border: 0; border-radius: 10px; background: transparent; color: rgba(255, 255, 255, 0.72); font-size: 13px; font-weight: 600; text-align: left; text-decoration: none; } .ui-nav__item i { font-size: 19px; } .ui-nav__item:hover, .ui-nav__item[aria-current="page"], .ui-nav__item.is-active { background: rgba(255, 255, 255, 0.11); color: #fff; } .ui-nav__item[aria-current="page"] i, .ui-nav__item.is-active i { color: var(--ui-lime); } .ui-sidebar__note { margin-top: auto; padding: 15px 12px 3px; border-top: 1px solid rgba(255, 255, 255, 0.11); color: rgba(255, 255, 255, 0.56); font-size: 10px; line-height: 1.55; } .ui-sidebar__note strong { display: block; margin-bottom: 3px; color: #fff; font-size: 11px; } .ui-workspace { min-width: 0; } .ui-topbar { position: sticky; z-index: 40; top: 0; display: flex; min-height: 72px; align-items: center; gap: 16px; padding: 0 32px; border-bottom: 1px solid var(--ui-line); background: rgba(255, 255, 255, 0.92); backdrop-filter: blur(14px); } .ui-topbar__title { min-width: 0; } .ui-topbar__title span, .ui-topbar__title strong { display: block; } .ui-topbar__title span { color: var(--ui-muted); font: 500 9px "IBM Plex Mono", monospace; letter-spacing: 0.11em; text-transform: uppercase; } .ui-topbar__title strong { margin-top: 2px; color: var(--ui-ink); font-size: 14px; } .ui-topbar__actions { display: flex; align-items: center; gap: 9px; margin-left: auto; } .ui-menu-button { display: none; width: 40px; height: 40px; place-items: center; padding: 0; border: 1px solid var(--ui-line); border-radius: 9px; background: #fff; color: var(--ui-ink); cursor: pointer; font-size: 20px; } .ui-scrim { position: fixed; z-index: 60; inset: 0; padding: 0; border: 0; background: rgba(13, 28, 19, 0.38); backdrop-filter: blur(2px); cursor: pointer; } /**/ .page-login { min-height: 100vh; background: radial-gradient(circle at 18% 12%, rgba(201, 248, 93, 0.19), transparent 30%), var(--ui-paper) !important; } .page-login .auth-shell { display: grid; width: min(1040px, calc(100% - 40px)); min-height: 100vh; grid-template-columns: minmax(300px, 0.85fr) minmax(430px, 1.15fr); align-content: center; margin: 0 auto; padding: 44px 0; } .page-login .auth-context { display: flex; min-height: 610px; flex-direction: column; justify-content: space-between; padding: clamp(30px, 5vw, 54px); border-radius: 20px 0 0 20px; background: radial-gradient(circle at 20% 0, rgba(201, 248, 93, 0.14), transparent 34%), var(--ui-green); color: #fff; } .page-login .auth-context :where(h1, h2, h3, strong) { color: #fff !important; } .page-login .auth-context :where(p, span, li) { color: rgba(255, 255, 255, 0.66) !important; } .page-login .auth-context .brand-mark, .page-login .auth-context__mark { display: grid; width: 48px; height: 48px; place-items: center; border: 0 !important; border-radius: 13px !important; background: var(--ui-lime) !important; color: var(--ui-green) !important; font-size: 23px; transform: rotate(-3deg); } .page-login .auth-context .brand-mark i, .page-login .auth-context__mark i { color: var(--ui-green) !important; } .page-login .auth-context h1, .page-login .auth-context h2 { margin: 20px 0 12px; font-size: clamp(34px, 4vw, 52px); font-weight: 700; letter-spacing: -0.05em !important; line-height: 1.02; } .page-login .auth-context > div > p { max-width: 360px; font-size: 14px; line-height: 1.65; } .page-login .auth-steps { display: grid; gap: 10px; margin: 30px 0 0; padding: 0; list-style: none; } .page-login .auth-steps li { display: grid; grid-template-columns: 30px 1fr; align-items: center; gap: 11px; font-size: 12px; } .page-login .auth-steps li span:first-child { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 9px; color: var(--ui-lime) !important; font: 600 10px "IBM Plex Mono", monospace; } .page-login .auth-context__foot { padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, 0.11); font-size: 11px; line-height: 1.55; } .page-login .auth-panel { width: auto; min-height: 610px; padding: clamp(32px, 5vw, 58px) !important; border: 1px solid var(--ui-line) !important; border-left: 0 !important; border-radius: 0 20px 20px 0 !important; background: #fff !important; box-shadow: var(--ui-shadow) !important; text-align: left; } .page-login .auth-panel > .brand { display: none; } .page-login .auth-panel .ui-eyebrow { margin-bottom: 8px; } .page-login .auth-panel .auth-title { margin: 0 0 10px; color: var(--ui-ink) !important; font-size: clamp(28px, 4vw, 38px); font-weight: 700; letter-spacing: -0.04em !important; line-height: 1.08; } .page-login .auth-copy { margin: 0 0 26px; color: var(--ui-muted) !important; font-size: 14px; line-height: 1.6; } .page-login .field { gap: 7px; margin-bottom: 14px; } .page-login label { color: var(--ui-ink) !important; font-size: 11px; font-weight: 700; letter-spacing: 0; text-transform: none; } .page-login input { min-height: 48px; padding: 0 14px; border: 1px solid var(--ui-line) !important; border-radius: 10px !important; background: #f8faf8 !important; color: var(--ui-ink) !important; } .page-login input:focus { border-color: #9d94e2 !important; background: #fff !important; box-shadow: 0 0 0 4px rgba(103, 87, 217, 0.1) !important; } .page-login .button-row { display: grid; grid-template-columns: 1fr; gap: 9px; margin-top: 16px; } .page-login .button { width: 100%; min-height: 46px; border-radius: 9px !important; font-size: 12px; font-weight: 700; letter-spacing: 0 !important; text-transform: none; } .page-login .button-primary { border-color: var(--ui-green) !important; background: var(--ui-green) !important; color: #fff !important; } .page-login .button-primary:hover { border-color: var(--ui-green-2) !important; background: var(--ui-green-2) !important; } .page-login .button-secondary { border-color: var(--ui-line) !important; background: #fff !important; color: var(--ui-ink) !important; } .page-login .auth-provider-row { margin: 0; } .page-login .auth-divider { margin: 20px 0; color: var(--ui-subtle) !important; font: 600 9px "IBM Plex Mono", monospace; letter-spacing: 0.1em; } .page-login .auth-divider::before, .page-login .auth-divider::after { background: var(--ui-line) !important; } .page-login .notice, .page-login .signed-in, .page-login .access-panel { margin: 18px 0 0; padding: 16px; border: 1px solid var(--ui-line) !important; border-left: 1px solid var(--ui-line) !important; border-radius: 11px !important; background: var(--ui-green-soft) !important; color: var(--ui-muted) !important; box-shadow: none !important; } .page-login .notice { border-color: #ead6a8 !important; background: var(--ui-amber) !important; } .page-login .access-panel { grid-template-columns: 44px 1fr; } .page-login .access-icon { width: 44px; height: 44px; border-color: #c9d8cf !important; border-radius: 12px !important; background: #fff; color: var(--ui-green-2) !important; } .page-login .access-panel h2 { color: var(--ui-ink) !important; font-size: 19px; letter-spacing: -0.02em; text-transform: none; } .page-login .access-meta { color: var(--ui-green-2) !important; font-size: 10px; } .page-login .status { min-height: 20px; color: var(--ui-muted) !important; font-size: 12px; } .page-login .status[data-tone="success"] { color: var(--ui-success) !important; } .page-login .status[data-tone="error"] { color: var(--ui-danger) !important; } .page-login .status[data-tone="warning"] { color: var(--ui-warning) !important; } /**/ .page-admin .admin-shell { width: auto; max-width: 1480px; margin: 0 auto; padding: 36px clamp(24px, 4vw, 56px) 60px; } .page-admin .toolbar, .page-admin .ui-topbar__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 9px; } .page-admin .button { min-height: 40px; padding: 0 14px; border: 1px solid transparent; border-radius: 9px !important; font-size: 12px; font-weight: 700; letter-spacing: 0 !important; text-transform: none; } .page-admin .button-primary { border-color: var(--ui-green) !important; background: var(--ui-green) !important; color: #fff !important; } .page-admin .button-secondary { border-color: var(--ui-line) !important; background: #fff !important; color: var(--ui-ink) !important; } .page-admin .button-danger { border-color: #efc6cb !important; background: #fff8f8 !important; color: var(--ui-danger) !important; } .page-admin .button:hover:not(:disabled) { transform: none; filter: none; } .page-admin .button-primary:hover:not(:disabled) { background: var(--ui-green-2) !important; } .page-admin .button-secondary:hover:not(:disabled) { background: #f7f9f7 !important; } .page-admin .panel, .page-admin .stat { border: 1px solid var(--ui-line) !important; border-left: 1px solid var(--ui-line) !important; border-radius: var(--ui-radius) !important; background: #fff !important; box-shadow: none !important; } .page-admin .import-band { grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; margin-bottom: 18px; padding: 20px; } .page-admin .drop-zone { min-height: 110px; padding: 18px; border: 1px dashed #b8c8be !important; border-radius: 12px !important; background: #f8faf8 !important; } .page-admin .drop-zone:hover, .page-admin .drop-zone[data-active="true"] { border-color: var(--ui-violet) !important; background: var(--ui-violet-soft) !important; } .page-admin .drop-icon { width: 46px; height: 46px; border: 0 !important; border-radius: 12px !important; background: var(--ui-violet-soft) !important; color: var(--ui-violet) !important; } .page-admin .drop-title { color: var(--ui-ink) !important; font-size: 13px; letter-spacing: 0 !important; text-transform: none; } .page-admin .drop-meta, .page-admin .status, .page-admin .subtle, .page-admin .stat-note { color: var(--ui-muted) !important; } .page-admin .stat-grid { gap: 14px; margin-bottom: 18px; } .page-admin .stat { min-height: 126px; padding: 21px; } .page-admin .stat-label { color: var(--ui-muted) !important; font: 600 10px "IBM Plex Mono", monospace !important; letter-spacing: 0.08em !important; text-transform: uppercase; } .page-admin .stat-value { color: var(--ui-ink) !important; font-family: "DM Sans", sans-serif !important; font-size: 29px; letter-spacing: -0.04em; } .page-admin .viewer-grid { gap: 18px; } .page-admin .panel-head { min-height: 64px; padding: 15px 18px; border-color: var(--ui-line) !important; } .page-admin .section-title { color: var(--ui-ink) !important; font-size: 17px; letter-spacing: -0.02em !important; text-transform: none; } .page-admin .badge { padding: 5px 8px; border: 0 !important; border-radius: 999px !important; background: #eef2ef !important; color: #56635c !important; font-size: 9px; } .page-admin .badge[data-tone="success"] { background: var(--ui-mint) !important; color: var(--ui-success) !important; } .page-admin .badge[data-tone="warning"] { background: var(--ui-amber) !important; color: var(--ui-warning) !important; } .page-admin .badge[data-tone="danger"] { background: var(--ui-rose) !important; color: var(--ui-danger) !important; } .page-admin .badge[data-tone="info"] { background: var(--ui-violet-soft) !important; color: var(--ui-violet) !important; } .page-admin .search-wrap { padding: 14px 18px; border-color: var(--ui-line) !important; } .page-admin .search-wrap input { min-height: 44px; padding: 0 13px; border: 1px solid var(--ui-line) !important; border-radius: 9px !important; background: #f8faf8 !important; color: var(--ui-ink) !important; } .page-admin .search-wrap input:focus { border-color: #9d94e2 !important; background: #fff !important; box-shadow: 0 0 0 4px rgba(103, 87, 217, 0.1) !important; } .page-admin .file-row { border-color: var(--ui-line-soft) !important; background: #fff !important; color: var(--ui-ink) !important; } .page-admin .file-row:hover { background: #fafcfb !important; } .page-admin .file-row[aria-current="true"] { border-color: #cfc9f5 !important; background: var(--ui-violet-soft) !important; } .page-admin .empty-state { min-height: 250px; border: 0 !important; border-radius: 0 !important; background: #fff !important; color: var(--ui-muted) !important; } .page-admin .empty-state i { color: var(--ui-violet) !important; } .page-admin .detail-section { border-color: var(--ui-line) !important; } .page-admin .meta-item, .page-admin .rating-item, .page-admin .progress-item, .page-admin .note-item, .page-admin .checklist-group, .page-admin details { border-color: var(--ui-line) !important; border-radius: 10px !important; background: #f9fbf9 !important; } .page-admin .meta-item dt, .page-admin .rating-label, .page-admin .progress-label, .page-admin .note-label, .page-admin th { color: var(--ui-green-2) !important; } .page-admin .score-dial { background: radial-gradient(circle at center, #fff 0 58%, transparent 59%), conic-gradient(var(--ui-success) var(--score-angle), #edf1ee 0) !important; } .page-admin .track { background: #e8ede9 !important; } .page-admin .fill { background: linear-gradient(90deg, var(--ui-violet), var(--ui-success)) !important; } /**/ .page-workspace { background: var(--ui-paper) !important; } .page-workspace .dr-access-screen { background: radial-gradient(circle at 50% 0, #fff 0, transparent 42%), var(--ui-paper) !important; color: var(--ui-ink) !important; } .page-workspace .dr-access-screen__panel { padding: 38px; border: 1px solid var(--ui-line) !important; border-radius: 18px !important; background: #fff !important; box-shadow: var(--ui-shadow) !important; } .page-workspace .dr-access-screen__title { color: var(--ui-ink) !important; font-size: 26px; letter-spacing: -0.035em !important; text-transform: none; } .page-workspace .dr-access-screen__copy { color: var(--ui-muted) !important; } .page-workspace .dr-app-shell { display: grid; grid-template-columns: 244px minmax(0, 1fr); align-items: start; min-height: 100vh; background: var(--ui-paper) !important; color: var(--ui-ink) !important; } .page-workspace .dr-global-sidebar { position: sticky; z-index: 90; top: 0; grid-column: 1; grid-row: 1 / span 20; height: 100vh; overflow-y: auto; border: 0 !important; background: var(--ui-green) !important; color: #fff !important; box-shadow: none !important; backdrop-filter: none; } .page-workspace .dr-global-sidebar .dr-topbar { display: flex !important; width: 100%; height: 100%; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; gap: 0 !important; padding: 22px 16px 16px !important; } .page-workspace .dr-global-sidebar .dr-app-brand { gap: 11px !important; margin: 0 8px 30px; } .page-workspace .dr-global-sidebar .dr-app-brand > div:first-child { display: grid; width: 36px !important; height: 36px !important; flex: 0 0 auto; place-items: center; border: 0 !important; border-radius: 10px !important; background: var(--ui-lime) !important; color: var(--ui-green) !important; transform: rotate(-3deg); } .page-workspace .dr-global-sidebar .dr-app-brand > div:first-child i { color: var(--ui-green) !important; } .page-workspace .dr-global-sidebar [data-dr-shell-brand-name] { color: #fff !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: 0.06em !important; line-height: 1.15 !important; text-transform: uppercase; } .page-workspace .dr-global-sidebar [data-dr-shell-brand-tagline] { margin-top: 3px; color: rgba(255, 255, 255, 0.52) !important; font: 500 8px "IBM Plex Mono", monospace !important; letter-spacing: 0.1em !important; } .page-workspace .dr-global-sidebar .dr-app-actions { display: flex; flex: 1; flex-direction: column; align-items: stretch !important; gap: 5px !important; } .page-workspace .dr-global-sidebar .dr-button, .page-workspace .dr-global-sidebar .dr-app-more > summary, .page-workspace .dr-global-sidebar .dr-app-menu-item { display: flex; width: 100%; min-height: 44px; justify-content: flex-start; gap: 11px; padding: 0 12px; border: 0 !important; border-radius: 10px !important; background: transparent !important; color: rgba(255, 255, 255, 0.72) !important; box-shadow: none !important; font-size: 12px; font-weight: 600; letter-spacing: 0 !important; text-transform: none; } .page-workspace .dr-global-sidebar .dr-button i, .page-workspace .dr-global-sidebar .dr-button span, .page-workspace .dr-global-sidebar .dr-app-more > summary i, .page-workspace .dr-global-sidebar .dr-app-more > summary span, .page-workspace .dr-global-sidebar .dr-app-menu-item i, .page-workspace .dr-global-sidebar .dr-app-menu-item span { color: inherit !important; } .page-workspace .dr-global-sidebar .dr-button:hover, .page-workspace .dr-global-sidebar .dr-button[aria-pressed="true"], .page-workspace .dr-global-sidebar .dr-app-more > summary:hover, .page-workspace .dr-global-sidebar .dr-app-more[open] > summary, .page-workspace .dr-global-sidebar .dr-app-menu-item:hover { background: rgba(255, 255, 255, 0.1) !important; color: #fff !important; } .page-workspace .dr-global-sidebar .dr-button--primary { margin-bottom: 4px; background: var(--ui-lime) !important; color: var(--ui-green) !important; } .page-workspace .dr-global-sidebar .dr-button--primary:hover { background: #d5ff74 !important; color: var(--ui-green) !important; } .page-workspace .dr-global-sidebar .dr-app-more { position: static !important; width: 100%; } .page-workspace .dr-global-sidebar .dr-app-more-panel { position: static !important; display: none; min-width: 0; margin: 4px 0 6px 10px; padding: 5px; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 10px !important; background: rgba(255, 255, 255, 0.06) !important; box-shadow: none !important; } .page-workspace .dr-global-sidebar .dr-app-more[open] .dr-app-more-panel { display: grid; } .page-workspace .dr-global-sidebar .dr-app-more-panel .dr-app-menu-item { min-height: 38px; font-size: 11px; } .page-workspace .dr-global-sidebar .dr-account-identity { display: grid; width: 100%; grid-template-columns: 36px minmax(0, 1fr); align-items: center; gap: 10px; margin-top: auto; padding: 14px 10px 12px; border-top: 1px solid rgba(255, 255, 255, 0.1); color: #fff; } .page-workspace .dr-global-sidebar .dr-account-identity[hidden] { display: none !important; } .page-workspace .dr-global-sidebar .dr-account-identity__avatar { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 10px; background: rgba(201, 255, 102, 0.14); color: var(--ui-lime); font-size: 12px; font-weight: 800; letter-spacing: 0.04em; } .page-workspace .dr-global-sidebar .dr-account-identity__copy { display: grid; min-width: 0; gap: 1px; } .page-workspace .dr-global-sidebar .dr-account-identity__label, .page-workspace .dr-global-sidebar .dr-account-identity__meta { color: rgba(255, 255, 255, 0.52); font: 500 10px "IBM Plex Mono", monospace; letter-spacing: 0.06em; line-height: 1.4; text-transform: uppercase; } .page-workspace .dr-global-sidebar .dr-account-identity__copy strong, .page-workspace .dr-global-sidebar [data-workspace-account-email] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-global-sidebar .dr-account-identity__copy strong { color: #fff; font-size: 12px; font-weight: 700; } .page-workspace .dr-global-sidebar [data-workspace-account-email] { color: rgba(255, 255, 255, 0.76); font-size: 11px; } .page-workspace .dr-global-sidebar .dr-billing-status { margin-top: 0; padding: 6px 10px 2px; color: rgba(255, 255, 255, 0.48) !important; font: 500 8px "IBM Plex Mono", monospace; line-height: 1.5; } .page-workspace .dr-workspace-bar { position: sticky; z-index: 60; top: 0; display: flex; min-height: 72px; grid-column: 2; align-items: center; gap: 14px; padding: 0 28px; border-bottom: 1px solid var(--ui-line); background: rgba(255, 255, 255, 0.92); backdrop-filter: blur(14px); } .page-workspace .dr-workspace-bar__copy span, .page-workspace .dr-workspace-bar__copy strong { display: block; } .page-workspace .dr-workspace-bar__copy span { color: var(--ui-muted) !important; font: 500 9px "IBM Plex Mono", monospace; letter-spacing: 0.11em; text-transform: uppercase; } .page-workspace .dr-workspace-bar__copy strong { margin-top: 2px; color: var(--ui-ink) !important; font-size: 14px; } .page-workspace .dr-workspace-bar__status { display: flex; align-items: center; gap: 8px; margin-left: auto; color: var(--ui-muted) !important; font-size: 11px; font-weight: 600; } .page-workspace .dr-workspace-bar__status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #43aa72; box-shadow: 0 0 0 3px #ddf6e7; } .page-workspace .dr-workspace-bar .ui-menu-button, .page-workspace .dr-workspace-bar .ui-client-button { width: 40px; height: 40px; place-items: center; padding: 0; border: 1px solid var(--ui-line); border-radius: 9px; background: #fff; color: var(--ui-ink); cursor: pointer; font-size: 19px; } .page-workspace .dr-workspace-bar .ui-menu-button { display: none; } .page-workspace .dr-workspace-bar .ui-client-button { display: none; } .page-workspace [data-dr-loading-state], .page-workspace [data-dr-ready-shell] { grid-column: 2; } .page-workspace .dr-workspace-shell { width: 100%; max-width: 1680px !important; grid-template-columns: 286px minmax(0, 1fr) !important; gap: 18px !important; margin: 0 auto; padding: 26px clamp(18px, 3vw, 38px) 50px !important; background: transparent !important; } .page-workspace .dr-client-sidebar { position: sticky; top: 98px; align-self: start; } .page-workspace .dr-panel, .page-workspace .dr-card, .page-workspace .dr-card-compact, .page-workspace .dr-subpanel, .page-workspace .dr-shell, .page-workspace .dr-settings-shell, .page-workspace .dr-settings-preview, .page-workspace .dr-metric, .page-workspace .dr-empty-state { border: 1px solid var(--ui-line) !important; border-left: 1px solid var(--ui-line) !important; border-radius: var(--ui-radius) !important; background: #fff !important; background-image: none !important; box-shadow: none !important; color: var(--ui-ink) !important; backdrop-filter: none !important; } .page-workspace .dr-client-sidebar .dr-panel[data-dr-client-panel="search"] { padding: 16px !important; } .page-workspace .dr-client-sidebar .dr-panel[data-dr-client-panel="list"] { padding: 14px !important; } .page-workspace .dr-kicker, .page-workspace .dr-kicker-compact { color: #59675f !important; font-size: 9px !important; font-weight: 600 !important; letter-spacing: 0.1em !important; line-height: 1.4; text-transform: uppercase; } .page-workspace .dr-kicker::before { content: none !important; } .page-workspace .dr-input, .page-workspace .dr-select, .page-workspace .dr-textarea, .page-workspace input, .page-workspace select, .page-workspace textarea { min-height: 44px; border: 1px solid var(--ui-line) !important; border-radius: 9px !important; background: #f8faf8 !important; color: var(--ui-ink) !important; color-scheme: light !important; } .page-workspace textarea { min-height: auto; } .page-workspace :where(input, select, textarea, .dr-input, .dr-select, .dr-textarea):focus { border-color: #9d94e2 !important; background: #fff !important; box-shadow: 0 0 0 4px rgba(103, 87, 217, 0.1) !important; } .page-workspace .dr-button, .page-workspace .dr-button-primary, .page-workspace .dr-button-secondary, .page-workspace .dr-button-ghost, .page-workspace .dr-button-danger { min-height: 40px; border-radius: 9px !important; box-shadow: none !important; font-size: 12px; font-weight: 700; letter-spacing: 0 !important; text-transform: none; } .page-workspace :where(.dr-button--primary, .dr-button-primary, .dr-button--garage-add, .dr-button--fit-optimizer) { border-color: var(--ui-green) !important; background: var(--ui-green) !important; background-image: none !important; color: #fff !important; } .page-workspace :where(.dr-button--primary, .dr-button-primary, .dr-button--garage-add, .dr-button--fit-optimizer) * { color: inherit !important; } .page-workspace :where(.dr-button--primary, .dr-button-primary, .dr-button--garage-add, .dr-button--fit-optimizer):hover:not(:disabled) { border-color: var(--ui-green-2) !important; background: var(--ui-green-2) !important; transform: none !important; } .page-workspace :where(.dr-button--secondary, .dr-button-secondary, .dr-button--ghost, .dr-button-ghost) { border-color: var(--ui-line) !important; background: #fff !important; color: var(--ui-ink) !important; } .page-workspace :where(.dr-button--secondary, .dr-button-secondary, .dr-button--ghost, .dr-button-ghost):hover:not(:disabled) { border-color: #c9d4cd !important; background: #f7f9f7 !important; transform: none !important; } .page-workspace :where(.dr-button--danger, .dr-button-danger) { border-color: #efc6cb !important; background: #fff8f8 !important; color: var(--ui-danger) !important; } .page-workspace :where(.dr-button--danger, .dr-button-danger):hover:not(:disabled) { border-color: #e2a7ae !important; background: var(--ui-rose) !important; } /**/ .page-workspace :where(.dr-button--selected) { border-color: var(--ui-green) !important; background: var(--ui-green-soft) !important; color: var(--ui-green) !important; } .page-workspace :where(.dr-button--selected) * { color: inherit !important; } .page-workspace :where(.dr-button--selected):hover:not(:disabled) { border-color: var(--ui-green-2) !important; background: #e2efe7 !important; } .page-workspace .dr-button:disabled, .page-workspace .dr-button[disabled], .page-workspace .dr-button[aria-disabled="true"] { cursor: not-allowed !important; opacity: 0.5 !important; box-shadow: none !important; transform: none !important; } .page-workspace .dr-button:focus-visible { outline: 2px solid var(--ui-green) !important; outline-offset: 2px !important; } .page-workspace .dr-client-list { max-height: calc(100vh - 255px) !important; } .page-workspace .dr-client-row, .page-workspace [data-dr-client-id], .page-workspace .dr-client-item { border-color: var(--ui-line-soft) !important; border-radius: 10px !important; background: #fff !important; color: var(--ui-ink) !important; } .page-workspace .dr-client-row:hover, .page-workspace [data-dr-client-id]:hover, .page-workspace .dr-client-item:hover { background: #fafcfb !important; } .page-workspace .dr-client-row[aria-current="true"], .page-workspace [data-dr-client-id][aria-current="true"], .page-workspace .dr-client-item.is-active { border-color: #cfc9f5 !important; background: var(--ui-violet-soft) !important; } .page-workspace .dr-client-header { padding: 22px !important; } .page-workspace .dr-client-title, .page-workspace .dr-settings-title { color: var(--ui-ink) !important; font-size: clamp(24px, 3vw, 34px) !important; font-weight: 700 !important; letter-spacing: -0.04em !important; line-height: 1.08 !important; text-transform: none !important; } .page-workspace .dr-workspace-tabs { display: flex; gap: 6px; padding: 6px; overflow-x: auto; border: 1px solid #c8d4cd; border-radius: 12px; background: #e9efeb; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78), 0 3px 10px rgba(23, 62, 43, 0.08); } .page-workspace .dr-workspace-tabs > .dr-button, .page-workspace .dr-client-actionbar .dr-tab { min-height: 40px; border: 1px solid #d3ddd7 !important; border-radius: 8px !important; background: rgba(255, 255, 255, 0.78) !important; color: #526159 !important; box-shadow: 0 1px 2px rgba(23, 62, 43, 0.04); white-space: nowrap; } .page-workspace .dr-workspace-tabs > .dr-button:hover, .page-workspace .dr-client-actionbar .dr-tab:hover { border-color: #aebfb5 !important; background: #fff !important; color: var(--ui-green) !important; } .page-workspace .dr-workspace-tabs > .dr-button[aria-pressed="true"], .page-workspace .dr-workspace-tabs > .dr-button.is-active, .page-workspace .dr-client-actionbar .dr-tab[aria-selected="true"], .page-workspace .dr-client-actionbar .dr-tab.is-active { border-color: var(--ui-green) !important; background: var(--ui-green) !important; color: #fff !important; box-shadow: 0 3px 8px rgba(23, 62, 43, 0.24); } .page-workspace .dr-workspace-tabs > .dr-button[aria-pressed="true"] *, .page-workspace .dr-workspace-tabs > .dr-button.is-active *, .page-workspace .dr-client-actionbar .dr-tab[aria-selected="true"] *, .page-workspace .dr-client-actionbar .dr-tab.is-active * { color: inherit !important; } .page-workspace .dr-status, .page-workspace .badge, .page-workspace .rounded-full { border-radius: 999px !important; } .page-workspace .dr-status, .page-workspace .badge { border: 0 !important; background: #eef2ef !important; color: #56635c !important; } .page-workspace :where(.dr-status--success, .badge[data-tone="success"]) { background: var(--ui-mint) !important; color: var(--ui-success) !important; } .page-workspace :where(.dr-status--warning, .badge[data-tone="warning"]) { background: var(--ui-amber) !important; color: var(--ui-warning) !important; } .page-workspace :where(.dr-status--danger, .badge[data-tone="danger"]) { background: var(--ui-rose) !important; color: var(--ui-danger) !important; } .page-workspace :where(.dr-status--info, .badge[data-tone="info"]) { background: var(--ui-violet-soft) !important; color: var(--ui-violet) !important; } .page-workspace .text-white, .page-workspace [class*="text-white/"], .page-workspace .text-\[\#ffffff\] { color: var(--ui-ink) !important; } .page-workspace .text-brand-gold, .page-workspace [class*="text-brand-gold/"] { color: var(--ui-green-2) !important; } .page-workspace .bg-black, .page-workspace [class*="bg-black/"], .page-workspace [class*="bg-white/"], .page-workspace .bg-\[\#080908\] { background-color: #f8faf8 !important; } .page-workspace [class*="border-white/"], .page-workspace [class*="border-brand-gold/"] { border-color: var(--ui-line) !important; } .page-workspace table { color: var(--ui-ink) !important; } .page-workspace th { border-color: var(--ui-line) !important; background: #fafcfb !important; color: #59675f !important; font: 600 9px "IBM Plex Mono", monospace !important; letter-spacing: 0.08em; text-transform: uppercase; } .page-workspace td { border-color: var(--ui-line-soft) !important; color: var(--ui-ink) !important; } .page-workspace .dr-loading-state { border: 1px solid var(--ui-line); border-radius: var(--ui-radius); background: #fff; color: var(--ui-ink); box-shadow: var(--ui-shadow-soft); } .page-workspace .dr-loading-state i { color: var(--ui-violet) !important; } .page-workspace .dr-ride-slideover-backdrop, .page-workspace [data-dr-alert], .page-workspace [data-dr-confirm], .page-workspace [data-dr-legal-gate], .page-workspace [data-dr-onboarding] { background: rgba(13, 28, 19, 0.48) !important; backdrop-filter: blur(3px); } .page-workspace .dr-ride-slideover-panel, .page-workspace [data-dr-alert] > div, .page-workspace [data-dr-confirm] > div, .page-workspace [data-dr-legal-dialog], .page-workspace [data-dr-onboarding-dialog] { border: 1px solid var(--ui-line) !important; border-radius: 18px !important; background: #fff !important; background-image: none !important; color: var(--ui-ink) !important; box-shadow: var(--ui-shadow) !important; } .page-workspace [data-dr-legal-dialog] { max-width: 820px !important; } .page-workspace [data-dr-legal-document] { border-color: var(--ui-line) !important; background: #f8faf8 !important; color: var(--ui-muted) !important; } .page-workspace [data-dr-legal-dialog] :where(h3, h4, strong, .text-white), .page-workspace [data-dr-onboarding-dialog] :where(h3, h4, strong, .text-white) { color: var(--ui-ink) !important; } .page-workspace [data-dr-legal-dialog] :where(p, span, label), .page-workspace [data-dr-onboarding-dialog] :where(p, span) { color: var(--ui-muted) !important; } .page-workspace [data-dr-legal-dialog] .text-brand-gold, .page-workspace [data-dr-onboarding-dialog] .text-brand-gold { color: var(--ui-green-2) !important; } .page-workspace .dr-toast { border: 1px solid var(--ui-line) !important; border-radius: 11px !important; background: #fff !important; color: var(--ui-ink) !important; box-shadow: var(--ui-shadow) !important; } /**/ @media (max-width: 1400px) { .page-workspace .dr-workspace-shell { grid-template-columns: 250px minmax(0, 1fr) !important; } } @media (max-width: 900px) { .ui-shell { display: block; } .ui-sidebar { position: fixed; left: 0; transform: translateX(-105%); width: 244px; transition: transform 180ms ease; } .ui-sidebar.is-open { transform: translateX(0); } .ui-menu-button { display: grid; } .ui-topbar { padding: 0 16px; } .page-login .auth-shell { grid-template-columns: 1fr; align-content: start; padding: 24px 0; } .page-login .auth-context { min-height: auto; padding: 28px; border-radius: 18px 18px 0 0; } .page-login .auth-context h1, .page-login .auth-context h2 { max-width: 520px; margin: 16px 0 8px; font-size: 34px; } .page-login .auth-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 20px; } .page-login .auth-steps li { grid-template-columns: 30px 1fr; } .page-login .auth-context__foot { display: none; } .page-login .auth-panel { min-height: auto; border-left: 1px solid var(--ui-line) !important; border-top: 0 !important; border-radius: 0 0 18px 18px !important; } .page-admin .admin-shell { padding: 28px 18px 48px; } .page-workspace .dr-app-shell { display: block; } .page-workspace .dr-global-sidebar { position: fixed; left: 0; transform: translateX(-105%); width: 244px; transition: transform 180ms ease; } .page-workspace .dr-global-sidebar.is-open { transform: translateX(0); } .page-workspace .dr-workspace-bar { grid-column: auto; padding: 0 14px; } .page-workspace .dr-workspace-bar .ui-menu-button, .page-workspace .dr-workspace-bar .ui-client-button { display: grid; } .page-workspace [data-dr-loading-state], .page-workspace [data-dr-ready-shell] { grid-column: auto; } .page-workspace .dr-workspace-shell { display: block !important; padding: 18px 14px 44px !important; } .page-workspace .dr-client-sidebar { position: fixed; z-index: 80; top: 72px; right: 0; bottom: 0; display: block; width: min(360px, calc(100vw - 28px)); padding: 14px; overflow-y: auto; transform: translateX(105%); background: var(--ui-paper); box-shadow: -20px 0 60px rgba(22, 47, 31, 0.16); transition: transform 180ms ease; } .page-workspace .dr-client-sidebar.is-open { transform: translateX(0); } .page-workspace .dr-client-list { max-height: none !important; } .page-workspace .dr-workspace-main { margin-top: 0; } } @media (max-width: 760px) { .ui-page-heading { align-items: flex-start; flex-direction: column; margin-bottom: 22px; } .page-admin .ui-topbar__title { display: none; } .page-admin .ui-topbar__actions { margin-left: auto; } .page-admin .import-band { grid-template-columns: 1fr; } .page-admin .import-band > div:last-child { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px; } .page-workspace .dr-workspace-bar__status { display: none; } } @media (max-width: 560px) { .ui-topbar { min-height: 64px; } .ui-topbar__actions .button span:not(.sr-only) { display: none; } .page-login .auth-shell { width: min(100% - 24px, 560px); } .page-login .auth-context { padding: 24px; } .page-login .auth-context h1, .page-login .auth-context h2 { font-size: 30px; } .page-login .auth-steps { grid-template-columns: 1fr; } .page-login .auth-panel { padding: 28px 22px !important; } .page-admin .ui-topbar__actions { gap: 6px; } .page-admin .ui-topbar__actions .button { width: 40px; padding: 0; } .page-admin .ui-topbar__actions .button span { display: none; } .page-workspace .dr-workspace-bar { min-height: 64px; } .page-workspace .dr-workspace-bar__copy strong { max-width: 44vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-client-sidebar { top: 64px; } } @media (prefers-reduced-motion: reduce) { html.ops-ui, html.ops-ui * { scroll-behavior: auto !important; } .ui-skip, .ui-sidebar, .page-workspace .dr-global-sidebar, .page-workspace .dr-client-sidebar { transition: none !important; } } /**/ html.ops-ui body.ui-layer-open { overflow: hidden !important; } html.ops-ui body.page-login .auth-shell { place-items: stretch !important; align-items: stretch !important; } html.ops-ui body.page-login .auth-context { min-height: 640px; padding: clamp(30px, 4vw, 48px) !important; } html.ops-ui body.page-login .auth-context h1, html.ops-ui body.page-login .auth-context h2 { font-size: clamp(34px, 3.6vw, 46px) !important; } html.ops-ui body.page-login .auth-context__eyebrow { margin-top: 24px; color: var(--ui-lime) !important; } html.ops-ui body.page-login .auth-context__foot strong { display: block; margin-bottom: 3px; } html.ops-ui body.page-login .auth-panel { min-height: 640px; border: 1px solid var(--ui-line) !important; border-left: 0 !important; background: var(--ui-white) !important; } html.ops-ui body.page-login label { color: var(--ui-ink) !important; } html.ops-ui body.page-login .field small { color: var(--ui-muted) !important; font-size: 11px; line-height: 1.45; } html.ops-ui body.page-login :where(.notice, .signed-in, .access-panel) { border-left: 1px solid var(--ui-line) !important; } html.ops-ui body.page-admin :where(.panel, .stat), html.ops-ui body.page-workspace :where(.dr-panel, .dr-card, .dr-card-compact, .dr-subpanel, .dr-shell, .dr-settings-shell, .dr-settings-preview, .dr-metric, .dr-empty-state) { border: 1px solid var(--ui-line) !important; border-left: 1px solid var(--ui-line) !important; border-radius: var(--ui-radius) !important; background: var(--ui-white) !important; background-image: none !important; box-shadow: none !important; } html.ops-ui body.page-admin .drop-zone { border: 1px dashed #b8c8be !important; background: #f8faf8 !important; } html.ops-ui body.page-admin .file-row[aria-current="true"] { border-color: #cfc9f5 !important; background: var(--ui-violet-soft) !important; } html.ops-ui body.page-workspace .dr-global-sidebar { border: 0 !important; border-left: 0 !important; background: var(--ui-green) !important; } html.ops-ui body.page-workspace [data-dr-legal-dialog], html.ops-ui body.page-workspace [data-dr-onboarding-dialog] { border: 1px solid var(--ui-line) !important; background: var(--ui-white) !important; } @media (max-width: 900px) { html.ops-ui body.page-login .auth-context, html.ops-ui body.page-login .auth-panel { min-height: auto; } html.ops-ui body.page-login .auth-panel { border-left: 1px solid var(--ui-line) !important; border-top: 0 !important; } } /**/ html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-app-brand { width: auto !important; min-width: 0 !important; height: auto !important; align-items: center !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-app-brand > div:last-child { min-width: 0 !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar [data-dr-shell-brand-name] { max-width: 138px; overflow-wrap: normal !important; word-break: normal !important; white-space: normal !important; font-size: 12px !important; line-height: 1.2 !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-app-actions { display: flex !important; width: 100% !important; height: auto !important; flex: 1 1 auto !important; flex-direction: column !important; grid-auto-flow: initial !important; grid-template-columns: none !important; align-items: stretch !important; justify-content: flex-start !important; gap: 5px !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-app-actions > *, html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-app-actions .dr-button, html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-app-actions summary.dr-button { position: static !important; width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 44px !important; flex: 0 0 auto !important; grid-column: auto !important; transform: none !important; } html.ops-ui.field-theme body.page-workspace .dr-workspace-shell { grid-template-columns: 286px minmax(0, 1fr) !important; } html.ops-ui.field-theme body.page-workspace .dr-workspace-shell > .dr-client-sidebar { display: block !important; width: auto !important; order: 0 !important; grid-column: 1 !important; grid-row: 1 !important; } html.ops-ui.field-theme body.page-workspace .dr-workspace-shell > .dr-workspace-main, html.ops-ui.field-theme body.page-workspace .dr-workspace-shell > [data-dr-empty-client] { width: auto !important; order: 0 !important; grid-column: 2 !important; grid-row: 1 !important; } html.ops-ui.field-theme body.page-workspace .dr-panel, html.ops-ui.field-theme body.page-workspace .dr-card, html.ops-ui.field-theme body.page-workspace .dr-card-compact, html.ops-ui.field-theme body.page-workspace .dr-subpanel, html.ops-ui.field-theme body.page-workspace .dr-shell, html.ops-ui.field-theme body.page-workspace .dr-settings-shell, html.ops-ui.field-theme body.page-workspace .dr-settings-preview, html.ops-ui.field-theme body.page-workspace .dr-metric, html.ops-ui.field-theme body.page-workspace .dr-empty-state { border: 1px solid var(--ui-line) !important; border-left: 1px solid var(--ui-line) !important; background: var(--ui-white) !important; background-image: none !important; color: var(--ui-ink) !important; box-shadow: none !important; } html.ops-ui.field-theme body.page-workspace input, html.ops-ui.field-theme body.page-workspace select, html.ops-ui.field-theme body.page-workspace textarea, html.ops-ui.field-theme body.page-workspace .dr-input, html.ops-ui.field-theme body.page-workspace .dr-select, html.ops-ui.field-theme body.page-workspace .dr-textarea { border-color: var(--ui-line) !important; background: #f8faf8 !important; color: var(--ui-ink) !important; color-scheme: light !important; } html.ops-ui.field-theme body.page-workspace input:focus, html.ops-ui.field-theme body.page-workspace select:focus, html.ops-ui.field-theme body.page-workspace textarea:focus, html.ops-ui.field-theme body.page-workspace .dr-input:focus, html.ops-ui.field-theme body.page-workspace .dr-select:focus, html.ops-ui.field-theme body.page-workspace .dr-textarea:focus { border-color: #9d94e2 !important; background: var(--ui-white) !important; box-shadow: 0 0 0 4px rgba(103, 87, 217, 0.1) !important; } html.ops-ui.field-theme body.page-workspace .dr-button--primary, html.ops-ui.field-theme body.page-workspace .dr-button-primary, html.ops-ui.field-theme body.page-workspace .dr-button--garage-add, html.ops-ui.field-theme body.page-workspace .dr-button--fit-optimizer { border-color: var(--ui-green) !important; background: var(--ui-green) !important; background-image: none !important; color: var(--ui-white) !important; } html.ops-ui.field-theme body.page-workspace .dr-button--secondary, html.ops-ui.field-theme body.page-workspace .dr-button-secondary, html.ops-ui.field-theme body.page-workspace .dr-button--ghost, html.ops-ui.field-theme body.page-workspace .dr-button-ghost { border-color: var(--ui-line) !important; background: var(--ui-white) !important; color: var(--ui-ink) !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-button, html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-app-more > summary, html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-app-menu-item { border-color: transparent !important; background: transparent !important; color: rgba(255, 255, 255, 0.72) !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-button--primary { border-color: var(--ui-lime) !important; background: var(--ui-lime) !important; color: var(--ui-green) !important; } @media (max-width: 900px) { html.ops-ui.field-theme body.page-workspace .dr-workspace-shell { grid-template-columns: minmax(0, 1fr) !important; } html.ops-ui.field-theme body.page-workspace .dr-workspace-shell > .dr-client-sidebar, html.ops-ui.field-theme body.page-workspace .dr-workspace-shell > .dr-workspace-main, html.ops-ui.field-theme body.page-workspace .dr-workspace-shell > [data-dr-empty-client] { grid-column: 1 !important; grid-row: auto !important; } html.ops-ui.field-theme body.page-workspace .dr-workspace-shell > .dr-client-sidebar { position: fixed !important; top: 72px !important; width: min(90vw, 360px) !important; max-height: calc(100vh - 72px) !important; overflow-y: auto !important; } } @media (max-width: 560px) { html.ops-ui.field-theme body.page-workspace .dr-workspace-shell > .dr-client-sidebar { top: 64px !important; max-height: calc(100vh - 64px) !important; } } /**/ html.ops-ui.field-theme body.page-workspace .dr-global-sidebar [data-dr-shell-brand-name] { color: var(--ui-white) !important; } html.ops-ui.field-theme body.page-workspace .text-brand-gold, html.ops-ui.field-theme body.page-workspace [class*="text-brand-gold/"] { color: var(--ui-violet) !important; } html.ops-ui.field-theme body.page-workspace .border-brand-gold, html.ops-ui.field-theme body.page-workspace [class*="border-brand-gold/"] { border-color: #cfc9f5 !important; } html.ops-ui.field-theme body.page-workspace .bg-brand-gold, html.ops-ui.field-theme body.page-workspace [class*="bg-brand-gold/"] { background-color: var(--ui-violet-soft) !important; } /**/ html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-upload-inbox__count { background: var(--ui-lime) !important; color: var(--ui-green) !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-upload-inbox__tally { color: var(--ui-lime) !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-upload-inbox__count[data-kind="reports"] { background: transparent !important; border-color: var(--ui-lime) !important; color: var(--ui-lime) !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-upload-inbox__heading { color: rgba(255, 255, 255, 0.55) !important; border-color: rgba(255, 255, 255, 0.14) !important; } html.ops-ui.field-theme body.page-workspace .dr-client-upload-badge { border-color: #cfc9f5 !important; background: var(--ui-violet-soft) !important; color: var(--ui-violet) !important; } html.ops-ui.field-theme body.page-workspace .dr-client-row--has-uploads { border-color: #cfc9f5 !important; } html.ops-ui.field-theme body.page-workspace [data-dr-client-id][aria-pressed="true"], html.ops-ui.field-theme body.page-workspace [data-dr-client-id][aria-current="true"] { border-color: #cfc9f5 !important; background: var(--ui-violet-soft) !important; box-shadow: inset 3px 0 0 var(--ui-violet) !important; } html.ops-ui.field-theme body.page-workspace .dr-client-list button { border-color: var(--ui-line-soft) !important; background: var(--ui-white) !important; color: var(--ui-ink) !important; } html.ops-ui.field-theme body.page-workspace .dr-client-list button[aria-pressed="true"] { border-color: #cfc9f5 !important; background: var(--ui-violet-soft) !important; } html.ops-ui.field-theme body.page-workspace [class*="text-white/"] { color: var(--ui-muted) !important; } html.ops-ui.field-theme body.page-workspace [class*="bg-white/"] { background-color: var(--ui-white) !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-app-actions { flex-wrap: nowrap !important; } @media (max-width: 900px) { html.ops-ui.field-theme body.page-workspace .dr-workspace-shell > .dr-client-sidebar { right: 0 !important; bottom: 0 !important; left: auto !important; transform: translateX(105%) !important; } html.ops-ui.field-theme body.page-workspace .dr-workspace-shell > .dr-client-sidebar.is-open { transform: translateX(0) !important; } } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar [data-dr-shell-brand-tagline] { color: rgba(255, 255, 255, 0.58) !important; } @media (min-width: 901px) and (max-height: 820px) { html.ops-ui body.page-login .auth-shell { padding: 24px 0; } html.ops-ui body.page-login .auth-context, html.ops-ui body.page-login .auth-panel { min-height: 640px; } html.ops-ui body.page-login .auth-context { padding: 32px !important; } html.ops-ui body.page-login .auth-context h1, html.ops-ui body.page-login .auth-context h2 { font-size: 40px !important; } html.ops-ui body.page-login .auth-steps { margin-top: 20px; } html.ops-ui body.page-login .auth-context__foot { padding-top: 14px; } html.ops-ui body.page-login .auth-panel { padding: 42px !important; } } @media (max-width: 560px) { html.ops-ui body.page-login .auth-steps { display: none; } } @media (max-width: 560px) { html.ops-ui body.page-login .auth-context > div > p:not(.ui-eyebrow) { display: none; } } /**/ html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow { width: 100% !important; min-width: 0 !important; min-height: 44px !important; margin: 0 0 4px; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow > summary { display: flex; width: 100%; min-height: 44px; align-items: center; gap: 11px; padding: 0 12px; border: 0 !important; border-radius: 10px; background: transparent !important; color: rgba(255, 255, 255, 0.72) !important; cursor: pointer; font-size: 12px; font-weight: 600; list-style: none; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow > summary::-webkit-details-marker { display: none; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow > summary:hover, html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow[open] > summary { background: rgba(255, 255, 255, 0.09) !important; color: var(--ui-white) !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow > summary:focus-visible { outline: 2px solid var(--ui-lime) !important; outline-offset: -2px !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__current { max-width: 64px; margin-left: auto; overflow: hidden; /**/ color: rgba(255, 255, 255, 0.72) !important; font: 500 8px "IBM Plex Mono", monospace; letter-spacing: 0.04em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__caret { margin-left: 2px; transition: transform 160ms ease; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow[open] .dr-sidebar-workflow__caret { transform: rotate(180deg); } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__menu { display: grid; gap: 2px; margin: 4px 0 7px 10px; padding: 5px; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 10px; background: rgba(255, 255, 255, 0.05); } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item { display: flex !important; width: 100% !important; min-width: 0 !important; min-height: 36px !important; align-items: center; justify-content: flex-start; gap: 9px; padding: 0 9px; border: 0 !important; border-radius: 8px; background: transparent !important; color: rgba(255, 255, 255, 0.64) !important; box-shadow: none !important; cursor: pointer; font-size: 11px; font-weight: 600; line-height: 1.2; text-align: left; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item > * { color: inherit !important; } /**/ html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item[data-dr-section="profile"] { position: relative; margin-top: 10px; padding-top: 9px; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item[data-dr-section="profile"]::before { content: ""; position: absolute; top: 0; left: 9px; right: 9px; border-top: 1px solid rgba(255, 255, 255, 0.12); } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item:hover:not(:disabled), html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item:focus-visible { background: rgba(255, 255, 255, 0.08) !important; color: var(--ui-white) !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item.is-active, html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item[aria-current="page"] { background: rgba(255, 255, 255, 0.12) !important; color: var(--ui-white) !important; box-shadow: inset 2px 0 0 var(--ui-lime) !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item[aria-current="page"] > i { color: var(--ui-lime) !important; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item:disabled { opacity: 0.38; cursor: not-allowed; } html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item .dr-required-mark { margin-left: auto; color: #ffd37d !important; } @media (max-width: 900px) { html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item { min-height: 42px !important; font-size: 12px; } } @media (prefers-reduced-motion: reduce) { html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__caret { transition: none !important; } } /**/ .page-workspace .dr-client-header { padding: 18px !important; } .page-workspace .dr-client-header__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; } .page-workspace .dr-client-header__identity { min-width: 0; } .page-workspace .dr-client-header__identity .dr-section-kicker { margin-bottom: 3px; } .page-workspace .dr-client-header__identity .dr-client-title { font-size: clamp(22px, 2.5vw, 30px) !important; } .page-workspace .dr-client-meta-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; } .page-workspace .dr-client-meta-strip > span { display: inline-flex; min-height: 24px; align-items: center; padding: 3px 9px; border: 1px solid var(--ui-line-soft); border-radius: 999px; background: #f7f9f7; color: var(--ui-muted); font-size: 11px; font-weight: 650; line-height: 1.2; white-space: nowrap; } .page-workspace .dr-client-meta-strip .dr-client-status-chip { border-color: #b9ddce; background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-client-meta-strip .dr-evidence-completeness { border-color: #d8d3f4; background: var(--ui-violet-soft); color: #51478f; } .page-workspace .dr-client-meta-strip .dr-save-chip:not(.dr-save-chip--visible) { display: none; } .page-workspace .dr-client-primary-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 7px; } .page-workspace .dr-client-primary-actions .dr-button { min-height: 38px; } .page-workspace .dr-client-more { position: relative; } .page-workspace .dr-client-more > summary { list-style: none; cursor: pointer; } .page-workspace .dr-client-more > summary::-webkit-details-marker { display: none; } .page-workspace .dr-client-more__panel { position: absolute; z-index: 40; top: calc(100% + 8px); right: 0; display: grid; width: min(260px, calc(100vw - 36px)); gap: 5px; padding: 8px; border: 1px solid var(--ui-line); border-radius: 12px; background: #fff; box-shadow: 0 18px 42px rgba(24, 36, 29, 0.16); } .page-workspace .dr-client-more__item { width: 100%; justify-content: flex-start; } .page-workspace .dr-client-workspace-nav { margin-top: 16px; padding-top: 0; border-top: 0; } .page-workspace .dr-client-workspace-nav .dr-workspace-tabs { width: 100%; } .page-workspace .dr-client-workspace-nav .dr-workspace-tab { flex: 1 0 auto; justify-content: center; } .page-workspace .dr-workspace-tab .dr-required-mark, .page-workspace .dr-sidebar-workflow__item .dr-required-mark { color: #c9493d; font-size: 14px; font-weight: 800; } .page-workspace .dr-workspace-tab[aria-selected="true"] .dr-required-mark { color: #fff; } .page-workspace .dr-destination-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 14px; padding: 4px 2px; } .page-workspace .dr-destination-intro h2 { margin: 2px 0 0; color: var(--ui-ink); font-size: clamp(22px, 2.6vw, 30px); font-weight: 750; letter-spacing: -0.035em; } .page-workspace .dr-destination-intro p:last-child { max-width: 600px; margin: 0; color: var(--ui-muted); font-size: 13px; } @media (max-width: 920px) { .page-workspace .dr-client-header__top { flex-direction: column; } .page-workspace .dr-client-primary-actions { width: 100%; flex-wrap: wrap; } } @media (max-width: 640px) { .page-workspace .dr-client-header { padding: 14px !important; } .page-workspace .dr-client-primary-actions > .dr-button:first-child { flex: 1 1 100%; } .page-workspace .dr-client-primary-actions > .dr-button:not(:first-child), .page-workspace .dr-client-primary-actions > .dr-client-more { flex: 1 1 0; } .page-workspace .dr-client-primary-actions > .dr-client-more > summary { width: 100%; justify-content: center; } .page-workspace .dr-client-workspace-nav .dr-workspace-tabs { scrollbar-width: thin; } .page-workspace .dr-client-workspace-nav .dr-workspace-tab { min-width: max-content; flex: 0 0 auto; } .page-workspace .dr-destination-intro { display: block; } .page-workspace .dr-destination-intro p:last-child { margin-top: 6px; } } /**/ .page-workspace .dr-overview-dashboard, .page-workspace [data-dr-overview] { min-width: 0; } .page-workspace .dr-overview-dashboard { display: grid; gap: var(--dr-space-gap, 14px); } .page-workspace [data-dr-overview] { display: grid; gap: 14px; } /**/ .page-workspace .dr-overview2-vitals { padding: clamp(18px, 2.5vw, 26px) !important; overflow: hidden; border-color: #d8ddd9 !important; background: linear-gradient(135deg, rgba(243, 248, 246, 0.88), rgba(255, 255, 255, 0.96) 45%, rgba(247, 244, 251, 0.86)) !important; } .page-workspace .dr-overview2-vitals__header { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 16px; } .page-workspace .dr-overview2-vitals__header .dr-kicker, .page-workspace .dr-overview2-vital__heading .dr-kicker { margin: 0 0 5px; color: var(--ui-violet); } .page-workspace .dr-overview2-vitals__header h2 { margin: 0; color: var(--ui-ink); font-size: clamp(20px, 2.4vw, 27px); font-weight: 760; letter-spacing: -0.03em; line-height: 1.12; } .page-workspace .dr-overview2-vitals__header > p { max-width: 52ch; margin: 0; color: var(--ui-muted); font-size: 12px; line-height: 1.5; text-align: right; } .page-workspace .dr-overview2-vitals__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .page-workspace .dr-overview2-vital { display: grid; min-width: 0; align-content: start; gap: 12px; padding: clamp(16px, 2vw, 20px); border: 1px solid var(--ui-line); border-radius: 14px; background: rgba(255, 255, 255, 0.86); box-shadow: 0 12px 30px rgba(41, 53, 46, 0.055); } .page-workspace .dr-overview2-vital__heading { display: flex; min-width: 0; align-items: start; justify-content: space-between; gap: 12px; } .page-workspace .dr-overview2-vital__heading h3 { margin: 0; color: var(--ui-ink); font-size: 17px; font-weight: 750; letter-spacing: -0.02em; line-height: 1.2; } .page-workspace .dr-overview2-vital__reading { display: grid; flex: 0 0 auto; text-align: right; } .page-workspace .dr-overview2-vital__reading strong { color: var(--ui-ink); font-family: 'IBM Plex Mono', monospace; font-size: 22px; line-height: 1; } .page-workspace .dr-overview2-vital__reading span, .page-workspace .dr-overview2-vital__note { color: var(--ui-muted); font-size: 10px; } .page-workspace .dr-overview2-sparkline { display: block; width: 100%; min-height: 118px; overflow: visible; } .page-workspace .dr-overview2-sparkline__axis { stroke: #d9dfdb; stroke-width: 1; } .page-workspace .dr-overview2-sparkline__area { fill: rgba(114, 55, 175, 0.09); } .page-workspace .dr-overview2-sparkline__line { fill: none; stroke: var(--ui-violet); stroke-linecap: round; stroke-linejoin: round; stroke-width: 3; } .page-workspace .dr-overview2-sparkline__point { fill: #fff; stroke: var(--ui-violet); stroke-width: 2.5; } .page-workspace .dr-overview2-sparkline__target { stroke: #607169; stroke-dasharray: 5 5; stroke-width: 1.5; } .page-workspace .dr-overview2-sparkline__target-label, .page-workspace .dr-overview2-sparkline__date { fill: #66736c; font-family: 'IBM Plex Mono', monospace; font-size: 9px; } .page-workspace .dr-overview2-vital__note { margin: 0; line-height: 1.45; } .page-workspace .dr-overview2-vital__state { display: grid; grid-template-columns: auto auto; align-items: center; gap: 3px 6px; color: var(--ui-muted); font-size: 9px; line-height: 1.2; } .page-workspace .dr-overview2-state-dot { width: 7px; height: 7px; border-radius: 999px; } .page-workspace .dr-overview2-state-dot--stable { background: #4d8068; } .page-workspace .dr-overview2-state-dot--flagged { background: #b4602a; } .page-workspace .dr-overview2-zone-bar { display: flex; min-height: 34px; overflow: hidden; border: 4px solid #eef1ef; border-radius: 999px; background: #eef1ef; } .page-workspace .dr-overview2-zone-bar__segment { position: relative; display: block; /**/ flex: 1 1 0; min-width: 22px; border-right: 2px solid #fff; } .page-workspace .dr-overview2-zone-bar__segment:last-child { border-right: 0; } .page-workspace .dr-overview2-zone-bar__segment--z1 { background: #d6e6dd; } .page-workspace .dr-overview2-zone-bar__segment--z2 { background: #accdbb; } .page-workspace .dr-overview2-zone-bar__segment--z3 { background: #7fb595; } .page-workspace .dr-overview2-zone-bar__segment--z4 { background: #8e82ba; } .page-workspace .dr-overview2-zone-bar__segment--z5 { background: #b66e9e; } .page-workspace .dr-overview2-zone-bar__segment--z6 { background: #c45f63; } .page-workspace .dr-overview2-zone-bar__segment.is-flagged { box-shadow: inset 0 -5px 0 #9c4d1f; } .page-workspace .dr-overview2-zone-bar__segment.is-empty { background: #e4e9e6; box-shadow: none; } .page-workspace .dr-overview2-zone-bar__segment > i { position: absolute; top: 50%; left: 50%; color: #6f3015; font-size: 15px; filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.85)); transform: translate(-50%, -50%); } .page-workspace .dr-overview2-zone-caption { margin: 0; color: var(--ui-muted); font-size: 11px; line-height: 1.5; } .page-workspace .dr-overview2-zone-caption strong { color: var(--ui-ink); font-weight: 650; } .page-workspace .dr-overview2-zone-legend { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 5px; } .page-workspace .dr-overview2-zone-legend > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1px 4px; padding: 7px; border: 1px solid var(--ui-line-soft); border-radius: 8px; background: #fafbfa; } .page-workspace .dr-overview2-zone-legend > div.is-empty { opacity: 0.52; } .page-workspace .dr-overview2-zone-legend strong { color: var(--ui-ink); font-size: 10px; } .page-workspace .dr-overview2-zone-legend span { grid-column: 1 / -1; color: var(--ui-ink); font-family: 'IBM Plex Mono', monospace; font-size: 9px; } /**/ .page-workspace .dr-overview2-zone-legend .dr-overview2-zone-legend__range { color: var(--ui-muted); font-size: 8px; letter-spacing: 0.01em; } .page-workspace .dr-overview2-zone-legend i { color: #4d8068; font-size: 11px; } .page-workspace .dr-overview2-zone-legend .ph-minus-circle { color: var(--ui-muted); } .page-workspace .dr-overview2-zone-legend .ph-warning-circle { color: #9c4d1f; } .page-workspace .dr-overview2-vital__summary { margin: 0; padding-top: 10px; border-top: 1px solid var(--ui-line-soft); color: var(--ui-ink); font-size: 12px; font-weight: 650; line-height: 1.45; } .page-workspace .dr-overview2-vitals__empty { display: flex; min-height: 94px; align-items: center; gap: 10px; padding: 14px; border: 1px dashed #cad2cd; border-radius: 10px; color: var(--ui-muted); background: rgba(247, 249, 248, 0.75); } .page-workspace .dr-overview2-vitals__empty i { color: var(--ui-violet); font-size: 20px; } .page-workspace .dr-overview2-vitals__empty p { margin: 0; font-size: 11px; line-height: 1.45; } /**/ .page-workspace .dr-overview2-highlight { overflow: hidden; } /**/ .page-workspace .dr-overview2-highlight__status { margin: 0; } .page-workspace .dr-overview2-highlight__layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(230px, 0.42fr); align-items: stretch; gap: clamp(18px, 3vw, 30px); } .page-workspace .dr-overview2-highlight__layout > :only-child { grid-column: 1 / -1; max-width: 900px; } .page-workspace .dr-overview2-highlight__main { display: grid; align-content: start; gap: 18px; min-width: 0; } /**/ .page-workspace .dr-overview2-highlight__meta { display: flex; flex-wrap: wrap; gap: 8px; } .page-workspace .dr-overview2-highlight__meta span { display: inline-flex; min-height: 30px; align-items: center; gap: 7px; padding: 5px 10px; border: 1px solid var(--ui-line-soft); border-radius: 999px; background: rgba(255, 255, 255, 0.78); color: var(--ui-ink); font-size: 12px; font-weight: 700; } .page-workspace .dr-overview2-highlight__meta i { color: var(--ui-violet); } .page-workspace .dr-overview2-highlight__evidence { max-width: 860px; } .page-workspace .dr-overview2-highlight__empty { max-width: 60ch; margin: 0; color: var(--ui-muted); font-size: 14px; line-height: 1.5; } .page-workspace .dr-overview2-highlight__takeaway { max-width: 72ch; margin: 0; color: var(--ui-ink); font-size: clamp(15px, 1.7vw, 18px); font-weight: 620; letter-spacing: -0.012em; line-height: 1.5; } .page-workspace .dr-overview2-evidence-card { display: grid; max-width: 660px; gap: 5px; padding: 14px 16px; border: 1px solid var(--ui-line-soft); border-left: 3px solid var(--ui-violet); border-radius: 10px; background: rgba(255, 255, 255, 0.76); } .page-workspace .dr-overview2-evidence-card > span { color: var(--ui-muted); font-size: 9px; font-weight: 800; letter-spacing: 0.075em; text-transform: uppercase; } .page-workspace .dr-overview2-evidence-card > strong { color: var(--ui-ink); font-size: 13px; line-height: 1.35; } .page-workspace .dr-overview2-evidence-card > p { margin: 2px 0 0; color: var(--ui-muted); font-size: 12px; line-height: 1.45; } .page-workspace .dr-overview2-progress-helper { display: grid; grid-template-columns: auto minmax(0, 1fr); align-content: center; gap: 12px; padding: 18px; border: 1px solid #d8d0e4; border-radius: 12px; background: rgba(248, 245, 252, 0.82); } .page-workspace .dr-overview2-progress-helper > i { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 10px; background: #fff; color: var(--ui-violet); box-shadow: 0 4px 14px rgba(51, 38, 64, 0.09); } .page-workspace .dr-overview2-progress-helper strong { display: block; color: var(--ui-ink); font-size: 14px; line-height: 1.3; } .page-workspace .dr-overview2-progress-helper p { margin: 6px 0 10px; color: var(--ui-muted); font-size: 12px; line-height: 1.45; } .page-workspace .dr-overview2-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; } .page-workspace .dr-overview2-cta .dr-button--primary { min-height: 44px; padding-inline: 20px; font-size: 14px; } .page-workspace .dr-overview2-cta__secondary { display: flex; flex-wrap: wrap; gap: 6px; } .page-workspace .dr-overview2-cta__secondary .dr-button { font-size: 12px; } .page-workspace .dr-overview2-section-heading h2 { margin: 0; color: var(--ui-ink); font-size: 20px; font-weight: 750; letter-spacing: -0.025em; line-height: 1.15; } /**/ .page-workspace .dr-overview2-copy { margin: 0; color: var(--ui-muted); font-size: 12px; line-height: 1.45; } /**/ .page-workspace .dr-overview2-panel { min-width: 0; padding: 0 !important; overflow: hidden; } .page-workspace .dr-overview2-panel__summary { display: flex; min-width: 0; align-items: baseline; gap: 6px 12px; padding: 14px 18px; cursor: pointer; list-style: none; } .page-workspace .dr-overview2-panel__summary::-webkit-details-marker { display: none; } .page-workspace .dr-overview2-panel__summary:hover { background: var(--ui-surface-soft, rgba(0, 0, 0, 0.02)); } .page-workspace .dr-overview2-panel__summary:focus-visible { outline: 2px solid var(--ui-violet); outline-offset: -2px; } .page-workspace .dr-overview2-panel__title { flex: 0 0 auto; } .page-workspace .dr-overview2-panel__state { flex: 1 1 auto; min-width: 0; color: var(--ui-muted); font-size: 13px; line-height: 1.4; } .page-workspace .dr-overview2-panel__summary > i { flex: 0 0 auto; align-self: center; color: var(--ui-muted); transition: transform 140ms ease; } .page-workspace .dr-overview2-panel[open] .dr-overview2-panel__summary > i { transform: rotate(180deg); } .page-workspace .dr-overview2-panel__body { display: grid; gap: 12px; padding: 0 18px 18px; border-top: 1px solid var(--ui-line-soft); padding-top: 14px; } /**/ .page-workspace .dr-overview2-collapse > summary > header { display: contents; } .page-workspace .dr-overview2-collapse > summary h2 { flex: 0 0 auto; } .page-workspace .dr-overview2-collapse > summary header p:not(.dr-kicker) { flex: 1 1 auto; min-width: 0; margin: 0; color: var(--ui-muted); } /**/ .page-workspace .dr-overview2-collapse > summary h2, .page-workspace .dr-overview2-panel__title { margin: 0; color: var(--ui-ink); font-size: clamp(18px, 1.9vw, 24px); font-weight: 790; letter-spacing: -0.035em; line-height: 1.1; } /**/ .page-workspace .dr-overview2-collapse > summary header p:not(.dr-kicker), .page-workspace .dr-overview2-panel__state { font-size: 13px; line-height: 1.4; } /**/ .page-workspace .dr-overview2-collapse > summary .dr-kicker { display: none; } .page-workspace .dr-overview2-evidence-review { border-left: 4px solid var(--ui-violet) !important; } .page-workspace .dr-overview2-evidence-review[open] { box-shadow: 0 14px 34px rgba(42, 35, 49, 0.08) !important; } .page-workspace .dr-overview2-evidence-review__intro { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; } .page-workspace .dr-overview2-evidence-review__intro strong { color: var(--ui-ink); font-size: 14px; } .page-workspace .dr-overview2-evidence-review__intro p { max-width: 66ch; margin: 0; color: var(--ui-muted); font-size: 11px; line-height: 1.45; } .page-workspace .dr-overview2-panel__body > .dr-button { justify-self: start; } .page-workspace .dr-overview2-guide { margin: 2px 0 0; color: var(--ui-muted); font-size: 12px; } .page-workspace .dr-overview2-guide__link { margin-left: 6px; border: 0; background: none; color: var(--ui-violet); font: inherit; font-weight: 650; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; } .page-workspace .dr-overview2-section-heading { display: flex; min-width: 0; align-items: flex-start; justify-content: space-between; gap: 12px; } /**/ /**/ .page-workspace #client-workspace-title { font-size: clamp(20px, 2.2vw, 26px) !important; } .page-workspace .dr-client-title__label { color: var(--ui-muted); font-weight: 500; /**/ white-space: nowrap; } /**/ .page-workspace .dr-client-title__name { color: var(--ui-ink); } /**/ .page-workspace .dr-overview2-technical__list { display: grid; gap: 7px; } .page-workspace .dr-overview2-evidence-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px; border: 1px solid var(--ui-line-soft); border-radius: 10px; background: #fafbfa; } .page-workspace .dr-overview2-evidence-row__number { min-width: 68px; padding: 5px 7px; border-radius: 7px; background: var(--ui-violet-soft); color: var(--ui-violet); text-align: center; font-size: 9px; font-weight: 850; letter-spacing: 0.07em; text-transform: uppercase; } .page-workspace .dr-overview2-evidence-row__body { min-width: 0; } .page-workspace .dr-overview2-evidence-row .dr-overview2-evidence-row__body { min-width: 0; } /**/ .page-workspace .dr-overview2-evidence-row__body h3 { margin: 0; color: var(--ui-muted); font-size: 13px; } .page-workspace .dr-overview2-evidence-row__body h3 strong { color: var(--ui-ink); } .page-workspace .dr-overview2-evidence-row__body p { margin: 3px 0; color: var(--ui-muted); font-size: 11px; line-height: 1.4; } .page-workspace .dr-overview2-evidence-row__body span { color: #7d6a44; font-family: 'IBM Plex Mono', monospace; font-size: 9px; } .page-workspace .dr-overview2-ride-list { display: grid; gap: 5px; } .page-workspace .dr-overview2-ride-row { display: grid; grid-template-columns: minmax(150px, 1.25fr) minmax(180px, 1fr) auto auto; align-items: center; gap: 10px; min-width: 0; padding: 9px 0; border-bottom: 1px solid var(--ui-line-soft); } .page-workspace .dr-overview2-ride-row:last-child { border-bottom: 0; } .page-workspace .dr-overview2-ride-row__identity { display: grid; min-width: 0; gap: 2px; } .page-workspace .dr-overview2-ride-row__identity strong { overflow: hidden; color: var(--ui-ink); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-overview2-ride-row__identity span, .page-workspace .dr-overview2-ride-row__status { overflow: hidden; color: var(--ui-muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-overview2-ride-row__values { display: flex; min-width: 0; flex-wrap: wrap; gap: 4px; } .page-workspace .dr-overview2-ride-row__values span { padding: 3px 6px; border-radius: 6px; background: #f0f2f0; color: #4e5a53; font-family: 'IBM Plex Mono', monospace; font-size: 9px; } .page-workspace .dr-overview2-ride-row .dr-button { min-height: 32px; padding: 6px 9px; } @media (max-width: 1100px) { .page-workspace .dr-overview2-vitals__grid { grid-template-columns: 1fr; } } @media (max-width: 760px) { .page-workspace .dr-overview2-vitals__header { align-items: start; flex-direction: column; } .page-workspace .dr-overview2-vitals__header > p { max-width: none; text-align: left; } .page-workspace .dr-overview2-zone-legend { grid-template-columns: repeat(3, minmax(0, 1fr)); } .page-workspace .dr-overview2-evidence-review__intro { align-items: start; flex-direction: column; gap: 4px; } .page-workspace .dr-overview2-highlight__layout { grid-template-columns: 1fr; } .page-workspace .dr-overview2-evidence-row { grid-template-columns: 1fr; } .page-workspace .dr-overview2-evidence-row__number { justify-self: start; } .page-workspace .dr-overview2-ride-row { grid-template-columns: minmax(0, 1fr) auto; } .page-workspace .dr-overview2-ride-row__values, .page-workspace .dr-overview2-ride-row__status { grid-column: 1 / -1; } .page-workspace .dr-overview2-cta__secondary { width: 100%; } } @media (max-width: 480px) { .page-workspace .dr-overview2-vital__heading { align-items: start; flex-direction: column; } .page-workspace .dr-overview2-zone-legend { grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-overview2-panel__summary { flex-wrap: wrap; padding: 12px 14px; } .page-workspace .dr-overview2-panel__body { padding: 12px 14px 14px; } .page-workspace .dr-overview2-cta .dr-button--primary { width: 100%; justify-content: center; } .page-workspace .dr-overview2-section-heading { display: grid; } } /**/ .page-workspace .dr-rides-manager { min-width: 0; } .page-workspace .dr-rides3-shell { position: relative; min-width: 0; padding: 18px !important; overflow: visible !important; } .page-workspace .dr-rides3-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding-bottom: 16px; border-bottom: 1px solid var(--ui-line-soft); } .page-workspace .dr-rides3-header__copy { min-width: 0; max-width: 660px; } .page-workspace .dr-rides3-titleline { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; } .page-workspace .dr-rides3-titleline h2 { margin: 0; color: var(--ui-ink); font-size: 20px; line-height: 1.2; } .page-workspace .dr-rides3-titleline > span { padding: 3px 7px; border: 1px solid var(--ui-line); border-radius: 999px; background: #f4f6f4; color: var(--ui-muted); font-family: 'IBM Plex Mono', monospace; font-size: 9px; font-weight: 700; } .page-workspace .dr-rides3-header__copy > p:last-child { margin: 6px 0 0; color: var(--ui-muted); font-size: 11px; line-height: 1.5; } .page-workspace .dr-rides3-header__actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 7px; } .page-workspace .dr-rides3-header__actions .dr-baseline-reminder { flex-basis: 100%; } .page-workspace .dr-rides3-header__actions .dr-button { min-height: 34px; padding: 7px 10px; white-space: nowrap; } .page-workspace .dr-rides3-import { cursor: pointer; } /**/ .page-workspace .dr-rides3-bulk { display: flex; align-items: center; gap: 7px; } .page-workspace .dr-rides3-bulk .dr-button { min-height: 34px; padding: 7px 10px; white-space: nowrap; } .page-workspace .dr-rides3-filters { display: grid; grid-template-columns: minmax(160px, 1.25fr) minmax(210px, 1.25fr) minmax(135px, 0.9fr) minmax(112px, 0.7fr) minmax(112px, 0.7fr) auto; align-items: end; gap: 9px; padding: 13px 0; border-bottom: 1px solid var(--ui-line-soft); } .page-workspace .dr-rides3-filter, .page-workspace .dr-rides3-date-range { display: grid; min-width: 0; gap: 5px; margin: 0; padding: 0; border: 0; } .page-workspace .dr-rides3-filter > span, .page-workspace .dr-rides3-date-range > legend { color: var(--ui-muted); font-size: 8px; font-weight: 750; letter-spacing: 0.08em; line-height: 1; text-transform: uppercase; } /**/ .page-workspace .dr-rides3-date-range > legend { float: left; width: 100%; margin: 0; padding: 0; } .page-workspace .dr-rides3-filter input, .page-workspace .dr-rides3-filter select, .page-workspace .dr-rides3-date-range input { width: 100%; min-width: 0; height: 34px; padding: 6px 8px; border: 1px solid var(--ui-line); border-radius: 7px; background: #fff; color: var(--ui-ink); font-size: 10px; outline: none; } .page-workspace .dr-rides3-filter input:focus, .page-workspace .dr-rides3-filter select:focus, .page-workspace .dr-rides3-date-range input:focus { border-color: var(--ui-accent); box-shadow: 0 0 0 2px rgba(23, 90, 62, 0.12); } .page-workspace .dr-rides3-search { position: relative; } .page-workspace .dr-rides3-search > i { position: absolute; top: 50%; left: 9px; z-index: 1; color: var(--ui-muted); font-size: 13px; transform: translateY(-50%); pointer-events: none; } .page-workspace .dr-rides3-search input { padding-left: 28px; } .page-workspace .dr-rides3-date-range > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; } .page-workspace .dr-rides3-date-range label { position: relative; min-width: 0; } .page-workspace .dr-rides3-date-range label > span { position: absolute; top: 50%; left: 7px; z-index: 1; color: var(--ui-muted); font-size: 7px; font-weight: 750; text-transform: uppercase; transform: translateY(-50%); pointer-events: none; } .page-workspace .dr-rides3-date-range input { padding-left: 30px; font-size: 8px; } .page-workspace .dr-rides3-flagged { display: flex; align-items: center; gap: 6px; min-height: 34px; padding: 6px 9px; border: 1px solid var(--ui-line); border-radius: 7px; background: #fff; color: var(--ui-muted); font-size: 9px; font-weight: 700; white-space: nowrap; } .page-workspace .dr-rides3-flagged input { accent-color: var(--ui-accent); } .page-workspace .dr-rides3-results { min-width: 0; } .page-workspace .dr-rides3-results__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 1px 7px; color: var(--ui-muted); font-family: 'IBM Plex Mono', monospace; font-size: 8px; font-weight: 650; letter-spacing: 0.03em; } .page-workspace .dr-rides3-table { min-width: 0; border: 1px solid var(--ui-line-soft); border-radius: 9px; background: #fff; } .page-workspace .dr-rides3-table__head, .page-workspace .dr-rides3-row { display: grid; grid-template-columns: 58px minmax(84px, 1.4fr) 46px 50px 48px 44px minmax(72px, 0.9fr) 68px 56px 72px 44px; align-items: center; gap: 7px; min-width: 0; } .page-workspace .dr-rides3-table__head { min-height: 31px; padding: 5px 9px; border-bottom: 1px solid var(--ui-line); border-radius: 9px 9px 0 0; background: #f4f6f4; color: var(--ui-muted); font-size: 7px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; } .page-workspace .dr-rides3-table__body { min-width: 0; } .page-workspace .dr-rides3-row { position: relative; min-height: 61px; padding: 7px 9px; border-bottom: 1px solid var(--ui-line-soft); transition: background-color 150ms ease; } .page-workspace .dr-rides3-row:last-child { border-bottom: 0; border-radius: 0 0 9px 9px; } .page-workspace .dr-rides3-row:hover { background: #fafbf9; } .page-workspace .dr-rides3-row--selected { box-shadow: inset 3px 0 0 var(--ui-accent); background: #f2f7f4; } .page-workspace .dr-rides3-cell { min-width: 0; color: var(--ui-ink); font-family: 'IBM Plex Mono', monospace; font-size: 8px; } .page-workspace .dr-rides3-cell__label { display: none; } .page-workspace .dr-rides3-cell__value { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-rides3-cell--ride { display: grid; gap: 2px; font-family: inherit; } .page-workspace .dr-rides3-cell--ride strong { overflow: hidden; color: var(--ui-ink); font-size: 10px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-rides3-ride-meta, .page-workspace .dr-rides3-evidence { display: block; overflow: hidden; color: var(--ui-muted); font-size: 7px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-rides3-table__head > .dr-rides3-head--center { text-align: center; } /**/ .page-workspace .dr-rides3-baseline-toggle, .page-workspace .dr-rides3-select-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 3px; width: 100%; padding: 2px 4px; border: 1px solid var(--ui-line); border-radius: 6px; background: #fff; color: var(--ui-muted); font-size: 6px; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; white-space: nowrap; cursor: pointer; transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease; } .page-workspace .dr-rides3-baseline-toggle__label, .page-workspace .dr-rides3-select-toggle__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; } .page-workspace .dr-rides3-baseline-toggle i, .page-workspace .dr-rides3-select-toggle i { flex: 0 0 auto; font-size: 10px; } .page-workspace .dr-rides3-baseline-toggle:hover:not(:disabled), .page-workspace .dr-rides3-select-toggle:hover:not(:disabled) { border-color: var(--ui-accent); color: var(--ui-accent); } .page-workspace .dr-rides3-baseline-toggle:focus-visible, .page-workspace .dr-rides3-select-toggle:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 1px; } .page-workspace .dr-rides3-baseline-toggle:disabled, .page-workspace .dr-rides3-select-toggle:disabled { cursor: not-allowed; opacity: 0.5; } /**/ .page-workspace .dr-rides3-baseline-toggle--active, .page-workspace .dr-rides3-select-toggle--active { border-color: var(--ui-accent); background: #e4eee8; color: var(--ui-accent); } .page-workspace .dr-rides3-baseline, .page-workspace .dr-rides3-before-baseline, .page-workspace .dr-rides3-selected { justify-self: start; padding: 1px 4px; border-radius: 999px; background: #e4eee8; color: var(--ui-accent); font-size: 6px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; } .page-workspace .dr-rides3-selected { background: #e9edf6; color: #425272; } /**/ .page-workspace .dr-rides3-before-baseline { background: #f0f0ef; color: #6b6b66; } .page-workspace .dr-rides3-cell--baseline, .page-workspace .dr-rides3-cell--select { display: grid; justify-items: stretch; min-width: 0; } .page-workspace .dr-rides3-cell--status { display: grid; gap: 3px; } .page-workspace .dr-rides3-status { display: inline-flex; align-items: center; justify-self: start; gap: 4px; padding: 2px 7px; border: 1px solid transparent; border-radius: 999px; background: #edf0ed; color: var(--ui-muted); font-family: inherit; font-size: 7px; font-weight: 750; white-space: nowrap; } /**/ .page-workspace .dr-rides3-status--success { background: #e4f1e8; color: #22613f; } /**/ .page-workspace .dr-rides3-status--warning { border-color: #d08320; background: #ffdfab; color: #6d3f04; font-weight: 850; } .page-workspace .dr-rides3-status--warning i { flex: 0 0 auto; color: #a55c08; font-size: 13px; } .page-workspace .dr-rides3-cell--open .dr-button, .page-workspace .dr-rides3-more > summary { min-height: 30px; padding: 5px 7px; font-size: 8px; } .page-workspace .dr-rides3-cell--open .dr-button { width: 100%; justify-content: center; gap: 0; overflow: hidden; text-align: center; white-space: nowrap; } .page-workspace .dr-rides3-cell--open .dr-button > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; } .page-workspace .dr-rides3-more { position: relative; } .page-workspace .dr-rides3-more > summary { display: inline-flex; width: 30px; align-items: center; justify-content: center; cursor: pointer; list-style: none; } .page-workspace .dr-rides3-more > summary::-webkit-details-marker { display: none; } .page-workspace .dr-rides3-more[open] { z-index: 30; } .page-workspace .dr-rides3-more__panel { position: absolute; top: calc(100% + 5px); right: 0; z-index: 40; display: grid; width: 210px; gap: 3px; padding: 6px; border: 1px solid var(--ui-line); border-radius: 9px; background: #fff; box-shadow: 0 14px 35px rgba(24, 36, 29, 0.17); } .page-workspace .dr-rides3-menu-item { width: 100%; min-height: 32px; justify-content: flex-start; border-color: transparent; background: transparent; color: var(--ui-ink); font-size: 9px; } .page-workspace .dr-rides3-menu-item:hover { background: #f2f5f2; } .page-workspace .dr-rides3-menu-item.dr-button--danger { color: var(--ui-danger); } .page-workspace .dr-rides3-load-more { display: flex; margin: 12px auto 0; } .page-workspace .dr-rides3-empty { display: grid; justify-items: center; gap: 8px; min-height: 230px; align-content: center; padding: 28px; text-align: center; } .page-workspace .dr-rides3-empty > i { color: var(--ui-muted); font-size: 28px; } .page-workspace .dr-rides3-empty h3, .page-workspace .dr-rides3-empty p { margin: 0; } .page-workspace .dr-rides3-empty h3 { color: var(--ui-ink); font-size: 14px; } .page-workspace .dr-rides3-empty p { max-width: 430px; color: var(--ui-muted); font-size: 10px; line-height: 1.5; } @media (max-width: 1400px) { .page-workspace .dr-rides3-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); } .page-workspace .dr-rides3-flagged { grid-column: auto; align-self: end; } } @media (max-width: 980px) { .page-workspace .dr-rides3-header { display: grid; } .page-workspace .dr-rides3-header__actions { justify-content: flex-start; } .page-workspace .dr-rides3-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-rides3-flagged { grid-column: auto; align-self: end; } .page-workspace .dr-rides3-table { border: 0; background: transparent; } .page-workspace .dr-rides3-table__head { display: none; } .page-workspace .dr-rides3-table__body { display: grid; gap: 8px; } .page-workspace .dr-rides3-row { grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 9px 12px; padding: 11px; border: 1px solid var(--ui-line-soft); border-radius: 9px; background: #fff; } .page-workspace .dr-rides3-row:last-child { border-bottom: 1px solid var(--ui-line-soft); border-radius: 9px; } .page-workspace .dr-rides3-cell__label { display: block; margin-bottom: 3px; color: var(--ui-muted); font-family: inherit; font-size: 6px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; } .page-workspace .dr-rides3-cell--date { grid-column: 4; grid-row: 1; text-align: right; } .page-workspace .dr-rides3-cell--ride { grid-column: 1 / 4; grid-row: 1; } .page-workspace .dr-rides3-cell--duration, .page-workspace .dr-rides3-cell--distance, .page-workspace .dr-rides3-cell--power, .page-workspace .dr-rides3-cell--hr { grid-row: 2; } .page-workspace .dr-rides3-cell--status { grid-column: 1 / 3; grid-row: 3; } /**/ .page-workspace .dr-rides3-cell--select { grid-column: 3; grid-row: 3; } .page-workspace .dr-rides3-cell--baseline { grid-column: 4; grid-row: 3; } /**/ .page-workspace .dr-rides3-cell--open { grid-column: 1 / 5; grid-row: 4; } .page-workspace .dr-rides3-cell--more { grid-column: 5; grid-row: 1 / 5; align-self: center; } } @media (max-width: 620px) { .page-workspace .dr-rides3-shell { padding: 14px !important; } .page-workspace .dr-rides3-header__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-rides3-header__actions .dr-button, .page-workspace .dr-rides3-header__actions .dr-rides3-import { width: 100%; justify-content: center; } .page-workspace .dr-rides3-header__actions [data-testid="rides-compare-selected"] { grid-column: 1 / -1; } /**/ .page-workspace .dr-rides3-header__actions .dr-rides3-bulk { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-rides3-bulk .dr-button { width: 100%; justify-content: center; } .page-workspace .dr-rides3-filters { grid-template-columns: 1fr; } .page-workspace .dr-rides3-flagged { width: 100%; } .page-workspace .dr-rides3-results__bar { align-items: flex-start; flex-direction: column; gap: 3px; } .page-workspace .dr-rides3-row { grid-template-columns: repeat(2, minmax(0, 1fr)) auto; } .page-workspace .dr-rides3-cell--ride { grid-column: 1 / 3; } .page-workspace .dr-rides3-cell--date { grid-column: 1 / 3; grid-row: 2; text-align: left; } .page-workspace .dr-rides3-cell--duration, .page-workspace .dr-rides3-cell--distance { grid-row: 3; } .page-workspace .dr-rides3-cell--power, .page-workspace .dr-rides3-cell--hr { grid-row: 4; } .page-workspace .dr-rides3-cell--status { grid-column: 1 / 3; grid-row: 5; } .page-workspace .dr-rides3-cell--baseline { grid-column: 1 / 3; grid-row: 6; } .page-workspace .dr-rides3-cell--select { grid-column: 1 / 3; grid-row: 7; } .page-workspace .dr-rides3-cell--open { grid-column: 1 / 3; grid-row: 8; } .page-workspace .dr-rides3-cell--more { grid-column: 3; grid-row: 1 / 9; } .page-workspace .dr-rides3-more__panel { position: fixed; top: auto; right: 14px; bottom: 14px; left: 14px; width: auto; } } /**/ .page-workspace .dr-ride4-workspace { min-width: 0; container-type: inline-size; } .page-workspace .dr-ride4-detail { display: grid; min-width: 0; gap: 12px; } .page-workspace .dr-ride4-hero, .page-workspace .dr-ride4-summary, .page-workspace .dr-ride4-findings, .page-workspace .dr-ride4-profile { padding: 18px !important; } .page-workspace .dr-ride4-breadcrumb { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--ui-line-soft); } .page-workspace .dr-ride4-breadcrumb .dr-button { min-height: 32px; padding: 5px 8px; } .page-workspace .dr-ride4-breadcrumb > span { color: var(--ui-muted); font-family: 'IBM Plex Mono', monospace; font-size: 8px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; } .page-workspace .dr-ride4-hero__main { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; } .page-workspace .dr-ride4-identity { min-width: 0; } .page-workspace .dr-ride4-identity h2, .page-workspace .dr-ride4-section-head h2, .page-workspace .dr-ride4-profile__head h2, .page-workspace .dr-ride4-pedal-header h2 { margin: 2px 0 0; color: var(--ui-ink); font-size: clamp(20px, 2.4vw, 28px); font-weight: 760; letter-spacing: -0.035em; line-height: 1.1; } .page-workspace .dr-ride4-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; margin-top: 9px; } .page-workspace .dr-ride4-meta > span { display: inline-flex; min-height: 23px; align-items: center; padding: 3px 7px; border: 1px solid var(--ui-line-soft); border-radius: 999px; background: #f7f9f7; color: var(--ui-muted); font-size: 9px; font-weight: 680; } .page-workspace .dr-ride4-meta .dr-ride4-status--success { border-color: #b9ddce; background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-ride4-meta .dr-ride4-status--warning { border-color: #ead49d; background: #fff4d9; color: #7a5406; } .page-workspace .dr-ride4-meta .dr-ride4-status--danger { border-color: #ebc0bd; background: #fdebea; color: var(--ui-danger); } .page-workspace .dr-ride4-meta .dr-ride4-baseline { border-color: #d8d3f4; background: var(--ui-violet-soft); color: #51478f; } .page-workspace .dr-ride4-actions { display: flex; flex: 0 0 auto; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 7px; } .page-workspace .dr-ride4-actions .dr-button { min-height: 34px; padding: 7px 9px; white-space: nowrap; } .page-workspace .dr-ride4-stepper { display: flex; gap: 4px; } .page-workspace .dr-ride4-more { position: relative; } .page-workspace .dr-ride4-more > summary { list-style: none; cursor: pointer; } .page-workspace .dr-ride4-more > summary::-webkit-details-marker { display: none; } .page-workspace .dr-ride4-more[open] { z-index: 60; } .page-workspace .dr-ride4-more__panel { position: absolute; top: calc(100% + 6px); right: 0; z-index: 70; display: grid; width: 220px; gap: 3px; padding: 7px; border: 1px solid var(--ui-line); border-radius: 10px; background: #fff; box-shadow: 0 16px 38px rgba(24, 36, 29, 0.17); } .page-workspace .dr-ride4-menu-item { width: 100%; justify-content: flex-start; border-color: transparent !important; background: transparent !important; } .page-workspace .dr-ride4-menu-item:hover { background: #f2f5f2 !important; } .page-workspace .dr-ride4-menu-item.dr-button--danger { color: var(--ui-danger) !important; } .page-workspace .dr-ride4-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; } .page-workspace .dr-ride4-section-head > p { max-width: 430px; margin: 3px 0 0; color: var(--ui-muted); font-size: 10px; line-height: 1.5; } .page-workspace .dr-ride4-score { display: grid; min-width: 92px; justify-items: end; gap: 2px; } .page-workspace .dr-ride4-score span, .page-workspace .dr-ride4-metrics span, .page-workspace .dr-ride4-finding__meaning > span { color: var(--ui-muted); font-size: 7px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; } .page-workspace .dr-ride4-score strong { color: var(--ui-ink); font-family: 'IBM Plex Mono', monospace; font-size: 22px; } .page-workspace .dr-ride4-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 7px; margin-top: 14px; } .page-workspace .dr-ride4-metrics > div { display: grid; min-width: 0; gap: 4px; padding: 10px; border: 1px solid var(--ui-line-soft); border-radius: 8px; background: #f8faf8; } .page-workspace .dr-ride4-metrics strong { overflow: hidden; color: var(--ui-ink); font-family: 'IBM Plex Mono', monospace; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-ride4-evidence-strip { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; } .page-workspace .dr-ride4-evidence-strip span { padding: 3px 7px; border-radius: 999px; background: #eef2ef; color: var(--ui-muted); font-family: 'IBM Plex Mono', monospace; font-size: 7px; font-weight: 700; } .page-workspace .dr-ride4-finding-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 14px; } .page-workspace .dr-ride4-finding { display: grid; min-width: 0; align-content: start; gap: 8px; padding: 12px; border: 1px solid var(--ui-line-soft); border-top: 3px solid #7eaf91; border-radius: 9px; background: #fbfcfb; } .page-workspace .dr-ride4-finding--amber { border-top-color: #d79b28; } .page-workspace .dr-ride4-finding--red { border-top-color: #d25d53; } .page-workspace .dr-ride4-finding__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; } .page-workspace .dr-ride4-finding__top h3 { margin: 3px 0 0; color: var(--ui-ink); font-size: 11px; line-height: 1.25; } .page-workspace .dr-ride4-finding__severity, .page-workspace .dr-ride4-finding__confidence { color: var(--ui-muted); font-size: 7px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; } .page-workspace .dr-ride4-finding__confidence { flex: 0 0 auto; font-family: 'IBM Plex Mono', monospace; } .page-workspace .dr-ride4-finding__interval, .page-workspace .dr-ride4-finding__support, .page-workspace .dr-ride4-finding__meaning p { margin: 0; color: var(--ui-muted); font-size: 9px; line-height: 1.45; } .page-workspace .dr-ride4-finding__interval { font-family: 'IBM Plex Mono', monospace; font-size: 8px; font-weight: 700; } .page-workspace .dr-ride4-finding__meaning { display: grid; gap: 3px; } .page-workspace .dr-ride4-finding .dr-button { align-self: end; justify-self: start; min-height: 31px; margin-top: auto; padding: 5px 7px; font-size: 8px; } .page-workspace .dr-ride4-window { scroll-margin-top: 82px; } .page-workspace .dr-ride4-window .dr-icon-control-grid, .page-workspace .dr-ride4-window .dr-toggle-grid { gap: 6px !important; } .page-workspace .dr-ride4-window .dr-button { min-height: 32px; } .page-workspace .dr-ride4-profile { min-width: 0; scroll-margin-top: 82px; } .page-workspace .dr-ride4-profile__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; } .page-workspace .dr-ride4-profile__head > div:first-child { max-width: 520px; } .page-workspace .dr-ride4-profile__summary { margin: 6px 0 0; color: var(--ui-muted); font-size: 10px; line-height: 1.5; } .page-workspace .dr-ride4-profile__controls { display: flex; flex: 0 1 auto; align-items: flex-end; justify-content: flex-end; flex-wrap: wrap; gap: 7px; } .page-workspace .dr-ride4-profile .dr-profile-control-group { gap: 4px; } .page-workspace .dr-ride4-profile .dr-profile-series-buttons { gap: 3px; } .page-workspace .dr-ride4-profile .dr-profile-series-buttons .dr-button { min-height: 30px; gap: 5px; padding: 5px 7px; font-size: 7px; } /**/ .page-workspace .dr-ride4-profile .dr-series-swatch { width: 7px; height: 7px; } .page-workspace .dr-ride4-profile .dr-profile-overlay-legend { margin: 12px 0 8px; border-color: var(--ui-line-soft); background: #f7f9f7; } .page-workspace .dr-ride4-chart-wrap { min-width: 0; } .page-workspace .dr-ride4-profile .dr-chart-frame { min-height: 330px; border: 1px solid var(--ui-line-soft); border-radius: 9px; background: #fff; } .page-workspace .dr-ride4-chart-state, .page-workspace .dr-ride4-chart-error { display: grid; min-height: 180px; place-items: center; align-content: center; gap: 7px; padding: 22px; border: 1px dashed var(--ui-line); border-radius: 9px; color: var(--ui-muted); text-align: center; } .page-workspace .dr-ride4-chart-state strong { color: var(--ui-ink); font-size: 11px; } .page-workspace .dr-ride4-chart-state p { margin: 0; font-size: 9px; } .page-workspace .dr-ride4-chart-error { min-height: auto; margin-bottom: 8px; border-color: #ebc0bd; background: #fdebea; color: var(--ui-danger); font-size: 10px; } .page-workspace .dr-ride4-chart-error[hidden] { display: none; } .page-workspace .dr-ride4-chart-help { margin: 7px 0 0; color: var(--ui-muted); font-size: 8px; line-height: 1.4; } .page-workspace .dr-ride4-intervals { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--ui-line-soft); scroll-margin-top: 82px; } .page-workspace .dr-ride4-intervals h3 { margin: 2px 0 0; color: var(--ui-ink); font-size: 15px; } .page-workspace .dr-ride4-interval-count { padding: 3px 7px; border-radius: 999px; background: #eef2ef; color: var(--ui-muted); font-family: 'IBM Plex Mono', monospace; font-size: 8px; font-weight: 700; } .page-workspace .dr-ride4-interval-table { margin-top: 10px; border: 1px solid var(--ui-line-soft); border-radius: 9px; } .page-workspace .dr-ride4-interval-head, .page-workspace .dr-ride4-interval-row { display: grid; grid-template-columns: 82px minmax(105px, 1.2fr) 86px minmax(105px, 1fr) 104px; align-items: center; gap: 8px; } .page-workspace .dr-ride4-interval-head { min-height: 30px; padding: 5px 9px; border-bottom: 1px solid var(--ui-line); background: #f4f6f4; color: var(--ui-muted); font-size: 7px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; } .page-workspace .dr-ride4-interval-row { min-height: 54px; padding: 8px 9px; border-bottom: 1px solid var(--ui-line-soft); color: var(--ui-muted); font-size: 8px; line-height: 1.35; } .page-workspace .dr-ride4-interval-row:last-child { border-bottom: 0; } .page-workspace .dr-ride4-interval-row--selected { box-shadow: inset 3px 0 0 var(--ui-violet); background: var(--ui-violet-soft); } .page-workspace .dr-ride4-interval-row strong { color: var(--ui-ink); font-family: 'IBM Plex Mono', monospace; font-size: 8px; } .page-workspace .dr-ride4-cell-label { display: none; } .page-workspace .dr-ride4-severity { display: inline-flex; padding: 2px 5px; border-radius: 999px; background: #fff4d9; color: #7a5406; font-size: 7px; font-weight: 800; white-space: nowrap; } .page-workspace .dr-ride4-severity--danger { background: #fdebea; color: var(--ui-danger); } .page-workspace .dr-ride4-interval-row .dr-button { width: 100%; min-height: 30px; padding: 5px 6px; font-size: 7px; } .page-workspace .dr-ride4-interval-empty { display: grid; justify-items: center; gap: 5px; margin-top: 10px; padding: 22px; border: 1px dashed var(--ui-line); border-radius: 9px; color: var(--ui-muted); text-align: center; } .page-workspace .dr-ride4-interval-empty > i { color: var(--ui-success); font-size: 20px; } .page-workspace .dr-ride4-interval-empty strong { color: var(--ui-ink); font-size: 10px; } .page-workspace .dr-ride4-interval-empty p { margin: 0; font-size: 8px; } /**/ html.ops-ui .dr-flag-narrative { --dr-flag-accent: var(--ui-muted); --dr-flag-surface: var(--ui-paper); --dr-flag-edge: var(--ui-line); display: grid; gap: 6px; margin-top: 8px; color: var(--ui-muted); font-size: var(--dr-fs-meta); line-height: var(--dr-lh-body); text-align: left; } /**/ html.ops-ui .dr-flag-narrative--neutral { --dr-flag-accent: var(--ui-muted); --dr-flag-surface: var(--ui-paper); --dr-flag-edge: var(--ui-line); } html.ops-ui .dr-flag-narrative--warning { --dr-flag-accent: var(--ui-warning); --dr-flag-surface: var(--ui-amber); --dr-flag-edge: #e7cf95; color: #5f4104; } /**/ html.ops-ui .dr-flag-narrative--callout { padding: 9px 11px; border: 1px solid var(--dr-flag-edge); border-left: 3px solid var(--dr-flag-accent); border-radius: 8px; background: var(--dr-flag-surface); } /**/ html.ops-ui .dr-flag-narrative--compact { gap: 0; justify-items: start; margin-top: 0; padding: 0; border: 0; background: none; line-height: var(--dr-lh-tight); } /**/ html.ops-ui .dr-flag-narrative__disclosure { display: block; max-width: 100%; } /**/ html.ops-ui .dr-flag-narrative__pill { display: flex; align-items: center; cursor: pointer; font-size: var(--dr-fs-label); font-weight: 700; line-height: var(--dr-lh-tight); list-style: none; } /**/ html.ops-ui .dr-flag-narrative__pill::-webkit-details-marker { display: none; } html.ops-ui .dr-flag-narrative__pill-body { display: inline-flex; min-width: 0; align-items: center; gap: 4px; padding: 2px 9px 2px 7px; border: 1px solid var(--dr-flag-edge); border-radius: 999px; background: var(--dr-flag-surface); color: var(--dr-flag-accent); } html.ops-ui .dr-flag-narrative__pill:hover .dr-flag-narrative__pill-body, html.ops-ui .dr-flag-narrative__disclosure[open] .dr-flag-narrative__pill-body { border-color: var(--dr-flag-accent); } html.ops-ui .dr-flag-narrative__pill-icon { flex: 0 0 auto; opacity: 0.75; } /**/ html.ops-ui .dr-flag-narrative__pill-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } html.ops-ui .dr-flag-narrative__disclosure > .dr-flag-narrative__summary { margin: 6px 0 0; padding-left: 8px; border-left: 2px solid var(--dr-flag-edge); font-weight: 400; } html.ops-ui .dr-flag-narrative__head { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; } /**/ html.ops-ui .dr-flag-narrative__badge { display: inline-flex; padding: 3px 8px; border-radius: 999px; background: rgba(138, 92, 6, 0.16); color: var(--dr-flag-accent); font-size: var(--dr-fs-label); font-weight: 800; letter-spacing: 0.05em; line-height: var(--dr-lh-tight); text-transform: uppercase; white-space: nowrap; } /**/ html.ops-ui .dr-flag-narrative__action { display: inline-flex; padding: 3px 8px; border: 1px solid var(--ui-warning); border-radius: 999px; color: var(--ui-warning); font-size: var(--dr-fs-label); font-weight: 800; letter-spacing: 0.05em; line-height: var(--dr-lh-tight); text-transform: uppercase; white-space: nowrap; } html.ops-ui .dr-flag-narrative__summary { margin: 0; font-weight: 600; } /**/ html.ops-ui .dr-flag-narrative__tiers { display: grid; gap: 2px; margin: 0; } html.ops-ui .dr-flag-narrative__label { margin: 0; color: inherit; font-size: var(--dr-fs-label); font-weight: 800; letter-spacing: 0.06em; line-height: var(--dr-lh-tight); text-transform: uppercase; } html.ops-ui .dr-flag-narrative__label + .dr-flag-narrative__text { margin: 0 0 6px; } html.ops-ui .dr-flag-narrative__tiers .dr-flag-narrative__text:last-child { margin-bottom: 0; } html.ops-ui .dr-flag-narrative__text { margin: 0; } /**/ html.ops-ui .dr-flag-narrative__label--so_what + .dr-flag-narrative__text { font-weight: 700; } /**/ .page-workspace .dr-ride4-interval-narrative { grid-column: 1 / -1; } .page-workspace .dr-ride4-finding__narrative { margin-top: 8px; } .page-workspace .dr-ride4-pedal { min-width: 0; } .page-workspace .dr-ride4-pedal-header { display: grid; gap: 10px; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--ui-line-soft); } .page-workspace .dr-ride4-pedal-header__main { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; } .page-workspace .dr-ride4-pedal-header__main > div:first-child > p:last-child { max-width: 560px; margin: 6px 0 0; color: var(--ui-muted); font-size: 10px; line-height: 1.5; } .page-workspace .dr-ride4-definitions { border: 1px solid var(--ui-line-soft); border-radius: 8px; background: #f8faf8; } .page-workspace .dr-ride4-definitions > summary { display: flex; min-height: 34px; align-items: center; gap: 7px; padding: 7px 9px; color: var(--ui-ink); cursor: pointer; font-size: 9px; font-weight: 700; } .page-workspace .dr-ride4-definitions dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0 9px 10px; } .page-workspace .dr-ride4-definitions dl > div { padding: 7px; border-radius: 6px; background: #fff; } .page-workspace .dr-ride4-definitions dt { color: var(--ui-ink); font-size: 8px; font-weight: 800; } .page-workspace .dr-ride4-definitions dd { margin: 3px 0 0; color: var(--ui-muted); font-size: 8px; line-height: 1.4; } /**/ .page-workspace .dr-pedal-references { margin-top: 4px; padding: 13px 14px; border: 1px solid var(--ui-line-soft); border-radius: 8px; background: #f8faf8; } .page-workspace .dr-pedal-references__list { margin: 8px 0 0; padding-left: 17px; list-style: disc; } .page-workspace .dr-pedal-references__list li { margin-top: 5px; color: var(--ui-muted); font-size: var(--dr-fs-label); line-height: 1.5; } .page-workspace .dr-pedal-references__list li:first-child { margin-top: 0; } .page-workspace .dr-ride4-empty { display: grid; min-height: 320px; place-items: center; align-content: center; gap: 8px; padding: 28px !important; color: var(--ui-muted); text-align: center; } .page-workspace .dr-ride4-empty h2, .page-workspace .dr-ride4-empty p { margin: 0; } .page-workspace .dr-ride4-empty h2 { color: var(--ui-ink); font-size: 18px; } .page-workspace .dr-ride4-empty p { max-width: 450px; font-size: 10px; line-height: 1.5; } @container (max-width: 760px) { .page-workspace .dr-ride4-hero__main, .page-workspace .dr-ride4-profile__head, .page-workspace .dr-ride4-pedal-header__main { display: grid; } .page-workspace .dr-ride4-actions, .page-workspace .dr-ride4-profile__controls { justify-content: flex-start; } .page-workspace .dr-ride4-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); } .page-workspace .dr-ride4-finding-grid { grid-template-columns: 1fr; } .page-workspace .dr-ride4-interval-head, .page-workspace .dr-ride4-interval-row { grid-template-columns: 68px minmax(90px, 1.2fr) 80px minmax(90px, 1fr) 96px; gap: 6px; } .page-workspace .dr-ride4-definitions dl { grid-template-columns: 1fr; } } @media (max-width: 620px) { .page-workspace .dr-ride4-hero, .page-workspace .dr-ride4-summary, .page-workspace .dr-ride4-findings, .page-workspace .dr-ride4-profile, .page-workspace .dr-ride4-window, .page-workspace .dr-ride4-pedal { padding: 14px !important; } .page-workspace .dr-ride4-breadcrumb { align-items: flex-start; flex-direction: column; } .page-workspace .dr-ride4-hero__main, .page-workspace .dr-ride4-profile__head, .page-workspace .dr-ride4-pedal-header__main, .page-workspace .dr-ride4-section-head { display: grid; } .page-workspace .dr-ride4-actions { display: grid; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-ride4-stepper { grid-column: 1 / -1; } .page-workspace .dr-ride4-stepper .dr-button { flex: 1 1 0; } .page-workspace .dr-ride4-actions > .dr-button, .page-workspace .dr-ride4-more, .page-workspace .dr-ride4-more > summary { width: 100%; justify-content: center; } .page-workspace .dr-ride4-more__panel { position: fixed; top: auto; right: 14px; bottom: 14px; left: 14px; width: auto; } .page-workspace .dr-ride4-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-ride4-score { justify-items: start; } .page-workspace .dr-ride4-profile__controls { display: grid; justify-content: stretch; } .page-workspace .dr-ride4-profile .dr-profile-series-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-ride4-profile .dr-chart-frame { min-height: 270px; } .page-workspace .dr-ride4-interval-table { border: 0; } .page-workspace .dr-ride4-interval-head { display: none; } .page-workspace .dr-ride4-interval-table > [role="rowgroup"] { display: grid; gap: 8px; } .page-workspace .dr-ride4-interval-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 11px; border: 1px solid var(--ui-line-soft); border-radius: 8px; } .page-workspace .dr-ride4-interval-row > div:nth-child(4), .page-workspace .dr-ride4-interval-row > div:nth-child(5) { grid-column: 1 / -1; } .page-workspace .dr-ride4-cell-label { display: block; margin-bottom: 3px; color: var(--ui-muted); font-size: 6px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; } .page-workspace .dr-biomechanics-mode-group { display: grid; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); } } /**/ .page-workspace .dr-compare-workspace { min-width: 0; container-type: inline-size; } .page-workspace .dr-compare5 { display: grid; min-width: 0; gap: 12px; } .page-workspace .dr-compare5-panel { padding: 18px !important; } .page-workspace .dr-compare5-panel__head { margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--ui-line-soft); } .page-workspace .dr-compare5-panel__head h3 { margin: 2px 0 0; color: var(--ui-ink); font-size: clamp(18px, 2.2vw, 25px); font-weight: 760; letter-spacing: -0.03em; line-height: 1.12; } .page-workspace .dr-compare5-panel__head p:not(.dr-section-kicker) { margin-top: 6px; color: var(--ui-muted); font-size: 12px; line-height: 1.5; } .page-workspace .dr-compare5-headline { color: var(--ui-ink) !important; font-size: 14px !important; font-weight: 720; } /**/ .page-workspace .dr-compare5-steps { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; } .page-workspace .dr-compare5-step { display: inline-flex; min-height: 30px; align-items: center; gap: 7px; padding: 5px 11px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--ui-white); color: var(--ui-muted); font-size: 10px; font-weight: 700; } .page-workspace .dr-compare5-step__number { display: inline-flex; width: 17px; height: 17px; align-items: center; justify-content: center; border-radius: 999px; background: var(--ui-line-soft); color: var(--ui-ink); font-family: 'IBM Plex Mono', monospace; font-size: 9px; } .page-workspace .dr-compare5-step--current { border-color: var(--ui-green); background: var(--ui-green); color: var(--ui-white); } .page-workspace .dr-compare5-step--current .dr-compare5-step__number { background: var(--ui-lime); color: var(--ui-green); } .page-workspace .dr-compare5-step--done { border-color: #b9ddce; background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-compare5-step--done .dr-compare5-step__number { background: var(--ui-white); color: var(--ui-success); } /**/ .page-workspace .dr-compare5-filters { display: grid; align-items: end; gap: 10px; margin-bottom: 14px; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-flow: row dense; } .page-workspace .dr-compare5-filter, .page-workspace .dr-compare5-date-range legend { display: block; color: var(--ui-muted); font-size: 8px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; } .page-workspace .dr-compare5-filter > span { display: block; margin-bottom: 4px; } .page-workspace .dr-compare5-search { display: flex; align-items: center; gap: 7px; padding: 0 9px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-white); color: var(--ui-muted); } .page-workspace .dr-compare5-search input { width: 100%; min-height: 34px; border: 0; background: transparent; color: var(--ui-ink); font-size: 12px; } .page-workspace .dr-compare5-search input:focus { outline: none; } .page-workspace .dr-compare5-date-range { min-width: 0; margin: 0; padding: 0; border: 0; } .page-workspace .dr-compare5-date-range > div { display: grid; gap: 7px; margin-top: 4px; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-compare5-date-range label { display: grid; gap: 3px; } .page-workspace .dr-compare5-date-range span { color: var(--ui-subtle); font-size: 8px; font-weight: 700; text-transform: uppercase; } .page-workspace .dr-compare5-date-range input { min-height: 34px; padding: 0 8px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-white); color: var(--ui-ink); font-size: 11px; } .page-workspace .dr-compare5-flagged, .page-workspace .dr-compare5-comparable { display: inline-flex; min-height: 34px; align-items: center; gap: 7px; padding: 0 11px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--ui-white); color: var(--ui-ink); font-size: 11px; font-weight: 620; white-space: nowrap; grid-column: span 2; } /**/ .page-workspace .dr-compare5-comparable { min-width: 0; grid-column: span 4; } .page-workspace .dr-compare5-comparable > span { overflow: hidden; text-overflow: ellipsis; } .page-workspace .dr-compare5-comparable--unavailable { background: var(--ui-paper); color: var(--ui-subtle); cursor: not-allowed; } .page-workspace .dr-compare5-filter--search { grid-column: span 4; } .page-workspace .dr-compare5-filter:not(.dr-compare5-filter--search) { grid-column: span 2; } .page-workspace .dr-compare5-date-range, .page-workspace .dr-compare5-range, .page-workspace .dr-compare5-elevation { min-width: 0; margin: 0; padding: 0; border: 0; } .page-workspace .dr-compare5-date-range { grid-column: span 4; } .page-workspace .dr-compare5-range { grid-column: span 4; } .page-workspace .dr-compare5-elevation { grid-column: span 8; } .page-workspace .dr-compare5-range legend, .page-workspace .dr-compare5-elevation legend { color: var(--ui-muted); font-size: 8px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; } .page-workspace .dr-compare5-range > div, .page-workspace .dr-compare5-elevation__range { display: grid; gap: 7px; margin-top: 4px; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-compare5-elevation__controls { display: grid; align-items: end; gap: 7px; margin-top: 4px; grid-template-columns: minmax(0, 1fr); } .page-workspace .dr-compare5-range label, .page-workspace .dr-compare5-elevation__range label { display: grid; gap: 3px; } .page-workspace .dr-compare5-range span, .page-workspace .dr-compare5-elevation__range span { color: var(--ui-subtle); font-size: 8px; font-weight: 700; text-transform: uppercase; } .page-workspace .dr-compare5-filter select, .page-workspace .dr-compare5-range input, .page-workspace .dr-compare5-elevation select, .page-workspace .dr-compare5-elevation input { width: 100%; min-height: 34px; padding: 0 8px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-white); color: var(--ui-ink); font-size: 11px; } .page-workspace .dr-compare5-filter-note { margin: 0; color: var(--ui-muted); font-size: 10px; line-height: 1.45; grid-column: 1 / -1; } .page-workspace .dr-compare5-count { margin-bottom: 8px; color: var(--ui-muted); font-size: 10px; font-weight: 700; } .page-workspace .dr-compare5-picker { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; } .page-workspace .dr-compare5-pick { display: grid; align-items: center; gap: 10px; padding: 11px 13px; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); background: var(--ui-white); grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.6fr) auto; } .page-workspace .dr-compare5-pick--selected { border-color: var(--ui-green); background: var(--ui-green-soft); } .page-workspace .dr-compare5-pick__identity { min-width: 0; } .page-workspace .dr-compare5-pick__identity strong { display: block; overflow: hidden; color: var(--ui-ink); font-size: 13px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-compare5-pick__meta { display: block; margin-top: 2px; color: var(--ui-muted); font-size: 10px; } .page-workspace .dr-compare5-pick__values { display: flex; flex-wrap: wrap; gap: 5px; } .page-workspace .dr-compare5-pick__values > span { display: inline-flex; min-height: 22px; align-items: center; padding: 2px 7px; border: 1px solid var(--ui-line-soft); border-radius: 999px; background: #f7f9f7; color: var(--ui-muted); font-size: 9px; font-weight: 660; } .page-workspace .dr-compare5-pick__flags { border-color: #ead49d !important; background: var(--ui-amber) !important; color: var(--ui-warning) !important; } .page-workspace .dr-compare5-pick__actions { display: flex; gap: 6px; justify-content: flex-end; } .page-workspace .dr-compare5-more { width: 100%; margin-top: 9px; justify-content: center; } .page-workspace .dr-compare5-empty { display: grid; justify-items: center; gap: 5px; padding: 28px 16px; border: 1px dashed var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-paper); text-align: center; } .page-workspace .dr-compare5-empty h4 { color: var(--ui-ink); font-size: 14px; font-weight: 720; } .page-workspace .dr-compare5-empty p { max-width: 42ch; color: var(--ui-muted); font-size: 11px; line-height: 1.5; } .page-workspace .dr-compare5-empty .dr-button { margin-top: 6px; } /**/ .page-workspace .dr-compare5-tray { position: sticky; bottom: 8px; z-index: 5; display: grid; gap: 9px; padding: 13px 15px; border: 1px solid var(--ui-green); border-radius: var(--ui-radius); background: var(--ui-white); box-shadow: var(--ui-shadow); } .page-workspace .dr-compare5-tray__head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; } .page-workspace .dr-compare5-tray__count { color: var(--ui-ink); font-size: 13px; font-weight: 760; } .page-workspace .dr-compare5-tray__limit, .page-workspace .dr-compare5-tray__empty { color: var(--ui-muted); font-size: 10px; } .page-workspace .dr-compare5-tray__blocked { color: var(--ui-warning); font-size: 11px; font-weight: 640; } .page-workspace .dr-compare5-tray__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; } .page-workspace .dr-compare5-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 5px 4px 11px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--ui-green-soft); } .page-workspace .dr-compare5-chip strong { color: var(--ui-ink); font-size: 11px; font-weight: 700; } .page-workspace .dr-compare5-chip__date { display: block; color: var(--ui-muted); font-size: 9px; } .page-workspace .dr-compare5-chip__remove.dr-button { min-height: 24px; padding: 3px 5px; } .page-workspace .dr-compare5-tray__actions { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; } /**/ .page-workspace .dr-compare5-outcomes { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } .page-workspace .dr-compare5-outcome { padding: 12px; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); background: var(--ui-white); } .page-workspace .dr-compare5-outcome h4 { margin-bottom: 7px; color: var(--ui-ink); font-size: 11px; font-weight: 780; letter-spacing: 0.02em; } .page-workspace .dr-compare5-outcome ul { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; } .page-workspace .dr-compare5-outcome li strong { display: block; color: var(--ui-ink); font-size: 11px; font-weight: 700; } .page-workspace .dr-compare5-outcome li span { color: var(--ui-muted); font-family: 'IBM Plex Mono', monospace; font-size: 10px; } .page-workspace .dr-compare5-outcome__empty { color: var(--ui-subtle); font-size: 10px; line-height: 1.5; } .page-workspace .dr-compare5-reads { display: grid; gap: 10px; margin-top: 12px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } .page-workspace .dr-compare5-read { padding: 12px; border: 1px solid var(--ui-line-soft); border-left: 3px solid var(--ui-green); border-radius: var(--ui-radius-sm); background: var(--ui-paper); } .page-workspace .dr-compare5-read__label { color: var(--ui-muted); font-size: 8px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; } .page-workspace .dr-compare5-read strong { display: block; margin: 3px 0 5px; color: var(--ui-ink); font-size: 13px; font-weight: 740; } .page-workspace .dr-compare5-read p:last-child { color: var(--ui-muted); font-size: 11px; line-height: 1.55; } .page-workspace .dr-compare5-sources { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--ui-line-soft); } .page-workspace .dr-compare5-sources h4, .page-workspace .dr-compare5-open-rides h4 { margin-bottom: 8px; color: var(--ui-ink); font-size: 11px; font-weight: 780; } .page-workspace .dr-compare5-sources ul { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; } .page-workspace .dr-compare5-sources li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 11px; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); background: var(--ui-white); } .page-workspace .dr-compare5-sources strong { color: var(--ui-ink); font-size: 12px; font-weight: 700; } /**/ .page-workspace .dr-compare5-chart { margin: 0 0 14px; } .page-workspace .dr-compare5-chart figcaption { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 7px; color: var(--ui-muted); font-size: 9px; font-weight: 780; letter-spacing: 0.06em; text-transform: uppercase; } /**/ .page-workspace .dr-compare5-chart__tools { display: flex; flex-wrap: wrap; gap: 6px; } .page-workspace .dr-compare5-chart__tools .dr-button { gap: 0.4rem; padding: 0.35rem 0.7rem; font-size: 11px !important; } .page-workspace .dr-compare5-chart__summary { margin-top: 8px; color: var(--ui-muted); font-size: 11px; line-height: 1.55; } .page-workspace .dr-compare5-chart__error { margin-top: 8px; padding: 9px 11px; border: 1px solid #ebc0bd; border-radius: var(--ui-radius-sm); background: var(--ui-rose); color: var(--ui-danger); font-size: 11px; } .page-workspace .dr-compare5-group { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--ui-line-soft); } .page-workspace .dr-compare5-group__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 9px; } .page-workspace .dr-compare5-group__head h4 { color: var(--ui-ink); font-size: 14px; font-weight: 740; } .page-workspace .dr-compare5-status { display: inline-flex; min-height: 22px; align-items: center; gap: 4px; padding: 2px 8px; border: 1px solid var(--ui-line); border-radius: 999px; background: #f7f9f7; color: var(--ui-muted); font-size: 9px; font-weight: 720; } .page-workspace .dr-compare5-status--improved { border-color: #b9ddce; background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-compare5-status--worsened { border-color: #ebc0bd; background: var(--ui-rose); color: var(--ui-danger); } /**/ .page-workspace .dr-compare5-status--reduced, .page-workspace .dr-compare5-status--elevated, .page-workspace .dr-compare5-status--matched { border-color: var(--ui-line); background: var(--ui-line-soft); color: var(--ui-muted); } .page-workspace .dr-compare5-status--elevated { border-color: var(--ui-success); background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-compare5-status--context { border-color: #cfc7f2; background: var(--ui-violet-soft); color: var(--ui-violet); } .page-workspace .dr-compare5-status--insufficient { border-color: #ead49d; background: var(--ui-amber); color: var(--ui-warning); } .page-workspace .dr-compare5-diff-table { border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); overflow: hidden; } .page-workspace .dr-compare5-diff-head, .page-workspace .dr-compare5-diff-row { display: grid; align-items: center; gap: 10px; grid-template-columns: minmax(0, 2.2fr) repeat(3, minmax(0, 1fr)) minmax(0, 1.1fr); } /**/ .page-workspace .dr-compare5-diff-table--aggregate .dr-compare5-diff-head, .page-workspace .dr-compare5-diff-table--aggregate .dr-compare5-diff-row { grid-template-columns: minmax(0, 2fr) repeat(4, minmax(0, 1fr)) minmax(0, 1.1fr); } .page-workspace .dr-compare5-diff-head { padding: 8px 12px; background: var(--ui-paper); } .page-workspace .dr-compare5-diff-head > span { overflow: hidden; color: var(--ui-muted); font-size: 8px; font-weight: 800; letter-spacing: 0.06em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; } .page-workspace .dr-compare5-diff-row { padding: 10px 12px; border-top: 1px solid var(--ui-line-soft); } .page-workspace .dr-compare5-diff-cell { min-width: 0; color: var(--ui-ink); font-size: 11px; } .page-workspace .dr-compare5-diff-cell--measure strong { font-size: 12px; font-weight: 700; } .page-workspace .dr-compare5-diff-help { display: block; margin-top: 2px; color: var(--ui-muted); font-size: 10px; line-height: 1.45; } .page-workspace .dr-compare5-diff-cell > span:not(.dr-compare5-diff-label):not(.dr-compare5-status) { font-family: 'IBM Plex Mono', monospace; font-size: 11px; } .page-workspace .dr-compare5-diff-label { display: none; } /**/ .page-workspace .dr-compare5-diff-spread { display: block; margin-top: 2px; color: var(--ui-muted); } .page-workspace .dr-compare5-allvalues__average { background: var(--ui-paper); font-weight: 700; } .page-workspace .dr-compare5-allvalues { margin-top: 9px; } .page-workspace .dr-compare5-allvalues summary { cursor: pointer; color: var(--ui-green-2); font-size: 10px; font-weight: 720; } .page-workspace .dr-compare5-allvalues__scroll { margin-top: 8px; overflow-x: auto; } .page-workspace .dr-compare5-allvalues table { width: 100%; border-collapse: collapse; font-size: 10px; } .page-workspace .dr-compare5-allvalues th, .page-workspace .dr-compare5-allvalues td { padding: 6px 9px; border: 1px solid var(--ui-line-soft); text-align: left; white-space: nowrap; } .page-workspace .dr-compare5-allvalues thead th { background: var(--ui-paper); color: var(--ui-muted); font-weight: 780; } .page-workspace .dr-compare5-allvalues td { color: var(--ui-ink); font-family: 'IBM Plex Mono', monospace; } /**/ .page-workspace .dr-compare5-actions { display: flex; flex-wrap: wrap; gap: 8px; } .page-workspace .dr-compare5-open-rides { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--ui-line-soft); } .page-workspace .dr-compare5-open-rides__list { display: flex; flex-wrap: wrap; gap: 7px; } .page-workspace .dr-compare5-saved { margin-top: 11px; color: var(--ui-muted); font-size: 10px; } @container (max-width: 860px) { .page-workspace .dr-compare5-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-compare5-filter:not(.dr-compare5-filter--search) { grid-column: span 1; } .page-workspace .dr-compare5-filter--search, .page-workspace .dr-compare5-date-range, .page-workspace .dr-compare5-range, .page-workspace .dr-compare5-elevation, .page-workspace .dr-compare5-flagged, .page-workspace .dr-compare5-comparable, .page-workspace .dr-compare5-filter-note { grid-column: 1 / -1; } .page-workspace .dr-compare5-pick { grid-template-columns: minmax(0, 1fr); } .page-workspace .dr-compare5-pick__actions { justify-content: flex-start; } .page-workspace .dr-compare5-diff-head { display: none; } /**/ .page-workspace .dr-compare5-diff-row, .page-workspace .dr-compare5-diff-table--aggregate .dr-compare5-diff-row { gap: 8px; padding: 11px; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-compare5-diff-cell--measure { grid-column: 1 / -1; } .page-workspace .dr-compare5-diff-label { display: block; margin-bottom: 3px; overflow: hidden; color: var(--ui-muted); font-size: 8px; font-weight: 800; letter-spacing: 0.06em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; } } @media (max-width: 620px) { .page-workspace .dr-compare5-panel { padding: 14px !important; } .page-workspace .dr-compare5-tray { position: static; padding: 12px; } .page-workspace .dr-compare5-tray__actions .dr-button { flex: 1 1 auto; justify-content: center; } .page-workspace .dr-compare5-sources li { align-items: flex-start; flex-direction: column; gap: 7px; } } .page-workspace .dr-compare5-factors { display: grid; gap: 6px; margin: 8px 0 0; padding: 8px 0 0; border-top: 1px solid var(--ui-line-soft); list-style: none; } .page-workspace .dr-compare5-factors strong { display: block; margin: 0; color: var(--ui-ink); font-size: 11px; font-weight: 720; } .page-workspace .dr-compare5-factors span { color: var(--ui-muted); font-size: 10px; line-height: 1.5; } /**/ .page-workspace .dr-analysis6-workspace { min-width: 0; container-type: inline-size; } .page-workspace .dr-analysis6 { display: grid; /**/ grid-template-columns: minmax(0, 1fr); min-width: 0; gap: 12px; padding: 18px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); background: var(--ui-white); box-shadow: var(--ui-shadow-soft); } /**/ .page-workspace .dr-analysis6-switch { display: flex; flex-wrap: wrap; gap: 4px; width: max-content; max-width: 100%; justify-self: start; padding: 5px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--ui-paper); } /**/ .page-workspace .dr-analysis6-switch > .dr-button, html.ops-ui.field-theme body.page-workspace .dr-analysis6-switch > .dr-button { border-color: transparent !important; border-radius: 999px !important; background: transparent !important; color: var(--ui-muted) !important; } .page-workspace .dr-analysis6-switch > .dr-button:hover:not(:disabled), html.ops-ui.field-theme body.page-workspace .dr-analysis6-switch > .dr-button:hover:not(:disabled) { border-color: transparent !important; background: var(--ui-green-soft) !important; color: var(--ui-ink) !important; } .page-workspace .dr-analysis6-switch > .dr-analysis6-switch--active, html.ops-ui.field-theme body.page-workspace .dr-analysis6-switch > .dr-analysis6-switch--active, .page-workspace .dr-analysis6-switch > .dr-analysis6-switch--active:hover:not(:disabled), html.ops-ui.field-theme body.page-workspace .dr-analysis6-switch > .dr-analysis6-switch--active:hover:not(:disabled) { border-color: var(--ui-green) !important; background: var(--ui-green) !important; color: #fff !important; } .page-workspace .dr-analysis6-switch > .dr-analysis6-switch--active * { color: inherit !important; } /**/ .page-workspace .dr-analysis6-head { padding-bottom: 12px; border-bottom: 1px solid var(--ui-line-soft); } .page-workspace .dr-analysis6-titleline { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px 11px; } .page-workspace .dr-analysis6-titleline h3 { margin: 2px 0 0; color: var(--ui-ink); font-size: clamp(18px, 2.2vw, 25px); font-weight: 760; letter-spacing: -0.03em; line-height: 1.12; } .page-workspace .dr-analysis6-titleline > span { display: inline-flex; min-height: 22px; align-items: center; padding: 2px 9px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--ui-paper); color: var(--ui-muted); font-size: 10px; font-weight: 720; } .page-workspace .dr-analysis6-head > p:last-child { margin-top: 6px; color: var(--ui-muted); font-size: 11px; line-height: 1.5; } /**/ .page-workspace .dr-analysis6-scope { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; padding: 9px 12px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-green-soft); } .page-workspace .dr-analysis6-scope > i { color: var(--ui-green-2); } .page-workspace .dr-analysis6-scope > p { flex: 1 1 16rem; min-width: 0; margin: 0; color: var(--ui-ink); font-size: 11px; line-height: 1.5; } /**/ .page-workspace .dr-analysis6-filters { display: grid; align-items: end; gap: 10px; grid-template-columns: minmax(0, 1.6fr) repeat(4, minmax(0, 1fr)) auto; } .page-workspace .dr-analysis6-filter, .page-workspace .dr-analysis6-date-range legend { display: block; color: var(--ui-muted); font-size: 8px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; } .page-workspace .dr-analysis6-filter > span { display: block; margin-bottom: 4px; } .page-workspace .dr-analysis6-filter select, .page-workspace .dr-analysis6-date-range input { width: 100%; min-height: 34px; padding: 0 8px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-white); color: var(--ui-ink); font-size: 11px; } .page-workspace .dr-analysis6-date-range { min-width: 0; margin: 0; padding: 0; border: 0; } .page-workspace .dr-analysis6-date-range > div { display: grid; gap: 7px; margin-top: 4px; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-analysis6-date-range label { display: grid; gap: 3px; } .page-workspace .dr-analysis6-date-range label span { color: var(--ui-subtle); font-size: 8px; font-weight: 700; text-transform: uppercase; } .page-workspace .dr-analysis6-reset { white-space: nowrap; } /**/ .page-workspace .dr-analysis6-tabs { display: flex; flex-wrap: wrap; width: max-content; max-width: 100%; gap: 4px; justify-self: start; padding: 5px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--ui-paper); } .page-workspace .dr-analysis6-tab { min-height: 40px; /**/ padding: 0.85rem 1.1rem; border: 1px solid transparent; border-radius: 999px; background: transparent; color: var(--ui-muted); cursor: pointer; font-size: 12px; font-weight: 700; } .page-workspace .dr-analysis6-tab:hover:not(.dr-analysis6-tab--active) { border-color: transparent; background: var(--ui-green-soft); color: var(--ui-ink); } .page-workspace .dr-analysis6-tab--active, .page-workspace .dr-analysis6-tab--active:hover { border-color: var(--ui-green); background: var(--ui-green); color: #fff; } .page-workspace .dr-analysis6-tab--active * { color: inherit; } .page-workspace .dr-analysis6-tab:focus-visible { outline: 2px solid var(--ui-green); outline-offset: 2px; } .page-workspace .dr-analysis6-panel { min-width: 0; } .page-workspace .dr-analysis6-summary { margin-bottom: 11px; color: var(--ui-muted); font-size: 11px; line-height: 1.55; } /**/ .page-workspace .dr-analysis6-trends { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); } .page-workspace .dr-analysis6-trend { display: grid; align-content: start; gap: 9px; padding: 13px; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); background: var(--ui-white); } .page-workspace .dr-analysis6-trend__head { display: flex; align-items: center; justify-content: space-between; gap: 9px; } .page-workspace .dr-analysis6-trend__head h4 { color: var(--ui-ink); font-size: 13px; font-weight: 740; } .page-workspace .dr-analysis6-trend__figures { display: grid; gap: 7px; grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-analysis6-trend__label { display: block; margin-bottom: 2px; color: var(--ui-muted); font-size: 8px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; } .page-workspace .dr-analysis6-trend__figures strong, .page-workspace .dr-analysis6-trend__figures > div > span:not(.dr-analysis6-trend__label) { color: var(--ui-ink); font-family: 'IBM Plex Mono', monospace; font-size: 11px; } .page-workspace .dr-analysis6-trend__copy { color: var(--ui-muted); font-size: 11px; line-height: 1.55; } .page-workspace .dr-analysis6-status { display: inline-flex; min-height: 22px; align-items: center; gap: 4px; padding: 2px 8px; border: 1px solid var(--ui-line); border-radius: 999px; background: #f7f9f7; color: var(--ui-muted); font-size: 9px; font-weight: 720; white-space: nowrap; } .page-workspace .dr-analysis6-status--improved { border-color: #b9ddce; background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-analysis6-status--worsened { border-color: #ebc0bd; background: var(--ui-rose); color: var(--ui-danger); } .page-workspace .dr-analysis6-status--context { border-color: #cfc7f2; background: var(--ui-violet-soft); color: var(--ui-violet); } .page-workspace .dr-analysis6-status--insufficient { border-color: #ead49d; background: var(--ui-amber); color: var(--ui-warning); } /**/ .page-workspace .dr-analysis6-supporting summary, .page-workspace .dr-analysis6-technical summary { cursor: pointer; color: var(--ui-green-2); font-size: 10px; font-weight: 720; } .page-workspace .dr-analysis6-supporting ul { display: grid; gap: 5px; margin: 8px 0 0; padding: 0; list-style: none; } .page-workspace .dr-analysis6-supporting li { display: flex; align-items: center; justify-content: space-between; gap: 9px; padding: 7px 9px; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); background: var(--ui-paper); } .page-workspace .dr-analysis6-supporting strong { color: var(--ui-ink); font-size: 11px; font-weight: 700; } .page-workspace .dr-analysis6-supporting__meta { display: block; color: var(--ui-muted); font-size: 9px; } .page-workspace .dr-analysis6-empty-note { color: var(--ui-subtle); font-size: 10px; } /**/ .page-workspace .dr-analysis6-technical { margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--ui-line-soft); } .page-workspace .dr-analysis6-technical__scroll { margin-top: 8px; overflow-x: auto; } .page-workspace .dr-analysis6-technical table { width: 100%; border-collapse: collapse; font-size: 10px; } .page-workspace .dr-analysis6-technical th, .page-workspace .dr-analysis6-technical td { padding: 6px 9px; border: 1px solid var(--ui-line-soft); text-align: left; vertical-align: top; } .page-workspace .dr-analysis6-technical thead th { background: var(--ui-paper); color: var(--ui-muted); font-weight: 780; white-space: nowrap; } .page-workspace .dr-analysis6-technical__list { display: grid; gap: 6px; margin: 8px 0 0; padding: 0; list-style: none; } .page-workspace .dr-analysis6-technical__list li { display: grid; gap: 2px; padding: 7px 9px; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); background: var(--ui-paper); } .page-workspace .dr-analysis6-technical__list strong { color: var(--ui-ink); font-size: 10px; font-weight: 740; } .page-workspace .dr-analysis6-technical__list span { color: var(--ui-muted); font-size: 10px; line-height: 1.5; } /**/ .page-workspace .dr-analysis6-table__scroll { overflow-x: auto; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); } .page-workspace .dr-analysis6-table { width: 100%; border-collapse: collapse; font-size: 11px; } .page-workspace .dr-analysis6-table th, .page-workspace .dr-analysis6-table td { padding: 9px 11px; border-bottom: 1px solid var(--ui-line-soft); text-align: left; white-space: nowrap; } .page-workspace .dr-analysis6-table thead th { background: var(--ui-paper); color: var(--ui-muted); font-size: 8px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; } .page-workspace .dr-analysis6-table tbody th { white-space: normal; } .page-workspace .dr-analysis6-table tbody th strong { color: var(--ui-ink); font-size: 11px; font-weight: 700; } .page-workspace .dr-analysis6-table td { color: var(--ui-ink); font-family: 'IBM Plex Mono', monospace; } .page-workspace .dr-analysis6-cell-meta { display: block; color: var(--ui-muted); font-family: Inter, system-ui, sans-serif; font-size: 9px; } /**/ .page-workspace .dr-analysis6-flag-group { margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--ui-line-soft); } .page-workspace .dr-analysis6-flag-group header { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 8px; } .page-workspace .dr-analysis6-flag-group h4 { color: var(--ui-ink); font-size: 13px; font-weight: 740; } .page-workspace .dr-analysis6-flag-group header > span { color: var(--ui-muted); font-size: 10px; font-weight: 700; } .page-workspace .dr-analysis6-flag-group ul { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; } .page-workspace .dr-analysis6-flag { display: flex; align-items: flex-start; justify-content: space-between; gap: 11px; padding: 10px 12px; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); background: var(--ui-white); } .page-workspace .dr-analysis6-flag__body { min-width: 0; } .page-workspace .dr-analysis6-flag strong { display: block; margin: 4px 0 2px; color: var(--ui-ink); font-family: 'IBM Plex Mono', monospace; font-size: 11px; } .page-workspace .dr-analysis6-flag p { margin-top: 4px; color: var(--ui-muted); font-size: 10px; line-height: 1.5; } /**/ .page-workspace .dr-analysis6-flag--compact { align-items: center; padding: 6px 10px; border-color: transparent; background: var(--ui-paper); } .page-workspace .dr-analysis6-flag--compact .dr-analysis6-flag__body { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 9px; } .page-workspace .dr-analysis6-flag--compact strong, .page-workspace .dr-analysis6-flag--compact p { margin: 0; } .page-workspace .dr-analysis6-severity { display: inline-flex; min-height: 20px; align-items: center; padding: 2px 8px; border: 1px solid #ead49d; border-radius: 999px; background: var(--ui-amber); color: var(--ui-warning); font-size: 9px; font-weight: 720; } .page-workspace .dr-analysis6-severity--red { border-color: #ebc0bd; background: var(--ui-rose); color: var(--ui-danger); } /**/ .page-workspace .dr-analysis6-flag--compact .dr-analysis6-severity { background: none; } /**/ .page-workspace .dr-analysis6-empty { display: grid; justify-items: center; gap: 5px; padding: 28px 16px; border: 1px dashed var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-paper); text-align: center; } .page-workspace .dr-analysis6-empty h4 { color: var(--ui-ink); font-size: 14px; font-weight: 720; } .page-workspace .dr-analysis6-empty p { max-width: 46ch; color: var(--ui-muted); font-size: 11px; line-height: 1.5; } .page-workspace .dr-analysis6-empty .dr-button { margin-top: 6px; } /**/ .page-workspace .dr-summary-cards { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); } .page-workspace .dr-summary-card { display: grid; align-content: start; gap: 9px; padding: 14px; border: 1px solid var(--ui-line-soft); border-left: 3px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-white); } .page-workspace .dr-summary-card[data-dr-summary-status='settled'] { border-left-color: var(--ui-success); } .page-workspace .dr-summary-card[data-dr-summary-status='mixed'] { border-left-color: var(--ui-violet); } .page-workspace .dr-summary-card[data-dr-summary-status='spread'] { border-left-color: var(--ui-warning); } .page-workspace .dr-summary-card[data-dr-summary-status='insufficient'] { border-left-color: var(--ui-line); } .page-workspace .dr-summary-card__head { display: flex; align-items: center; justify-content: space-between; gap: 9px; } .page-workspace .dr-summary-card__head h4 { font: var(--dr-type-card); color: var(--ui-ink); } .page-workspace .dr-summary-card__status { display: inline-flex; min-height: 22px; align-items: center; padding: 2px 9px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--ui-paper); color: var(--ui-muted); font-size: var(--dr-fs-meta); font-weight: 720; white-space: nowrap; } .page-workspace .dr-summary-card__status--settled { border-color: #b9ddce; background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-summary-card__status--mixed { border-color: #cfc7f2; background: var(--ui-violet-soft); color: var(--ui-violet); } .page-workspace .dr-summary-card__status--spread { border-color: #ead49d; background: var(--ui-amber); color: var(--ui-warning); } .page-workspace .dr-summary-card__sentence { color: var(--ui-ink); font-size: var(--dr-fs-body); line-height: 1.55; } .page-workspace .dr-summary-card__meta { display: grid; gap: 8px; padding-top: 8px; border-top: 1px solid var(--ui-line-soft); grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); } .page-workspace .dr-summary-card__meta > div { display: grid; gap: 3px; min-width: 0; } .page-workspace .dr-summary-card__label { color: var(--ui-muted); font-size: var(--dr-fs-label); font-weight: 800; letter-spacing: 0.06em; line-height: 1.35; text-transform: uppercase; } .page-workspace .dr-summary-card__meta > div > span:not(.dr-summary-card__label) { color: var(--ui-ink); font-size: var(--dr-fs-meta); line-height: 1.45; } .page-workspace .dr-summary-card__confidence { justify-self: start; padding: 1px 8px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--ui-paper); font-weight: 720; } .page-workspace .dr-summary-card__confidence--high { border-color: #b9ddce; background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-summary-card__confidence--moderate { border-color: #cfc7f2; background: var(--ui-violet-soft); color: var(--ui-violet); } .page-workspace .dr-summary-card__confidence--limited, .page-workspace .dr-summary-card__confidence--insufficient { border-color: #ead49d; background: var(--ui-amber); color: var(--ui-warning); } .page-workspace .dr-summary-card__evidence summary, .page-workspace .dr-summary-limitations summary { cursor: pointer; color: var(--ui-green-2); font-size: var(--dr-fs-meta); font-weight: 720; } .page-workspace .dr-summary-card__evidence ul, .page-workspace .dr-summary-limitations ul { display: grid; gap: 4px; margin: 8px 0 0; padding: 0; list-style: none; } .page-workspace .dr-summary-card__evidence-link { display: flex; width: 100%; min-height: 32px; align-items: center; justify-content: space-between; gap: 8px; padding: 5px 10px; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); background: var(--ui-paper); color: var(--ui-ink); cursor: pointer; font-size: var(--dr-fs-meta); text-align: left; } .page-workspace .dr-summary-card__evidence-link:hover { border-color: var(--ui-green); color: var(--ui-green-2); } .page-workspace .dr-summary-card__evidence-link--primary { border-color: var(--ui-green); background: var(--ui-green-soft); color: var(--ui-green); font-weight: 720; } .page-workspace .dr-summary-limitations { margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--ui-line-soft); } .page-workspace .dr-summary-limitations li { padding: 7px 9px; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); background: var(--ui-paper); color: var(--ui-muted); font-size: var(--dr-fs-meta); line-height: 1.5; } @container (max-width: 900px) { .page-workspace .dr-analysis6-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-analysis6-date-range { grid-column: 1 / -1; } .page-workspace .dr-analysis6-reset { grid-column: 1 / -1; justify-content: center; } .page-workspace .dr-analysis6-trends, .page-workspace .dr-summary-cards { grid-template-columns: minmax(0, 1fr); } } @media (max-width: 620px) { .page-workspace .dr-analysis6 { padding: 14px; } .page-workspace .dr-analysis6-filters { grid-template-columns: minmax(0, 1fr); } .page-workspace .dr-analysis6-tabs { flex-wrap: nowrap; overflow-x: auto; } .page-workspace .dr-analysis6-tab { white-space: nowrap; } .page-workspace .dr-analysis6-flag { align-items: stretch; flex-direction: column; gap: 8px; } .page-workspace .dr-analysis6-supporting li { align-items: flex-start; flex-direction: column; gap: 6px; } .page-workspace .dr-summary-card__meta { grid-template-columns: minmax(0, 1fr); } } .page-workspace .dr-analysis6-filter--inert select { background: var(--ui-paper); color: var(--ui-subtle); cursor: not-allowed; } .page-workspace .dr-analysis6-filter__note { display: block; margin-top: 3px; color: var(--ui-subtle); font-size: 8px; font-weight: 600; letter-spacing: 0; text-transform: none; } /**/ .page-workspace .dr-reports7 { min-width: 0; padding: 18px !important; container-type: inline-size; } .page-workspace .dr-reports7__head { margin-bottom: 13px; padding-bottom: 12px; border-bottom: 1px solid var(--ui-line-soft); } .page-workspace .dr-reports7-titleline { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px 11px; } .page-workspace .dr-reports7-titleline h2 { margin: 2px 0 0; color: var(--ui-ink); font-size: clamp(18px, 2.2vw, 25px); font-weight: 760; letter-spacing: -0.03em; line-height: 1.12; } .page-workspace .dr-reports7-titleline > span { display: inline-flex; min-height: 22px; align-items: center; padding: 2px 9px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--ui-paper); color: var(--ui-muted); font-size: 10px; font-weight: 720; } .page-workspace .dr-reports7__head > p:last-child { margin-top: 6px; color: var(--ui-muted); font-size: 11px; line-height: 1.5; } /**/ .page-workspace .dr-reports7-status { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 12px; padding: 10px 12px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-paper); color: var(--ui-ink); font-size: 11px; font-weight: 640; line-height: 1.5; } .page-workspace .dr-reports7-status--success { border-color: #b9ddce; background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-reports7-status--error { border-color: #ebc0bd; background: var(--ui-rose); color: var(--ui-danger); } .page-workspace .dr-reports7-status--pending { border-color: #ead49d; background: var(--ui-amber); color: var(--ui-warning); } /**/ .page-workspace .dr-reports7-readiness { margin-bottom: 12px; padding: 12px 14px; border: 1px solid var(--ui-line-soft); border-left: 3px solid var(--ui-green); border-radius: var(--ui-radius-sm); background: var(--ui-paper); } .page-workspace .dr-reports7-readiness--review { border-left-color: var(--ui-warning); } .page-workspace .dr-reports7-readiness__label { color: var(--ui-muted); font-size: 8px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; } .page-workspace .dr-reports7-readiness strong { display: block; margin: 3px 0 5px; color: var(--ui-ink); font-size: 13px; font-weight: 740; } .page-workspace .dr-reports7-readiness p { color: var(--ui-muted); font-size: 11px; line-height: 1.55; } .page-workspace .dr-reports7-readiness ul { display: grid; gap: 4px; margin: 7px 0 0; padding-left: 16px; } .page-workspace .dr-reports7-readiness li { color: var(--ui-ink); font-size: 11px; line-height: 1.5; } .page-workspace .dr-reports7-readiness__quality { margin-top: 8px; padding-top: 7px; border-top: 1px solid var(--ui-line-soft); font-family: 'IBM Plex Mono', monospace; font-size: 10px !important; } /**/ .page-workspace .dr-reports7-list { display: grid; gap: 9px; } .page-workspace .dr-reports7-row { display: grid; align-items: start; gap: 11px; padding: 13px 14px; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); background: var(--ui-white); grid-template-columns: minmax(0, 1.7fr) minmax(0, 1.1fr) auto; } .page-workspace .dr-reports7-row--draft { border-color: var(--ui-green); background: var(--ui-green-soft); } .page-workspace .dr-reports7-row__identity { min-width: 0; } .page-workspace .dr-reports7-row__titleline { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; } .page-workspace .dr-reports7-row__titleline strong { min-width: 0; overflow: hidden; color: var(--ui-ink); font-size: 13px; font-weight: 720; overflow-wrap: anywhere; } .page-workspace .dr-reports7-row__meta { margin-top: 3px; color: var(--ui-muted); font-size: 10px; line-height: 1.5; } .page-workspace .dr-reports7-row__detail { margin-top: 5px; color: var(--ui-subtle); font-size: 10px; line-height: 1.5; } .page-workspace .dr-reports7-row__actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; } .page-workspace .dr-reports7-badge { display: inline-flex; min-height: 21px; align-items: center; padding: 2px 8px; border: 1px solid var(--ui-line); border-radius: 999px; background: #f7f9f7; color: var(--ui-muted); font-size: 9px; font-weight: 760; letter-spacing: 0.02em; white-space: nowrap; } .page-workspace .dr-reports7-badge--draft { border-color: var(--ui-green); background: var(--ui-white); color: var(--ui-green); } .page-workspace .dr-reports7-badge--generated { border-color: #b9ddce; background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-reports7-badge--exported { border-color: #cfc7f2; background: var(--ui-violet-soft); color: var(--ui-violet); } .page-workspace .dr-reports7-badge--imported { border-color: var(--ui-line); background: var(--ui-paper); color: var(--ui-muted); } .page-workspace .dr-reports7-badge--unavailable { border-color: #ebc0bd; background: var(--ui-rose); color: var(--ui-danger); } /**/ .page-workspace .dr-reports7-evidence { min-width: 0; } .page-workspace .dr-reports7-evidence summary { cursor: pointer; color: var(--ui-green-2); font-size: 10px; font-weight: 720; } .page-workspace .dr-reports7-evidence ul { display: grid; gap: 5px; margin: 8px 0 0; padding: 0; list-style: none; } .page-workspace .dr-reports7-evidence li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 9px; border: 1px solid var(--ui-line-soft); border-radius: var(--ui-radius-sm); background: var(--ui-paper); } .page-workspace .dr-reports7-evidence strong { color: var(--ui-ink); font-size: 11px; font-weight: 700; } .page-workspace .dr-reports7-evidence__date { display: block; color: var(--ui-muted); font-size: 9px; } .page-workspace .dr-reports7-evidence__warning { margin-top: 7px; padding: 7px 9px; border: 1px solid #ead49d; border-radius: var(--ui-radius-sm); background: var(--ui-amber); color: var(--ui-warning); font-size: 10px; line-height: 1.5; } .page-workspace .dr-reports7-evidence__sections, .page-workspace .dr-reports7-evidence__empty { margin-top: 7px; color: var(--ui-muted); font-size: 10px; line-height: 1.5; } .page-workspace .dr-reports7-empty { padding: 24px 16px; border: 1px dashed var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-paper); color: var(--ui-muted); font-size: 11px; line-height: 1.55; text-align: center; } /**/ .page-workspace .dr-reports7-setup { margin-top: 4px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); background: var(--ui-white); } .page-workspace .dr-reports7-setup > summary { display: flex; align-items: center; gap: 8px; padding: 13px 16px; color: var(--ui-ink); cursor: pointer; font-size: 12px; font-weight: 720; } .page-workspace .dr-reports7-setup__body { display: grid; gap: 14px; padding: 0 14px 14px; } @container (max-width: 900px) { .page-workspace .dr-reports7-row { grid-template-columns: minmax(0, 1fr); } .page-workspace .dr-reports7-row__actions { justify-content: flex-start; } } @media (max-width: 620px) { .page-workspace .dr-reports7 { padding: 14px !important; } .page-workspace .dr-reports7-row__actions .dr-button { flex: 1 1 auto; justify-content: center; } .page-workspace .dr-reports7-evidence li { align-items: flex-start; flex-direction: column; gap: 6px; } .page-workspace .dr-reports7-setup__body { padding: 0 10px 12px; } } /**/ .page-workspace .dr-studio { min-width: 0; margin-bottom: 14px; padding: 18px !important; container-type: inline-size; } .page-workspace .dr-studio__head { margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--ui-line-soft); } .page-workspace .dr-studio__titleline { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px 11px; } .page-workspace .dr-studio__titleline h2 { margin: 2px 0 0; color: var(--ui-ink); font-size: clamp(18px, 2.2vw, 25px); font-weight: 760; letter-spacing: -0.03em; line-height: 1.12; } .page-workspace .dr-studio__count { display: inline-flex; min-height: 22px; align-items: center; padding: 2px 9px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--ui-paper); color: var(--ui-muted); font-size: 10px; font-weight: 720; } .page-workspace .dr-studio__head > p:last-child { margin-top: 6px; color: var(--ui-muted); font-size: 11px; line-height: 1.5; } .page-workspace .dr-studio__grid { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); } /**/ @container (min-width: 560px) { .page-workspace .dr-studio__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-studio-card--guardrailed { grid-column: 1 / -1; } } .page-workspace .dr-studio-card { display: flex; flex-direction: column; padding: 15px 16px 14px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); background: var(--ui-white); box-shadow: var(--ui-shadow-soft); } /**/ .page-workspace .dr-studio-card--guardrailed { border-left: 3px solid var(--ui-green-2); } .page-workspace .dr-studio-card__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; } .page-workspace .dr-studio-card__tier { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; background: var(--ui-green); color: var(--ui-white); font-size: 10px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; } .page-workspace .dr-studio-card__audience { color: var(--ui-muted); font-size: 11px; font-weight: 700; } .page-workspace .dr-studio-card__title { margin: 10px 0 0; color: var(--ui-ink); font-size: 17px; font-weight: 760; letter-spacing: -0.02em; line-height: 1.2; } .page-workspace .dr-studio-card__detail { margin-top: 6px; color: var(--ui-muted); font-size: 11.5px; line-height: 1.55; } .page-workspace .dr-studio-card__highlights { display: flex; flex-wrap: wrap; gap: 5px; margin: 11px 0 0; padding: 0; list-style: none; } .page-workspace .dr-studio-card__highlights li { padding: 3px 8px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--ui-paper); color: var(--ui-ink); font-size: 10.5px; font-weight: 660; } .page-workspace .dr-studio-card__foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 9px; margin-top: auto; padding-top: 13px; } .page-workspace .dr-studio-card__evidence { flex: 1 1 130px; min-width: 0; color: var(--ui-muted); font-size: 11px; font-weight: 640; line-height: 1.45; } .page-workspace .dr-studio-card__evidence--blocked { color: var(--ui-warning); } .page-workspace .dr-studio-card__actions { display: flex; flex-wrap: wrap; gap: 7px; } .page-workspace .dr-studio__create { margin-left: auto; } /**/ .page-workspace .dr-studio-editor { margin-top: 13px; padding-top: 13px; border-top: 1px solid var(--ui-line-soft); } .page-workspace .dr-studio-editor__head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 9px; margin-bottom: 11px; } .page-workspace .dr-studio-editor__name { flex: 1 1 180px; min-width: 0; } .page-workspace .dr-studio-editor__count { color: var(--ui-muted); font-size: 11px; font-weight: 700; white-space: nowrap; } .page-workspace .dr-studio-editor__list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; } .page-workspace .dr-studio-toggle { display: flex; align-items: flex-start; gap: 9px; width: 100%; padding: 9px 11px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-white); color: var(--ui-ink); cursor: pointer; text-align: left; } /**/ .page-workspace .dr-studio-toggle.is-on { border-color: var(--ui-green-2); box-shadow: inset 3px 0 0 var(--ui-green-2); } .page-workspace .dr-studio-toggle__box { display: flex; width: 16px; height: 16px; flex: 0 0 16px; align-items: center; justify-content: center; margin-top: 1px; border: 1px solid var(--ui-line); border-radius: 4px; background: var(--ui-white); color: var(--ui-white); } .page-workspace .dr-studio-toggle.is-on .dr-studio-toggle__box { border-color: var(--ui-green); background: var(--ui-green); } .page-workspace .dr-studio-toggle__text { min-width: 0; } .page-workspace .dr-studio-toggle__text strong { display: block; font-size: 12px; font-weight: 720; } .page-workspace .dr-studio-toggle__text span { display: block; margin-top: 2px; color: var(--ui-muted); font-size: 11px; line-height: 1.45; } .page-workspace .dr-studio-editor__foot { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; margin-top: 11px; } @media (max-width: 620px) { .page-workspace .dr-studio { padding: 14px !important; } .page-workspace .dr-studio-card__foot .dr-button { flex: 1 1 auto; justify-content: center; } } /**/ /**/ .page-workspace :where( .dr-destination-intro h2 ) { font: var(--dr-type-section) !important; letter-spacing: -0.035em !important; } .page-workspace :where( .dr-rides3-titleline h2, .dr-ride4-identity h2, .dr-compare5-panel__head h3, .dr-analysis6-titleline h3, .dr-reports7-titleline h2, .dr-overview2-section-heading h2 ) { font: var(--dr-type-section) !important; letter-spacing: -0.03em !important; } /**/ .page-workspace :where( .dr-ride4-intervals h3, .dr-ride4-finding__top h3, .dr-compare5-group__head h4, .dr-compare5-outcome h4, .dr-analysis6-trend__head h4, .dr-analysis6-flag-group h4, .dr-overview2-evidence-row__body h3 ) { font: var(--dr-type-card) !important; } /**/ @container (max-width: 540px) { .page-workspace .dr-compare5-filters { grid-template-columns: minmax(0, 1fr); } .page-workspace .dr-compare5-filter:not(.dr-compare5-filter--search), .page-workspace .dr-compare5-filter--search, .page-workspace .dr-compare5-date-range, .page-workspace .dr-compare5-range, .page-workspace .dr-compare5-elevation, .page-workspace .dr-compare5-flagged, .page-workspace .dr-compare5-comparable, .page-workspace .dr-compare5-filter-note { grid-column: 1; } } /**/ .page-workspace :where( .dr-rides3-filter > span, .dr-rides3-date-range > legend, .dr-rides3-cell__label, .dr-ride4-breadcrumb > span, .dr-ride4-score span, .dr-ride4-metrics span, .dr-ride4-finding__meaning > span, .dr-ride4-finding__severity, .dr-ride4-finding__confidence, .dr-ride4-cell-label, .dr-compare5-filter, .dr-compare5-filter > span, .dr-compare5-date-range legend, .dr-compare5-date-range span, .dr-compare5-range legend, .dr-compare5-range span, .dr-compare5-elevation legend, .dr-compare5-elevation__range span, .dr-compare5-read__label, .dr-compare5-diff-label, .dr-analysis6-filter, .dr-analysis6-date-range legend, .dr-analysis6-date-range label span, .dr-analysis6-trend__label, .dr-analysis6-filter__note, .dr-reports7-readiness__label ) { font-size: var(--dr-fs-label) !important; line-height: 1.35 !important; } /**/ .page-workspace :where( .dr-overview2-ride-row__identity span, .dr-overview2-ride-row__status, .dr-overview2-evidence-row__body p, .dr-overview2-evidence-row__body span, .dr-ride4-meta > span, .dr-ride4-evidence-strip span, .dr-ride4-finding__interval, .dr-ride4-finding__support, .dr-ride4-finding__meaning p, .dr-ride4-section-head > p, .dr-ride4-profile__summary, .dr-ride4-chart-help, .dr-ride4-interval-count, .dr-ride4-definitions dt, .dr-ride4-definitions dd, .dr-ride4-empty p, .dr-rides3-header__copy > p:last-child, .dr-rides3-ride-meta, .dr-rides3-evidence, .dr-rides3-status, .dr-compare5-chip__date, .dr-compare5-pick__meta, .dr-compare5-pick__values > span, .dr-compare5-tray__limit, .dr-compare5-tray__empty, .dr-compare5-diff-help, .dr-compare5-saved, .dr-analysis6-supporting__meta, .dr-analysis6-empty-note, .dr-analysis6-cell-meta, .dr-reports7-row__meta, .dr-reports7-row__detail, .dr-reports7-evidence__date, .dr-reports7-badge ) { font-size: var(--dr-fs-meta) !important; } /**/ .page-workspace :where( .dr-rides3-empty p, .dr-ride4-chart-state p, .dr-ride4-interval-empty p, .dr-compare5-outcome li strong, .dr-compare5-outcome li span, .dr-compare5-outcome__empty, .dr-analysis6-technical__list strong, .dr-analysis6-technical__list span, .dr-reports7-evidence__sections, .dr-reports7-evidence__empty ) { font-size: var(--dr-fs-meta) !important; } /**/ .page-workspace :where( .dr-overview2-ride-row__values span, .dr-ride4-metrics strong, .dr-rides3-cell--ride strong, .dr-analysis6-trend__figures strong, .dr-analysis6-trend__figures > div > span:not(.dr-analysis6-trend__label) ) { font-size: var(--dr-fs-metric) !important; } /**/ .page-workspace :where( .dr-rides3-cell, .dr-rides3-cell__value, .dr-ride4-interval-row, .dr-ride4-interval-row strong, .dr-ride4-interval-head ) { font-size: 11px !important; } .page-workspace :where( .dr-rides3-table__head, .dr-rides3-baseline, .dr-rides3-baseline-toggle, .dr-rides3-select-toggle, .dr-rides3-before-baseline, .dr-rides3-selected, .dr-ride4-severity ) { font-size: 10px !important; } .page-workspace .dr-rides3-table__head, .page-workspace .dr-rides3-row { grid-template-columns: 66px minmax(88px, 1.35fr) 56px 60px 52px 60px minmax(78px, 0.9fr) 96px 64px 78px 44px; } .page-workspace .dr-ride4-interval-head, .page-workspace .dr-ride4-interval-row { grid-template-columns: 92px minmax(112px, 1.2fr) 92px minmax(112px, 1fr) 110px; } /**/ @media (min-width: 981px) { .page-workspace .dr-rides3-table { overflow-x: auto; } .page-workspace .dr-rides3-table__head, .page-workspace .dr-rides3-table__body { min-width: 830px; } } /**/ .page-workspace [data-dr-overview], .page-workspace .dr-ride4-detail, .page-workspace .dr-compare5 { gap: var(--dr-space-gap) !important; } /**/ .page-workspace .dr-rides3-row { min-height: 56px; } .page-workspace .dr-analysis6-trend__copy, .page-workspace .dr-compare5-read p:last-child, .page-workspace .dr-reports7-readiness p { line-height: var(--dr-lh-body); } /**/ /**/ .page-workspace :where( .dr-overview2-evidence-row__number, .dr-rides3-titleline > span, .dr-rides3-results__bar, .dr-rides3-flagged, .dr-compare5-status, .dr-compare5-chart figcaption, .dr-analysis6-status, .dr-analysis6-severity, .dr-ride4-definitions > summary ) { font-size: var(--dr-fs-meta) !important; } /**/ .page-workspace :where( .dr-flag-narrative, .dr-flag-narrative__summary, .dr-flag-narrative__text ) { font-size: var(--dr-fs-meta) !important; line-height: var(--dr-lh-body) !important; } .page-workspace :where( .dr-flag-narrative__badge, .dr-flag-narrative__action, .dr-flag-narrative__label, .dr-flag-narrative__pill ) { font-size: var(--dr-fs-label) !important; line-height: var(--dr-lh-tight) !important; } /**/ .page-workspace :where(.dr-compare5-diff-head > span) { font-size: var(--dr-fs-label) !important; } .page-workspace th { font-size: var(--dr-fs-label) !important; } /**/ .page-workspace :where( .dr-rides3-cell--open .dr-button, .dr-rides3-more > summary, .dr-rides3-menu-item, .dr-ride4-finding .dr-button, .dr-ride4-interval-row .dr-button, .dr-ride4-profile .dr-profile-series-buttons .dr-button ) { font-size: 11px !important; } /**/ .page-workspace :where( .dr-rides3-date-range label > span, .dr-rides3-date-range input, .dr-compare5-step__number ) { font-size: 10px !important; } /**/ .page-workspace .dr-kicker, .page-workspace .dr-kicker-compact { font-size: var(--dr-fs-label) !important; } /**/ /**/ html.ops-ui body.page-workspace :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid var(--ui-violet) !important; outline-offset: 3px !important; box-shadow: 0 0 0 2px var(--ui-white) !important; } /**/ .page-workspace :where( button, summary, a.dr-button, input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea ) { min-width: 44px; min-height: 44px !important; } .page-workspace label:has(> input[type="checkbox"]), .page-workspace label:has(> input[type="radio"]) { min-height: 44px; } /**/ html.ops-ui.field-theme body.page-workspace .dr-global-sidebar .dr-sidebar-workflow__item { min-height: 44px !important; } @media (prefers-reduced-motion: reduce) { html:focus-within { scroll-behavior: auto !important; } html.ops-ui *, html.ops-ui *::before, html.ops-ui *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; transition-delay: 0ms !important; scroll-behavior: auto !important; } } /**/ /**/ .page-workspace :where( .dr-chart-frame, .dr-ride4-chart-wrap, .dr-compare5-chart, [data-dr-pedal-chart-wrap] ) { min-width: 0; max-width: 100%; overflow: hidden; } .page-workspace :where(.dr-chart-frame, .dr-compare5-chart, [data-dr-pedal-chart-wrap]) canvas { display: block; max-width: 100% !important; } @media (max-width: 640px) { /**/ .page-workspace .dr-client-workspace-nav .dr-workspace-tabs { overscroll-behavior-inline: contain; scroll-snap-type: inline proximity; touch-action: pan-x; } .page-workspace .dr-client-workspace-nav .dr-workspace-tab { scroll-snap-align: start; } /**/ .page-workspace .dr-client-primary-actions, .page-workspace .dr-rides3-header__actions, .page-workspace .dr-ride4-actions { min-width: 0; } .page-workspace .dr-client-primary-actions > *, .page-workspace .dr-rides3-header__actions > *, .page-workspace .dr-ride4-actions > * { min-width: 0; } } /**/ /**/ .page-workspace [class*="text-red-50"], .page-workspace [class*="text-red-100"], .page-workspace [class*="text-red-200"], .page-workspace [class*="text-red-300"], .page-workspace [class*="text-red-400"], .page-workspace [class*="text-rose-50"], .page-workspace [class*="text-rose-100"], .page-workspace [class*="text-rose-200"], .page-workspace [class*="text-rose-300"], .page-workspace [class*="text-rose-400"], .page-workspace [class*="text-pink-50"], .page-workspace [class*="text-pink-100"], .page-workspace [class*="text-pink-200"], .page-workspace [class*="text-pink-300"], .page-workspace [class*="text-pink-400"] { color: var(--ui-danger) !important; } .page-workspace [class*="text-green-50"], .page-workspace [class*="text-green-100"], .page-workspace [class*="text-green-200"], .page-workspace [class*="text-green-300"], .page-workspace [class*="text-green-400"], .page-workspace [class*="text-emerald-50"], .page-workspace [class*="text-emerald-100"], .page-workspace [class*="text-emerald-200"], .page-workspace [class*="text-emerald-300"], .page-workspace [class*="text-emerald-400"], .page-workspace [class*="text-teal-50"], .page-workspace [class*="text-teal-100"], .page-workspace [class*="text-teal-200"], .page-workspace [class*="text-teal-300"], .page-workspace [class*="text-teal-400"], .page-workspace [class*="text-lime-50"], .page-workspace [class*="text-lime-100"], .page-workspace [class*="text-lime-200"], .page-workspace [class*="text-lime-300"], .page-workspace [class*="text-lime-400"] { color: var(--ui-success) !important; } .page-workspace [class*="text-yellow-50"], .page-workspace [class*="text-yellow-100"], .page-workspace [class*="text-yellow-200"], .page-workspace [class*="text-yellow-300"], .page-workspace [class*="text-yellow-400"], .page-workspace [class*="text-amber-50"], .page-workspace [class*="text-amber-100"], .page-workspace [class*="text-amber-200"], .page-workspace [class*="text-amber-300"], .page-workspace [class*="text-amber-400"], .page-workspace [class*="text-orange-50"], .page-workspace [class*="text-orange-100"], .page-workspace [class*="text-orange-200"], .page-workspace [class*="text-orange-300"], .page-workspace [class*="text-orange-400"] { color: var(--ui-warning) !important; } .page-workspace [class*="text-blue-50"], .page-workspace [class*="text-blue-100"], .page-workspace [class*="text-blue-200"], .page-workspace [class*="text-blue-300"], .page-workspace [class*="text-blue-400"], .page-workspace [class*="text-sky-50"], .page-workspace [class*="text-sky-100"], .page-workspace [class*="text-sky-200"], .page-workspace [class*="text-sky-300"], .page-workspace [class*="text-sky-400"], .page-workspace [class*="text-cyan-50"], .page-workspace [class*="text-cyan-100"], .page-workspace [class*="text-cyan-200"], .page-workspace [class*="text-cyan-300"], .page-workspace [class*="text-cyan-400"], .page-workspace [class*="text-indigo-50"], .page-workspace [class*="text-indigo-100"], .page-workspace [class*="text-indigo-200"], .page-workspace [class*="text-indigo-300"], .page-workspace [class*="text-indigo-400"], .page-workspace [class*="text-violet-50"], .page-workspace [class*="text-violet-100"], .page-workspace [class*="text-violet-200"], .page-workspace [class*="text-violet-300"], .page-workspace [class*="text-violet-400"], .page-workspace [class*="text-purple-50"], .page-workspace [class*="text-purple-100"], .page-workspace [class*="text-purple-200"], .page-workspace [class*="text-purple-300"], .page-workspace [class*="text-purple-400"], .page-workspace [class*="text-fuchsia-50"], .page-workspace [class*="text-fuchsia-100"], .page-workspace [class*="text-fuchsia-200"], .page-workspace [class*="text-fuchsia-300"], .page-workspace [class*="text-fuchsia-400"] { color: var(--ui-violet) !important; } .page-workspace [class*="text-slate-50"], .page-workspace [class*="text-slate-100"], .page-workspace [class*="text-slate-200"], .page-workspace [class*="text-slate-300"], .page-workspace [class*="text-slate-400"], .page-workspace [class*="text-gray-50"], .page-workspace [class*="text-gray-100"], .page-workspace [class*="text-gray-200"], .page-workspace [class*="text-gray-300"], .page-workspace [class*="text-gray-400"], .page-workspace [class*="text-zinc-50"], .page-workspace [class*="text-zinc-100"], .page-workspace [class*="text-zinc-200"], .page-workspace [class*="text-zinc-300"], .page-workspace [class*="text-zinc-400"], .page-workspace [class*="text-neutral-50"], .page-workspace [class*="text-neutral-100"], .page-workspace [class*="text-neutral-200"], .page-workspace [class*="text-neutral-300"], .page-workspace [class*="text-neutral-400"], .page-workspace [class*="text-stone-50"], .page-workspace [class*="text-stone-100"], .page-workspace [class*="text-stone-200"], .page-workspace [class*="text-stone-300"], .page-workspace [class*="text-stone-400"] { color: #5c6660 !important; } /**/ .page-workspace .bg-red-400\/10, .page-workspace .bg-red-500\/10, .page-workspace .bg-red-500\/15, .page-workspace .bg-red-500\/20, .page-workspace .bg-red-500\/5, .page-workspace .bg-red-900\/40 { background-color: var(--ui-rose) !important; } .page-workspace .bg-emerald-400\/10, .page-workspace .bg-green-400\/10, .page-workspace .bg-green-500\/10, .page-workspace .bg-green-500\/20, .page-workspace .bg-green-900\/20 { background-color: var(--ui-mint) !important; } .page-workspace .bg-amber-300\/10, .page-workspace .bg-amber-400\/10, .page-workspace .bg-amber-500\/20, .page-workspace .bg-orange-900\/25, .page-workspace .bg-yellow-400\/10, .page-workspace .bg-yellow-500\/10, .page-workspace .bg-yellow-900\/20 { background-color: var(--ui-amber) !important; } .page-workspace .bg-blue-400\/10, .page-workspace .bg-blue-500\/10, .page-workspace .bg-cyan-500\/20, .page-workspace .bg-sky-400\/10 { background-color: var(--ui-violet-soft) !important; } .page-workspace .bg-gray-500\/20, .page-workspace .bg-slate-400\/10 { background-color: var(--ui-line-soft) !important; } /**/ .page-workspace .hover\:bg-red-500\/10:hover, .page-workspace .hover\:bg-red-500\/20:hover, .page-workspace .hover\:bg-red-500\/25:hover { background-color: #ffd4da !important; } /**/ .page-workspace .border-red-400\/30, .page-workspace .border-red-400\/35, .page-workspace .border-red-400\/40, .page-workspace .border-red-500\/20, .page-workspace .border-red-500\/30, .page-workspace .border-red-500\/40, .page-workspace .border-red-500\/50, .page-workspace .border-red-500\/60 { border-color: #eec3c8 !important; } .page-workspace .border-emerald-400\/40, .page-workspace .border-green-400\/30, .page-workspace .border-green-400\/35, .page-workspace .border-green-400\/40, .page-workspace .border-green-500\/25, .page-workspace .border-green-500\/30, .page-workspace .border-green-500\/40, .page-workspace .border-green-500\/50 { border-color: #b9e2cb !important; } .page-workspace .border-amber-300\/25, .page-workspace .border-amber-400\/40, .page-workspace .border-amber-500\/50, .page-workspace .border-orange-500\/40, .page-workspace .border-orange-500\/50, .page-workspace .border-yellow-400\/30, .page-workspace .border-yellow-400\/40, .page-workspace .border-yellow-500\/30, .page-workspace .border-yellow-500\/40 { border-color: #ecd9a3 !important; } .page-workspace .border-blue-400\/40, .page-workspace .border-blue-500\/50, .page-workspace .border-cyan-500\/50, .page-workspace .border-sky-400\/40 { border-color: #cfc9f5 !important; } .page-workspace .border-gray-500\/50, .page-workspace .border-slate-400\/40 { border-color: var(--ui-line) !important; } .page-workspace .hover\:border-red-500\/50:hover { border-color: #eec3c8 !important; } /**/ /**/ .page-workspace .dr-input.pl-9 { padding-left: 2.25rem; } .page-workspace .dr-input.pl-10 { padding-left: 2.5rem; } .page-workspace .dr-input.pl-11 { padding-left: 2.75rem; } .page-workspace .dr-input.pl-12 { padding-left: 3rem; } .page-workspace .dr-input.pr-9 { padding-right: 2.25rem; } .page-workspace .dr-input.pr-10 { padding-right: 2.5rem; } .page-workspace .dr-input.pr-11 { padding-right: 2.75rem; } .page-workspace .dr-input.pr-12 { padding-right: 3rem; } /**/ .page-workspace .dr-analysis6-supporting li > span:first-child { flex: 1 1 auto; min-width: 0; } .page-workspace .dr-analysis6-supporting li > .dr-button { flex: 0 0 auto; white-space: nowrap; } .page-workspace .dr-analysis6-supporting__meta { overflow-wrap: break-word; } /**/ .page-workspace .dr-statcard { container-type: inline-size; } .page-workspace .dr-statcard__value { font-size: 1.25rem; line-height: 1.25; word-break: normal; overflow-wrap: break-word; hyphens: none; } @container (max-width: 200px) { .page-workspace .dr-statcard__value { font-size: 1rem; } } @container (max-width: 150px) { .page-workspace .dr-statcard__value { font-size: 0.8125rem; } } /**/ .page-workspace .dr-evidence-card { container-type: inline-size; } .page-workspace .dr-evidence-card-head { flex-wrap: wrap; } /**/ @container (max-width: 240px) { .page-workspace .dr-evidence-card-head { flex-direction: column; align-items: flex-start; gap: 6px; } .page-workspace .dr-evidence-card-title { min-height: 2.4em; } } .page-workspace .dr-evidence-card-title { flex: 1 1 auto; min-width: 0; } .page-workspace .dr-evidence-card-status { flex: 0 0 auto; } /**/ .page-workspace .dr-evidence-card-metrics { grid-template-columns: repeat(auto-fit, minmax(3.5rem, 1fr)); } .page-workspace .dr-evidence-card-metrics .font-mono { white-space: nowrap; } /**/ @container (max-width: 130px) { .page-workspace .dr-evidence-card-metrics { grid-template-columns: minmax(0, 1fr); } .page-workspace .dr-evidence-card-metrics .font-mono { white-space: normal; } } /**/ /**/ .page-workspace .dr-client-sidebar__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; } /**/ .page-workspace .dr-client-collapse { display: none; width: 44px; height: 44px; flex: 0 0 auto; place-items: center; padding: 0; border: 1px solid var(--ui-line); border-radius: 10px; background: var(--ui-white); color: var(--ui-muted); cursor: pointer; font-size: 15px; line-height: 1; transition: border-color 140ms ease, background 140ms ease, color 140ms ease; } .page-workspace .dr-client-collapse:hover { border-color: #cfc9f5; background: var(--ui-violet-soft); color: var(--ui-violet); } .page-workspace .dr-client-collapse:focus-visible { outline: 2px solid var(--ui-violet); outline-offset: 2px; } /**/ .page-workspace .dr-client-rail { display: none; align-items: center; flex-direction: column; gap: 10px; padding: 4px 0 14px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); background: var(--ui-white); } .page-workspace .dr-client-rail__count { min-width: 22px; padding: 2px 4px; border-radius: 7px; background: var(--ui-violet-soft); color: var(--ui-violet); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; font-weight: 700; text-align: center; } /**/ .page-workspace .dr-client-rail__label { color: var(--ui-muted); font-size: 10px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; writing-mode: vertical-rl; } @media (min-width: 901px) { .page-workspace .dr-client-collapse { display: grid; } .page-workspace .dr-client-sidebar.is-collapsed .dr-client-rail { display: flex; /**/ margin-block-end: 0; } .page-workspace .dr-client-sidebar.is-collapsed [data-dr-client-panel] { display: none; } html.ops-ui body.page-workspace .dr-workspace-shell.is-clients-collapsed, html.ops-ui.field-theme body.page-workspace .dr-workspace-shell.is-clients-collapsed { grid-template-columns: 56px minmax(0, 1fr) !important; } /**/ .page-workspace .dr-app-shell.is-nav-collapsed { grid-template-columns: 64px minmax(0, 1fr); } .page-workspace .dr-global-sidebar.is-collapsed .dr-topbar { padding: 22px 10px 16px !important; } /**/ .page-workspace .dr-global-sidebar.is-collapsed .dr-app-brand { margin: 0 0 24px; justify-content: center; } .page-workspace .dr-global-sidebar.is-collapsed .dr-app-brand > div:last-child { display: none; } .page-workspace .dr-global-sidebar.is-collapsed .dr-button, .page-workspace .dr-global-sidebar.is-collapsed .dr-app-menu-item, .page-workspace .dr-global-sidebar.is-collapsed .dr-app-more > summary, .page-workspace .dr-global-sidebar.is-collapsed .dr-sidebar-workflow > summary, .page-workspace .dr-global-sidebar.is-collapsed .dr-sidebar-workflow__item { justify-content: center !important; gap: 0 !important; padding: 0 !important; } /**/ .page-workspace .dr-global-sidebar.is-collapsed .dr-button > span, .page-workspace .dr-global-sidebar.is-collapsed .dr-app-menu-item > span, .page-workspace .dr-global-sidebar.is-collapsed .dr-app-more > summary > span, .page-workspace .dr-global-sidebar.is-collapsed .dr-sidebar-workflow > summary > span:not(.dr-sidebar-workflow__current), .page-workspace .dr-global-sidebar.is-collapsed .dr-sidebar-workflow__item > span:not(.dr-required-mark) { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } /**/ .page-workspace .dr-global-sidebar.is-collapsed .dr-sidebar-workflow__current, .page-workspace .dr-global-sidebar.is-collapsed .dr-sidebar-workflow__caret, .page-workspace .dr-global-sidebar.is-collapsed .dr-required-mark, .page-workspace .dr-global-sidebar.is-collapsed .dr-billing-status { display: none !important; } .page-workspace .dr-global-sidebar.is-collapsed .dr-account-identity { grid-template-columns: 36px; justify-content: center; padding-inline: 0; } .page-workspace .dr-global-sidebar.is-collapsed .dr-account-identity__copy { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } /**/ .page-workspace .dr-global-sidebar.is-collapsed .dr-sidebar-workflow__menu, .page-workspace .dr-global-sidebar.is-collapsed .dr-app-more-panel { margin: 4px 0 7px !important; padding: 0 !important; border: 0 !important; } /**/ .page-workspace .dr-global-sidebar.is-collapsed .dr-sidebar-workflow__item, .page-workspace .dr-global-sidebar.is-collapsed .dr-app-more-panel .dr-app-menu-item { min-width: 44px !important; min-height: 44px !important; } /**/ .page-workspace .dr-global-sidebar.is-collapsed .dr-upload-inbox > summary { position: relative; } .page-workspace .dr-global-sidebar.is-collapsed .dr-upload-inbox > summary > .dr-upload-inbox__count { position: absolute; top: 3px; right: 5px; width: auto; height: auto; margin: 0; overflow: visible; clip-path: none; } } @media (prefers-reduced-motion: reduce) { .page-workspace .dr-client-collapse { transition: none !important; } } /**/ .page-workspace .dr-convergence-banner { display: grid; gap: 8px; padding: 18px 20px; border: 1px solid var(--ui-line); border-left: 4px solid var(--ui-violet); border-radius: var(--ui-radius); background: var(--ui-white); box-shadow: var(--ui-shadow-soft); } .page-workspace .dr-convergence-banner--parity { border-left-color: var(--ui-success); background: var(--ui-mint); } .page-workspace .dr-convergence-banner--guarding { border-left-color: var(--ui-violet); background: var(--ui-violet-soft); } .page-workspace .dr-convergence-banner__code { margin: 0; color: var(--ui-muted); } .page-workspace .dr-convergence-banner__title { margin: 0; color: var(--ui-ink); font-size: 15px; font-weight: 800; line-height: 1.3; letter-spacing: 0.02em; text-transform: uppercase; } .page-workspace .dr-convergence-banner__body, .page-workspace .dr-convergence-banner__question, .page-workspace .dr-convergence-banner__note { margin: 0; max-width: 68ch; color: var(--ui-ink); font-size: 13px; line-height: 1.5; } .page-workspace .dr-convergence-banner__question { font-weight: 700; } .page-workspace .dr-convergence-banner__note { color: var(--ui-muted); font-size: 12px; } .page-workspace .dr-convergence-banner__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 2px; } /**/ .page-workspace .dr-convergence-state { margin: 12px 0 0; padding: 10px 12px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-white); color: var(--ui-ink); font-size: 13px; line-height: 1.45; } .page-workspace .dr-convergence-state[data-dr-convergence-state="active"] { border-color: var(--ui-success); background: var(--ui-mint); } .page-workspace .dr-convergence-metrics { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 12px; } .page-workspace .dr-convergence-metric { display: grid; gap: 2px; min-width: 0; } .page-workspace .dr-convergence-metric strong { color: var(--ui-ink); font-size: 15px; font-weight: 800; } .page-workspace .dr-convergence-context { display: grid; gap: 4px; padding: 12px 14px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-green-soft); } .page-workspace .dr-convergence-context p { margin: 0; max-width: 68ch; color: var(--ui-ink); font-size: 12px; line-height: 1.5; } .page-workspace .dr-convergence-context[data-dr-convergence-context="inactive"] { background: var(--ui-white); } /**/ .page-workspace .dr-settings-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; padding: 8px; border-bottom: 1px solid var(--ui-line); background: var(--ui-paper); } .page-workspace .dr-settings-tab { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; gap: 8px; padding: 10px 16px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--ui-muted); font-size: 12px; font-weight: 800; letter-spacing: 0.04em; cursor: pointer; transition: background 140ms ease, border-color 140ms ease, color 140ms ease; } .page-workspace .dr-settings-tab:hover { border-color: var(--ui-line); background: var(--ui-white); color: var(--ui-text); } .page-workspace .dr-settings-tab.is-active, .page-workspace .dr-settings-tab[aria-selected="true"] { border-color: rgb(var(--color-primary) / 0.35); background: rgb(var(--color-primary) / 0.1); color: var(--ui-text); } .page-workspace .dr-settings-tab:focus-visible { outline: 2px solid var(--ui-violet); outline-offset: 2px; } .page-workspace .dr-settings-tab-panel { padding: 24px; } .page-workspace .dr-settings-branding-grid { align-items: start; } .page-workspace .dr-settings-tab-panel .dr-settings-group { padding: 20px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); background: var(--ui-white); } .page-workspace .dr-settings-system-grid { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 20px; align-items: start; } .page-workspace .dr-settings-dropzone { display: flex; min-height: 112px; align-items: center; justify-content: center; gap: 12px; padding: 20px; border: 1px dashed var(--dr-border-strong); border-radius: var(--ui-radius); background: var(--ui-paper); color: var(--ui-muted); cursor: pointer; text-align: left; transition: border-color 140ms ease, background 140ms ease, color 140ms ease; } .page-workspace .dr-settings-dropzone:hover, .page-workspace .dr-settings-dropzone:focus-within { border-color: rgb(var(--color-primary) / 0.7); background: rgb(var(--color-primary) / 0.07); color: var(--ui-text); } .page-workspace .dr-settings-dropzone-copy { display: grid; gap: 3px; } .page-workspace .dr-settings-dropzone-copy strong { color: var(--ui-text); font-size: 13px; } .page-workspace .dr-settings-dropzone-copy span { font-size: 11px; } .page-workspace .dr-settings-danger-zone { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px; border: 1px solid rgb(220 38 38 / 0.28); border-radius: var(--ui-radius); background: rgb(220 38 38 / 0.07); } .page-workspace .dr-settings-danger-zone strong { color: var(--ui-text); font-size: 13px; } .page-workspace .dr-settings-danger-zone p { margin-top: 4px; color: var(--ui-muted); font-size: 12px; line-height: 1.5; } .page-workspace .dr-session-config-block { display: grid; gap: 14px; } @media (min-width: 1280px) { .page-workspace .dr-settings-branding-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); } .page-workspace .dr-settings-branding-grid > .dr-settings-form { grid-column: span 7 / span 7; } .page-workspace .dr-settings-branding-grid > :last-child { grid-column: span 5 / span 5; } } @media (max-width: 1180px) { .page-workspace .dr-settings-system-grid { grid-template-columns: 1fr; } .page-workspace .dr-settings-preview { position: static; } } @media (max-width: 760px) { .page-workspace .dr-settings-tabs { grid-template-columns: 1fr; } .page-workspace .dr-settings-tab { justify-content: flex-start; } .page-workspace .dr-settings-tab-panel { padding: 16px; } .page-workspace .dr-settings-tab-panel .dr-settings-group { padding: 16px; } .page-workspace .dr-settings-danger-zone { align-items: stretch; flex-direction: column; } .page-workspace .dr-settings-danger-zone .dr-button { width: 100%; } } /**/ .page-workspace .dr-recovery-mode-card { overflow: hidden; } .page-workspace .dr-recovery-mode-body { gap: 14px; } /**/ .page-workspace .dr-studio{min-width:0;margin-bottom:16px;padding:22px!important;container-type:inline-size} .page-workspace .dr-studio__head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:0;padding:0 0 18px;border:0} .page-workspace .dr-studio__head h2{margin:3px 0 0;color:var(--ui-ink);font-size:clamp(22px,3vw,32px);font-weight:780;letter-spacing:-.035em;line-height:1.05} .page-workspace .dr-studio__head h2 span{color:var(--ui-muted);font-weight:620} .page-workspace .dr-studio__head>p:last-child{max-width:520px;margin:0;color:var(--ui-muted);font-size:12px;line-height:1.55;text-align:right} .page-workspace .dr-studio-zone{padding-top:18px;border-top:1px solid var(--ui-line-soft)} .page-workspace .dr-studio-zone+.dr-studio-zone{margin-top:20px} .page-workspace .dr-studio-zone__head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:12px} .page-workspace .dr-studio-zone__head h3,.page-workspace .dr-studio-config-panel__head h3{margin-top:3px;color:var(--ui-ink);font-size:17px;font-weight:750;letter-spacing:-.02em} .page-workspace .dr-studio__grid{display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr))} .page-workspace .dr-studio-card{--studio-tone:var(--ui-green-2);--studio-tint:var(--ui-green-soft);display:block;min-width:0;padding:0;border:1px solid var(--ui-line);border-radius:var(--ui-radius);overflow:hidden;background:var(--ui-white);box-shadow:none;transition:border-color 150ms ease,box-shadow 150ms ease,transform 150ms ease} .page-workspace .dr-studio-card--tier-b{--studio-tone:#356fbe;--studio-tint:#eef5ff}.page-workspace .dr-studio-card--tier-c{--studio-tone:#7655a8;--studio-tint:#f5f0fc}.page-workspace .dr-studio-card--tier-d{--studio-tone:#356fbe;--studio-tint:#eef5ff} .page-workspace .dr-studio-card--tier-e{--studio-tone:#0f6f7d;--studio-tint:#edf6f8} .page-workspace .dr-studio-card:hover{border-color:var(--studio-tone);transform:translateY(-1px)} .page-workspace .dr-studio-card.is-selected{border-color:var(--studio-tone);background:var(--studio-tint);box-shadow:0 0 0 2px color-mix(in srgb,var(--studio-tone) 18%,transparent),var(--ui-shadow-soft)} .page-workspace .dr-studio-card__select{position:relative;display:flex;align-items:flex-start;gap:12px;width:100%;height:100%;min-height:158px;padding:15px;border:0;background:transparent;color:var(--ui-ink);cursor:pointer;text-align:left} .page-workspace .dr-studio-card__icon{display:flex;width:34px;height:34px;flex:0 0 34px;align-items:center;justify-content:center;border-radius:10px;background:var(--studio-tone);color:#fff} .page-workspace .dr-studio-card__body{display:flex;min-width:0;flex:1;flex-direction:column;align-self:stretch}.page-workspace .dr-studio-card__head{display:flex;align-items:center;justify-content:space-between;gap:8px} .page-workspace .dr-studio-card__tier,.page-workspace .dr-studio-card__custom{padding:0;background:transparent;color:var(--studio-tone);font-size:10px;font-weight:820;letter-spacing:.08em;text-transform:uppercase}.page-workspace .dr-studio-card__custom{color:var(--ui-muted);letter-spacing:.03em} .page-workspace .dr-studio-card__title{display:block;margin-top:7px;color:var(--ui-ink);font-size:15px;font-weight:760;letter-spacing:-.015em} .page-workspace .dr-studio-card__pages{align-self:flex-start;margin-top:6px;padding:2px 8px;border:1px solid var(--ui-line);border-radius:999px;color:var(--ui-ink);font-size:10px;font-weight:720;line-height:1.4} .page-workspace .dr-studio-card__detail{display:-webkit-box;margin-top:5px;overflow:hidden;color:var(--ui-muted);font-size:10.5px;line-height:1.45;-webkit-box-orient:vertical;-webkit-line-clamp:3} .page-workspace .dr-studio-card__evidence{display:flex;align-items:center;gap:5px;flex:0 0 auto;margin-top:auto;padding-top:10px;color:var(--ui-success);font-size:10px;font-weight:700}.page-workspace .dr-studio-card__evidence--blocked{color:var(--ui-warning)} .page-workspace .dr-studio-card__selected{position:absolute;top:10px;right:10px;display:flex;width:22px;height:22px;align-items:center;justify-content:center;border-radius:999px;background:var(--studio-tone);color:#fff} .page-workspace .dr-studio-workspace{display:grid;align-items:stretch;gap:14px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .page-workspace .dr-studio-config-panel{display:flex;min-width:0;flex-direction:column;padding:17px;border:1px solid var(--ui-line);border-radius:var(--ui-radius);background:var(--ui-white);box-shadow:var(--ui-shadow-soft)} .page-workspace .dr-studio-config-panel__head{display:flex;align-items:start;justify-content:space-between;gap:12px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--ui-line-soft)} .page-workspace .dr-studio-config-panel__count,.page-workspace .dr-studio-readiness{display:inline-flex;min-height:24px;align-items:center;gap:5px;padding:3px 9px;border:1px solid var(--ui-line);border-radius:999px;background:var(--ui-paper);color:var(--ui-muted);font-size:10px;font-weight:780;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap} .page-workspace .dr-studio-readiness.is-ready{border-color:#b9ddce;background:var(--ui-mint);color:var(--ui-success)}.page-workspace .dr-studio-readiness.needs-evidence{border-color:#ead49d;background:var(--ui-amber);color:var(--ui-warning)} .page-workspace .dr-studio-lock{display:flex;align-items:flex-start;gap:12px;min-height:205px;padding:18px;border:1px solid #b9ddce;border-radius:var(--ui-radius-sm);background:var(--ui-green-soft)} .page-workspace .dr-studio-lock__icon{display:flex;width:32px;height:32px;flex:0 0 32px;align-items:center;justify-content:center;border-radius:9px;background:var(--ui-green);color:#fff}.page-workspace .dr-studio-lock strong{color:var(--ui-ink);font-size:13px;font-weight:750}.page-workspace .dr-studio-lock p{max-width:440px;margin-top:5px;color:var(--ui-muted);font-size:11px;line-height:1.55} .page-workspace .dr-studio-lock__chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px}.page-workspace .dr-studio-lock__chips span{padding:4px 8px;border:1px solid #b9ddce;border-radius:999px;background:var(--ui-white);color:var(--ui-green-2);font-size:10px;font-weight:700} .page-workspace .dr-studio-preset-name{margin-bottom:10px}.page-workspace .dr-studio-editor__list{display:grid;gap:6px;margin:0;padding:0;list-style:none} .page-workspace .dr-studio-toggle{display:flex;align-items:flex-start;gap:9px;width:100%;padding:9px 10px;border:1px solid var(--ui-line-soft);border-radius:var(--ui-radius-sm);background:var(--ui-white);color:var(--ui-ink);cursor:pointer;text-align:left}.page-workspace .dr-studio-toggle:hover{border-color:var(--ui-green-2)}.page-workspace .dr-studio-toggle.is-on{border-color:#b9ddce;background:var(--ui-green-soft);box-shadow:none} .page-workspace .dr-studio-toggle__box{display:flex;width:17px;height:17px;flex:0 0 17px;align-items:center;justify-content:center;margin-top:1px;border:1px solid var(--ui-line);border-radius:5px;background:var(--ui-white);color:#fff}.page-workspace .dr-studio-toggle.is-on .dr-studio-toggle__box{border-color:var(--ui-green);background:var(--ui-green)} .page-workspace .dr-studio-toggle__text strong{display:block;font-size:11.5px;font-weight:720}.page-workspace .dr-studio-toggle__text span{display:block;margin-top:2px;color:var(--ui-muted);font-size:10px;line-height:1.4} .page-workspace .dr-studio-editor__foot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:12px}.page-workspace .dr-studio-autosave,.page-workspace .dr-studio-speed{display:flex;align-items:center;gap:5px;color:var(--ui-muted);font-size:10px;font-weight:650} .page-workspace .dr-studio-commentary{min-height:166px;resize:vertical;font-size:12px;line-height:1.55}.page-workspace .dr-studio-character-count{margin-top:5px;color:var(--ui-muted);font-family:'IBM Plex Mono',monospace;font-size:10px;font-weight:650;text-align:right}.page-workspace .dr-studio-action-panel__evidence{margin-top:10px;color:var(--ui-muted);font-size:10.5px;line-height:1.5} .page-workspace .dr-studio-action-panel__actions{display:flex;justify-content:flex-end;gap:8px;margin-top:auto;padding-top:16px}.page-workspace .dr-studio-speed{justify-content:flex-end;margin-top:8px} .page-workspace .dr-client-context-menu{position:fixed;z-index:260;min-width:190px;padding:6px;border:1px solid rgb(255 255 255/16%);border-radius:8px;background:#151b18;box-shadow:0 18px 48px rgb(0 0 0/45%)}.page-workspace .dr-client-context-menu[hidden]{display:none}.page-workspace .dr-client-context-menu__delete{display:flex;width:100%;align-items:center;gap:9px;padding:9px 10px;border:0;border-radius:6px;background:transparent;color:#fecaca;cursor:pointer;font-size:12px;font-weight:750;text-align:left}.page-workspace .dr-client-context-menu__delete:hover,.page-workspace .dr-client-context-menu__delete:focus-visible{outline:none;background:rgb(239 68 68/16%);color:#fff} .page-workspace .dr-studio-archive{margin-top:16px}.page-workspace .dr-studio-archive__head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:13px;padding-bottom:12px;border-bottom:1px solid var(--ui-line-soft)}.page-workspace .dr-studio-archive__head>div>p:last-child{margin-top:6px;color:var(--ui-muted);font-size:11px;line-height:1.5} .page-workspace .dr-studio-archive__search{display:flex;width:min(260px,100%);min-height:36px;align-items:center;gap:8px;padding:0 11px;border:1px solid var(--ui-line);border-radius:var(--ui-radius-sm);background:var(--ui-white);color:var(--ui-muted)}.page-workspace .dr-studio-archive__search:focus-within{border-color:var(--ui-green-2);box-shadow:0 0 0 2px var(--ui-green-soft)}.page-workspace .dr-studio-archive__search input{width:100%;border:0;outline:0;background:transparent;color:var(--ui-ink);font-size:11px} .page-workspace .dr-studio-archive__list{display:grid;gap:7px}.page-workspace .dr-studio-archive-row{display:grid;align-items:center;gap:14px;padding:11px 12px;border:1px solid var(--ui-line-soft);border-radius:var(--ui-radius-sm);background:var(--ui-white);grid-template-columns:105px minmax(0,1fr) auto}.page-workspace .dr-studio-archive-row[hidden]{display:none} .page-workspace .dr-studio-archive-row time{color:var(--ui-muted);font-family:'IBM Plex Mono',monospace;font-size:10px;white-space:nowrap}.page-workspace .dr-studio-archive-row__identity{min-width:0}.page-workspace .dr-studio-archive-row__identity strong,.page-workspace .dr-studio-archive-row__identity span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.page-workspace .dr-studio-archive-row__identity strong{color:var(--ui-ink);font-size:12px;font-weight:730}.page-workspace .dr-studio-archive-row__identity span{margin-top:2px;color:var(--ui-muted);font-size:10px}.page-workspace .dr-studio-archive-row__actions{display:flex;gap:6px} .page-workspace .dr-studio-archive__empty{display:flex;min-height:150px;align-items:center;justify-content:center;flex-direction:column;gap:6px;border:1px dashed var(--ui-line);border-radius:var(--ui-radius-sm);background:var(--ui-paper);color:var(--ui-muted);text-align:center}.page-workspace .dr-studio-archive__empty>i{font-size:24px}.page-workspace .dr-studio-archive__empty strong{color:var(--ui-ink);font-size:12px}.page-workspace .dr-studio-archive__empty p{font-size:10.5px} .page-workspace .dr-studio-modal{position:fixed;z-index:220;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:rgb(13 20 17/72%);backdrop-filter:blur(4px)}.page-workspace .dr-studio-modal__dialog{width:min(920px,100%);max-height:min(820px,calc(100vh - 48px));overflow:hidden;border:1px solid var(--ui-line);border-radius:16px;background:var(--ui-paper);box-shadow:0 30px 80px rgb(0 0 0/35%)} .page-workspace .dr-studio-modal__head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 17px;border-bottom:1px solid var(--ui-line);background:var(--ui-white)}.page-workspace .dr-studio-modal__head h2{margin-top:2px;color:var(--ui-ink);font-size:18px;font-weight:760}.page-workspace .dr-studio-modal__body{display:grid;gap:22px;max-height:calc(100vh - 132px);overflow:auto;padding:24px;grid-template-columns:minmax(0,1fr) 220px} .page-workspace .dr-studio-preview-page{position:relative;min-height:570px;padding:34px 38px;overflow:hidden;border:1px solid #c7d2cc;border-radius:2px;background:#fff;box-shadow:0 14px 36px rgb(31 57 47/12%);color:#1e2623}.page-workspace .dr-studio-preview-page::before{display:block;width:92px;height:92px;margin:0 auto 22px;background:url('../src/logo.png') center/contain no-repeat;content:""}.page-workspace .dr-studio-preview-page__brand{display:flex;align-items:center;justify-content:space-between;color:#5c6c65;font-size:10px;font-weight:500;letter-spacing:0}.page-workspace .dr-studio-preview-page__brand span:last-child{color:#7a8982;font-size:8px;letter-spacing:.08em;text-transform:uppercase}.page-workspace .dr-studio-preview-page__eyebrow{margin-top:25px;color:#0e4333;font-size:8px;font-weight:780;letter-spacing:.08em;text-transform:uppercase}.page-workspace .dr-studio-preview-page h3{max-width:92%;margin-top:7px;color:#0e4333;font-size:30px;font-weight:780;letter-spacing:-.035em;line-height:1.05}.page-workspace .dr-studio-preview-page__client{margin-top:7px;color:#5c6c65;font-size:13px}.page-workspace .dr-studio-preview-page__rule{height:1px;margin:19px 0 24px;background:#b88b2d}.page-workspace .dr-studio-preview-page h4{margin-bottom:9px;color:#0e4333;font-size:11px;font-weight:760} .page-workspace .dr-studio-preview-page ul{display:grid;gap:0;margin:0;padding:0;border:1px solid #becdc6;list-style:none}.page-workspace .dr-studio-preview-page li{display:flex;align-items:center;gap:8px;padding:7px 9px;border-bottom:1px solid #c8d5cf;background:#fff;color:#28352f;font-size:10.5px}.page-workspace .dr-studio-preview-page li:nth-child(even){background:#e6efeb}.page-workspace .dr-studio-preview-page li:last-child{border-bottom:0}.page-workspace .dr-studio-preview-page li i{color:#0e4333}.page-workspace .dr-studio-preview-page__commentary{display:grid;margin-top:20px;padding:0;border:1px solid #0e4333;background:#e6efeb;grid-template-columns:112px 1fr}.page-workspace .dr-studio-preview-page__commentary h4{display:flex;align-items:center;margin:0;padding:12px;background:#0e4333;color:#fff;font-size:9px}.page-workspace .dr-studio-preview-page__commentary p{margin:0;padding:12px;color:#28352f;font-size:10.5px;line-height:1.5;white-space:pre-line}.page-workspace .dr-studio-preview-page footer{margin-top:34px;padding-top:9px;border-top:1px solid #becdc6;color:#6d7c75;font-size:8.5px} .page-workspace .dr-studio-modal__summary{align-self:start;padding:17px;border:1px solid var(--ui-line);border-radius:var(--ui-radius);background:var(--ui-white)}.page-workspace .dr-studio-modal__summary h3{margin-top:3px;color:var(--ui-ink);font-size:16px;font-weight:750}.page-workspace .dr-studio-modal__summary dl{display:grid;gap:0;margin-top:15px}.page-workspace .dr-studio-modal__summary dl>div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--ui-line-soft);font-size:10px}.page-workspace .dr-studio-modal__summary dt{color:var(--ui-muted)}.page-workspace .dr-studio-modal__summary dd{color:var(--ui-ink);font-weight:720;text-align:right}.page-workspace .dr-studio-modal__generate{width:100%;justify-content:center;margin-top:16px} @container (max-width:820px){.page-workspace .dr-studio-workspace{grid-template-columns:minmax(0,1fr)}}@container (max-width:620px){.page-workspace .dr-studio__grid{grid-template-columns:minmax(0,1fr)}.page-workspace .dr-studio-card__select{min-height:0}.page-workspace .dr-studio-card__detail{-webkit-line-clamp:2}} @media (max-width:700px){.page-workspace .dr-studio,.page-workspace .dr-studio-archive{padding:14px!important}.page-workspace .dr-studio__head,.page-workspace .dr-studio-zone__head,.page-workspace .dr-studio-archive__head{align-items:stretch;flex-direction:column;gap:10px}.page-workspace .dr-studio__head>p:last-child{text-align:left}.page-workspace .dr-studio-archive__search{width:100%}.page-workspace .dr-studio-archive-row{align-items:start;grid-template-columns:minmax(0,1fr)}.page-workspace .dr-studio-archive-row__actions,.page-workspace .dr-studio-action-panel__actions{justify-content:stretch}.page-workspace .dr-studio-archive-row__actions .dr-button,.page-workspace .dr-studio-action-panel__actions .dr-button{flex:1;justify-content:center}.page-workspace .dr-studio-modal{padding:10px}.page-workspace .dr-studio-modal__dialog{max-height:calc(100vh - 20px)}.page-workspace .dr-studio-modal__body{grid-template-columns:minmax(0,1fr)}.page-workspace .dr-studio-preview-page{min-height:500px;padding:25px}} /**/ html.ops-ui body.page-workspace .dr-global-sidebar :where(a, button, label, summary, input, select, textarea, [tabindex]):not(.dr-sidebar-workflow__item):focus-visible { outline: 3px solid var(--ui-lime) !important; outline-offset: 2px !important; box-shadow: 0 0 0 2px rgba(8, 9, 8, 0.85) !important; } /**/ .page-workspace .dr-leak-card { overflow: hidden; } /**/ .page-workspace .dr-leak-card__controls { display: flex; justify-content: flex-end; } /**/ .page-workspace .dr-leak-toggle { display: inline-flex; flex: none; align-items: center; gap: 7px; min-height: 38px; padding: 0 14px; border: 1px solid rgba(83, 99, 90, 0.28); border-radius: 999px; background: rgba(255, 255, 255, 0.9); color: var(--ui-muted); font-size: 12px; font-weight: 700; letter-spacing: 0.02em; cursor: pointer; } .page-workspace .dr-leak-toggle__state { color: var(--ui-ink); font-weight: 800; } .page-workspace .dr-leak-toggle--on { border-color: rgba(39, 114, 84, 0.5); background: rgba(39, 114, 84, 0.12); color: #1d5b43; } .page-workspace .dr-leak-toggle--on .dr-leak-toggle__state { color: #14452f; } .page-workspace .dr-leak-card__body { display: grid; gap: 12px; } /**/ .page-workspace .dr-leak-hero-grid { display: grid; align-items: stretch; gap: 12px; grid-template-columns: minmax(0, 1.45fr) minmax(210px, 0.75fr); } .page-workspace .dr-leak-hero { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; margin: 0; } .page-workspace .dr-leak-hero strong { color: var(--ui-ink); font-size: clamp(32px, 5vw, 46px); font-weight: 780; letter-spacing: -0.04em; line-height: 1; } .page-workspace .dr-leak-hero span { color: var(--ui-muted); font-size: 14px; font-weight: 700; } .page-workspace .dr-leak-hero-secondary { display: grid; align-content: center; gap: 5px; margin: 0; padding: 13px 16px; border: 1px solid rgba(99, 76, 152, 0.22); border-radius: 14px; background: rgba(99, 76, 152, 0.08); } .page-workspace .dr-leak-hero-secondary strong { color: var(--ui-violet); font-size: clamp(25px, 3.5vw, 34px); font-weight: 780; letter-spacing: -0.035em; line-height: 1; } .page-workspace .dr-leak-hero-secondary span { color: var(--ui-muted); font-size: 11px; font-weight: 720; letter-spacing: 0.055em; } .page-workspace .dr-leak-badge { display: inline-flex; align-items: baseline; justify-self: start; gap: 8px; margin: 0; padding: 6px 12px; border: 1px solid rgba(184, 87, 51, 0.28); border-radius: 999px; background: rgba(184, 87, 51, 0.09); } .page-workspace .dr-leak-badge strong { color: #8f4527; font-size: 17px; font-weight: 780; letter-spacing: -0.02em; } .page-workspace .dr-leak-badge span { color: var(--ui-muted); font-size: 12px; font-weight: 660; } .page-workspace .dr-leak-metrics { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); margin-top: 2px; } .page-workspace .dr-leak-metric { display: grid; gap: 3px; padding: 10px 12px; border: 1px solid rgba(83, 99, 90, 0.16); border-radius: 12px; background: rgba(255, 255, 255, 0.86); } .page-workspace .dr-leak-metric .dr-kicker { margin: 0; color: var(--ui-muted); } .page-workspace .dr-leak-metric strong { color: var(--ui-ink); font-size: 18px; font-weight: 750; letter-spacing: -0.02em; } .page-workspace .dr-leak-sowhat { padding: 13px 15px; border-left: 3px solid var(--ui-violet); border-radius: 0 12px 12px 0; background: rgba(255, 255, 255, 0.82); } .page-workspace .dr-leak-sowhat .dr-kicker { margin: 0 0 5px; color: var(--ui-violet); } .page-workspace .dr-leak-sowhat ul { max-width: 78ch; margin: 0; padding-left: 20px; color: var(--ui-ink); font-size: 13px; line-height: 1.6; } .page-workspace .dr-leak-sowhat li + li { margin-top: 5px; } /**/ .page-workspace .dr-leak-sowhat li.dr-leak-sowhat__steady-state { margin-top: 9px; margin-left: -20px; padding: 9px 13px; list-style: none; border-left: 3px solid var(--ui-violet); border-radius: 0 10px 10px 0; background: var(--ui-violet-soft); } .page-workspace .dr-leak-note, .page-workspace .dr-leak-empty p { max-width: 78ch; margin: 0; color: var(--ui-muted); font-size: 12px; line-height: 1.5; } .page-workspace .dr-leak-empty h3 { margin: 0 0 6px; color: var(--ui-ink); font-size: 17px; font-weight: 750; letter-spacing: -0.02em; } @media (max-width: 700px) { .page-workspace .dr-leak-toggle { justify-content: center; min-height: 44px; } .page-workspace .dr-leak-hero-grid { grid-template-columns: 1fr; } .page-workspace .dr-leak-metrics { grid-template-columns: 1fr; } } /**/ .page-workspace .dr-cadence-card { min-width: 0; } /**/ .page-workspace .dr-cadence-card__ride { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 !important; color: var(--ui-muted); font-size: 12.5px; } .page-workspace .dr-cadence-card__ride strong { color: var(--ui-ink); font-weight: 720; } .page-workspace .dr-cadence-card__body { display: grid; gap: 14px; } .page-workspace .dr-cadence-readings { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } .page-workspace .dr-cadence-reading { display: grid; align-content: start; gap: 3px; padding: 11px 13px; border: 1px solid var(--ui-line); border-radius: 12px; background: var(--dr-surface-2); } .page-workspace .dr-cadence-reading .dr-kicker { margin: 0; color: var(--ui-muted); /**/ line-height: 1.35; } .page-workspace .dr-cadence-reading strong { color: var(--ui-ink); font-size: 21px; font-weight: 760; letter-spacing: -0.025em; line-height: 1.1; } .page-workspace .dr-cadence-reading__unit { color: var(--ui-muted); font-size: 11px; font-weight: 700; letter-spacing: 0.05em; } /**/ .page-workspace .dr-cadence-table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; font-variant-numeric: tabular-nums; } .page-workspace .dr-cadence-table caption { margin: 0 0 6px; color: var(--ui-violet); text-align: left; } .page-workspace .dr-cadence-table th, .page-workspace .dr-cadence-table td { padding: 7px 12px 7px 0; text-align: left; white-space: nowrap; } .page-workspace .dr-cadence-table thead th { border-bottom: 1px solid var(--ui-line); color: var(--ui-muted); font-size: 11px; font-weight: 720; letter-spacing: 0.05em; text-transform: uppercase; } .page-workspace .dr-cadence-table tbody th { color: var(--ui-ink); font-size: 13px; font-weight: 730; } .page-workspace .dr-cadence-table tbody td { color: var(--ui-ink); font-size: 13px; } .page-workspace .dr-cadence-table tbody tr + tr th, .page-workspace .dr-cadence-table tbody tr + tr td { border-top: 1px solid var(--ui-line-soft); } /**/ .page-workspace .dr-cadence-table tbody tr.is-in-window th, .page-workspace .dr-cadence-table tbody tr.is-in-window td { background: var(--dr-accent-soft); } .page-workspace .dr-cadence-table__badge { display: inline-block; margin-left: 8px; padding: 1px 7px; border-radius: 999px; background: var(--dr-success-soft); color: var(--ui-success); font-size: 10px; font-weight: 720; letter-spacing: 0.04em; text-transform: uppercase; } /**/ .page-workspace .dr-cadence-table__error { color: var(--ui-muted); font-size: 11.5px; font-weight: 600; } .page-workspace .dr-cadence-reading-block { padding: 13px 15px; border-left: 3px solid var(--ui-violet); border-radius: 0 12px 12px 0; background: var(--dr-surface-2); } .page-workspace .dr-cadence-reading-block .dr-kicker { margin: 0 0 5px; color: var(--ui-violet); } .page-workspace .dr-cadence-reading-block p { margin: 0; color: var(--ui-ink); font-size: 13px; line-height: 1.6; } .page-workspace .dr-cadence-reading-block p + p { margin-top: 7px; } /**/ .page-workspace .dr-cadence-caveats { padding: 12px 15px; border-left: 3px solid var(--ui-warning); border-radius: 0 12px 12px 0; background: var(--dr-warning-soft); } .page-workspace .dr-cadence-caveats .dr-kicker { margin: 0 0 5px; color: var(--ui-warning); } .page-workspace .dr-cadence-caveats ul { margin: 0; padding-left: 19px; color: var(--ui-ink); font-size: 12.5px; line-height: 1.55; } .page-workspace .dr-cadence-caveats li + li { margin-top: 5px; } .page-workspace .dr-cadence-note, .page-workspace .dr-cadence-empty p { margin: 0; color: var(--ui-muted); font-size: 12px; line-height: 1.5; } .page-workspace .dr-cadence-empty h3 { margin: 0 0 6px; color: var(--ui-ink); font-size: 16px; font-weight: 750; letter-spacing: -0.02em; } @media (max-width: 700px) { .page-workspace .dr-cadence-readings { grid-template-columns: 1fr; } } /**/ .page-workspace .dr-insights { display: grid; gap: 18px; padding: clamp(16px, 2.2vw, 24px) !important; } .page-workspace .dr-insights__header { display: flex; align-items: end; justify-content: space-between; gap: 20px; } .page-workspace .dr-insights__header .dr-kicker { margin: 0 0 5px; color: var(--ui-violet); } .page-workspace .dr-insights__header h2 { margin: 0; color: var(--ui-ink); font-size: clamp(19px, 2vw, 24px); font-weight: 780; letter-spacing: -0.03em; } .page-workspace .dr-insights__header h2 + p { max-width: 78ch; margin: 5px 0 0; color: var(--ui-muted); font-size: 13px; line-height: 1.55; } .page-workspace .dr-insights__ride { flex: 0 0 auto; margin: 0; color: var(--ui-muted); font-size: 12px; text-align: right; } .page-workspace .dr-insights__ride span, .page-workspace .dr-insights__ride strong { display: block; } .page-workspace .dr-insights__ride strong { margin-top: 2px; color: var(--ui-ink); font-size: 13px; font-weight: 740; } .page-workspace .dr-insights__header-meta, .page-workspace .dr-insights__header-actions { display: flex; align-items: flex-end; justify-content: flex-end; gap: 8px; } .page-workspace .dr-insights__header-meta { flex-direction: column; } .page-workspace .dr-insights__customise { min-height: 40px; } .page-workspace .dr-insights__hidden-count { display: inline-flex; min-height: 26px; align-items: center; padding: 3px 9px; border-radius: 999px; background: var(--dr-surface-3); color: var(--ui-muted); font-size: 10.5px; font-weight: 700; } .page-workspace .dr-insights__grid { display: grid; gap: 12px; grid-template-columns: repeat(6, minmax(0, 1fr)); } .page-workspace .dr-insight-tile { position: relative; display: grid; align-content: start; gap: 12px; min-width: 0; padding: 16px; border: 1px solid var(--ui-line); border-radius: 14px; background: var(--dr-surface-2); box-shadow: 0 5px 16px rgba(31, 55, 41, 0.045); grid-column: span 2; transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease, transform 160ms ease; } .page-workspace .dr-insight-tile[data-dr-span='2'] { grid-column: span 2; } .page-workspace .dr-insight-tile[data-dr-span='3'] { grid-column: span 3; } .page-workspace .dr-insight-tile[data-dr-span='6'] { grid-column: 1 / -1; } .page-workspace .dr-insight-tile--optimal { border-top: 3px solid var(--ui-success); } .page-workspace .dr-insight-tile--moderate, .page-workspace .dr-insight-tile--high { border-top: 3px solid #D97706; } .page-workspace .dr-insight-tile--unavailable { border-top: 3px solid var(--ui-subtle); } .page-workspace .dr-insight-tile[data-dr-insight-key]:hover, .page-workspace .dr-insight-tile[data-dr-insight-key]:focus-visible, .page-workspace .dr-insight-tile[data-dr-insight-key]:focus-within, .page-workspace .dr-insight-tile.is-proof-highlighted { border-color: #D97706; background: color-mix(in srgb, var(--dr-surface-2) 94%, #D97706 6%); box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.14), 0 10px 24px rgba(31, 55, 41, 0.09); } .page-workspace .dr-insight-tile[data-dr-insight-key]:focus-visible, .page-workspace .dr-insight-tile.is-proof-highlighted { outline: 2px solid #D97706; outline-offset: 3px; } @media (hover: hover) { .page-workspace .dr-insight-tile[data-dr-insight-key]:hover { transform: translateY(-2px); } } .page-workspace .dr-insight-tile__head { display: grid; align-items: start; gap: 10px; grid-template-columns: 34px minmax(0, 1fr) 40px; } .page-workspace .dr-insight-tile__icon { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 10px; background: var(--dr-accent-soft); color: var(--ui-green-2); font-size: 17px; } .page-workspace .dr-insight-tile__head h3 { margin: 0; color: var(--ui-ink); font-size: 15px; font-weight: 760; letter-spacing: -0.018em; line-height: 1.25; } .page-workspace .dr-insight-tile__head p { margin: 3px 0 0; color: var(--ui-muted); font-size: 10.5px; font-weight: 650; line-height: 1.35; } .page-workspace .dr-insight-science-button { display: grid; width: 40px; height: 40px; padding: 0; place-items: center; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--dr-surface-1); color: var(--ui-muted); font: 750 13px/1 var(--font-mono, 'IBM Plex Mono', monospace); cursor: pointer; } .page-workspace .dr-insight-science-button:hover, .page-workspace .dr-insight-science-button:focus-visible { border-color: var(--ui-violet); color: var(--ui-violet); } .page-workspace .dr-insight-tile__layout-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 8px; border: 1px dashed var(--ui-line); border-radius: 10px; background: var(--dr-surface-1); } .page-workspace .dr-insight-drag, .page-workspace .dr-insight-layout-button, .page-workspace .dr-insight-size { min-width: 44px; min-height: 44px; border: 1px solid var(--ui-line); border-radius: 9px; background: var(--dr-surface-2); color: var(--ui-muted); } .page-workspace .dr-insight-drag, .page-workspace .dr-insight-layout-button { display: inline-flex; align-items: center; justify-content: center; padding: 0 10px; } .page-workspace .dr-insight-drag { cursor: grab; font-size: 18px; } .page-workspace .dr-insight-drag:active { cursor: grabbing; } .page-workspace .dr-insight-layout-button { gap: 6px; cursor: pointer; font-size: 11px; font-weight: 700; } .page-workspace .dr-insight-layout-button:disabled { opacity: 0.38; cursor: not-allowed; } .page-workspace .dr-insight-layout-button:not(:disabled):hover, .page-workspace .dr-insight-layout-button:not(:disabled):focus-visible, .page-workspace .dr-insight-drag:focus-visible, .page-workspace .dr-insight-size:focus-within { border-color: var(--ui-violet); color: var(--ui-violet); } .page-workspace .dr-insight-layout-button--hide { margin-left: auto; } .page-workspace .dr-insight-size { position: relative; display: grid; flex: 1 1 165px; grid-template-columns: 28px minmax(0, 1fr); align-items: center; padding: 0 5px 0 9px; } .page-workspace .dr-insight-size select { width: 100%; min-width: 0; min-height: 40px; border: 0; outline: 0; background: transparent; color: var(--ui-ink); font-size: 11px; font-weight: 680; } .page-workspace .dr-insight-tile.is-dragging { opacity: 0.52; } .page-workspace .dr-insight-tile.is-drop-before { box-shadow: inset 5px 0 0 var(--ui-violet); } .page-workspace .dr-insight-tile.is-drop-after { box-shadow: inset -5px 0 0 var(--ui-violet); } .page-workspace .dr-insight-layout-editor { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px 22px; padding: 15px; border: 1px solid var(--ui-line); border-radius: 14px; background: var(--dr-surface-2); } .page-workspace .dr-insight-layout-editor h3, .page-workspace .dr-insight-layout-empty h3 { margin: 0; color: var(--ui-ink); font-size: 14px; font-weight: 760; } .page-workspace .dr-insight-layout-editor p, .page-workspace .dr-insight-layout-empty p { margin: 4px 0 0; color: var(--ui-muted); font-size: 12px; line-height: 1.5; } .page-workspace .dr-insight-layout-editor__note { font-weight: 650; } .page-workspace .dr-insight-layout-editor__mobile-note { display: none; } .page-workspace .dr-insight-layout-editor__actions, .page-workspace .dr-insight-layout-editor__hidden-list { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; } .page-workspace .dr-insight-layout-editor__hidden { display: grid; grid-column: 1 / -1; gap: 8px; padding-top: 12px; border-top: 1px solid var(--ui-line-soft); color: var(--ui-ink); font-size: 12px; } .page-workspace .dr-insight-layout-empty { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 13px; padding: 18px; border: 1px dashed var(--ui-line); border-radius: 14px; background: var(--dr-surface-2); } .page-workspace .dr-insight-layout-empty > i { color: var(--ui-muted); font-size: 24px; } .page-workspace .dr-insight-status { display: inline-flex; align-items: center; justify-self: start; gap: 6px; min-height: 24px; padding: 3px 9px; border-radius: 999px; font-size: 10.5px; font-weight: 730; } .page-workspace .dr-insight-status > span { width: 7px; height: 7px; border-radius: 50%; background: currentColor; } .page-workspace .dr-insight-status--optimal { background: var(--dr-success-soft); color: var(--ui-success); } .page-workspace .dr-insight-status--moderate, .page-workspace .dr-insight-status--high { background: rgba(217, 119, 6, 0.12); color: #D97706; } .page-workspace .dr-insight-status--unavailable { background: var(--dr-surface-3); color: var(--ui-muted); } .page-workspace .dr-insight-tile__hero { display: grid; gap: 3px; min-height: 57px; margin: 0; } /**/ .page-workspace .dr-insight-tile__hero strong { color: var(--ui-ink); font-size: clamp(18px, 1.9vw, 24px); font-weight: 790; letter-spacing: -0.035em; line-height: 1.1; } .page-workspace .dr-insight-tile__hero span { color: var(--ui-muted); font-size: 11px; } .page-workspace .dr-insight-tile__metrics { display: grid; gap: 0; margin: 0; border-top: 1px solid var(--ui-line-soft); } .page-workspace .dr-insight-tile__metrics > div { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--ui-line-soft); } .page-workspace .dr-insight-tile__metrics dt { color: var(--ui-muted); font-size: 11px; } .page-workspace .dr-insight-tile__metrics dd { margin: 0; color: var(--ui-ink); font: 700 11.5px/1.3 var(--font-mono, 'IBM Plex Mono', monospace); text-align: right; } .page-workspace .dr-insight-tile__observation { margin: 0; color: var(--ui-ink); font-size: 12px; line-height: 1.5; } .page-workspace .dr-insight-tile__fallback { margin: 0; padding: 13px 14px; border: 1px solid var(--ui-line-soft); border-radius: 10px; background: var(--dr-surface-3); color: var(--ui-muted); font-size: 12px; line-height: 1.5; } .page-workspace .dr-insight-proof { display: grid; gap: 12px; padding: 16px; border: 1px solid var(--ui-line); border-radius: 14px; background: var(--dr-surface-2); } /**/ .page-workspace .dr-insight-proof__layout-controls { justify-content: flex-end; } .page-workspace .dr-insight-proof__head { display: flex; align-items: end; justify-content: space-between; gap: 18px; } .page-workspace .dr-insight-proof__head .dr-kicker { margin: 0 0 3px; color: var(--ui-violet); } .page-workspace .dr-insight-proof__head h3 { margin: 0; color: var(--ui-ink); font-size: 16px; font-weight: 760; } .page-workspace .dr-insight-proof__head h3 + p { max-width: 78ch; margin: 4px 0 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.45; } .page-workspace .dr-insight-proof__legend { display: flex; flex-wrap: wrap; justify-content: end; gap: 7px 12px; margin: 0; padding: 0; color: var(--ui-muted); font-size: 10.5px; list-style: none; } .page-workspace .dr-insight-proof__legend li { display: inline-flex; align-items: center; white-space: nowrap; } .page-workspace .dr-insight-proof__legend button, .page-workspace .dr-insight-proof__toggle { display: inline-flex; min-height: 36px; align-items: center; gap: 7px; padding: 7px 10px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--dr-surface-1); color: var(--ui-ink); font: inherit; font-weight: 680; cursor: pointer; transition: border-color 140ms ease, box-shadow 140ms ease, opacity 140ms ease, background-color 140ms ease; } .page-workspace .dr-insight-proof__legend button:hover, .page-workspace .dr-insight-proof__toggle:hover { border-color: #D97706; background: rgba(217, 119, 6, 0.07); } .page-workspace .dr-insight-proof__legend button:focus-visible, .page-workspace .dr-insight-proof__toggle:focus-visible { outline: 2px solid #D97706; outline-offset: 2px; box-shadow: 0 0 0 4px rgba(217, 119, 6, 0.14); } .page-workspace .dr-insight-proof__legend button[aria-pressed='false'], .page-workspace .dr-insight-proof__toggle[aria-pressed='false'], .page-workspace .dr-insight-proof__legend .is-off { opacity: 0.52; } .page-workspace .dr-insight-proof__legend button[aria-pressed='true'], .page-workspace .dr-insight-proof__toggle[aria-pressed='true'], .page-workspace .dr-insight-proof__legend .is-active { border-color: color-mix(in srgb, currentColor 30%, var(--ui-line)); background: var(--dr-surface-2); } .page-workspace .dr-insight-proof__legend li > span, .page-workspace .dr-insight-proof__legend button > span, .page-workspace .dr-insight-proof__swatch { width: 16px; height: 3px; flex: 0 0 16px; border-radius: 2px; } .page-workspace .dr-insight-proof__legend .is-power > span, .page-workspace .dr-insight-proof__legend .is-power .dr-insight-proof__swatch { background: #22d3ee; } .page-workspace .dr-insight-proof__legend .is-cadence > span, .page-workspace .dr-insight-proof__legend .is-cadence .dr-insight-proof__swatch { background: #a78bfa; } .page-workspace .dr-insight-proof__legend .is-te > span, .page-workspace .dr-insight-proof__legend .is-te .dr-insight-proof__swatch { background: #2dd4bf; } .page-workspace .dr-insight-proof__legend .is-pedal-smoothness > span, .page-workspace .dr-insight-proof__legend .is-pedal-smoothness .dr-insight-proof__swatch, .page-workspace .dr-insight-proof__legend .is-ps > span, .page-workspace .dr-insight-proof__legend .is-ps .dr-insight-proof__swatch { background: #f59e0b; } .page-workspace .dr-insight-proof__legend .is-asymmetry > span, .page-workspace .dr-insight-proof__legend .is-asymmetry .dr-insight-proof__swatch, .page-workspace .dr-insight-proof__legend .is-asi > span, .page-workspace .dr-insight-proof__legend .is-asi .dr-insight-proof__swatch { background: #f472b6; } .page-workspace .dr-insight-proof__legend .is-elevation > span, .page-workspace .dr-insight-proof__legend .is-elevation .dr-insight-proof__swatch { height: 0; border-top: 2px dashed #94a3b8; border-radius: 0; background: transparent; } .page-workspace .dr-insight-proof__hint { margin: -4px 0 0; color: var(--ui-muted); font-size: 11px; line-height: 1.45; } .page-workspace .dr-insight-proof__chart { position: relative; height: 280px; min-width: 0; } .page-workspace .dr-insight-proof__empty { margin: 0; padding: 32px; border-radius: 10px; background: var(--dr-surface-3); color: var(--ui-muted); font-size: 12px; text-align: center; } .page-workspace .dr-insight-science { position: fixed; z-index: 260; inset: 0; display: grid; padding: 20px; place-items: center; background: rgba(6, 13, 9, 0.72); backdrop-filter: blur(5px); } .page-workspace .dr-insight-science__dialog { width: min(720px, 100%); max-height: calc(100vh - 40px); overflow: auto; border: 1px solid var(--ui-line); border-radius: 16px; background: var(--ui-paper); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.38); } .page-workspace .dr-insight-science__head { position: sticky; z-index: 1; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 16px 18px; border-bottom: 1px solid var(--ui-line); background: var(--ui-white); } .page-workspace .dr-insight-science__head .dr-kicker { margin: 0 0 3px; color: var(--ui-violet); } .page-workspace .dr-insight-science__head h2 { margin: 0; color: var(--ui-ink); font-size: 19px; font-weight: 770; } .page-workspace .dr-insight-science__body { display: grid; gap: 18px; padding: 20px; } .page-workspace .dr-insight-science__body section { padding: 15px; border: 1px solid var(--ui-line); border-radius: 12px; background: var(--dr-surface-2); } .page-workspace .dr-insight-science__body h3 { margin: 0 0 7px; color: var(--ui-ink); font-size: 13px; font-weight: 760; } .page-workspace .dr-insight-science__body p, .page-workspace .dr-insight-science__body li { color: var(--ui-muted); font-size: 12.5px; line-height: 1.6; } .page-workspace .dr-insight-science__body p { margin: 0; } .page-workspace .dr-insight-science__body ul { display: grid; gap: 8px; margin: 0; padding-left: 18px; } .page-workspace .dr-insight-science__body a { color: var(--ui-violet); text-underline-offset: 2px; } @media (max-width: 1000px) { .page-workspace .dr-insights__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-insight-tile[data-dr-span] { grid-column: span 1; } .page-workspace .dr-insight-tile[data-dr-span='6'] { grid-column: 1 / -1; } } @media (max-width: 700px) { .page-workspace .dr-insights__header, .page-workspace .dr-insight-proof__head { align-items: stretch; flex-direction: column; } .page-workspace .dr-insights__ride { text-align: left; } .page-workspace .dr-insights__ride span, .page-workspace .dr-insights__ride strong { display: inline; } .page-workspace .dr-insights__ride strong { margin-left: 4px; } .page-workspace .dr-insights__header-meta, .page-workspace .dr-insights__header-actions { align-items: flex-start; justify-content: flex-start; } .page-workspace .dr-insights__grid { grid-template-columns: 1fr; } .page-workspace .dr-insight-tile[data-dr-span] { grid-column: 1; } .page-workspace .dr-insight-layout-editor { grid-template-columns: 1fr; } .page-workspace .dr-insight-layout-editor__actions, .page-workspace .dr-insight-layout-editor__hidden { grid-column: 1; } .page-workspace .dr-insight-layout-empty { grid-template-columns: 36px minmax(0, 1fr); } .page-workspace .dr-insight-layout-empty .dr-button { grid-column: 1 / -1; justify-self: start; } .page-workspace .dr-insight-size { display: none; } .page-workspace .dr-insight-layout-editor__mobile-note { display: inline; } .page-workspace .dr-insight-proof__legend { justify-content: start; } .page-workspace .dr-insight-proof__chart { height: 230px; } .page-workspace .dr-insight-science { padding: 8px; } .page-workspace .dr-insight-science__dialog { max-height: calc(100vh - 16px); } } /**/ .page-workspace .dr-export-overlay { position: fixed; z-index: 270; inset: 0; display: grid; padding: 20px; place-items: center; background: rgba(6, 13, 9, 0.72); backdrop-filter: blur(5px); } .page-workspace .dr-export-modal { display: flex; width: min(860px, 100%); max-height: calc(100vh - 40px); flex-direction: column; border: 1px solid var(--ui-line); border-radius: 16px; background: var(--ui-paper); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.38); } .page-workspace .dr-export-modal__head { position: sticky; z-index: 1; top: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; padding: 16px 18px; border-bottom: 1px solid var(--ui-line); border-radius: 16px 16px 0 0; background: var(--ui-white); } .page-workspace .dr-export-modal__head .dr-kicker { margin: 0 0 3px; color: #D97706; } .page-workspace .dr-export-modal__head h2 { margin: 0; color: var(--ui-ink); font-size: 19px; font-weight: 770; } .page-workspace .dr-export-modal__subject { margin: 4px 0 0; color: var(--ui-ink); font-size: 13px; font-weight: 650; } .page-workspace .dr-export-modal__subtitle { margin: 5px 0 0; max-width: 54ch; color: var(--ui-muted); font-size: 12px; line-height: 1.55; } .page-workspace .dr-export-modal__body { display: grid; overflow: auto; padding: 18px; gap: 20px; } .page-workspace .dr-export-group { display: grid; gap: 10px; } .page-workspace .dr-export-group h3 { display: flex; align-items: baseline; margin: 0; color: var(--ui-ink); font-size: 13px; font-weight: 760; gap: 8px; } .page-workspace .dr-export-group__note { color: var(--ui-muted); font-size: 11px; font-weight: 500; } .page-workspace .dr-export-list { display: grid; gap: 8px; } .page-workspace .dr-export-row { display: grid; align-items: center; padding: 11px 13px; border: 1px solid var(--ui-line); border-radius: 11px; background: var(--dr-surface-2); cursor: pointer; gap: 11px; grid-template-columns: auto 1fr auto; } .page-workspace .dr-export-row--tile { grid-template-columns: auto auto 1fr auto; } .page-workspace .dr-export-row.is-on { border-color: #D97706; background: color-mix(in srgb, var(--dr-surface-2) 94%, #D97706 6%); } .page-workspace .dr-export-row.is-excluded { opacity: 0.78; } .page-workspace .dr-export-row:focus-within { outline: 2px solid #D97706; outline-offset: 2px; } .page-workspace .dr-export-row input[type="checkbox"] { width: 16px; height: 16px; accent-color: #D97706; } .page-workspace .dr-export-row input[type="checkbox"]:disabled { cursor: not-allowed; } .page-workspace .dr-export-row__rank { color: var(--ui-muted); font-size: 12px; font-variant-numeric: tabular-nums; font-weight: 700; } .page-workspace .dr-export-row__body { display: grid; min-width: 0; gap: 2px; } .page-workspace .dr-export-row__body strong { color: var(--ui-ink); font-size: 13px; font-weight: 680; } .page-workspace .dr-export-row__detail { color: var(--ui-muted); font-size: 11px; line-height: 1.45; } .page-workspace .dr-export-row__page { color: var(--ui-muted); font-size: 11px; white-space: nowrap; } .page-workspace .dr-export-row__page.is-optional { font-style: italic; } .page-workspace .dr-export-hint { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--dr-surface-3); color: var(--ui-muted); font-size: 12px; line-height: 1.55; } .page-workspace .dr-export-group--actions { gap: 8px; } .page-workspace .dr-export-quick { display: flex; flex-wrap: wrap; gap: 8px; } .page-workspace .dr-export-budget { display: flex; flex-wrap: wrap; align-items: center; margin: 0; padding: 10px 12px; border: 1px solid var(--ui-line); border-radius: 10px; background: var(--dr-surface-3); color: var(--ui-muted); font-size: 12px; gap: 8px; } .page-workspace .dr-export-budget.is-over { border-color: #D97706; color: var(--ui-ink); } .page-workspace .dr-export-budget__warning { color: #D97706; font-weight: 640; } .page-workspace .dr-export-modal__footer { display: flex; justify-content: flex-end; padding: 14px 18px; border-top: 1px solid var(--ui-line); border-radius: 0 0 16px 16px; background: var(--ui-white); gap: 10px; } /**/ .page-workspace .dr-studio-discussion { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-top: 12px; padding: 12px 14px; border: 1px solid var(--ui-line); border-left: 3px solid #D97706; border-radius: 10px; background: var(--dr-surface-2); gap: 12px; } .page-workspace .dr-studio-discussion.is-gated { border-left-color: var(--ui-muted); opacity: 0.72; } .page-workspace .dr-studio-discussion__body { display: grid; min-width: 0; gap: 3px; } .page-workspace .dr-studio-discussion__body strong { color: var(--ui-ink); font-size: 12.5px; font-weight: 680; } .page-workspace .dr-studio-discussion__body p { margin: 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.45; } @media (max-width: 720px) { .page-workspace .dr-export-overlay { padding: 8px; } .page-workspace .dr-export-modal { max-height: calc(100vh - 16px); } .page-workspace .dr-export-row, .page-workspace .dr-export-row--tile { grid-template-columns: auto 1fr; } .page-workspace .dr-export-row__page { grid-column: 2; } .page-workspace .dr-export-row--tile .dr-insight-status { grid-column: 2; justify-self: start; } } /**/ .page-workspace .dr-overview2-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; } .page-workspace .dr-overview2-toolbar__note { margin: 0; color: var(--ui-muted); font-size: 11.5px; } .page-workspace .dr-button--sm { padding: 6px 11px; font-size: 11.5px; } .page-workspace .dr-ovcustom-overlay { position: fixed; z-index: 268; inset: 0; display: grid; padding: 20px; place-items: center; background: rgba(6, 13, 9, 0.72); backdrop-filter: blur(5px); } .page-workspace .dr-ovcustom-modal { display: flex; width: min(720px, 100%); max-height: calc(100vh - 40px); flex-direction: column; border: 1px solid var(--ui-line); border-radius: 16px; background: var(--ui-paper); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.38); } .page-workspace .dr-ovcustom-modal__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; padding: 16px 18px; border-bottom: 1px solid var(--ui-line); border-radius: 16px 16px 0 0; background: var(--ui-white); } .page-workspace .dr-ovcustom-modal__heading { min-width: 0; } .page-workspace .dr-ovcustom-modal__head .dr-kicker { margin: 0 0 3px; color: #D97706; } .page-workspace .dr-ovcustom-modal__head h2 { margin: 0; color: var(--ui-ink); font-size: 19px; font-weight: 770; } .page-workspace .dr-ovcustom-modal__subtitle { margin: 5px 0 0; max-width: 54ch; color: var(--ui-muted); font-size: 12px; line-height: 1.55; } .page-workspace .dr-ovcustom-modal__body { display: grid; overflow: auto; padding: 18px; gap: 20px; } .page-workspace .dr-ovcustom-group { display: grid; gap: 10px; } .page-workspace .dr-ovcustom-group h3 { display: flex; flex-wrap: wrap; align-items: baseline; margin: 0; color: var(--ui-ink); font-size: 13px; font-weight: 760; gap: 8px; } .page-workspace .dr-ovcustom-group__note { color: var(--ui-muted); font-size: 11px; font-weight: 500; } .page-workspace .dr-ovcustom-presets { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } .page-workspace .dr-ovcustom-preset { display: flex; align-items: flex-start; padding: 12px 13px; border: 1px solid var(--ui-line); border-radius: 11px; background: var(--dr-surface-2); color: var(--ui-ink); font: inherit; text-align: left; cursor: pointer; gap: 10px; } .page-workspace .dr-ovcustom-preset.is-active { border-color: #D97706; background: color-mix(in srgb, var(--dr-surface-2) 92%, #D97706 8%); } .page-workspace .dr-ovcustom-preset:focus-visible { outline: 2px solid #D97706; outline-offset: 2px; } .page-workspace .dr-ovcustom-preset > i { color: #D97706; font-size: 17px; line-height: 1.2; } .page-workspace .dr-ovcustom-preset__body { display: grid; min-width: 0; gap: 2px; } .page-workspace .dr-ovcustom-preset__body strong { font-size: 13px; font-weight: 680; } .page-workspace .dr-ovcustom-preset__body span { color: var(--ui-muted); font-size: 11px; line-height: 1.45; } .page-workspace .dr-ovcustom-list, .page-workspace .dr-settings-widget-list { display: grid; gap: 8px; } .page-workspace .dr-ovcustom-row, .page-workspace .dr-settings-widget-row { display: grid; align-items: center; padding: 11px 13px; border: 1px solid var(--ui-line); border-radius: 11px; background: var(--dr-surface-2); cursor: pointer; gap: 12px; grid-template-columns: auto 1fr; } .page-workspace .dr-ovcustom-row.is-on, .page-workspace .dr-settings-widget-row.is-on { border-color: #D97706; background: color-mix(in srgb, var(--dr-surface-2) 94%, #D97706 6%); } .page-workspace .dr-ovcustom-row:focus-within, .page-workspace .dr-settings-widget-row:focus-within { outline: 2px solid #D97706; outline-offset: 2px; } .page-workspace .dr-ovcustom-row__body, .page-workspace .dr-settings-widget-row__body { display: grid; min-width: 0; gap: 2px; } .page-workspace .dr-ovcustom-row__body strong, .page-workspace .dr-settings-widget-row__body strong { color: var(--ui-ink); font-size: 13px; font-weight: 680; } .page-workspace .dr-ovcustom-row__detail, .page-workspace .dr-settings-widget-row__detail { color: var(--ui-muted); font-size: 11px; line-height: 1.45; } .page-workspace .dr-ovcustom-switch, .page-workspace .dr-settings-widget-switch { position: relative; width: 38px; height: 21px; flex: none; margin: 0; padding: 0; border: 1px solid var(--ui-line); border-radius: 999px; appearance: none; -webkit-appearance: none; background: var(--dr-surface-3); cursor: pointer; transition: background 120ms ease, border-color 120ms ease; } .page-workspace .dr-ovcustom-switch::after, .page-workspace .dr-settings-widget-switch::after { position: absolute; top: 2px; left: 2px; width: 15px; height: 15px; border-radius: 50%; background: var(--ui-white); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); content: ""; transition: transform 120ms ease; } .page-workspace .dr-ovcustom-switch:checked, .page-workspace .dr-settings-widget-switch:checked { border-color: #D97706; background: #D97706; } .page-workspace .dr-ovcustom-switch:checked::after, .page-workspace .dr-settings-widget-switch:checked::after { transform: translateX(17px); } .page-workspace .dr-ovcustom-hint { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--dr-surface-3); color: var(--ui-muted); font-size: 12px; line-height: 1.55; } .page-workspace .dr-ovcustom-modal__footer { display: flex; flex-wrap: wrap; justify-content: flex-end; padding: 14px 18px; border-top: 1px solid var(--ui-line); border-radius: 0 0 16px 16px; background: var(--ui-white); gap: 10px; } .page-workspace .dr-settings-overview-grid { display: grid; gap: 20px; } .page-workspace .dr-settings-widget-note { display: flex; align-items: flex-start; margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; background: var(--dr-surface-3); color: var(--ui-muted); font-size: 11.5px; line-height: 1.5; gap: 8px; } .page-workspace .dr-settings-widget-note > i { color: #D97706; } @media (max-width: 720px) { .page-workspace .dr-ovcustom-overlay { padding: 8px; } .page-workspace .dr-ovcustom-modal { max-height: calc(100vh - 16px); } .page-workspace .dr-ovcustom-modal__footer > .dr-button { flex: 1 1 100%; justify-content: center; } } /**/ .page-workspace .dr-izm { display: block; padding: 18px; border: 1px solid var(--ui-line); border-radius: var(--dr-radius-lg); background: none; } .page-workspace .dr-izm__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; margin-bottom: 14px; gap: 10px 24px; } .page-workspace .dr-izm__titles { flex: 1 1 20rem; min-width: 0; } /**/ .page-workspace .dr-izm__kicker { margin: 0; color: var(--ui-violet); font: 700 10px/1.2 "IBM Plex Mono", monospace; letter-spacing: 0.16em; text-transform: uppercase; } .page-workspace .dr-izm__title { margin: 4px 0 0; font: var(--dr-type-card); color: var(--ui-ink); text-transform: uppercase; letter-spacing: 0.01em; } .page-workspace .dr-izm__lede { flex: 0 1 24rem; max-width: 40ch; margin: 2px 0 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.5; } /**/ .page-workspace .dr-izm-row { display: grid; grid-template-columns: minmax(6.5rem, 0.85fr) minmax(6.5rem, 1fr) minmax(6.5rem, 1fr) minmax(5.5rem, 0.9fr) minmax(10.5rem, 1.05fr); align-items: center; padding: 10px 12px; border-radius: var(--dr-radius-sm); gap: 10px 18px; } .page-workspace .dr-izm-row + .dr-izm-row { margin-top: 2px; } .page-workspace .dr-izm-row--head { align-items: end; padding-bottom: 8px; border-bottom: 1px solid var(--ui-line); border-radius: 0; } .page-workspace .dr-izm-row:not(.dr-izm-row--head) { background: var(--dr-surface-3); } /**/ .page-workspace .dr-izm-row[data-state="insufficient"] { background: none; box-shadow: inset 0 0 0 1px var(--ui-line-soft); } /**/ .page-workspace .dr-izm-cell, .page-workspace .dr-izm__titles { min-width: 0; } .page-workspace .dr-izm-col__label { display: block; color: var(--ui-subtle); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.11em; text-transform: uppercase; } .page-workspace .dr-izm-col__unit { display: block; margin-top: 2px; color: var(--ui-subtle); font-size: 10px; letter-spacing: 0.02em; opacity: 0.8; } /**/ .page-workspace .dr-izm-cell--balance, .page-workspace .dr-izm-cell--te, .page-workspace .dr-izm-cell--power { text-align: right; } .page-workspace .dr-izm-row:not(.dr-izm-row--head) .dr-izm-cell--balance, .page-workspace .dr-izm-row:not(.dr-izm-row--head) .dr-izm-cell--te, .page-workspace .dr-izm-row:not(.dr-izm-row--head) .dr-izm-cell--power { color: var(--ui-ink); font: 500 var(--dr-fs-metric)/1.2 "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; } .page-workspace .dr-izm-row[data-state="insufficient"] .dr-izm-cell--balance, .page-workspace .dr-izm-row[data-state="insufficient"] .dr-izm-cell--te, .page-workspace .dr-izm-row[data-state="insufficient"] .dr-izm-cell--power, .page-workspace .dr-izm-row[data-state="insufficient"] .dr-izm-zone__name { color: var(--ui-subtle); } .page-workspace .dr-izm-zone__name { display: block; color: var(--ui-ink); font: 700 13px/1.2 "DM Sans", system-ui, sans-serif; text-transform: uppercase; letter-spacing: 0.02em; } .page-workspace .dr-izm-zone__range { display: block; margin-top: 2px; color: var(--ui-subtle); font: 500 10px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; } /**/ .page-workspace .dr-izm-state { display: inline-flex; align-items: center; max-width: 100%; padding: 5px 10px; border: 1px solid var(--dr-border-strong); border-radius: 999px; background: var(--dr-surface-1); color: var(--ui-ink); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.1em; text-transform: uppercase; gap: 7px; } .page-workspace .dr-izm-state__dot { flex: none; width: 7px; height: 7px; border: 1px solid currentColor; border-radius: 999px; background: currentColor; } .page-workspace .dr-izm-state__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-izm-state[data-state="outside_band"] { border-color: var(--ui-violet); background: var(--ui-violet-soft); color: var(--ui-violet); } .page-workspace .dr-izm-state[data-state="threshold_recorded"] { border-color: var(--ui-warning); background: var(--ui-amber); color: var(--ui-warning); } .page-workspace .dr-izm-state[data-state="insufficient"] { border-style: dashed; border-color: var(--ui-line); background: none; color: var(--ui-subtle); font-weight: 500; } .page-workspace .dr-izm-state[data-state="insufficient"] .dr-izm-state__dot { background: none; } @media (max-width: 1100px) { .page-workspace .dr-izm-row { grid-template-columns: minmax(5.5rem, 0.8fr) minmax(5.75rem, 1fr) minmax(5rem, 0.9fr) minmax(4.5rem, 0.8fr) minmax(9.5rem, 1fr); gap: 8px 12px; } .page-workspace .dr-izm-state { padding: 4px 8px; letter-spacing: 0.06em; } } /**/ @media (max-width: 780px) { .page-workspace .dr-izm-row--head { display: none; } .page-workspace .dr-izm-row { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 12px; border: 1px solid var(--ui-line-soft); gap: 10px; } .page-workspace .dr-izm-row + .dr-izm-row { margin-top: 8px; } .page-workspace .dr-izm-cell--zone, .page-workspace .dr-izm-cell--state { grid-column: 1 / -1; } .page-workspace .dr-izm-cell--balance, .page-workspace .dr-izm-cell--te, .page-workspace .dr-izm-cell--power { text-align: left; } .page-workspace .dr-izm-cell--balance::before, .page-workspace .dr-izm-cell--te::before, .page-workspace .dr-izm-cell--power::before { display: block; margin-bottom: 2px; color: var(--ui-subtle); font: 700 9px "IBM Plex Mono", monospace; letter-spacing: 0.1em; text-transform: uppercase; } .page-workspace .dr-izm-cell--balance::before { content: "L/R %"; } .page-workspace .dr-izm-cell--te::before { content: "TE %"; } .page-workspace .dr-izm-cell--power::before { content: "Mean W"; } } /**/ .page-workspace .dr-epz { display: block; padding: 18px; border: 1px solid var(--ui-line); border-radius: var(--dr-radius-lg); background: none; } .page-workspace .dr-epz__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; margin-bottom: 14px; gap: 12px 20px; } .page-workspace .dr-epz__kicker { margin: 0; color: var(--ui-violet); font: 700 10px/1.2 "IBM Plex Mono", monospace; letter-spacing: 0.16em; text-transform: uppercase; } .page-workspace .dr-epz__title { margin: 4px 0 0; font: var(--dr-type-card); color: var(--ui-ink); text-transform: uppercase; letter-spacing: 0.01em; } .page-workspace .dr-epz__bracket { display: flex; flex-direction: column; align-items: flex-end; margin: 0; text-align: right; gap: 2px; } .page-workspace .dr-epz__bracket-label { color: var(--ui-subtle); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.12em; text-transform: uppercase; } .page-workspace .dr-epz__bracket-value { color: var(--ui-ink); font: 600 14px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; } .page-workspace .dr-epz__bracket-note { color: var(--ui-subtle); font: 500 10px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; } /**/ .page-workspace .dr-epz__verdict { display: grid; grid-template-columns: minmax(0, auto) minmax(0, 1fr); align-items: center; margin-bottom: 16px; padding: 14px 16px; border: 1px solid var(--ui-line); border-left: 3px solid var(--ui-violet); border-radius: var(--dr-radius-md); background: var(--ui-violet-soft); gap: 6px 22px; } .page-workspace .dr-epz__verdict-kicker { margin: 0; color: var(--ui-violet); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.14em; text-transform: uppercase; } .page-workspace .dr-epz__verdict-band { margin: 2px 0 0; color: var(--ui-ink); font: 750 clamp(20px, 2.2vw, 26px)/1.1 "DM Sans", system-ui, sans-serif; text-transform: uppercase; } .page-workspace .dr-epz__verdict-note { grid-column: 1 / -1; margin: 4px 0 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.5; } .page-workspace .dr-epz__table { display: block; } /**/ .page-workspace .dr-epz-row { display: grid; grid-template-columns: minmax(8rem, 1fr) minmax(10rem, 2.3fr) 5.25rem 5.25rem 5.25rem 6.5rem; align-items: center; padding: 10px 12px; border-radius: var(--dr-radius-sm); gap: 10px 16px; } .page-workspace .dr-epz-row + .dr-epz-row { margin-top: 2px; } .page-workspace .dr-epz-row--head { align-items: end; padding-bottom: 8px; border-bottom: 1px solid var(--ui-line); border-radius: 0; } /**/ .page-workspace .dr-epz-row:not(.dr-epz-row--head) { background: var(--dr-surface-3); } .page-workspace .dr-epz-row.is-best { background: var(--ui-violet-soft); box-shadow: inset 3px 0 0 var(--ui-violet); } /**/ .page-workspace .dr-epz-cell, .page-workspace .dr-epz__titles, .page-workspace .dr-epz__verdict-main { min-width: 0; } .page-workspace .dr-epz-col__label { display: block; color: var(--ui-subtle); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.11em; text-transform: uppercase; } .page-workspace .dr-epz-col__unit { display: block; margin-top: 2px; color: var(--ui-subtle); font-size: 10px; letter-spacing: 0.02em; opacity: 0.8; } /**/ .page-workspace .dr-epz-cell--watts, .page-workspace .dr-epz-cell--hr, .page-workspace .dr-epz-cell--te, .page-workspace .dr-epz-cell--index { color: var(--ui-ink); font: 500 var(--dr-fs-metric)/1.2 "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; text-align: right; } .page-workspace .dr-epz-row--head .dr-epz-cell--watts, .page-workspace .dr-epz-row--head .dr-epz-cell--hr, .page-workspace .dr-epz-row--head .dr-epz-cell--te, .page-workspace .dr-epz-row--head .dr-epz-cell--index { text-align: right; } .page-workspace .dr-epz-cell--index { font-weight: 600; } .page-workspace .dr-epz-row.is-best .dr-epz-cell--index { color: var(--ui-violet); font-weight: 700; } .page-workspace .dr-epz-band__name { display: block; color: var(--ui-ink); font: 700 13px/1.2 "DM Sans", system-ui, sans-serif; text-transform: uppercase; letter-spacing: 0.02em; } .page-workspace .dr-epz-band__meta { display: block; margin-top: 2px; color: var(--ui-subtle); font: 500 10px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; } /**/ .page-workspace .dr-epz-cell--cost { display: grid; grid-template-columns: minmax(0, 1fr) 4.5rem; align-items: center; gap: 10px; } .page-workspace .dr-epz-bar { height: 8px; overflow: hidden; border-radius: 999px; background: var(--dr-border-strong); } .page-workspace .dr-epz-bar[data-state="unscored"] { height: 0; border-top: 1px dashed var(--ui-line); border-radius: 0; background: none; } .page-workspace .dr-epz-bar__fill { display: block; height: 100%; min-width: 6px; border-radius: 999px; background: var(--ui-subtle); } .page-workspace .dr-epz-row.is-best .dr-epz-bar__fill, .page-workspace .dr-epz-ladder__row.is-best .dr-epz-bar__fill { background: var(--ui-violet); } .page-workspace .dr-epz-bar__delta { color: var(--ui-muted); font: 600 11px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; text-align: right; } .page-workspace .dr-epz-row.is-best .dr-epz-bar__delta, .page-workspace .dr-epz-ladder__row.is-best .dr-epz-bar__delta { color: var(--ui-violet); font-weight: 700; } .page-workspace .dr-epz-row.is-unscored .dr-epz-band__name, .page-workspace .dr-epz-row.is-unscored .dr-epz-cell--watts, .page-workspace .dr-epz-row.is-unscored .dr-epz-cell--hr, .page-workspace .dr-epz-row.is-unscored .dr-epz-cell--te, .page-workspace .dr-epz-row.is-unscored .dr-epz-cell--index { color: var(--ui-subtle); } .page-workspace .dr-epz-row.is-unscored .dr-epz-bar__delta { color: var(--ui-subtle); font-weight: 500; letter-spacing: 0.04em; text-transform: uppercase; } /**/ .page-workspace .dr-epz-ladder__row.is-unscored .dr-epz-bar__delta { color: var(--ui-subtle); font-weight: 500; font-variant-numeric: tabular-nums; } .page-workspace .dr-epz__footnote { margin: 12px 0 0; color: var(--ui-muted); font-size: 11px; line-height: 1.5; } @media (max-width: 1100px) { .page-workspace .dr-epz-row { grid-template-columns: minmax(7rem, 1fr) minmax(8rem, 1.8fr) 4.75rem 4.75rem 4.75rem 5.75rem; gap: 8px 10px; } } /**/ @media (max-width: 820px) { .page-workspace .dr-epz-row--head { display: none; } .page-workspace .dr-epz-row { grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 12px; border: 1px solid var(--ui-line-soft); gap: 10px; } .page-workspace .dr-epz-row + .dr-epz-row { margin-top: 8px; } .page-workspace .dr-epz-cell--band, .page-workspace .dr-epz-cell--cost { grid-column: 1 / -1; } .page-workspace .dr-epz-cell--watts, .page-workspace .dr-epz-cell--hr, .page-workspace .dr-epz-cell--te, .page-workspace .dr-epz-cell--index { text-align: left; } .page-workspace .dr-epz-cell--watts::before, .page-workspace .dr-epz-cell--hr::before, .page-workspace .dr-epz-cell--te::before, .page-workspace .dr-epz-cell--index::before { display: block; margin-bottom: 2px; color: var(--ui-subtle); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.1em; text-transform: uppercase; } .page-workspace .dr-epz-cell--watts::before { content: "Power W"; } .page-workspace .dr-epz-cell--hr::before { content: "HR bpm"; } .page-workspace .dr-epz-cell--te::before { content: "TE %"; } .page-workspace .dr-epz-cell--index::before { content: "Cost index"; } .page-workspace .dr-epz__verdict { grid-template-columns: minmax(0, 1fr); } .page-workspace .dr-epz__bracket { align-items: flex-start; text-align: left; } } @media (max-width: 480px) { .page-workspace .dr-epz { padding: 14px; } .page-workspace .dr-epz-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-epz-cell--cost { grid-template-columns: minmax(0, 1fr) 4.25rem; } } /**/ .page-workspace .dr-epz-card { min-width: 0; } .page-workspace .dr-epz-card__body { display: grid; gap: 14px; } /**/ .page-workspace .dr-epz-card__ride { display: flex; flex-wrap: wrap; margin: 0 !important; color: var(--ui-muted); font-size: 12.5px; gap: 4px; } .page-workspace .dr-epz-card__ride strong { color: var(--ui-ink); font-weight: 720; } /**/ .page-workspace .dr-epz-card__reconciler { margin: 0; padding: 10px 13px; border-left: 3px solid var(--ui-violet); border-radius: var(--dr-radius-sm); background: var(--ui-violet-soft); color: var(--ui-ink); font-size: 12.5px; line-height: 1.5; } .page-workspace .dr-epz-card__reconciler strong { font-weight: 760; font-variant-numeric: tabular-nums; white-space: nowrap; } .page-workspace .dr-epz-card__readings { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; } .page-workspace .dr-epz-card__reading { display: grid; align-content: start; padding: 11px 13px; border: 1px solid var(--ui-line); border-radius: 12px; background: var(--dr-surface-2); gap: 3px; } /**/ .page-workspace .dr-epz-card__reading:first-child { border-color: var(--ui-violet); background: var(--ui-violet-soft); } .page-workspace .dr-epz-card__reading .dr-kicker { margin: 0; color: var(--ui-muted); /**/ line-height: 1.35; } .page-workspace .dr-epz-card__reading strong { color: var(--ui-ink); font-size: 21px; font-weight: 760; font-variant-numeric: tabular-nums; letter-spacing: -0.025em; line-height: 1.1; } .page-workspace .dr-epz-card__reading-note { color: var(--ui-muted); font-size: 11px; line-height: 1.35; } .page-workspace .dr-epz-card__ladder > .dr-kicker { margin: 0 0 8px; color: var(--ui-violet); } .page-workspace .dr-epz-ladder { display: grid; gap: 4px; } /**/ .page-workspace .dr-epz-ladder__row { display: grid; grid-template-columns: minmax(5.5rem, 7rem) minmax(0, 1fr) 4.75rem; align-items: center; padding: 7px 10px; border-radius: var(--dr-radius-sm); background: var(--dr-surface-3); gap: 12px; } .page-workspace .dr-epz-ladder__row.is-best { background: var(--ui-violet-soft); box-shadow: inset 3px 0 0 var(--ui-violet); } .page-workspace .dr-epz-ladder__band { min-width: 0; overflow: hidden; color: var(--ui-ink); font: 700 12px/1.2 "DM Sans", system-ui, sans-serif; letter-spacing: 0.02em; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-epz-ladder__row.is-unscored .dr-epz-ladder__band { color: var(--ui-subtle); } .page-workspace .dr-epz-card__note { margin: 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.5; } .page-workspace .dr-epz-card__empty { padding: 14px 16px; border: 1px dashed var(--ui-line); border-radius: var(--dr-radius-md); background: var(--dr-surface-3); } .page-workspace .dr-epz-card__empty h3 { margin: 0; color: var(--ui-ink); font-size: 14px; font-weight: 760; } .page-workspace .dr-epz-card__empty p { margin: 6px 0 0; color: var(--ui-muted); font-size: 12.5px; line-height: 1.55; } @media (max-width: 480px) { .page-workspace .dr-epz-ladder__row { grid-template-columns: minmax(4.5rem, 5.5rem) minmax(0, 1fr) 4.25rem; gap: 8px; } } /**/ .page-workspace .dr-cpl { display: block; padding: 18px; border: 1px solid var(--ui-line); border-radius: var(--dr-radius-lg); background: none; } .page-workspace .dr-cpl__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; margin-bottom: 16px; gap: 14px 24px; } .page-workspace .dr-cpl__titles { flex: 1 1 22rem; min-width: 0; } .page-workspace .dr-cpl__kicker { margin: 0; color: var(--ui-violet); font: 700 10px/1.2 "IBM Plex Mono", monospace; letter-spacing: 0.16em; text-transform: uppercase; } .page-workspace .dr-cpl__title { margin: 4px 0 0; font: var(--dr-type-card); color: var(--ui-ink); text-transform: uppercase; letter-spacing: 0.01em; } .page-workspace .dr-cpl__lede { max-width: 46ch; margin: 6px 0 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.5; } /**/ .page-workspace .dr-cpl__control { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; gap: 6px; } .page-workspace .dr-cpl__control-label { color: var(--ui-subtle); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.12em; text-transform: uppercase; } .page-workspace .dr-cpl__field { display: flex; align-items: center; padding: 4px; border: 1px solid var(--dr-border-strong); border-radius: var(--dr-radius-md); background: var(--dr-surface-2); gap: 2px; } .page-workspace .dr-cpl__field:focus-within { border-color: var(--ui-violet); box-shadow: 0 0 0 3px var(--ui-violet-soft); } .page-workspace .dr-cpl__input { width: 4.5rem; padding: 4px 2px; border: 0; background: none; color: var(--ui-ink); font: 700 20px/1.1 "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; text-align: right; } .page-workspace .dr-cpl__input:focus { outline: none; } /**/ .page-workspace .dr-cpl__input::-webkit-outer-spin-button, .page-workspace .dr-cpl__input::-webkit-inner-spin-button { margin: 0; -webkit-appearance: none; appearance: none; } .page-workspace .dr-cpl__input[type="number"] { -moz-appearance: textfield; appearance: textfield; } .page-workspace .dr-cpl__field-unit { padding-right: 6px; color: var(--ui-muted); font: 600 12px "IBM Plex Mono", monospace; } /**/ .page-workspace .dr-cpl-mode { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; } .page-workspace .dr-cpl-mode__label { color: var(--ui-subtle); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.12em; text-transform: uppercase; } .page-workspace .dr-cpl-mode__group { display: flex; padding: 3px; border: 1px solid var(--dr-border-strong); border-radius: var(--dr-radius-md); background: var(--dr-surface-2); gap: 2px; } .page-workspace .dr-cpl-mode__option { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 14px; border: 1px solid transparent; border-radius: var(--dr-radius-sm); background: transparent; color: var(--ui-muted); font: 600 11.5px "DM Sans", system-ui, sans-serif; letter-spacing: 0.02em; white-space: nowrap; cursor: pointer; } .page-workspace .dr-cpl-mode__option:hover:not(.is-active) { color: var(--ui-ink); background: var(--dr-surface-3); } .page-workspace .dr-cpl-mode__option:focus-visible { outline: 2px solid var(--ui-violet); outline-offset: 1px; } /**/ .page-workspace .dr-cpl-mode__option.is-active { border-color: var(--ui-violet); background: var(--ui-violet-soft); color: var(--ui-violet); font-weight: 700; } /**/ .page-workspace .dr-cpl-mode__hint { margin-left: 4px; font-weight: 500; opacity: 0.75; } /**/ .page-workspace .dr-cpl-cell__sub { display: block; margin-top: 2px; color: var(--ui-subtle); font: 500 10px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; } /**/ .page-workspace .dr-cplc__control-note { flex: 1 0 100%; margin: 0; color: var(--ui-subtle); font: 500 10px "IBM Plex Mono", monospace; letter-spacing: 0.02em; } /**/ .page-workspace .dr-cpl-step { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--ui-line); border-radius: var(--dr-radius-sm); background: var(--dr-surface-3); color: var(--ui-ink); cursor: pointer; } .page-workspace .dr-cpl-step:hover:not(:disabled) { border-color: var(--ui-violet); background: var(--ui-violet-soft); color: var(--ui-violet); } .page-workspace .dr-cpl-step:disabled { opacity: 0.35; cursor: not-allowed; } .page-workspace .dr-cpl__control-note { margin: 0; color: var(--ui-subtle); font: 500 10px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; } /**/ .page-workspace .dr-cpl__notice { margin: 0 0 14px; padding: 10px 12px; border: 1px solid #ead49d; border-radius: var(--dr-radius-md); background: var(--ui-amber); color: var(--ui-warning); font-size: 11.5px; line-height: 1.5; } .page-workspace .dr-cpl__verdict { display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; margin-bottom: 14px; padding: 14px 16px; border: 1px solid var(--ui-line); border-left: 3px solid var(--ui-violet); border-radius: var(--dr-radius-md); background: var(--ui-violet-soft); gap: 8px 22px; } /**/ .page-workspace .dr-cpl__verdict-main { min-width: 0; max-width: 62ch; } .page-workspace .dr-cpl__verdict-kicker { margin: 0; color: var(--ui-violet); font: 700 10px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; letter-spacing: 0.14em; text-transform: uppercase; } .page-workspace .dr-cpl__verdict-band { margin: 2px 0 0; color: var(--ui-ink); font: 750 clamp(20px, 2.2vw, 26px)/1.1 "DM Sans", system-ui, sans-serif; text-transform: uppercase; } .page-workspace .dr-cpl__verdict-note { margin: 4px 0 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.5; } /**/ .page-workspace .dr-cpl__evidence { display: flex; flex-wrap: wrap; grid-column: 1 / -1; gap: 6px; } .page-workspace .dr-cpl__chip { padding: 3px 9px; border: 1px solid var(--ui-line); border-radius: 999px; background: var(--dr-surface-2); color: var(--ui-muted); font: 600 10px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; letter-spacing: 0.06em; text-transform: uppercase; } .page-workspace .dr-cpl__chip.is-corroborated { border-color: #b9ddce; background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-cpl__chip.is-single { border-color: #ead49d; background: var(--ui-amber); color: var(--ui-warning); } /**/ .page-workspace .dr-cpl__signpost { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-bottom: 14px; padding: 14px 16px; border: 1px dashed var(--dr-border-strong); border-radius: var(--dr-radius-md); background: var(--dr-surface-3); gap: 10px 18px; } .page-workspace .dr-cpl__signpost-copy { flex: 1 1 22rem; margin: 0; color: var(--ui-ink); font-size: 12px; line-height: 1.5; } .page-workspace .dr-cpl__bracket { display: flex; flex-wrap: wrap; align-items: baseline; margin: 0 0 12px; gap: 4px 10px; } .page-workspace .dr-cpl__bracket-label { color: var(--ui-subtle); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.12em; text-transform: uppercase; } .page-workspace .dr-cpl__bracket-value { color: var(--ui-ink); font: 600 14px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; } .page-workspace .dr-cpl__bracket-note { flex: 1 1 18rem; color: var(--ui-subtle); font: 500 10.5px/1.45 "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; } .page-workspace .dr-cpl__table { display: block; } .page-workspace .dr-cpl-row { display: grid; grid-template-columns: minmax(8rem, 1fr) minmax(10rem, 2.3fr) 5.25rem 5.25rem 5.25rem 6.5rem; align-items: center; padding: 10px 12px; border-radius: var(--dr-radius-sm); gap: 10px 16px; } .page-workspace .dr-cpl-row + .dr-cpl-row { margin-top: 2px; } .page-workspace .dr-cpl-row--head { align-items: end; padding-bottom: 8px; border-bottom: 1px solid var(--ui-line); border-radius: 0; } /**/ .page-workspace .dr-cpl-row:not(.dr-cpl-row--head) { background: var(--dr-surface-3); } .page-workspace .dr-cpl-row.is-best { background: var(--ui-violet-soft); box-shadow: inset 3px 0 0 var(--ui-violet); } .page-workspace .dr-cpl-cell { min-width: 0; } .page-workspace .dr-cpl-col__label { display: block; color: var(--ui-subtle); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.11em; text-transform: uppercase; } .page-workspace .dr-cpl-col__unit { display: block; margin-top: 2px; color: var(--ui-subtle); font-size: 10px; letter-spacing: 0.02em; opacity: 0.8; } .page-workspace .dr-cpl-cell--watts, .page-workspace .dr-cpl-cell--hr, .page-workspace .dr-cpl-cell--te, .page-workspace .dr-cpl-cell--index { color: var(--ui-ink); font: 500 var(--dr-fs-metric)/1.2 "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; text-align: right; } .page-workspace .dr-cpl-cell--index { font-weight: 600; } .page-workspace .dr-cpl-row.is-best .dr-cpl-cell--index { color: var(--ui-violet); font-weight: 700; } .page-workspace .dr-cpl-band__name { display: block; color: var(--ui-ink); font: 700 13px/1.2 "DM Sans", system-ui, sans-serif; letter-spacing: 0.02em; text-transform: uppercase; } .page-workspace .dr-cpl-band__meta { display: block; margin-top: 2px; color: var(--ui-subtle); font: 500 10px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; } .page-workspace .dr-cpl-cell--cost { display: grid; grid-template-columns: minmax(0, 1fr) 4.5rem; align-items: center; gap: 10px; } .page-workspace .dr-cpl-bar { height: 8px; overflow: hidden; border-radius: 999px; background: var(--dr-border-strong); } .page-workspace .dr-cpl-bar[data-state="unscored"] { height: 0; border-top: 1px dashed var(--ui-line); border-radius: 0; background: none; } .page-workspace .dr-cpl-bar__fill { display: block; height: 100%; min-width: 6px; border-radius: 999px; background: var(--ui-subtle); } .page-workspace .dr-cpl-row.is-best .dr-cpl-bar__fill { background: var(--ui-violet); } .page-workspace .dr-cpl-bar__delta { color: var(--ui-muted); font: 600 11px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; text-align: right; } .page-workspace .dr-cpl-row.is-best .dr-cpl-bar__delta { color: var(--ui-violet); font-weight: 700; } .page-workspace .dr-cpl-row.is-unscored .dr-cpl-band__name, .page-workspace .dr-cpl-row.is-unscored .dr-cpl-cell--watts, .page-workspace .dr-cpl-row.is-unscored .dr-cpl-cell--hr, .page-workspace .dr-cpl-row.is-unscored .dr-cpl-cell--te, .page-workspace .dr-cpl-row.is-unscored .dr-cpl-cell--index { color: var(--ui-subtle); } .page-workspace .dr-cpl-row.is-unscored .dr-cpl-bar__delta { color: var(--ui-subtle); font-weight: 500; letter-spacing: 0.04em; text-transform: uppercase; } /**/ .page-workspace .dr-cpl__coverage { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--ui-line); } .page-workspace .dr-cpl__coverage-head { margin-bottom: 10px; } .page-workspace .dr-cpl__coverage-title { margin: 0; color: var(--ui-subtle); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.12em; text-transform: uppercase; } .page-workspace .dr-cpl__coverage-note { margin: 3px 0 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.5; } .page-workspace .dr-cpl__ladder { display: flex; align-items: flex-end; height: 104px; padding-bottom: 16px; gap: 2px; } .page-workspace .dr-cpl-rung { display: flex; position: relative; flex: 1 1 0; align-items: flex-end; justify-content: center; min-width: 6px; height: 100%; padding: 0; border: 0; border-radius: 2px 2px 0 0; background: none; cursor: pointer; } .page-workspace .dr-cpl-rung:hover .dr-cpl-rung__bar { outline: 1px solid var(--ui-violet); } .page-workspace .dr-cpl-rung:focus-visible { outline: 2px solid var(--ui-violet); outline-offset: 2px; } .page-workspace .dr-cpl-rung__bar { display: block; width: 100%; min-height: 3px; border-radius: 2px 2px 0 0; background: var(--dr-border-strong); } /**/ .page-workspace .dr-cpl-rung[data-state="comparable"] .dr-cpl-rung__bar { background: var(--ui-violet); } .page-workspace .dr-cpl-rung[data-state="answerable"] .dr-cpl-rung__bar { background: #a79bea; } .page-workspace .dr-cpl-rung[data-state="thin"] .dr-cpl-rung__bar { background: var(--dr-border-strong); opacity: 0.55; } .page-workspace .dr-cpl-rung.is-target .dr-cpl-rung__bar { box-shadow: 0 0 0 2px var(--ui-ink); } .page-workspace .dr-cpl-rung__tick { position: absolute; bottom: -15px; color: var(--ui-subtle); font: 500 9px "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; white-space: nowrap; } .page-workspace .dr-cpl__legend { display: flex; flex-wrap: wrap; margin-top: 6px; gap: 6px 16px; } .page-workspace .dr-cpl__legend-item { display: inline-flex; align-items: center; color: var(--ui-subtle); font: 500 10px "IBM Plex Mono", monospace; gap: 5px; } .page-workspace .dr-cpl__legend-item::before { display: inline-block; width: 10px; height: 10px; border-radius: 2px; background: var(--dr-border-strong); content: ""; } .page-workspace .dr-cpl__legend-item[data-state="comparable"]::before { background: var(--ui-violet); } .page-workspace .dr-cpl__legend-item[data-state="answerable"]::before { background: #a79bea; } .page-workspace .dr-cpl__legend-item[data-state="thin"]::before { background: var(--dr-border-strong); opacity: 0.55; } .page-workspace .dr-cpl__footnote { margin: 12px 0 0; color: var(--ui-muted); font-size: 11px; line-height: 1.5; } @media (max-width: 1100px) { .page-workspace .dr-cpl-row { grid-template-columns: minmax(7rem, 1fr) minmax(8rem, 1.8fr) 4.75rem 4.75rem 4.75rem 5.75rem; gap: 8px 10px; } } /**/ @media (max-width: 820px) { .page-workspace .dr-cpl__control { align-items: flex-start; width: 100%; } /**/ .page-workspace .dr-cpl__control-note { max-width: 100%; } /**/ .page-workspace .dr-cpl-mode { flex-direction: column; align-items: flex-start; gap: 6px; } .page-workspace .dr-cpl-mode__group { width: 100%; } .page-workspace .dr-cpl-mode__option { flex: 1 1 0; padding: 0 10px; } /**/ .page-workspace .dr-cpl-mode__hint { display: none; } .page-workspace .dr-cpl-row--head { display: none; } .page-workspace .dr-cpl-row { grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 12px; border: 1px solid var(--ui-line-soft); gap: 10px; } .page-workspace .dr-cpl-row + .dr-cpl-row { margin-top: 8px; } .page-workspace .dr-cpl-cell--band, .page-workspace .dr-cpl-cell--cost { grid-column: 1 / -1; } .page-workspace .dr-cpl-cell--watts, .page-workspace .dr-cpl-cell--hr, .page-workspace .dr-cpl-cell--te, .page-workspace .dr-cpl-cell--index { text-align: left; } .page-workspace .dr-cpl-cell--watts::before, .page-workspace .dr-cpl-cell--hr::before, .page-workspace .dr-cpl-cell--te::before, .page-workspace .dr-cpl-cell--index::before { display: block; margin-bottom: 2px; color: var(--ui-subtle); font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 0.1em; text-transform: uppercase; } .page-workspace .dr-cpl-cell--watts::before { content: "Power W"; } .page-workspace .dr-cpl-cell--hr::before { content: "HR bpm " "\0000b7" " ratio"; } .page-workspace .dr-cpl-cell--te::before { content: "TE %"; } .page-workspace .dr-cpl-cell--index::before { content: "Cost index"; } } @media (max-width: 480px) { .page-workspace .dr-cpl { padding: 14px; } .page-workspace .dr-cpl-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } .page-workspace .dr-cpl-cell--cost { grid-template-columns: minmax(0, 1fr) 4.25rem; } /**/ .page-workspace .dr-cpl-rung__tick { display: none; } } /**/ .page-workspace .dr-cplc { min-width: 0; } .page-workspace .dr-cplc__body { display: grid; gap: 14px; } .page-workspace .dr-cplc__control { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; } /**/ .page-workspace .dr-cpl-ladder { display: grid; gap: 4px; } .page-workspace .dr-cpl-ladder__row { display: grid; grid-template-columns: minmax(5.5rem, 7rem) minmax(0, 1fr) 4.75rem; align-items: center; padding: 7px 10px; border-radius: var(--dr-radius-sm); background: var(--dr-surface-3); gap: 12px; } .page-workspace .dr-cpl-ladder__row.is-best { background: var(--ui-violet-soft); box-shadow: inset 3px 0 0 var(--ui-violet); } .page-workspace .dr-cpl-ladder__row.is-best .dr-cpl-bar__fill { background: var(--ui-violet); } .page-workspace .dr-cpl-ladder__row.is-best .dr-cpl-bar__delta { color: var(--ui-violet); font-weight: 700; } /**/ .page-workspace .dr-cpl-ladder__row.is-unscored .dr-cpl-bar__delta { color: var(--ui-subtle); font-weight: 500; font-variant-numeric: tabular-nums; letter-spacing: 0; text-transform: none; } .page-workspace .dr-cpl-ladder__band { min-width: 0; overflow: hidden; color: var(--ui-ink); font: 700 12px/1.2 "DM Sans", system-ui, sans-serif; letter-spacing: 0.02em; text-overflow: ellipsis; white-space: nowrap; } .page-workspace .dr-cpl-ladder__row.is-unscored .dr-cpl-ladder__band { color: var(--ui-subtle); } .page-workspace .dr-cplc__readings { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; } .page-workspace .dr-cplc__reading { display: grid; align-content: start; padding: 11px 13px; border: 1px solid var(--ui-line); border-radius: 12px; background: var(--dr-surface-2); gap: 3px; } /**/ .page-workspace .dr-cplc__reading:first-child { border-color: var(--ui-violet); background: var(--ui-violet-soft); } .page-workspace .dr-cplc__reading .dr-kicker { margin: 0; color: var(--ui-muted); line-height: 1.35; } .page-workspace .dr-cplc__reading strong { color: var(--ui-ink); font-size: 21px; font-weight: 760; font-variant-numeric: tabular-nums; letter-spacing: -0.025em; line-height: 1.1; } .page-workspace .dr-cplc__reading-note { color: var(--ui-muted); font-size: 11px; line-height: 1.35; } /**/ .page-workspace .dr-cplc__corroboration { margin: 0; padding: 8px 12px; border: 1px solid var(--ui-line); border-radius: var(--dr-radius-sm); font-size: 11.5px; line-height: 1.5; } .page-workspace .dr-cplc__corroboration.is-corroborated { border-color: #b9ddce; background: var(--ui-mint); color: var(--ui-success); } .page-workspace .dr-cplc__corroboration.is-single { border-color: #ead49d; background: var(--ui-amber); color: var(--ui-warning); } .page-workspace .dr-cplc__notice { margin: 0; padding: 10px 12px; border: 1px solid #ead49d; border-radius: var(--dr-radius-md); background: var(--ui-amber); color: var(--ui-warning); font-size: 11.5px; line-height: 1.5; } .page-workspace .dr-cplc__ladder > .dr-kicker, .page-workspace .dr-cplc__coverage > .dr-kicker { margin: 0 0 8px; color: var(--ui-violet); } .page-workspace .dr-cplc__coverage-note { margin: 6px 0 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.5; } .page-workspace .dr-cplc__note { margin: 0; color: var(--ui-muted); font-size: 11.5px; line-height: 1.5; } .page-workspace .dr-cplc__empty { padding: 14px 16px; border: 1px dashed var(--ui-line); border-radius: var(--dr-radius-md); background: var(--dr-surface-3); } .page-workspace .dr-cplc__empty h3 { margin: 0; color: var(--ui-ink); font-size: 14px; font-weight: 760; } .page-workspace .dr-cplc__empty p { margin: 6px 0 10px; color: var(--ui-muted); font-size: 12.5px; line-height: 1.55; } @media (max-width: 480px) { .page-workspace .dr-cpl-ladder__row { grid-template-columns: minmax(4.5rem, 5.5rem) minmax(0, 1fr) 4.25rem; gap: 8px; } } /**/ .page-workspace .dr-ceb-card { min-width: 0; } .page-workspace .dr-ceb-card__body { display: grid; gap: 14px; } /**/ .page-workspace .dr-ceb-hero { display: grid; padding: 15px 17px; border: 1px solid var(--dr-accent-border); border-left: 3px solid var(--ui-green-2); border-radius: var(--dr-radius-md); background: var(--ui-green-soft); gap: 4px; } /**/ .page-workspace .dr-ceb-hero--single { border-color: var(--ui-line); border-left-color: var(--ui-line); background: var(--dr-surface-3); } .page-workspace .dr-ceb-hero--single .dr-ceb-hero__kicker { color: var(--ui-muted); } /**/ .page-workspace .dr-ceb-hero__kicker { margin: 0; color: var(--ui-green-2); font-weight: 760; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; } /**/ .page-workspace .dr-ceb-hero__badge { display: block; color: var(--ui-ink); font-weight: 800; font-size: 30px; font-variant-numeric: tabular-nums; line-height: 1.15; letter-spacing: -0.01em; } .page-workspace .dr-ceb-hero__caption { margin: 0; max-width: 60ch; color: var(--ui-muted); font-size: 12.5px; line-height: 1.55; } /**/ .page-workspace .dr-ceb-bands { display: grid; margin: 0; padding: 0; list-style: none; gap: 10px; } .page-workspace .dr-ceb-band { display: grid; padding: 9px 12px; border: 1px solid var(--ui-line); border-radius: var(--dr-radius-sm); background: var(--dr-surface-1); gap: 5px; } .page-workspace .dr-ceb-band.is-sweet-spot { border-color: var(--dr-accent-border); background: var(--ui-green-soft); } .page-workspace .dr-ceb-band__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; } .page-workspace .dr-ceb-band__label { color: var(--ui-ink); font-weight: 760; font-size: 13.5px; font-variant-numeric: tabular-nums; white-space: nowrap; } .page-workspace .dr-ceb-band__held { color: var(--ui-muted); font-size: 11.5px; font-variant-numeric: tabular-nums; white-space: nowrap; } /**/ .page-workspace .dr-ceb-band__track { overflow: hidden; height: 6px; border-radius: 999px; background: var(--ui-line-soft); } .page-workspace .dr-ceb-band__fill { display: block; height: 100%; border-radius: 999px; background: var(--ui-subtle); } .page-workspace .dr-ceb-band--optimal .dr-ceb-band__fill { background: var(--ui-green-2); } .page-workspace .dr-ceb-band--drag .dr-ceb-band__fill { background: var(--ui-warning); } .page-workspace .dr-ceb-band--overspin .dr-ceb-band__fill { background: var(--ui-danger); } .page-workspace .dr-ceb-band__note { margin: 0; color: var(--ui-muted); font-size: 12px; line-height: 1.5; } .page-workspace .dr-ceb-band.is-sweet-spot .dr-ceb-band__note { color: var(--ui-ink); font-weight: 640; } .page-workspace .dr-ceb-band__marker { margin-right: 5px; } /**/ .page-workspace .dr-ceb-habit { margin: 0; padding: 9px 13px; border-left: 3px solid var(--ui-line); border-radius: var(--dr-radius-sm); background: var(--dr-surface-3); color: var(--ui-muted); font-size: 12px; line-height: 1.5; } .page-workspace .dr-ceb-habit strong { color: var(--ui-ink); font-weight: 740; } /**/ .page-workspace .dr-ceb-refusal { padding: 12px 14px; border: 1px dashed var(--ui-line); border-radius: var(--dr-radius-sm); background: var(--dr-surface-3); } .page-workspace .dr-ceb-refusal p { margin: 0; max-width: 62ch; color: var(--ui-muted); font-size: 12.5px; line-height: 1.55; } @media (max-width: 480px) { .page-workspace .dr-ceb-hero__badge { font-size: 25px; } .page-workspace .dr-ceb-band__head { flex-wrap: wrap; gap: 2px; } } /**/ .dr-status-chip { display: inline-flex; align-items: center; gap: 5px; /**/ max-width: 100%; padding: 3px 8px; border: 1px solid transparent; border-radius: 999px; background: transparent; font-family: "IBM Plex Mono", ui-monospace, monospace; /**/ font-size: 10px; font-weight: 700; line-height: 1.35; letter-spacing: 0.07em; text-transform: uppercase; white-space: normal; overflow-wrap: break-word; } /**/ .dr-status-chip--neutral { border-color: var(--ui-line); background: var(--ui-line-soft); color: var(--ui-muted); } /**/ .dr-status-chip--elevated { border-color: var(--ui-success); background: var(--ui-mint); color: var(--ui-success); } /**/ .dr-status-chip--steady { border-color: var(--ui-line); background: var(--ui-green-soft); color: var(--ui-green-2); } /**/ .dr-status-chip--nominal { border-color: var(--ui-green-2); background: var(--ui-green-soft); color: var(--ui-green-2); } /**/ .dr-status-chip--context { border-color: var(--ui-violet); background: var(--ui-violet-soft); color: var(--ui-violet); } /**/ .dr-status-chip--attention { border-color: var(--ui-danger); background: var(--ui-rose); color: var(--ui-danger); } /**/ .dr-status-chip--muted { border-color: var(--ui-line); background: transparent; color: var(--ui-subtle); } /**/ @media print { .dr-status-chip { background: transparent !important; color: #1a1a1a !important; border-color: #6b6b6b !important; } .dr-status-chip--attention { border-width: 2px !important; } } /**/ .dr-status-surface { border: 1px solid var(--ui-line); background: var(--ui-white); } .dr-status-surface--neutral { border-color: var(--ui-line); background: var(--ui-line-soft); } .dr-status-surface--elevated { border-color: var(--ui-success); background: var(--ui-white); } .dr-status-surface--steady { border-color: var(--ui-line); background: var(--ui-green-soft); } .dr-status-surface--nominal { border-color: var(--ui-green-2); background: var(--ui-green-soft); } .dr-status-surface--context { border-color: var(--ui-violet); background: var(--ui-white); } .dr-status-surface--attention { border-color: var(--ui-danger); background: var(--ui-rose); } .dr-status-surface--muted { border-color: var(--ui-line); background: transparent; } /**/ .page-workspace .dr-status-surface, .page-workspace .dr-status-surface [class*="text-white/"] { color: var(--ui-ink) !important; } .page-workspace .dr-status-surface .dr-kicker-compact { color: var(--ui-muted) !important; } /**/ .dr-guardrail { border: 1px solid var(--ui-warning); border-radius: var(--ui-radius-sm); background: var(--ui-amber); color: var(--ui-ink); padding: 14px 16px; } .dr-guardrail__head { display: flex; align-items: center; gap: 7px; color: var(--ui-warning); font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; } .dr-guardrail__body { margin: 7px 0 0; max-width: 78ch; color: var(--ui-ink); font-size: 12.5px; line-height: 1.6; } /**/ .page-workspace .dr-guardrail, .page-workspace .dr-guardrail__body { color: var(--ui-ink) !important; } .page-workspace .dr-guardrail__head { color: var(--ui-warning) !important; } /**/ .page-workspace .dr-leak-recovery { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 9px; margin-top: 12px; padding: 11px 13px; border: 1px solid var(--ui-violet); border-radius: var(--ui-radius-sm); background: var(--ui-violet-soft); } .page-workspace .dr-leak-recovery p { flex: 1 1 22ch; min-width: 0; max-width: 74ch; margin: 0; color: var(--ui-ink) !important; font-size: 12px; line-height: 1.55; } /**/ /**/ .page-workspace .dr-rides3-outlier { align-self: flex-start; margin-top: 4px; } .page-workspace .dr-rides3-matched[aria-pressed="true"], .page-workspace .dr-rides3-matched--on { border-color: var(--ui-green-2); background: var(--ui-green-soft); color: var(--ui-green-2); } .page-workspace .dr-rides3-matched--on i { color: var(--ui-green-2); }