.voyage-opportunity{margin:18px 0;padding:16px;border:1px solid #c5d5e5;border-radius:7px;background:#f4f8fc;color:#163960}.voyage-opportunity-head{display:flex;align-items:center;gap:12px}.voyage-opportunity-head>div{min-width:0}.voyage-opportunity-head small{font:10px var(--sans);letter-spacing:.1em;color:#607d9b}.voyage-opportunity h3{margin:4px 0;font-size:19px}.voyage-opportunity-head p{margin:4px 0;font-size:12px;line-height:1.7;color:#526e8b}.voyage-opportunity-art{display:block;width:104px;height:100px;flex:0 0 104px;object-fit:contain;animation:opportunity-bob 4s ease-in-out infinite}.voyage-options{display:grid;gap:8px;margin-top:12px}.voyage-options>button{text-align:left;padding:12px;border:1px solid #becfe1;border-radius:4px;background:#fff;color:#173d67;white-space:normal;min-width:0}.voyage-options>button:not(:disabled):hover{background:#e4edf8;border-color:#3c6b9d;color:#123457}.voyage-options>button:disabled{opacity:.65}.voyage-options strong{display:flex;justify-content:space-between;gap:6px;font-size:13px}.voyage-options strong small{font-weight:400;font-size:11px;white-space:nowrap}.voyage-option-cost,.voyage-option-gain{display:block;font-size:11px;line-height:1.8;margin-top:5px}.voyage-option-cost .cost{font-size:11px}.voyage-option-cost:empty{display:none}.voyage-option-gain{color:#356343}.voyage-pass{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px}.voyage-pass>small{font-size:10px;color:#5a7490}.voyage-job{display:grid;gap:9px;margin-top:12px;font-size:12px}.voyage-job>span{text-align:right;color:#5c7690}.voyage-job .progress{margin:0}.voyage-opportunity button:focus-visible{outline:3px solid #3c70a6;outline-offset:2px}.voyage-opportunity.working .voyage-opportunity-art{animation-duration:2.5s}.painted-icon{object-fit:contain;pointer-events:none}.voyage-cannon{position:absolute;right:8%;bottom:9%;width:92px;aspect-ratio:3/2;overflow:hidden;pointer-events:none}.voyage-cannon img{display:block;width:400%;max-width:none;height:100%;object-fit:fill;animation:voyage-broadside 1.8s steps(4,end) infinite}.combat-tactics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:12px 0}.combat-tactics>button{min-width:0;white-space:normal;display:grid;gap:5px;padding:10px 7px;border:1px solid #bacde1;border-radius:4px;background:#f8fbff;color:#24496f;text-align:left;font-size:11px}.combat-tactics strong{font-size:12px}.combat-tactics small{font-size:10px;line-height:1.5}.combat-tactics .active{background:#dce9f8;border-color:#315e94;box-shadow:inset 0 0 0 1px #315e94}.combat-tactics button:focus-visible{outline:3px solid #477aaa;outline-offset:2px}.combat-status{font-size:11px;color:#466787;line-height:1.8}.combat-forecast{padding:8px 10px;background:#eef4fa;border-left:2px solid #7296bb;font-size:11px;line-height:1.8}.combat-boarding{margin-top:8px}.paused .voyage-opportunity-art,.paused .voyage-cannon img{animation-play-state:paused!important}@keyframes opportunity-bob{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-3px) rotate(1deg)}}@keyframes voyage-broadside{to{transform:translateX(-100%)}}@media(max-width:600px){.voyage-opportunity{padding:12px}.voyage-opportunity-art{width:80px;height:84px;flex-basis:80px}.voyage-opportunity h3{font-size:17px}.combat-tactics{gap:4px}.combat-tactics>button{padding:8px 5px}.voyage-cannon{width:68px;right:6%}}@media(prefers-reduced-motion:reduce){.voyage-opportunity-art,.voyage-cannon img{animation:none!important}}

.voyage-alert{position:fixed;right:22px;bottom:22px;z-index:35;display:flex;align-items:center;gap:10px;width:260px;padding:10px 14px;border:1px solid #a9c1da;border-left:3px solid #b9574d;border-radius:6px;background:#f6faff;color:#193d66;box-shadow:0 4px 18px #193b6426;text-align:left}.voyage-alert img{width:35px;height:35px;object-fit:contain}.voyage-alert>span{display:grid;gap:3px;flex:1}.voyage-alert strong{font-size:13px}.voyage-alert small{font-size:11px;color:#587797}.voyage-alert:focus-visible{outline:3px solid #3f75a8;outline-offset:3px}.voyage-alert:not(:disabled):hover{background:#e5effa;color:#143961}@media(max-width:720px){.voyage-alert{left:12px;right:12px;bottom:84px;width:auto;padding:7px 12px}.voyage-alert img{width:29px;height:29px}html:has(.has-voyage-alert){scroll-padding-bottom:154px}.has-voyage-alert main{padding-bottom:155px}}

#route-panel{scroll-margin-top:76px}@media(max-width:720px){#route-panel{scroll-margin-top:170px}}

#sea-battle,#voyage-event{scroll-margin-top:0}@media(max-width:600px){#sea-battle,#voyage-event{scroll-margin-top:53px}.pirate-encounter#sea-battle>.encounter-portrait{height:68px;object-fit:contain;margin:0 auto 8px}.pirate-encounter#sea-battle h3{font-size:19px;margin:6px 0 10px}.pirate-encounter#sea-battle .progress-info{margin-top:10px}}
@media(max-width:360px){.pirate-encounter#sea-battle>.encounter-portrait{height:52px}.pirate-encounter#sea-battle .combat-forecast{padding-top:6px;padding-bottom:6px}}