@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;700&family=Silkscreen:wght@400;700&family=VT323&display=swap";:root{--font-sans: "Inter", -apple-system, system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace;--font-pixel: "VT323", monospace;--red: #E63946;--yellow: #FFD600;--blue: #2E5BFF;--green: #2BD27E;--radius: 0;--rule-w: 1.5px}:root[data-theme=dark]{--bg: #0A0A0A;--bg-2: #141414;--bg-3: #1F1F1F;--fg: #F5F5F2;--fg-2: #B5B5B0;--fg-3: #6E6E68;--rule: #F5F5F2;--hairline: rgba(245, 245, 242, .12);--shadow: none}:root[data-theme=light]{--bg: #FAFAF7;--bg-2: #FFFFFF;--bg-3: #F0F0EB;--fg: #0A0A0A;--fg-2: #4A4A4A;--fg-3: #8A8A85;--rule: #0A0A0A;--hairline: rgba(10, 10, 10, .12);--shadow: none}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-sans);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background .18s ease,color .18s ease}h1,h2,h3,h4{margin:0}h1{font-size:clamp(32px,5vw,48px);font-weight:900;letter-spacing:-.03em;line-height:1}h2{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--fg)}h3{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-2)}a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}button{font-family:inherit;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:11px 18px;border:var(--rule-w) solid var(--rule);background:var(--bg-2);color:var(--fg);cursor:pointer;border-radius:var(--radius);transition:background .12s ease,color .12s ease,transform 80ms ease,border-color .12s ease;white-space:nowrap}button:hover{background:var(--fg);color:var(--bg)}button:active{transform:translateY(1px)}button:disabled{opacity:.35;cursor:not-allowed}button:disabled:hover{background:var(--bg-2);color:var(--fg)}button.primary{background:var(--blue);color:#fff;border-color:var(--blue)}button.primary:hover{background:var(--fg);border-color:var(--fg);color:var(--bg)}button.danger{border-color:var(--red);color:var(--red);background:transparent}button.danger:hover{background:var(--red);color:#fff}button.ghost{border-color:transparent;background:transparent}button.ghost:hover{background:var(--bg-3);color:var(--fg)}button.icon{width:38px;height:38px;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:15px;letter-spacing:0}input,select,textarea{font-family:inherit;font-size:13px;padding:10px 12px;border:1px solid var(--hairline);background:var(--bg-2);color:var(--fg);border-radius:var(--radius);width:100%;transition:border-color .1s ease}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue)}input[type=range]{padding:0;border:none;background:transparent;accent-color:var(--blue)}input[type=checkbox]{width:18px;height:18px;accent-color:var(--blue)}input[type=color]{padding:2px;height:38px;cursor:pointer}input[type=time],input[type=number]{width:auto;min-width:100px}textarea{resize:vertical;line-height:1.5}select{-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--fg-2) 50%),linear-gradient(135deg,var(--fg-2) 50%,transparent 50%);background-position:calc(100% - 14px) 50%,calc(100% - 9px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:30px}.app-header{display:flex;align-items:center;justify-content:space-between;padding:20px 32px;border-bottom:var(--rule-w) solid var(--rule);position:sticky;top:0;background:var(--bg);z-index:10}.brand{display:flex;align-items:center;gap:14px;font-size:18px;font-weight:900;letter-spacing:-.02em}.brand .dot{width:14px;height:14px;background:var(--red);flex-shrink:0}.container{max-width:1000px;margin:0 auto;padding:56px 32px 96px;width:100%}.section{margin:64px 0}.section:first-of-type{margin-top:32px}.section-header{display:flex;align-items:baseline;gap:18px;margin-bottom:24px;padding-bottom:14px;border-bottom:var(--rule-w) solid var(--rule)}.section-num{font-family:var(--font-mono);font-size:22px;font-weight:700;color:var(--blue);letter-spacing:-.02em;line-height:1}.section-title{font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;flex:1}.card{border:var(--rule-w) solid var(--rule);background:var(--bg-2);padding:28px;display:flex;flex-direction:column;gap:18px}.card.flat{background:transparent}.scene{border:var(--rule-w) solid var(--rule);background:var(--bg-2);padding:24px 28px;margin:16px 0;display:flex;flex-direction:column;gap:18px;position:relative;transition:border-color .12s ease}.scene:before{content:"";position:absolute;left:calc(var(--rule-w) * -1);top:calc(var(--rule-w) * -1);bottom:calc(var(--rule-w) * -1);width:6px;background:transparent;transition:background .2s ease}.scene.active:before{background:var(--yellow)}.scene-title{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.scene-title-input{font-size:18px;font-weight:800;letter-spacing:-.01em;background:transparent;border:none;padding:4px 0;width:auto;flex:1;min-width:120px;border-bottom:1px solid transparent}.scene-title-input:focus{outline:none;border-bottom-color:var(--blue)}.scene-actions{display:flex;gap:6px;align-items:center}.badge{display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:5px 10px;border:1px solid var(--fg-3);color:var(--fg-3)}.badge.active{background:var(--yellow);border-color:var(--yellow);color:#0a0a0a}.badge .pulse{width:6px;height:6px;background:currentColor;animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}.field{display:flex;flex-direction:column;gap:6px}.field-label{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-2)}.field-row{display:flex;align-items:center;gap:10px}.field-row input[type=range]{flex:1}.field-row .mono{font-family:var(--font-mono);font-size:13px;color:var(--fg-2);min-width:48px;text-align:right}.schedule{display:flex;flex-direction:column;gap:12px;padding:16px;background:var(--bg-3);border-left:3px solid var(--blue)}.days{display:flex;gap:4px;flex-wrap:wrap}.day-chip{padding:6px 10px;border:1px solid var(--hairline);background:var(--bg-2);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .1s ease}.day-chip:hover{border-color:var(--fg-3)}.day-chip.on{background:var(--blue);border-color:var(--blue);color:#fff}.tabs{display:flex;border-bottom:1px solid var(--hairline);margin:0 0 24px}.tabs button{border:none;border-radius:0;border-bottom:2px solid transparent;padding:12px 20px;background:transparent;color:var(--fg-2);font-size:11px}.tabs button:hover{background:transparent;color:var(--fg);transform:none}.tabs button.active{color:var(--fg);border-bottom-color:var(--red)}.notice{padding:12px 16px;border-left:3px solid;background:var(--bg-2);font-size:13px;margin:16px 0;animation:slideIn .2s ease}.notice.error{border-color:var(--red);color:var(--red)}.notice.success{border-color:var(--green);color:var(--green)}.notice.info{border-color:var(--blue);color:var(--blue)}@keyframes slideIn{0%{opacity:0;transform:translate(-4px)}to{opacity:1;transform:translate(0)}}.matrix-stage{background:var(--bg-3);border:var(--rule-w) solid var(--rule);padding:32px;display:flex;justify-content:center;align-items:center}.matrix-wrap{display:inline-block;background:#000;padding:6px;position:relative}.matrix-wrap:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.3) 100%);pointer-events:none}.matrix-svg{display:block;background:#050505;image-rendering:pixelated;shape-rendering:crispEdges;font-family:Silkscreen,VT323,monospace}.matrix-caption{display:flex;justify-content:space-between;align-items:center;font-family:var(--font-mono);font-size:11px;color:var(--fg-3);margin-top:10px;letter-spacing:.04em}.device-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}.device-item{display:block;padding:28px 32px;border:var(--rule-w) solid var(--rule);background:var(--bg-2);color:var(--fg);text-decoration:none;position:relative;transition:background .15s ease,color .15s ease;overflow:hidden}.device-item:hover{background:var(--fg);color:var(--bg);text-decoration:none}.device-item:hover .meta{color:inherit;opacity:.7}.device-item .name{font-size:24px;font-weight:800;letter-spacing:-.02em}.device-item .id{font-family:var(--font-mono);font-size:12px;color:var(--fg-3);margin-top:4px}.device-item .meta{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3);margin-top:16px}.json-editor{width:100%;min-height:60vh;font-family:var(--font-mono);font-size:12.5px;padding:18px;border:var(--rule-w) solid var(--rule);background:var(--bg-2);color:var(--fg)}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.login-card{width:100%;max-width:380px;padding:48px 40px;border:var(--rule-w) solid var(--rule);background:var(--bg-2)}.login-card h1{display:flex;align-items:center;gap:14px;font-size:36px;margin-bottom:6px}.login-card h1 .dot{width:16px;height:16px;background:var(--red)}.login-card .sub{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--fg-3);margin-bottom:36px}.login-card form{display:flex;flex-direction:column;gap:16px}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.row-between{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}.col{display:flex;flex-direction:column;gap:12px}.muted{color:var(--fg-3)}.mono{font-family:var(--font-mono)}.spacer{flex:1}.divider{height:1px;background:var(--hairline);margin:24px 0}.fade-in{animation:fadeIn .22s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 640px){.container{padding:32px 18px 80px}.app-header{padding:16px 18px}.card,.scene{padding:20px}.matrix-stage{padding:16px}}
