/* ui-design scene (generated): canonical Alpy dark tokens it uses, plus the rules of the video's app CSS it uses. */
:root, .ai-taste-ui-skills-stage {
  color-scheme: dark;
  --alpy-ui-color-border-neutral-subtle-one: #151515;
  --alpy-ui-color-border-neutral-subtle-two: #1C1C1C;
  --alpy-ui-color-functional-danger: #EF4444;
  --alpy-ui-color-functional-danger-subtle: #4D0000;
  --alpy-ui-color-functional-success-subtle: #166534;
  --alpy-ui-color-icon-subtle: #767676;
  --alpy-ui-color-icon-subtlest: #333333;
  --alpy-ui-color-shades-brand-color-one-strong-one: #5F92FE;
  --alpy-ui-color-shades-brand-color-three-strong-one: #E5BA65;
  --alpy-ui-color-shades-brand-color-three-subtle-one: #3F2A00;
  --alpy-ui-color-shades-brand-color-three-subtle-two: #9E6800;
  --alpy-ui-color-shades-brand-color-two-strong-one: #7FB581;
  --alpy-ui-color-shades-brand-color-two-subtle-one: #0D2E10;
  --alpy-ui-color-shades-brand-color-two-subtle-three: #058625;
  --alpy-ui-color-shades-brand-color-two-subtle-two: #156221;
  --alpy-ui-color-shades-neutral-strong-three: #F1F1F1;
  --alpy-ui-color-shades-neutral-subtle-one: #151515;
  --alpy-ui-color-shades-neutral-subtle-three: #333333;
  --alpy-ui-color-shades-neutral-subtle-two: #242424;
  --alpy-ui-color-surface-canvas: #000000;
  --alpy-ui-color-system-black: #000000;
  --alpy-ui-color-system-transparent: #00000000;
  --alpy-ui-color-text-body: #A1A1A1;
  --alpy-ui-color-text-body-muted: #767676;
  --alpy-ui-color-text-body-subtle: #5C5C5C;
  --alpy-ui-color-text-functional-danger: #B80808;
  --alpy-ui-color-text-functional-success-strong: #166534;
  --alpy-ui-color-text-functional-warning: #AE6D00;
  --alpy-ui-color-text-heading: #F1F1F1;
  --alpy-ui-color-text-inverse: #FFFFFF;
  --alpy-ui-component-button-size-md-borderWidth: var(--alpy-ui-size-1);
  --alpy-ui-component-button-size-md-gap: var(--alpy-ui-size-8);
  --alpy-ui-component-button-size-md-iconSize: var(--alpy-ui-size-16);
  --alpy-ui-component-button-size-md-minHeight: var(--alpy-ui-size-40);
  --alpy-ui-component-button-size-md-paddingX: var(--alpy-ui-size-16);
  --alpy-ui-component-button-size-md-paddingY: var(--alpy-ui-size-0);
  --alpy-ui-component-button-size-md-radius: var(--alpy-ui-size-8);
  --alpy-ui-component-button-size-md-text-fontFamily: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --alpy-ui-component-button-size-md-text-fontSize: 14px;
  --alpy-ui-component-button-size-md-text-letterSpacing: 0;
  --alpy-ui-component-button-size-md-text-lineHeight: 20px;
  --alpy-ui-component-button-variant-outline-bg-default: #00000000;
  --alpy-ui-component-button-variant-outline-border-default: #FFFFFF;
  --alpy-ui-component-button-variant-outline-text-default: #FFFFFF;
  --alpy-ui-component-button-variant-primary-bg-default: #0051FF;
  --alpy-ui-component-button-variant-primary-border-default: #0051FF;
  --alpy-ui-component-button-variant-primary-text-default: #FFFFFF;
  --alpy-ui-component-card-styles-default-bg-default: #000000;
  --alpy-ui-component-card-styles-default-border-default: #1C1C1C;
  --alpy-ui-font-body-fontFamily: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --alpy-ui-font-body-fontSize: 16px;
  --alpy-ui-font-body-large-fontSize: 19px;
  --alpy-ui-font-body-large-lineHeight: 28px;
  --alpy-ui-font-body-letterSpacing: 0;
  --alpy-ui-font-body-lineHeight: 24px;
  --alpy-ui-font-body-medium-fontFamily: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --alpy-ui-font-body-medium-fontSize: 14px;
  --alpy-ui-font-body-medium-lineHeight: 20px;
  --alpy-ui-font-body-small-fontSize: 12px;
  --alpy-ui-font-body-small-lineHeight: 20px;
  --alpy-ui-font-heading-large-fontFamily: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --alpy-ui-font-heading-large-fontSize: 40px;
  --alpy-ui-font-heading-large-fontWeight: 700;
  --alpy-ui-font-heading-large-letterSpacing: -0.02em;
  --alpy-ui-font-heading-large-lineHeight: 48px;
  --alpy-ui-font-heading-xsmall-fontFamily: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --alpy-ui-font-heading-xsmall-fontSize: 23px;
  --alpy-ui-font-heading-xsmall-lineHeight: 28px;
  --alpy-ui-font-weight-bold: 700;
  --alpy-ui-font-weight-medium: 500;
  --alpy-ui-font-weight-regular: 400;
  --alpy-ui-font-weight-semiBold: 600;
  --alpy-ui-radius-full: var(--alpy-ui-size-9999);
  --alpy-ui-radius-large: var(--alpy-ui-size-12);
  --alpy-ui-radius-medium: var(--alpy-ui-size-8);
  --alpy-ui-radius-small: var(--alpy-ui-size-4);
  --alpy-ui-size-0: 0px;
  --alpy-ui-size-1: 1px;
  --alpy-ui-size-1020: 1020px;
  --alpy-ui-size-104: 104px;
  --alpy-ui-size-108: 108px;
  --alpy-ui-size-12: 12px;
  --alpy-ui-size-128: 128px;
  --alpy-ui-size-16: 16px;
  --alpy-ui-size-192: 192px;
  --alpy-ui-size-2: 2px;
  --alpy-ui-size-20: 20px;
  --alpy-ui-size-200: 200px;
  --alpy-ui-size-24: 24px;
  --alpy-ui-size-28: 28px;
  --alpy-ui-size-4: 4px;
  --alpy-ui-size-40: 40px;
  --alpy-ui-size-48: 48px;
  --alpy-ui-size-52: 52px;
  --alpy-ui-size-750: 750px;
  --alpy-ui-size-8: 8px;
  --alpy-ui-size-80: 80px;
  --alpy-ui-size-84: 84px;
  --alpy-ui-size-9999: 9999px;
  --alpy-ui-space-0: var(--alpy-ui-size-0);
  --alpy-ui-space-12: var(--alpy-ui-size-12);
  --alpy-ui-space-16: var(--alpy-ui-size-16);
  --alpy-ui-space-20: var(--alpy-ui-size-20);
  --alpy-ui-space-28: var(--alpy-ui-size-28);
  --alpy-ui-space-4: var(--alpy-ui-size-4);
  --alpy-ui-space-8: var(--alpy-ui-size-8);
}
.product-button { --product-button-border-width: var(--alpy-ui-component-button-size-md-borderWidth); --product-button-radius: var(--alpy-ui-component-button-size-md-radius); --product-button-font-family: var(--alpy-ui-component-button-size-md-text-fontFamily); --product-button-font-size: var(--alpy-ui-component-button-size-md-text-fontSize); --product-button-font-weight: var(--alpy-ui-font-weight-regular); --product-button-gap: var(--alpy-ui-component-button-size-md-gap); --product-button-icon-size: var(--alpy-ui-component-button-size-md-iconSize); --product-button-letter-spacing: var(--alpy-ui-component-button-size-md-text-letterSpacing); --product-button-line-height: var(--alpy-ui-component-button-size-md-text-lineHeight); --product-button-min-height: var(--alpy-ui-component-button-size-md-minHeight); --product-button-padding-x: var(--alpy-ui-component-button-size-md-paddingX); --product-button-padding-y: var(--alpy-ui-component-button-size-md-paddingY); align-items: center; border-radius: var(--product-button-radius); box-sizing: border-box; cursor: pointer; display: inline-flex; font-family: var(--product-button-font-family); font-size: var(--product-button-font-size); font-weight: var(--product-button-font-weight); gap: var(--product-button-gap); height: var(--product-button-min-height); justify-content: center; letter-spacing: var(--product-button-letter-spacing); line-height: var(--product-button-line-height); min-height: var(--product-button-min-height); padding: var(--product-button-padding-y)
    var(--product-button-padding-x); text-decoration: none; appearance: none; white-space: nowrap; }
