@media (width>=901px){.studio__stage-body.scroll-fade-x{mask-image:none}main:has(.studio){flex-basis:0;min-height:0}}.studio{--studio-rail:18rem;--studio-rail-collapsed:3.25rem;grid-template-columns:var(--studio-rail) minmax(0, 1fr);background:var(--surface-canvas);min-height:0;color:var(--text-body);flex:1 1 0;display:grid;overflow:hidden}.studio.is-collapsed{grid-template-columns:var(--studio-rail-collapsed) minmax(0, 1fr)}.studio__rail{border-right:1px solid var(--vs-line);background:var(--surface-sunken);grid-template-rows:auto minmax(0,1fr) auto;min-width:0;min-height:0;display:grid}.studio__rail-head{border-bottom:1px solid var(--vs-line);justify-content:space-between;align-items:center;gap:8px;min-height:3.5rem;padding:0 10px 0 14px;display:flex}.studio.is-collapsed .studio__rail-head{justify-content:center;padding:0}.studio__title{gap:1px;display:grid}.studio__title h1{color:var(--text-heading);font-family:var(--font-heading);letter-spacing:-.01em;margin:0;font-size:15px;font-weight:600}.studio__title span{color:var(--text-muted);font-family:var(--font-mono,ui-monospace, monospace);font-variant-numeric:tabular-nums;font-size:11px}.studio__icon-button{border-radius:var(--radius-control);width:30px;height:30px;color:var(--text-muted);cursor:pointer;background:0 0;border:1px solid #0000;flex-shrink:0;place-items:center;display:grid}.studio__icon-button:hover{border-color:var(--vs-line-strong);color:var(--text-heading)}.studio__rail-body{overscroll-behavior:contain;min-height:0;overflow:auto}.studio__rail-foot{border-top:1px solid var(--vs-line);background:var(--surface-sunken);gap:6px;padding:10px;display:grid}.studio__group{border-bottom:1px solid var(--vs-line)}.studio__group-head{justify-content:space-between;align-items:baseline;gap:8px;padding:12px 14px 6px;display:flex}.studio__group-head h2{color:var(--text-heading);font-family:var(--font-heading);margin:0;font-size:12.5px;font-weight:600}.studio__group-count{color:var(--accent);font-family:var(--font-mono,ui-monospace, monospace);font-variant-numeric:tabular-nums;font-size:11px}.studio__rows{flex-direction:column;padding:0 14px 12px;display:flex}.studio__row{justify-content:space-between;align-items:center;gap:10px;min-height:2.1rem;padding:3px 0;display:flex}.studio__row--stacked{justify-items:start;gap:3px;display:grid}.studio__row-label{min-width:0;color:var(--text-body);text-align:left;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;overflow:hidden}button.studio__row-label{border-radius:var(--radius-control);cursor:help;background:0 0;border:0}button.studio__row-label:hover,button.studio__row-label:focus-visible{color:var(--text-heading);text-underline-offset:3px;text-decoration:underline dotted}.studio__row--stacked .studio__row-label{color:var(--text-muted);font-family:var(--font-mono,ui-monospace, monospace);font-size:11px}.studio__field{border:1px solid var(--vs-line-strong);border-radius:var(--radius-control);background:var(--surface-card);min-width:0;color:var(--text-heading);padding:4px 7px;font-size:12px}.studio__control{min-width:0}.studio__row--stacked .studio__control{width:100%}.studio__swatch-pair{align-items:center;gap:6px;display:flex}.studio__swatch{border:1px solid var(--vs-line-strong);border-radius:var(--radius-control);background:var(--surface-card);cursor:pointer;flex-shrink:0;width:30px;height:26px;padding:2px}.studio__hex{width:6.6rem;font-family:var(--font-mono,ui-monospace, monospace);font-size:12px}.studio__slider{align-items:center;gap:8px;display:flex}.studio__slider input{width:6rem;accent-color:var(--accent)}.studio__readout{width:3.2rem;color:var(--text-muted);font-family:var(--font-mono,ui-monospace, monospace);font-variant-numeric:tabular-nums;text-align:right;font-size:11px}.studio__contrast{border-radius:var(--radius-control);background:var(--tint-warning,transparent);gap:2px;margin:-2px 0 7px;padding:5px 8px;display:grid}.studio__contrast-item{color:var(--text-warning);font-family:var(--font-mono,ui-monospace, monospace);font-variant-numeric:tabular-nums;align-items:center;gap:5px;font-size:11px;display:inline-flex}.studio__contrast-item svg{flex-shrink:0}.studio__advanced{border-bottom:1px solid var(--vs-line)}.studio__advanced>summary{color:var(--text-heading);font-family:var(--font-heading);cursor:pointer;justify-content:space-between;align-items:center;padding:11px 14px;font-size:12.5px;font-weight:600;list-style:none;display:flex}.studio__advanced>summary::-webkit-details-marker{display:none}.studio__advanced-count{color:var(--text-muted);font-family:var(--font-mono,ui-monospace, monospace);font-variant-numeric:tabular-nums;font-size:11px}.studio__advanced-body{gap:12px;padding:0 14px 14px;display:grid}.studio__filter{border:1px solid var(--vs-line-strong);border-radius:var(--radius-control);background:var(--surface-card);width:100%;color:var(--text-heading);font-family:var(--font-mono,ui-monospace, monospace);padding:5px 8px;font-size:12px}.studio__advanced-group{gap:5px;display:grid}.studio__advanced-group>h3{color:var(--text-muted);font-family:var(--font-heading);margin:0;font-size:12.5px;font-weight:600}.studio__empty{color:var(--text-muted);margin:0;font-size:12px}.studio__stage{background:var(--surface-canvas);grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:0;display:grid;container:studio-stage/inline-size}.studio__stage-head{border-bottom:1px solid var(--vs-line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;min-height:3.5rem;padding:8px 18px;display:flex}.studio__specimens{border:1px solid var(--vs-line);border-radius:var(--radius-control);background:var(--surface-sunken);gap:2px;padding:2px;display:flex}.studio__specimen-tab{border-radius:var(--radius-control);color:var(--text-muted);cursor:pointer;background:0 0;border:0;padding:5px 11px;font-size:12.5px}.studio__specimen-tab:hover{color:var(--text-heading)}.studio__specimen-tab[aria-selected=true]{background:var(--surface-card);color:var(--text-heading);font-weight:600}.studio__stage-state{color:var(--text-muted);align-items:center;gap:10px;font-size:12px;display:flex}.studio__stage-theme{color:var(--text-heading);font-family:var(--font-mono,ui-monospace, monospace);font-size:11px}.studio__stage-body{min-height:0;overflow:auto}[data-create-preview]{grid-template-columns:repeat(12,minmax(0,1fr))}[data-create-preview]>*{grid-column:span 12;min-width:0}[data-create-preview] .vs-slider{width:100%;max-width:340px}@container studio-stage (width>=640px){[data-create-preview] .md\:col-span-6{grid-column:span 6}[data-create-preview] .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@container studio-stage (width>=960px){[data-create-preview] .lg\:col-span-7{grid-column:span 7}[data-create-preview] .lg\:col-span-5{grid-column:span 5}[data-create-preview] .lg\:col-span-4{grid-column:span 4}}.studio__stage [data-token-scope]{outline-offset:2px;outline:0 solid #0000}.studio.is-marking .studio__stage [data-token-scope]{opacity:.45;transition:opacity .16s cubic-bezier(.16,1,.3,1)}.studio.is-marking .studio__stage [data-token-scope].is-marked{opacity:1;outline:2px solid var(--accent)}.studio.is-marking .studio__stage [data-token-scope].is-mark-ancestor{opacity:1}@media (prefers-reduced-motion:reduce){.studio.is-marking .studio__stage [data-token-scope]{transition:none}}.studio__reading{--reading-measure:65ch;--reading-leading:1.6;--reading-flow:1.5rem;width:min(var(--reading-measure), calc(100% - 3.5rem));font-family:var(--font-sans);line-height:var(--reading-leading);margin-inline:auto;padding-block:3.25rem 5rem}.studio__reading h3,.studio__reading h4{color:var(--text-heading);font-family:var(--font-heading);text-wrap:balance}.studio__reading h3{letter-spacing:-.04em;max-width:16ch;margin:.6rem 0 1.4rem;font-size:clamp(2rem,4vw,3.1rem);font-weight:650;line-height:1.02}.studio__reading h4{letter-spacing:-.025em;margin:2.6rem 0 .8rem;font-size:1.45rem;font-weight:650;line-height:1.1}.studio__reading p,.studio__reading ul,.studio__reading ol{margin-block:0 var(--reading-flow);text-wrap:pretty}.studio__reading .studio__reading-lede{color:var(--text-heading);font-size:1.08em}.studio__reading strong{color:var(--text-heading);font-weight:650}.studio__reading a{color:var(--text-heading);text-decoration-color:var(--text-muted);text-underline-offset:.2em}.studio__reading code{border:1px solid var(--vs-line);border-radius:var(--radius-control);background:var(--surface-card);color:var(--text-heading);font-family:var(--font-mono,ui-monospace, monospace);padding:.12em .3em;font-size:.9em}.studio__reading li+li{margin-top:.65rem}.studio__reading pre{border:1px solid var(--vs-line-strong);border-radius:var(--radius-card);background:var(--surface-card);color:var(--text-heading);font-family:var(--font-mono,ui-monospace, monospace);margin:2rem 0 0;padding:1rem 1.15rem;font-size:.75rem;line-height:1.7;overflow:auto}.studio__reading pre code{font-size:inherit;background:0 0;border:0;padding:0}.studio__specimen-head{z-index:1;border-bottom:1px solid var(--vs-line);background:var(--surface-canvas);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:10px 18px;display:flex;position:sticky;top:0}.studio__view-controls{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.studio__view-controls>*{min-width:0}.studio__view-note{color:var(--text-muted);font-size:11px}.studio__export-tabs{border:1px solid var(--vs-line);border-radius:var(--radius-control);background:var(--surface-sunken);gap:2px;margin-bottom:12px;padding:2px;display:flex}.studio__export-tabs button{border-radius:var(--radius-control);color:var(--text-muted);cursor:pointer;background:0 0;border:0;padding:5px 12px;font-size:12.5px}.studio__export-tabs button[aria-selected=true]{background:var(--surface-card);color:var(--text-heading);font-weight:600}.studio__export-panel pre,.studio__export-panel code{white-space:pre-wrap;overflow-wrap:anywhere}.studio__export-note--after{margin:12px 0 0}.studio__export-note code{color:var(--text-heading);font-family:var(--font-mono,ui-monospace, monospace);font-size:.92em}.studio__export-note{color:var(--text-muted);margin:0 0 12px;font-size:12.5px;line-height:1.5}.studio__prompt{border:1px solid var(--vs-line-strong);border-radius:var(--radius-card);background:var(--surface-sunken);max-height:22rem;color:var(--text-body);font-family:var(--font-mono,ui-monospace, monospace);white-space:pre-wrap;margin:0;padding:14px 16px;font-size:12px;line-height:1.65;overflow:auto}@media (pointer:coarse){.studio__icon-button,.studio__specimen-tab,.studio__field,.studio__filter{min-height:44px}.studio__swatch{height:44px}}@media (width<=900px){.studio,.studio.is-collapsed{grid-template-columns:minmax(0,1fr);min-height:auto;overflow:visible}.studio__rail{border-right:0;border-bottom:1px solid var(--vs-line);grid-template-rows:auto auto auto}.studio__rail-body{overflow:visible}.studio.is-collapsed .studio__rail-head{justify-content:space-between;padding:0 10px 0 14px}.studio__stage-body{overflow:auto visible}.studio__stage,.studio__stage-head{min-width:0;max-width:100%}.studio__reading{width:calc(100% - 2rem);padding-block:2.25rem 3rem}.studio__reading h3{font-size:2.15rem}}.studio.is-collapsed .studio__rail-body{display:none}@media (width>=901px){.studio.is-collapsed .studio__rail-foot,.studio.is-collapsed .studio__title{display:none}}@media (width<=900px){.studio__rail-head{position:relative}.studio__icon-button:after{content:"";position:absolute;inset:0}.studio__icon-button{border-color:var(--vs-line-strong);background:var(--surface-card);width:44px;min-height:44px;color:var(--text-body)}.studio__rail-head:active .studio__icon-button{background:var(--surface-sunken)}.studio__icon-button .studio__icon--panel{display:none}}@media (width>=901px){.studio__icon-button .studio__icon--chevron{display:none}}.studio__icon--chevron{transition:rotate .14s var(--ease-out,ease)}.studio:not(.is-collapsed) .studio__icon--chevron{rotate:180deg}@media (prefers-reduced-motion:reduce){.studio__icon--chevron{transition:none}}@media (pointer:coarse){.studio__icon-button{min-width:44px}}