/* Lenovo Precision Pro — generated from assets/design-tokens.json (node assets/gen-theme.mjs) */
:root {
  --lsc-color-background: #f9f9f9;
  --lsc-color-background-rgb: 249 249 249;
  --lsc-color-error: #ba1a1a;
  --lsc-color-error-rgb: 186 26 26;
  --lsc-color-error-container: #ffdad6;
  --lsc-color-error-container-rgb: 255 218 214;
  --lsc-color-inverse-on-surface: #f1f1f1;
  --lsc-color-inverse-on-surface-rgb: 241 241 241;
  --lsc-color-inverse-primary: #ffb4a9;
  --lsc-color-inverse-primary-rgb: 255 180 169;
  --lsc-color-inverse-surface: #2f3131;
  --lsc-color-inverse-surface-rgb: 47 49 49;
  --lsc-color-on-background: #1a1c1c;
  --lsc-color-on-background-rgb: 26 28 28;
  --lsc-color-on-error: #ffffff;
  --lsc-color-on-error-rgb: 255 255 255;
  --lsc-color-on-error-container: #93000a;
  --lsc-color-on-error-container-rgb: 147 0 10;
  --lsc-color-on-primary: #ffffff;
  --lsc-color-on-primary-rgb: 255 255 255;
  --lsc-color-on-primary-container: #fffaff;
  --lsc-color-on-primary-container-rgb: 255 250 255;
  --lsc-color-on-primary-fixed: #410000;
  --lsc-color-on-primary-fixed-rgb: 65 0 0;
  --lsc-color-on-primary-fixed-variant: #930003;
  --lsc-color-on-primary-fixed-variant-rgb: 147 0 3;
  --lsc-color-on-secondary: #ffffff;
  --lsc-color-on-secondary-rgb: 255 255 255;
  --lsc-color-on-secondary-container: #646464;
  --lsc-color-on-secondary-container-rgb: 100 100 100;
  --lsc-color-on-secondary-fixed: #1b1b1b;
  --lsc-color-on-secondary-fixed-rgb: 27 27 27;
  --lsc-color-on-secondary-fixed-variant: #474747;
  --lsc-color-on-secondary-fixed-variant-rgb: 71 71 71;
  --lsc-color-on-surface: #1a1c1c;
  --lsc-color-on-surface-rgb: 26 28 28;
  --lsc-color-on-surface-variant: #5d3f3b;
  --lsc-color-on-surface-variant-rgb: 93 63 59;
  --lsc-color-on-tertiary: #ffffff;
  --lsc-color-on-tertiary-rgb: 255 255 255;
  --lsc-color-on-tertiary-container: #fbfbff;
  --lsc-color-on-tertiary-container-rgb: 251 251 255;
  --lsc-color-on-tertiary-fixed: #001c38;
  --lsc-color-on-tertiary-fixed-rgb: 0 28 56;
  --lsc-color-on-tertiary-fixed-variant: #004880;
  --lsc-color-on-tertiary-fixed-variant-rgb: 0 72 128;
  --lsc-color-outline: #926f69;
  --lsc-color-outline-rgb: 146 111 105;
  --lsc-color-outline-variant: #e7bdb7;
  --lsc-color-outline-variant-rgb: 231 189 183;
  --lsc-color-primary: #bb0005;
  --lsc-color-primary-rgb: 187 0 5;
  --lsc-color-primary-container: #e2231a;
  --lsc-color-primary-container-rgb: 226 35 26;
  --lsc-color-primary-fixed: #ffdad5;
  --lsc-color-primary-fixed-rgb: 255 218 213;
  --lsc-color-primary-fixed-dim: #ffb4a9;
  --lsc-color-primary-fixed-dim-rgb: 255 180 169;
  --lsc-color-secondary: #5e5e5e;
  --lsc-color-secondary-rgb: 94 94 94;
  --lsc-color-secondary-container: #e2e2e2;
  --lsc-color-secondary-container-rgb: 226 226 226;
  --lsc-color-secondary-fixed: #e2e2e2;
  --lsc-color-secondary-fixed-rgb: 226 226 226;
  --lsc-color-secondary-fixed-dim: #c6c6c6;
  --lsc-color-secondary-fixed-dim-rgb: 198 198 198;
  --lsc-color-surface: #f9f9f9;
  --lsc-color-surface-rgb: 249 249 249;
  --lsc-color-surface-bright: #f9f9f9;
  --lsc-color-surface-bright-rgb: 249 249 249;
  --lsc-color-surface-container: #eeeeee;
  --lsc-color-surface-container-rgb: 238 238 238;
  --lsc-color-surface-container-high: #e8e8e8;
  --lsc-color-surface-container-high-rgb: 232 232 232;
  --lsc-color-surface-container-highest: #e2e2e2;
  --lsc-color-surface-container-highest-rgb: 226 226 226;
  --lsc-color-surface-container-low: #f3f3f3;
  --lsc-color-surface-container-low-rgb: 243 243 243;
  --lsc-color-surface-container-lowest: #ffffff;
  --lsc-color-surface-container-lowest-rgb: 255 255 255;
  --lsc-color-surface-dim: #dadada;
  --lsc-color-surface-dim-rgb: 218 218 218;
  --lsc-color-surface-tint: #c00005;
  --lsc-color-surface-tint-rgb: 192 0 5;
  --lsc-color-surface-variant: #e2e2e2;
  --lsc-color-surface-variant-rgb: 226 226 226;
  --lsc-color-tertiary: #005da3;
  --lsc-color-tertiary-rgb: 0 93 163;
  --lsc-color-tertiary-container: #0076cc;
  --lsc-color-tertiary-container-rgb: 0 118 204;
  --lsc-color-tertiary-fixed: #d3e4ff;
  --lsc-color-tertiary-fixed-rgb: 211 228 255;
  --lsc-color-tertiary-fixed-dim: #a1c9ff;
  --lsc-color-tertiary-fixed-dim-rgb: 161 201 255;

  --lsc-radius-DEFAULT: 0.25rem;
  --lsc-radius-lg: 0.5rem;
  --lsc-radius-xl: 0.75rem;
  --lsc-radius-full: 9999px;

  --lsc-font-sans: Inter, system-ui, sans-serif;
  --lsc-font-headline: Inter, system-ui, sans-serif;
  --lsc-font-body: Inter, system-ui, sans-serif;
  --lsc-font-label: Inter, system-ui, sans-serif;

  --lsc-text-display-lg-size: 3.5rem;
  --lsc-text-display-lg-line-height: 1.1;
  --lsc-text-display-lg-weight: 700;
  --lsc-text-headline-md-size: 1.75rem;
  --lsc-text-headline-md-line-height: 1.2;
  --lsc-text-headline-md-weight: 600;
  --lsc-text-title-sm-size: 1rem;
  --lsc-text-title-sm-line-height: 1.35;
  --lsc-text-title-sm-weight: 600;
  --lsc-text-body-md-size: 0.875rem;
  --lsc-text-body-md-line-height: 1.5;
  --lsc-text-body-md-weight: 400;
  --lsc-text-body-sm-size: 0.8125rem;
  --lsc-text-body-sm-line-height: 1.45;
  --lsc-text-body-sm-weight: 400;
  --lsc-text-label-md-size: 0.75rem;
  --lsc-text-label-md-line-height: 1.4;
  --lsc-text-label-md-weight: 500;

  --lsc-shadow-float: 0 8px 24px rgb(26 28 28 / 0.04);
  --lsc-glass-bg: rgb(255 255 255 / 0.85);
  --lsc-glass-blur: 20px;
  --lsc-input-focus-width: 2px;

  --lsc-gradient-primary: linear-gradient(180deg, var(--lsc-color-primary) 0%, var(--lsc-color-primary-container) 100%);
  --lsc-tracking-display: -0.02em;
}

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