.product-button.is-outline { background: var(--alpy-ui-component-button-variant-outline-bg-default); border: var(--product-button-border-width) solid
    var(--alpy-ui-component-button-variant-outline-border-default); color: var(--alpy-ui-component-button-variant-outline-text-default); }
.product-button.is-primary { background: var(--alpy-ui-component-button-variant-primary-bg-default); border: var(--product-button-border-width) solid
    var(--alpy-ui-component-button-variant-primary-border-default); color: var(--alpy-ui-component-button-variant-primary-text-default); }
.ai-taste-ui-skills-stage { aspect-ratio: 8 / 5; background: var(--alpy-ui-color-shades-neutral-subtle-one); overflow: hidden; position: relative; }
.uis-canvas { --uis-canvas-height: calc(var(--alpy-ui-size-200) * 2.5); --uis-canvas-width: calc(var(--alpy-ui-size-200) * 4); --uis-alpy: var(--alpy-ui-color-shades-brand-color-one-strong-one); --uis-ease: cubic-bezier(0.2, 0.8, 0.2, 1); --uis-move: 900ms; --uis-shadow-1: var(--alpy-ui-size-0) var(--alpy-ui-size-1) var(--alpy-ui-size-2)
      color-mix(in srgb, var(--alpy-ui-color-system-black) 8%, var(--alpy-ui-color-system-transparent)),
    var(--alpy-ui-size-0) var(--alpy-ui-size-4) var(--alpy-ui-size-12)
      color-mix(in srgb, var(--alpy-ui-color-system-black) 6%, var(--alpy-ui-color-system-transparent)); --uis-shadow-2: var(--alpy-ui-size-0) var(--alpy-ui-size-8) var(--alpy-ui-size-24)
    color-mix(in srgb, var(--alpy-ui-color-system-black) 14%, var(--alpy-ui-color-system-transparent)); --uis-shadow-3: var(--alpy-ui-size-0) var(--alpy-ui-size-16) var(--alpy-ui-size-40)
    color-mix(in srgb, var(--alpy-ui-color-system-black) 24%, var(--alpy-ui-color-system-transparent)); height: var(--uis-canvas-height); left: var(--alpy-ui-space-0); position: absolute; top: var(--alpy-ui-space-0); transform: scale(var(--uis-scale, 1)); transform-origin: 0px 0px; width: var(--uis-canvas-width); }
