:root{--bg:#10151c;--panel:#18202a;--line:#2c3a48;--text:#e8e2d6;--muted:#9aa6b2;--accent:#e3b251;--window:#f3e3d3;--window-ink:#2a1a10;--window-frame:#d34100;--font:"Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}body{background:var(--bg);color:var(--text);font:14px/1.5 var(--font);flex-direction:column;height:100vh;margin:0;display:flex}.bar{border-bottom:1px solid var(--line);background:var(--panel);flex-wrap:wrap;align-items:center;gap:16px;padding:8px 16px;display:flex}.bar h1{margin:0 8px 0 0;font-size:16px}.bar h1 small{color:var(--muted);font-weight:400}.tabs{gap:4px;display:flex}.tabs button,.field select,#next,.panel button,#new-game,#play-mode,.play-hud button{font:inherit;color:var(--text);border:1px solid var(--line);cursor:pointer;background:#222c38;border-radius:6px;padding:4px 12px}.tabs button[aria-selected=true]{background:var(--accent);color:#1a1205;border-color:var(--accent)}.tabs button:disabled{opacity:.4;cursor:default}.field{color:var(--muted);align-items:center;gap:6px;display:flex}.layout{flex:1;min-height:0;display:flex}.stage{background:#000;flex:1;min-width:0;position:relative;overflow:hidden}.view{width:100%;height:100%;image-rendering:pixelated;cursor:grab;touch-action:none;position:absolute;inset:0}.view:active{cursor:grabbing}.view.sea{object-fit:contain;cursor:default;background:#000}.view.sea:active{cursor:default}.status{color:var(--muted);pointer-events:none;background:#000000a6;border-radius:4px;padding:2px 8px;font-size:12px;position:absolute;bottom:8px;left:8px}.panel{border-left:1px solid var(--line);background:var(--panel);flex-direction:column;flex-shrink:0;gap:8px;width:300px;padding:12px;display:flex;overflow-y:auto}.panel input[type=search]{font:inherit;width:100%;color:var(--text);border:1px solid var(--line);background:#0e141b;border-radius:6px;padding:6px 8px}.results{margin:0;padding:0;list-style:none}.results li button{text-align:left;width:100%;color:var(--text);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:4px;padding:3px 6px}.results li button:hover{background:#26323f}.port-info h2{margin:4px 0;font-size:18px}.port-info .meta{color:var(--muted);margin:0 0 8px;font-size:12px}.port-info .warn{color:#ffb36b;font-size:12px}.port-info h3{color:var(--muted);margin:12px 0 4px;font-size:13px}.events{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.events button{text-align:left;width:100%}.hint{color:var(--muted)}.dialog{background:var(--window);width:min(640px,100% - 32px);color:var(--window-ink);border:4px double var(--window-frame);gap:12px;padding:12px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 0 0 2px #3a1d0c,0 8px 24px #0009}.event-image{aspect-ratio:4/3;width:min(384px,100% - 32px);image-rendering:pixelated;border:4px double var(--window-frame);background:#000;position:absolute;top:24px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #0009}.face{width:128px;height:160px;image-rendering:pixelated;background:#000;flex-shrink:0}.face.empty{visibility:hidden}.speech{flex-direction:column;flex:1;min-width:0;display:flex}.speaker{color:#8a2c00;min-height:1.5em;font-weight:700}.text{white-space:pre-wrap;flex:1;font-size:16px}.choices{margin:4px 0;padding-left:20px}.dialog-foot{color:#7a5a40;justify-content:space-between;align-items:center;font-size:12px;display:flex}#next{color:var(--window-ink);background:#ead2b6;border-color:#b08a66}@media (width<=720px){.layout{flex-direction:column}.panel{border-left:0;border-top:1px solid var(--line);width:auto;max-height:40vh}}.facilities{grid-template-columns:repeat(3,1fr);gap:4px;margin:6px 0;display:grid}.facilities button{padding:4px 0}.facilities button:disabled{opacity:.5}details.preview summary{cursor:pointer;color:var(--muted);margin-top:8px;font-size:12px}.state{border-top:1px solid var(--line);padding-top:8px;font-size:12px}.state h3{color:var(--muted);margin:4px 0;font-size:13px}.state dl{grid-template-columns:auto 1fr;gap:2px 8px;margin:0 0 6px;display:grid}.state dt{color:var(--muted)}.state dd{font-variant-numeric:tabular-nums;margin:0}.state .time{flex-wrap:wrap;gap:4px;margin:4px 0;display:flex}.state .time button{padding:2px 8px;font-size:12px}.state .chips{flex-wrap:wrap;gap:3px;display:flex}.state .chips span{background:#26323f;border-radius:4px;padding:0 5px;font-family:ui-monospace,monospace}.state .log{max-height:140px;color:var(--muted);margin:0;padding-left:16px;overflow-y:auto}.choice{font:inherit;color:var(--window-ink);cursor:pointer;background:#ead2b6;border:1px solid #b08a66;border-radius:4px;margin:2px 0;padding:2px 10px}.choice:hover{background:#f6dfc2}.fleet{flex-direction:column;gap:4px;margin:0 0 6px;padding:0;list-style:none;display:flex}.fleet li{background:#1f2934;border-radius:6px;padding:4px 6px}.fleet strong{color:var(--accent)}.fleet .load{align-items:center;gap:6px;display:flex}.fleet .loadbar{background:#0e141b;border-radius:3px;flex:1;height:6px;overflow:hidden}.fleet .loadbar span{background:#5fa8d3;height:100%;display:block}.fleet .cargo{color:var(--muted)}.helm .meta{color:var(--muted);margin:4px 0;font-size:12px}.compass{grid-template-columns:repeat(3,1fr);gap:3px;max-width:220px;margin:4px 0;display:grid}.compass button.on{color:#000;background:#ffde59;border-color:#ffde59}.helm .primary{background:#2d6a4f;border-color:#52b788;width:100%;margin-top:4px}.view.battle{cursor:crosshair;image-rendering:pixelated}.battle-hint{background:var(--window);color:var(--window-ink);border:3px double var(--window-frame);border-radius:4px;align-items:center;gap:12px;padding:6px 12px;font-size:14px;display:flex;position:absolute;top:12px;left:50%;transform:translate(-50%)}.battle-hint button{color:var(--window-ink);background:#ead2b6;border-color:#b08a66}.stage.battle-mode .dialog{width:min(320px,46%,50% - 12px);max-height:calc(100% - 72px);padding:8px;bottom:8px;left:8px;right:auto;overflow-y:auto;transform:none}.stage.battle-mode .dialog .face{display:none}.stage.battle-mode .battle-hint{top:8px;bottom:auto;left:8px;transform:none}.stage.battle-mode .battle-hint span{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.choices button:disabled{opacity:.4;cursor:not-allowed}.stage.battle-mode .status{display:none}.original-gate{z-index:100;pointer-events:auto;background:var(--bg);color:var(--text);font:14px/1.6 var(--font);padding:clamp(16px,4vw,48px);position:absolute;inset:0;overflow-y:auto}.original-gate-body{max-width:680px;margin:0 auto}.original-gate h2{color:var(--accent);margin:0 0 16px}.original-gate h3{margin:12px 0 4px;font-size:14px}.original-gate p{overflow-wrap:anywhere}.original-gate ul{overflow-wrap:anywhere;margin-top:4px;padding-left:24px}.original-gate-actions{flex-wrap:wrap;gap:8px;display:flex}.original-gate button{font:inherit;color:var(--text);background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:6px;margin:0 8px 4px 0;padding:6px 12px}.original-gate button:hover,.original-gate button:focus-visible{border-color:var(--accent)}.original-gate button:disabled{opacity:.5;cursor:wait}.original-gate-drop{border:2px dashed var(--line);text-align:center;color:var(--muted);border-radius:8px;margin-top:16px;padding:32px 16px}.original-replace{pointer-events:auto;font-size:12px}.original-notice{z-index:3;background:var(--panel);color:var(--text);font:12px/1.5 var(--font);pointer-events:none;margin:0;padding:6px 10px;position:absolute;top:8px;left:8px;right:8px}body.play .bar,body.play .panel{display:none}.play-hud{pointer-events:none;align-items:flex-end;gap:8px;max-width:calc(100% - 160px);display:flex;position:absolute;bottom:8px;left:8px}.play-hud>div{background:#000000b3;border-radius:4px;padding:4px 10px;font-size:13px}.play-hud small{color:var(--muted);font-size:12px;display:block}.play-hud button{pointer-events:auto;flex-shrink:0}body.play .status{inset:8px 8px auto auto}body.play .stage.sea-mode #play-hud-text,body.play .stage.sea-mode .status{display:none}.play-pad{z-index:2;pointer-events:none;justify-content:center;align-items:flex-end;gap:12px;padding:8px;display:flex;position:absolute;bottom:0;left:0;right:0}.play-pad[hidden]{display:none}.play-pad button{pointer-events:auto;color:#fff;touch-action:manipulation;background:#281e14cc;border:1px solid #7a5a40;border-radius:6px;min-width:48px;min-height:44px;padding:0 6px;font-size:16px}.play-pad button:active{background:#785a3ce6}.pad-dirs{grid-template-columns:repeat(3,48px);gap:4px;display:grid}.pad-acts{grid-template-columns:repeat(2,auto);gap:4px;display:grid}@media (orientation:landscape){.play-pad{justify-content:space-between;align-items:center;padding:2px;top:0}.play-pad button{min-width:30px;min-height:36px;padding:0 2px;font-size:12px}.pad-dirs{grid-template-columns:repeat(3,30px);gap:2px}.pad-acts{gap:2px}}@media (pointer:coarse) and (orientation:landscape){body.play .view.sea{width:calc(100% - 200px);left:100px}}@media not (pointer:coarse){.play-pad{display:none!important}}.touch-esc{display:none}@media (pointer:coarse){.touch-esc{z-index:1200;color:#fff;touch-action:manipulation;background:#281e14d9;border:1px solid #7a5a40;border-radius:6px;min-width:52px;min-height:40px;font-size:14px;display:block;position:fixed;top:8px;right:8px}body.play .status{top:56px}body.play .play-hud{top:8px;bottom:auto}body.play #play-hud-keys{display:none}}
