:root{font-family:"Hiragino Maru Gothic ProN","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:#304638;background:#f6f2e7;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer;border:1.5px solid #b9c8ac;background:#fffdf5;color:#304638;border-radius:13px;min-height:48px;padding:10px 15px;touch-action:manipulation}button:hover{background:#eaf1dc}button:focus-visible{outline:4px solid #d18428;outline-offset:2px}button:disabled{opacity:.45;cursor:default}main{max-width:1080px;margin:auto;padding:24px}header{display:flex;align-items:center;justify-content:space-between;gap:15px}h1{font-size:clamp(22px,3.5vw,36px);margin:2px 0 24px}h2{font-size:21px;margin:8px 0}.eyebrow{letter-spacing:.18em;font-size:12px;margin:0;color:#65765b}.intro{min-height:460px;padding:130px 35px 35px;text-align:center;background:#eef0dd url('assets/garden.png') center/cover;border-radius:28px;margin-top:20px}.intro p{line-height:1.9}.primary{background:#446c43;color:white;border-color:#446c43;font-weight:bold;padding:14px 28px}.primary:hover{background:#355534}.level{display:flex;justify-content:space-between;margin:12px 0 16px;font-weight:bold;gap:10px}.play{display:grid;grid-template-columns:1fr 300px;gap:20px}.garden{border:2px solid #d1cfb5;border-radius:25px;background:#edf0dd url('assets/garden.png') center/cover;padding:40px 24px 22px;display:flex;align-items:center;flex-direction:column;justify-content:center;min-height:430px}#board{display:grid;gap:3px;width:min(100%,420px);padding:9px;background:#9c7655;border-radius:14px;box-shadow:0 8px 0 #715639;touch-action:none}.cell{aspect-ratio:1;border:0;border-radius:5px;padding:0;min-height:0;background:#dfc7a1;position:relative}.cell:after{content:"";display:block;width:4px;height:4px;border-radius:50%;background:#b99467;position:absolute;top:45%;left:45%}.cell.filled{background:#bdd6a3}.cell.filled:after{display:none}.cell svg{width:90%;height:90%;display:block;margin:auto;animation:bloom .28s ease-out}.cell.hinted{outline:3px dashed #fff9bb;outline-offset:-4px;background:#dddfae}.cell.preview{box-shadow:inset 0 0 0 3px #4e783f;background:#dce6b8}.count{display:flex;justify-content:space-between;width:100%;gap:8px;margin-top:22px;font-size:14px;font-weight:bold}.small{font-size:13px;margin:5px 0 12px}aside{background:#fffdf6;border-radius:23px;padding:20px}#tray{display:grid;grid-template-columns:1fr 1fr;gap:9px}#tray button{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:10px;gap:7px;touch-action:none}#tray button[aria-pressed=true]{border:3px solid #446c43;background:#eaf2db;padding:8px}.mini{display:grid;gap:3px;height:33px}.mini i{width:7px;height:7px;background:#c8755f;border-radius:50%}#rotate{width:100%;margin-top:12px}#formula{font-weight:bold;text-align:center;font-size:18px;margin:12px 0}#message{font-size:14px;line-height:1.6;min-height:48px;margin-bottom:0}nav{display:flex;gap:10px;justify-content:center;margin:20px 0}#success{text-align:center;background:#fff7d6;border:2px solid #dbbd6f;border-radius:20px;padding:15px;margin-top:12px}footer{text-align:center;color:#64715a;font-size:13px;margin:24px 0 8px}.keys{font-size:11px;color:#65765b;text-align:center}@keyframes bloom{from{transform:scale(.25)}to{transform:scale(1)}}@media(prefers-reduced-motion:reduce){*{animation:none!important}}@media(max-width:700px){main{padding:15px}header{align-items:flex-start}header button{font-size:12px;padding:6px 10px}h1{margin-bottom:14px}.intro{padding:110px 14px 25px;min-height:430px}.play{grid-template-columns:1fr;gap:12px}.garden{padding:25px 12px 18px;min-height:0}#board{width:min(100%,350px)}aside{padding:14px}aside h2{font-size:18px}#tray{grid-template-columns:repeat(4,1fr)}#tray button{font-size:12px;padding:8px 4px}#tray button[aria-pressed=true]{padding:6px 2px}#rotate{width:auto;min-width:140px;float:right;margin:10px 0 0}#formula{text-align:left;padding-top:12px;font-size:17px}#message{clear:both;min-height:24px}nav{gap:6px;margin:12px 0}nav button{font-size:13px;padding:8px 10px}.level{font-size:14px}.keys{display:none}.count{font-size:13px}}

/* Improvement 1: counts remain readable over picture; rectangles show group edges. */
.count{background:#fffdf4eF;padding:10px 12px;border-radius:12px}.cell.filled{border-radius:2px}#success h2{color:#446c43}

/* Improvement 2: selected preview rotates too; short finished-garden celebration. */
#success{animation:reveal .35s ease-out}@keyframes reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.cell.filled:hover{background:#c8dfb2}