.uis-frame { inset: var(--alpy-ui-space-0); position: absolute; }
:root { font-family: var(--alpy-ui-font-body-fontFamily); font-size: var(--alpy-ui-font-body-fontSize); font-weight: var(--alpy-ui-font-weight-regular); letter-spacing: var(--alpy-ui-font-body-letterSpacing); line-height: var(--alpy-ui-font-body-lineHeight); --shell-top-bar-height: var(--alpy-ui-size-80); --shell-rail-width: calc(var(--alpy-ui-size-84) + var(--alpy-ui-size-1)); --shell-panel-width: calc(var(--alpy-ui-size-128) + var(--alpy-ui-size-48)); --shell-type-panel-width: calc(var(--alpy-ui-size-192) + var(--alpy-ui-size-108)); --shell-color-panel-width: calc(var(--alpy-ui-size-192) + var(--alpy-ui-size-104)); --shell-content-width: calc(
    var(--alpy-ui-size-1020) + var(--alpy-ui-size-128) +
      var(--alpy-ui-size-52)
  ); --shell-header-width: calc(
    var(--alpy-ui-size-1020) + var(--alpy-ui-size-750) -
      var(--alpy-ui-size-8) - var(--alpy-ui-size-2)
  ); --shell-card-min-height: calc(var(--alpy-ui-size-128) + var(--alpy-ui-size-40)); }
