/* MyCarOS DevCenter unified work layout */
:root{color-scheme:dark;--background:#101412;--surface:#1a201d;--surface-raised:#232b27;--surface-selected:#1f372d;--text-primary:#f4f7f5;--text-secondary:#a9b5af;--border:#37433d;--accent:#8fcdb3;--on-accent:#0d1c16;--danger:#e57373;--warning:#e6bd72;--radius-lg:26px;--radius-md:18px;--space:8px;--focus:0 0 0 3px #101412,0 0 0 6px var(--accent)}
*{box-sizing:border-box}html{background:var(--background)}body{margin:0;padding:0;background:var(--background)!important;color:var(--text-primary)!important;font:16px/1.6 system-ui,-apple-system,"PingFang SC",sans-serif;min-height:100dvh;overflow-wrap:anywhere}a{color:var(--accent)!important;text-decoration:none}button,input,select,textarea,summary,a{touch-action:manipulation}.workspace{width:min(100%,1600px);min-height:100dvh;margin:auto;display:grid;grid-template-columns:240px minmax(0,1fr)}
.side{position:sticky;top:0;align-self:start;height:100dvh;overflow:auto;padding:32px 18px;background:#131916!important;border-right:1px solid var(--border)!important}.brand{margin:0 8px 28px;font-size:19px!important;font-weight:800!important;color:var(--text-primary)}.brand small{display:block;margin-top:2px;color:var(--text-secondary)!important;font-size:12px!important;font-weight:500!important}.side nav{display:grid;gap:8px}.nav{display:flex!important;align-items:center;min-height:52px;margin:0!important;padding:10px 14px!important;border:1px solid transparent;border-radius:16px!important;color:var(--text-secondary)!important;font-weight:650;white-space:normal}.nav:hover{background:var(--surface-raised)!important;color:var(--text-primary)!important}.nav.active{background:var(--surface-selected)!important;border-color:var(--accent)!important;color:var(--text-primary)!important;box-shadow:inset 3px 0 var(--accent)}.nav-help{margin:28px 8px 0!important;color:var(--text-secondary)!important;font-size:12px!important;line-height:1.6}
.workspace>main,.workspace>main.main{width:100%;min-width:0;max-width:1180px!important;margin:0!important;padding:40px clamp(24px,4vw,64px) 64px!important}.back-link{display:inline-flex;align-items:center;min-height:44px;margin-bottom:4px;font-weight:650}.eyebrow{color:var(--accent)!important;font-size:11px!important;font-weight:800;letter-spacing:.14em!important;text-transform:uppercase}h1{margin:8px 0 12px!important;color:var(--text-primary);font-size:clamp(28px,4vw,42px)!important;line-height:1.2!important;letter-spacing:-.025em}h2{margin:0 0 14px!important;color:var(--text-primary);font-size:20px!important;line-height:1.35!important}.sub,.muted,small,p.muted{color:var(--text-secondary)!important}.sub{max-width:70ch;margin-bottom:24px!important}
.panel,.metric{min-width:0;margin:18px 0!important;padding:24px!important;background:var(--surface)!important;background-image:none!important;border:1px solid var(--border)!important;border-radius:var(--radius-lg)!important;box-shadow:none!important}.grid{gap:14px!important}.metric{margin:0!important}.metric strong{color:var(--text-primary);font-variant-numeric:tabular-nums}.row,.bar{gap:12px!important;align-items:center}.row>*,.bar>*{min-width:0}
label,.field-label{color:var(--text-secondary)!important;font-size:13px!important;font-weight:700}.field-label{display:block;margin:4px 0 6px}.field-control{flex:1;min-width:180px}input:not([type=checkbox]),select,textarea{min-height:50px;max-width:100%;margin:0!important;padding:12px 14px!important;background:var(--surface-raised)!important;border:1px solid var(--border)!important;border-radius:14px!important;color:var(--text-primary)!important;font:inherit}textarea{width:100%;resize:vertical}input::placeholder,textarea::placeholder{color:#8f9c96!important}button{min-height:50px;padding:11px 18px!important;border:1px solid var(--accent)!important;border-radius:14px!important;background:var(--accent)!important;color:var(--on-accent)!important;font:inherit;font-weight:800!important;cursor:pointer}button.ghost,button.secondary{background:var(--surface-raised)!important;border-color:var(--border)!important;color:var(--text-primary)!important}button.danger,.danger{background:#3a2425!important;border-color:#955557!important;color:#ffd9d9!important}button:disabled{opacity:.42;cursor:not-allowed}button:active:not(:disabled){filter:brightness(.9)}:is(a,button,input,select,textarea,summary):focus-visible{outline:none!important;box-shadow:var(--focus)!important}
.pill{background:var(--surface-selected)!important;color:var(--accent)!important;border:1px solid #365e4f;padding:5px 11px!important}.vehicle{margin:10px 0!important;padding:16px!important;background:var(--surface-raised)!important;border:1px solid var(--border)!important;border-radius:var(--radius-md)!important}.notice{padding:14px 16px!important;background:#2d281e!important;border:1px solid #665537!important;border-left:4px solid var(--warning)!important;border-radius:14px!important;color:#f2dfbd!important}.listing,pre{max-height:440px;overflow:auto;padding:16px!important;background:#0c110f!important;border:1px solid var(--border)!important;border-radius:14px!important;color:#d7e8df!important;font:13px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace!important;white-space:pre-wrap;overflow-wrap:anywhere}.screen,#screen,#frame{width:100%;aspect-ratio:16/9;object-fit:contain;background:#050806!important;border:1px solid var(--border)!important;border-radius:18px!important}progress{width:100%;height:10px;accent-color:var(--accent)}details.tool-group{padding:0!important;overflow:hidden}details.tool-group summary{display:flex;align-items:center;min-height:62px;padding:0 22px;cursor:pointer;color:var(--text-primary)!important;font-size:17px!important;font-weight:750;list-style-position:inside}details.tool-group[open] summary{border-bottom:1px solid var(--border);margin-bottom:0!important}details.tool-group>*:not(summary){margin-left:22px!important;margin-right:22px!important}details.tool-group>*:last-child{margin-bottom:22px!important}#status,#out,#result{min-height:48px;overflow-wrap:anywhere}#status{display:block;padding:13px 15px!important;background:var(--surface-selected)!important;border:1px solid #365e4f!important;border-radius:14px!important;color:var(--text-primary)!important}
.connection-ready{margin:0 0 16px;padding:12px 14px;border:1px solid #365e4f;border-radius:14px;background:var(--surface-selected);color:var(--accent);font-size:14px;font-weight:750}.workspace>main:has(>aside){display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:18px;align-items:start;max-width:1400px!important}.workspace>main>header{grid-column:1/-1;padding:0 0 18px!important;background:none!important;border:0!important}.workspace>main>aside,.workspace>main>article{min-width:0}.workspace>main>aside .panel:first-child,.workspace>main>article .panel:first-child{margin-top:0!important}
.share-fields{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px!important}.share-fields label{display:grid;gap:6px}.share-fields button{width:100%}.remote-view #screen:not([src]){display:none}.remote-view:has(#screen:not([src]))::before,.share-preview:has(#frame[hidden])::after{display:grid;place-items:center;min-height:300px;padding:24px;background:#0c110f;border:1px dashed #52645b;border-radius:18px;color:var(--text-secondary);text-align:center;white-space:pre-line}.remote-view:has(#screen:not([src]))::before{content:"等待连接画面"}.share-preview:has(#frame[hidden])::after{content:"等待共享画面\A连接后即可查看"}
@media(min-width:1100px){.workspace>main.dashboard-layout,.workspace>main.owner-layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-content:start}.dashboard-layout>*,.owner-layout>*{grid-column:1/-1;margin-top:0!important;margin-bottom:0!important}.dashboard-layout>.panel,.owner-layout>.panel{grid-column:auto}.dashboard-layout>.fleet-panel{grid-column:1/-1}.workspace>main.remote-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:18px;align-content:start}.remote-layout>*{grid-column:1/-1;margin:0!important}.remote-layout>.remote-controls{grid-column:1;grid-row:5/span 2}.remote-layout>.remote-view,.remote-layout>.remote-log{grid-column:2}.remote-layout>.remote-help{grid-column:1/-1}.remote-controls .bar{display:grid;grid-template-columns:1fr}.remote-controls :is(input,select,button,.field-control){width:100%;min-width:0;margin:0!important}}
@media(max-width:960px){.workspace{grid-template-columns:210px minmax(0,1fr)}.workspace>main:has(>aside){display:block}.workspace>main,.workspace>main.main{padding:28px 22px 48px!important}}
@media(max-width:720px){body{padding-bottom:max(16px,env(safe-area-inset-bottom))}.workspace{display:block}.side{position:relative;height:auto;padding:max(16px,env(safe-area-inset-top)) 14px 14px;border-right:0!important;border-bottom:1px solid var(--border)!important}.brand{margin:0 4px 14px!important}.side nav{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.nav{justify-content:center;min-height:48px!important;padding:8px 6px!important;text-align:center;font-size:12px!important;line-height:1.25;white-space:normal}.nav.active{box-shadow:inset 0 -3px var(--accent)}.nav-help{display:none}.workspace>main,.workspace>main.main{padding:24px 16px 40px!important}.panel,.metric{padding:18px!important;border-radius:20px!important}.grid{grid-template-columns:1fr!important}.metric:last-child{grid-column:auto!important}.row,.bar{align-items:stretch!important}.row button,.bar button{flex:1 1 135px}.row input,.bar input,.field-control{width:100%;flex:1 1 100%}.share-fields{grid-template-columns:1fr!important}.workspace>main:has(>aside){display:flex;flex-direction:column}.workspace>main:has(>aside)>header{order:-2}.workspace>main:has(>aside)>article{order:-1;width:100%}.workspace>main:has(>aside)>aside{width:100%}h1{font-size:30px!important}.listing,pre{max-height:360px}}
@media(max-width:390px){.side nav{grid-template-columns:repeat(2,minmax(0,1fr))}.workspace>main,.workspace>main.main{padding-left:12px!important;padding-right:12px!important}.panel{padding:16px!important}}
@media(prefers-reduced-motion:no-preference){button,.nav,a{transition:background-color .14s ease,border-color .14s ease,color .14s ease,filter .14s ease}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
