:root{color-scheme:dark;--bg: oklch(11% .005 240);--surface: oklch(15% .005 240);--surface-elevated: oklch(19% .006 240);--surface-overlay: oklch(11% 0 0 / .6);--border: oklch(28% .006 240);--border-strong: oklch(38% .008 240);--text-primary: oklch(98% .003 100);--text-secondary: oklch(70% .008 240);--text-muted: oklch(55% .008 240);--accent: oklch(72% .18 65);--accent-hover: oklch(80% .16 70);--accent-soft: color-mix(in oklch, var(--accent) 20%, var(--bg));--focus-ring: oklch(75% .2 65 / .6);--danger: oklch(70% .2 25);--success: oklch(75% .18 145);--led-red: oklch(65% .24 32);--led-amber: oklch(80% .18 75);--led-jr-orange: oklch(72% .19 55);--led-green: oklch(85% .27 145);--led-blue: oklch(65% .2 245);--led-white: oklch(96% .02 85);--led-cool-white: oklch(96% .005 240);--status-power: oklch(82% .22 145);--status-active: oklch(80% .18 75);--status-warn: oklch(68% .22 25);--status-info: oklch(72% .16 220);--status-off: oklch(20% .005 240);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--space-8: 64px;--space-9: 96px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 16px;--radius-full: 9999px;--font-ui: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic", "Segoe UI", "Inter", system-ui, sans-serif;--font-mono: ui-monospace, "JetBrains Mono", "SF Mono", "Cascadia Code", "Source Han Code JP", Menlo, Consolas, monospace;--font-tech: var(--font-mono);--type-display: clamp(2.5rem, 8vw, 5rem);--type-h1: 1.5rem;--type-h2: 1rem;--type-body: .9375rem;--type-small: .8125rem;--type-micro: .6875rem;--type-nano: .625rem;--tracking-tight: -.01em;--tracking-normal: 0;--tracking-wide: .04em;--tracking-wider: .08em;--tracking-widest: .16em;--shadow-1: 0 1px 2px 0 oklch(0% 0 0 / .3);--shadow-2: 0 4px 8px -2px oklch(0% 0 0 / .4);--shadow-3: 0 12px 24px -6px oklch(0% 0 0 / .5);--shadow-inset: inset 0 1px 2px 0 oklch(0% 0 0 / .2);--ease-standard: cubic-bezier(.32, .72, 0, 1);--ease-emphasized: cubic-bezier(.05, .7, .1, 1);--ease-decelerate: cubic-bezier(0, 0, .2, 1);--dur-instant: 80ms;--dur-fast: .16s;--dur-standard: .24s;--dur-slow: .4s;--bp-sm: 480px;--bp-md: 768px;--bp-lg: 1024px;--bp-xl: 1440px}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;height:100%}body{font-family:var(--font-ui);font-size:var(--type-body);line-height:1.5;color:var(--text-primary);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}img,svg,canvas{display:block;max-width:100%}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;background:none;border:none;padding:0}:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:var(--radius-sm)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.app{display:grid;grid-template-rows:auto 1fr;height:100dvh;background:var(--bg);color:var(--text-primary)}.app-header{display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 var(--space-5);background:linear-gradient(to bottom,color-mix(in oklch,var(--surface-elevated) 90%,transparent),color-mix(in oklch,var(--surface) 60%,transparent));border-bottom:1px solid color-mix(in oklch,var(--border-strong) 70%,transparent);box-shadow:inset 0 1px color-mix(in oklch,var(--text-primary) 6%,transparent),0 1px #0006;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.app-header-brand{display:flex;align-items:center;gap:var(--space-3);min-width:0}.app-header-divider{width:1px;height:36px;background:linear-gradient(to bottom,transparent,color-mix(in oklch,var(--border-strong) 80%,transparent),transparent)}.app-header-title-group{display:flex;flex-direction:column;gap:2px;min-width:0}.app-title{font-family:var(--font-tech);font-size:var(--type-h1);font-weight:700;margin:0;letter-spacing:var(--tracking-wide);color:var(--text-primary);text-shadow:0 0 20px color-mix(in oklch,var(--accent) 30%,transparent)}.app-header-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-family:var(--font-tech);font-size:var(--type-nano);letter-spacing:var(--tracking-wider);color:var(--text-muted);text-transform:uppercase}.app-header-meta strong{color:var(--text-secondary);font-weight:500}.app-header-meta-sep{color:color-mix(in oklch,var(--text-muted) 40%,transparent)}@media(max-width:768px){.app-header-meta{display:none}}.app-header-actions{display:flex;align-items:center;gap:var(--space-2)}.status-led{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--status-off);box-shadow:inset 0 0 0 1px #0006,inset 0 1px 1px #ffffff26;flex-shrink:0}.status-led--power{background:radial-gradient(circle at 35% 30%,color-mix(in oklch,var(--status-power) 100%,white 30%),var(--status-power) 65%);box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--status-power) 60%,oklch(0% 0 0 / .4)),0 0 4px color-mix(in oklch,var(--status-power) 70%,transparent),0 0 12px color-mix(in oklch,var(--status-power) 35%,transparent);animation:status-led-pulse 3s ease-in-out infinite}.status-led--active{background:radial-gradient(circle at 35% 30%,color-mix(in oklch,var(--status-active) 100%,white 30%),var(--status-active) 65%);box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--status-active) 60%,oklch(0% 0 0 / .4)),0 0 4px color-mix(in oklch,var(--status-active) 70%,transparent),0 0 12px color-mix(in oklch,var(--status-active) 35%,transparent)}.status-led--warn{background:radial-gradient(circle at 35% 30%,color-mix(in oklch,var(--status-warn) 100%,white 30%),var(--status-warn) 65%);box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--status-warn) 60%,oklch(0% 0 0 / .4)),0 0 4px color-mix(in oklch,var(--status-warn) 70%,transparent),0 0 12px color-mix(in oklch,var(--status-warn) 35%,transparent)}@keyframes status-led-pulse{0%,to{filter:brightness(1)}50%{filter:brightness(1.25)}}@media(prefers-reduced-motion:reduce){.status-led--power{animation:none}}.status-led-label{font-family:var(--font-tech);font-size:var(--type-nano);letter-spacing:var(--tracking-widest);color:var(--text-muted);text-transform:uppercase}.app-main{display:grid;grid-template-columns:minmax(300px,24vw) 1fr;grid-template-rows:1fr;min-height:0}.app--fullscreen .app-main{grid-template-columns:1fr}@media(max-width:768px){.app-main{grid-template-columns:1fr;grid-template-rows:1fr auto}}.app-placeholder{color:var(--text-muted);font-family:var(--font-mono);font-size:var(--type-small)}.board-stage{display:grid;place-items:center;padding:var(--space-6);min-width:0;min-height:0}.board-wrap{width:100%;max-width:min(100%,1280px);max-height:100%;aspect-ratio:var(--board-cols, 128) / var(--board-rows, 32);background:radial-gradient(ellipse at center,#010406,#010102);border:1px solid color-mix(in oklch,var(--border-strong) 60%,transparent);border-radius:var(--radius-lg);box-shadow:inset 0 0 0 4px #000,inset 0 0 28px #000000b3,var(--shadow-3);overflow:hidden;display:block}.app--fullscreen .board-stage{padding:0}.app--fullscreen .board-wrap{max-width:100%;max-height:100%;border:none;border-radius:0;box-shadow:none}.board-canvas{display:block;width:100%;height:100%}.control-panel{display:flex;flex-direction:column;gap:var(--space-5);padding:var(--space-5);background:var(--surface);border-right:1px solid color-mix(in oklch,var(--border) 60%,transparent);overflow-y:auto;min-width:0;scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}.control-panel::-webkit-scrollbar{width:8px}.control-panel::-webkit-scrollbar-track{background:transparent}.control-panel::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:var(--radius-full);border:2px solid transparent;background-clip:content-box}.control-panel::-webkit-scrollbar-thumb:hover{background:var(--text-muted);background-clip:content-box}@media(max-width:768px){.control-panel{border-right:none;border-top:1px solid var(--border);max-height:60vh}}.panel-section{background:linear-gradient(to bottom,color-mix(in oklch,var(--surface-elevated) 96%,transparent),color-mix(in oklch,var(--surface) 85%,transparent));border:1px solid color-mix(in oklch,var(--border-strong) 55%,transparent);border-radius:var(--radius-md);display:flex;flex-direction:column;overflow:hidden;box-shadow:inset 0 1px color-mix(in oklch,var(--text-primary) 4%,transparent),inset 0 -1px #0006,var(--shadow-1);position:relative}.panel-section:before,.panel-section:after{content:"";position:absolute;width:4px;height:4px;border-radius:50%;background:radial-gradient(circle at 35% 35%,color-mix(in oklch,var(--text-muted) 45%,transparent),#0009 80%);box-shadow:inset 0 0 0 .5px #0009;pointer-events:none}.panel-section:before{top:6px;left:6px}.panel-section:after{top:6px;right:6px}.panel-section-header{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);background:linear-gradient(to bottom,color-mix(in oklch,oklch(0% 0 0) 35%,var(--surface)),color-mix(in oklch,oklch(0% 0 0) 50%,var(--surface)));border-bottom:1px solid color-mix(in oklch,var(--border-strong) 70%,transparent);box-shadow:inset 0 1px 2px #00000080,inset 0 -1px color-mix(in oklch,var(--text-primary) 5%,transparent)}.panel-section-body{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-5) var(--space-4) var(--space-4)}.panel-heading{font-family:var(--font-tech);font-size:var(--type-h2);font-weight:700;margin:0 0 0 var(--space-1);color:color-mix(in oklch,var(--text-primary) 92%,var(--accent));letter-spacing:var(--tracking-widest);text-transform:uppercase;flex:1;text-shadow:0 1px 0 oklch(0% 0 0 / .7)}.panel-section-id{font-family:var(--font-tech);font-size:var(--type-nano);letter-spacing:var(--tracking-wider);color:var(--text-muted);text-transform:uppercase;padding:2px 6px;border:1px solid color-mix(in oklch,var(--border-strong) 50%,transparent);border-radius:var(--radius-sm);background:#0000004d}.field{border:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-2)}.field-label{font-family:var(--font-tech);font-size:var(--type-micro);color:var(--text-muted);font-weight:600;display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-2);letter-spacing:var(--tracking-wider)}.value-badge{font-family:var(--font-tech);font-variant-numeric:tabular-nums;color:var(--text-primary);background:#0006;border:1px solid color-mix(in oklch,var(--border-strong) 60%,transparent);padding:2px 6px;border-radius:var(--radius-sm);font-size:var(--type-nano);letter-spacing:var(--tracking-normal);box-shadow:inset 0 1px 2px #00000080}.text-input{background:var(--surface);border:1px solid color-mix(in oklch,var(--border) 70%,transparent);color:var(--text-primary);padding:var(--space-3);border-radius:var(--radius-md);font-family:var(--font-mono);font-size:var(--type-body);min-height:44px;resize:vertical;transition:border-color var(--dur-fast) var(--ease-standard),background var(--dur-fast) var(--ease-standard)}.text-input:hover{border-color:var(--border-strong)}.text-input:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-color:var(--accent)}.slider-row{display:flex;align-items:center;gap:var(--space-3);width:100%}.range-input{flex:1;min-width:0;height:32px;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}.range-input::-webkit-slider-runnable-track{height:4px;background:linear-gradient(to right,color-mix(in oklch,var(--accent) 65%,oklch(8% 0 0)),color-mix(in oklch,var(--accent) 30%,oklch(5% 0 0)));border-radius:var(--radius-full);border:1px solid oklch(0% 0 0 / .7);box-shadow:inset 0 1px 1px #000000b3}.range-input::-moz-range-track{height:4px;background:linear-gradient(to right,color-mix(in oklch,var(--accent) 65%,oklch(8% 0 0)),color-mix(in oklch,var(--accent) 30%,oklch(5% 0 0)));border-radius:var(--radius-full);border:1px solid oklch(0% 0 0 / .7)}.range-input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:24px;margin-top:-11px;background:linear-gradient(to right,transparent 0%,transparent 47%,oklch(0% 0 0 / .6) 47%,oklch(0% 0 0 / .6) 53%,transparent 53%,transparent 100%),linear-gradient(to bottom,color-mix(in oklch,var(--accent) 100%,white 20%),var(--accent) 50%,color-mix(in oklch,var(--accent) 70%,oklch(0% 0 0)) 100%);border:1px solid oklch(0% 0 0 / .85);border-radius:3px;box-shadow:inset 0 1px #fff6,inset 0 -1px 1px #0006,0 1px 3px #0009,0 0 8px color-mix(in oklch,var(--accent) 35%,transparent);transition:box-shadow var(--dur-fast) var(--ease-standard),transform var(--dur-instant) var(--ease-standard)}.range-input::-webkit-slider-thumb:hover{box-shadow:inset 0 1px #ffffff80,inset 0 -1px 1px #0006,0 1px 4px #0009,0 0 14px color-mix(in oklch,var(--accent) 60%,transparent)}.range-input:active::-webkit-slider-thumb{transform:scaleY(1.06)}.range-input::-moz-range-thumb{width:14px;height:24px;background:linear-gradient(to right,transparent 0%,transparent 47%,oklch(0% 0 0 / .6) 47%,oklch(0% 0 0 / .6) 53%,transparent 53%,transparent 100%),linear-gradient(to bottom,color-mix(in oklch,var(--accent) 100%,white 20%),var(--accent) 50%,color-mix(in oklch,var(--accent) 70%,oklch(0% 0 0)) 100%);border:1px solid oklch(0% 0 0 / .85);border-radius:3px;box-shadow:inset 0 1px #fff6,0 1px 3px #0009,0 0 8px color-mix(in oklch,var(--accent) 35%,transparent);transition:box-shadow var(--dur-fast) var(--ease-standard),transform var(--dur-instant) var(--ease-standard)}.range-input::-moz-range-thumb:hover{box-shadow:inset 0 1px #ffffff80,0 1px 4px #0009,0 0 14px color-mix(in oklch,var(--accent) 60%,transparent)}.range-input:focus-visible{outline:none}.range-input:focus-visible::-webkit-slider-thumb{outline:3px solid var(--focus-ring);outline-offset:2px}.range-input:focus-visible::-moz-range-thumb{outline:3px solid var(--focus-ring);outline-offset:2px}.number-input{width:64px;background:var(--surface);border:1px solid color-mix(in oklch,var(--border) 70%,transparent);color:var(--text-primary);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--type-small);text-align:right;min-height:36px;-moz-appearance:textfield;appearance:textfield;transition:border-color var(--dur-fast) var(--ease-standard),background var(--dur-fast) var(--ease-standard)}.number-input::-webkit-outer-spin-button,.number-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.number-input:hover{border-color:var(--border-strong)}.number-input:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-color:var(--accent)}.unit-label{font-family:var(--font-mono);font-size:var(--type-micro);color:var(--text-muted);white-space:nowrap;letter-spacing:.04em}.segmented{display:flex;background:linear-gradient(to bottom,#0000008c,#0000004d);border:1px solid color-mix(in oklch,var(--border-strong) 60%,transparent);border-radius:var(--radius-md);padding:3px;gap:2px;box-shadow:inset 0 1px 2px #0009,inset 0 -1px color-mix(in oklch,var(--text-primary) 4%,transparent)}.segmented-option{flex:1;padding:var(--space-2) var(--space-3);background:linear-gradient(to bottom,color-mix(in oklch,var(--surface-elevated) 70%,transparent),color-mix(in oklch,var(--surface) 50%,transparent));color:var(--text-secondary);border:1px solid color-mix(in oklch,var(--border-strong) 30%,transparent);border-radius:calc(var(--radius-md) - 4px);font-family:var(--font-tech);font-size:var(--type-micro);font-weight:600;letter-spacing:var(--tracking-wider);text-transform:uppercase;min-height:36px;display:grid;place-items:center;transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard),transform var(--dur-instant) var(--ease-standard);box-shadow:inset 0 1px color-mix(in oklch,var(--text-primary) 5%,transparent),0 1px #0006}.segmented-option:hover{background:linear-gradient(to bottom,color-mix(in oklch,var(--accent) 12%,var(--surface-elevated)),color-mix(in oklch,var(--accent) 6%,var(--surface)));color:var(--text-primary);border-color:color-mix(in oklch,var(--accent) 40%,var(--border-strong))}.segmented-option:active{transform:scale(.97)}.segmented-option--active{background:linear-gradient(to bottom,color-mix(in oklch,var(--accent) 100%,white 8%),var(--accent) 60%,color-mix(in oklch,var(--accent) 80%,oklch(0% 0 0)) 100%);color:var(--bg);border-color:#000000b3;box-shadow:inset 0 1px #fff6,inset 0 -1px 1px #0000004d,0 0 12px color-mix(in oklch,var(--accent) 40%,transparent)}.segmented-option--active:hover{color:var(--bg);background:linear-gradient(to bottom,color-mix(in oklch,var(--accent-hover) 100%,white 10%),var(--accent-hover) 60%,color-mix(in oklch,var(--accent) 80%,oklch(0% 0 0)) 100%)}.segmented--tall .segmented-option{min-height:56px;padding:var(--space-3)}.dot-shape-option .dot-shape-sample{display:block;width:22px;height:22px;background:radial-gradient(circle at 35% 30%,color-mix(in oklch,currentColor 100%,white 30%),currentColor 60%,color-mix(in oklch,currentColor 50%,oklch(0% 0 0)) 100%);box-shadow:inset 0 1px 1px #ffffff4d,0 0 8px color-mix(in oklch,currentColor 50%,transparent)}.board-preset-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:var(--space-2);padding:var(--space-3);background:#0000004d;border:1px solid color-mix(in oklch,var(--border-strong) 50%,transparent);border-radius:var(--radius-md);box-shadow:inset 0 1px 2px #00000080}.board-preset{display:flex;flex-direction:column;align-items:center;gap:4px;padding:var(--space-3) var(--space-2);background:linear-gradient(to bottom,color-mix(in oklch,var(--surface-elevated) 80%,transparent),color-mix(in oklch,var(--surface) 60%,transparent));border:1px solid color-mix(in oklch,var(--border-strong) 60%,transparent);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),transform var(--dur-instant) var(--ease-standard);box-shadow:inset 0 1px color-mix(in oklch,var(--text-primary) 5%,transparent),0 1px #0006}.board-preset:hover{border-color:color-mix(in oklch,var(--accent) 50%,var(--border-strong));background:linear-gradient(to bottom,color-mix(in oklch,var(--accent) 8%,var(--surface-elevated)),color-mix(in oklch,var(--accent) 4%,var(--surface)))}.board-preset:active{transform:scale(.98)}.board-preset:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.board-preset--active{border-color:var(--accent);background:linear-gradient(to bottom,color-mix(in oklch,var(--accent) 18%,var(--surface-elevated)),color-mix(in oklch,var(--accent) 10%,var(--surface)));box-shadow:inset 0 1px color-mix(in oklch,var(--accent) 30%,transparent),0 0 0 1px color-mix(in oklch,var(--accent) 60%,transparent),0 0 12px color-mix(in oklch,var(--accent) 25%,transparent)}.board-preset-thumb{width:100%;max-width:80px;height:32px;display:grid;place-items:center;margin-bottom:2px}.board-preset-thumb-inner{display:block;width:100%;max-height:100%;background:radial-gradient(ellipse at center,color-mix(in oklch,var(--accent) 55%,oklch(8% 0 0)),color-mix(in oklch,var(--accent) 25%,oklch(5% 0 0)) 70%,#000);border:1px solid oklch(0% 0 0 / .7);border-radius:2px;box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--accent) 20%,oklch(0% 0 0 / .5)),inset 0 0 6px #0009}.board-preset--active .board-preset-thumb-inner{background:radial-gradient(ellipse at center,color-mix(in oklch,var(--accent) 100%,white 25%),var(--accent) 60%,color-mix(in oklch,var(--accent) 50%,oklch(0% 0 0)) 100%);box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--accent) 80%,white),0 0 8px color-mix(in oklch,var(--accent) 60%,transparent)}.board-preset-label{font-family:var(--font-tech);font-size:var(--type-small);font-weight:700;letter-spacing:var(--tracking-wider);color:var(--text-primary);text-transform:uppercase}.board-preset-spec{font-family:var(--font-tech);font-size:var(--type-nano);letter-spacing:var(--tracking-wider);color:var(--text-muted);font-variant-numeric:tabular-nums}.board-preset--active .board-preset-spec{color:var(--accent)}.board-preset-desc{font-size:var(--type-nano);color:var(--text-muted);letter-spacing:var(--tracking-normal)}.fine-tune-disclosure{border:1px solid color-mix(in oklch,var(--border-strong) 40%,transparent);border-radius:var(--radius-md);background:#00000026;overflow:hidden}.fine-tune-disclosure summary{list-style:none;cursor:pointer;padding:var(--space-2) var(--space-3);display:flex;align-items:center;justify-content:space-between;font-family:var(--font-tech);font-size:var(--type-micro);letter-spacing:var(--tracking-wider);color:var(--text-muted);text-transform:uppercase;-webkit-user-select:none;user-select:none;transition:color var(--dur-fast) var(--ease-standard)}.fine-tune-disclosure summary::-webkit-details-marker{display:none}.fine-tune-disclosure summary:hover{color:var(--text-secondary)}.fine-tune-arrow{display:inline-block;font-size:var(--type-small);transition:transform var(--dur-fast) var(--ease-standard)}.fine-tune-disclosure[open] .fine-tune-arrow{transform:rotate(180deg)}.fine-tune-content{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-3);border-top:1px solid color-mix(in oklch,var(--border-strong) 40%,transparent);background:#0003}.led-bulb-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--space-1);padding:var(--space-3) var(--space-2);background:linear-gradient(to bottom,#0006,#00000040);border-radius:var(--radius-md);border:1px solid color-mix(in oklch,var(--border-strong) 50%,transparent);box-shadow:inset 0 1px 2px #0009,inset 0 -1px color-mix(in oklch,var(--text-primary) 4%,transparent)}.led-bulb{display:flex;flex-direction:column;align-items:center;gap:6px;background:transparent;border:none;cursor:pointer;padding:var(--space-2) 0;border-radius:var(--radius-sm);transition:background var(--dur-fast) var(--ease-standard)}.led-bulb:hover{background:#00000040}.led-bulb:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}.led-bulb-glass{width:32px;height:32px;border-radius:50%;position:relative;background:radial-gradient(circle at 35% 30%,color-mix(in oklch,var(--bulb-color, var(--accent)) 22%,oklch(7% 0 0)),#000 78%);border:1.5px solid oklch(0% 0 0 / .85);box-shadow:inset 0 1px 1px #ffffff0f,inset 0 -1px 2px #000000b3,0 1px 2px #0009,0 0 0 1px #00000080;transition:background var(--dur-standard) var(--ease-standard),box-shadow var(--dur-standard) var(--ease-standard)}.led-bulb-glass-highlight{position:absolute;top:4px;left:7px;width:8px;height:5px;border-radius:50%;background:#ffffff2e;filter:blur(.5px);transition:opacity var(--dur-standard) var(--ease-standard)}.led-bulb--active .led-bulb-glass{background:radial-gradient(circle at 35% 30%,color-mix(in oklch,var(--bulb-color) 100%,white 50%),var(--bulb-color) 55%,color-mix(in oklch,var(--bulb-color) 75%,oklch(0% 0 0)) 100%);box-shadow:inset 0 1px 2px #ffffff73,inset 0 -1px 2px color-mix(in oklch,var(--bulb-color) 40%,oklch(0% 0 0)),0 0 0 1px #00000080,0 0 12px var(--bulb-color),0 0 28px color-mix(in oklch,var(--bulb-color) 55%,transparent),0 0 48px color-mix(in oklch,var(--bulb-color) 25%,transparent)}.led-bulb--active .led-bulb-glass-highlight{opacity:.7}@media(prefers-reduced-motion:no-preference){.led-bulb--active .led-bulb-glass{animation:led-bulb-flicker 4s ease-in-out infinite}}@keyframes led-bulb-flicker{0%,to{filter:brightness(1)}50%{filter:brightness(1.06)}}.led-bulb-code{font-family:var(--font-tech);font-size:var(--type-nano);letter-spacing:var(--tracking-wider);color:var(--text-muted);text-transform:uppercase;transition:color var(--dur-fast) var(--ease-standard)}.led-bulb--active .led-bulb-code{color:color-mix(in oklch,var(--bulb-color) 80%,white 20%);text-shadow:0 0 6px color-mix(in oklch,var(--bulb-color) 60%,transparent)}.icon-button{width:40px;height:40px;display:grid;place-items:center;background:transparent;color:var(--text-secondary);border-radius:var(--radius-md);border:1px solid transparent;transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}.icon-button:hover{background:color-mix(in oklch,var(--accent) 10%,transparent);color:var(--accent);border-color:color-mix(in oklch,var(--accent) 30%,transparent)}.icon-button:active{transform:scale(.94)}.icon-button[aria-pressed=true]{color:var(--accent);background:color-mix(in oklch,var(--accent) 12%,transparent)}.keyboard-help{background:var(--surface-elevated);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5);max-width:480px;width:90vw;box-shadow:var(--shadow-3)}.keyboard-help::backdrop{background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.keyboard-help-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4)}.keyboard-help-header .panel-heading{margin:0}.keyboard-help-table{width:100%;border-collapse:collapse}.keyboard-help-table td{padding:var(--space-2) var(--space-1);border-bottom:1px solid var(--border);font-size:var(--type-body)}.keyboard-help-table td:first-child{display:flex;gap:var(--space-1);width:30%}.kbd{display:inline-block;padding:2px 8px;background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:var(--type-small);color:var(--text-primary);min-width:24px;text-align:center}