.kansas{font-family:new-kansas,Poppins,sans-serif}:root{--text: #333333;--hair: rgba(0, 0, 0, .12);--hairHigh: rgba(0, 0, 0, .24);--bg-sat: 35%;--bg-l: 96%}.app-store-badge{display:inline-block;transition:opacity .2s ease}.app-store-badge:hover{opacity:.8}.app-store-badge img{height:60px;width:auto;display:block}.hero-cta-group{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;max-width:100%}.hero-cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:52px;padding:0 20px;border-radius:8px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:15px;font-weight:700;line-height:1;text-decoration:none;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease}.hero-cta:hover{transform:translateY(-1px)}.hero-cta:focus-visible{outline:3px solid rgba(17,24,39,.22);outline-offset:3px}.hero-cta svg{width:18px;height:18px;flex:0 0 auto}.hero-cta--secondary{background:#fff;color:#111827;border:1px solid rgba(17,24,39,.16);box-shadow:0 8px 18px #11182714}.hero-cta--secondary:hover{background:#fffdfb;color:#111827;border-color:#11182747;box-shadow:0 12px 26px #1118271a}@media (max-width: 520px){.hero-cta-group{width:100%}.hero-cta{width:min(100%,320px);min-height:50px}}.phone-demo{display:flex;flex-direction:column;align-items:center;padding:20px 16px 28px}.play-sticker{z-index:7;pointer-events:none;color:oklch(72% .2 25);transform:rotate(-2deg);display:flex;flex-direction:column;align-items:center;margin:0 0 2px}.play-sticker__text{font-family:Caveat,ui-sans-serif,system-ui,cursive;font-weight:700;font-size:32px;line-height:.9;white-space:nowrap}.play-sticker__arrow{display:block;width:20px;height:auto;margin:3px 0 0}.sim-controls{position:relative;z-index:10;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin:0 0 16px;max-width:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}.sim-reset{width:36px;height:36px;border-radius:50%;border:1px solid var(--hair);background:var(--bg);color:var(--text);font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background .12s ease}.sim-reset:hover{background:#eee}.sim-reset:active{transform:rotate(180deg);transition:transform .24s ease}.theme-toggle{width:36px;height:36px;border-radius:50%;border:1px solid var(--hair);background:var(--bg);color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background .12s ease}.theme-toggle:hover{background:#eee}.theme-icon{width:17px;height:17px;display:block}.theme-icon--sun,.phone-demo[data-theme=dark] .theme-icon--moon{display:none}.phone-demo[data-theme=dark] .theme-icon--sun{display:block}.key-picker,.instrument-picker{--current-hue: #ff0000;position:relative}.key-picker-trigger,.instrument-picker-trigger{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 12px;margin:0;border:1px solid var(--hair);border-radius:999px;background:var(--bg);color:var(--ink);font-family:inherit;font-size:13px;font-weight:500;letter-spacing:-.05px;cursor:pointer;white-space:nowrap;transition:background .14s ease,border-color .14s ease}.key-picker-trigger:hover,.instrument-picker-trigger:hover{background:#f3f3f3}.key-picker[data-open=true] .key-picker-trigger{border-color:color-mix(in oklab,var(--current-hue) 35%,var(--hairHigh) 65%);background:color-mix(in oklab,var(--current-hue) 5%,var(--bg) 95%)}.instrument-picker[data-open=true] .instrument-picker-trigger{border-color:var(--hairHigh);background:#f3f3f3}.key-picker-trigger-label,.instrument-picker-trigger-label{font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);font-weight:600}.key-picker-swatch{display:inline-block;width:11px;height:11px;border-radius:50%;background:var(--swatch-color, currentColor);box-shadow:inset 0 0 0 .5px #0000001f}.key-picker-value,.instrument-picker-value{font-size:13px;font-weight:600;letter-spacing:-.1px;text-align:left;color:var(--ink)}.key-picker-value{min-width:14px}.key-picker-caret,.instrument-picker-caret{width:9px;height:6px;color:var(--muted);transition:transform .22s ease}.key-picker[data-open=true] .key-picker-caret,.instrument-picker[data-open=true] .instrument-picker-caret{transform:rotate(180deg)}.key-picker-menu,.instrument-picker-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:144px;max-height:360px;overflow:auto;background:var(--bg);border:1px solid var(--hair);border-radius:12px;padding:4px;box-shadow:0 12px 32px #0000001a,0 2px 6px #0000000a;opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .16s ease,transform .16s ease;list-style:none;margin:0}.key-picker[data-open=true] .key-picker-menu,.instrument-picker[data-open=true] .instrument-picker-menu{opacity:1;transform:translateY(0);pointer-events:auto}.key-picker-option,.instrument-picker-option{--swatch-color: #ff0000;display:flex;align-items:center;gap:10px;width:100%;padding:7px 10px;margin:0;border:none;border-radius:8px;background:transparent;color:var(--ink);font-family:inherit;font-size:13px;font-weight:500;letter-spacing:-.1px;cursor:pointer;text-align:left}.key-picker-option:hover{background:color-mix(in oklab,var(--swatch-color) 8%,var(--bg) 92%)}.key-picker-option[aria-selected=true]{background:color-mix(in oklab,var(--swatch-color) 16%,var(--bg) 84%)}.instrument-picker-option:hover{background:#f3f3f3}.instrument-picker-option[aria-selected=true]{background:#e8e8e8}.key-picker-option-letter,.instrument-picker-option-letter{flex:1}.phone-frame{position:relative;width:min(393px,100%);aspect-ratio:9 / 19.5;background:#1a1a1a;border-radius:52px;box-shadow:0 14px 40px #00000029,0 0 0 1px #ffffff0f inset;overflow:hidden}.phone-poster{position:absolute;top:14px;left:14px;width:calc(100% - 28px);height:calc(100% - 28px);object-fit:cover;border-radius:38px;z-index:2;opacity:1;transition:opacity .4s ease;pointer-events:none}.phone-demo.live .phone-poster{opacity:0}.phone-iframe{position:absolute;top:14px;left:14px;width:390px;height:882px;transform:scale(.9359);transform-origin:0 0;border:0;border-radius:42px;background:#1a1a1a;pointer-events:auto}.open-in-browser{display:inline-flex;align-items:center;gap:5px;margin-top:16px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:13px;font-weight:600;color:oklch(72% .2 25);text-decoration:none;pointer-events:auto}.open-in-browser:hover{text-decoration:underline}.color-wheel-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:8px 48px;max-width:850px;margin:0 auto;align-items:start}.color-wheel-figure{display:contents}.color-wheel-figure:first-child>.color-wheel-title{grid-column:1;grid-row:1}.color-wheel-figure:first-child>.color-wheel-demo{grid-column:1;grid-row:2}.color-wheel-figure:first-child>.cw-caption{grid-column:1;grid-row:3}.color-wheel-figure:last-child>.color-wheel-title{grid-column:2;grid-row:1}.color-wheel-figure:last-child>.color-wheel-demo{grid-column:2;grid-row:2}.color-wheel-figure:last-child>.cw-caption{grid-column:2;grid-row:3}.color-wheel-demo{margin:0;display:flex;justify-content:center}.color-wheel-demo svg{width:340px;height:340px;max-width:100%;display:block}.color-wheel-demo .note-label{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;font-weight:700;font-size:22px;text-anchor:middle;dominant-baseline:central;alignment-baseline:central;text-rendering:geometricPrecision;user-select:none;pointer-events:none}.color-wheel-title{margin:0 0 2px;font-size:17px;font-weight:600;letter-spacing:-.1px;text-align:center}.cw-caption{text-align:center}.cw-caption p{font-size:14px;color:#666;margin:8px 0 0}.feature-section{display:flex;align-items:center;gap:3.5rem;max-width:960px;margin:0 auto;padding:48px 24px}.feature-section.reverse{flex-direction:row-reverse}.feature-text{flex:1}.feature-demo{flex-shrink:0}@media (max-width: 820px){.feature-section,.feature-section.reverse{flex-direction:column;align-items:center;gap:0;padding:40px 20px}.feature-text{order:-1}}.feature-bg-section{background:hsl(var(--section-hue, 0deg),var(--bg-sat),var(--bg-l))}.features-header{padding:48px 24px 24px;text-align:center;background:hsl(var(--section-hue, 0deg),var(--bg-sat),var(--bg-l))}.footer-link{color:#888;text-decoration:none;font-size:13px;transition:color .2s}.footer-link:hover{color:#ccc}.footer-credit{color:#9ca3af;text-decoration:underline;transition:color .2s}.footer-credit:hover{color:#374151}.landing section{margin-top:0}.landing p{font-weight:400}.landing h1,.landing h2,.landing h3{letter-spacing:normal}:root[data-theme=dark]{--text: rgba(255, 255, 255, .88);--hair: rgba(255, 255, 255, .16);--hairHigh: rgba(255, 255, 255, .3);--bg-sat: 16%;--bg-l: 12%}:root[data-theme=dark] .landing{background:var(--bg);color:var(--ink)}:root[data-theme=dark] .landing .bg-white,:root[data-theme=dark] .landing .bg-\[\#FFF9F4\]{background:var(--bg)}:root[data-theme=dark] .landing .text-gray-900{color:var(--ink)}:root[data-theme=dark] .landing .text-gray-600,:root[data-theme=dark] .landing .text-gray-500{color:var(--muted)}:root[data-theme=dark] .landing .color-wheel-title{color:var(--ink)}:root[data-theme=dark] .landing .cw-caption p{color:var(--faint)}:root[data-theme=dark] .landing .hero-cta--secondary{background:var(--surface);color:var(--ink);border-color:var(--line);box-shadow:0 8px 18px #00000080}:root[data-theme=dark] .landing .hero-cta--secondary:hover{background:var(--surface-hover);color:var(--ink);border-color:var(--hairHigh)}:root[data-theme=dark] .landing .sim-reset:hover,:root[data-theme=dark] .landing .theme-toggle:hover,:root[data-theme=dark] .landing .key-picker-trigger:hover,:root[data-theme=dark] .landing .instrument-picker-trigger:hover,:root[data-theme=dark] .landing .instrument-picker-option:hover,:root[data-theme=dark] .landing .instrument-picker[data-open=true] .instrument-picker-trigger,:root[data-theme=dark] .landing .instrument-picker-option[aria-selected=true]{background:var(--surface-hover)}.dl-badge{display:inline-block}.dl-badge-dark{display:none}:root[data-theme=dark] .dl-badge-light{display:none}:root[data-theme=dark] .dl-badge-dark{display:inline-block}.explore-cta[data-astro-cid-j7pv25f6]{background:var(--panel);padding:72px 24px}.explore-inner[data-astro-cid-j7pv25f6]{max-width:62rem;margin:0 auto}.explore-head[data-astro-cid-j7pv25f6]{text-align:center;max-width:42rem;margin:0 auto 40px}.explore-head[data-astro-cid-j7pv25f6] h2[data-astro-cid-j7pv25f6]{font-size:clamp(2rem,5vw,2.75rem);font-weight:700;color:var(--ink);margin:0 0 14px;line-height:1.1}.explore-head[data-astro-cid-j7pv25f6] p[data-astro-cid-j7pv25f6]{color:var(--muted);font-size:1.125rem;line-height:1.6;margin:0}.explore-grid[data-astro-cid-j7pv25f6]{display:grid;grid-template-columns:1fr 1fr;gap:20px}.explore-card[data-astro-cid-j7pv25f6]{display:flex;flex-direction:column;align-items:flex-start;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:30px;text-decoration:none;box-shadow:0 2px 12px #0000000d;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.explore-card[data-astro-cid-j7pv25f6]:hover{transform:translateY(-3px);box-shadow:0 16px 36px #0000001a;border-color:var(--muted)}.explore-eyebrow[data-astro-cid-j7pv25f6]{font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}.explore-card[data-astro-cid-j7pv25f6] h3[data-astro-cid-j7pv25f6]{font-size:1.6rem;font-weight:700;color:var(--ink);margin:0;line-height:1.15}.explore-card[data-astro-cid-j7pv25f6] p[data-astro-cid-j7pv25f6]{color:var(--muted);font-size:1rem;line-height:1.6;margin:0}.explore-go[data-astro-cid-j7pv25f6]{margin-top:6px;font-weight:700;color:var(--ink);font-size:1.02rem}.explore-go[data-astro-cid-j7pv25f6] span[data-astro-cid-j7pv25f6]{display:inline-block;transition:transform .15s ease}.explore-card[data-astro-cid-j7pv25f6]:hover .explore-go[data-astro-cid-j7pv25f6] span[data-astro-cid-j7pv25f6]{transform:translate(4px)}@media (max-width: 640px){.explore-grid[data-astro-cid-j7pv25f6]{grid-template-columns:1fr}.explore-cta[data-astro-cid-j7pv25f6]{padding:56px 20px}}@font-face{font-family:Inter;font-style:normal;font-weight:500 600;font-display:swap;src:url(/fonts/inter-latin-var.woff2) format("woff2")}@font-face{font-family:Caveat;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/caveat-latin-700.woff2) format("woff2")}