/* --- Base layout primitives (no 1px section borders; tonal separation only) --- */

.lsc-app {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: var(--lsc-font-body);
  background-color: var(--lsc-color-background);
  color: var(--lsc-color-on-background);
}

.lsc-app-bar {
  position: sticky;
  top: 0;
  z-index: 50;
  flex-shrink: 0;
  background-color: var(--lsc-color-surface-container-lowest);
  box-shadow: none;
  border: none;
}

.lsc-app-bar__band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 4rem;
  padding-left: 2rem;
  padding-right: 2rem;
  width: 100%;
  background-color: var(--lsc-color-surface-container-low);
}

.lsc-app-bar__title {
  margin: 0;
  font-size: var(--lsc-text-title-sm-size);
  font-weight: 800;
  letter-spacing: -0.025em;
  text-transform: uppercase;
  color: var(--lsc-color-on-surface);
}

.lsc-shell {
  display: flex;
  flex: 1;
  min-height: 0;
  align-items: stretch;
}

.lsc-sidebar {
  width: 16rem;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1.5rem 0;
  background-color: var(--lsc-color-surface-container-low);
  border: none;
  box-shadow: none;
}

.lsc-sidebar__brand {
  padding: 0 1rem 0.5rem;
}

.lsc-sidebar__brand-title {
  font-size: 1.125rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: -0.03em;
  color: var(--lsc-color-primary);
  margin: 0;
}

.lsc-sidebar__brand-sub {
  margin: 0.25rem 0 0;
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--lsc-color-secondary);
}

