:root{--ink: #2c1d10;--ink-soft: #6e5235;--paper: #f3e7cc;--paper-2: #e6d3a9;--brass: #e2b65a;--brass-hi: #f7dc94;--navy: #10283f;--navy-2: #1a3b5c;--wood: #4a2c15;--red: #a3341f;--green: #2f6b2a;--shadow: 0 10px 30px rgba(0, 0, 0, .45);--font: "Alegreya", "Palatino Linotype", Georgia, serif;--font-title: "Cinzel", "Trajan Pro", Georgia, serif}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--navy);color:var(--ink);font-family:var(--font);font-weight:500;font-size:15px;user-select:none;-webkit-user-select:none}#app{position:fixed;inset:0}#view{position:absolute;inset:0;width:100%;height:100%;display:block}#labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}#ui{position:absolute;inset:0;pointer-events:none}#ui>*{pointer-events:auto}button,input,select{font-family:inherit}b{font-weight:700}.btn{font-family:var(--font);font-weight:700;font-size:15px;color:#fbeccb;background:var(--img-grain),linear-gradient(#7b4a24,#4e2c12);border:1px solid #2a1607;border-radius:6px;box-shadow:inset 0 1px #ffe1a059,0 2px 5px #00000059;padding:7px 14px;cursor:pointer;white-space:nowrap;transition:filter .12s,transform .06s}.btn:hover{filter:brightness(1.18)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:default;filter:none;transform:none}.btn.small{padding:3px 9px;font-size:13px}.btn.active{background:linear-gradient(#d6a64a,#9b6b1e);color:#2c1d10}.btn.danger{background:linear-gradient(#b4442f,#6c1e12)}.btn.primary{background:linear-gradient(#e4bb5f,#b0812e);color:#2c1d10}.parchment{background:var(--img-paper),linear-gradient(170deg,#f7ecd4,#e9d6ad);border:1px solid #b08d58;border-radius:10px;box-shadow:var(--shadow),inset 0 0 50px #96693238;color:var(--ink)}.wood{background:var(--img-grain),linear-gradient(#5b371b,#3a210e);border:1px solid #221306;color:#f8e7c2;text-shadow:0 1px 2px rgba(0,0,0,.6)}h1,h2,h3{font-family:var(--font-title);font-weight:600;margin:0;letter-spacing:.02em}.overlay{position:absolute;inset:0;background:#06101c80;backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;animation:fade-in .15s ease-out}@keyframes fade-in{0%{opacity:0}}.window{position:relative;min-width:420px;max-width:min(980px,96vw);max-height:92vh;display:flex;flex-direction:column;animation:pop-in .18s ease-out}@keyframes pop-in{0%{transform:scale(.97);opacity:0}}.window>header{display:flex;align-items:center;gap:12px;padding:12px 18px 10px;border-bottom:1px solid rgba(110,82,53,.35)}.window>header h2{font-size:24px;flex:1;color:var(--ink)}.window>.body{padding:14px 18px 18px;overflow:auto}.window>footer{padding:10px 18px;display:flex;gap:8px;justify-content:flex-end;border-top:1px solid rgba(110,82,53,.3)}.muted{color:var(--ink-soft)}.muted-light{color:#e8d7b0;font-size:13px;font-weight:500}.good{color:var(--green);font-weight:700}.bad{color:var(--red);font-weight:700}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.col{display:flex;flex-direction:column;gap:8px}.grow,.spacer{flex:1}table.grid{border-collapse:collapse;width:100%;font-size:15px}table.grid th{text-align:left;font-weight:700;color:var(--ink-soft);border-bottom:2px solid rgba(110,82,53,.4);padding:5px 7px;font-size:13px;text-transform:uppercase;letter-spacing:.04em}table.grid td{padding:4px 7px;border-bottom:1px solid rgba(110,82,53,.15)}table.grid tr:hover td{background:#fff8dc80}table.grid td.num,table.grid th.num{text-align:right;font-variant-numeric:tabular-nums}.menu-screen{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 40%,#10283f33,#06101cd9),var(--img-overview) center / cover,var(--navy);display:flex;align-items:center;justify-content:center}.menu-screen .menu-box{width:420px;padding:30px 34px;text-align:center}.menu-box h1{font-size:40px;line-height:1.05;color:#3a230f;font-weight:800}.menu-box .subtitle{margin:8px 0 24px;color:var(--ink-soft);font-size:15px;font-style:italic}.menu-box .btn{display:block;width:100%;margin:10px 0;font-size:18px;padding:10px}.menu-foot{position:absolute;bottom:10px;right:14px;color:#d9c9a0;font-size:12px;text-shadow:0 1px 2px #000}.newgame label{display:block;text-align:left;margin:12px 0 4px;color:var(--ink-soft);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.04em}.newgame input,.newgame select{width:100%;font-size:16px;padding:7px 9px;border:1px solid #b08d58;border-radius:6px;background:#fbf3e0;color:var(--ink)}.loading{position:absolute;inset:0;background:radial-gradient(ellipse at center,var(--navy-2),#050d16);display:flex;align-items:center;justify-content:center}.loading .bar{width:min(420px,80vw);height:8px;border-radius:4px;background:#ffffff1f;overflow:hidden;margin-top:10px}.loading .bar>div{height:100%;width:0%;background:linear-gradient(90deg,var(--brass),var(--brass-hi));transition:width .2s}.loading .msg{color:#f2e2bd;font-family:var(--font-title);font-size:20px;text-align:center}.missing-assets{max-width:640px;padding:24px 28px}.topbar{position:absolute;top:0;left:0;right:0;height:46px;display:flex;align-items:center;gap:18px;padding:0 14px;border-width:0 0 1px;box-shadow:0 3px 12px #00000073;font-size:16px}.topbar .stat{display:flex;align-items:center;gap:6px}.topbar .stat b{color:#fff3d2;font-size:17px}.topbar .speed{display:flex;gap:3px}.wind{width:32px;height:32px;border-radius:50%;border:2px solid var(--brass);background:radial-gradient(#25557f,#0d2741);position:relative}.wind:after{content:"";position:absolute;left:50%;top:50%;width:4px;height:24px;margin:-12px 0 0 -2px;background:linear-gradient(var(--brass-hi),#fff 45%,transparent 46%);transform:rotate(var(--wind, 0deg));border-radius:2px}.side-panel{position:absolute;top:60px;right:12px;width:310px;max-height:calc(100vh - 300px);overflow:auto;padding:14px 16px;font-size:15px}.side-panel h3{font-size:20px;margin-bottom:2px}.side-panel .ship-line{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid rgba(110,82,53,.18)}.side-panel .actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.bar-mini{height:7px;background:#3c1e0a33;border-radius:4px;overflow:hidden;width:80px;display:inline-block;vertical-align:middle}.bar-mini>i{display:block;height:100%;background:var(--green)}.convoy-list{position:absolute;left:12px;top:60px;width:230px;padding:10px;font-size:15px}.convoy-list h3{font-size:16px;margin:2px 4px 6px}.convoy-list .item{padding:6px 8px;border-radius:6px;cursor:pointer;display:flex;justify-content:space-between;gap:6px}.convoy-list .item:hover{background:#fff0c899}.convoy-list .item.sel{background:#b0812e4d}.minimap{position:absolute;right:12px;bottom:12px;width:260px;height:190px;border:2px solid #b08d58;border-radius:8px;box-shadow:var(--shadow);background:#16405f;overflow:hidden;cursor:crosshair}.minimap canvas{width:100%;height:100%;display:block}.toasts{position:absolute;left:50%;bottom:84px;transform:translate(-50%);display:flex;flex-direction:column-reverse;gap:6px;pointer-events:none;align-items:center}.toast{padding:8px 18px;border-radius:8px;font-size:15px;animation:toast-in .25s ease-out;max-width:70vw}@keyframes toast-in{0%{opacity:0;transform:translateY(10px)}}.help-hint{position:absolute;left:12px;bottom:12px;padding:7px 12px;font-size:13px;max-width:460px;border-radius:8px;opacity:.92}.town-label{position:absolute;transform:translate(-50%,-100%);white-space:nowrap;font-size:14px;font-weight:700;color:#fffaf0;text-shadow:0 0 3px #000,0 1px 2px #000,0 0 8px rgba(0,0,0,.6);display:flex;align-items:center;gap:5px;pointer-events:auto;cursor:pointer;padding:1px 6px;border-radius:4px}.town-label img{width:18px;height:12px;border:1px solid rgba(0,0,0,.6);border-radius:1px}.town-label.capital{font-size:16px;font-family:var(--font-title)}.town-label.docked{background:#10283fbf;color:#9fe6ff}.town-label:hover{color:var(--brass-hi)}.town-label.hidden{display:none}.town-bar{position:absolute;left:50%;bottom:14px;transform:translate(-50%);display:flex;gap:6px;padding:8px;border-radius:10px}.town-btn{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:82px;padding:6px 10px}.town-btn .ico{font-size:20px;line-height:1}.town-btn.sail{margin-left:12px;background:linear-gradient(#2c6a9a,#173f60)}.town-title{position:absolute;top:58px;left:50%;transform:translate(-50%);padding:7px 22px;font-size:24px;border-radius:10px;display:flex;gap:10px;align-items:center;font-family:var(--font-title)}.town-title img{height:18px;border-radius:2px}.town-title .sub{font-family:var(--font);font-size:14px;opacity:.85}.building-tip{position:absolute;padding:6px 12px;font-size:15px;pointer-events:none;transform:translate(-50%,-130%);border-radius:8px;white-space:nowrap;text-align:center}.tags{position:absolute;inset:0;pointer-events:none}.building-tag{position:absolute;left:0;top:0;pointer-events:auto;cursor:pointer;background:#140c05b8;color:#fbe8bf;border:1px solid rgba(226,182,90,.6);padding:2px 9px;border-radius:12px;font-size:13px;font-weight:700;white-space:nowrap}.building-tag:hover{background:#b0812ef2;color:#2c1d10}.trade-table .good-name{display:flex;align-items:center;gap:6px;font-weight:700}.trade-amounts{display:flex;gap:4px}.price-hint{font-size:12px}.ship-card{display:flex;gap:14px;align-items:center;padding:9px 6px;border-bottom:1px solid rgba(110,82,53,.22)}.ship-card .pic{width:120px;height:90px;flex:none;object-fit:contain}.ship-card .info{flex:1;font-size:14px}.ship-card .info b{font-size:17px}.stats{display:grid;grid-template-columns:repeat(4,auto);gap:2px 12px;font-size:13px;color:var(--ink-soft)}.stats span b{color:var(--ink)}.battle-hud{position:absolute;left:50%;bottom:12px;transform:translate(-50%);padding:10px 14px;display:flex;gap:14px;align-items:center;border-radius:10px}.battle-hud .group{display:flex;gap:4px;align-items:center}.battle-ships{position:absolute;top:12px;left:12px;padding:10px 12px;font-size:14px;min-width:240px}.battle-ships.enemy{left:auto;right:12px}.battle-ships .s{margin:5px 0}.battle-ships .s.dead{opacity:.45;text-decoration:line-through}.hp{height:6px;border-radius:3px;background:#00000040;overflow:hidden;margin-top:2px}.hp>i{display:block;height:100%}.reload{width:70px;height:8px;background:#0006;border-radius:4px;overflow:hidden}.reload>i{display:block;height:100%;background:var(--brass)}.battle-banner{position:absolute;top:30%;left:50%;transform:translate(-50%,-50%);padding:24px 44px;text-align:center}.battle-banner h1{font-size:44px}:root{--ui-scale: 1}#ui{zoom:var(--ui-scale)}#town-tags,.building-tip{zoom:calc(1 / var(--ui-scale))}body.no-tags #town-tags{display:none}body.no-tips .building-tip{display:none!important}.settings{width:560px;max-width:86vw;min-height:380px;overflow-x:hidden}.set-row{display:grid;grid-template-columns:1fr 240px;gap:16px;align-items:center;padding:9px 2px;border-bottom:1px solid rgba(90,60,30,.18)}.set-label{font-weight:700}.set-help{font-size:13px;color:var(--ink-soft);margin-top:2px}.set-slider{display:flex;align-items:center;gap:10px}.set-slider input[type=range]{flex:1;accent-color:#8a5a2b}.set-value{min-width:44px;text-align:right;font-variant-numeric:tabular-nums}.set-row select{width:100%;padding:5px 8px;font:inherit;background:#f6ecd6;border:1px solid #a88a5e;border-radius:6px}.set-row input[type=checkbox]{width:20px;height:20px;justify-self:start;accent-color:#8a5a2b}.set-note{margin-top:12px;font-size:14px;color:var(--ink-soft);display:flex;align-items:center;flex-wrap:wrap}.fps-meter{position:fixed;right:10px;bottom:10px;z-index:50;padding:3px 9px;font:12px/1.4 ui-monospace,monospace;color:#f4e8cc;background:#1e140ab8;border-radius:6px;pointer-events:none}@media(max-width:640px){.set-row{grid-template-columns:1fr;gap:6px}}