.demo-header-actions[data-v-ded322aa]{align-items:center;gap:4px;display:flex}.demo-header-actions .demo-header-action[data-v-ded322aa]{width:36px;min-width:36px;height:36px;min-height:36px;color:var(--foundation-subject-ink,oklch(44% .04 255));cursor:pointer;background:0 0;border:1px solid #0000;border-radius:7px;flex:none;place-items:center;padding:0;display:grid}.demo-header-actions .demo-header-action[data-v-ded322aa]:hover{background:var(--foundation-subject-soft,oklch(96% .01 255));border-color:var(--foundation-subject-line,oklch(82% .02 255))}.demo-header-action[data-v-ded322aa]:disabled{cursor:default;opacity:.5}.demo-header-action[data-v-ded322aa]:focus-visible{outline-offset:2px;outline:2px solid}.demo-help-popup[data-v-ded322aa]{box-sizing:border-box;border:1px solid var(--foundation-subject-line,oklch(82% .02 255));background:var(--foundation-subject-surface,oklch(99% .003 255));width:min(320px,100vw - 24px);max-height:calc(100dvh - 24px);color:var(--foundation-subject-ink,oklch(44% .04 255));font:inherit;border-radius:10px;margin:0;padding:16px;font-size:13px;line-height:1.7;position:fixed;inset:auto;overflow:auto;box-shadow:0 3px 8px oklch(25% .02 255/.08),0 12px 32px oklch(25% .02 255/.12)}.demo-help-popup p[data-v-ded322aa]{margin:8px 0 0}.demo-help-popup ol[data-v-ded322aa]{gap:8px;margin:12px 0 0;padding-left:20px;display:grid}@media (width<=640px){.demo-header-actions .demo-header-action[data-v-ded322aa]{width:44px;min-width:44px;height:44px;min-height:44px}}.interaction-workshop{--iw-ink:oklch(32% .025 260);--iw-muted:oklch(46% .025 260);--iw-line:oklch(82% .018 260);--iw-accent:oklch(48% .17 36);--iw-soft:oklch(96% .022 36);color:var(--iw-ink);min-width:0;font-size:14px;line-height:1.7}.interaction-workshop *,.iw-dialog *{box-sizing:border-box}.interaction-workshop :is(button,input,select,textarea),.iw-dialog :is(button,input,textarea){font:inherit;color:inherit}.interaction-workshop :is(button,select,input:not([type=checkbox]):not([type=range])),.iw-dialog :is(button,input){border:1px solid var(--iw-line,oklch(82% .018 260));background:oklch(99% .003 260);border-radius:6px;min-height:44px;padding:8px 12px}.interaction-workshop button,.iw-dialog button{cursor:pointer;touch-action:manipulation}.interaction-workshop button:hover:not(:disabled),.iw-dialog button:hover:not(:disabled){background:oklch(95% .014 260)}.interaction-workshop :is(button,input,select,textarea,a,[tabindex]):focus-visible,.iw-dialog :focus-visible{outline-offset:3px;outline:2px solid oklch(48% .17 36)}.interaction-workshop button:disabled,.iw-dialog button:disabled{opacity:.5;cursor:default}.interaction-workshop .iw-primary,.interaction-workshop button[aria-pressed=true],.interaction-workshop button[aria-selected=true],.interaction-workshop button[data-pressed=true]{border-color:var(--iw-accent);background:var(--iw-soft);color:var(--iw-accent)}.interaction-workshop :is(input:not([type=checkbox]),textarea,select){min-width:0;max-width:100%;font-size:16px}.interaction-workshop textarea,.iw-dialog textarea{resize:vertical;background:oklch(99% .003 260);border:1px solid oklch(82% .018 260);border-radius:6px;width:100%;min-height:88px;padding:10px;display:block}.interaction-workshop label{flex-wrap:wrap;align-items:center;gap:8px;min-height:44px;display:flex}.interaction-workshop input[type=checkbox]{width:18px;height:18px;accent-color:var(--iw-accent)}.iw-actions{flex-wrap:wrap;align-items:center;gap:8px;margin-block:12px;display:flex}.iw-stack{gap:12px;display:grid}.iw-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.iw-box{border:1px solid var(--iw-line);background:oklch(98% .004 260);border-radius:8px;min-width:0;padding:16px}.interaction-workshop small,.iw-note{color:var(--iw-muted);overflow-wrap:anywhere;font-size:13px}.iw-status{overflow-wrap:anywhere;background:oklch(95% .01 260);border-radius:6px;min-height:28px;margin:16px 0 0;padding:10px 12px}.iw-error{color:oklch(44% .17 27)}.iw-list{margin:0;padding:0;list-style:none}.iw-list>li{border-bottom:1px solid var(--iw-line);padding-block:8px}.iw-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.iw-scroll{scrollbar-gutter:stable;border:1px solid var(--iw-line);border-radius:6px;max-height:260px;padding:12px;overflow:auto}.iw-dialog{color:oklch(32% .025 260);width:min(440px,100vw - 32px);max-height:calc(100dvh - 48px);font:inherit;background:oklch(99% .003 260);border:1px solid oklch(82% .018 260);border-radius:10px;padding:24px;overflow:auto}.iw-dialog::backdrop{background:oklch(18% .02 260/.4)}.iw-dialog h4{margin-top:0}.iw-stage{border:1px solid var(--iw-line);border-radius:8px;min-height:180px;padding:16px;position:relative;overflow:hidden}.iw-stage svg{width:100%;height:auto;color:var(--iw-accent);display:block}.iw-stage svg text{fill:var(--iw-ink);font-family:inherit;font-size:16px}.iw-preview{white-space:pre-wrap;overflow-wrap:anywhere}.interaction-workshop p{margin-block:8px 12px}.interaction-workshop h4{margin-block:4px 12px;font-size:16px}.interaction-workshop a{color:var(--iw-accent);text-underline-offset:3px}@media (width<=640px){.iw-columns{grid-template-columns:minmax(0,1fr)}.iw-box{padding:12px}.interaction-workshop :is(input:not([type=checkbox]),select){width:100%}.iw-actions label{flex:180px}.iw-stage{padding:12px}}@media (prefers-reduced-motion:reduce){.interaction-workshop *,.iw-dialog *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.iw-workbench{border:1px solid var(--foundation-subject-line,var(--iw-line));background:var(--foundation-subject-surface,oklch(99% .003 260));border-radius:14px;width:min(100%,720px);margin-inline:auto}.iw-demo-layout{min-width:0}.iw-subject{background:var(--foundation-subject-surface,oklch(99% .003 260));border-radius:14px 14px 0 0;align-content:start;gap:16px;min-width:0;min-height:280px;padding:28px;display:grid}.iw-subject>:not(dialog){width:100%;min-width:0;max-width:600px;margin-inline:auto}.iw-subject>:is(p,.iw-actions){margin-block:0}.iw-subject>form{gap:16px;display:grid}.iw-subject>.iw-columns{max-width:none}.iw-subject audio{max-width:100%}.iw-controls{border-top:2px solid var(--foundation-subject-line,var(--iw-line));background:var(--foundation-subject-soft,oklch(96% .01 260));padding:16px 20px 20px}.interaction-workshop .iw-region-label{color:var(--iw-muted);margin:0 0 12px;font-size:12px;font-weight:650}.iw-control-fields{flex-wrap:wrap;align-items:flex-start;gap:12px 20px;display:flex}.iw-control-fields>label{flex:200px}.iw-control-fields>:is(p,.iw-note,.iw-actions,.iw-control-group,.iw-box){flex-basis:100%;margin:0}.iw-control-fields .iw-actions{margin-block:0}.iw-controls :is(button,label,input,select){font-size:13px}.iw-controls :is(input:not([type=checkbox]):not([type=range]),select){font-size:16px}.iw-controls input[type=checkbox]{flex:none}.iw-controls :is(input:not([type=checkbox]):not([type=range]),select){width:min(100%,240px)}.iw-workbench .iw-status{border-top:1px solid var(--foundation-subject-line,var(--iw-line));background:var(--foundation-subject-soft,oklch(96% .01 260));border-radius:0;margin:0;padding:12px 20px}@media (width<=640px){.iw-subject{min-height:240px;padding:16px}.iw-controls{padding:14px}.iw-control-fields{gap:12px}.iw-controls :is(input:not([type=checkbox]):not([type=range]),select){width:100%}.iw-workbench .iw-status{padding-inline:14px}}
