/* garden.app desk window: 1–4 islands; all of them when maximized */
.gw-empty { margin: 0; font-size: 14px; padding: 6px 0; }
.gw-note { margin: 0 0 8px; font-size: 12px; }
.gw-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.gw-grid[data-n="2"], .gw-grid[data-n="3"], .gw-grid[data-n="4"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
/* maximized: big islands, two to a row (one if there's only one), so you can actually see the garden */
#win-garden { --max-w: 1240px; }
.win.max .gw-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.win.max .gw-grid[data-n="1"] { grid-template-columns: minmax(0, 760px); justify-content: center; }
.win.max .gw-name { font-size: 15px; padding: 2px 4px; }
.win.max .gw-open { padding: 8px; }
@media (max-width: 860px) { .win.max .gw-grid { grid-template-columns: minmax(0, 1fr); } }
.gw-card { display: flex; flex-direction: column; gap: 4px; }
.gw-open { display: flex; flex-direction: column; gap: 2px; width: 100%; padding: 4px; border: var(--b); background: var(--water); text-align: left; cursor: pointer; }
.gw-open:hover { box-shadow: var(--sh); }
.gw-name { font-weight: 700; font-size: 12px; padding: 0 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gw-open svg { width: 100%; height: auto; display: block; }
.gw-pin { font-size: 13px; font-weight: 700; display: flex; align-items: center; gap: 4px; }