:root{color:#20231f;background:#e9ece7;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#e9ece7}button,input,select,textarea{font:inherit}button{letter-spacing:0}.topbar{height:68px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;background:#f8f9f6;border-bottom:1px solid #d4d8d1}.brand,.device-actions,.brand>div{display:flex;align-items:center}.brand{gap:12px}.brand-mark{width:34px;height:34px;display:grid;place-items:center;background:#20231f;color:#fff;font-weight:800}.brand>div:last-child{align-items:flex-start;flex-direction:column;gap:2px}.brand strong{font-size:15px}.brand span{color:#72786f;font-size:12px}.device-actions{gap:10px}.connection{display:flex;align-items:center;gap:7px;color:#636960;font-size:13px;margin-right:6px}.connection i{width:8px;height:8px;border-radius:50%;background:#a7aca4}.connection i.online{background:#168657;box-shadow:0 0 0 3px #d9eee5}.workspace{min-height:calc(100vh - 68px);display:grid;grid-template-columns:minmax(0,1fr) 370px}.stage-panel{min-width:0;display:grid;grid-template-rows:58px minmax(600px,1fr) 50px;background:#dfe3dd}.stage-toolbar,.palette-bar{padding:0 24px;display:flex;align-items:center;justify-content:space-between;background:#f3f5f1;border-bottom:1px solid #d1d6ce}.stage-toolbar>div:first-child{display:flex;flex-direction:column;gap:2px}.stage-toolbar strong{font-size:14px}.stage-toolbar span,.zoom-readout{font-size:12px;color:#737a71}.canvas-stage{display:grid;place-items:center;padding:32px;overflow:auto;background-color:#dfe3dd;background-image:linear-gradient(#d4d8d2 1px,transparent 1px),linear-gradient(90deg,#d4d8d2 1px,transparent 1px);background-size:24px 24px}.display-shell{position:relative;width:min(52vh,475px);aspect-ratio:2 / 3;padding:10px;background:#272a27;border:1px solid #151715;box-shadow:0 18px 45px #1c221c33}#preview{width:100%;height:100%;display:block;background:#f8f8f2;image-rendering:auto}.empty-preview{position:absolute;top:10px;right:10px;bottom:10px;left:10px;display:grid;place-content:center;text-align:center;gap:8px;background:#f8f8f2;color:#777d74}.empty-preview strong{color:#3f443e;font-size:15px}.empty-preview span{font-size:12px}.palette-bar{justify-content:flex-start;gap:8px;border-top:1px solid #d1d6ce;border-bottom:0}.palette-bar span{color:#70766e;font-size:12px;margin-right:4px}.palette-swatches{display:flex;align-items:center;gap:8px}.palette-swatches i{width:17px;height:17px;background:var(--swatch);border:1px solid rgb(0 0 0 / 17%)}.palette-bar strong{margin-left:auto;font-size:12px;font-weight:600;color:#525850}.inspector{background:#f8f9f6;border-left:1px solid #ccd1ca;overflow-y:auto;max-height:calc(100vh - 68px)}.panel-section{padding:20px;border-bottom:1px solid #d9ddd6}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.section-heading>div{display:flex;align-items:center;gap:9px}.section-heading span{color:#168657;font-size:11px;font-weight:800}.section-heading h2{margin:0;font-size:14px;letter-spacing:0}.section-heading small{color:#858b82;font-size:11px}.drop-zone{height:86px;border:1px dashed #9da59b;display:grid;place-content:center;text-align:center;gap:4px;cursor:pointer;background:#f0f3ee;transition:.15s ease}.drop-zone:hover,.drop-zone.dragging{border-color:#168657;background:#e6f1eb}.drop-zone input{display:none}.drop-zone strong{font-size:13px;color:#252925}.drop-zone span{font-size:11px;color:#7b8178}.field{display:grid;grid-template-columns:92px 1fr;align-items:center;gap:12px;margin-bottom:12px}.field>span,.range-field span{color:#626860;font-size:12px}select{width:100%;height:36px;padding:0 30px 0 10px;border:1px solid #c8cdc5;border-radius:4px;background:#fff;color:#252925}.range-field{display:grid;gap:8px;margin-bottom:16px}.range-field span{display:flex;justify-content:space-between}.range-field input{accent-color:#168657;width:100%}.button{min-height:36px;padding:0 14px;border:1px solid transparent;border-radius:4px;cursor:pointer;font-weight:650;font-size:12px}.button:disabled{cursor:not-allowed;opacity:.45}.button.primary{background:#168657;border-color:#168657;color:#fff}.button.primary:hover:not(:disabled){background:#0f7048}.button.secondary{background:#fff;border-color:#bdc4bb;color:#2b302b}.button.secondary:hover:not(:disabled){border-color:#697067;background:#f3f5f1}.button.subtle{background:transparent;border-color:#ccd1ca;color:#454b44}.wide{width:100%}.panel-section .wide+.wide{margin-top:8px}.transfer-section .button+.button{margin-top:8px}.format-control{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:14px;border:1px solid #c8cdc5;background:#eef1ec}.format-control label{position:relative;min-width:0;cursor:pointer}.format-control input{position:absolute;opacity:0;pointer-events:none}.format-control span{min-height:38px;display:grid;place-items:center;padding:4px 6px;color:#626860;font-size:10px;font-weight:650;line-height:1.2;text-align:center}.format-control label+label{border-left:1px solid #c8cdc5}.format-control input:checked+span{background:#20231f;color:#fff}.format-control input:focus-visible+span{outline:2px solid #168657;outline-offset:-2px}.device-metrics{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #d8dcd5;margin-bottom:16px}.device-metrics div{min-width:0;padding:10px 8px;border-right:1px solid #d8dcd5}.device-metrics div:last-child{border:0}.device-metrics span,.device-metrics strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-metrics span{color:#81877e;font-size:10px;margin-bottom:4px}.device-metrics strong{font-size:11px}.slot-panel{margin-bottom:14px;padding-top:2px}.mode-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;color:#70766e;font-size:10px}.mode-heading strong{color:#343934;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.display-mode-control{display:grid;grid-template-columns:1fr 1fr;margin-bottom:14px;border:1px solid #cdd2ca;background:#fff}.mode-button{height:34px;border:0;background:#fff;color:#525950;cursor:pointer;font-size:10px;font-weight:650}.mode-button+.mode-button{border-left:1px solid #cdd2ca}.mode-button.active{background:#20231f;color:#fff}.mode-button:disabled{cursor:not-allowed;opacity:.45}.calendar-datetime-control{display:grid;grid-template-columns:minmax(0,1fr) 64px;gap:7px;margin-bottom:7px}.calendar-datetime-control label{height:36px;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:7px;padding:0 8px;border:1px solid #ccd1ca;background:#fff;color:#626860;font-size:10px}.calendar-datetime-control input{width:100%;min-width:0;padding:0;border:0;outline:0;color:#242924;font:10px ui-monospace,SFMono-Regular,Menlo,monospace}.calendar-datetime-control .button{min-height:36px;padding:0 8px}.calendar-refresh-note{margin:0 0 14px;color:#777e75;font-size:10px}.slot-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;color:#70766e;font-size:10px}.slot-heading strong{color:#343934}.slot-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #cdd2ca;background:#fff}.slot-button{position:relative;height:34px;padding:0;border:0;border-right:1px solid #d9ddd6;background:#fff;color:#646b63;cursor:pointer;font-size:10px}.slot-button:last-child{border-right:0}.slot-button.selected{background:#20231f;color:#fff}.slot-button.current:after{content:"";position:absolute;top:4px;right:4px;width:5px;height:5px;border-radius:50%;background:#e6bc36}.slot-button i{position:absolute;right:4px;bottom:4px;width:4px;height:4px;border-radius:50%;background:#d3d7d0}.slot-button.valid i{background:#168657}.slot-actions{display:grid;grid-template-columns:1fr 36px;gap:7px;margin-top:7px}.slot-actions .button,.icon-action{height:34px;min-height:34px}.icon-action{padding:0;border:1px solid #d2b5b0;border-radius:4px;background:#fff7f5;color:#9a4137;cursor:pointer;font-size:19px}.icon-action:disabled{cursor:not-allowed;opacity:.4}.carousel-control{display:grid;grid-template-columns:1fr 64px;gap:7px;margin-top:8px}.carousel-control label{height:34px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:7px;padding:0 8px;border:1px solid #ccd1ca;background:#fff;color:#626860;font-size:10px}.carousel-control input{width:100%;min-width:0;border:0;outline:0;text-align:right;color:#242924}.carousel-control em{color:#858b82;font-style:normal}.carousel-control .button{min-height:34px;padding:0 8px}.progress-block{margin-bottom:14px}.progress-block>div{display:flex;justify-content:space-between;font-size:11px;margin-bottom:7px}.progress-block span{color:#737970}progress{width:100%;height:7px;border:0;border-radius:0;background:#dfe3dc}progress::-webkit-progress-bar{background:#dfe3dc}progress::-webkit-progress-value{background:#168657}.transfer-timings{display:grid;grid-template-columns:repeat(2,1fr);margin:0 0 10px;border:1px solid #d8dcd5}.transfer-timings>div{min-width:0;min-height:48px;padding:8px;display:grid;align-content:center;gap:3px;border-bottom:1px solid #d8dcd5}.transfer-timings>div:nth-child(odd){border-right:1px solid #d8dcd5}.transfer-timings>div:nth-last-child(-n+2){border-bottom:0}.transfer-timings span{color:#81877e;font-size:9px}.transfer-timings strong{min-width:0;color:#343934;font:600 12px ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}.transfer-timings .running strong{color:#168657}.transfer-timings .failed strong{color:#a33e34}.auto-refresh{margin:0 0 14px;display:flex;align-items:center;gap:8px;color:#555c54;font-size:10px;cursor:pointer}.auto-refresh input{width:15px;height:15px;margin:0;accent-color:#168657}.note{margin:10px 0 0;color:#777d74;font-size:10px;line-height:1.55}.text-button{border:0;background:transparent;color:#657067;padding:3px;cursor:pointer;font-size:11px}.log{height:126px;overflow:auto;background:#222622;color:#dce3dc;padding:9px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}.log div{display:grid;grid-template-columns:60px 1fr;gap:8px;padding:3px 0;border-bottom:1px solid rgb(255 255 255 / 6%)}.log time{color:#77c69f}.developer-dialog{width:min(940px,calc(100vw - 40px));height:min(720px,calc(100vh - 40px));max-width:none;max-height:none;margin:auto;padding:0;border:1px solid #aeb5ac;border-radius:6px;background:#f8f9f6;color:#20231f;box-shadow:0 24px 70px #141a1452}.developer-dialog::backdrop{background:#181d1894}.ota-dialog{width:min(780px,calc(100vw - 40px));height:min(560px,calc(100vh - 40px));max-width:none;max-height:none;margin:auto;padding:0;border:1px solid #aeb5ac;border-radius:6px;background:#f8f9f6;color:#20231f;box-shadow:0 24px 70px #141a1452}.ota-dialog::backdrop{background:#181d1894}.ota-dialog-shell{height:100%;display:grid;grid-template-rows:58px minmax(0,1fr)}.ota-dialog-body{min-height:0;display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)}.ota-file-pane,.ota-run-pane{min-width:0;padding:22px;overflow:auto}.ota-file-pane{border-right:1px solid #d6dbd3;background:#f5f7f3}.ota-drop-zone{min-height:150px;display:grid;place-content:center;justify-items:center;gap:7px;padding:18px;border:1px dashed #9ba39a;background:#fbfcfa;cursor:pointer;text-align:center;transition:.15s ease}.ota-drop-zone:hover,.ota-drop-zone.dragging{border-color:#168657;background:#eaf3ed}.ota-drop-zone input{display:none}.ota-file-icon{width:46px;height:38px;display:grid;place-items:center;border:1px solid #697168;background:#252925;color:#fff;font:700 10px ui-monospace,SFMono-Regular,Menlo,monospace}.ota-drop-zone strong{max-width:250px;overflow:hidden;text-overflow:ellipsis;font-size:12px;white-space:nowrap}.ota-drop-zone small{color:#7d847b;font-size:10px}.ota-validation{margin-top:14px;border:1px solid #d6dbd3;background:#fff}.ota-validation>div{min-height:38px;padding:0 10px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #e1e5df}.ota-validation>div:last-child{border-bottom:0}.ota-validation span{color:#7a8178;font-size:10px}.ota-validation strong{min-width:0;overflow:hidden;text-overflow:ellipsis;color:#343934;font:600 10px ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}.ota-validation.valid{border-color:#a8cdb9}.ota-validation.valid #ota-format{color:#14764e}.ota-validation.invalid{border-color:#d8aaa4}.ota-validation.invalid #ota-format{color:#a33e34}.ota-state-line{min-height:58px;display:grid;grid-template-columns:12px minmax(0,1fr);align-items:center;gap:11px;margin:5px 0 20px}.ota-state-line>span{width:10px;height:10px;border-radius:50%;background:#a9afa7}.ota-state-line>span.working{background:#d8a91f;box-shadow:0 0 0 4px #f5ebc9;animation:ota-pulse 1.2s ease-in-out infinite}.ota-state-line>span.success{background:#168657;box-shadow:0 0 0 4px #d9eee5}.ota-state-line>span.error{background:#b54136;box-shadow:0 0 0 4px #f3ddda}.ota-state-line div{min-width:0;display:grid;gap:4px}.ota-state-line strong{font-size:13px}.ota-state-line small{overflow:hidden;text-overflow:ellipsis;color:#747b72;font-size:10px;white-space:nowrap}.ota-progress-block{margin-bottom:16px}.ota-progress-block>div{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;color:#737970;font-size:10px}.ota-progress-block strong{color:#343934;font:650 11px ui-monospace,SFMono-Regular,Menlo,monospace}.ota-progress-block progress{height:9px}.ota-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:14px;border:1px solid #d8dcd5}.ota-stats>div{min-width:0;min-height:54px;padding:9px;display:grid;align-content:center;gap:4px;border-right:1px solid #d8dcd5}.ota-stats>div:last-child{border-right:0}.ota-stats span{color:#81877e;font-size:9px}.ota-stats strong{overflow:hidden;text-overflow:ellipsis;font:600 10px ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}.ota-safety{margin:0 0 14px;padding:9px 10px;border-left:3px solid #d8a91f;background:#fff8df;color:#685719;font-size:10px;line-height:1.5}.ota-log{height:92px;margin-top:12px;overflow:auto;background:#202420;color:#dfe5df;font:9px ui-monospace,SFMono-Regular,Menlo,monospace}.ota-log div{display:grid;grid-template-columns:58px minmax(0,1fr);gap:8px;padding:6px 8px;border-bottom:1px solid rgb(255 255 255 / 7%)}.ota-log time{color:#78d3a7}@keyframes ota-pulse{50%{opacity:.45}}.developer-dialog-shell{height:100%;display:grid;grid-template-rows:58px minmax(0,1fr)}.developer-dialog-header{padding:0 18px 0 20px;display:flex;align-items:center;justify-content:space-between;background:#f1f4ef;border-bottom:1px solid #d2d7cf}.developer-dialog-header>div{display:flex;align-items:baseline;gap:12px}.developer-dialog-header strong{font-size:14px}.developer-dialog-header span{color:#788077;font-size:10px}.icon-button{width:34px;height:34px;display:grid;place-items:center;padding:0;border:0;background:transparent;color:#535a52;cursor:pointer;font-size:22px;line-height:1}.icon-button:hover{background:#e3e7e1}.developer-dialog-body{min-height:0;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.developer-command-pane,.developer-console-pane{min-width:0;padding:18px 20px;overflow:auto}.developer-command-pane{border-right:1px solid #d6dbd3;background:#f5f7f3}.developer-pane-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.developer-pane-heading strong{font-size:11px}.developer-pane-heading span{color:#81887f;font-size:9px}.command-catalog{border:1px solid #d4d9d1}.command-row{width:100%;min-height:50px;padding:8px 9px;display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:8px;border:0;border-bottom:1px solid #dfe3dc;background:#fbfcfa;color:#242824;text-align:left;cursor:pointer}.command-row:last-child{border-bottom:0}.command-row:hover{background:#eef4ef}.command-row code{color:#14764e;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}.command-row>span{min-width:0;display:grid;gap:2px}.command-row strong{overflow:hidden;text-overflow:ellipsis;font-size:10px;white-space:nowrap}.command-row small{overflow:hidden;text-overflow:ellipsis;color:#7a8078;font-size:9px;white-space:nowrap}.command-row em{padding:3px 5px;border:1px solid #d6dbd3;color:#727970;font-size:8px;font-style:normal;white-space:nowrap}.command-row em.write{border-color:#dfc985;color:#735d16;background:#fff9e6}.command-row em.action{border-color:#d9aaa4;color:#8d3329;background:#fff2f0}.bulk-format{margin:8px 0 12px;padding:8px 9px;display:grid;grid-template-columns:34px 76px 1fr;gap:7px;background:#edf0eb}.bulk-format code{color:#14764e;font-size:10px}.bulk-format span{font-size:10px;font-weight:700}.bulk-format small{color:#767d74;font-size:9px;text-align:right}.developer-quick{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}.custom-command{display:grid;gap:10px}.custom-command label{display:grid;gap:5px}.custom-command label>span{color:#626860;font-size:10px;font-weight:650}.custom-command input,.custom-command textarea{width:100%;border:1px solid #c8cdc5;border-radius:4px;background:#fff;color:#202520;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}.custom-command input{height:34px;padding:0 9px}.custom-command textarea{min-height:60px;padding:8px 9px;resize:vertical;line-height:1.5}.custom-command input:focus,.custom-command textarea:focus{outline:2px solid #b9ddca;border-color:#168657}.command-meta{display:flex;justify-content:space-between;gap:8px;color:#7b8279;font-size:9px}.command-meta .invalid{color:#a33e34}.command-result{margin-top:14px;border-top:1px solid #d9ddd6;padding-top:12px}.command-result>div:first-child{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}.command-result>div:first-child strong{font-size:10px}.command-result pre{min-height:96px;max-height:210px;margin:0;padding:9px;overflow:auto;background:#f0f2ee;border:1px solid #d6dbd3;color:#333833;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}.command-console{max-height:220px;margin-top:8px;overflow:auto;background:#202420;color:#dfe5df}.command-console>div{padding:7px 8px;border-bottom:1px solid rgb(255 255 255 / 7%)}.command-console span,.command-console code{display:block}.command-console span{margin-bottom:4px;color:#aeb7ae;font:9px ui-monospace,SFMono-Regular,Menlo,monospace}.command-console span.tx{color:#e5c86c}.command-console span.rx{color:#78d3a7}.command-console code{color:#dfe5df;font:9px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere;white-space:normal}.hidden{display:none!important}@media(max-width:900px){.workspace{grid-template-columns:1fr}.inspector{max-height:none;border-left:0;border-top:1px solid #ccd1ca}.stage-panel{grid-template-rows:58px minmax(520px,68vh) 50px}.developer-dialog,.ota-dialog{width:min(720px,calc(100vw - 24px));height:calc(100vh - 24px)}.developer-dialog-body,.ota-dialog-body{display:block;overflow:auto}.developer-command-pane,.developer-console-pane{overflow:visible}.developer-command-pane{border-right:0;border-bottom:1px solid #d6dbd3}.ota-file-pane,.ota-run-pane{overflow:visible}.ota-file-pane{border-right:0;border-bottom:1px solid #d6dbd3}}@media(max-width:560px){.topbar{height:auto;min-height:72px;padding:10px 14px;align-items:flex-start;gap:10px}.brand span,.connection{display:none}.device-actions{flex-wrap:wrap;justify-content:flex-end}.workspace{min-height:calc(100vh - 72px)}.canvas-stage{padding:20px}.display-shell{width:min(78vw,390px)}.stage-toolbar,.palette-bar{padding-inline:14px}.palette-bar strong{display:none}.panel-section{padding-inline:20px}.developer-dialog,.ota-dialog{width:calc(100vw - 16px);height:calc(100vh - 16px)}.developer-dialog-header{padding-inline:14px 10px}.developer-dialog-header>div{display:grid;gap:2px}.developer-command-pane,.developer-console-pane,.ota-file-pane,.ota-run-pane{padding:16px 12px}.command-row{grid-template-columns:58px minmax(0,1fr)}.command-row em{grid-column:2;justify-self:start}.bulk-format{grid-template-columns:34px 1fr}.bulk-format small{grid-column:1 / -1;text-align:left}}