* { box-sizing: border-box; }
.db { --c1: var(--alpy-ui-color-shades-brand-color-two-strong-one); --c2: var(--alpy-ui-color-shades-brand-color-two-subtle-three); --c3: var(--alpy-ui-color-shades-brand-color-three-strong-one); --c4: var(--alpy-ui-color-shades-neutral-subtle-two);
  --ink: var(--alpy-ui-color-text-heading); --line: var(--alpy-ui-color-border-neutral-subtle-two); --soft: var(--alpy-ui-color-shades-neutral-subtle-one);
  position: absolute; inset: 0; display: grid; grid-template-columns: 236px 1fr; grid-template-rows: 100%; overflow: hidden; background: var(--soft);
  color: var(--alpy-ui-color-text-body); font-family: var(--alpy-ui-font-body-medium-fontFamily); font-size: var(--alpy-ui-font-body-medium-fontSize); line-height: var(--alpy-ui-font-body-medium-lineHeight); }
.db-move { transition: all 900ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.db-i { width: 18px; height: 18px; flex: none; fill: currentColor; }
.db-caret { width: 16px; height: 16px; fill: currentColor; opacity: 0.6; }
.db-more { width: 18px; height: 18px; fill: var(--alpy-ui-color-icon-subtlest); }
.db b { font-weight: var(--alpy-ui-font-weight-semiBold); color: var(--ink); }
.db { --d1: var(--c1); --d2: var(--alpy-ui-color-shades-brand-color-two-subtle-three); --d3: var(--alpy-ui-color-shades-brand-color-two-subtle-two); --d4: var(--alpy-ui-color-shades-neutral-subtle-two);
  --b2: var(--alpy-ui-color-shades-neutral-subtle-two); --b3: var(--alpy-ui-color-shades-neutral-subtle-two); }
.c1 { background: var(--d1); }
.c2 { background: var(--d2); }
.c3 { background: var(--d3); }
.c4 { background: var(--d4); }
.db-track i.c2 { background: var(--b2); }
.db-track i.c3 { background: var(--b3); }
.db svg path, .db svg circle, .db-track, .db-track i, .db-plan-list i, .db-legend i, .db-dot, .db-tip, .db-cross, .db-btn, .db-tr, .db-tr b, .db-cust, .db-tag, .db-status, .db-status::before, .db-th, .db-kpi-value, .db-spark path { transition: all 900ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.db-side { display: flex; flex-direction: column; gap: var(--alpy-ui-space-20); padding: var(--alpy-ui-space-20) var(--alpy-ui-space-16); background: var(--alpy-ui-color-surface-canvas); border-right: 1px solid var(--line); }
.db-brand { display: flex; align-items: center; gap: var(--alpy-ui-space-12); padding: var(--alpy-ui-space-4) var(--alpy-ui-space-8); }
.db-logo { display: grid; place-items: center; width: 30px; height: 30px; border-radius: var(--alpy-ui-radius-medium); background: var(--alpy-ui-color-shades-neutral-strong-three); }
.db-logo-i { width: 18px; height: 18px; fill: var(--alpy-ui-color-shades-brand-color-three-strong-one); }
.db-brand-name { color: var(--ink); font-weight: var(--alpy-ui-font-weight-bold); font-size: var(--alpy-ui-font-body-fontSize); margin-right: auto; }
.db-nav { display: flex; flex-direction: column; gap: 2px; margin-top: var(--alpy-ui-space-4); }
.db-nav a, .db-side-foot a { display: flex; align-items: center; gap: var(--alpy-ui-space-12); padding: 9px var(--alpy-ui-space-12); border-radius: var(--alpy-ui-radius-medium); color: var(--alpy-ui-color-text-body-subtle); font-weight: var(--alpy-ui-font-weight-medium); }
.db-nav a .db-i { fill: var(--alpy-ui-color-icon-subtlest); }
.db-nav a.is-active { background: var(--soft); color: var(--ink); }
.db-nav a.is-active .db-i { fill: var(--ink); }
.db-count { margin-left: auto; padding: 0 var(--alpy-ui-space-8); border-radius: var(--alpy-ui-radius-full); background: var(--soft); color: var(--alpy-ui-color-text-body-subtle); font-size: var(--alpy-ui-font-body-small-fontSize); }
.db-side-foot { margin-top: auto; display: flex; flex-direction: column; gap: var(--alpy-ui-space-8); }
.db-user { display: flex; align-items: center; gap: var(--alpy-ui-space-12); padding: var(--alpy-ui-space-12) var(--alpy-ui-space-8) 0; border-top: 1px solid var(--line); }
.db-user-text { display: flex; flex-direction: column; line-height: 1.25; }
.db-user-text span { color: var(--alpy-ui-color-text-body-muted); font-size: var(--alpy-ui-font-body-small-fontSize); }
.db-avatar { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: var(--alpy-ui-radius-full); color: var(--ink); font-size: var(--alpy-ui-font-body-small-fontSize); font-weight: var(--alpy-ui-font-weight-semiBold); }
.db-avatar.is-sm { width: 32px; height: 32px; }
.db-avatar.is-a1 { background: var(--alpy-ui-color-shades-brand-color-three-subtle-two); }
.db-avatar.is-a2 { background: var(--alpy-ui-color-shades-brand-color-two-subtle-two); }
.db-avatar.is-a3 { background: var(--alpy-ui-color-shades-brand-color-three-subtle-one); }
.db-avatar.is-a4 { background: var(--alpy-ui-color-shades-neutral-subtle-two); }
.db-main { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; }
.db-bar { display: flex; align-items: center; justify-content: space-between; height: 60px; padding: 0 var(--alpy-ui-space-28); background: var(--alpy-ui-color-surface-canvas); border-bottom: 1px solid var(--line); }
.db-search { display: flex; align-items: center; gap: var(--alpy-ui-space-8); width: 340px; height: 38px; padding: 0 var(--alpy-ui-space-12); border-radius: var(--alpy-ui-radius-medium); background: var(--soft); color: var(--alpy-ui-color-text-body-muted); }
.db-search .db-i { fill: var(--alpy-ui-color-icon-subtlest); }
.db-bar-right { display: flex; align-items: center; gap: var(--alpy-ui-space-12); }
.db-chip { display: inline-flex; align-items: center; gap: var(--alpy-ui-space-8); height: 38px; padding: 0 var(--alpy-ui-space-12); border: 1px solid var(--line); border-radius: var(--alpy-ui-radius-medium); color: var(--ink); font-weight: var(--alpy-ui-font-weight-medium); }
.db-chip .db-i { fill: var(--alpy-ui-color-icon-subtle); }
.db-iconbtn { position: relative; display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: var(--alpy-ui-radius-medium); }
.db-iconbtn .db-i { fill: var(--alpy-ui-color-icon-subtle); }
.db-ping { position: absolute; top: 8px; right: 9px; width: 7px; height: 7px; border-radius: 50%; background: var(--alpy-ui-color-functional-danger); box-shadow: 0 0 0 2px var(--alpy-ui-color-surface-canvas); }
.db-content { flex: 1; display: flex; flex-direction: column; gap: var(--alpy-ui-space-16); min-height: 0; padding: var(--alpy-ui-space-20) var(--alpy-ui-space-28) var(--alpy-ui-space-20); }
.db-top { display: flex; align-items: flex-end; justify-content: space-between; }
.db-head { display: flex; flex-direction: column; gap: 2px; }
.db-title { margin: 0; color: var(--ink); font-family: var(--alpy-ui-font-heading-xsmall-fontFamily); font-size: var(--alpy-ui-font-heading-xsmall-fontSize); font-weight: var(--alpy-ui-font-weight-bold); line-height: var(--alpy-ui-font-heading-xsmall-lineHeight); }
.db-sub, .db-note { margin: 0; }
.db-actions { display: flex; gap: var(--alpy-ui-space-8); }
.db-btn { display: inline-flex; align-items: center; gap: var(--alpy-ui-space-8); }
.db-btn .db-i { width: 17px; height: 17px; }
.db-kpi, .db-panel { background: var(--alpy-ui-component-card-styles-default-bg-default); border: 1px solid var(--alpy-ui-component-card-styles-default-border-default); border-radius: var(--alpy-ui-radius-large); }
.db-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--alpy-ui-space-16); }
.db-kpi { display: flex; flex-direction: column; gap: 6px; padding: var(--alpy-ui-space-16) var(--alpy-ui-space-16) 14px; }
.db-kpi-top { display: flex; align-items: center; justify-content: space-between; }
.db-kpi-label { color: var(--alpy-ui-color-text-body-subtle); font-weight: var(--alpy-ui-font-weight-medium); }
.db-delta { display: inline-flex; align-items: center; gap: 2px; padding: 2px 8px 2px 4px; border-radius: var(--alpy-ui-radius-full); font-size: var(--alpy-ui-font-body-small-fontSize); font-weight: var(--alpy-ui-font-weight-semiBold); line-height: 18px; }
.db-di { width: 14px; height: 14px; fill: currentColor; }
.db-delta.is-up { background: var(--alpy-ui-color-functional-success-subtle); color: var(--alpy-ui-color-text-functional-success-strong); }
.db-delta.is-down { background: var(--alpy-ui-color-functional-danger-subtle); color: var(--alpy-ui-color-text-functional-danger); }
.db-kpi-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--alpy-ui-space-8); margin-top: auto; }
.db-kpi-value { min-height: 48px; display: flex; align-items: flex-end; }
.db-kpi-value { color: var(--ink); font-family: var(--alpy-ui-font-heading-xsmall-fontFamily); font-size: var(--alpy-ui-font-heading-xsmall-fontSize); font-weight: var(--alpy-ui-font-weight-bold); line-height: var(--alpy-ui-font-heading-xsmall-lineHeight); font-variant-numeric: tabular-nums; white-space: nowrap; }
.db-spark { width: 92px; height: 30px; flex: none; overflow: visible; }
.db-spark-line { fill: none; stroke-width: 2; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.db-spark.is-up .db-spark-line { stroke: var(--c1); }
.db-spark.is-up .db-spark-area { fill: var(--alpy-ui-color-shades-brand-color-two-subtle-one); }
.db-spark.is-down .db-spark-line { stroke: var(--alpy-ui-color-functional-danger); }
.db-spark.is-down .db-spark-area { fill: var(--alpy-ui-color-functional-danger-subtle); }
.db-row { display: grid; grid-template-columns: minmax(0, 1.85fr) minmax(0, 1fr); gap: var(--alpy-ui-space-16); min-height: 0; }
.db-row:nth-of-type(2) { flex: 0 0 254px; }
.db-row:nth-of-type(3) { flex: 1; }
.db-panel { display: flex; flex-direction: column; gap: var(--alpy-ui-space-12); padding: var(--alpy-ui-space-16) var(--alpy-ui-space-20); min-height: 0; }
.db-panel-head { display: flex; align-items: center; justify-content: space-between; }
.db-panel-title { margin: 0; color: var(--ink); font-family: var(--alpy-ui-font-heading-xsmall-fontFamily); font-size: var(--alpy-ui-font-heading-xsmall-fontSize); font-weight: var(--alpy-ui-font-weight-bold); line-height: var(--alpy-ui-font-heading-xsmall-lineHeight); }
.db-legend { display: flex; gap: var(--alpy-ui-space-16); color: var(--alpy-ui-color-text-body-subtle); font-size: var(--alpy-ui-font-body-small-fontSize); }
.db-legend span { display: inline-flex; align-items: center; gap: 6px; }
.db-legend i { width: 10px; height: 10px; border-radius: 3px; }
.db-legend i.dash { height: 0; border-top: 2px dashed var(--alpy-ui-color-shades-neutral-subtle-three); border-radius: 0; width: 14px; }
.db-link { color: var(--alpy-ui-color-text-body-subtle); font-weight: var(--alpy-ui-font-weight-medium); }
.db-plot { position: relative; flex: 1; margin: 6px 0 30px 44px; min-height: 0; }
.db-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.db-gridlines line { stroke: var(--alpy-ui-color-border-neutral-subtle-one); stroke-width: 1; vector-effect: non-scaling-stroke; }
.db-stop-a { stop-color: var(--c1); stop-opacity: 0.22; }
.db-stop-b { stop-color: var(--c1); stop-opacity: 0; }
.db-area { fill: url(#dbFill); }
.db-line { fill: none; stroke: var(--c1); stroke-width: 2.6; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.db-prev { fill: none; stroke: var(--alpy-ui-color-shades-neutral-subtle-three); stroke-width: 1.6; stroke-dasharray: 5 5; vector-effect: non-scaling-stroke; opacity: 0.7; }
.db-track { height: 8px; }
.db-cross { stroke: var(--alpy-ui-color-shades-neutral-subtle-three); stroke-width: 1; stroke-dasharray: 3 4; vector-effect: non-scaling-stroke; }
.db-dot { position: absolute; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: var(--alpy-ui-color-surface-canvas); border: 3px solid var(--c1); box-sizing: border-box; }
.db-tip { position: absolute; z-index: 1; display: flex; flex-direction: column; align-items: center; padding: 6px 10px; border-radius: var(--alpy-ui-radius-medium); background: var(--alpy-ui-color-shades-neutral-strong-three); color: var(--alpy-ui-color-text-inverse); font-size: var(--alpy-ui-font-body-small-fontSize); line-height: 16px; transform: translate(calc(-100% - 14px), -50%); white-space: nowrap; }
.db-tip b { color: var(--alpy-ui-color-text-inverse); font-size: var(--alpy-ui-font-body-medium-fontSize); }
.db-tip span { opacity: 0.75; }
.db-ylab span, .db-xlab span { position: absolute; white-space: nowrap; }
.db-ylab { position: absolute; left: -44px; top: 0; bottom: 0; width: 38px; }
.db-ylab span { left: 0; transform: translateY(-50%); }
.db-xlab { position: absolute; left: 0; right: 0; bottom: -22px; }
.db-xlab span { transform: translateX(-50%); }
.db-xlab span:first-child { transform: none; }
.db-xlab span:last-child { transform: translateX(-100%); }
.db-donut-body { flex: 1; display: flex; align-items: center; gap: var(--alpy-ui-space-12); min-height: 0; }
.db-ring { position: relative; width: 100px; height: 100px; flex: none; }
.db-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.db-arc-bg { fill: none; stroke: var(--soft); stroke-width: 14; }
.db-arc { fill: none; stroke-width: 14; stroke-linecap: butt; }
.db-arc.c1 { stroke: var(--d1); background: none; }
.db-arc.c2 { stroke: var(--d2); background: none; }
.db-arc.c3 { stroke: var(--d3); background: none; }
.db-arc.c4 { stroke: var(--d4); background: none; }
.db-ring-c { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.db-ring-c b { font-size: var(--alpy-ui-font-body-fontSize); line-height: var(--alpy-ui-font-body-lineHeight); }
.db-plan-list { flex: 1; display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.db-plan-list li { display: grid; grid-template-columns: 10px minmax(0, 1fr) 34px 62px; align-items: center; gap: 6px; font-variant-numeric: tabular-nums; }
.db-plan-pct, .db-plan-list b { text-align: right; }
.db-plan-list i { width: 10px; height: 10px; border-radius: 3px; }
.db-plan-name { color: var(--ink); font-weight: var(--alpy-ui-font-weight-medium); white-space: nowrap; }
.db-table { gap: 0; padding-bottom: 6px; }
.db-table .db-panel-head { margin-bottom: 6px; }
.db-tr { display: grid; grid-template-columns: 1.8fr 0.8fr 0.8fr 0.9fr 0.7fr; align-items: center; padding: 5px 0; border-top: 1px solid var(--alpy-ui-color-border-neutral-subtle-one); }
.db-th { border-top: 0; padding-top: 0; }
.db-tr .r { text-align: right; }
.db-cust { display: flex; align-items: center; gap: var(--alpy-ui-space-8); color: var(--ink); font-weight: var(--alpy-ui-font-weight-medium); }
.db-cust .db-avatar { width: 28px; height: 28px; font-size: 11px; }
.db-tag { padding: 2px 8px; border-radius: var(--alpy-ui-radius-small); background: var(--soft); color: var(--alpy-ui-color-text-body-subtle); font-size: var(--alpy-ui-font-body-small-fontSize); font-weight: var(--alpy-ui-font-weight-medium); }
.db-status { display: inline-flex; align-items: center; gap: 6px; font-size: var(--alpy-ui-font-body-small-fontSize); font-weight: var(--alpy-ui-font-weight-semiBold); }
.db-status::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.db-status.is-ok { color: var(--alpy-ui-color-text-functional-success-strong); }
.db-status.is-wait { color: var(--alpy-ui-color-text-functional-warning); }
.db-channels { gap: 12px; }
.db-ch { display: flex; flex-direction: column; gap: 6px; }
.db-ch-row { display: flex; justify-content: space-between; color: var(--alpy-ui-color-text-body-subtle); font-weight: var(--alpy-ui-font-weight-medium); }
.db-track { height: 8px; border-radius: var(--alpy-ui-radius-full); background: var(--soft); overflow: hidden; }
.db-track i { display: block; height: 100%; border-radius: inherit; }
.db-sup { color: var(--alpy-ui-color-text-body); font-size: var(--alpy-ui-font-body-medium-fontSize); line-height: var(--alpy-ui-font-body-medium-lineHeight); }
.uis-frame.is-fixed-1 [data-db="lead"] .db-kpi-value { font-family: var(--alpy-ui-font-heading-large-fontFamily); font-size: var(--alpy-ui-font-heading-large-fontSize); font-weight: var(--alpy-ui-font-heading-large-fontWeight); letter-spacing: var(--alpy-ui-font-heading-large-letterSpacing); line-height: var(--alpy-ui-font-heading-large-lineHeight); }
.uis-frame.is-fixed-1 .db-panel-title { font-family: var(--alpy-ui-font-body-fontFamily); font-size: var(--alpy-ui-font-body-fontSize); font-weight: var(--alpy-ui-font-weight-semiBold); line-height: var(--alpy-ui-font-body-lineHeight); }
.uis-frame:not(.is-fixed-2) .product-button.db-btn { background: var(--alpy-ui-component-button-variant-primary-bg-default); border-color: var(--alpy-ui-component-button-variant-primary-border-default); color: var(--alpy-ui-component-button-variant-primary-text-default); }
.uis-frame.is-fixed-3 .db-sup { color: var(--alpy-ui-color-text-body-muted); font-size: var(--alpy-ui-font-body-small-fontSize); line-height: var(--alpy-ui-font-body-small-lineHeight); }
.uis-frame.is-fixed-1 .db-kpi:not([data-db="lead"]) .db-kpi-value { font-size: var(--alpy-ui-font-body-large-fontSize); font-weight: var(--alpy-ui-font-weight-semiBold); line-height: var(--alpy-ui-font-body-large-lineHeight); }
.uis-frame.is-fixed-1 .db-kpi:not([data-db="lead"]) .db-spark-line { stroke: var(--alpy-ui-color-shades-neutral-subtle-two); }
.uis-frame.is-fixed-1 .db-kpi:not([data-db="lead"]) .db-spark-area { fill: var(--alpy-ui-color-shades-neutral-subtle-one); }
.db:not(.is-fixed-1) { --d2: var(--alpy-ui-color-shades-brand-color-three-strong-one); --d3: var(--alpy-ui-color-shades-brand-color-one-strong-one); --d4: var(--alpy-ui-color-functional-danger);
  --b2: var(--alpy-ui-color-shades-brand-color-three-strong-one); --b3: var(--alpy-ui-color-shades-brand-color-one-strong-one); }
.db:not(.is-fixed-1) .db-prev { stroke: var(--alpy-ui-color-shades-brand-color-three-strong-one); stroke-width: 2.6; stroke-dasharray: 5 0; opacity: 1; }
.db:not(.is-fixed-1) .db-legend i.dash { border-top-style: solid; border-color: var(--alpy-ui-color-shades-brand-color-three-strong-one); }
.db:not(.is-fixed-1) .db-dot, .db:not(.is-fixed-1) .db-tip, .db:not(.is-fixed-1) .db-cross { opacity: 0; }
.db:not(.is-fixed-1) .db-track { height: 12px; }
.db:not(.is-fixed-3) .db-tr { color: var(--ink); font-weight: var(--alpy-ui-font-weight-bold); }
.db:not(.is-fixed-3) .db-th { font-weight: var(--alpy-ui-font-weight-bold); color: var(--ink); }
.db:not(.is-fixed-3) .db-cust { font-weight: var(--alpy-ui-font-weight-bold); }
.db:not(.is-fixed-3) .db-tag { background: var(--alpy-ui-color-shades-neutral-strong-three); color: var(--alpy-ui-color-text-inverse); }
.db:not(.is-fixed-3) .db-status { padding: 2px 10px; border-radius: var(--alpy-ui-radius-full); color: var(--alpy-ui-color-text-inverse); background: var(--alpy-ui-color-text-functional-success-strong); }
.db:not(.is-fixed-3) .db-status.is-wait { background: var(--alpy-ui-color-shades-brand-color-three-strong-one); color: var(--ink); }
.db:not(.is-fixed-3) .db-status::before { width: 0; }
.db:not(.is-fixed-3) .db-kpi-label, .db:not(.is-fixed-3) .db-ch-row, .db:not(.is-fixed-3) .db-legend { color: var(--ink); font-weight: var(--alpy-ui-font-weight-bold); }