*{box-sizing:border-box}body{margin:0;background:#f2f4e8;color:#294532;font-family:'Yu Gothic','Meiryo',sans-serif}button,input{font:inherit}button{cursor:pointer}[hidden]{display:none!important}.garden-page{max-width:1240px;margin:auto;padding:18px 14px 28px}.garden-page h1{font-size:clamp(24px,3vw,36px);margin:8px 0}.garden-page>p{line-height:1.8}.parent-note{font-size:14px}#host{container-type:inline-size;position:relative;isolation:isolate;width:100%;aspect-ratio:16/9;border:3px solid #82906a;border-radius:16px;background:#c5dca5 url('./assets/garden.webp') center/cover;overflow:hidden;font-weight:800}#host:fullscreen{width:100vw;height:100dvh;aspect-ratio:auto;border:0;border-radius:0}#base{height:100%;display:flex;flex-direction:column;padding:1.5% 4% 2.5%;gap:2%}#host button{font-weight:800;border:2px solid #92a07d;border-radius:10px;background:#fff8e7;color:#294b35;min-height:2.3em;padding:.5em .7em;line-height:1.3;box-shadow:0 3px 0 #64795655}#host button:hover{border-color:#d4a635}#host button:focus-visible,input:focus-visible{outline:3px solid #fff;box-shadow:0 0 0 6px #b98020!important}#host .green-button,#host button[aria-pressed=true]{background:#486e3d;color:#fff9de;border-color:#335c35}#host .yellow-button{background:#f7d86e;color:#4b4329;border-color:#baa544}.garden-top{height:10%;min-height:39px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:clamp(11px,1.2cqw,20px)}.garden-top>strong{font-size:2em;background:#fff7e5e8;border:2px solid #a0a47d;border-radius:10px;padding:.25em .7em;white-space:nowrap}.top-tools{display:flex;gap:6px}.top-tools button{padding:.4em .6em!important}.journal{background:#fff5de url('./assets/journal.webp') center/100% 100%}.cover{flex:1;min-height:0;display:grid;grid-template-columns:50% minmax(0,1fr);gap:2%;font-size:clamp(12px,1.7cqw,28px)}.cover-garden{position:relative;display:flex;align-items:center;justify-content:center;min-height:0}.cover-garden>img{width:100%;height:100%;object-fit:cover;border-radius:12px;border:4px solid #f5efdd}.cover-garden>p{position:absolute;bottom:3%;left:8%;right:8%;margin:0;background:#fff6d9ed;border:2px solid #aaba8e;border-radius:10px;padding:.6em;font-size:1em;line-height:1.5;text-align:center}.order{padding:6% 10% 5% 13%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4%;min-height:0;text-align:center}.order h2{margin:0;font-size:1.15em}.sizes{display:flex;gap:8px;width:100%}.sizes button{flex:1;min-width:0;padding:.7em .3em!important}.sizes b{font-size:1.4em;display:block}.sizes span{font-size:.65em;display:block;margin-top:.4em}.rule-example{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:11cqw;aspect-ratio:1;gap:2px;margin-top:2%}.rule-example img{width:100%;height:100%;object-fit:contain;background:#dbe9c5;border:1px solid #8d9e78;border-radius:6px}.rule-example img:nth-child(5){background:#ffeca4;border-color:#ae8d2b}.order>p{font-size:.75em;line-height:1.6;margin:0}.order #start{width:100%;font-size:1.2em}.game{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 31%;gap:3%}.board-box{container-type:size;display:grid;place-items:center;min-height:0}.board{display:grid;grid-template-columns:repeat(var(--size),minmax(0,1fr));grid-template-rows:repeat(var(--size),minmax(0,1fr));gap:0;width:min(100cqw,100cqh);aspect-ratio:1;background:#8f7a51;border:5px solid #a19770;border-radius:8px;overflow:hidden}#host .flower{position:relative;background:#473321 url('./assets/bed.webp') center/100% 100%;padding:7%;border:0;min-height:0;aspect-ratio:1;border-radius:0;box-shadow:none;line-height:0}#host .flower>img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none}#host button.flower[aria-pressed=true]{background:#5c472d url('./assets/bed.webp') center/100% 100%;border:0}#host .flower.near::after{content:'';position:absolute;inset:4%;border:2px solid #c6e8a4;border-radius:4px;pointer-events:none}#host .flower.last::before{content:'';position:absolute;inset:3%;border:3px solid #f3c14b;border-radius:5px;z-index:1;pointer-events:none}#host .flower:focus-visible{outline:3px solid #fff;outline-offset:-6px;box-shadow:none!important;z-index:2}.garden-notes{padding:8% 9% 7% 15%;font-size:clamp(12px,1.6cqw,26px);min-height:0;text-align:center}#live{height:100%;display:flex;flex-direction:column;gap:4%;justify-content:center;min-height:0}#live dl{margin:0 0 4%;display:flex;flex-direction:column;gap:.5em}#live dl>div{display:flex;justify-content:space-between;align-items:center;gap:1em;border-bottom:1px solid #b7c49e;padding:.2em .4em}#live dt{font-size:.9em}#live dd{margin:0;font-size:2em;color:#395c31}#live button{font-size:.85em}#message{margin:.3em 0;min-height:3.2em;display:grid;place-content:center;font-size:.7em;line-height:1.6;color:#53653c;background:#e3edcf;border-radius:10px;padding:.6em}.size-tabs{display:flex;gap:6px;margin-top:auto}.size-tabs button{flex:1;font-size:.6em!important;padding:.4em!important}#result{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3%;font-size:.8em}#result h2{font-size:1.6em;margin:0;white-space:nowrap}#result>img{width:80%;height:28%;object-fit:contain;min-height:0}#result p{margin:0}.result-moves{font-size:1.3em}.result-moves strong{font-size:3em;line-height:1.1}#result button{width:100%;font-size:1em}#modal{position:absolute;inset:0;background:#294631bf;display:grid;place-items:center;padding:3%;z-index:8}.dialog{width:85%;max-width:800px;max-height:96%;overflow:auto;background:#fff6df url('./assets/journal.webp') center/100% 100%;padding:4% 6% 4% 9%;font-size:clamp(14px,1.6cqw,25px);border-radius:15px}.dialog header{display:flex;justify-content:space-between;align-items:center;gap:10px}.dialog h2{font-size:1.4em;margin:0}.dialog p{line-height:1.7}.dialog small{display:block;font-size:.8em;line-height:1.7}.dialog button{margin:.3em}.dialog label{display:block;margin-top:1em}.dialog input{width:95%}
@media(max-width:600px) and (orientation:portrait){.garden-page{padding:12px 8px}#host{height:780px;aspect-ratio:auto}#host:fullscreen{height:100dvh}#base{padding:12px 8px 16px;gap:10px}.garden-top{height:auto;min-height:77px;justify-content:center;flex-wrap:wrap;font-size:11px;gap:8px}.garden-top>strong{font-size:20px}.top-tools button{min-height:30px!important}.cover{grid-template-columns:1fr;grid-template-rows:29% minmax(0,1fr);gap:12px;font-size:16px}.cover-garden>p{font-size:12px;padding:6px;bottom:10px;left:15%;right:15%}.order{padding:25px 24px 25px 36px;gap:5%}.order h2{font-size:18px}.sizes{gap:7px}.sizes button{padding:12px 5px!important}.sizes b{font-size:23px}.sizes span{font-size:12px}.rule-example{width:94px;margin:0}.order>p{font-size:12px}.order #start{font-size:22px}.game{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:12px}.board-box{container-type:normal;aspect-ratio:1}.board{width:100%;height:auto}.garden-notes{padding:20px 20px 20px 34px;font-size:16px}#live{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto auto;gap:9px}#live dl{grid-column:1/3;flex-direction:row;gap:10px;margin:0}#live dl>div{flex:1;display:flex;flex-direction:column;gap:0;padding:2px}#live dt{font-size:11px;white-space:nowrap}#live dd{font-size:27px}#live button{font-size:13px!important;min-height:33px!important;padding:6px!important}#choose{grid-column:1/3}#message{grid-column:1/3;font-size:12px;min-height:38px;margin:0;padding:6px}.size-tabs{grid-column:1/3;margin:0}#live .size-tabs button{font-size:12px!important;min-height:28px!important;padding:4px!important}#result{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto auto;gap:8px 10px;font-size:14px}#result h2{grid-column:1/3;font-size:23px}#result>img{grid-column:1;grid-row:2/4;width:100%;height:100%;max-height:120px}#result .result-moves{grid-column:2;grid-row:2;font-size:17px}#result .result-moves strong{font-size:46px}#result>p:last-of-type{grid-column:2;grid-row:3;font-size:12px}#result button{font-size:13px!important;min-height:34px!important;padding:6px!important}#result #menu{grid-column:1/3}.dialog{width:100%;padding:25px 22px 25px 33px;font-size:15px}.dialog h2{font-size:20px}.dialog header button{font-size:12px}.dialog p{line-height:1.6}}
@media(max-height:550px) and (orientation:landscape){.garden-page{padding:8px}#host{width:min(100%,calc((100dvh - 16px)*16/9));margin:auto}.garden-top{min-height:28px;font-size:9px}.garden-top>strong{font-size:15px}.top-tools{gap:3px}.top-tools button{font-size:9px}.cover{font-size:1.7cqw}.garden-notes{font-size:1.6cqw}.dialog{font-size:14px}.dialog p{margin:.5em 0}}