.sfl-game{color:#28362f;min-height:100vh;font-family:var(--font-sans,ui-sans-serif);background:#e9dfbd linear-gradient(135deg,#d5c99f55 25%,#0000 25% 75%,#d5c99f55 75%) 0 0/30px 30px}.sfl-top{color:#fff7dc;letter-spacing:.12em;background:#245d62;justify-content:space-between;align-items:center;height:52px;padding:0 max(18px,4vw);display:flex}.sfl-top a{color:inherit;align-items:center;gap:7px;font-weight:900;text-decoration:none;display:flex}.sfl-top svg{width:18px}.sfl-top small{opacity:.65}.sfl-shell{width:min(1180px,94vw);margin:28px auto 56px}.sfl-heading{justify-content:space-between;align-items:end;margin-bottom:15px;display:flex}.sfl-heading p{color:#b24d35;letter-spacing:.12em;margin:0 0 3px;font-weight:950}.sfl-heading h1{margin:0;font-size:clamp(35px,6vw,66px);line-height:.95}.sfl-heading>button{color:#fff;background:#245d62;border:0;border-radius:50%;place-items:center;width:48px;height:48px;display:grid}.sfl-layout{grid-template-columns:minmax(0,1fr) 280px;gap:18px;display:grid}.sfl-board,.sfl-side{background:#fff8df;border:3px solid #31544f;border-radius:24px;overflow:hidden;box-shadow:8px 8px #c4563c}.sfl-hud{background:#d4c18d;border-bottom:1px solid #d4c18d;grid-template-columns:repeat(6,1fr);gap:1px;display:grid}.sfl-hud>div{background:#fff8df;padding:11px 10px}.sfl-hud small{color:#806949;letter-spacing:.08em;font-size:10px;font-weight:900;display:block}.sfl-hud strong{font-size:19px}.sfl-hud em{color:#8b7658;font-size:11px;font-style:normal}.sfl-field{--gap:5px;grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--rows),1fr);gap:var(--gap);aspect-ratio:9/7;touch-action:none;background:#1e7779;padding:18px;display:grid;position:relative;overflow:hidden}.sfl-field:before{content:"";pointer-events:none;background:repeating-linear-gradient(7deg,#fff4 0 2px,#0000 2px 16px);position:absolute;inset:0}.sfl-cell{border-radius:8px;place-items:center;min-width:0;display:grid;position:relative;overflow:hidden}.sfl-cell.water{background:#63b7b2;box-shadow:inset 0 0 0 1px #d9f4e933}.sfl-cell.owned{background:#f4e8be;box-shadow:inset 0 0 0 3px #dfc77f}.sfl-cell.owned:after{content:"";border:1px dashed #b49a59;border-radius:4px;position:absolute;inset:7px}.sfl-cell.trail{background:#79beb5}.sfl-cell.trail i{background:#c54e3a;border:3px solid #fff1c7;border-radius:99px;width:115%;height:12px;position:absolute;transform:rotate(-12deg);box-shadow:0 2px #71372d}.sfl-cell.mark .sun{color:#f6ce55;filter:drop-shadow(0 2px #9e6c29);width:26px;animation:1.2s ease-in-out infinite sunPulse}.sfl-cell.reef{background:#356b69}.sfl-cell .stake{color:#caa66a;font-size:30px;font-weight:950;transform:rotate(12deg)}.sfl-cell .tide{z-index:6;aspect-ratio:1;color:#a9e0df;background:#324b70;border:3px solid #d7f6ec;border-radius:50% 55% 45% 60%;place-items:center;width:min(72%,36px);font-size:11px;font-weight:950;animation:.7s ease-in-out infinite alternate tideBob;display:grid;box-shadow:0 5px #223049}.sfl-cell .worker{z-index:8;aspect-ratio:1;color:#fff3d3;background:#c74f3b;border:4px solid #283e39;border-radius:50%;place-items:center;width:min(78%,40px);font-weight:950;display:grid;box-shadow:0 4px #7b3328}.sfl-overlay{z-index:20;color:#fff8df;text-align:center;background:#163f43e8;place-items:center;padding:18px;display:grid;position:absolute;inset:0}.sfl-overlay>div{max-width:650px}.sfl-overlay span{letter-spacing:.22em;color:#f3cc65;font-size:12px;font-weight:950}.sfl-overlay h2{margin:8px 0;font-size:clamp(28px,5vw,48px)}.sfl-overlay p{line-height:1.6}.sfl-overlay button{color:#fff;background:#c5523b;border:2px solid #fff2cc;border-radius:14px;align-items:center;gap:8px;margin:5px;padding:13px 18px;font-weight:950;display:inline-flex}.sfl-overlay button.secondary{background:0 0}.sfl-overlay>div>small{opacity:.75;margin-top:13px;display:block}.sfl-upgrades{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.sfl-upgrades button{justify-items:center;margin:0;display:grid}.sfl-upgrades small{font-weight:600}.sfl-controls{background:#ddc892;grid-template-columns:repeat(4,1fr);gap:9px;padding:11px;display:grid}.sfl-controls button{color:#2c3931;background:#fff7df;border:2px solid #71523b;border-radius:14px;justify-content:center;align-items:center;gap:7px;min-height:62px;font-weight:950;display:flex}.sfl-controls button:hover:not(:disabled){color:#fff;background:#2a6e6d}.sfl-controls button:disabled{opacity:.45}.sfl-status{border-top:1px solid #ddc89d;justify-content:space-between;align-items:center;gap:12px;padding:11px 15px;display:flex}.sfl-status p{margin:0;font-weight:750}.sfl-status>div{white-space:nowrap;align-items:center;gap:10px;display:flex}.sfl-status button{color:#fff;background:#245d62;border:0;border-radius:10px;align-items:center;gap:5px;padding:8px 11px;display:flex}.sfl-status svg{width:15px}.sfl-side{padding:22px}.sfl-side>span{letter-spacing:.2em;color:#b54e38;font-size:11px;font-weight:950}.sfl-side h2{margin:6px 0;font-size:28px}.sfl-side>p{color:#654f39;line-height:1.5}.sfl-side>div{grid-template-columns:36px 1fr;gap:9px;margin:19px 0;display:grid}.sfl-side>div svg{color:#b9533d}.sfl-side>div p{margin:0}.sfl-side b,.sfl-side small{display:block}.sfl-side small{color:#705943;line-height:1.45}.sfl-side details{border-top:1px solid #d8bd87;padding-top:14px}.sfl-side summary{font-weight:950}.sfl-side details p{line-height:1.5}.sfl-batch,.game-focus .sfl-side,.game-focus .sfl-heading{display:none}.game-focus .sfl-layout{grid-template-columns:1fr}.game-focus .sfl-shell{width:min(900px,98vw)}@keyframes tideBob{to{transform:translateY(-5px)rotate(5deg)}}@keyframes sunPulse{50%{transform:scale(1.16)}}@media (max-width:860px){.sfl-layout{grid-template-columns:1fr}.sfl-side{display:none}.sfl-shell{width:min(760px,96vw)}}@media (max-width:540px){.sfl-shell{margin-top:14px}.sfl-top{font-size:11px}.sfl-heading h1{font-size:38px}.sfl-hud{grid-template-columns:repeat(3,1fr)}.sfl-field{--gap:3px;padding:9px}.sfl-cell{border-radius:5px}.sfl-cell.owned:after{inset:3px}.sfl-cell .tide{border-width:2px;font-size:9px}.sfl-cell .worker{border-width:3px;font-size:10px}.sfl-controls{gap:5px;padding:8px}.sfl-controls button{justify-items:center;gap:0;min-height:54px;padding:4px;display:grid}.sfl-status{display:block}.sfl-status>div{justify-content:space-between;margin-top:8px}.sfl-upgrades{grid-template-columns:1fr}.sfl-overlay{padding:10px}.sfl-overlay h2{font-size:28px}}@media (max-width:360px){.sfl-field{--gap:2px;padding:6px}.sfl-hud>div{padding:8px}.sfl-hud strong{font-size:16px}.sfl-controls button b{font-size:11px}.sfl-cell .sun{width:18px}}@media (prefers-reduced-motion:reduce){.sfl-cell .tide,.sfl-cell.mark .sun{animation:none}}
