.callout[data-v-1e9f0551]{--tone:var(--hd-accent);gap:var(--hd-space-3);padding:var(--hd-space-4) var(--hd-space-5);border:1px solid color-mix(in oklab, var(--tone) 35%, var(--hd-border));border-radius:var(--hd-radius-md);background:color-mix(in oklab, var(--tone) 7%, transparent);font-size:var(--hd-text-sm);grid-template-columns:18px minmax(0,1fr);margin:0 0 1.2em;line-height:1.6;display:grid}.tip[data-v-1e9f0551]{--tone:var(--hd-good)}.warning[data-v-1e9f0551]{--tone:var(--hd-warn)}.pro[data-v-1e9f0551]{--tone:var(--hd-lit)}.icon[data-v-1e9f0551]{color:var(--tone);margin-top:3px}.title[data-v-1e9f0551]{margin:0 0 var(--hd-space-1);font-weight:600}.text[data-v-1e9f0551] p{margin:0 0 .6em}.text[data-v-1e9f0551]>:last-child{margin-bottom:0}.hd-segmented[data-v-bae0b219]{border-radius:var(--hd-radius-pill);background:var(--hd-track);gap:2px;padding:3px;display:flex}.item[data-v-bae0b219]{all:unset;border-radius:var(--hd-radius-pill);font:500 var(--hd-text-xs) var(--hd-font-ui);text-align:center;color:var(--hd-text-muted);cursor:pointer;white-space:nowrap;transition:background-color var(--hd-motion-fast) var(--hd-ease-out), color var(--hd-motion-fast) var(--hd-ease-out);flex:1;padding:6px 10px}.item.with-icon[data-v-bae0b219]{justify-content:center;align-items:center;gap:6px;display:inline-flex}.item[data-v-bae0b219]:hover{color:var(--hd-text)}.item[data-state=on][data-v-bae0b219]{background:var(--hd-surface-raised);color:var(--hd-text);box-shadow:0 1px 3px #00000040}.item[data-v-bae0b219]:focus-visible{outline:2px solid var(--hd-focus);outline-offset:1px}.live-example[data-v-5642cabf]{border:1px solid var(--hd-border);border-radius:var(--hd-radius-lg);background:color-mix(in oklab, var(--hd-canvas), var(--hd-surface) 40%);grid-template-columns:minmax(0,1fr);margin:0 0 1.6em;display:grid;overflow:hidden}.stage[data-v-5642cabf]{border-bottom:1px solid var(--hd-border);min-width:0;position:relative}.stage[data-v-5642cabf]>.hd-theme{min-height:260px;display:grid}.canvas[data-v-5642cabf]{padding:var(--hd-space-8) var(--hd-space-6) 64px;place-items:center;display:grid;overflow:hidden}.tile[data-v-5642cabf]{max-width:100%;display:grid}.tile[data-v-5642cabf]>*{min-height:0}.waiting[data-v-5642cabf]{border-radius:var(--hd-radius-lg);border:var(--hd-border-width) solid var(--hd-border);background:var(--hd-surface-fill);opacity:.6}.controls[data-v-5642cabf]{inset:auto var(--hd-space-3) var(--hd-space-3);justify-content:space-between;align-items:center;gap:var(--hd-space-2);pointer-events:none;flex-wrap:wrap;display:flex;position:absolute}.controls[data-v-5642cabf]>*{pointer-events:auto}.theme[data-v-5642cabf]{height:30px;padding:0 var(--hd-space-2);border:1px solid var(--hd-border);border-radius:var(--hd-radius-sm);background:var(--hd-surface-fill);color:var(--hd-text);font:var(--hd-text-xs) var(--hd-font-ui)}.code[data-v-5642cabf]{grid-template-rows:auto minmax(0,1fr) auto;min-width:0;display:grid}.bar[data-v-5642cabf]{align-items:center;gap:var(--hd-space-3);padding:var(--hd-space-2) var(--hd-space-3);border-bottom:1px solid var(--hd-border);display:flex}.title[data-v-5642cabf]{font:500 var(--hd-text-xs) var(--hd-font-mono);color:var(--hd-text-muted)}.spacer[data-v-5642cabf]{flex:1}.action[data-v-5642cabf]{height:28px;padding:0 var(--hd-space-3);border:1px solid var(--hd-border);border-radius:var(--hd-radius-sm);color:var(--hd-text-muted);font:500 var(--hd-text-xs) var(--hd-font-ui);cursor:pointer;background:0 0;align-items:center;gap:5px;display:inline-flex}.action[data-v-5642cabf]:hover{color:var(--hd-text)}.edit[data-v-5642cabf]{border-color:color-mix(in oklab, var(--hd-accent) 50%, var(--hd-border));color:var(--hd-accent)}.read[data-v-5642cabf],.editor[data-v-5642cabf]{border:0;border-radius:0;min-height:160px;max-height:420px;overflow:auto}.problems[data-v-5642cabf]{gap:var(--hd-space-1);padding:var(--hd-space-3);border-top:1px solid var(--hd-border);font-size:var(--hd-text-xs);margin:0;list-style:none;display:grid}.problems li[data-v-5642cabf]{align-items:baseline;gap:var(--hd-space-2);color:var(--hd-text-muted);display:flex}.problems .error[data-v-5642cabf]{color:var(--hd-danger)}@media (width<=520px){.controls[data-v-5642cabf]{padding:var(--hd-space-3);position:static}.canvas[data-v-5642cabf]{padding-bottom:var(--hd-space-6)}}