.lsc-sidebar__nav {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  padding: 0 0.5rem;
}

.lsc-sidebar__link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  font-size: var(--lsc-text-label-md-size);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--lsc-color-secondary);
  background: transparent;
  border: none;
  border-left: 4px solid transparent;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.lsc-sidebar__link:hover {
  background-color: var(--lsc-color-surface-container);
  color: var(--lsc-color-on-surface);
}

.lsc-sidebar__link--active {
  border-left-color: var(--lsc-color-primary);
  color: var(--lsc-color-primary);
  background-color: var(--lsc-color-surface-container-lowest);
}

.lsc-main {
  flex: 1;
  min-width: 0;
  overflow: auto;
  background-color: var(--lsc-color-surface-container-low);
  padding: 2rem 3rem;
}

@media (max-width: 1023px) {
  .lsc-main {
    padding: 1.5rem;
  }
}

.lsc-canvas {
  background-color: var(--lsc-color-surface-container-lowest);
  border: none;
  border-radius: var(--lsc-radius-DEFAULT);
  box-shadow: none;
}

/* Primary CTA: gradient + subtle top inner highlight (DESIGN.md §5) */
.lsc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.5rem 1.5rem;
  font-family: var(--lsc-font-label);
  font-size: var(--lsc-text-label-md-size);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border: none;
  border-radius: var(--lsc-radius-DEFAULT);
  cursor: pointer;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.lsc-btn:active {
  opacity: 0.88;
}

.lsc-btn--primary {
  background: var(--lsc-gradient-primary);
  color: var(--lsc-color-on-primary);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.2);
}

.lsc-btn--primary:hover {
  filter: brightness(1.03);
}

.lsc-btn--ghost {
  background: transparent;
  color: var(--lsc-color-secondary);
}

.lsc-btn--ghost:hover {
  color: var(--lsc-color-on-background);
}

/* Inputs: surface_container_high, no box border; primary bottom edge on focus */
.lsc-input,
.lsc-select,
.lsc-textarea {
  display: block;
  width: 100%;
  padding: 0.75rem 1rem;
  font-family: var(--lsc-font-body);
  font-size: var(--lsc-text-body-md-size);
  color: var(--lsc-color-on-surface);
  background-color: var(--lsc-color-surface-container-high);
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: var(--lsc-radius-DEFAULT);
  outline: none;
  box-shadow: none;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.lsc-input:focus,
.lsc-select:focus,
.lsc-textarea:focus {
  border-bottom-color: var(--lsc-color-primary);
  box-shadow: none;
}

.lsc-input::placeholder,
.lsc-textarea::placeholder {
  color: var(--lsc-color-secondary);
  opacity: 0.75;
}

.lsc-label {
  display: block;
  margin-bottom: 0.25rem;
  font-family: var(--lsc-font-label);
  font-size: var(--lsc-text-label-md-size);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lsc-color-secondary);
}

/* Glass panel helper (DESIGN.md §2) */
.lsc-glass {
  background: var(--lsc-glass-bg);
  backdrop-filter: blur(var(--lsc-glass-blur));
  -webkit-backdrop-filter: blur(var(--lsc-glass-blur));
}

/* Ambient float shadow (DESIGN.md §4) */
.lsc-shadow-float {
  box-shadow: var(--lsc-shadow-float);
}

/* Typography utilities */
.lsc-display-lg {
  font-size: var(--lsc-text-display-lg-size);
  line-height: var(--lsc-text-display-lg-line-height);
  font-weight: var(--lsc-text-display-lg-weight);
  letter-spacing: var(--lsc-tracking-display);
}

.lsc-headline-md {
  font-size: var(--lsc-text-headline-md-size);
  line-height: var(--lsc-text-headline-md-line-height);
  font-weight: var(--lsc-text-headline-md-weight);
}

.lsc-title-sm {
  font-size: var(--lsc-text-title-sm-size);
  line-height: var(--lsc-text-title-sm-line-height);
  font-weight: var(--lsc-text-title-sm-weight);
}

.lsc-body-md {
  font-size: var(--lsc-text-body-md-size);
  line-height: var(--lsc-text-body-md-line-height);
  font-weight: var(--lsc-text-body-md-weight);
}

.lsc-body-sm {
  font-size: var(--lsc-text-body-sm-size);
  line-height: var(--lsc-text-body-sm-line-height);
  font-weight: var(--lsc-text-body-sm-weight);
  font-variant-numeric: tabular-nums;
}

.lsc-label-md {
  font-size: var(--lsc-text-label-md-size);
  line-height: var(--lsc-text-label-md-line-height);
  font-weight: var(--lsc-text-label-md-weight);
}
