:root {
  --field-green: #29483b;
  --field-ink: #293e34;
  --field-paper: #f6efdf;
  --field-brass: #eac17b;
  --field-edge: #ccbb96;
}
#tasks:not([hidden]){display:grid;gap:3px;padding:0;list-style:none;font-size:11px;margin:9px 0;color:#efe5cb}
#tasks li.done{opacity:.65;text-decoration:line-through}#tasks li.active{color:#f7d18c}
#mission-chart{position:fixed;z-index:15;right:24px;top:242px;width:148px;padding:9px 11px;background:#29483be8;border:1px solid #b9b58c70;border-radius:6px;color:#f6efdf;box-shadow:0 4px 18px #152a2240}
#mission-chart summary{cursor:pointer;font:600 11px 'Segoe UI',sans-serif}#mission-chart svg{width:100%;height:190px;display:block;margin:6px 0}#mission-chart text{font:5px Arial;fill:#eddfba}#mission-chart small{font-size:9px;white-space:nowrap}.mission-label{font-size:11px;background:#f1cf83;color:#29483b;pointer-events:none}
body:has(#welcome:not([hidden])) #mission-chart{display:none}
@media(max-width:850px){#mission-chart{top:auto;bottom:78px;right:12px;width:126px}#mission-chart svg{height:148px}#mission-chart:not([open]){width:auto}#tasks:not([hidden]){font-size:9px;max-width:44vw}.mission #objective-detail{font-size:11px}}
@media(max-height:580px){#mission-chart{top:auto;bottom:72px;width:112px}#mission-chart svg{height:120px}#tasks:not([hidden]){display:none}}
body { font-family: "Segoe UI", Arial, sans-serif; }
#game-menu, #help-dialog, #station-dialog, #result-dialog, .online-welcome {
  color: var(--field-ink);
  background: var(--field-paper);
  border: 1px solid var(--field-edge);
  border-radius: 8px;
  box-shadow: 0 16px 60px #152a2280;
}
dialog::backdrop { background: #182c24ba; backdrop-filter: blur(3px); }
dialog h2, .online-welcome h2 { font-family: Georgia, serif; letter-spacing: -.045em; }
dialog h3 { line-height: 1.2; }
button:focus-visible, summary:focus-visible { outline: 3px solid #ce8c25; outline-offset: 2px; }
.primary, .craft-action {
  background: #ebc07a;
  border: 1px solid #d7a767;
  color: #263c31;
  font-weight: 750;
  border-radius: 5px;
}
.primary:hover:enabled, .craft-action:hover:enabled { background: #f9d498; }
.secondary { border-radius: 5px; color: var(--field-green); border-color: #b3b499; }
#welcome {
  padding: 14px max(5vw,env(safe-area-inset-left));
  justify-items: start;
  background: linear-gradient(90deg,#18362eeb,#234033aa 40%,#24412b20 80%);
}
.online-welcome { width: min(460px,100%); max-width: 100%; display: block; }
.online-welcome .eyebrow { color: #406348; font-size: 9px; }
.online-welcome h2 { color: #284736; }
.online-welcome details { border-radius: 4px; border-left: 3px solid #a98750; background: #e7e5d0; }
.online-welcome .field-label { font-weight: 750; }
.online-welcome input, .online-welcome select { border-radius: 5px; }
.online-welcome > p { margin-bottom: 10px; }
body:has(#welcome:not([hidden])) :is(.mission,.status,#player-labels,#world-labels,#touch-controls,#menu-toggle,.interaction,.equipment-hint) { visibility: hidden; }
.mission, .status, .interaction, .equipment-hint { text-shadow: 0 1px 3px #1d3129,0 2px 8px #283f2f99; }
.mission .mission-tag { display: block; font-size: 10px; letter-spacing: .13em; color: #fff1cc; font-weight: 800; }
.mission h1 { gap: 8px; line-height: 1.2; font-size: clamp(20px,2.2vw,33px); letter-spacing: -.035em; }
.mission h1 svg { width: 21px; height: 24px; }
.mission .distance { font-size: 13px; margin: 3px 0 0; }
.mission .distance span { font-size: 12px; margin: 0; }
.mission p { margin-left: 0; }
.mission .resource-stock { display: inline-block; border-left: 3px solid var(--field-brass); padding: 3px 8px; font-size: 12px; background: linear-gradient(90deg,#253d31dd,#253d3199); }
.gauge-caption { font-size: 10px; letter-spacing: .04em; font-weight: 750; padding-left: 34px; }
.status { width: 190px; }
.status-row, .touch-enabled .status-row { height: 19px; gap: 6px; margin: 0 0 5px; }
.status-row svg { height: 23px; width: 28px; }
.status-row .meter { border-width: 1px; height: 9px; }
.status-row .sr-only { position: static; clip: auto; margin: 0; width: auto; height: auto; font: bold 10px Consolas, monospace; }
#pressure { background: #a0d378; }
.status-row.is-warning #pressure, .status-row.is-warning #stability { background: #f2b568!important; }
.leg-health { border-radius: 3px; background: linear-gradient(to right,#365b3de8 var(--health),#744734ed var(--health)); }
.leg-health.broken { background: #983e2d; }
.repair-hint { display: none; }
#online-bar, #personal-gear {
  color: #fff6dd; background: #233d31e6; border: 1px solid #d7caa86b;
  border-radius: 6px; box-shadow: 0 2px 8px #26352822;
}
#online-bar { padding: 6px 9px; min-width: 240px; }
#online-map, #online-status { margin: 2px 0; }
#online-bar #online-status, #online-bar .online-badge { color: #dedac1; }
#online-bar button, #gear-slots button { background: #385344; color: #fff4dd; border-radius: 4px; border: 1px solid #dacdb252; }
#online-bar #leave-room { color: #ffe9c6; }
.roster-player { background: #415947; }
#personal-gear { padding: 6px 9px; }
#health { color: #f0ab8b; }
#gear-slots button.selected { background: #dfbd81; color: #283b30; }
#menu-toggle { display:block; position:absolute; left:max(22px,env(safe-area-inset-left)); bottom:max(20px,env(safe-area-inset-bottom)); z-index:6; min-height:42px; padding:7px 12px; color:#fff5e0; background:#253e33df; border:1px solid #e1cda676; border-radius:5px; }
#game-menu > small, .tool-recipe small, #field-work small { font-size:9px; letter-spacing:.13em; font-weight:800; }
#game-menu { padding:22px; width:min(385px,calc(100vw - 26px)); }
#game-menu h2 { font-size:31px; margin:4px 0 14px; }
.field-settings { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:14px; }
.field-settings button { min-height:42px; background:#fffaf0; color:#344c3b; border:1px solid #c4b899; border-radius:4px; font-size:12px; }
#station-dialog { width:min(750px,calc(100vw - 24px)); max-height:calc(100dvh - 24px); padding:0 18px 16px; }
#station-content > h2 { margin:0 -18px 12px; padding:15px 18px; color:var(--field-paper); background:var(--field-green); border-bottom:3px solid var(--field-brass); }
#station-content > h2::before { content:'PALUBNÍ STANICE'; display:block; font:750 9px/1.5 "Segoe UI",sans-serif; letter-spacing:.15em; color:#f6d69e; }
#station-content p { font-size:12px; line-height:1.4; }
.bench-stock { background:#e4e3cf; padding:6px 10px; border-left:3px solid #bb995f; font-weight:700; }
.tool-plans { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.tool-recipe { display:flex; flex-direction:column; background:#fff9ea; border:1px solid #cbbd9f; border-radius:5px; overflow:hidden; }
.tool-print { background-color:#294a40; background-image:linear-gradient(#c2ddbe15 1px,transparent 1px),linear-gradient(90deg,#c2ddbe15 1px,transparent 1px); background-size:14px 14px; }
.tool-print svg { display:block; width:100%; height:82px; }
.tool-recipe > div:nth-child(2) { padding:7px 10px; flex:1; }
.tool-recipe small { color:#6a7156; }
.tool-recipe h3 { font:700 19px/1.12 Georgia,serif; color:#2a4638; letter-spacing:-.035em; margin:5px 0; }
#station-content .tool-recipe p { margin:4px 0; }
.tool-recipe b { font-size:12px; }
.craft-action { margin:3px 8px 8px; padding:7px 8px; min-height:36px; font-size:13px; }
.craft-action:disabled { opacity:1; color:#666c59; border-color:#cac7ae; background:#e4e2d2; }
#station-content .rack-title { margin:14px 0 4px; font:700 19px Georgia,serif; }
#station-content > button { width:auto; }
#close-station { position:sticky; bottom:0; background:#29483b; color:white; min-height:42px; }
#field-work { position:absolute; pointer-events:none; z-index:4; right:max(26px,env(safe-area-inset-right)); bottom:135px; width:200px; padding:8px 12px; border-left:3px solid var(--field-brass); border-radius:4px; background:#243c31ec; color:#fff4de; }
#field-work > * { display:block; }
#field-work small { color:#e9c584; }
#field-work span { font-size:11px; }
#field-work progress { margin-top:5px; height:5px; width:100%; accent-color:#dfb570; }
@media(max-width:600px), (max-height:500px) {
  .mission .mission-tag,.gauge-caption { font-size:8px; }
  .gauge-caption { padding-left:0; }
  .mission .resource-stock { font-size:10px; margin-top:4px; }
  .mission .mode-label,.mission .driver-label { font-size:8px; }
  .status-row .sr-only { font-size:8px; }
  .status-row .meter { min-width:18px; }
  .touch-enabled .status-row, .status-row { height:14px; }
  .touch-enabled .status-row svg,.status-row svg { width:16px; height:15px; }
  #menu-toggle { bottom:max(8px,env(safe-area-inset-bottom)); left:max(12px,env(safe-area-inset-left)); min-height:40px; }
  #online-bar { min-width:0; }
  #field-work { right:12px; bottom:155px; width:160px; }
}
@media(max-width:600px) {
  #welcome { padding:8px; justify-items:center; }
  #online-bar { padding:5px 8px; top:max(6px,env(safe-area-inset-top)); }
  #online-bar #online-roster { margin:3px 0 0; }
  #online-map,#online-status { display:inline; font-size:9px; }
  #online-status::before { content:'　'; }
  body:has(#welcome[hidden]) .mission,body:has(#welcome[hidden]) .status { top:max(99px,calc(93px + env(safe-area-inset-top)))!important; }
  .tool-plans { grid-template-columns:1fr; gap:5px; }
  .tool-recipe { display:grid; grid-template-columns:60px minmax(0,1fr) 63px; align-items:center; }
  .tool-print { align-self:stretch; display:grid; place-items:center; }
  .tool-print svg { height:auto; }
  .tool-recipe > div:nth-child(2) { padding:5px 7px; }
  .tool-recipe h3 { font-size:16px; }
  #station-content .tool-recipe p { font-size:11px; }
  .craft-action { margin:0 5px 0 0; padding:5px; font-size:11px; min-height:44px; }
}
@media(max-height:500px) and (orientation:landscape) {
  .online-welcome { display:block!important; padding:16px 22px!important; }
  .online-welcome h2 { font-size:36px!important; }
  #online-bar { width:260px; top:max(6px,env(safe-area-inset-top)); }
  #online-map,#online-status { display:inline; font-size:9px; }
  #personal-gear,.touch-enabled #personal-gear { bottom:12px; left:110px; }
  #joystick { bottom:62px; }
  #field-work { bottom:115px; }
  .tool-print svg { height:45px; }
  #station-dialog { max-height:calc(100dvh - 12px); }
}
.map-strip { display:flex; align-items:center; gap:10px; background:#e6e6d3; margin:8px 0 10px; border-radius:4px; overflow:hidden; }
#map-print { width:100px; flex:none; }
#map-print svg { width:100%; display:block; }
.online-welcome .map-description { font-size:11px; line-height:1.4; margin:0; padding:3px 7px 3px 0; }
.touch-enabled .leg-health.broken::before { content:'× ' attr(data-leg); }
@media(max-height:500px) and (orientation:landscape){.online-welcome{width:min(635px,90vw)}}
#station-dialog { max-width:min(750px,calc(100vw - 24px)); }
#close-station { position:static; }
#map-title { display:none; }
#online-map { color:#e8debd; }
@media(max-width:600px) and (orientation:portrait) {
  .touch-enabled #personal-gear { left:max(100px,env(safe-area-inset-left)); bottom:max(8px,env(safe-area-inset-bottom)); padding:4px 8px; max-width:calc(100vw - 116px); }
  #gear-slots { margin-top:2px; }
  #gear-slots button { min-height:32px; }
}
@media(max-height:500px) and (orientation:landscape) {
  #station-dialog { width: min(740px,calc(100vw - 20px)); padding-bottom:6px; }
  #station-content > h2 { padding:5px 18px; margin-bottom:4px; font-size:24px; line-height:1.12; }
  #station-content > h2::before { font-size:8px; line-height:1.15; }
  #station-content .bench-stock,#craft-progress { margin:3px 0; padding:2px 6px; }
  .tool-print svg { height:38px; }
  .tool-recipe > div:nth-child(2) { padding:3px 7px; }
  .tool-recipe h3 { font-size:17px; margin:2px 0; }
  #station-content .tool-recipe p { margin:2px 0; }
  .tool-recipe { line-height:1.2; }
  .craft-action { min-height:40px; margin:1px 5px 4px; }
  #station-content .rack-title { margin-top:5px; }
  #station-content > p { margin:2px 0; }
  #close-station { min-height:40px; margin-top:5px; padding:7px 12px; }
}
@media(max-width:600px) and (orientation:portrait) {
  .touch-enabled #personal-gear:not([hidden]) { display:flex; align-items:center; gap:6px; }
  #health { font-size:11px; letter-spacing:0; }
  #gear-slots { margin:0; }
}