.sg-stage{--sg-tint:color-mix(in srgb, var(--accent-a) 26%, transparent);--sg-lit:color-mix(in srgb, var(--accent-a) 62%, transparent);min-height:clamp(220px,34vh,300px);overflow:hidden}.sg-scene{zoom:1.15;justify-items:center;max-width:100%;display:grid}@media (width>=640px){.sg-scene{zoom:1.6}}.sg-pad{background:linear-gradient(var(--surface-3), var(--surface-3)) content-box, var(--sg-tint) padding-box;box-shadow:inset 0 0 0 1px var(--border-strong);border-radius:12px;transition:padding .12s ease-out}.sg-gap{background:repeating-linear-gradient(135deg, var(--sg-tint) 0 4px, transparent 4px 8px);box-shadow:inset 0 0 0 1px var(--sg-tint);flex:none;transition:width .12s ease-out,height .12s ease-out;display:block}.sg-gap-v{width:100%;min-width:24px}.sg-gap-h{align-self:center;height:20px}.sg-stage[data-part=a] .sg-pad.sg-a{background:linear-gradient(var(--surface-3), var(--surface-3)) content-box, var(--sg-lit) padding-box}.sg-stage[data-part=b] .sg-gap.sg-b,.sg-stage[data-part=c] .sg-gap.sg-c{background:repeating-linear-gradient(135deg, var(--sg-lit) 0 4px, transparent 4px 8px);box-shadow:inset 0 0 0 1px var(--accent-a)}.sg-row,.sg-card,.sg-listrow,.sg-toast,.sg-btn{color:var(--text);align-items:center;font-size:14px;display:flex}.sg-row{align-items:center}.sg-btn{border-radius:12px;font-weight:600}.sg-btn-main{color:#fff}.sg-btn-main.sg-pad{background:linear-gradient(var(--accent-a), var(--accent-a)) content-box, var(--sg-tint) padding-box}.sg-stage[data-part=a] .sg-btn-main.sg-pad{background:linear-gradient(var(--accent-a), var(--accent-a)) content-box, var(--sg-lit) padding-box}.sg-btn-sm{background:var(--accent-a);padding:8px 16px;display:inline-flex}.sg-ico{opacity:.85;background:currentColor;border-radius:5px;flex:none;width:16px;height:16px}.sg-card{flex-direction:column;align-items:flex-start;width:min(280px,100%)}.sg-title{font-family:var(--font-display);font-size:24px;font-weight:300;line-height:1.1}.sg-text{color:var(--muted);font-size:14px;line-height:1.4}.sg-listrow{width:min(300px,100%)}.sg-avatar{background:var(--accent-grad-linear);border-radius:50%;flex:none;width:40px;height:40px}.sg-stack{flex-direction:column;display:flex}.sg-toast{width:min(340px,100%)}.sg-toast .sg-ico{color:var(--pass)}.sg-undo{color:var(--accent-a)}.sg-fieldwrap{flex-direction:column;width:min(280px,100%);font-size:14px;display:flex}.sg-input{background:linear-gradient(var(--surface), var(--surface)) content-box, var(--sg-tint) padding-box}.sg-help{color:var(--muted);font-size:12px}.sg-label{font-size:13px}.sg-panel{gap:12px;display:grid}.sg-parts{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.sg-part{text-align:left;cursor:pointer;min-height:64px;color:var(--text);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border);font:inherit;border:0;border-radius:16px;justify-items:start;gap:4px;padding:12px;display:grid}.sg-part[aria-pressed=true]{box-shadow:inset 0 0 0 2px var(--accent-a);background:var(--surface-3)}.sg-part:focus-visible,.sg-chip:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.sg-val{font-size:15px;font-weight:600}.sg-chips{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.sg-chip{cursor:pointer;min-width:44px;min-height:44px;color:var(--text);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border);font:600 15px/1 var(--font-mono);touch-action:manipulation;border:0;border-radius:12px;transition:transform .12s ease-out}.sg-chip:hover{transform:translateY(-1px)}.sg-chip[aria-pressed=true]{background:var(--accent-a);color:#fff;box-shadow:none}.sg-lines{gap:4px;margin:0;padding:0;list-style:none;display:grid}.sg-lines li{justify-content:space-between;gap:12px;font-size:13px;display:flex}.sg-demo{gap:8px;width:120px;display:grid}.sg-demo span{background:var(--accent-grad-linear);transform-origin:0;border-radius:8px;height:16px;animation:2.4s cubic-bezier(.16,1,.3,1) infinite alternate sg-demo;display:block}.sg-demo span:nth-child(2){animation-delay:.15s}.sg-demo span:nth-child(3){animation-delay:.3s}@keyframes sg-demo{0%{transform:scaleX(.55)}to{transform:scaleX(1)}}@media (prefers-reduced-motion:reduce){.sg-demo span{animation:none}.sg-pad,.sg-gap,.sg-chip{transition:none}}
