*{box-sizing:border-box}body{margin:0;background:#fbf5e9;color:#593e29;font-family:'Yu Gothic','Meiryo',sans-serif}button,input{font:inherit}button{cursor:pointer}[hidden]{display:none!important}.village-page{max-width:1240px;margin:auto;padding:18px 14px 28px}.village-page h1{font-size:clamp(24px,3vw,36px);margin:8px 0}.village-page>p{line-height:1.8}.parent-note{font-size:14px}#host{--pet-size:7.2cqw;container-type:inline-size;position:relative;isolation:isolate;width:100%;aspect-ratio:16/9;border:3px solid #b79262;border-radius:16px;background:#ead9ac url('./assets/meadow.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%;padding:1.5% 3% 2%;display:flex;flex-direction:column;gap:2%}#host button{font-weight:800;line-height:1.3;border:2px solid #b49b76;border-radius:12px;background:#fff7e6;color:#673d29;min-height:2.3em;padding:.45em .7em;box-shadow:0 3px 0 #80533344}#host button:hover{border-color:#b94c2a}#host button:focus-visible,input:focus-visible{outline:3px solid #fff;box-shadow:0 0 0 6px #bd4b29!important}#host .red-button{background:#aa3e2b;color:#fff8de;border-color:#84311f}.village-top{height:9%;min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:clamp(11px,1.3cqw,22px)}.village-top>strong{font-size:2.2em;background:#fff1dbe8;border:2px solid #b29266;border-radius:10px;padding:.15em .6em;white-space:nowrap;color:#74321f}.top-tools{display:flex;gap:6px}.top-tools button{padding:.4em .6em!important}.paper{background:#fff5e5 url('./assets/paper.webp') center/100% 100%}.cover{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 38%;gap:2%;font-size:clamp(12px,1.8cqw,30px)}.village-cover{width:100%;height:100%;object-fit:cover;min-height:0;border:4px solid #f8ebcf;border-radius:13px}.invitation{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4%;padding:6% 8%;min-height:0;text-align:center}.invitation h2{font-size:1.55em;color:#80361e;line-height:1.4;margin:0}.cover-pets{display:flex;align-items:flex-end;justify-content:center;width:100%;height:24%}.cover-pets img{width:33%;height:100%;object-fit:contain;min-height:0}.invitation p{margin:0;font-size:.8em;line-height:1.6}.invitation #start{width:100%;font-size:1.3em}#game{flex:1;min-height:0;display:grid;grid-template-rows:15% minmax(0,1fr) 27%;gap:2%}#clues{margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1.5%;list-style:none;counter-reset:clue}#clues li{display:flex;align-items:center;justify-content:center;gap:.45em;padding:.4em .6em;background:#fff3dfeF url('./assets/paper.webp') center/100% 100%;font-size:clamp(13px,1.6cqw,27px);line-height:1.5;min-width:0;color:#57301f}#clues li::before{counter-increment:clue;content:counter(clue);display:grid;place-items:center;background:#b55b37;color:white;flex-shrink:0;width:1.6em;height:1.6em;border-radius:50%;font-size:.8em}.houses{display:grid;grid-template-columns:repeat(3,1fr);gap:2%;min-height:0}#host .house{position:relative;background:transparent;border:0;box-shadow:none;padding:0;min-height:0;width:100%;height:100%;border-radius:9px}#host .house:hover{background:#fff4c329}.cottage{position:absolute;left:0;bottom:20%;width:100%;height:80%;object-fit:contain;pointer-events:none}.house-label{position:absolute;left:50%;transform:translateX(-50%);bottom:38%;font-size:1.55cqw;background:#fff7e7;border:2px solid #bc9961;padding:.2em .5em;border-radius:6px;white-space:nowrap}.resident-slot{position:absolute;left:50%;transform:translateX(-50%);bottom:1%;width:calc(var(--pet-size)*1.7);height:calc(var(--pet-size)*1.02);display:flex;align-items:flex-end;justify-content:center}.resident-slot::before{content:'';position:absolute;bottom:0;width:100%;height:26%;background:#fff3d0;border:1px solid #c6af77;border-radius:50%;z-index:-1}.resident-slot>img{width:var(--pet-size);height:var(--pet-size);object-fit:contain;display:block;position:relative;pointer-events:none}.resident-slot>span{font-size:1.1cqw;align-self:flex-end;padding-bottom:.4em;color:#725333}#host .house[data-filled=true] .resident-slot>span{display:none}.play-footer{min-height:0;padding:1.3% 2.5%;border-top:2px solid #b48b60;border-radius:8px}#controls{height:100%;display:grid;grid-template-columns:26% 43% minmax(0,1fr);gap:2%;align-items:center}#message{font-size:1.55cqw;line-height:1.65;margin:0;color:#773521;white-space:pre-line}#host[data-feedback=wrong] #message,#host[data-feedback=empty] #message{background:#ffe4bb;border-radius:8px;padding:.5em}#animals{display:flex;justify-content:center;gap:5%;height:100%;min-height:0}#host .pet-choice{min-width:0;width:30%;height:100%;padding:.2em .4em;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:1.5cqw}#host .pet-choice[aria-pressed=true]{border:3px solid #b74622;background:#ffe6a8;box-shadow:0 0 0 3px #ffefbc}.pet-choice img{width:var(--pet-size);height:var(--pet-size);object-fit:contain;display:block;flex-shrink:0}.pet-choice span{line-height:1.2}.answer-tools{display:flex;flex-direction:column;gap:6%;height:100%;justify-content:center;font-size:1.35cqw}.answer-tools #check{font-size:1.25em}.answer-tools #menu{font-size:.8em;min-height:1.8em;padding:.3em}.answer-tools #restart{min-height:2em;padding:.3em}#result{display:flex;align-items:center;justify-content:space-between;height:100%;gap:4%}.success{display:flex;align-items:center;gap:12px;min-width:0}.success img{width:9cqw;height:9cqw;object-fit:contain}.success h2{margin:0;color:#8c321f;font-size:2.1cqw;line-height:1.3}.success p{font-size:1.3cqw;margin:.4em 0 0}.result-tools{display:flex;gap:7px;flex:1;justify-content:flex-end;font-size:1.2cqw}.result-tools button{max-width:34%}#modal{position:absolute;inset:0;background:#583a23bd;display:grid;place-items:center;padding:3%;z-index:8}.dialog{width:85%;max-width:800px;max-height:96%;overflow:auto;padding:4% 5%;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){.village-page{padding:12px 8px}#host{height:800px;aspect-ratio:auto;--pet-size:64px}#host:fullscreen{height:100dvh}#base{padding:12px 8px 16px;gap:10px}.village-top{height:auto;min-height:77px;justify-content:center;flex-wrap:wrap;font-size:11px;gap:8px}.village-top>strong{font-size:25px}.top-tools button{min-height:30px!important}.cover{grid-template-columns:1fr;grid-template-rows:33% 1fr;font-size:16px;gap:10px}.invitation{padding:20px 28px;gap:4%}.invitation h2{font-size:24px}.cover-pets{height:80px}.invitation p{font-size:14px}.invitation #start{font-size:24px}#game{grid-template-rows:145px minmax(0,1fr) 230px;gap:10px}#clues{grid-template-columns:1fr;gap:5px}#clues li{font-size:16px;justify-content:flex-start;padding:6px 12px}.houses{gap:2px}.cottage{height:68%;bottom:30%}.house-label{font-size:13px;padding:3px 5px;bottom:30%;border-width:1px}.resident-slot{width:95%;bottom:0;height:70px}.resident-slot>span{font-size:10px}.play-footer{padding:10px}#controls{grid-template-columns:1fr;grid-template-rows:37px 100px minmax(0,1fr);gap:8px}#message{font-size:13px;line-height:1.5;text-align:center;white-space:normal}#host[data-feedback=wrong] #message,#host[data-feedback=empty] #message{padding:4px}#animals{gap:10px}#host .pet-choice{width:31%;padding:4px;font-size:14px}.answer-tools{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:5px;font-size:11px}.answer-tools #check{grid-row:1/3;font-size:16px}.answer-tools #menu{font-size:10px;min-height:0;padding:3px}.answer-tools #restart{font-size:11px;min-height:0;padding:3px}#result{flex-direction:column;justify-content:center;gap:10px}.success{gap:12px}.success img{width:67px;height:67px}.success h2{font-size:21px}.success p{font-size:12px}.result-tools{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;flex:0;font-size:12px}.result-tools button{max-width:none;min-height:34px!important}.result-tools #next{grid-column:1/3;font-size:16px}.dialog{width:100%;padding:25px 22px;font-size:15px}.dialog h2{font-size:20px}.dialog header button{font-size:12px}.dialog p{line-height:1.6}}
@media(max-width:350px) and (orientation:portrait){#host{--pet-size:54px}.house-label{font-size:11px}.success h2{font-size:18px}}
@media(max-height:550px) and (orientation:landscape){.village-page{padding:8px}#host{width:min(100%,calc((100dvh - 16px)*16/9));margin:auto}.village-top{min-height:25px;font-size:9px}.village-top>strong{font-size:20px}.top-tools{gap:3px}.top-tools button{font-size:9px}#clues li{font-size:1.6cqw}.dialog{font-size:14px}.dialog p{margin:.5em 0}}

.resident-slot>span{position:absolute;bottom:0;left:0;width:100%;text-align:center}