/* The world owns the screen. Controls are objects laid over the scenery. */
:root{--nav-size:76px;--nav-gap:12px;--safe-bottom:max(18px,env(safe-area-inset-bottom));--cream:#f5e7c6;--gold:#e8bf77;--muted:#c3cdb9;--scene-pad:clamp(20px,3vw,66px)}
html,body{width:100%;height:100%;overflow:hidden;background:#102f36}
body{display:block}
#app,#app:fullscreen{display:block;position:relative;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;border:0;border-radius:0;box-shadow:none;background:#123e48;isolation:isolate}
main{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
.page,.page.active{width:100%;height:100%;border:0;border-radius:0;background-position:center;background-size:cover}
#rotateNotice{display:none!important}
button{font-weight:800}
button:focus-visible{outline:2px solid #fff0c4;outline-offset:5px}
button:not(:disabled){transition:filter .15s,transform .15s}
button:hover:not(:disabled){filter:brightness(1.14)}
button:disabled{opacity:.45}
nav{position:absolute;inset:auto auto var(--safe-bottom) 50%;transform:translateX(-50%);display:flex;justify-content:center;gap:var(--nav-gap);height:auto;width:max-content;max-width:calc(100% - 24px);padding:0;background:none;border:0;box-shadow:none;z-index:6;pointer-events:none}
nav button,nav .navUtility{pointer-events:auto;flex:0 0 var(--nav-size);width:var(--nav-size);height:var(--nav-size);max-width:var(--nav-size);min-width:0;min-height:0;padding:9px 5px 6px;border-radius:20px;border:1px solid #c5a16e80;background:radial-gradient(ellipse at 28% 0,#56716a66,transparent 70%),linear-gradient(135deg,#243f3ce8,#122c2fe8);box-shadow:inset 0 1px 1px #efd49a50,inset 0 -3px 0 #051b2380,0 5px 14px #05222a70;color:#d2c5a8;backdrop-filter:blur(7px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:12px;text-shadow:0 2px 2px #0d252a}
nav button.active{color:#ffe4ab;background:radial-gradient(ellipse at 25% 0,#d8ae6c66,transparent 70%),linear-gradient(140deg,#62694ee8,#263d36ed);border-color:#e4c38da8;box-shadow:inset 0 1px 2px #ffe2a182,inset 0 -3px 0 #152e2f,0 6px 18px #08283199}
nav button.active:before{display:none}
nav button svg{width:32px;height:32px;filter:drop-shadow(0 2px 1px #061f28);flex:none}
nav button small,nav .navUtility small{font-size:10px;line-height:1.15;margin:0;letter-spacing:.3px;color:inherit;white-space:nowrap}
.reelIcon{width:22px;height:22px;display:inline-block;vertical-align:middle;flex-shrink:0;overflow:visible}
.inlineIcon{display:inline-flex;align-items:center;gap:6px}
#fishPage.active{display:block;position:relative;overflow:hidden}
.canvasbox{position:absolute;inset:0;width:100%;height:100%;background:#174c5c}
#sea{width:100%;height:100%;border:0;border-radius:0;image-rendering:auto}
.waterbar{position:absolute;inset:var(--scene-pad) var(--scene-pad) auto;display:flex;justify-content:space-between;align-items:flex-start;padding:0;background:none;border:0;z-index:3;pointer-events:none}
.waterbar button{pointer-events:auto;background:none;border:0;border-radius:0;padding:8px 0;color:#ffedc9;text-shadow:0 2px 4px #082f36,0 0 20px #082f36;font-family:Georgia,serif;font-size:clamp(19px,2.1vw,34px);font-weight:600;min-height:42px}
.waterbar #dock{font-family:inherit;font-size:13px;letter-spacing:1px;display:flex;gap:8px;align-items:center}
.waterbar #dock:disabled{opacity:.72}
.fishBottom,.sceneHint{display:none!important}
#boatBaitButton{position:absolute;background:none;border:0;box-shadow:none;min-height:34px;z-index:3;cursor:pointer;padding:0;color:transparent}
#boatBaitButton:focus-visible{outline:2px dashed #f4d596;border-radius:45%}
#baitChooser{position:absolute;display:none;gap:9px;padding:0;z-index:5;transform:translateX(-50%);background:none;border:0;max-width:calc(100% - 24px)}
#baitChooser.open{display:flex}
.baitChoice{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 73px;width:73px;height:73px;min-height:44px;padding:7px 4px;border-radius:18px;border:1px solid #d1b47e9c;background:radial-gradient(ellipse at top,#53664de8,#173c3beF);color:#f0d6a2;box-shadow:inset 0 1px #f1d8a247,0 4px 14px #05232b8c;backdrop-filter:blur(8px);gap:4px}
.baitChoice.selected{background:linear-gradient(140deg,#9a8b56e8,#41604beF);border-color:#f3d59d;color:#fff0c4}
.baitChoice svg{width:30px;height:30px}
.baitChoice span,.baitChoice strong{font-size:11px}
.baitChoice small{font-size:9px;color:inherit;opacity:.8}
#fishingStatus{position:absolute;left:50%;bottom:calc(var(--nav-size) + var(--safe-bottom) + 18px);transform:translateX(-50%);text-align:center;z-index:2;color:#efe3be;font-size:12px;line-height:1.6;text-shadow:0 2px 4px #052932,0 0 12px #052932;pointer-events:none;white-space:nowrap;max-width:90%}
#forgePage{background-image:linear-gradient(90deg,#101e1e24,#111e1d08),url('assets/workshop-wide.webp')}
#battlePage{background-image:url('assets/quayside-wide.webp')}
#holdPage{background-image:linear-gradient(#091f2940,#081e2978),url('assets/hold-wide.webp')}
.primary{width:auto;min-height:46px;border-radius:14px;padding:13px 26px;border:1px solid #e8cc8b99;background:linear-gradient(150deg,#e0bd7f,#bd9253);box-shadow:inset 0 1px #ffebbf80,0 3px 0 #654a2c,0 6px 18px #081b2566;color:#213c38;font-size:13px;letter-spacing:.6px}
.secondary{border:1px solid #cfb58150;border-radius:12px;background:#143631b8;color:#ead6ad;padding:10px 16px;font-size:12px;backdrop-filter:blur(6px)}
.eyebrow{color:#e5d4ac;letter-spacing:2px;font-size:10px;text-shadow:0 2px 3px #172b2e}
.tag{border:0;background:none;border-radius:0;padding:4px 5px;font-size:11px;color:#dddac2}
.tag .reelIcon{width:15px;height:15px}
.gold{color:#f1cb88}
.empty{border:0;background:none;color:#efe1c0;font-size:14px;line-height:1.7;text-shadow:0 2px 4px #14292d}
.error{color:#ffcbad;font-size:12px;text-shadow:0 2px 4px #14292d}
/* Forge shelves retain real workpieces. No boxed game viewport. */
.forgeHub{height:100%;padding:var(--scene-pad) var(--scene-pad) calc(var(--nav-size) + var(--safe-bottom) + 22px);display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.8fr);grid-template-rows:auto auto minmax(0,1fr);gap:22px 5vw;overflow:hidden;background:linear-gradient(0deg,#061b26bb,transparent 65%)}
.forgeHeading{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px;text-shadow:0 3px 9px #081b24}
.forgeHeading h2,.holdHeading h2,.crewHeading h2{font:clamp(28px,3.8vw,50px)/1.1 Georgia,serif;letter-spacing:-.8px;margin:5px 0 8px;color:#f5e3ba}
.forgeHeading p{font-size:12px;color:#d8d9bf;margin:8px 0}
.stationRack{grid-column:1/-1;display:flex;justify-content:center;gap:clamp(10px,2vw,32px);min-height:70px}
.stationButton{position:relative;border:0;background:radial-gradient(ellipse at center,#173432ab,transparent 72%);border-radius:0;color:#ecd7ae;padding:10px 12px;text-align:center;min-width:90px;max-width:160px;flex:1;text-shadow:0 2px 5px #0b252b;display:flex;flex-direction:column;align-items:center;gap:3px}
.stationButton svg{width:36px;height:36px;margin-bottom:4px}
.stationButton strong{display:block;font-family:Georgia,serif;font-size:18px;font-weight:600}
.stationButton small{font-size:10px;color:#d6d4b9}
.stationButton.selected,.stationButton.active{color:#ffdb95;filter:drop-shadow(0 0 7px #f8c36a55)}
.workpieceRack{min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-content:center;gap:18px}
.workpieceSlot{position:relative;min-width:0;background:radial-gradient(ellipse at 50% 62%,#233d35c9,transparent 68%);color:#e8d8b6;border:0;border-radius:0;padding:18px 5px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:185px;text-shadow:0 2px 4px #172324}
.workpieceSlot:after{content:'';position:absolute;bottom:53px;left:7%;right:7%;height:6px;border-radius:100%;background:#041d21a0;filter:blur(5px);z-index:-1}
.workpieceSlot strong{font:20px Georgia,serif;display:block;color:#f2dbb2;margin:8px 0}
.workpieceSlot small{display:block;font-size:11px;color:#d2d9bd;line-height:1.5}
.workpieceArt{display:block;width:100%;height:clamp(90px,20vh,260px)}
.workpieceSlot.emptySlot{opacity:.8;border:0;background:radial-gradient(ellipse,#18302b60,transparent 68%)}
.forgeRecipe{min-width:0;min-height:0;overflow:auto;display:flex;flex-direction:column;justify-content:center;padding:14px 0;scrollbar-width:thin;scrollbar-color:#ae9162 transparent;text-shadow:0 2px 3px #152825}
.forgeRecipe h3{font:24px Georgia,serif;margin:0 0 12px;color:#f2dab0}
.recipeSelectors{display:flex;flex-direction:column;gap:15px}
.recipeGroup>strong,.recipeGroup>label,.recipeGroup>.label{display:block;font-size:10px;letter-spacing:1.8px;color:#d2cba8;margin:0 0 8px;text-transform:uppercase}
.materialChoices{display:flex;gap:8px;overflow:auto;padding:3px 3px 8px;scrollbar-width:thin}
.materialChoice{flex:0 0 96px;min-width:0;min-height:80px;padding:8px;border:1px solid #b9a37855;border-radius:16px;background:linear-gradient(145deg,#3e4b37b5,#152d2fcc);color:#f3dfb7;text-align:center;backdrop-filter:blur(6px)}
.materialChoice.selected{border-color:#f1d49b;background:linear-gradient(140deg,#7c704acc,#2c493cdd)}
.materialChoice svg,.materialChoice canvas{display:block;height:35px;width:100%;margin:auto}
.materialChoice strong{display:block;font-size:11px;margin:6px 0 3px}
.materialChoice small{display:block;font-size:10px;color:#d5d7bf}
.forgeRecipe .primary{margin-top:15px;align-self:flex-start;min-width:195px}
.forgeRecipe .error{margin:8px 0 0}
.stationWork{position:relative;height:100%;width:100%;padding:0;overflow:hidden;background:none}
.stationWork #workCanvas{position:absolute;inset:0;width:100%;height:100%;background:none;border:0;border-radius:0;touch-action:none}
.stationHeading{position:absolute;left:var(--scene-pad);right:var(--scene-pad);top:var(--scene-pad);display:flex;align-items:center;justify-content:space-between;gap:16px;z-index:2;text-shadow:0 2px 6px #102629}
.stationHeading h2{font:clamp(24px,3vw,42px) Georgia,serif;margin:4px 0}
.stationHeading p{font-size:12px;color:#dfd7b8;margin:6px 0}
.stationControls{position:absolute;left:50%;bottom:calc(var(--nav-size) + var(--safe-bottom) + 20px);transform:translateX(-50%);z-index:3;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 15px;width:min(790px,90%);text-align:center;color:#f0dfb9;text-shadow:0 2px 4px #102729}
.stationControls #workCall{font-family:Georgia,serif;font-size:23px;flex-basis:100%;margin:0}
.stationControls #workScore{font-size:12px;letter-spacing:1px}
.stationControls small{flex-basis:100%;font-size:11px;line-height:1.5;color:#e2d7b5}
.stationControls .primary,.stationControls .secondary{min-width:150px}
.assemblyWork{position:relative;height:100%;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(260px,.8fr);gap:30px;padding:130px var(--scene-pad) calc(var(--nav-size) + var(--safe-bottom) + 30px);background:linear-gradient(0deg,#0b242da8,transparent)}
.assemblyWork .stationHeading{grid-column:1/-1}
.assemblyPreview{min-height:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse,#40625446,transparent 67%)}
#assemblyArt{width:100%;height:100%;max-height:65vh}
.assemblyChoices{overflow:auto;min-height:0;scrollbar-width:thin;display:flex;flex-direction:column;justify-content:center;gap:12px;text-shadow:0 2px 5px #10242a}
.assemblyChoices h3{font:24px Georgia,serif;margin:6px 0;color:#f3dab0}
.assemblyChoices .label{margin:8px 0;color:#e8d5b4}
.componentChoices{display:flex;gap:9px;overflow:auto;padding:4px 3px 10px}
.componentChoices button{min-width:105px;max-width:145px;border-radius:16px;padding:10px;border:1px solid #baaa7f65;background:#213d34c9;color:#e8dab6;font-size:11px}
.componentChoices button.selected{border-color:#f2cd8c;background:#6c6745c9}
.componentChoices canvas{display:block;width:100%;height:52px}
.componentChoices button strong{display:block;font-size:12px;margin:5px 0}
.componentChoices button small{display:block;font-size:10px;line-height:1.5;color:#d3d8be}
.assemblyChoices .primary{align-self:flex-start;margin-top:8px}
/* Crew stand in the environment with the actual assembled weapon in hand. */
.crewScene{position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;padding:var(--scene-pad) var(--scene-pad) calc(var(--nav-size) + var(--safe-bottom) + 20px);background:linear-gradient(#112d3480,transparent 40%,#0b24379c)}
.crewHeading{align-self:flex-start;text-shadow:0 3px 6px #102e36;max-width:70%}
.crewHeading p{font:14px/1.65 Georgia,serif;color:#ede0bf;margin:8px 0}
.crewLineup{display:flex;justify-content:center;gap:clamp(16px,5vw,100px);width:min(100%,1300px);min-height:0;flex:1;align-items:flex-end}
.crewFigure{flex:1;max-width:350px;min-width:0;padding:0 0 6px;border:0;border-radius:0;background:none;color:#f1e1bf;text-align:center;text-shadow:0 2px 6px #112b35;align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}
.crewFigure canvas{width:100%;height:100%;min-height:90px;max-height:57vh;object-fit:contain;filter:drop-shadow(0 8px 4px #071c2d5c)}
.crewFigure strong{font:24px Georgia,serif;margin-top:5px;color:#f7deb1}
.crewFigure small{display:block;font-size:11px;line-height:1.8;color:#efe1c4}
.crewFigure .crewWeaponName{font-size:12px;color:#f1c887;max-width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.crewDeparture{text-align:center;flex:none;padding-top:12px}
.crewDeparture .primary{min-width:210px}
.crewDeparture>small{display:block;font-size:10px;color:#e3d6b8;margin-top:9px;line-height:1.4}
.crewScene #crewShop{position:absolute;top:var(--scene-pad);right:var(--scene-pad)}
.autopage{position:relative;display:block;padding:0;height:100%;width:100%}
#battleCanvas{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:0;background:none}
.autoTop{position:absolute;inset:var(--scene-pad) var(--scene-pad) auto;z-index:2;display:flex;justify-content:space-between;pointer-events:none;text-shadow:0 2px 5px #102c30;font-size:15px;color:#f0e2bd}
.autoTop>*{pointer-events:auto}
.autoTop button{background:#163a37c9;border:1px solid #d1b58666;border-radius:13px;min-height:44px;min-width:44px;color:#f2dbb1;backdrop-filter:blur(5px)}
.autoTop>.tag{display:none}
.autoBottom{position:absolute;left:var(--scene-pad);right:var(--scene-pad);bottom:calc(var(--nav-size) + var(--safe-bottom) + 15px);z-index:2;display:flex;align-items:center;justify-content:space-between;gap:18px;overflow:visible;background:none;border:0;border-radius:0;padding:0;pointer-events:none;text-shadow:0 2px 4px #153340}
.partyHp{display:flex;flex-direction:row;width:230px;gap:12px;margin:0}
.partyHp small{font-size:11px;color:#ece1ba}
.partyHp .bar{height:4px;background:#091f2b98;border-radius:3px}
.partyHp .bar i{background:linear-gradient(90deg,#708d62,#c9d7a2)}
.autoBottom p{font-size:11px;color:#f0dbad;letter-spacing:1.5px}
#battleSummary{display:none}
/* Inventory is laid over the timber hold, with no right rail. */
.holdScene{height:100%;display:flex;flex-direction:column;padding:var(--scene-pad) var(--scene-pad) calc(var(--nav-size) + var(--safe-bottom) + 24px);background:linear-gradient(#09263050,#09212ea0)}
.holdHeading{display:flex;justify-content:space-between;align-items:center;gap:20px;text-shadow:0 2px 5px #102b32}
.holdHeading>div:last-child{display:flex;gap:10px}
.holdScene .tabs{align-self:center;background:none;padding:0;gap:20px;margin:8px 0 22px;flex:none;border-radius:0}
.holdScene .tabs button{border:0;border-bottom:2px solid transparent;border-radius:0;background:none;padding:10px 18px;font-size:13px;color:#d7c9a8}
.holdScene .tabs button.selected{color:#ffe0a3;border-color:#d3b478;background:none}
.holdItems{min-height:0;flex:1;overflow:auto;scrollbar-width:thin;scrollbar-color:#9c8a61 transparent}
.holdGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:22px 24px;max-width:1600px;margin:auto}
.holdGrid .catchcard,.holdWeapon{position:relative;background:radial-gradient(ellipse at 50% 65%,#34574c75,transparent 67%);border:0;border-radius:0;padding:12px 9px;text-shadow:0 2px 3px #14303b;min-height:155px;color:#eddfbe}
.holdGrid .catchcard canvas{height:100px;width:100%}
.holdGrid .catchcard strong,.holdWeapon strong{font:18px Georgia,serif;display:block;color:#f3d9ab}
.holdGrid .catchcard small,.holdWeapon small{font-size:11px;margin-top:5px;line-height:1.5;color:#d3d6ba}
.holdWeapon .weaponDisplay{height:110px;width:100%}
.holdScene .empty{max-width:480px;margin:6vh auto;text-align:center}
.holdScene .empty .reelIcon{width:65px;height:65px;display:block;margin:0 auto 14px;color:#e4c590}
.holdScene .empty .primary{margin-top:18px}
/* Menus float over a full-screen dimmed view, without a surrounding panel. */
#overlay{inset:0;padding:clamp(18px,4vh,60px) var(--scene-pad);border:0;background:#061f2ad9;backdrop-filter:blur(10px);z-index:20}
.panel,.panel.modalSplit{background:none;border:0;border-radius:0;box-shadow:none;padding:10px;max-height:100%;width:min(100%,1000px);scrollbar-color:#b49a68 transparent}
.panel:focus{outline:none}
.panel h2{font-family:Georgia,serif;color:#f5dfb8}
.panel p{font-size:14px;line-height:1.8;color:#d7ddc5}
.panel.modalSplit{height:min(760px,calc(100dvh - 70px));grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:40px}
.modalArt{background:radial-gradient(ellipse,#48685e4d,transparent 67%)}
.modalArt .reveal,.modalArt .gradeArt{height:clamp(180px,50vh,520px);border:0;background:none;border-radius:0}
.gradeArt,.preview{border:0;border-radius:0;background:none}
.panel .rowcard{background:none;border:0;border-bottom:1px solid #d0bc8730;border-radius:0;padding:16px 4px;color:#e6d9b6}
.panel .rowcard.selected{background:#a5b99513}
.panel .rowcard strong{font-size:15px}
.panel .rowcard .weaponDisplay{width:90px;height:70px}
.panel .primary{min-width:180px;max-width:100%}
.panel .stats{color:#eac78c}
.modalActions .secondary{width:auto;display:block;margin:12px auto 0;min-width:180px}
.modalCopy{scrollbar-color:#b29c6f transparent}
.logPanel{width:min(100%,1050px);text-shadow:0 2px 5px #112b32}
.logHeader .secondary{background:none;border:0}
.logLead{font:clamp(23px,3vw,35px)/1.35 Georgia,serif;color:#f3d196;max-width:780px}
.logTabs{background:none;padding:0;gap:24px;border-radius:0}
.logTabs button{flex:0 0 auto;border-radius:0;border-bottom:2px solid transparent;padding:8px 0;color:#c8cdb4;font-size:13px}
.logTabs button.selected{background:none;color:#f2d8a0;border-color:#ccaf74}
.logOpening{grid-template-columns:1.3fr 1fr;gap:45px}
.logOpening p{font-size:14px;line-height:1.9}
.loreRule{border-left:1px solid #b69c6359;padding-left:20px}
.routeCard{background:none;border:0;border-radius:0;padding:15px 0}
.routeCard.current{border:0;background:none}
.routeCard h3{font-size:25px}
.coastChoices{display:flex;flex-direction:column;gap:12px;margin:25px 0}
.coastChoice{display:flex;align-items:center;gap:20px;border:0;border-radius:0;border-bottom:1px solid #dbbf8429;background:none;padding:16px 5px;text-align:left;color:#f0d8ad}
.coastChoice .reelIcon{width:36px;height:36px}
.coastChoice strong{font:23px Georgia,serif;display:block}
.coastChoice small{display:block;margin-top:6px;font-size:12px;line-height:1.5;color:#b9cabb}
.shopPanel{width:min(100%,1100px)}
.shopPanel .upgradeOffer{border:0;border-radius:0;background:radial-gradient(ellipse,#3f594744,transparent 68%);box-shadow:none;padding:20px 16px}
.shopPanel .upgradeIcon{width:auto}
.shopPanel .upgradeIcon svg{width:58px;height:58px;color:#edcb8d}
.shopPanel #shopFish{justify-self:center;width:auto;min-width:230px}
#toast{top:auto;bottom:calc(var(--nav-size) + var(--safe-bottom) + 65px);background:#15352ee8;color:#f1dbaf;border:1px solid #c8b07d55;border-radius:16px;box-shadow:0 5px 20px #08232b66;font-size:13px}
@media(min-width:2300px){:root{--nav-size:94px;--nav-gap:18px;--safe-bottom:30px}nav button{border-radius:25px}nav button svg{width:40px;height:40px}nav button small,nav .navUtility small{font-size:12px}.stationButton svg{width:48px;height:48px}.stationButton strong{font-size:24px}.forgeHub{grid-template-columns:1.3fr 1fr;gap:30px 7vw}.forgeHeading p,.recipeGroup strong,.stationControls small{font-size:15px}.materialChoice{flex-basis:130px;min-height:110px}.materialChoice strong{font-size:15px}.materialChoice small{font-size:13px}.workpieceSlot strong{font-size:26px}.workpieceSlot small{font-size:14px}.stationControls #workCall{font-size:30px}.primary{font-size:16px;padding:16px 30px}.crewFigure{max-width:480px}.crewFigure strong{font-size:32px}.crewFigure small{font-size:15px}.crewFigure .crewWeaponName{font-size:16px}.crewHeading p{font-size:18px}.holdGrid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));max-width:2400px;gap:35px}.holdGrid .catchcard canvas{height:145px}#fishingStatus{font-size:16px}.baitChoice{width:88px;height:88px;flex-basis:88px}.baitChoice svg{width:38px;height:38px}.baitChoice span,.baitChoice strong{font-size:13px}}
@media(orientation:landscape) and (max-height:650px){:root{--nav-size:56px;--nav-gap:9px;--safe-bottom:max(10px,env(safe-area-inset-bottom));--scene-pad:18px}nav button,nav .navUtility{border-radius:15px;padding:5px 2px;gap:2px}nav button svg{width:24px;height:24px}nav button small,nav .navUtility small{font-size:8px}.waterbar button{font-size:23px;min-height:32px;padding:3px 0}.waterbar #dock{font-size:11px}.baitChoice{width:59px;height:59px;flex-basis:59px;border-radius:14px;gap:2px;padding:5px}.baitChoice svg{width:24px;height:24px}.baitChoice small{display:none}.baitChoice span,.baitChoice strong{font-size:10px}#fishingStatus{font-size:10px;bottom:calc(var(--nav-size) + var(--safe-bottom) + 8px)}.forgeHub{padding-bottom:calc(var(--nav-size) + var(--safe-bottom) + 12px);grid-template-columns:1fr 1fr;gap:8px 20px;grid-template-rows:40px 55px minmax(0,1fr)}.forgeHeading h2{font-size:26px;margin:0}.forgeHeading p{display:none}.forgeHeading .eyebrow{font-size:8px}.stationRack{gap:6px;min-height:0}.stationButton{padding:0;min-width:0;gap:1px}.stationButton svg{width:24px;height:24px;margin:0}.stationButton strong{font-size:14px}.stationButton small{font-size:8px}.workpieceRack{gap:5px}.workpieceSlot{min-height:110px;padding:2px}.workpieceArt{height:75px}.workpieceSlot strong{font-size:15px;margin:4px 0}.workpieceSlot small{font-size:9px}.forgeRecipe{padding:0;justify-content:flex-start}.forgeRecipe h3{font-size:17px;margin:0 0 5px}.recipeSelectors{gap:4px}.recipeGroup>strong,.recipeGroup>label,.recipeGroup>.label{font-size:8px;margin:0 0 2px}.materialChoices{gap:5px;padding:2px 2px 3px}.materialChoice{flex-basis:76px;min-height:47px;padding:5px;border-radius:10px}.materialChoice svg,.materialChoice canvas{height:21px}.materialChoice strong{font-size:9px;margin:3px 0 1px}.materialChoice small{font-size:8px}.forgeRecipe .error{font-size:9px;margin:3px 0}.forgeRecipe .primary{min-height:34px;padding:7px 12px;margin-top:5px;font-size:10px;min-width:140px}.primary{font-size:11px;min-height:38px;padding:9px 18px}.secondary{font-size:10px;min-height:34px;padding:7px 12px}.stationHeading h2{font-size:25px}.stationHeading p{font-size:10px;margin:3px 0}.stationHeading .eyebrow{font-size:8px}.stationControls{bottom:calc(var(--nav-size) + var(--safe-bottom) + 8px);gap:6px 10px}.stationControls #workCall{font-size:18px;flex-basis:auto}.stationControls #workScore{font-size:10px}.stationControls small{font-size:9px}.stationControls .primary,.stationControls .secondary{min-width:115px}.assemblyWork{padding:77px var(--scene-pad) calc(var(--nav-size) + var(--safe-bottom) + 10px);gap:15px}.assemblyChoices{justify-content:flex-start;gap:4px}.assemblyChoices h3{font-size:17px;margin:2px 0}.componentChoices{gap:5px;padding:2px 0 4px}.componentChoices button{min-width:85px;padding:6px;border-radius:10px}.componentChoices canvas{height:26px}.componentChoices button strong{font-size:10px;margin:3px 0}.componentChoices button small{font-size:8px}.assemblyChoices .primary{margin:4px 0}.crewScene{padding-bottom:calc(var(--nav-size) + var(--safe-bottom) + 9px)}.crewHeading h2{font-size:27px;margin:3px 0}.crewHeading p{font-size:11px;line-height:1.3;margin:4px 0}.crewLineup{gap:20px;max-width:730px}.crewFigure canvas{max-height:38vh;min-height:60px}.crewFigure strong{font-size:17px;margin:2px 0}.crewFigure small{font-size:9px;line-height:1.5}.crewFigure .crewWeaponName{font-size:9px}.crewDeparture{padding-top:5px}.crewDeparture .primary{min-height:35px;padding:7px 20px;min-width:180px}.crewDeparture>small{display:none}.holdScene{padding-bottom:calc(var(--nav-size) + var(--safe-bottom) + 10px)}.holdHeading h2{font-size:28px;margin:0}.holdScene .tabs{margin:4px 0 10px;gap:12px}.holdScene .tabs button{min-height:30px;font-size:10px;padding:5px 10px}.holdGrid{grid-template-columns:repeat(auto-fill,minmax(115px,1fr));gap:12px}.holdGrid .catchcard{min-height:110px;padding:5px}.holdGrid .catchcard canvas{height:70px}.holdGrid .catchcard strong,.holdWeapon strong{font-size:14px}.holdGrid .catchcard small,.holdWeapon small{font-size:9px}.holdWeapon .weaponDisplay{height:75px}.autoBottom{bottom:calc(var(--nav-size) + var(--safe-bottom) + 6px)}.partyHp{width:170px}.autoTop{font-size:12px}.autoTop button{min-height:34px;min-width:34px}.autoBottom p{font-size:9px}.panel.modalSplit{height:calc(100dvh - 36px);gap:20px}.panel h2{font-size:26px}.panel p{font-size:11px}.logOpening{gap:20px}.logOpening p{font-size:11px}.logLead{font-size:23px;margin-bottom:10px}.logTabs{gap:20px;margin:8px 0 12px}.logTabs button{font-size:11px;padding:5px 0;min-height:30px}.controlTable{font-size:10px}.controlTable th,.controlTable td{padding:7px}.shopPanel .upgradeOffer{padding:8px}.shopPanel .upgradeIcon svg{width:35px;height:35px}.shopPanel .upgradeOffer strong{font-size:13px}.shopPanel .upgradeOffer p{font-size:10px}.shopPanel #shopFish{min-height:35px;padding:8px}.panel .rowcard{padding:8px 3px}#toast{bottom:calc(var(--nav-size) + var(--safe-bottom) + 35px);font-size:11px}}
@media(orientation:portrait){:root{--nav-size:51px;--nav-gap:6px;--safe-bottom:max(14px,env(safe-area-inset-bottom));--scene-pad:18px}nav{max-width:calc(100% - 16px)}nav button,nav .navUtility{border-radius:14px;padding:5px 2px;gap:2px}nav button svg{width:23px;height:23px}nav button small,nav .navUtility small{font-size:7px}.waterbar button{font-size:23px}.waterbar #dock{font-size:11px}.baitChoice{width:60px;height:60px;flex-basis:60px;border-radius:14px}.baitChoice small{display:none}.forgeHub{display:flex;flex-direction:column;gap:15px;overflow:auto}.forgeHeading h2{font-size:28px}.forgeHeading p{font-size:10px}.stationRack{gap:5px;flex:none}.stationButton{min-width:0;padding:5px 0}.stationButton svg{width:24px;height:24px}.stationButton strong{font-size:12px}.stationButton small{font-size:8px}.workpieceRack{flex:none;gap:8px}.workpieceSlot{min-height:140px;padding:7px 0}.workpieceArt{height:90px}.workpieceSlot strong{font-size:16px}.workpieceSlot small{font-size:9px}.forgeRecipe{flex:none;overflow:visible}.forgeRecipe h3{font-size:23px}.stationControls{bottom:calc(var(--nav-size) + var(--safe-bottom) + 16px);gap:9px}.stationControls #workCall{font-size:21px}.stationControls .primary,.stationControls .secondary{min-width:120px}.stationHeading{align-items:flex-start}.stationHeading h2{font-size:24px}.stationHeading p{max-width:220px;font-size:10px}.stationHeading #parkWork{font-size:10px;min-width:75px}.assemblyWork{display:flex;flex-direction:column;gap:12px;padding-top:105px;overflow:auto}.assemblyPreview{height:210px;flex:none}.assemblyChoices{overflow:visible;flex:none}.assemblyChoices h3{font-size:21px}.componentChoices button{min-width:100px}.crewHeading{max-width:100%;padding-right:70px}.crewHeading h2{font-size:28px}.crewHeading p{font-size:11px}.crewLineup{gap:6px;align-items:center}.crewFigure canvas{max-height:35vh}.crewFigure strong{font-size:18px}.crewFigure small{font-size:9px}.crewFigure .crewWeaponName{font-size:9px;white-space:normal;line-height:1.3}.crewDeparture>small{font-size:9px;max-width:300px}.crewScene #crewShop{padding:8px;font-size:10px;min-height:34px}.holdHeading h2{font-size:30px}.holdHeading>div:last-child{gap:5px}.holdHeading .secondary{font-size:10px;padding:8px}.holdGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.holdGrid .catchcard{min-height:130px;padding:7px}.holdGrid .catchcard canvas{height:80px}.holdGrid .catchcard strong{font-size:16px}.holdScene .tabs{gap:6px;margin:12px 0}.holdScene .tabs button{padding:8px 10px;font-size:11px}.partyHp{width:150px}.autoBottom p{font-size:8px}.autoBottom{gap:8px}.autoTop{font-size:12px}.panel.modalSplit{display:block;height:auto;overflow:auto}.modalArt .reveal,.modalArt .gradeArt{height:190px}.modalText{display:block;overflow:visible}.modalCopy{overflow:visible}.modalActions{padding-top:6px}.panel h2{font-size:29px}.logOpening,.logRoutes{grid-template-columns:1fr;gap:20px}.logLead{font-size:25px}.logOpening p{font-size:13px}.logTabs{gap:15px}.logTabs button{font-size:11px}.controlTable{font-size:10px}.controlTable th,.controlTable td{padding:9px 5px}.coastChoice strong{font-size:21px}.coastChoice small{font-size:11px}.shopPanel{display:block}.shopPanel .upgradeOffer{display:flex;flex-direction:row;text-align:left;gap:15px;padding:10px 0}.shopPanel .upgradeIcon svg{width:40px;height:40px}.shopPanel #shopFish{display:block;width:80%;margin:12px auto}.shopPanel .upgradeOffer p{font-size:11px}}
@media(prefers-reduced-motion:reduce){button{transition:none}}
.craftedWeapon{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 5px 3px #10292960)}
.recipeIntro p,.emptyRecipe{font-size:11px;line-height:1.6;color:#d3d8bf;margin:7px 0 11px}
.rackCount{font-size:12px;color:#ebdab6;white-space:nowrap}
.stationNumber{font-size:9px;letter-spacing:1px;color:#d7bf8d}
.rackContinue{font-size:11px;color:#efca89;margin-top:8px}
.workpieceSlot.vacant{opacity:.7;font:15px Georgia,serif;gap:12px}
.metalNugget{display:block;width:33px;height:31px;margin:0 auto;background:linear-gradient(128deg,#f1e9ce75 0 28%,transparent 29%),linear-gradient(20deg,#2b4f5980 0 35%,transparent 36%),var(--metal);clip-path:polygon(8% 30%,39% 5%,82% 14%,99% 66%,70% 94%,17% 87%);filter:drop-shadow(0 2px 1px #102b2a)}
.stationControls>p{flex-basis:100%;margin:0;font-size:12px;line-height:1.55;color:#e1d4b4}
.stationActions{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.assemblyPreview{flex-direction:column;text-align:center}
.assemblyPreview h3{font:25px Georgia,serif;color:#f1d4a0;margin:10px 0 4px}
.assemblyPreview p{font-size:12px;margin:5px 0;color:#ded5b7}
.assemblyPreview #assemblyArt{min-height:90px;flex:1}
.componentPreview{display:block;height:52px;width:100%}
.assemblyFinish p{font-size:11px;line-height:1.5;color:#d0d6bf;margin:6px 0}
.workpieceSlot.muted{opacity:.42}
.forgeRecipe{overflow:hidden;justify-content:flex-start}
.recipeIntro,.recipeAction{flex:none}
.recipeSelectors{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#9b8557 transparent;padding:2px 4px 6px 0}
.recipeAction{padding:4px 0 0}
.componentChoices{scrollbar-width:thin;scrollbar-color:#b49a68 transparent}
@media(orientation:landscape) and (max-height:650px){
  .assemblyChoices{overflow:hidden;gap:7px}
  .componentGroup{flex:1;min-height:0;display:flex;flex-direction:column}
  .componentGroup h3{flex:none;font-size:16px;line-height:1.1;margin:0 0 3px}
  .componentChoices{flex:1;min-height:0;padding:1px 0 5px;align-items:stretch}
  .componentChoices button{padding:4px 6px;min-width:92px}
  .componentChoices canvas,.componentPreview{height:21px;flex:none}
  .componentChoices button strong{font-size:9px;line-height:1.15;margin:2px 0}
  .componentChoices button small{font-size:8px;line-height:1.2}
  .assemblyFinish{flex:none}
  .assemblyFinish p{display:none}
  .assemblyFinish .primary{margin:0;min-height:35px;font-size:10px;padding:7px 13px}
}
@media(orientation:landscape) and (max-height:650px){.recipeIntro p{display:none}.rackCount{font-size:10px}.stationNumber{display:none}.stationControls>p{font-size:10px;max-width:620px}.stationActions{gap:7px}.stationActions .secondary,.stationActions .primary{min-height:34px}.stationControls small{display:none}.stationControls #workCall{flex-basis:100%}.rackContinue{font-size:9px;margin-top:4px}.workpieceSlot.vacant{font-size:12px;gap:8px}.metalNugget{width:23px;height:22px}.componentPreview{height:26px}.assemblyPreview h3{font-size:18px;margin-top:4px}.assemblyPreview p{font-size:9px}.assemblyFinish p{font-size:9px;margin:2px 0}}
