.vp-farblabor{margin:0;background:#f6f4ef;color:#252d2e;font:17px system-ui}
.vp-farblabor .lab-shell{max-width:1050px;margin:auto;padding:35px 24px}
.vp-farblabor header{border-top:4px solid #f7a10c;padding-top:24px}
.vp-farblabor .eyebrow{color:#527783;font-weight:700;letter-spacing:.15em;font-size:13px}
.vp-farblabor .lab-title{font-family:system-ui,sans-serif;font-size:clamp(2.6rem,6vw,4.5rem);margin:10px 0}
.vp-farblabor p{line-height:1.6}
.vp-farblabor section{display:grid;grid-template-columns:minmax(280px,1.2fr) 1fr;gap:50px;align-items:center;margin-top:30px}
.vp-farblabor .wheel{width:100%;max-width:570px;margin:auto}
.vp-farblabor .wheel-row{position:relative;padding-left:76px}
.vp-farblabor .wheel-visual{position:relative;flex:1;min-width:0;aspect-ratio:1}
.vp-farblabor .wheel-visual canvas,.vp-farblabor .wheel-visual>svg{display:block;width:100%;height:auto}
.vp-farblabor .light-control{position:absolute;left:0;top:3%;bottom:3%;width:68px;display:flex;flex-direction:column;align-items:center;font-size:12px;color:#566262}
.vp-farblabor .light-track{display:flex;align-items:flex-end;flex:1;min-height:0;gap:3px;padding:8px 0}
.vp-farblabor .light-track input{writing-mode:vertical-lr;direction:rtl;appearance:slider-vertical;width:24px;height:100%;min-height:0;accent-color:#527783;cursor:pointer}
.vp-farblabor .light-track button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.vp-farblabor .light-track button svg path,.vp-farblabor .light-track button svg polyline{fill:none;stroke:#253536;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;cursor:inherit}
.vp-farblabor .light-track button{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid #a9babc;border-radius:50%;background:white;color:#253536;line-height:1;padding:0;font-size:19px;flex:none}
.vp-farblabor .light-control output{font-size:11px}
.vp-farblabor button{font:inherit;cursor:pointer}
.vp-farblabor .toggle button{border:1px solid #527783;background:white;padding:10px 20px}
.vp-farblabor .toggle button[aria-pressed=true]{background:#527783;color:white}
.vp-farblabor .toggle button:first-child{border-radius:8px 0 0 8px}
.vp-farblabor .toggle button:last-child{border-radius:0 8px 8px 0}
.vp-farblabor .paint-help{font-size:.85rem;color:#566262;margin:8px 0}
.vp-farblabor .model-switch{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px;padding:4px;border:1px solid #527783;border-radius:999px;background:#fff;max-width:100%}
.vp-farblabor .model-switch button{border:0;cursor:pointer;font:inherit}
.vp-farblabor .model-itten{display:inline-flex;align-items:center;gap:4px}
.vp-farblabor .model-choice{padding:9px 16px;border-radius:999px;background:transparent;color:#253536}
.vp-farblabor .model-choice[aria-pressed=true]{background:#527783;color:#fff}
.vp-farblabor .model-steps{display:flex;gap:4px;align-items:center}
.vp-farblabor .model-steps button{width:36px;height:36px;border-radius:50%;background:#e8eeee;color:#253536;padding:0;font-size:14px}
.vp-farblabor .model-steps button[aria-pressed=true]{background:#f7a10c;color:#1c292c;font-weight:700}
.vp-farblabor .model-switch button:focus-visible{outline:3px solid #f7a10c;outline-offset:2px}
@media(max-width:380px){.vp-farblabor .model-switch{gap:2px}
.vp-farblabor .model-choice{padding:8px 10px}
.vp-farblabor .model-steps button{width:32px;height:32px}
}
@media(max-width:600px){.vp-farblabor .model-switch{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%;box-sizing:border-box;gap:4px;padding:6px;border-radius:16px}
.vp-farblabor .model-itten{grid-column:1/-1;display:flex;min-width:0}
.vp-farblabor .model-itten [data-vp-id="itten"]{flex:1;min-width:0;text-align:left}
.vp-farblabor .model-steps{flex:none}
.vp-farblabor .model-switch .model-choice{font-size:14px;min-height:44px;white-space:normal;line-height:1.2;border-radius:10px;padding:8px 10px}
.vp-farblabor .model-steps button{width:32px;height:32px}
.vp-farblabor .model-switch [data-vp-id="cmy"],.vp-farblabor .model-switch [data-vp-id="digital"]{min-width:0;text-align:center}
}
.vp-farblabor .groups{display:flex;flex-wrap:wrap;gap:8px 42px;margin-top:24px}
.vp-farblabor .harmonies{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.vp-farblabor .harmonies button{width:53px;height:53px;border:1px solid #a9babc;border-radius:9px;background:#fff;padding:5px}
.vp-farblabor .harmonies button[aria-pressed=true]{border:2px solid #527783;background:#eaf1f1}
.vp-farblabor .harmonies button:focus-visible{outline:3px solid #f7a10c;outline-offset:2px}
.vp-farblabor .harmonies svg{width:100%;height:100%}
.vp-farblabor .card{background:white;padding:25px;border-radius:16px}
.vp-farblabor .card h2:first-child{margin-top:0}
.vp-farblabor .palette-strip{display:flex;width:100%;height:100px;overflow:hidden;border-radius:8px}
.vp-farblabor .palette-strip span{flex:1;min-width:0}
.vp-farblabor .color-list{list-style:none;padding:0;margin:18px 0 0}
.vp-farblabor .color-list li{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid #e8eceb}
.vp-farblabor .color-square{width:25px;height:25px;flex:none;border-radius:3px;border:1px solid #0002}
.vp-farblabor .color-name{flex:1}
.vp-farblabor .mix-details{flex-basis:100%;margin-left:37px;font-size:.9rem}
.vp-farblabor .mix-details summary{cursor:pointer;color:#253536}
.vp-farblabor .mix-detail-row{display:flex;align-items:center;gap:8px;margin-top:6px}
.vp-farblabor .mix-dot{width:14px;height:14px;display:inline-block;border:1px solid #777;border-radius:50%;flex:none}
.vp-farblabor .mix-detail-note{color:#566262;font-size:.8rem;margin:8px 0 4px}
.vp-farblabor .mix-details summary:focus-visible{outline:3px solid #f7a10c;outline-offset:2px}
.vp-farblabor .color-hex{font-family:monospace;color:#566262}
.vp-farblabor .palette-heading{display:flex;align-items:center;gap:10px}
.vp-farblabor .palette-heading h2{margin-bottom:0}
.vp-farblabor .palette-heading button{margin-top:.8em;font-size:24px}
.vp-farblabor .export-options{display:flex;flex-direction:column;align-items:stretch;gap:8px;margin:16px 0}
.vp-farblabor .export-options button{padding:10px;text-align:left}
.vp-farblabor [data-vp-id="exportError"]:empty{display:none}
.vp-farblabor .palette-list.cmy-palette{display:flex;flex-direction:column}
.vp-farblabor .cmy-palette .parked{display:flex;align-items:center;gap:10px;padding:7px}
.vp-farblabor .cmy-palette .parked-color{width:40px;height:40px;flex:none;border-radius:4px}
.vp-farblabor .cmy-palette .parked-meta{flex:1;padding:0;font:inherit;font-size:.85rem}
.vp-farblabor .palette-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.vp-farblabor .parked{background:white;border:1px solid #e0e7e7;border-radius:8px;overflow:hidden}
.vp-farblabor .parked-color{height:50px;width:100%;display:block;border:0;border-radius:0;cursor:pointer}
.vp-farblabor .parked-color:focus-visible{outline:3px solid #111;outline-offset:-3px}
.vp-farblabor .parked-meta{display:flex;align-items:center;flex-wrap:wrap;gap:2px;padding:4px 6px;font:12px monospace}
.vp-farblabor .parked-meta span{flex:1}
.vp-farblabor .icon-btn svg{display:block;width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.vp-farblabor .save-switch{display:inline-flex;align-items:center;gap:8px;margin-top:14px;cursor:pointer}
.vp-farblabor .save-switch input{accent-color:#527783;width:20px;height:20px}
.vp-farblabor .palette-intro,.vp-farblabor [data-vp-id="paletteStatus"]{font-size:.85rem;color:#566262}
.vp-farblabor [data-vp-id="paletteStatus"]:empty{display:none}
.vp-farblabor dialog{border:0;border-radius:14px;padding:26px;max-width:440px;box-shadow:0 12px 40px #0003}
.vp-farblabor dialog::backdrop{background:#0008}
.vp-farblabor .dialog-actions{display:flex;justify-content:flex-end;gap:10px}
.vp-farblabor .icon-btn:disabled{opacity:.35;cursor:not-allowed}
.vp-farblabor .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.vp-farblabor [data-vp-id="digitalWheel"]:focus-visible{outline:3px solid #253536;outline-offset:4px;border-radius:50%}
.vp-farblabor .icon-btn{border:0;background:transparent;color:#527783;cursor:pointer;padding:5px;font-size:17px;line-height:1}
.vp-farblabor .icon-btn:hover{color:#172e35}
.vp-farblabor [data-vp-id="hexForm"]{margin:12px 0}
.vp-farblabor [data-vp-id="hexForm"] input{font:inherit;width:8em;padding:6px}
.vp-farblabor [data-vp-id="copyStatus"]{font-size:.8rem;min-height:1em;color:#527783}
.vp-farblabor [data-vp-id="hint"]{font-size:.82rem;color:#566262;margin-bottom:0}
.vp-farblabor [hidden]{display:none!important}
.vp-farblabor svg path{cursor:pointer;stroke:#f6f4ef;stroke-width:1.5}
.vp-farblabor svg path:focus{outline:none;stroke:#111;stroke-width:4}
.vp-farblabor footer{margin-top:35px;color:#566262;font-size:14px}
@media(max-width:700px){.vp-farblabor section{grid-template-columns:1fr;gap:15px}
}
.vp-farblabor .lab-nav{display:flex;gap:4px;border-bottom:1px solid #cdd7d8;padding-bottom:10px;margin-bottom:26px;flex-wrap:wrap}
.vp-farblabor .lab-nav button{padding:12px 20px;border:0;border-radius:9px;background:transparent;color:#252d2e;font:inherit;cursor:pointer}
.vp-farblabor .lab-nav button[aria-selected=true]{background:#527783;color:white}
.vp-farblabor .lab-nav button:focus-visible{outline:3px solid #f7a10c;outline-offset:3px}
.vp-farblabor [data-vp-id="page-farbkreise"] header{border-top:0;padding-top:0}
.vp-farblabor .lab-shell{border-top:4px solid #f7a10c;padding-top:18px}
@media(max-width:500px){.vp-farblabor .lab-nav button{flex:1;padding:11px 9px;font-size:15px}
}
 

.vp-farblabor [data-vp-id="legacyPanels"]{
  --ink: #18191d;
  --muted: #666973;
  --paper: #f7f7f4;
  --panel: #ffffff;
  --line: #d9dadd;
  --accent: #2d49d7;
  --shadow: 0 20px 55px rgba(21, 23, 32, .09);
  --radius: 22px;
}
.vp-farblabor [data-vp-id="legacyPanels"] *{ box-sizing: border-box; }
.vp-farblabor [data-vp-id="legacyPanels"] button,.vp-farblabor [data-vp-id="legacyPanels"] input,.vp-farblabor [data-vp-id="legacyPanels"] select{ font: inherit; }
.vp-farblabor [data-vp-id="legacyPanels"] button{ color: inherit; }
.vp-farblabor [data-vp-id="legacyPanels"] .skip-link{ position: fixed; left: 1rem; top: -5rem; z-index: 100; padding: .8rem 1rem; background: var(--ink); color: white; border-radius: 8px; }
.vp-farblabor [data-vp-id="legacyPanels"] .skip-link:focus{ top: 1rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .app-header{ height: 76px; padding: 0 clamp(1rem, 4vw, 4rem); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: rgba(247,247,244,.9); backdrop-filter: blur(10px); }
.vp-farblabor [data-vp-id="legacyPanels"] .brand{ display: flex; align-items: center; gap: .75rem; color: var(--ink); text-decoration: none; }
.vp-farblabor [data-vp-id="legacyPanels"] .brand span:last-child{ display: grid; line-height: 1.08; }
.vp-farblabor [data-vp-id="legacyPanels"] .brand strong{ font-size: 1.05rem; letter-spacing: -.02em; }
.vp-farblabor [data-vp-id="legacyPanels"] .brand small{ margin-top: .22rem; color: var(--muted); font-size: .72rem; letter-spacing: .07em; }
.vp-farblabor [data-vp-id="legacyPanels"] .brand-mark{ width: 30px; aspect-ratio: 1; border-radius: 50%; background: conic-gradient(#f4d526 0 16.6%,#ef8a22 0 33.3%,#d64437 0 50%,#7442a8 0 66.6%,#315fbd 0 83.3%,#31965b 0); box-shadow: inset 0 0 0 6px var(--paper); }
.vp-farblabor [data-vp-id="legacyPanels"] .about-button,.vp-farblabor [data-vp-id="legacyPanels"] footer button{ border: 0; background: transparent; text-decoration: underline; text-underline-offset: 4px; color: var(--muted); cursor: pointer; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-nav{ position: sticky; top: 0; z-index: 20; padding: 0 clamp(1rem, 4vw, 4rem); display: grid; grid-template-columns: repeat(4, 1fr); background: var(--paper); border-bottom: 1px solid var(--line); }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-tab{ min-height: 58px; padding: .7rem 1rem; border: 0; border-bottom: 3px solid transparent; background: transparent; text-align: left; color: var(--muted); cursor: pointer; transition: .2s ease; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-tab span{ margin-right: .55rem; font-size: .75rem; font-weight: 800; letter-spacing: .08em; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-tab:hover{ color: var(--ink); }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-tab.active{ color: var(--ink); border-color: var(--ink); }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-tab.complete span{ color: var(--accent); }
.vp-farblabor [data-vp-id="legacyPanels"] .phase{ animation: phase-in .35s ease; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase.active{ display: grid; }
.vp-farblabor [data-vp-id="legacyPanels"] [data-vp-id="phase-1"],.vp-farblabor [data-vp-id="legacyPanels"] [data-vp-id="phase-2"]{ grid-template-columns: minmax(250px, .78fr) minmax(500px, 1.4fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.vp-farblabor [data-vp-id="legacyPanels"] .eyebrow{ margin: 0 0 .7rem; color: var(--accent); font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.vp-farblabor [data-vp-id="legacyPanels"] .lab-title{ margin: 0 0 1.25rem; max-width: 12ch; font-family: inherit; font-size: clamp(2.6rem, 5vw, 5.8rem); font-weight: 500; letter-spacing: -.055em; line-height: .98; }
.vp-farblabor [data-vp-id="legacyPanels"] h2{ margin: 0 0 .65rem; font-family: inherit; font-size: clamp(1.5rem, 2vw, 2.15rem); font-weight: 500; line-height: 1.1; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-copy > p:not(.eyebrow){ max-width: 40rem; color: var(--muted); font-size: 1.05rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .lesson-note{ margin-top: 2rem; padding: 1rem 0; display: grid; gap: .25rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.vp-farblabor [data-vp-id="legacyPanels"] .lesson-note span{ color: var(--muted); }
.vp-farblabor [data-vp-id="legacyPanels"] .mix-equation{ min-height: 2.2rem; margin-top: 1.3rem; font-weight: 750; }
.vp-farblabor [data-vp-id="legacyPanels"] .panel{ background: var(--panel); border: 1px solid rgba(24,25,29,.09); border-radius: var(--radius); box-shadow: var(--shadow); }
.vp-farblabor [data-vp-id="legacyPanels"] .build-lab{ padding: clamp(1rem, 3vw, 2rem); text-align: center; }
.vp-farblabor [data-vp-id="legacyPanels"] .build-stage{ position: relative; width: min(100%, 650px); margin: auto; aspect-ratio: 1; }
.vp-farblabor [data-vp-id="legacyPanels"] .build-wheel,.vp-farblabor [data-vp-id="legacyPanels"] .relation-wheel{ width: 100%; height: 100%; overflow: visible; }
.vp-farblabor [data-vp-id="legacyPanels"] .wheel-segment{ stroke: var(--panel); stroke-width: 5; cursor: pointer; transition: fill .35s ease, opacity .25s, transform .25s; transform-origin: 300px 300px; }
.vp-farblabor [data-vp-id="legacyPanels"] .wheel-segment.white{ fill: #f7f7f4; stroke: #cfd0d4; }
.vp-farblabor [data-vp-id="legacyPanels"] .wheel-segment.white:hover,.vp-farblabor [data-vp-id="legacyPanels"] .wheel-segment.white:focus{ fill: #e9eaf0; transform: scale(1.016); outline: none; }
.vp-farblabor [data-vp-id="legacyPanels"] .wheel-segment.revealed{ animation: reveal .45s ease; }
.vp-farblabor [data-vp-id="legacyPanels"] .wheel-center{ position: absolute; inset: 37%; display: grid; place-items: center; align-content: center; gap: 1rem; pointer-events: none; }
.vp-farblabor [data-vp-id="legacyPanels"] .wheel-center p{ margin: 0; max-width: 14rem; font-size: clamp(.82rem, 1.6vw, 1.05rem); font-weight: 750; line-height: 1.35; }
.vp-farblabor [data-vp-id="legacyPanels"] .wheel-center button{ pointer-events: auto; }
.vp-farblabor [data-vp-id="legacyPanels"] .primary-button,.vp-farblabor [data-vp-id="legacyPanels"] .secondary-button{ border: 0; border-radius: 999px; background: var(--ink); color: #fff; padding: .82rem 1.15rem; font-weight: 750; cursor: pointer; box-shadow: 0 7px 18px rgba(24,25,29,.18); }
.vp-farblabor [data-vp-id="legacyPanels"] .primary-button:hover{ transform: translateY(-1px); }
.vp-farblabor [data-vp-id="legacyPanels"] .hidden{ display: none !important; }
.vp-farblabor [data-vp-id="legacyPanels"] .microcopy{ margin: .7rem 0 0; color: var(--muted); font-size: .88rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .compact-copy{ align-self: start; padding-top: 2rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .compact-copy .lab-title{ font-size: clamp(2.5rem, 4.2vw, 4.8rem); }
.vp-farblabor [data-vp-id="legacyPanels"] .mode-switch{ margin: 2rem 0 1rem; display: flex; flex-wrap: wrap; gap: .45rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .mode-button,.vp-farblabor [data-vp-id="legacyPanels"] .mood-button{ padding: .65rem .9rem; border: 1px solid var(--line); border-radius: 999px; background: transparent; cursor: pointer; }
.vp-farblabor [data-vp-id="legacyPanels"] .mode-button.active,.vp-farblabor [data-vp-id="legacyPanels"] .mood-button.active{ background: var(--ink); border-color: var(--ink); color: white; }
.vp-farblabor [data-vp-id="legacyPanels"] .relation-card{ min-height: 7.4rem; margin-top: 1.5rem; padding: 1.2rem; border-left: 3px solid var(--accent); background: #fff; }
.vp-farblabor [data-vp-id="legacyPanels"] .relation-card strong{ display: block; margin-bottom: .35rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .relation-card p{ margin: 0; color: var(--muted); }
.vp-farblabor [data-vp-id="legacyPanels"] .relationship-lab{ position: relative; padding: clamp(1.5rem, 4vw, 4rem); }
.vp-farblabor [data-vp-id="legacyPanels"] .relation-segment{ stroke: #fff; stroke-width: 5; cursor: pointer; transition: opacity .2s, transform .2s; transform-origin: 300px 300px; }
.vp-farblabor [data-vp-id="legacyPanels"] .relation-segment:hover,.vp-farblabor [data-vp-id="legacyPanels"] .relation-segment:focus{ opacity: .82; transform: scale(1.015); outline: none; }
.vp-farblabor [data-vp-id="legacyPanels"] .relation-segment.dim{ opacity: .2; }
.vp-farblabor [data-vp-id="legacyPanels"] .relation-segment.selected{ filter: drop-shadow(0 0 8px rgba(0,0,0,.3)); transform: scale(1.025); }
.vp-farblabor [data-vp-id="legacyPanels"] .relation-center{ position: absolute; inset: 41%; display: grid; place-items: center; padding: .7rem; border-radius: 50%; background: var(--panel); text-align: center; font-weight: 780; line-height: 1.2; }
.vp-farblabor [data-vp-id="legacyPanels"] .relation-axis{ stroke: var(--ink); stroke-width: 7; stroke-linecap: round; pointer-events: none; }
.vp-farblabor [data-vp-id="legacyPanels"] .relation-axis-dot{ fill: var(--ink); }
.vp-farblabor [data-vp-id="legacyPanels"] .temperature-arc{ fill: none; stroke-width: 15; stroke-linecap: round; pointer-events: none; }
.vp-farblabor [data-vp-id="legacyPanels"] .temperature-label{ position: absolute; bottom: 1.2rem; padding: .4rem .7rem; border-radius: 999px; color: white; font-size: .78rem; font-weight: 750; }
.vp-farblabor [data-vp-id="legacyPanels"] .warm-label{ right: 1rem; background: #c44b2d; }
.vp-farblabor [data-vp-id="legacyPanels"] .cool-label{ left: 1rem; background: #326b98; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-heading{ display: flex; justify-content: space-between; gap: 2rem; align-items: end; margin-bottom: 2rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-heading .lab-title{ max-width: 14ch; font-size: clamp(2.5rem, 4.5vw, 5rem); }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-heading > p{ max-width: 35rem; color: var(--muted); }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-layout{ display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 1.25rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-list{ display: flex; flex-direction: column; gap: .4rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab{ display: flex; align-items: center; gap: .65rem; width: 100%; padding: .9rem; border: 1px solid transparent; border-radius: 12px; background: transparent; text-align: left; cursor: pointer; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab span{ color: var(--muted); font-size: .75rem; font-weight: 800; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab:hover{ background: #fff; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab.active{ border-color: var(--line); background: #fff; box-shadow: 0 8px 25px rgba(24,25,29,.06); font-weight: 750; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-workspace{ min-height: 570px; padding: clamp(1.25rem, 4vw, 3.5rem); }
.vp-farblabor [data-vp-id="legacyPanels"] .workspace-intro{ display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: start; }
.vp-farblabor [data-vp-id="legacyPanels"] .workspace-intro p{ margin: .2rem 0 0; color: var(--muted); }
.vp-farblabor [data-vp-id="legacyPanels"] .merksatz{ padding: 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }
.vp-farblabor [data-vp-id="legacyPanels"] .merksatz strong{ display: block; font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; }
.vp-farblabor [data-vp-id="legacyPanels"] .experiment{ margin-top: 2.4rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .swatch-row{ display: grid; grid-template-columns: repeat(3, 1fr); min-height: 250px; overflow: hidden; border-radius: 16px; }
.vp-farblabor [data-vp-id="legacyPanels"] .swatch{ min-height: 210px; border: 0; display: grid; place-items: end center; padding: 1rem; color: white; font-weight: 750; text-shadow: 0 1px 4px rgba(0,0,0,.45); }
.vp-farblabor [data-vp-id="legacyPanels"] .color-picker-row{ margin-top: 1.25rem; display: flex; flex-wrap: wrap; gap: .55rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .color-chip{ width: 38px; height: 38px; border: 3px solid #fff; border-radius: 50%; box-shadow: 0 0 0 1px var(--line); cursor: pointer; }
.vp-farblabor [data-vp-id="legacyPanels"] .color-chip.selected{ box-shadow: 0 0 0 3px var(--ink); }
.vp-farblabor [data-vp-id="legacyPanels"] .range-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .range-preview{ min-height: 245px; padding: 1.25rem; display: flex; align-items: end; justify-content: center; color: white; font-weight: 750; text-shadow: 0 1px 3px rgba(0,0,0,.35); }
.vp-farblabor [data-vp-id="legacyPanels"] .range-preview:first-child{ border-radius: 16px 0 0 16px; }
.vp-farblabor [data-vp-id="legacyPanels"] .range-preview:last-child{ border-radius: 0 16px 16px 0; }
.vp-farblabor [data-vp-id="legacyPanels"] .controls-grid{ margin-top: 1rem; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .range-label{ display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .4rem; font-size: .9rem; font-weight: 700; }
.vp-farblabor [data-vp-id="legacyPanels"] input[type="range"]{ width: 100%; accent-color: var(--ink); }
.vp-farblabor [data-vp-id="legacyPanels"] .challenge-pair{ display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; border-radius: 16px; }
.vp-farblabor [data-vp-id="legacyPanels"] .challenge-color{ min-height: 270px; border: 0; color: white; font-size: 1.1rem; font-weight: 800; text-shadow: 0 1px 4px rgba(0,0,0,.5); cursor: pointer; }
.vp-farblabor [data-vp-id="legacyPanels"] .feedback{ min-height: 2rem; margin: 1rem 0 0; font-weight: 750; }
.vp-farblabor [data-vp-id="legacyPanels"] .feedback.good{ color: #18743b; }
.vp-farblabor [data-vp-id="legacyPanels"] .feedback.bad{ color: #b73d31; }
.vp-farblabor [data-vp-id="legacyPanels"] .exercise-switch{ margin-bottom: 1rem; display: flex; gap: .45rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .exercise-switch button{ padding: .5rem .75rem; border: 1px solid var(--line); border-radius: 999px; background: white; cursor: pointer; }
.vp-farblabor [data-vp-id="legacyPanels"] .exercise-switch button.active{ background: var(--ink); color: white; border-color: var(--ink); }
.vp-farblabor [data-vp-id="legacyPanels"] .classify-grid{ display: grid; grid-template-columns: repeat(6, 1fr); gap: .55rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .classify-color{ min-height: 110px; padding: .45rem; border: 4px solid white; border-radius: 12px; color: white; font-size: .75rem; font-weight: 800; text-shadow: 0 1px 4px rgba(0,0,0,.5); box-shadow: 0 0 0 1px var(--line); cursor: pointer; }
.vp-farblabor [data-vp-id="legacyPanels"] .classify-color.selected{ box-shadow: 0 0 0 4px var(--ink); }
.vp-farblabor [data-vp-id="legacyPanels"] .quality-preview{ display: grid; grid-template-columns: 1fr 1fr; min-height: 270px; overflow: hidden; border-radius: 16px; }
.vp-farblabor [data-vp-id="legacyPanels"] .quality-preview div{ display: grid; place-items: end center; padding: 1rem; color: white; font-weight: 750; text-shadow: 0 1px 4px rgba(0,0,0,.4); }
.vp-farblabor [data-vp-id="legacyPanels"] .quantity-frame{ height: 310px; border-radius: 16px; display: grid; place-items: center; transition: background .2s; }
.vp-farblabor [data-vp-id="legacyPanels"] .quantity-inner{ display: grid; place-items: center; min-width: 48px; min-height: 48px; border-radius: 5px; color: white; font-weight: 750; text-shadow: 0 1px 4px rgba(0,0,0,.4); transition: .2s; }
.vp-farblabor [data-vp-id="legacyPanels"] .quantity-controls{ margin-top: 1rem; display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: end; }
.vp-farblabor [data-vp-id="legacyPanels"] .quantity-pickers{ margin-top: 1rem; display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .quantity-pickers label{ display: grid; gap: .35rem; font-size: .82rem; font-weight: 750; }
.vp-farblabor [data-vp-id="legacyPanels"] .quantity-pickers select{ width: 100%; padding: .65rem; border: 1px solid var(--line); border-radius: 9px; background: white; }
.vp-farblabor [data-vp-id="legacyPanels"] .swap-button{ border: 1px solid var(--line); border-radius: 10px; background: #fff; padding: .65rem .9rem; cursor: pointer; }
.vp-farblabor [data-vp-id="legacyPanels"] .ratio-note{ margin-top: 1rem; color: var(--muted); font-size: .9rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-prompt{ display: grid; grid-template-columns: 120px 1fr; gap: 1.5rem; align-items: center; margin-bottom: 1.5rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-swatch{ width: 120px; aspect-ratio: 1; border-radius: 18px; }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-options{ display: grid; grid-template-columns: repeat(6, 1fr); gap: .6rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-option{ aspect-ratio: 1; border: 3px solid white; border-radius: 12px; box-shadow: 0 0 0 1px var(--line); cursor: pointer; }
.vp-farblabor [data-vp-id="legacyPanels"] .sim-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .sim-background{ min-height: 280px; display: grid; place-items: center; border-radius: 16px; }
.vp-farblabor [data-vp-id="legacyPanels"] .sim-center{ width: 38%; aspect-ratio: 1; background: #929292; box-shadow: 0 5px 16px rgba(0,0,0,.12); }
.vp-farblabor [data-vp-id="legacyPanels"] .sim-caption{ margin-top: .55rem; text-align: center; color: var(--muted); font-size: .88rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-wheel{ display: block; width: min(100%, 430px); margin: 0 auto; overflow: visible; }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-segment{ stroke: white; stroke-width: 5; cursor: pointer; transition: transform .2s, opacity .2s; transform-origin: 300px 300px; }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-segment:hover,.vp-farblabor [data-vp-id="legacyPanels"] .quiz-segment:focus{ transform: scale(1.025); outline: none; }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-segment.dim{ opacity: .22; }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-axis{ stroke: var(--ink); stroke-width: 7; stroke-linecap: round; pointer-events: none; }
.vp-farblabor [data-vp-id="legacyPanels"] .application-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .application-card{ padding: 1.5rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .application-card > p{ min-height: 4.7rem; color: var(--muted); }
.vp-farblabor [data-vp-id="legacyPanels"] .card-number{ margin-bottom: 1.6rem; color: var(--accent); font-size: .75rem; font-weight: 800; letter-spacing: .1em; }
.vp-farblabor [data-vp-id="legacyPanels"] .depth-demo{ position: relative; height: 230px; margin: 1.4rem 0; overflow: hidden; border-radius: 14px; background: #e8edf2; }
.vp-farblabor [data-vp-id="legacyPanels"] .depth-plane{ position: absolute; left: 0; right: 0; display: flex; align-items: end; padding: .7rem; transition: .2s; }
.vp-farblabor [data-vp-id="legacyPanels"] .depth-plane span{ padding: .2rem .45rem; border-radius: 4px; background: rgba(255,255,255,.75); font-size: .72rem; font-weight: 750; }
.vp-farblabor [data-vp-id="legacyPanels"] .depth-plane.far{ inset: 0 0 45%; background: #9cbdcf; }
.vp-farblabor [data-vp-id="legacyPanels"] .depth-plane.middle{ top: 38%; bottom: 22%; left: 8%; background: #557f7c; clip-path: polygon(0 40%,28% 0,55% 44%,78% 12%,100% 58%,100% 100%,0 100%); }
.vp-farblabor [data-vp-id="legacyPanels"] .depth-plane.front{ top: 63%; background: #233e38; clip-path: polygon(0 20%,35% 0,62% 30%,100% 7%,100% 100%,0 100%); }
.vp-farblabor [data-vp-id="legacyPanels"] .light-demo{ display: grid; grid-template-columns: 1fr 1fr; height: 230px; margin: 1.4rem 0; overflow: hidden; border-radius: 14px; }
.vp-farblabor [data-vp-id="legacyPanels"] .light-demo div{ display: grid; place-items: end center; padding: .7rem; transition: background .25s; }
.vp-farblabor [data-vp-id="legacyPanels"] .light-demo span{ padding: .2rem .45rem; border-radius: 4px; background: rgba(255,255,255,.7); font-size: .72rem; font-weight: 750; }
.vp-farblabor [data-vp-id="legacyPanels"] .lit-field{ background: #f3b844; }
.vp-farblabor [data-vp-id="legacyPanels"] .shadow-field{ background: #4c5b91; }
.vp-farblabor [data-vp-id="legacyPanels"] .application-card select{ width: 100%; margin-top: .4rem; padding: .7rem; border: 1px solid var(--line); border-radius: 9px; background: white; }
.vp-farblabor [data-vp-id="legacyPanels"] .mood-demo{ position: relative; height: 230px; margin: 1.4rem 0; padding: 1.2rem; display: flex; flex-direction: column; justify-content: center; overflow: hidden; border-radius: 14px; color: #fff; background: #e34b32; transition: .25s; }
.vp-farblabor [data-vp-id="legacyPanels"] .mood-demo::before{ content: ""; position: absolute; width: 170px; aspect-ratio: 1; right: -30px; top: -45px; border: 24px solid var(--mood-ring, #f2d431); border-radius: 50%; opacity: .92; }
.vp-farblabor [data-vp-id="legacyPanels"] .mood-demo i{ position: absolute; width: 140px; height: 7px; left: 1.2rem; bottom: 1.4rem; background: currentColor; }
.vp-farblabor [data-vp-id="legacyPanels"] .mood-kicker{ font-size: .72rem; font-weight: 800; letter-spacing: .2em; }
.vp-farblabor [data-vp-id="legacyPanels"] .mood-demo strong{ position: relative; font-family: inherit; font-size: 2.5rem; font-weight: 500; }
.vp-farblabor [data-vp-id="legacyPanels"] .mood-buttons{ display: flex; flex-wrap: wrap; gap: .4rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .mood-button{ padding: .45rem .65rem; font-size: .82rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .finish-card{ margin-top: 2rem; padding: 1.4rem 0; display: flex; justify-content: space-between; align-items: center; gap: 1rem; border-top: 1px solid var(--line); }
.vp-farblabor [data-vp-id="legacyPanels"] .finish-card p{ margin: 0; font-weight: 700; }
.vp-farblabor [data-vp-id="legacyPanels"] .secondary-button{ background: transparent; color: var(--ink); border: 1px solid var(--ink); box-shadow: none; }
.vp-farblabor [data-vp-id="legacyPanels"] footer{ max-width: 1440px; margin: 1rem auto 0; padding: 2rem clamp(1rem, 5vw, 5rem); display: flex; justify-content: space-between; gap: 1rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .86rem; }
.vp-farblabor [data-vp-id="legacyPanels"] footer a{ color: inherit; }
.vp-farblabor [data-vp-id="legacyPanels"] dialog{ width: min(560px, calc(100% - 2rem)); padding: 2rem; border: 0; border-radius: 20px; box-shadow: 0 35px 90px rgba(0,0,0,.26); }
.vp-farblabor [data-vp-id="legacyPanels"] dialog::backdrop{ background: rgba(17,18,22,.55); backdrop-filter: blur(3px); }
.vp-farblabor [data-vp-id="legacyPanels"] dialog h2{ max-width: 16ch; font-size: 2rem; }
.vp-farblabor [data-vp-id="legacyPanels"] dialog p:not(.eyebrow){ color: var(--muted); }
.vp-farblabor [data-vp-id="legacyPanels"] .dialog-close{ position: absolute; right: 1rem; top: .8rem; border: 0; background: transparent; font-size: 1.8rem; cursor: pointer; }
@media (max-width: 920px){.vp-farblabor [data-vp-id="legacyPanels"] [data-vp-id="phase-1"],.vp-farblabor [data-vp-id="legacyPanels"] [data-vp-id="phase-2"]{ grid-template-columns: 1fr; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-copy{ max-width: 720px; }
.vp-farblabor [data-vp-id="legacyPanels"] .build-lab,.vp-farblabor [data-vp-id="legacyPanels"] .relationship-lab{ max-width: 720px; width: 100%; margin: auto; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-layout{ grid-template-columns: 1fr; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-list{ flex-direction: row; overflow-x: auto; padding-bottom: .5rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab{ width: auto; min-width: max-content; }
.vp-farblabor [data-vp-id="legacyPanels"] .application-grid{ grid-template-columns: 1fr; }
.vp-farblabor [data-vp-id="legacyPanels"] .application-card > p{ min-height: 0; }

}
@media (max-width: 640px){.vp-farblabor [data-vp-id="legacyPanels"] .app-header{ height: 64px; }
.vp-farblabor [data-vp-id="legacyPanels"] .about-button{ font-size: .82rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-nav{ padding: 0 .4rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-tab{ min-height: 54px; padding: .55rem .3rem; text-align: center; font-size: 0; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-tab span{ margin: 0; font-size: .82rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-tab.active{ font-size: .72rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase-tab.active span{ margin-right: .25rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .lab-title{ font-size: 2.75rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .wheel-center{ inset: 34%; }
.vp-farblabor [data-vp-id="legacyPanels"] .wheel-center p{ font-size: .72rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .primary-button{ padding: .62rem .75rem; font-size: .72rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-heading{ display: block; }
.vp-farblabor [data-vp-id="legacyPanels"] .workspace-intro{ grid-template-columns: 1fr; gap: 1rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-workspace{ min-height: 520px; padding: 1rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .swatch-row{ min-height: 200px; }
.vp-farblabor [data-vp-id="legacyPanels"] .swatch{ min-height: 180px; font-size: .76rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .range-grid,.vp-farblabor [data-vp-id="legacyPanels"] .controls-grid{ gap: .35rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .challenge-color{ min-height: 220px; }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-options{ grid-template-columns: repeat(4, 1fr); }
.vp-farblabor [data-vp-id="legacyPanels"] .classify-grid{ grid-template-columns: repeat(3, 1fr); }
.vp-farblabor [data-vp-id="legacyPanels"] .sim-background{ min-height: 190px; }
.vp-farblabor [data-vp-id="legacyPanels"] .finish-card,.vp-farblabor [data-vp-id="legacyPanels"] footer{ align-items: flex-start; flex-direction: column; }

}
@media (prefers-reduced-motion: reduce){.vp-farblabor [data-vp-id="legacyPanels"] *,.vp-farblabor [data-vp-id="legacyPanels"] *::before,.vp-farblabor [data-vp-id="legacyPanels"] *::after{ scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }

}
.vp-farblabor [data-vp-id="legacyPanels"]{--ink:#252d2e;--muted:#566262;--paper:#f6f4ef;--panel:#fff;--accent:#527783;--line:#d6dedd;--shadow:none;--radius:16px}
.vp-farblabor [data-vp-id="legacyPanels"] .phase{display:block;margin-top:28px;animation:none}
.vp-farblabor [data-vp-id="legacyPanels"] .phase[hidden]{display:none!important}
.vp-farblabor [data-vp-id="legacyPanels"] .lab-title{font-size:clamp(2.6rem,6vw,4.5rem);letter-spacing:normal;line-height:1.08;max-width:none;font-weight:700}
.vp-farblabor [data-vp-id="legacyPanels"] h2{font-family:system-ui;font-size:1.4rem;font-weight:700;line-height:1.3}
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-heading{display:block}
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-heading>p{max-width:750px}
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-heading .eyebrow{display:none}
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab.active{background:#527783;color:white;border-color:#527783}
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab.active span{color:white}
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-workspace{padding:25px;min-height:520px}
.vp-farblabor [data-vp-id="legacyPanels"] .application-card{padding:25px}
.vp-farblabor [data-vp-id="legacyPanels"] button:focus-visible,.vp-farblabor [data-vp-id="legacyPanels"] select:focus-visible,.vp-farblabor [data-vp-id="legacyPanels"] input:focus-visible{outline:3px solid #f7a10c;outline-offset:3px}
.vp-farblabor [data-vp-id="legacyPanels"] button{font:inherit}
.vp-farblabor [data-vp-id="legacyPanels"] .color-chip{min-width:38px;min-height:38px}
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-segment{stroke:white;stroke-width:5}
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-axis{stroke:#252d2e}
.vp-farblabor [data-vp-id="legacyPanels"] .swatch,.vp-farblabor [data-vp-id="legacyPanels"] .classify-color,.vp-farblabor [data-vp-id="legacyPanels"] .challenge-color{cursor:pointer}
@media(max-width:700px){.vp-farblabor [data-vp-id="legacyPanels"] .workspace-intro{grid-template-columns:1fr;gap:16px}
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-workspace{padding:18px}
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-list{flex-direction:row;flex-wrap:wrap;overflow:visible}
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab{min-width:0;width:auto;flex:1 1 135px;padding:10px;font-size:14px}
.vp-farblabor [data-vp-id="legacyPanels"] .quantity-controls{grid-template-columns:1fr}
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-prompt{grid-template-columns:70px 1fr}
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-swatch{width:70px}
}


.vp-farblabor{
  --vp-radius-small: 5px;
  --vp-color-accent: #f7a10c;
  --vp-color-accent-dark: #a45e00;
  --vp-color-accent-light: #fff3dc;
  --vp-color-petrol-dark: #244653;
  --vp-color-petrol: #527783;
  --vp-color-petrol-light: #e8f1f2;
  --vp-color-surface: #fff;
  --vp-color-surface-muted: #faf8f4;
  --lab-line: rgba(36,70,83,.2);
  margin: 0;
  background: var(--vp-color-surface-muted);
  color: var(--theme-text-color, #252d2e);
  font-family: var(--theme-font-family, system-ui, sans-serif);
  font-size: 17px;
  line-height: 1.6;
}
.vp-farblabor .lab-shell{ max-width: 1120px; padding: 24px clamp(18px,4vw,40px) 48px; border-top: 3px solid var(--vp-color-accent); }
.vp-farblabor :is(.lab-title,h2,h3){ color: var(--vp-color-petrol-dark); }
.vp-farblabor .lab-title,.vp-farblabor [data-vp-id="legacyPanels"] .lab-title{ font-family: var(--theme-font-family, system-ui, sans-serif); font-size: clamp(2rem,4.5vw,3.3rem); line-height: 1.15; font-weight: 700; letter-spacing: normal; margin: 12px 0 18px; }
.vp-farblabor h2,.vp-farblabor [data-vp-id="legacyPanels"] h2{ font-family: inherit; font-size: clamp(1.2rem,1.7vw,1.55rem); line-height: 1.25; }
.vp-farblabor .eyebrow{ color: var(--vp-color-petrol); font-size: .8rem; letter-spacing: .1em; font-weight: 600; }
.vp-farblabor .lab-nav{ display:flex; align-items:center; flex-wrap:nowrap; gap:clamp(12px,3vw,30px); border:0; margin:0 0 32px; padding:0; }
.vp-farblabor .lab-nav button{ flex:none; padding:8px 0; border:0; border-bottom:3px solid transparent; border-radius:0; background:transparent; color:var(--vp-color-petrol-dark); font:inherit; font-weight:500; white-space:nowrap; }
.vp-farblabor .lab-nav button[aria-selected=true]{ background:transparent; color:var(--vp-color-petrol-dark); border-bottom-color:var(--vp-color-accent); font-weight:700; }
.vp-farblabor .lab-nav button:hover{ color:var(--vp-color-accent-dark); }
.vp-farblabor .nav-divider{ color:var(--vp-color-petrol); opacity:.6; font-weight:400; }
.vp-farblabor :is(button,input,select,summary):focus-visible{ outline:3px solid var(--vp-color-accent); outline-offset:3px; }
.vp-farblabor .model-switch{ border:0; border-radius:var(--vp-radius-small); background:var(--vp-color-petrol-light); padding:6px; gap:6px; }
.vp-farblabor .model-choice{ border-radius:var(--vp-radius-small); color:var(--vp-color-petrol-dark); }
.vp-farblabor .model-choice[aria-pressed=true]{ background:var(--vp-color-petrol-dark); color:#fff; }
.vp-farblabor .model-steps button{ background:var(--vp-color-surface); color:var(--vp-color-petrol-dark); }
.vp-farblabor .model-steps button[aria-pressed=true]{ background:var(--vp-color-accent); color:#24201a; }
.vp-farblabor [data-vp-id="modelNote"]{ margin:18px 0; font-size:.95rem; color:var(--vp-color-petrol-dark); }
.vp-farblabor .groups{ gap:12px 36px; }
.vp-farblabor .groups>div>div:first-child{ font-size:.9rem; font-weight:600; color:var(--vp-color-petrol-dark); }
.vp-farblabor .harmonies button{ border-radius:var(--vp-radius-small); border-color:var(--lab-line); }
.vp-farblabor .harmonies button[aria-pressed=true]{ border-color:var(--vp-color-petrol-dark); background:var(--vp-color-petrol-light); }
.vp-farblabor .card{ border:1px solid var(--lab-line); border-left:4px solid var(--vp-color-petrol); border-radius:var(--vp-radius-small); padding:24px; background:var(--vp-color-surface); }
.vp-farblabor :is(.palette-strip,.parked){ border-radius:var(--vp-radius-small); }
.vp-farblabor .color-list li{ border-color:var(--lab-line); }
.vp-farblabor :is(.icon-btn,[data-vp-id="copyStatus"]){ color:var(--vp-color-petrol-dark); }
.vp-farblabor :is([data-vp-id="hint"],.paint-help,.palette-intro,[data-vp-id="paletteStatus"],footer){ color:var(--vp-color-petrol); }
.vp-farblabor [data-vp-id="mixNote"]{ border-top:1px solid var(--lab-line); padding-top:14px; margin-top:20px; font-size:.85rem; }
.vp-farblabor summary{ cursor:pointer; color:var(--vp-color-petrol-dark); }
.vp-farblabor input{ accent-color:var(--vp-color-petrol); }
.vp-farblabor dialog{ border:1px solid var(--lab-line); border-radius:var(--vp-radius-small); background:var(--vp-color-surface); }
.vp-farblabor dialog button,.vp-farblabor [data-vp-id="hexForm"] button{ border:1px solid var(--lab-line); border-radius:var(--vp-radius-small); background:var(--vp-color-petrol-light); color:var(--vp-color-petrol-dark); padding:8px 14px; }
.vp-farblabor [data-vp-id="dialogConfirm"]{ background:var(--vp-color-petrol-dark); color:white; }
.vp-farblabor [data-vp-id="hexForm"] input{ border:1px solid var(--lab-line); border-radius:var(--vp-radius-small); }
.vp-farblabor [data-vp-id="legacyPanels"]{ --ink:var(--vp-color-petrol-dark); --muted:var(--vp-color-petrol); --paper:var(--vp-color-surface-muted); --panel:var(--vp-color-surface); --accent:var(--vp-color-petrol); --line:var(--lab-line); --radius:var(--vp-radius-small); --shadow:none; }
.vp-farblabor [data-vp-id="legacyPanels"] .panel{ border-color:var(--lab-line); border-radius:var(--vp-radius-small); box-shadow:none; }
.vp-farblabor [data-vp-id="legacyPanels"] .application-card{ border-top:3px solid var(--vp-color-accent); }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab{ border-radius:0; border:0; border-left:3px solid transparent; box-shadow:none; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab.active{ border-left-color:var(--vp-color-accent); background:var(--vp-color-petrol-light); color:var(--vp-color-petrol-dark); box-shadow:none; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab.active span{ color:var(--vp-color-petrol); }
.vp-farblabor [data-vp-id="legacyPanels"] :is(.primary-button,.secondary-button,.mood-button,select){ border-radius:var(--vp-radius-small); box-shadow:none; }
.vp-farblabor [data-vp-id="legacyPanels"] .primary-button{ background:var(--vp-color-petrol-dark); }
.vp-farblabor [data-vp-id="legacyPanels"] .mood-button.active{ background:var(--vp-color-petrol-light); color:var(--vp-color-petrol-dark); border-color:var(--vp-color-petrol); }
.vp-farblabor [data-vp-id="legacyPanels"] .range-preview:first-child{ border-radius:5px 0 0 5px; }
.vp-farblabor [data-vp-id="legacyPanels"] .range-preview:last-child{ border-radius:0 5px 5px 0; }
@media(max-width:600px){.vp-farblabor .lab-nav{ gap:14px; margin-bottom:24px; justify-content:flex-start; }
.vp-farblabor .lab-nav button{ font-size:15px; padding:8px 0; }
.vp-farblabor .card{ padding:18px; }
.vp-farblabor .model-switch{ width:100%; }

}
@media(max-width:350px){.vp-farblabor .lab-nav{ gap:9px; }
.vp-farblabor .lab-nav button{ font-size:14px; }
 }
.vp-farblabor [data-vp-id="legacyPanels"] :is(.merksatz,.swatch-row,.challenge-pair,.classify-color,.quality-preview,.quantity-frame,.swap-button,.quiz-swatch,.quiz-option,.sim-background,.depth-demo,.light-demo,.mood-demo,.exercise-switch button){ border-radius:var(--vp-radius-small); }
.vp-farblabor [data-vp-id="legacyPanels"] .merksatz{ background:var(--vp-color-accent-light); border:0; }
.vp-farblabor [data-vp-id="legacyPanels"] .learn-more{ display:inline-block; margin-top:18px; color:var(--vp-color-petrol-dark); text-decoration:underline; text-underline-offset:4px; font-weight:600; font-size:.9rem; }
.vp-farblabor [data-vp-id="legacyPanels"] .learn-more:hover{ color:var(--vp-color-accent-dark); }
.vp-farblabor [data-vp-id="legacyPanels"] .learn-more:focus-visible{ outline:3px solid var(--vp-color-accent); outline-offset:4px; }
.vp-farblabor .lab-entry-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:32px; }
.vp-farblabor .lab-entry{ display:flex; flex-direction:column; padding:24px; border:1px solid var(--lab-line); border-radius:var(--vp-radius-small); background:var(--vp-color-surface); color:inherit; text-decoration:none; transition:border-color .18s,transform .18s; }
.vp-farblabor .lab-entry:hover{ border-color:var(--vp-color-accent); transform:translateY(-2px); }
.vp-farblabor .entry-icon{ display:grid; place-items:center; width:50px; height:50px; border-radius:50%; background:var(--vp-color-petrol-light); color:var(--vp-color-petrol-dark); margin-bottom:24px; }
.vp-farblabor .entry-icon svg{ width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.vp-farblabor .entry-icon svg path{ stroke:currentColor; stroke-width:1.6; cursor:inherit; }
.vp-farblabor .lab-entry h2{ margin:0 0 8px; }
.vp-farblabor .lab-entry p{ margin:0 0 24px; }
.vp-farblabor .entry-action{ margin-top:auto; font-size:.9rem; font-weight:700; color:var(--vp-color-accent-dark); }
.vp-farblabor .lab-back{ display:inline-flex; padding:8px 0; margin:0 0 24px; color:var(--vp-color-accent-dark); text-decoration:none; font-weight:700; }
.vp-farblabor .lab-back:hover{ text-decoration:underline; text-underline-offset:4px; }
.vp-farblabor :is(.lab-entry,.lab-back):focus-visible{ outline:3px solid var(--vp-color-petrol-dark); outline-offset:4px; }
.vp-farblabor :is([data-vp-id="page-start"] header,[data-vp-id="legacyPanels"] .contrast-heading){ border:0; padding-top:0; }
.vp-farblabor [data-vp-id="legacyPanels"] .phase{ margin-top:0; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-heading .eyebrow{ display:block; }
.vp-farblabor [data-vp-id="legacyPanels"] .lab-title{ max-width:none; }
.vp-farblabor :is([data-vp-id="home-title"],[data-vp-id="circles-title"],[data-vp-id="phase3-title"],[data-vp-id="phase4-title"]):focus{ outline:none; }
@media(max-width:700px){.vp-farblabor .lab-entry-grid{ grid-template-columns:1fr; gap:8px; margin-top:24px; }
.vp-farblabor .lab-entry{ display:grid; grid-template-columns:40px minmax(0,1fr); gap:3px 12px; padding:14px; }
.vp-farblabor .entry-icon{ grid-row:1/4; width:40px; height:40px; margin:0; }
.vp-farblabor .lab-entry :is(h2,p,.entry-action){ grid-column:2; margin:0; }
.vp-farblabor .lab-entry h2{ font-size:1.1rem; }
.vp-farblabor .lab-entry p{ font-size:.9rem; line-height:1.4; }

}
@media(prefers-reduced-motion:reduce){.vp-farblabor .lab-entry{ transition:none; }
.vp-farblabor .lab-entry:hover{ transform:none; }
 }


.vp-farblabor{
 --lab-heading:var(--vp-color-text,#222222); --lab-text:var(--vp-color-text,#3d3d3d);
 --lab-muted:#666666; --lab-link:var(--vp-color-accent-dark,#a45e00);
 --lab-border:var(--vp-color-border,#c5d3d7); --lab-shadow:0 12px 34px rgba(34,34,34,.07);
 --lab-radius:16px; color:var(--lab-text); line-height:1.65; background:#fff;
}
.vp-farblabor .lab-shell{ box-sizing:border-box; width:100%; max-width:1200px; border:0; padding:0 28px 32px; }
.vp-farblabor :is(button,input,select){ font-family:inherit; }
.vp-farblabor p{ line-height:1.65; }
.vp-farblabor :is(.lab-title,h2,h3),.vp-farblabor [data-vp-id="legacyPanels"] :is(.lab-title,h2,h3){ color:var(--lab-heading); font-family:inherit; }
.vp-farblabor [data-vp-id="page-start"] header{ padding:32px 0 24px; }
.vp-farblabor [data-vp-id="home-title"]{ margin:8px 0 4px; font-size:clamp(2rem,5vw,3.4rem); line-height:1.1; font-weight:700; }
.vp-farblabor .eyebrow,.vp-farblabor [data-vp-id="legacyPanels"] .eyebrow{ display:block; margin:0 0 12px; color:var(--lab-link); font-size:.78rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.vp-farblabor [data-vp-id="page-start"] .eyebrow{ margin:0; letter-spacing:.1em; }
.vp-farblabor .lab-entry-grid{ gap:12px; margin-top:0; }
.vp-farblabor .lab-entry{ position:relative; padding:24px; border:1px solid var(--lab-border); border-radius:var(--lab-radius); background:var(--vp-color-surface,#fff); box-shadow:var(--lab-shadow); color:var(--lab-text); transition:.2s; line-height:1.65; }
.vp-farblabor .lab-entry:hover{ border-color:rgba(247,161,12,.75); transform:translateY(-3px); box-shadow:none; }
.vp-farblabor .entry-icon{ flex:0 0 50px; width:50px; height:50px; box-sizing:border-box; margin-bottom:26px; border:1px solid var(--lab-border); }
.vp-farblabor .entry-icon svg{ width:22px; height:22px; stroke-width:1.8; }
.vp-farblabor .entry-icon svg path{ stroke-width:1.8; }
.vp-farblabor .lab-entry h2{ margin:0 0 8px; font-size:1.35rem; line-height:1.3; }
.vp-farblabor .lab-entry p{ margin:0 0 25px; }
.vp-farblabor .entry-action{ display:flex; align-items:center; gap:10px; margin-top:auto; color:var(--lab-link); font-size:inherit; font-weight:900; }
.vp-farblabor .lab-chevron{ flex:none; width:8px; height:8px; border-top:2px solid currentColor; border-right:2px solid currentColor; transform:rotate(45deg); }
.vp-farblabor .lab-work-head{ display:flex; justify-content:space-between; align-items:end; gap:20px; margin:34px 0 20px; }
.vp-farblabor .lab-work-head .lab-title,.vp-farblabor [data-vp-id="legacyPanels"] .lab-work-head .lab-title{ margin:0; font-size:clamp(1.8rem,4vw,2.5rem); line-height:1.1; }
.vp-farblabor .lab-back{ display:inline-flex; flex:none; align-items:center; gap:10px; padding:0; margin:0; border:0; color:var(--lab-link); font-weight:900; }
.vp-farblabor .lab-back .lab-chevron{ transform:rotate(-135deg); }
.vp-farblabor :is(.card,dialog),.vp-farblabor [data-vp-id="legacyPanels"] .panel{ border:1px solid var(--lab-border); border-radius:var(--lab-radius); background:var(--vp-color-surface,#fff); box-shadow:var(--lab-shadow); }
.vp-farblabor [data-vp-id="legacyPanels"] .application-card{ border-top:1px solid var(--lab-border); }
.vp-farblabor [data-vp-id="legacyPanels"]{ --ink:var(--lab-heading); --muted:var(--lab-muted); --line:var(--lab-border); --radius:var(--lab-radius); --shadow:var(--lab-shadow); color:var(--lab-text); }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-heading{ margin-bottom:24px; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-heading>p{ color:var(--lab-text); }
.vp-farblabor :is([data-vp-id="hint"],.paint-help,.palette-intro,[data-vp-id="paletteStatus"],footer){ color:var(--lab-muted); }
.vp-farblabor :is([data-vp-id="modelNote"],.groups>div>div:first-child,summary),.vp-farblabor [data-vp-id="legacyPanels"] .application-card>p{ color:var(--lab-text); }
.vp-farblabor :is([data-vp-id="copyStatus"],.learn-more){ color:var(--lab-link); }
.vp-farblabor .model-switch{ border:1px solid var(--lab-border); border-radius:9px; background:var(--vp-color-surface,#fff); }
.vp-farblabor .model-choice{ color:var(--lab-text); border-radius:9px; }
.vp-farblabor .model-choice[aria-pressed=true]{ background:var(--vp-color-accent-light,#fff3dc); color:var(--lab-heading); box-shadow:inset 0 0 0 1px var(--vp-color-accent,#f7a10c); }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab{ border-radius:9px; }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab.active{ background:var(--vp-color-accent-light,#fff3dc); color:var(--lab-heading); }
.vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab.active span{ color:var(--lab-link); }
.vp-farblabor [data-vp-id="legacyPanels"] :is(.secondary-button,.swap-button),.vp-farblabor dialog button,.vp-farblabor [data-vp-id="hexForm"] button{ display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:11px 17px; border:1px solid var(--lab-border); border-radius:9px; background:var(--vp-color-surface,#fff); color:var(--lab-text); font-weight:800; box-shadow:none; }
.vp-farblabor :is(a,button,input,select,summary):focus-visible,.vp-farblabor [data-vp-id="legacyPanels"] :is(button,input,select):focus-visible{ outline:3px solid var(--vp-color-petrol-dark,#244653); outline-offset:3px; }
@media(max-width:700px){.vp-farblabor .lab-shell{ padding:0 17px 32px; }
.vp-farblabor .lab-entry-grid{ gap:8px; }
.vp-farblabor .lab-entry{ padding:12px 14px; grid-template-columns:40px minmax(0,1fr); column-gap:12px; row-gap:2px; }
.vp-farblabor .entry-icon{ width:40px; height:40px; margin:0; }
.vp-farblabor .lab-entry h2{ margin:0; font-size:1.1rem; line-height:1.25; }
.vp-farblabor .lab-entry p,.vp-farblabor .entry-action{ margin:0; font-size:.9rem; line-height:1.35; }
.vp-farblabor .lab-work-head{ align-items:start; flex-direction:column-reverse; }

}
@media(max-width:560px){.vp-farblabor [data-vp-id="page-start"] header{ padding:28px 0 22px; }
 }
@media(prefers-reduced-motion:reduce){.vp-farblabor .lab-entry{ transition:none; }
 }
.vp-farblabor [data-vp-id="page-start"] header>p{ margin:0; color:var(--lab-text); font-size:1rem; line-height:1.65; }
.vp-farblabor [data-vp-id="legacyPanels"] .blog-tile{ display:flex; align-items:center; gap:12px; padding:12px; margin-top:24px; border:1px solid var(--lab-border); border-radius:12px; background:var(--vp-color-surface-muted,#faf8f4); color:var(--lab-text); text-decoration:none; transition:border-color .18s,background .18s; }
.vp-farblabor [data-vp-id="legacyPanels"] .blog-tile:hover{ border-color:var(--vp-color-accent,#f7a10c); background:var(--vp-color-accent-light,#fff3dc); }
.vp-farblabor [data-vp-id="legacyPanels"] .blog-tile img{ display:block; flex:none; width:72px; height:72px; object-fit:contain; border-radius:8px; background:#fff; }
.vp-farblabor [data-vp-id="legacyPanels"] .blog-tile-copy{ display:flex; flex-direction:column; gap:3px; min-width:0; flex:1; }
.vp-farblabor [data-vp-id="legacyPanels"] .blog-tile-label{ color:var(--lab-link); font-size:.7rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.vp-farblabor [data-vp-id="legacyPanels"] .blog-tile strong{ color:var(--lab-heading); font-size:1rem; line-height:1.3; }
.vp-farblabor [data-vp-id="legacyPanels"] .blog-tile .lab-chevron{ margin-right:3px; color:var(--lab-link); }
@media(prefers-reduced-motion:reduce){.vp-farblabor [data-vp-id="legacyPanels"] .blog-tile{ transition:none; }
 }
.vp-farblabor [data-vp-id="legacyPanels"] .application-card{ display:flex; flex-direction:column; min-width:0; }
.vp-farblabor [data-vp-id="legacyPanels"] .application-card > :is(.depth-demo,.light-demo,.mood-demo){ flex-shrink:0; }
.vp-farblabor [data-vp-id="legacyPanels"] .application-card > .blog-tile{ margin-top:auto; }
.vp-farblabor [data-vp-id="legacyPanels"] .application-card > [data-vp-id="depth-range"],.vp-farblabor [data-vp-id="legacyPanels"] .application-card:has(.blog-tile) > .mood-buttons{ margin-bottom:24px; }
.vp-farblabor [data-vp-id="legacyPanels"] [data-vp-id="phase-3"] button,.vp-farblabor [data-vp-id="legacyPanels"] [data-vp-id="phase-3"] button *{ font-weight:400; }
.vp-farblabor [data-vp-id="legacyPanels"] .swap-icon{ width:20px; height:20px; flex:none; fill:none; }
.vp-farblabor [data-vp-id="legacyPanels"] .swap-icon path{ fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; cursor:inherit; }

/* Embed in the WordPress content column, inheriting the theme's font. */
.vp-farblabor { font:inherit; line-height:1.65; background:transparent; --lab-wheel-divider:#fff; --lab-selection:#111; --lab-marker-halo:#fff; }
.vp-farblabor *, .vp-farblabor *::before, .vp-farblabor *::after { box-sizing:border-box; }
.vp-farblabor .lab-shell { padding:0 0 32px; max-width:1200px; margin-inline:auto; }
.vp-farblabor button { height:auto; text-transform:none; letter-spacing:normal; white-space:normal; }
.vp-farblabor [data-vp-id="wheel"] path { stroke:var(--lab-wheel-divider); }
.vp-farblabor [data-vp-id="wheel"] path:focus-visible { stroke:var(--lab-selection); }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-segment { stroke:var(--lab-wheel-divider); }
.vp-farblabor [data-vp-id="legacyPanels"] .quiz-axis { stroke:var(--lab-selection); }
.vp-farblabor [data-vp-id="digitalWheel"]:focus-visible { outline-color:var(--lab-selection); }
.vp-farblabor .light-track button { background:var(--vp-color-surface,#fff); color:var(--lab-heading); }
.vp-farblabor .light-track button svg :is(path,polyline) { stroke:currentColor; }
.vp-farblabor .parked { background:var(--vp-color-surface,#fff); border-color:var(--lab-border); }
.vp-farblabor .save-switch input { accent-color:var(--vp-color-petrol,#527783); }
.vp-farblabor [data-vp-id="hexForm"] input { background:var(--vp-color-surface,#fff); color:var(--lab-text); }
.vp-farblabor dialog { color:var(--lab-text); max-width:min(440px,calc(100vw - 32px)); }
.vp-farblabor dialog :is(h2,p) { color:inherit; }
.vp-farblabor [data-vp-id="legacyPanels"] :is(.color-chip,.classify-color,.quiz-option).selected { outline:3px solid var(--lab-selection); outline-offset:2px; }
html[data-vp-theme="dark"] .vp-farblabor {
 color-scheme:dark;
 --vp-color-accent:#f7a10c; --vp-color-accent-dark:#f7a10c; --vp-color-accent-light:#382c1c;
 --vp-color-petrol-dark:#b0cfd5; --vp-color-petrol:#83aab5; --vp-color-petrol-light:#243b43;
 --vp-color-surface:#202a2f; --vp-color-surface-muted:#28343a;
 --vp-color-text:#e5e9e7; --vp-color-border:#50636b;
 --lab-heading:#e5e9e7; --lab-text:#e5e9e7; --lab-muted:#bfc8c7;
 --lab-link:#f7a10c; --lab-border:#50636b; --lab-line:#50636b;
 --lab-shadow:0 12px 34px rgba(0,0,0,.18);
 --lab-wheel-divider:#000; --lab-selection:#fff; --lab-marker-halo:#000;
}
html[data-vp-theme="dark"] .vp-farblabor :is(.model-choice,.model-steps button) { color:var(--lab-text); }
html[data-vp-theme="dark"] .vp-farblabor .model-steps button[aria-pressed="true"] { color:#24201a; }
html[data-vp-theme="dark"] .vp-farblabor :is(.card,.harmonies button,.model-switch,dialog,.parked) { background:var(--vp-color-surface); border-color:var(--lab-border); }
html[data-vp-theme="dark"] .vp-farblabor .harmonies button[aria-pressed="true"] { background:var(--vp-color-petrol-light); border-color:var(--vp-color-petrol-dark); }
html[data-vp-theme="dark"] .vp-farblabor :is(.icon-btn,summary,[data-vp-id="copyStatus"]) { color:var(--vp-color-petrol-dark); }
html[data-vp-theme="dark"] .vp-farblabor :is(.light-control,.paint-help,.palette-intro,[data-vp-id="paletteStatus"],[data-vp-id="hint"],footer) { color:var(--lab-muted); }
html[data-vp-theme="dark"] .vp-farblabor [data-vp-id="legacyPanels"] :is(select,.swap-button,.exercise-switch button,.mood-button,.secondary-button) { background:var(--vp-color-surface); color:var(--lab-text); border-color:var(--lab-border); }
html[data-vp-theme="dark"] .vp-farblabor [data-vp-id="legacyPanels"] :is(.exercise-switch button.active,.mood-button.active) { background:var(--vp-color-petrol-light); color:var(--vp-color-petrol-dark); border-color:var(--vp-color-petrol); }
html[data-vp-theme="dark"] .vp-farblabor [data-vp-id="legacyPanels"] .contrast-tab:hover { background:var(--vp-color-surface-muted); }
html[data-vp-theme="dark"] .vp-farblabor [data-vp-id="legacyPanels"] .feedback.good { color:#99d5ac; }
html[data-vp-theme="dark"] .vp-farblabor [data-vp-id="legacyPanels"] .feedback.bad { color:#ffb0a6; }
html[data-vp-theme="dark"] .vp-farblabor [data-vp-id="dialogConfirm"] { background:#f7a10c; color:#24201a; }
/* Color samples, experiment artwork and exported worksheets retain their colors. */
html[data-vp-theme="dark"] .vp-farblabor [data-vp-id="legacyPanels"] [data-contrast="light"] .color-chip { border-color:var(--vp-color-surface); }
html[data-vp-theme="dark"] .vp-farblabor [data-vp-id="legacyPanels"] [data-contrast="light"] .color-chip.selected { box-shadow:none; outline:3px solid #fff; outline-offset:2px; }
html[data-vp-theme="dark"] .vp-farblabor [data-vp-id="legacyPanels"] [data-contrast="warm"] .classify-color { border-color:var(--vp-color-surface); }
html[data-vp-theme="dark"] .vp-farblabor [data-vp-id="legacyPanels"] [data-contrast="warm"] .classify-color.selected { box-shadow:none; outline:3px solid #fff; outline-offset:2px; }
.vp-farblabor .color-hex { color:var(--lab-muted); }
.vp-farblabor .mix-details summary { color:var(--lab-text); }
.vp-farblabor .mix-detail-note { color:var(--lab-muted); }
html[data-vp-theme="dark"] .vp-farblabor .harmonies svg circle[fill="#527783"] { fill:var(--vp-color-petrol-dark); }
html[data-vp-theme="dark"] .vp-farblabor .icon-btn:hover { color:var(--vp-color-accent); }
.vp-farblabor [data-vp-id="legacyPanels"] .lab-work-head .lab-title { max-width:none; }
.vp-farblabor [data-vp-id="legacyPanels"] [data-vp-id="phase-3"] button,
.vp-farblabor [data-vp-id="legacyPanels"] [data-vp-id="phase-3"] button * { font-weight:400 !important; }

/* Only the interactive application is excluded; leave the page TOC untouched. */
.vp-farblabor :is(#toc_container,#ez-toc-container,#rank-math-toc,[data-vp-id="toc_container"],[data-vp-id="ez-toc-container"],[data-vp-id="rank-math-toc"],.ez-toc-container,.ez-toc-v2_0,.lwptoc,.wp-block-table-of-contents,.wp-block-rank-math-toc-block,.rank-math-toc,.aioseo-table-of-contents,.wp-block-yoast-seo-table-of-contents) { display:none !important; }