.beam-host{place-items:center;max-width:100%;display:grid}.beam-host--wide{width:min(290px,100% - 24px)}.beam-host--card{width:min(340px,100% - 24px)}.beam-host--preview{width:min(440px,100% - 32px)}.variant-host{max-width:100%}.variant-host--card{width:100%}[data-beam-bloom]{pointer-events:none}.inset-specimen{box-shadow:inset 0 0 0 var(--specimen-inset) var(--surface), inset 0 0 0 calc(var(--specimen-inset) + 1px) var(--line)}.astro-beam-button{border:1px solid var(--line);background:var(--surface-raised);min-height:44px;color:var(--text);border-radius:13px;padding:0 18px}.beam-ui-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.beam-ui-example{border:1px solid var(--line);background:color-mix(in srgb, var(--surface) 88%, transparent);border-radius:16px;min-width:0;padding:16px}.beam-ui-caption{color:var(--text);justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;font-size:.75rem;font-weight:580;display:flex}.beam-ui-caption small{color:var(--muted);font:.64rem var(--font-mono);font-weight:450}.beam-ui-control{border:1px solid var(--line);background:var(--surface-raised);min-height:44px;color:var(--text);border-radius:12px;align-items:center;gap:10px;padding:0 12px;transition:border-color .16s,background-color .16s,box-shadow .16s,transform .1s;display:flex}.beam-ui-control:hover{border-color:color-mix(in srgb, var(--text) 20%, var(--line));background:color-mix(in srgb, var(--surface-raised) 92%, var(--accent))}.beam-ui-control:focus-within{border-color:color-mix(in srgb, var(--accent) 58%, var(--line));box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 13%, transparent)}.beam-ui-control:active{transform:translateY(1px)}.beam-ui-control input,.beam-ui-control select,.beam-ui-control textarea{width:100%;min-width:0;color:var(--text);font:inherit;background:0 0;border:0;outline:0}.beam-ui-control input::placeholder,.beam-ui-control textarea::placeholder{color:var(--muted)}.beam-ui-input>svg,.beam-ui-select>svg{fill:none;width:16px;stroke:var(--muted);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;flex:0 0 16px}.beam-ui-input kbd{border:1px solid var(--line);background:var(--surface);color:var(--muted);font:.62rem var(--font-mono);border-radius:6px;flex:none;padding:2px 6px}.beam-ui-select select{appearance:none;cursor:pointer}.beam-ui-select select option{background:var(--surface)}.beam-ui-status-dot{background:var(--accent);width:7px;height:7px;box-shadow:0 0 10px color-mix(in srgb, var(--accent) 65%, transparent);border-radius:50%;flex:0 0 7px}.beam-ui-inline{justify-content:space-between;align-items:center;gap:16px;min-height:44px;display:flex}.beam-ui-inline>div{gap:3px;min-width:0;display:grid}.beam-ui-inline strong{color:var(--text);font-size:.78rem;font-weight:560}.beam-ui-inline>div>span{color:var(--muted);font-size:.68rem}.beam-ui-switch{border:1px solid var(--line);background:var(--surface-raised);cursor:pointer;border-radius:999px;flex:0 0 44px;width:44px;height:26px;padding:3px;transition:border-color .16s,background-color .16s}.beam-ui-switch>span{background:var(--muted);width:18px;height:18px;box-shadow:0 1px 4px color-mix(in srgb, var(--page) 55%, transparent);border-radius:50%;transition:transform .18s cubic-bezier(.2,.8,.2,1),background-color .16s;display:block}.beam-ui-switch[aria-checked=true]{border-color:color-mix(in srgb, var(--accent) 55%, var(--line));background:color-mix(in srgb, var(--accent) 30%, var(--surface-raised))}.beam-ui-switch[aria-checked=true]>span{background:var(--text);transform:translate(18px)}.beam-ui-switch:focus-visible,.beam-ui-number button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.beam-ui-slider input{appearance:none;cursor:pointer;background:0 0;height:20px}.beam-ui-slider input::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--accent) 0 var(--range-value), var(--line) var(--range-value) 100%);border-radius:999px;height:4px}.beam-ui-slider input::-webkit-slider-thumb{appearance:none;border:3px solid var(--surface-raised);background:var(--text);width:14px;height:14px;box-shadow:0 0 0 1px var(--accent);border-radius:50%;margin-top:-5px}.beam-ui-slider input::-moz-range-track{background:var(--line);border-radius:999px;height:4px}.beam-ui-slider input::-moz-range-progress{background:var(--accent);border-radius:999px;height:4px}.beam-ui-slider input::-moz-range-thumb{border:3px solid var(--surface-raised);background:var(--text);width:10px;height:10px;box-shadow:0 0 0 1px var(--accent);border-radius:50%}.beam-ui-slider output,.beam-ui-number output{color:var(--muted);font:.67rem var(--font-mono)}.beam-ui-number{justify-content:space-between}.beam-ui-number button{border:1px solid var(--line);background:var(--surface);width:28px;height:28px;color:var(--text);cursor:pointer;border-radius:8px;transition:border-color .14s,background-color .14s,transform .1s}.beam-ui-number button:hover{border-color:color-mix(in srgb, var(--accent) 46%, var(--line));background:color-mix(in srgb, var(--surface) 86%, var(--accent))}.beam-ui-number button:active{transform:scale(.94)}.beam-ui-textarea{align-items:flex-end;min-height:88px;padding-block:11px}.beam-ui-textarea textarea{resize:none;min-height:58px}.beam-ui-textarea>span{color:var(--muted);font:.62rem var(--font-mono);flex:none}@media (prefers-reduced-motion:reduce){.beam-ui-control,.beam-ui-switch,.beam-ui-switch>span,.beam-ui-number button{transition:none}}@media (width<=640px){.beam-ui-grid{grid-template-columns:1fr;padding-inline:16px}}.beam-ui-control:has(:disabled),.beam-ui-switch:disabled{cursor:not-allowed;opacity:.48}.beam-ui-control[data-state=loading]{cursor:progress;opacity:.72}.beam-ui-control[data-state=error]{border-color:var(--danger);box-shadow:0 0 0 3px color-mix(in srgb, var(--danger) 12%, transparent)}.beam-ui-control[data-state=success]{border-color:color-mix(in srgb, var(--accent) 65%, var(--line));box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 11%, transparent)}.vue-beam-demo[data-v-88960b92]{justify-items:center;gap:24px;display:grid}.vue-beam-button[data-v-88960b92]{border:1px solid var(--line);background:var(--surface-raised);min-height:44px;color:var(--text);cursor:pointer;border-radius:13px;padding:0 18px}label[data-v-88960b92]{color:var(--muted);grid-template-columns:auto 120px 36px;align-items:center;gap:10px;font-size:.7rem;display:grid}input[data-v-88960b92]{accent-color:var(--accent)}output[data-v-88960b92]{font-family:ui-monospace,monospace}
