/* Orbital Mission Planner layout & components */
#left-panel { width: 292px; background: #1e2430; border-right: 1px solid #2a3040; display: flex; flex-direction: column; flex-shrink: 0; min-height: 0; }
#left-tabs { display: flex; background: #181e28; border-bottom: 1px solid #2a3040; }
#left-content { flex: 1; overflow: hidden; display: flex; flex-direction: column; min-height: 0; }
.pane-scroll { flex: 1; overflow-y: auto; padding: 8px; min-height: 0; }
.pane-head { padding: 8px 8px 0; }

#view-tabs { display: flex; align-items: center; background: #151b24; border-bottom: 1px solid #2a3040; flex-shrink: 0; }
#view-tabs .spacer { flex: 1; }
.vtab { padding: 6px 14px; cursor: pointer; font-size: 11px; color: #607080; border-bottom: 2px solid transparent; user-select: none; white-space: nowrap; }
.vtab:hover { color: #90b8d8; }
.vtab.active { color: #80b8e0; border-bottom-color: #4080c0; }
.busy { color: #e0a040; font-size: 10px; padding-right: 12px; animation: pulse 1s infinite; }
@keyframes pulse { 50% { opacity: .35; } }

.view { display: none; position: absolute; inset: 0; overflow: auto; }
.view.active { display: block; }
#v-orbit { overflow: hidden; }
.fill { position: absolute; inset: 0; }
.view-pad { padding: 12px; }
.view-flex { display: flex; flex-direction: column; height: 100%; }
.view-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 8px 10px; border-bottom: 1px solid #2a3040; background: #181e28; flex-shrink: 0; }
.view-bar label { color: #7090a8; font-size: 11px; display: flex; align-items: center; gap: 4px; }
.view-bar input, .view-bar select { background: #141820; border: 1px solid #252e3a; border-radius: 2px; color: #c0d0e0; padding: 2px 5px; font-size: 11px; font-family: inherit; }
.view-bar input[type=number] { width: 78px; }
.view-body { flex: 1; position: relative; min-height: 0; }
.view-split { display: flex; height: 100%; }
.view-split > div { flex: 1; position: relative; min-width: 0; }

#bottom { height: 230px; }
.legs-table td.l, .legs-table th.l { text-align: left; }
.legs-table td.expl { white-space: normal; text-align: left; color: #8aa0b4; max-width: 520px; min-width: 260px; font-size: 10.5px; }
.legs-table tr.type-launch td:first-child { border-left: 3px solid #e08040; }
.legs-table tr.type-burn td:first-child { border-left: 3px solid #4080c0; }
.legs-table tr.type-flyby td:first-child { border-left: 3px solid #50a070; }
.legs-table tr.type-entry td:first-child, .legs-table tr.type-impact td:first-child, .legs-table tr.type-landing td:first-child { border-left: 3px solid #c05050; }
.legs-table tr.type-cruise td:first-child, .legs-table tr.type-coast td:first-child { border-left: 3px solid #607080; }
.legs-table tr.total td { font-weight: bold; color: #e0f0ff; border-top: 1px solid #3a4858; }
.kv { display: grid; grid-template-columns: 200px 1fr; gap: 2px 14px; padding: 8px 12px; font-size: 11px; }
.kv .k { color: #7090a8; } .kv .v { color: #c0d8e8; word-break: break-word; }
.note-box { padding: 8px 12px; font-size: 11.5px; line-height: 1.55; color: #a8c0d0; max-width: 900px; }
.note-box h4 { color: #80b0e0; margin: 8px 0 3px; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; }

.cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; margin-bottom: 10px; }
.card { background: #1a202a; border: 1px solid #2a3040; border-radius: 4px; padding: 6px 8px; }
.card .cl { font-size: 9.5px; color: #607080; text-transform: uppercase; letter-spacing: .8px; }
.card .cv { font-size: 17px; color: #e0f0ff; margin-top: 2px; } .card .cv small { font-size: 10px; color: #7090a8; }
.card.big { grid-column: span 2; } .card.big .cv { font-size: 22px; color: #80d0a0; }
.card.warn .cv { color: #e08040; }
.lesson { background: #172230; border-left: 3px solid #4080c0; padding: 7px 9px; font-size: 11px; line-height: 1.5; color: #a8c4d8; margin: 8px 0; border-radius: 0 3px 3px 0; }
.win-list { font-size: 10.5px; } .win-list div { padding: 2px 0; border-bottom: 1px dotted #2a3040; display: flex; justify-content: space-between; gap: 6px; }
.win-list .bad { color: #b07060; } .win-list .good { color: #90d0a0; }

/* presets & lists */
.cat-chips { display: flex; flex-wrap: wrap; gap: 3px; margin: 6px 0; }
.chip { font-size: 10px; padding: 1px 7px; border-radius: 9px; border: 1px solid #2e3848; color: #8090a8; cursor: pointer; user-select: none; }
.chip.active { background: #1a3050; color: #80c0f0; border-color: #3060a0; }
.preset-row { padding: 4px 6px; border: 1px solid #2a3040; border-radius: 3px; margin-bottom: 3px; cursor: pointer; background: #1a202a; display: flex; gap: 6px; align-items: baseline; }
.preset-row:hover { border-color: #4080c0; background: #1a2840; }
.preset-row .pn { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.preset-row .pd { color: #80c8a0; font-size: 10.5px; flex-shrink: 0; }
.preset-row.bad .pd { color: #c06050; }
.search { width: 100%; background: #141820; border: 1px solid #252e3a; border-radius: 2px; color: #c0d0e0; padding: 4px 6px; font-size: 11px; font-family: inherit; }
.list-item .meta { color: #6f90a8; font-size: 10px; }
.list-item .src { font-size: 9px; color: #5080a0; border: 1px solid #2e4058; border-radius: 3px; padding: 0 3px; }

/* AI chat */
#ai-wrap { display: flex; flex-direction: column; height: 100%; min-height: 0; }
#ai-status { padding: 6px 8px; font-size: 10.5px; border-bottom: 1px solid #2a3040; background: #181e28; }
#ai-status .dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #805040; margin-right: 5px; }
#ai-status .dot.on { background: #50c080; }
#ai-log { flex: 1; overflow-y: auto; padding: 8px; min-height: 0; }
.msg { margin-bottom: 8px; padding: 6px 8px; border-radius: 4px; font-size: 11.5px; line-height: 1.5; white-space: pre-wrap; word-break: break-word; }
.msg.user { background: #1a3050; color: #d0e4f4; }
.msg.bot { background: #1a202a; border: 1px solid #2a3040; }
.msg.tool { background: #151b24; color: #6f90a8; font-size: 10px; font-family: monospace; cursor: pointer; }
.msg.tool.err { color: #c08060; }
.msg.sys { color: #607080; font-size: 10px; background: none; }
.proposal { border: 1px solid #3060a0; background: #172230; border-radius: 4px; padding: 7px 9px; margin: 6px 0; font-size: 11px; }
.proposal .pt { color: #90c8f0; font-weight: bold; margin-bottom: 3px; }
.proposal .pk { color: #80d0a0; } .proposal .pb { margin-top: 5px; display: flex; gap: 5px; }
#ai-input-row { display: flex; gap: 4px; padding: 6px; border-top: 1px solid #2a3040; background: #181e28; }
#ai-input { flex: 1; background: #141820; border: 1px solid #252e3a; color: #c0d0e0; padding: 5px 7px; font-family: inherit; font-size: 11.5px; resize: none; height: 54px; border-radius: 2px; }
.ai-sugg { padding: 0 8px 6px; display: flex; flex-wrap: wrap; gap: 3px; }

.learn-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 10px; padding: 12px; }
.learn-card { background: #181e28; border: 1px solid #2a3040; border-radius: 5px; padding: 10px 12px; font-size: 11.5px; line-height: 1.55; }
.learn-card h3 { color: #80b8e0; font-size: 13px; margin-bottom: 5px; }
.learn-card code, .eq { font-family: Consolas, monospace; color: #e0c890; background: #141820; padding: 1px 4px; border-radius: 2px; }
.learn-card .try { margin-top: 6px; }
table.simple { border-collapse: collapse; font-size: 11px; width: 100%; }
table.simple th { text-align: left; color: #7090a8; font-weight: normal; padding: 3px 8px; border-bottom: 1px solid #2a3040; position: sticky; top: 0; background: #181e28; }
table.simple td { padding: 3px 8px; color: #a8c0d0; border-bottom: 1px dotted #232b38; }
table.simple tr.click:hover td { background: #22304a; cursor: pointer; }
.mini-form { display: grid; grid-template-columns: auto 1fr; gap: 4px 8px; align-items: center; font-size: 11px; margin: 8px 0; }

body.light #left-panel, body.light #right-panel { background: #e6e9ee; border-color: #c6ccd6; }
body.light #menubar, body.light #view-tabs, body.light #left-tabs, body.light #panel-tabs, body.light .bottom-tabs, body.light #statusbar, body.light .view-bar, body.light #ai-status, body.light #ai-input-row { background: #dfe3ea; border-color: #c0c6d0; }
body.light #workspace-container, body.light #bottom, body.light .view { background: #eef0f3; }
body.light .card, body.light .list-item, body.light .preset-row, body.light .msg.bot, body.light .learn-card, body.light .proposal { background: #f7f8fa; border-color: #c6ccd6; color: #22262c; }
body.light .card .cv, body.light .kv .v, body.light .data-table td, body.light table.simple td, body.light .note-box { color: #22262c; }
body.light .prop-value, body.light .prop-select, body.light .search, body.light #ai-input, body.light .view-bar input, body.light .view-bar select { background: #fff; color: #22262c; border-color: #b8c0cc; }
body.light .data-table th { background: #dfe3ea; }
body.light .lesson { background: #e2ecf6; color: #22303c; }
body.light .msg.user { background: #cfe0f2; color: #14202c; }

h4.sec { color: #80b0e0; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; margin: 12px 0 6px; border-bottom: 1px solid #252d3a; padding-bottom: 3px; }
#st-scene, #c-body { position: relative; }
.view-split > div { overflow: hidden; }
#v-launch .view-split > div, #v-stars .view-split > div:first-child { overflow: auto; }
.mini-form .prop-value, .mini-form .prop-select { width: 100%; min-width: 0; }