*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#e9e7cb;color:#3b584a;font-family:system-ui,sans-serif}body{background:radial-gradient(ellipse at top,#fff1ce,#dce5cb)}main{width:min(720px,calc(100% - 20px));margin:auto}header{height:64px;display:flex;justify-content:space-between;align-items:center;gap:8px}strong{font-size:25px;letter-spacing:3px;text-align:center}small{display:block;font-size:7px;letter-spacing:2px;margin-top:5px}a{color:#63826a;text-decoration:none;font-size:11px}button{min-height:44px;min-width:44px;font:600 12px system-ui;padding:7px 12px;border:1px solid #9eac84;border-radius:10px;background:#fff6db;color:#45684c;box-shadow:0 3px #becba6;cursor:pointer;touch-action:manipulation}button:disabled{opacity:.4;cursor:default}.hud{display:flex;justify-content:space-between;align-items:center;gap:5px;font-size:12px;height:48px}.garden{height:min(450px,calc(100svh - 280px));min-height:260px;aspect-ratio:4/3;max-width:100%;margin:auto;position:relative;overflow:hidden;border:6px solid #7f976a;border-radius:16px;background:#dbe6bd;box-shadow:0 7px #c2cd9e}canvas{width:100%;height:100%;display:block;object-fit:contain;touch-action:none;outline:none}#overlay{position:absolute;inset:0;background:#fff7e0f7;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:12px}h1{font-size:clamp(23px,4vw,35px);line-height:1.2;margin:10px 0}em{font-style:normal;display:block;color:#be8059}p{font-size:12px;line-height:1.7;margin:5px 0}#guide{font-size:10px;color:#839174}#primary{background:#718c59;color:#fff8dc;margin:10px 0 6px;min-width:170px}#restart{margin-bottom:7px}.panel{margin:12px auto 0;max-width:600px}.panel p{font-size:11px;height:22px}.build{display:flex;gap:8px;flex-wrap:wrap}.build button{flex:1}.wavebar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:9px;font-size:11px}#launch{background:#738e5b;color:#fff8db}footer{text-align:center;font-size:10px;color:#819172;margin:10px 0}[hidden]{display:none!important}@media(max-width:400px){header{height:55px}strong{font-size:20px}header small{font-size:5px}header button{padding:5px 8px}.hud{font-size:10px;height:46px}.garden{height:calc(100svh - 270px);min-height:265px;width:100%;aspect-ratio:auto}h1{font-size:24px}#copy{font-size:11px}#guide{font-size:9px}#primary{margin:7px 0 4px}.panel{margin-top:9px}.build{gap:5px}.build button{font-size:10px;padding:5px}.wavebar{font-size:9px;margin-top:7px}#launch{font-size:10px;max-width:135px}footer{font-size:8px;margin:6px 0}.panel p{font-size:10px}}@media(max-height:500px) and (orientation:landscape){main{width:calc(100% - 20px);height:100svh;display:grid;grid-template-columns:210px 1fr;gap:6px 12px}header{grid-column:1;height:auto;flex-wrap:wrap;justify-content:space-around}header strong{order:-1;width:100%;font-size:20px}.hud{grid-column:1;height:auto;flex-wrap:wrap}.garden{grid-column:2;grid-row:1/5;height:calc(100svh - 16px);width:100%;aspect-ratio:auto;align-self:center;min-height:0}.panel{grid-column:1;margin:0}.panel p{height:auto;font-size:10px}.build{gap:5px}.build button{font-size:10px;padding:4px}.wavebar{flex-wrap:wrap;font-size:10px;margin-top:6px}#launch{width:100%;font-size:10px}footer{grid-column:1;font-size:8px;margin:0}h1{font-size:25px}p{font-size:11px}}

header>a,header>button{flex-shrink:0;white-space:nowrap}header strong{min-width:0}