html[data-design]{color:var(--ui-ink);background:var(--ui-canvas)}
html[data-design] body,html[data-design] main{background:var(--ui-canvas);color:var(--ui-ink)}
html[data-design] body>aside,html[data-design] main>header{background:var(--ui-surface);color:var(--ui-muted);border-color:var(--ui-line)}
html[data-design] nav button{color:var(--ui-muted)}
html[data-design] nav button.active,html[data-design] nav button:hover{background:var(--ui-soft);color:var(--ui-accent)}
html[data-design] .sidebar-toggle{color:var(--ui-muted)}
html[data-design] .panel,html[data-design] .card,html[data-design] dialog,html[data-design] .overview-stat{background:var(--ui-surface);color:var(--ui-ink);border-color:var(--ui-line);border-radius:var(--ui-radius)}
html[data-design] p,html[data-design] small,html[data-design] dt,html[data-design] th,html[data-design] .model-help{color:var(--ui-muted)}
html[data-design] th,html[data-design] td,html[data-design] .aircraft,html[data-design] hr{border-color:var(--ui-line)}
html[data-design] input,html[data-design] select,html[data-design] textarea{background:var(--ui-surface);color:var(--ui-ink);border-color:var(--ui-line)}
html[data-design] button{background:var(--ui-soft);color:var(--ui-ink)}
html[data-design] .primary{background:var(--ui-accent);color:var(--ui-surface)}
html[data-design] a,html[data-design] .text-button{color:var(--ui-accent)}
html[data-design] .unified-workspace .glass{background:color-mix(in srgb,var(--ui-surface) 68%,transparent);color:var(--ui-ink);border-color:color-mix(in srgb,var(--ui-line) 70%,transparent);border-radius:var(--ui-radius)}
html[data-design] .unified-workspace .workspace-mode{background:color-mix(in srgb,var(--ui-soft) 65%,transparent)}
html[data-design] .unified-workspace .workspace-mode button,html[data-design] .unified-workspace .workspace-drawer-tabs button,html[data-design] .layers-grid button,html[data-design] .layers-close{background:transparent;color:var(--ui-ink)}
html[data-design] .workspace-mode button.active,html[data-design] .workspace-drawer-tabs button.active{background:var(--ui-surface);color:var(--ui-accent)}
html[data-design] .unified-workspace .aircraft-card,html[data-design] .unified-workspace .workspace-telemetry-grid article,html[data-design] .unified-workspace .workspace-records>h3,html[data-design] .unified-workspace .workspace-records>article,html[data-design] .unified-workspace .workspace-records>p{background:color-mix(in srgb,var(--ui-surface) 45%,transparent);color:var(--ui-ink);border-color:var(--ui-line)}
html[data-design] .unified-workspace .aircraft-card.selected,html[data-design] .layers-grid button[aria-pressed=true]{border-color:var(--ui-accent)}
html[data-design] .unified-workspace .workspace-counts b,html[data-design] .layers-toggle{color:var(--ui-accent)}
html[data-design] .unified-workspace .workspace-centre{background:color-mix(in srgb,var(--ui-surface) 68%,transparent);color:var(--ui-ink)}
html[data-design-mode=dark] .leaflet-popup-content-wrapper,html[data-design-mode=dark] .leaflet-popup-tip{background:var(--ui-surface);color:var(--ui-ink)}
html[data-design-mode=dark] .badge:not(.live):not(.stale){background:var(--ui-soft);border-color:var(--ui-line);color:var(--ui-ink)}
html[data-design] #workspace-drawer-close,html[data-design] .outline-button{background:var(--ui-surface);color:var(--ui-ink)}
.appearance-settings{margin-bottom:22px}.appearance-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.appearance-heading h2{margin-bottom:7px}.appearance-heading p{margin:0;font-size:12px}
.design-template-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}
html[data-design] .design-template{display:flex;flex-direction:column;text-align:left;gap:10px;padding:10px;border:1px solid var(--ui-line);border-radius:var(--ui-radius);background:var(--ui-surface);color:var(--ui-ink)}
html[data-design] .design-template[aria-pressed=true]{border:2px solid var(--ui-accent);padding:9px;box-shadow:0 0 0 3px var(--ui-soft)}
.design-preview{position:relative;display:block;width:100%;height:95px;border-radius:8px;background:var(--preview-bg);overflow:hidden;border:1px solid #8796a633}
.design-preview i{display:block;position:absolute}.preview-nav{left:0;top:0;bottom:0;width:22%;background:var(--preview-surface);border-right:1px solid #8796a633}.preview-nav:before{content:'';display:block;background:var(--preview-accent);height:5px;margin:13px 7px;border-radius:2px;box-shadow:0 13px 0 var(--preview-soft),0 26px 0 var(--preview-soft),0 39px 0 var(--preview-soft)}
.preview-title{top:13px;left:29%;height:5px;width:37%;border-radius:4px;background:var(--preview-accent)}.preview-block{top:32px;height:36px;width:28%;border-radius:var(--preview-radius);background:var(--preview-surface);border:1px solid #8796a622}.preview-block.one{left:29%}.preview-block.two{right:8%;background:var(--preview-soft)}.preview-line{bottom:13px;left:29%;width:62%;height:4px;border-radius:2px;background:var(--preview-soft)}
.design-name{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:13px;font-weight:700;width:100%}.design-name small{font-size:9px;letter-spacing:0;font-weight:500;border:1px solid var(--ui-line);border-radius:20px;padding:3px 7px}.design-description{font-size:11px;line-height:1.5;color:var(--ui-muted);flex:1}.design-choice{font-size:10px;font-weight:700;color:var(--ui-accent)}
#design-template-message{font-size:11px;margin:18px 0 0}
@media(max-width:560px){.design-template-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.appearance-heading{align-items:flex-start}.design-name{align-items:flex-start;flex-direction:column}.appearance-heading>.badge{white-space:nowrap}}
html[data-design] body>aside nav button:not(.active){background:transparent}
html[data-design] body>aside nav button:hover{background:var(--ui-soft);color:var(--ui-accent)}
html[data-design-mode=dark] .logo-window{background:transparent}
/* Layout families and colour palettes are independent. */
.appearance-row-heading{display:flex;align-items:center;justify-content:space-between;margin:20px 0 10px}.appearance-row-heading h3{font-size:12px;margin:0}.appearance-scroll-controls{display:flex;gap:5px}.appearance-scroll-controls button{padding:5px 10px;font-size:16px;border:1px solid var(--ui-line)}
.appearance-strip{display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;padding:4px 3px 13px;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--ui-accent) transparent;overscroll-behavior-x:contain;max-width:100%}
html[data-design] .appearance-strip .design-template{flex:0 0 178px;scroll-snap-align:start;gap:8px;min-width:0;border-radius:8px}.appearance-strip .design-preview{height:78px;flex-shrink:0}.appearance-strip .design-name{flex-direction:row;align-items:center;font-size:12px}.design-description{font-size:10px}.design-check{visibility:hidden;color:var(--ui-accent)}[aria-pressed=true]>.design-name>.design-check{visibility:visible}
html[data-design] .palette-option{flex:0 0 172px;padding:10px;border:1px solid var(--ui-line);background:var(--ui-surface);color:var(--ui-ink);display:flex;flex-direction:column;gap:10px;scroll-snap-align:start;text-align:left}html[data-design] .palette-option[aria-pressed=true]{border-color:var(--ui-accent);box-shadow:inset 0 -2px var(--ui-accent)}.palette-option>span:last-child{display:flex;justify-content:space-between;align-items:center;gap:5px;width:100%}.palette-option b{font-size:11px}.palette-option small{font-size:9px;letter-spacing:0}.palette-swatches{display:flex;overflow:hidden;border-radius:4px;height:22px;width:100%;border:1px solid var(--ui-line)}.palette-swatches i{flex:1}
html[data-design-family=hi-tech]{font-family:Consolas,monospace}html[data-design-family=hi-tech] :is(h1,h2,h3,.design-name,nav button,.workspace-mode button){font-family:Consolas,monospace;letter-spacing:.04em}html[data-design-family=hi-tech] :is(.panel,.card,.unified-workspace .glass){border-color:color-mix(in srgb,var(--ui-accent) 45%,var(--ui-line));box-shadow:inset 0 1px color-mix(in srgb,var(--ui-accent) 40%,transparent),0 0 18px color-mix(in srgb,var(--ui-accent) 9%,transparent)}html[data-design-family=hi-tech] .appearance-heading h2{border-left:3px solid var(--ui-accent);padding-left:10px;text-transform:uppercase}html[data-design-family=hi-tech] .page{background-image:linear-gradient(color-mix(in srgb,var(--ui-accent) 5%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--ui-accent) 5%,transparent) 1px,transparent 1px);background-size:28px 28px}html[data-design-family=hi-tech] button{border-radius:3px}
html[data-design-family=clean] :is(.panel,.card){box-shadow:0 8px 30px #132b4110;border-color:transparent;padding:28px}html[data-design-family=clean] h1{letter-spacing:-1.3px;font-weight:600}
html[data-design-family=legacy]{font-family:Tahoma,Arial,sans-serif;font-size:13px}html[data-design-family=legacy] :is(h1,h2,h3){font-family:Tahoma,Arial,sans-serif;letter-spacing:0}html[data-design-family=legacy] :is(.panel,.card,.unified-workspace .glass){border:1px solid var(--ui-line);box-shadow:inset 1px 1px color-mix(in srgb,var(--ui-ink) 12%,var(--ui-surface)),2px 2px 0 var(--ui-line)}html[data-design-family=legacy] :is(button,input,select){border-radius:2px;border:1px solid var(--ui-line);box-shadow:inset 0 1px #ffffff18}html[data-design-family=legacy] th{background:var(--ui-soft);padding:8px 10px}html[data-design-family=legacy] td{padding:9px 10px}
html[data-design-family=glass] .panel{background:color-mix(in srgb,var(--ui-surface) 78%,transparent);backdrop-filter:blur(20px);box-shadow:0 12px 38px color-mix(in srgb,var(--ui-accent) 10%,transparent)}html[data-design-family=glass] main{background:radial-gradient(at 90% 10%,var(--ui-soft),transparent 55%),var(--ui-canvas)}
html[data-design-family=command] :is(h1,h2,h3,th){text-transform:uppercase;letter-spacing:.08em}html[data-design-family=command] :is(.panel,.card,.unified-workspace .glass){border-left:3px solid var(--ui-accent)}html[data-design-family=command] .panel{padding:18px}html[data-design-family=command] :is(td,th){padding:10px}html[data-design-family=command] .workspace-telemetry-grid dd{font-family:Consolas,monospace}
html[data-design-family=minimal] :is(.panel,.card,.unified-workspace .glass){box-shadow:none;border-width:0 0 1px}html[data-design-family=minimal] h1{font-weight:500}html[data-design-family=minimal] button{border-radius:2px}
html[data-design-family=blueprint] .page{background-image:linear-gradient(var(--ui-line) 1px,transparent 1px),linear-gradient(90deg,var(--ui-line) 1px,transparent 1px);background-size:32px 32px}html[data-design-family=blueprint] :is(.panel,.unified-workspace .glass){border:1px dashed var(--ui-accent);box-shadow:none}html[data-design-family=blueprint] :is(h1,h2,h3,th,dt){font-family:Consolas,monospace}
html[data-design-family=studio] :is(.panel,.card){box-shadow:0 10px 25px color-mix(in srgb,var(--ui-accent) 12%,transparent)}html[data-design-family=studio] button{border-radius:14px}html[data-design-family=studio] h1{font-weight:800;letter-spacing:-1.5px}
html[data-design-family=editorial] :is(h1,h2,h3){font-family:Georgia,serif;font-weight:500;letter-spacing:0}html[data-design-family=editorial] .panel{border-width:1px 0 0;box-shadow:none}html[data-design-family=editorial] th{font-family:Georgia,serif;text-transform:none;font-size:12px;letter-spacing:0}
[data-preview-family=hi-tech]{background-image:linear-gradient(#65e8ef15 1px,transparent 1px),linear-gradient(90deg,#65e8ef15 1px,transparent 1px);background-size:10px 10px;box-shadow:inset 0 0 10px #65e8ef22}[data-preview-family=hi-tech] .preview-block{border:1px solid var(--preview-accent)}[data-preview-family=clean] .preview-block{top:28px;height:42px;box-shadow:0 3px 7px #0001}[data-preview-family=legacy] .preview-block{box-shadow:2px 2px 0 #0004;border-radius:0}[data-preview-family=glass]{background-image:radial-gradient(at 85% 50%,var(--preview-accent),transparent 80%)}[data-preview-family=glass] .preview-block{opacity:.7}[data-preview-family=command] .preview-block{border-left:3px solid var(--preview-accent)}[data-preview-family=command] .preview-title{width:60%;height:8px}[data-preview-family=minimal] .preview-nav{display:none}[data-preview-family=minimal] .preview-block{border-width:0 0 1px;background:transparent;left:10%;width:80%;height:16px;border-radius:0}[data-preview-family=minimal] .preview-block.two{top:53px}[data-preview-family=blueprint]{background-image:linear-gradient(#70baff33 1px,transparent 1px),linear-gradient(90deg,#70baff33 1px,transparent 1px);background-size:8px 8px}[data-preview-family=blueprint] .preview-block{border:1px dashed var(--preview-accent);background:transparent}[data-preview-family=studio] .preview-block{border-radius:15px;transform:rotate(-4deg)}[data-preview-family=studio] .preview-block.two{transform:rotate(4deg)}[data-preview-family=editorial] .preview-title{height:2px;box-shadow:0 5px var(--preview-accent)}[data-preview-family=editorial] .preview-block{border-radius:0;border-width:1px 0 0;background:transparent}
.unified-workspace .layers-options{width:224px;max-height:calc(100dvh - 150px);overflow-y:auto}.unified-workspace .layers-grid{display:flex;flex-direction:column;gap:4px}.unified-workspace .layers-grid button{display:flex;flex-direction:row;align-items:center;text-align:left;gap:12px;padding:6px;font-size:11px;min-height:48px;flex-shrink:0}.unified-workspace .layers-grid .layer-preview{width:54px;height:36px;flex:0 0 54px}
@media(max-width:560px){.appearance-strip .design-template{flex-basis:158px!important}.appearance-heading{align-items:flex-start}.appearance-heading>.badge{white-space:nowrap}.unified-workspace .layers-options{width:214px;max-width:calc(100vw - 34px);max-height:calc(100dvh - 180px)}}
