:root{color-scheme:dark;font:14px system-ui,sans-serif;background:#102632;color:#e2ebe5}*{box-sizing:border-box}body{margin:0;overscroll-behavior:none}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border:1px solid #9ab6b25c;border-radius:9px;background:#203e4d;min-height:44px;min-width:44px;padding:8px 13px;cursor:pointer}button:hover{background:#315361}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible{outline:2px solid #d4d8ae;outline-offset:3px}header{height:57px;max-width:1240px;margin:auto;padding:6px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}header a{font-size:11px;color:#a8c1c4;text-decoration:none;min-height:44px;display:flex;align-items:center}header>b{font-size:19px;letter-spacing:3px}header>b span{color:#bacfb9}nav{display:flex;gap:6px}nav button{padding:6px 9px}main{max-width:1210px;margin:auto;height:calc(100dvh - 57px);min-height:460px;max-height:1050px;display:grid;grid-template-rows:58px minmax(200px,1fr) 84px 57px 23px;padding:0 12px 7px;gap:6px}.topline{display:flex;gap:8px;align-items:center}.topline>div{flex:1}.topline small{font-size:9px;letter-spacing:1px;color:#91adb5}.topline h1{font:500 23px Georgia,serif;margin:3px 0}.topline button{background:transparent;font-size:20px}#scene{position:relative;overflow:hidden;border:1px solid #8baaa46b;border-radius:13px;background:#2b6174}#sea{width:100%;height:100%;display:block;touch-action:none}.battle-head{position:absolute;top:12px;left:13px;right:13px;display:flex;gap:8px;align-items:center;pointer-events:none;font-size:10px}.battle-head span{background:#153440db;border:1px solid #8aa9a33b;border-radius:7px;padding:6px 9px;line-height:1.5}#phase{color:#cbdcba}#objective{margin:auto;max-width:60%;text-align:center}#round{color:#c4d9d6}.view-tools{position:absolute;right:10px;top:58px;display:grid;gap:5px}.view-tools button{background:#163746c9;font-size:20px;padding:5px}.fleet{display:flex;gap:7px;overflow-x:auto;padding:2px 0}.ship-card{display:grid;grid-template-columns:68px 1fr;gap:8px;align-items:center;min-width:190px;flex:1;max-width:320px;background:#193745;text-align:start;padding:5px 10px;border-color:#74979b44}.ship-card.selected{border-color:#d0d8ac;background:#2c4c55}.ship-card.dead{opacity:.35}.ship-card canvas{width:68px;height:62px}.ship-card b{display:block;font-size:12px;font-weight:600}.ship-card small{font-size:10px;color:#aac2c1;display:block;margin:4px 0}.ship-card i{height:3px;background:#0d2937;display:block;max-width:150px}.ship-card em{height:3px;background:#b6cfb0;display:block}.command{display:flex;gap:10px;align-items:stretch;justify-content:space-between}.tools{display:flex;gap:5px;overflow-x:auto}.tools button{min-width:55px;min-height:49px;padding:4px 7px}.tools button b{display:block;font-size:20px;font-weight:400;line-height:1}.tools button span{display:block;font-size:9px;margin-top:4px}.tools .active{background:#4d6c6d;border-color:#d1d8b1}.primary{background:#c8d4b3;color:#193b45;font-weight:700;border-color:#e0e3c5}.primary:hover{background:#dbe1c5}#execute{min-width:185px;white-space:nowrap}#execute.executing{background:#607e82;color:#e3eae2;border-color:#9fbbb4}.status{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:#99b7bc;overflow:hidden;white-space:nowrap}.status span{overflow:hidden;text-overflow:ellipsis}#cover{position:absolute;inset:0;background:linear-gradient(90deg,#122e3bc9,#173a4944 70%,#16364311);display:flex;align-items:center;padding:30px;backdrop-filter:blur(.7px)}#cover[hidden]{display:none}.intro{max-width:460px;background:#133340ed;border:1px solid #9bb5a777;border-radius:15px;padding:28px;box-shadow:0 20px 70px #0b24364d}.intro>small{font-size:9px;letter-spacing:2px;color:#b7c7ab}.intro h2{font:400 clamp(30px,4vw,48px)/1.12 Georgia,serif;margin:15px 0;color:#e2e9da}.intro p{font-size:12px;color:#abc4c7;line-height:1.8;max-width:340px}.intro-actions{display:flex;gap:8px;margin-top:21px;flex-wrap:wrap}.intro-actions button{font-size:12px}.intro-note{display:block;font-size:9px;color:#9bb6b5;margin-top:16px}#toast{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);font-size:12px;text-align:center;max-width:85%;padding:8px 12px;background:#153745ed;border:1px solid #a8b99a66;border-radius:8px;pointer-events:none}#toast:empty{display:none}dialog{background:#173644;color:#dce7df;border:1px solid #96b3a9;border-radius:14px;width:min(760px,94vw);max-height:87dvh;padding:19px}dialog::backdrop{background:#091f2dd4}.dialog-head{display:flex;justify-content:space-between;gap:12px;align-items:center;position:sticky;top:-19px;background:#173644;z-index:3;padding:5px 0 10px}.dialog-head h2{font-size:21px;margin:0;outline:none}#body{margin-top:14px}.settings{display:grid;gap:12px}.settings label{display:flex;justify-content:space-between;gap:15px;padding:9px 0;border-bottom:1px solid #7e9d9c44;font-size:12px}.settings input[type=range]{width:45%;accent-color:#bfd0b3}.settings input[type=checkbox]{width:22px;height:22px;accent-color:#bfd0b3}.region-tabs{display:flex;gap:5px;margin-bottom:13px;flex-wrap:wrap}.region-tabs button{font-size:11px;flex:1}.mission-list{display:grid;gap:7px}.mission-row{display:grid;grid-template-columns:35px 1fr auto;align-items:center;gap:10px;padding:11px;background:#234654;border:1px solid #7e9e9877;border-radius:10px;text-align:start;width:100%}.mission-row>small{font-size:10px;color:#a8c1be}.mission-row b{font-size:13px;display:block}.mission-row span small{display:block;font-size:10px;color:#b7c5ae;margin-top:4px}.dock-balance{display:flex;justify-content:space-between;font-size:12px;color:#bbd2be;margin-bottom:12px}.dock-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.dock-ship{border:1px solid #72928d77;border-radius:12px;padding:11px;background:#1c3e4c}.dock-ship.equipped{border-color:#c8d6ae}.dock-ship canvas{display:block;width:100%;height:135px}.dock-ship h3{font-size:14px;margin:7px 0}.dock-ship p{font-size:10px;color:#a5c0c0;line-height:1.7;min-height:35px}.dock-ship button{font-size:11px;padding:6px 9px;width:100%;margin-top:6px}.dock-ship small{font-size:10px;display:block;color:#a8c3bf}.upgrade-row{display:grid;grid-template-columns:1fr auto;gap:12px;padding:13px 0;border-bottom:1px solid #88a69c44;align-items:center}.upgrade-row b{font-size:13px}.upgrade-row small{display:block;line-height:1.7;font-size:11px;color:#abc4c0}.upgrade-row button{font-size:11px}.style-options{display:flex;gap:7px;margin:15px 0}.style-options button{flex:1;font-size:11px}.help-grid{display:grid;grid-template-columns:50px 1fr;gap:15px;align-items:center;font-size:12px;line-height:1.8}.help-grid b{font-size:27px;text-align:center;color:#c6d3af}.results{text-align:center;line-height:1.8}.results>strong{font:500 48px Georgia,serif;color:#cedbb7}.results h3{font-size:24px}.results p{font-size:12px;color:#b2c9c6}.result-buttons{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.end-score{font-size:24px;color:#cbd7b8;margin:15px}html[dir=rtl] h1,html[dir=rtl] h2{font-family:system-ui,sans-serif}html[dir=rtl] .intro h2{font-size:36px;line-height:1.5}html[dir=rtl] #cover{background:linear-gradient(-90deg,#122e3bcb,#173a4944 70%,#16364311)}
@media(max-width:600px){header{height:51px;padding:4px 8px;gap:7px}header>b{font-size:15px;letter-spacing:1.5px}header a{font-size:10px}nav{gap:4px}main{height:calc(100dvh - 51px);padding:0 6px 5px;grid-template-rows:48px minmax(190px,1fr) 74px 99px 18px;gap:5px;min-height:440px}.topline h1{font-size:18px}.topline small{font-size:8px;letter-spacing:0}.topline button{min-width:42px;padding:5px}.battle-head{top:7px;left:6px;right:6px;gap:4px;font-size:8px}.battle-head span{padding:5px 6px}#objective{max-width:59%}.view-tools{right:6px;top:51px}.view-tools button{min-width:40px;min-height:40px}.ship-card{min-width:145px;padding:4px 6px;grid-template-columns:47px 1fr;gap:5px}.ship-card canvas{width:47px;height:56px}.ship-card b{font-size:10px}.ship-card small{font-size:9px}.command{display:grid;grid-template-columns:1fr;gap:5px}.tools{justify-content:space-between;overflow:visible}.tools button{flex:1;min-width:41px;min-height:46px;padding:4px 3px}.tools button b{font-size:18px}.tools button span{font-size:8px}#execute{min-height:44px;font-size:12px}.status{font-size:8px}#cover{padding:12px;align-items:center}.intro{padding:20px;max-width:320px}.intro h2{font-size:33px}.intro p{font-size:11px}.intro>small{font-size:8px}.intro-actions{margin-top:14px}.intro-note{font-size:8px}html[dir=rtl] .intro h2{font-size:28px}.dock-grid{grid-template-columns:repeat(2,1fr);gap:7px}.dock-ship{padding:8px}.dock-ship canvas{height:115px}.dock-ship h3{font-size:12px}.dialog-head h2{font-size:18px}.region-tabs button{padding:6px;font-size:10px}.help-grid{font-size:11px;gap:12px}.mission-row{padding:9px;gap:6px;grid-template-columns:27px 1fr auto}}
@media(max-height:500px) and (min-width:600px){header{height:42px}main{height:calc(100dvh - 42px);min-height:290px;grid-template-rows:36px minmax(100px,1fr) 58px 45px 16px;gap:3px}.topline h1{font-size:16px}.ship-card{min-width:170px;grid-template-columns:50px 1fr;padding:2px 6px}.ship-card canvas{width:50px;height:48px}.tools button{min-height:43px}.tools button b{font-size:16px}.tools button span{font-size:8px}.intro{padding:14px 21px;max-width:420px}.intro h2{font-size:28px;margin:8px 0}.intro p{font-size:10px}.intro-actions{margin-top:9px}.intro-note{display:none}html[dir=rtl] .intro h2{font-size:24px}.view-tools{top:47px;display:flex}.view-tools button{min-height:36px;min-width:36px}.battle-head{top:6px;font-size:8px}}

#trainer[hidden]{display:none}#trainer{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);width:min(630px,93%);display:flex;align-items:center;gap:14px;background:#132f3ff2;border:1px solid #b7ceab;border-radius:12px;padding:10px 13px;box-shadow:0 5px 22px #0b243650}#trainer>div{flex:1;min-width:0}#trainer small{color:#bfcea5;font-size:9px;letter-spacing:1px}#trainer p{margin:4px 0 0;font-size:12px;line-height:1.7}#trainer button{font-size:10px;flex:none}#scene.training #toast{bottom:100px}.teach-focus{outline:2px solid #e3d99a;outline-offset:-3px;box-shadow:0 0 12px #d6d9a936}#sea.teach-focus{box-shadow:none}#undo{font-size:23px}.tools button{min-width:49px}.status{font-size:11px}.tools button span{font-size:10px}@media(max-width:600px){#trainer{bottom:6px;gap:7px;padding:7px 9px}#trainer p{font-size:10px;line-height:1.6}#trainer small{font-size:8px}#trainer button{font-size:9px;min-width:48px;padding:6px}.tools button{min-width:37px}.tools button span{font-size:9px}.status{font-size:9px}.topline h1{font-size:17px}}

#seaStatus[hidden]{display:none}#seaStatus{position:absolute;top:53px;left:12px;max-width:74%;min-height:32px;padding:5px 10px;font-size:10px;background:#193e4be8;color:#c7d7c2;border-color:#a6b6a355}.danger{color:#edc6a4!important;border-color:#d2a87d!important}.sea-detail{line-height:1.9;font-size:13px}.sea-detail button{margin:9px 4px 0}.sea-glyph{font-size:43px;color:#ced6ad}.subtle{font-size:11px;color:#a8c4c2;line-height:1.8}.sea-summary{font-size:12px;color:#c8d8be}.sea-list{display:grid;gap:7px}.sea-row{display:flex;align-items:center;justify-content:space-between;width:100%;font-size:12px}.sea-row small{color:#a7c2bf}.region-events{font-size:10px;color:#b7c8b0;line-height:1.8}#seaChart{display:block;width:100%;height:auto;border:1px solid #759a99;border-radius:10px;touch-action:manipulation}#body details{font-size:11px;color:#a9c5c2;line-height:1.8;margin-top:16px}.view-tools{z-index:1}@media(max-width:600px){#seaStatus{top:43px;left:6px;font-size:9px;max-width:76%;min-height:30px;padding:4px 7px}.sea-detail{font-size:12px}.view-tools{top:79px}}@media(max-height:500px) and (min-width:600px){#seaStatus{top:39px;min-height:28px;font-size:9px}.view-tools{top:37px}}

.captain-banner{width:100%;text-align:start;margin:3px 0 15px;border-color:#c4cf9d;color:#d9e0b8}.captain-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.captain-card{padding:12px;border:1px solid #799e9788;border-radius:12px;background:#1c3d4b}.captain-card.equipped{border-color:#d4d9a2}.captain-card canvas{display:block;width:100%;height:100px}.captain-card h3{font-size:13px}.captain-card p{font-size:11px;line-height:1.8;color:#abc5bd;min-height:82px}.captain-card button{width:100%;font-size:11px}#bossStatus[hidden]{display:none}#bossStatus{position:absolute;bottom:12px;left:12px;max-width:85%;min-height:36px;padding:7px 11px;font-size:11px;background:#173a48ed;border-color:#d6b98a99;color:#e7d4b0}.tools button{min-width:52px}@media(max-width:600px){.captain-grid{grid-template-columns:repeat(2,1fr);gap:7px}.captain-card{padding:9px}.captain-card p{font-size:10px;min-height:90px}.captain-card h3{font-size:12px}.tools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.tools button{min-width:0;min-height:40px}.tools button span{font-size:9px}.command{gap:5px}main{grid-template-rows:48px minmax(180px,1fr) 74px 133px 18px}#bossStatus{bottom:7px;left:7px;font-size:10px;max-width:92%}}
@media(max-width:600px) and (max-height:600px){main{min-height:380px;grid-template-rows:42px minmax(125px,1fr) 60px 125px 15px;gap:4px}.tools button{min-height:38px}.ship-card canvas{height:46px}.ship-card{min-width:145px}.view-tools{top:43px;display:flex;gap:4px}.view-tools button{min-width:36px;min-height:36px;font-size:18px}#seaStatus{max-width:calc(100% - 145px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topline h1{font-size:15px}}

.captain-card canvas{width:120px;height:100px;max-width:100%;margin:0 auto;object-fit:contain}