:root{color-scheme:light;--ink:#244b54;--muted:#637e81;--cream:#fffbed;--paper:#f6f7ec;--sea:#207d86;--coral:#ef835d;--gold:#eab754;--border:#dce6df;font-family:ui-rounded,'SF Pro Rounded',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#e6f2ed;color:var(--ink);overscroll-behavior:none}button,input,select{font:inherit}button{cursor:pointer;border:0;color:var(--ink);background:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default;opacity:.48}button:focus-visible,input:focus-visible,select:focus-visible,canvas:focus-visible{outline:3px solid #157f92;outline-offset:3px}button:active:not(:disabled){transform:translateY(1px)}button .icon{pointer-events:none}h1,h2,h3,p{margin:0}button[hidden],[hidden]{display:none!important}.icon{width:23px;height:23px;display:inline-block;flex-shrink:0;vertical-align:middle}#app{width:100%;height:100%;height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
.layout{width:100%;height:100%;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto auto auto;grid-template-areas:'head' 'info' 'stage' 'caption' 'actions' 'save';gap:0;background:linear-gradient(155deg,#fffbee 0%,#e7f3ed 48%,#e0f0ed 100%);padding:0 14px}.topbar{grid-area:head;display:flex;justify-content:space-between;align-items:center;gap:10px;min-width:0;padding:16px 8px 10px}.brand{display:flex;align-items:center;gap:8px;line-height:1;font-family:Georgia,'Times New Roman',serif;font-size:27px;font-weight:600;letter-spacing:-1.1px;white-space:nowrap}.brand>.icon{width:30px;height:30px;stroke:#e08762;fill:#ffdcc6;stroke-width:1.2}.brand small{display:block;font-family:inherit;font-size:9px;font-weight:400;letter-spacing:2px;margin-top:6px}.resources{display:flex;gap:8px;align-items:center}.resource{display:flex;align-items:center;justify-content:center;gap:6px;min-height:39px;min-width:57px;border:1px solid #fffdf3;background:#fffdf0b8;border-radius:16px;padding:6px 10px;font-size:14px;white-space:nowrap;font-variant-numeric:tabular-nums}.resource .icon{width:18px;height:18px}.gold .icon{color:#c19037;fill:#f8db95}.shells .icon{color:#c48a61}.info{grid-area:info;min-width:0;padding:5px 12px 9px}.eyebrow{text-transform:uppercase;letter-spacing:2.2px;font-size:10px;font-weight:750;line-height:1.5;color:#6b8987}.eyebrow span{margin:0 7px;color:#c59d72}.welcome{font-family:Georgia,'Times New Roman',serif;font-size:clamp(30px,4.5vw,53px);line-height:1.09;letter-spacing:-1.7px;font-weight:500;margin:12px 0}.intro-copy{font-size:14px;line-height:1.55;color:var(--muted);max-width:340px}.home-progress{margin-top:18px;max-width:320px;font-size:11px;color:var(--muted)}.home-progress span{display:block;margin-bottom:7px}.progress-track{height:5px;border-radius:10px;background:#caddd35e;overflow:hidden}.progress-track>i{display:block;height:100%;background:linear-gradient(90deg,#4aa897,#b2ce82);border-radius:10px;transition:width .35s}.stage{grid-area:stage;position:relative;min-height:0;min-width:0;overflow:hidden;border-radius:28px;isolation:isolate;background:#e6f3ef}#world{position:absolute;inset:0}.harbor-canvas{display:block;width:100%;height:100%;object-fit:contain;touch-action:none;-webkit-user-select:none;user-select:none}.caption{grid-area:caption;min-width:0;min-height:30px;display:flex;gap:7px;align-items:center;justify-content:center;text-align:center;font-size:11px;line-height:1.35;color:#5a807f;padding:4px 10px}.caption .icon{width:15px;height:15px;color:#cba855}.actions{grid-area:actions;min-width:0;padding:7px 5px 4px}.primary{background:#244f56;color:#fffde9;border-radius:17px;min-height:49px;font-weight:650;padding:13px 20px;box-shadow:0 5px 0 #c7d8cd55;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:background .15s,transform .15s}.primary:hover{background:#326a70}.secondary{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid #d7e2d8;border-radius:15px;background:#fcfbed;min-height:44px;font-weight:550;padding:11px 15px}.secondary:hover{background:#f3f4e5}.soft{background:#fffdf0d9;border:1px solid #ffffff;display:flex;align-items:center;justify-content:center;gap:9px;border-radius:17px;min-height:47px;font-size:13px;font-weight:600}.sail-button{width:100%;background:linear-gradient(120deg,#f3aa74,#ed855e);color:#493d2a;box-shadow:0 5px 0 #dba0792e;display:flex;justify-content:space-between;min-height:62px;padding:15px 22px}.sail-button:hover{background:linear-gradient(120deg,#f8b880,#f49770)}.sail-button>span{display:flex;align-items:center;gap:10px;font-size:20px}.sail-button small{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600}.sail-button small .icon{width:20px}.home-secondary{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:10px}.home-minor{display:flex;justify-content:center;gap:3px;margin-top:5px}.home-minor button{padding:7px;font-size:11px;min-height:30px;color:#547e80}.save-footer{grid-area:save;display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;min-height:25px;padding:0 9px 2px;color:#7f9488;font-size:10px}.save-button{font-size:10px;min-height:25px;padding:0;text-align:left;color:inherit}.save-warning{color:#a36429}.build-mark{font-size:9px;letter-spacing:.5px;white-space:nowrap;opacity:.75}.level-line{display:flex;justify-content:space-between;align-items:center;gap:6px;margin:4px 0}.level-line h1{font-family:Georgia,serif;font-size:26px;line-height:1.2;font-weight:500;letter-spacing:-.6px}.instruction{font-size:12px;line-height:1.4;color:#63827f;margin:4px 0 7px;max-width:700px}.level-meter{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;color:#5b7a78;margin-bottom:6px;font-variant-numeric:tabular-nums}.daily-date{font-size:11px;color:#897b72}.star-row{display:inline-flex;gap:3px;color:#d6dfd4;flex-shrink:0}.star-row .icon{width:19px;height:19px;stroke-width:1.3;fill:currentColor}.star-row .lit{color:#e5b557}.play-tools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:7px;background:#fffbedb8;border:1px solid #fffdf7;border-radius:20px}.play-tools button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:50px;padding:4px 1px;font-size:10px;line-height:1.2}.play-tools button .icon{width:23px;height:23px}.play-tools button span{overflow-wrap:break-word;max-width:100%}.play-tools button:hover{background:#dcebe0;border-radius:13px}.play-tools .hint-button{color:#9b762c}.access-tools{display:flex;justify-content:space-between;padding:2px 7px}.access-tools button{font-size:10px;min-height:26px;color:#6a8a87;padding:0 5px;display:flex;align-items:center;gap:4px}.access-tools .icon{width:13px;height:13px}
/* Modal content scrolls as a unit. The world is never hidden under permanent panels. */
dialog{width:min(620px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px);margin:auto;border:1px solid #fffdf7;border-radius:28px;padding:0;background:#faf9ed;color:var(--ink);box-shadow:0 22px 90px #153e5352;overscroll-behavior:contain;overflow:auto}dialog::backdrop{background:#163c5157}.dialog-body{padding:28px;display:flex;flex-direction:column;gap:13px}.dialog-body h2{font-family:Georgia,serif;font-size:31px;line-height:1.12;letter-spacing:-.7px;font-weight:500;outline:none}.dialog-body h3{font-size:14px;font-weight:650}.dialog-body p{font-size:13px;line-height:1.6;color:#69817b}.dialog-buttons{display:flex;flex-direction:column;gap:9px;margin-top:6px}.dialog-body>.primary,.dialog-body>.secondary{width:100%}.small-note{font-size:11px!important;line-height:1.5!important;color:#7b8c82!important}.rules-note{padding:13px 16px;background:#e9eee1;border-radius:15px;font-size:12px!important}.text-button{min-height:36px;font-size:12px;color:#71857b}.help-step{display:flex;gap:12px;align-items:flex-start;padding:8px 0}.help-step>span{display:flex;background:#e7edda;color:#719772;border-radius:13px;padding:10px}.help-step p{margin-top:4px}.help-step h3{font-size:15px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:11px 0;border-bottom:1px solid #e4e9dc;font-size:13px}.setting-row label{flex:1}.setting-row input[type=range]{width:42%;accent-color:#438c85;min-height:30px}.setting-row input[type=checkbox]{width:23px;height:23px;accent-color:#438c85}.setting-row select{max-width:48%;border-radius:12px;padding:9px 10px;border:1px solid #d4ddd0;color:var(--ink);background:#fffced;min-height:42px}.result,.finale,.mastery,.hints,.ad{text-align:center;align-items:center}.result .dialog-buttons,.finale>.primary,.mastery>.primary,.hints .dialog-buttons{width:100%}.result-badge{width:77px;height:77px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#f9dfad;color:#bc8745;box-shadow:0 0 0 9px #f7e8c650;margin:7px 0 5px}.result-badge .icon{width:44px;height:44px}.star-row.large{gap:12px;margin:10px 0}.star-row.large .icon{width:42px;height:42px}.star-row.large span{animation:star-in .35s both}.star-row.large span:nth-child(2){animation-delay:.10s}.star-row.large span:nth-child(3){animation-delay:.20s}@keyframes star-in{from{transform:scale(.65) rotate(-15deg);opacity:.4}to{transform:scale(1);opacity:1}}.reward-pill{display:flex;align-items:center;gap:10px;background:#f6e7bb;padding:10px 20px;border-radius:24px;font-size:18px;font-weight:700;color:#8a6a36}.ad-button{display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid #d6dfce;border-radius:15px;background:#e9efe0;min-height:44px;padding:10px 13px;font-size:12px;font-weight:600;color:#547550}.ad-button .icon{width:16px;height:16px;fill:currentColor;stroke:none}.success-note{color:#468d6f!important}.ad-orbit{display:flex;align-items:center;justify-content:center;width:90px;height:90px;margin:7px 0;border-radius:50%;background:#e1eeea}.ad-orbit .icon{width:42px;height:42px;color:#428b8e}.finale-mark{display:flex;gap:8px;align-items:center;justify-content:center;color:#d4a548;margin:7px}.finale-mark .icon{width:42px;height:42px}.finale-mark .icon:nth-child(2){width:65px;height:65px;fill:#f3d185}.island-stamps{display:flex;justify-content:center;gap:5px;flex-wrap:wrap}.island-stamps span{display:flex;align-items:center;justify-content:center;border-radius:40% 55% 43% 51%;width:36px;height:36px;background:var(--stamp);color:#284b55;font-size:13px;font-weight:700}.island-tabs{display:grid;grid-template-columns:repeat(10,1fr);gap:4px}.island-tabs button{min-height:34px;font-size:12px;border-radius:10px;background:#e4eadd}.island-tabs .current{background:#477d77;color:#fffbed}.level-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:6px 0}.level-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;border:1px solid #dbe3d4;border-radius:17px;background:#fdfbee;min-height:86px;padding:9px 4px}.level-tile>b{font-family:Georgia,serif;font-size:26px;font-weight:500}.level-tile .star-row{gap:1px}.level-tile .star-row .icon{width:13px;height:13px}.level-tile.complete{background:#ecf1df;border-color:#d1dfc4}.level-tile.next-level{background:#ffe5b3;border-color:#edc388;box-shadow:0 3px 0 #e6d5ad44}.level-tile>.icon{width:17px;height:17px}.map-pagination{display:flex;justify-content:space-between;gap:8px}.map-pagination button{flex:1;font-size:12px}.skin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.skin-card{min-width:0;display:flex;flex-direction:column;gap:9px;background:#ffffff72;border:1px solid #e0e7d9;border-radius:19px;padding:12px}.skin-card.equipped{border-color:#8eada0;background:#e9f0df}.skin-card>h3{text-align:center}.skin-preview{padding:0;min-width:0;width:100%;line-height:0}.boat-art{width:100%;max-height:115px;display:block}.skin-card button:not(.skin-preview){font-size:11px;padding:9px 6px;line-height:1.3;min-height:41px}.equipped-button{color:#4e7c64;min-height:41px;font-weight:600}.skin-card .ad-button{font-size:10px!important}.daily-seal{align-self:center;width:64px;height:64px;border-radius:18px;background:#dbeade;display:flex;align-items:center;justify-content:center;color:#609783}.daily-seal .icon{width:35px;height:35px}.daily-feature{display:flex;flex-direction:column;gap:12px;padding:18px;background:#e7efe1;border-radius:19px}.daily-feature strong{font-family:Georgia,serif;font-size:23px;font-weight:500}.daily-feature span{font-size:12px;color:#678374}.day-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.day-tile{display:flex;flex-direction:column;gap:9px;align-items:center;justify-content:center;background:#fffdef;border:1px solid #dce4d4;border-radius:14px;min-height:75px;padding:9px 4px}.day-tile b{font-size:13px}.day-tile .star-row .icon{width:14px;height:14px}.ship-list{display:flex;flex-direction:column;gap:6px}.ship-row{text-align:left;display:flex;flex-direction:column;gap:5px;background:#eaf0e4;padding:13px 16px;border-radius:12px;font-size:12px;min-height:56px}.ship-row small{color:#718976;font-size:11px}.loader{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;padding:30px;text-align:center;background:radial-gradient(circle at 50% 35%,#fffbee,#d7eee6);color:var(--ink)}.loader h1{font-family:Georgia,serif;font-weight:500;font-size:43px;letter-spacing:-1.6px}.loader p{font-size:14px;line-height:1.6;max-width:470px;color:#6a8882}.loader .logo{width:75px;height:75px;color:#d99366}.loader-dots{display:flex;gap:7px}.loader-dots i{width:7px;height:7px;border-radius:50%;background:#91bbaa}.load-card{display:flex;flex-direction:column;align-items:center;gap:16px;max-width:450px}.load-card h1{font-size:28px}.load-card button{width:100%}
@media(min-width:960px) and (min-height:540px){.layout{grid-template-columns:290px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto auto;grid-template-areas:'head head' 'info stage' 'actions stage' 'save caption';padding:0 24px 10px;column-gap:20px}.topbar{padding:22px 8px 22px}.info{align-self:center;padding:25px 10px}.welcome{font-size:47px}.intro-copy{font-size:15px}.actions{padding:10px 0 20px}.home-secondary{grid-template-columns:1fr}.sail-button{padding:18px 15px;min-height:75px}.sail-button small{flex-direction:column;font-size:11px;gap:4px}.level-line{display:block;margin-top:12px}.level-line h1{font-size:39px;margin-bottom:13px}.instruction{font-size:15px;line-height:1.6;margin:17px 0}.level-meter{font-size:12px;flex-direction:column;align-items:flex-start;gap:7px;margin-top:22px}.play-tools{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:12px}.play-tools button{min-height:68px;font-size:12px}.access-tools{margin-top:9px}.access-tools button{font-size:11px}.build-mark{display:none}.stage{border-radius:34px}.caption{min-height:33px}.save-footer{justify-content:flex-start}.home-progress{margin-top:30px}}
@media(orientation:landscape) and (max-height:539px){.layout{grid-template-columns:190px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto auto;grid-template-areas:'head stage' 'info stage' 'actions stage' 'save caption';padding:8px 10px;column-gap:12px}.topbar{padding:2px 2px 6px;display:block}.brand{font-size:22px}.brand>.icon{width:23px;height:23px}.brand small{display:none}.resources{margin-top:7px;gap:5px}.resource{min-height:29px;font-size:11px;min-width:49px;padding:3px 8px;border-radius:12px}.resource .icon{width:15px;height:15px}.info{padding:4px 3px;overflow:auto;align-self:stretch}.welcome{font-size:26px;line-height:1.1;letter-spacing:-.8px;margin:5px 0}.intro-copy{font-size:11px;line-height:1.4}.eyebrow{font-size:8px;letter-spacing:1.2px}.home-progress{display:none}.actions{padding:3px 0}.sail-button{min-height:46px;padding:10px}.sail-button>span{font-size:15px;gap:5px}.sail-button>span>.icon{width:18px}.sail-button small{font-size:9px;gap:3px}.sail-button small>.icon{display:none}.home-secondary{margin-top:6px;gap:5px}.soft{min-height:38px;font-size:9px;gap:4px;border-radius:12px;padding:4px}.soft>.icon{width:17px;height:17px}.home-minor{margin-top:2px;gap:0}.home-minor button{font-size:9px;padding:2px 4px;min-height:25px}.stage{border-radius:20px}.caption{font-size:9px;min-height:20px;padding:2px 5px}.caption .icon{display:none}.save-footer{min-height:20px;padding:0 2px}.save-button{min-height:20px;font-size:8px}.build-mark{display:none}.level-line{display:block;margin:3px 0}.level-line h1{font-size:23px}.level-line .star-row{margin-top:6px}.level-line .icon{width:14px;height:14px}.instruction{font-size:10px;line-height:1.4;margin:5px 0}.level-meter{font-size:9px;margin:5px 0;gap:4px;flex-wrap:wrap}.play-tools{grid-template-columns:1fr 1fr;gap:0;padding:3px;border-radius:13px}.play-tools button{min-height:39px;font-size:9px;gap:2px;flex-direction:row}.play-tools button .icon{width:17px;height:17px}.access-tools{padding:1px}.access-tools button{font-size:8px;min-height:20px}.daily-date{font-size:9px}.dialog-body{padding:22px;gap:10px}.dialog-body h2{font-size:27px}.result-badge{width:50px;height:50px}.result-badge .icon{width:31px;height:31px}.star-row.large .icon{width:30px;height:30px}.star-row.large{margin:0}}
@media(max-width:370px) and (orientation:portrait){.layout{padding:0 8px}.topbar{padding:11px 4px 8px}.brand{font-size:22px;gap:5px}.brand>.icon{width:23px;height:23px}.brand small{font-size:7px;letter-spacing:1.5px}.resources{gap:5px}.resource{font-size:11px;min-width:43px;padding:5px 7px;gap:4px}.resource .icon{width:15px;height:15px}.info{padding:3px 8px 8px}.welcome{font-size:29px;margin:7px 0}.intro-copy{font-size:12px}.home-progress{margin-top:9px}.sail-button{min-height:54px;padding:12px 14px}.sail-button>span{font-size:18px}.home-secondary .soft{font-size:11px;gap:5px}.home-secondary .icon{width:19px}.home-minor button{font-size:10px}.level-line h1{font-size:23px}.instruction{font-size:11px}.play-tools{padding:5px}.play-tools button{font-size:9px;min-height:47px}.caption{font-size:10px}.build-mark{display:none}.dialog-body{padding:19px;gap:11px}.dialog-body h2{font-size:27px}.level-grid{gap:5px}.level-tile{min-height:72px;border-radius:13px}.level-tile b{font-size:22px}.level-tile .star-row .icon{width:10px}.island-tabs{gap:2px}.island-tabs button{font-size:10px;min-height:30px}.skin-card{padding:7px}.skin-grid{gap:8px}.skin-card h3{font-size:12px}.map-pagination button{font-size:10px;padding:9px 7px}.save-button{font-size:9px}}
@media(max-height:640px) and (orientation:portrait){.welcome{font-size:29px;margin:5px 0}.home-progress{display:none}.intro-copy{font-size:12px}.topbar{padding-top:10px;padding-bottom:7px}.info{padding-top:1px;padding-bottom:7px}.home-secondary{margin-top:7px}.sail-button{min-height:52px}.soft{min-height:40px}.home-minor button{min-height:25px}.caption{min-height:24px;font-size:10px}.actions{padding-top:3px}.level-line h1{font-size:24px}.instruction{margin:3px 0 5px;font-size:11px}.play-tools button{min-height:43px}.play-tools{padding:4px}.save-footer{min-height:21px}.save-button{min-height:21px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}[data-motion=off] *,[data-motion=off] *::before{animation:none!important;transition:none!important}

/* Yandex edition: the iframe's available viewport already excludes platform banners. */
html,body,#app{overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
body{position:fixed;inset:0}#app{height:100%;height:100dvh}
input,textarea{-webkit-user-select:text;user-select:text}
.brand{min-width:0;white-space:normal;font-family:inherit;letter-spacing:-.35px;font-size:clamp(15px,1.8vw,23px);line-height:1.2;flex:1}
.brand>span{min-width:0;max-width:410px}.brand small{font-family:inherit;font-size:8px;letter-spacing:.8px;line-height:1.3}
.resources{flex-shrink:0}.brand>.icon{flex-shrink:0}
.ad-button{white-space:normal;line-height:1.4;min-height:48px;text-wrap:pretty}
.skin-card .ad-button{font-size:12px;padding:9px 6px}.dialog-body{overflow-wrap:anywhere}
@media(max-width:600px){
 .brand{font-size:15px;letter-spacing:-.2px}.brand small{display:none}.brand>.icon{width:23px;height:23px}
 .topbar{padding:9px 2px 7px;gap:7px}.resources{gap:4px}.resource{min-width:38px;min-height:32px;font-size:11px;padding:5px 6px;gap:3px}
 .resource .icon{width:15px;height:15px}.layout{padding-left:6px;padding-right:6px}
 .layout[data-screen=game] .info{padding:3px 8px 7px}
 .layout[data-screen=game] .info .eyebrow{font-size:9px;letter-spacing:1px}
 .layout[data-screen=game] .instruction{font-size:11px;margin:3px 0 5px}
 .layout[data-screen=game] .level-line{margin:1px 0}.layout[data-screen=game] .level-line h1{font-size:23px}
 .stage{border-radius:18px}.caption{font-size:10px;min-height:24px;padding:3px 4px}
 .play-tools button{min-height:44px;font-size:10px}.play-tools{padding:4px}
 .save-footer{min-height:21px;padding-bottom:2px}.save-button{min-height:21px;font-size:9px}
 .save-footer .build-mark{display:none}
}
@media(max-width:600px) and (max-height:650px){
 .layout[data-screen=game] .info .eyebrow{display:none}.layout[data-screen=game] .instruction{display:none}
 .layout[data-screen=game] .level-line h1{font-size:21px}
 .home-progress{display:none}.intro-copy{font-size:11px}.welcome{font-size:25px;margin:4px 0}
 .sail-button{min-height:45px}.sail-button>span{font-size:17px}.soft{min-height:37px;font-size:11px}
 .home-minor button{min-height:28px}.caption{font-size:9px;min-height:20px}.topbar{padding-top:6px}
 .access-tools button{min-height:29px;font-size:11px}.actions{padding-top:3px}
}
@media(orientation:landscape) and (max-height:600px){
 .brand{font-size:14px}.brand>.icon{display:none}.brand small{display:none}
 .topbar{gap:4px}.resource{min-width:32px;min-height:25px;padding:3px 5px}
 .layout[data-screen=game] .instruction{display:none}.level-line h1{font-size:21px}
 .play-tools button{min-height:40px;font-size:10px}.access-tools button{min-height:30px;font-size:11px}
 .info .eyebrow{font-size:8px;letter-spacing:.7px}.save-footer .build-mark{display:none}
}

/* 1.1.1: intrinsic header + bounded home copy. The previous align-self:center
   let a tall headline paint ABOVE its grid row on short desktop viewports. */
.layout[data-screen=home] .info{
 min-height:0;min-width:0;align-self:stretch;overflow-x:hidden;overflow-y:auto;
 display:flex;flex-direction:column;justify-content:safe center;overscroll-behavior:contain;scrollbar-width:thin;
}
.layout[data-screen=home] .info>*{flex-shrink:0;max-width:100%}
.layout[data-screen=home] .info>:first-child{margin-top:0}
.layout[data-screen=home] .info>:last-child{margin-bottom:0}
.layout[data-screen=home] .welcome{overflow-wrap:break-word;text-wrap:balance}
.layout[data-screen=home] .topbar{position:relative;min-width:0}
.layout[data-screen=home] .home-secondary .soft{line-height:1.3;padding:7px 8px}
.layout[data-screen=home] .home-minor{flex-wrap:wrap}
@media(min-width:960px) and (min-height:540px){
 .layout[data-screen=home]{grid-template-columns:clamp(280px,27vw,370px) minmax(0,1fr);column-gap:18px}
 .layout[data-screen=home] .topbar{padding-top:14px;padding-bottom:14px}
 .layout[data-screen=home] .info{padding:12px 8px}
 .layout[data-screen=home] .welcome{font-size:clamp(29px,min(3.25vw,5.6vh),46px);line-height:1.09;letter-spacing:-1px;margin:9px 0}
 .layout[data-screen=home] .intro-copy{font-size:14px;line-height:1.5}
 .layout[data-screen=home] .home-progress{margin-top:16px}
 .layout[data-screen=home] .actions{padding:8px 0 10px}
 .layout[data-screen=home] .sail-button{min-height:57px;padding:13px 16px}
 .layout[data-screen=home] .sail-button small{flex-direction:row}
 .layout[data-screen=home] .home-secondary{grid-template-columns:1fr 1fr;margin-top:9px}
 .layout[data-screen=home] .home-secondary .soft{font-size:12px;min-height:46px}
 .layout[data-screen=home] .home-minor button{min-height:33px}
}
@media(min-width:960px) and (min-height:540px) and (max-height:740px){
 .layout[data-screen=home] .home-progress{display:none}
 .layout[data-screen=home] .welcome{font-size:clamp(28px,5.3vh,39px)}
}
@media(orientation:landscape) and (max-height:539px){
 .layout[data-screen=home] .info{padding:5px 3px}
 .layout[data-screen=home] .welcome{font-size:23px;margin:5px 0}
 .layout[data-screen=home] .home-minor button{padding:2px 4px;font-size:9px}
}
@media(orientation:portrait) and (max-height:650px){
 .layout[data-screen=home] .welcome{font-size:25px;line-height:1.08;margin:4px 0}
 .layout[data-screen=home] .info{padding:3px 8px 7px}
}
@media(orientation:portrait) and (max-height:480px){
 /* The decorative slogan gives way to the harbor and usable navigation. */
 .layout[data-screen=home] .info{display:none}
 .layout[data-screen=home] .sail-button{min-height:42px;padding:9px 12px}
 .layout[data-screen=home] .home-secondary{margin-top:5px}
 .layout[data-screen=home] .home-minor button{min-height:25px}
}
/* Only the platform paints its loading icon/title. Recovery is a real screen,
   not a second loading animation. Long error messages scroll inside the window. */
.loader{padding:20px;overflow:auto;z-index:20}
.loader .load-card{max-width:440px;width:100%;margin:auto;flex-shrink:0}
.loader .load-card h1{font-size:clamp(21px,4vw,29px);line-height:1.2;overflow-wrap:break-word}
.loader[data-state=loading][data-platform-managed=true]{pointer-events:none}
/* The same row containment also protects in-game instructions after a resize. */
.layout[data-screen=game] .info{min-height:0;align-self:stretch;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
@media(min-width:960px) and (min-height:540px) and (max-height:740px){
 .layout[data-screen=game] .topbar{padding-top:14px;padding-bottom:14px}
 .layout[data-screen=game] .info{padding:12px 10px}
 .layout[data-screen=game] .level-line h1{font-size:30px;margin-bottom:8px}
 .layout[data-screen=game] .instruction{font-size:13px;line-height:1.45;margin:10px 0}
 .layout[data-screen=game] .level-meter{margin-top:12px}
 .layout[data-screen=game] .actions{padding:8px 0 10px}
 .layout[data-screen=game] .play-tools{padding:8px;gap:6px}
 .layout[data-screen=game] .play-tools button{min-height:52px}
 .layout[data-screen=game] .access-tools{margin-top:4px}
}
