.tide-shell{max-width:1120px;margin:auto;padding:40px 20px 60px}.tide-shell h1{font-size:clamp(2rem,5vw,3.5rem);margin:12px 0}.tide-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:28px;align-items:start;margin-top:24px}.tide-panel{background:#fff;border:1px solid #c8dfe3;border-radius:22px;padding:24px;box-shadow:0 14px 40px #17324d0b;min-width:0}.tide-toolbar{display:flex;justify-content:space-between;gap:12px;font-size:.8rem;color:#45616b}.tide-toolbar strong{display:block;font-size:1.1rem;color:#17324d}.tide-panel h2{margin:20px 0 8px}.tide-current{background:#173f50;color:white;border-radius:10px;padding:12px;font-weight:700}.tide-panel [role=status]{min-height:3.2em;font-size:.9rem}.tide-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.tide-cell{aspect-ratio:1;border:2px solid #cfe3e7;border-radius:12px;background:#eaf5f7;color:#44636c;font:inherit;padding:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0}.tide-cell small{font-size:.7rem}.tide-cell strong{font-size:1.05rem}.tide-cell.selected{border-color:#31788b;box-shadow:inset 0 0 0 1px #31788b}.tide-cell.boat-0{background:#d8edf5;color:#163f59}.tide-cell.boat-1{background:#fff0c7;color:#654b13}.tide-cell.boat-2{background:#f6dfdd;color:#733d3e}.tide-cell.docked{border-style:double;border-width:4px}.tide-cell:disabled{opacity:1;cursor:default}.tide-controls{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.tide-controls .button{min-height:44px;white-space:normal;line-height:1.5}.tide-controls button:disabled{opacity:.5;cursor:default}.tide-controls [hidden]{display:none}.tide-panel label{font-size:.85rem;display:block}.tide-panel input{width:18px;height:18px;vertical-align:middle}.tide-help{padding:8px 12px;line-height:1.9}.tide-help h2{font-size:1.15rem}.tide-help li{margin-bottom:10px}.tide-shell button:focus-visible{outline:3px solid #b85320;outline-offset:3px}
@media(max-width:760px){.tide-layout{grid-template-columns:1fr;gap:16px}.tide-shell{padding:24px 12px}.tide-panel{padding:16px}.tide-board{gap:5px}.tide-cell{border-radius:9px}.tide-help{padding:0 8px}.tide-controls .button{padding:10px 12px;font-size:.85rem}}