@font-face{font-family:"Playpen Sans";src:url("./assets/playpen-sans.ttf") format("truetype");font-weight:100 800;font-display:swap}
:root{font-family:Arial,"PingFang SC",sans-serif;color:#111;background:white;color-scheme:light}*{box-sizing:border-box}body{margin:0}main{width:min(calc(100% - 34px),470px);min-height:100svh;margin:auto;display:flex;flex-direction:column;align-items:center}h1{margin:clamp(40px,13.8svh,124px) 0 0;height:42px;font-size:0}.logo{position:relative;display:block;width:174px;height:43px}.logo img{position:absolute;max-width:none}.pasture{width:100%;aspect-ratio:1;margin-top:64px;position:relative;filter:drop-shadow(2px 3px 3px #0002)}canvas{width:100%;height:100%;display:block;background:#6e9026}form{width:76%;margin-top:60px}.input-bar{height:41px;background:#99b975;display:flex;align-items:center;padding-left:12px}input{width:0;flex:1;min-width:0;border:0;background:transparent;outline:0;border-radius:0;font:24px/1 Arial,sans-serif;letter-spacing:6px;color:white;caret-color:white}input::placeholder{font-size:12px;letter-spacing:1px;color:#f5f8ef}button{border:0;background:none;width:46px;height:41px;display:grid;place-items:center;cursor:pointer;flex:none}button img{transform:rotate(180deg);width:24px;height:auto}button:hover{background:#ffffff20}button:focus-visible{outline:2px solid #476526;outline-offset:3px}.input-bar:focus-within{outline:2px solid #739550;outline-offset:4px}.input-note{display:flex;justify-content:space-between;gap:8px;color:#8d9683;font-size:10px;margin-top:11px;letter-spacing:.1px}#count{white-space:nowrap}footer{margin-top:auto;padding:65px 0 max(48px,env(safe-area-inset-bottom));font-size:12px;color:#a9a9a9}.sr-only{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}.fallback{width:100%;height:100%;object-fit:cover}@media(min-width:700px){h1{margin-top:54px}.pasture{margin-top:40px}form{margin-top:38px}footer{padding:40px 0 28px}}@media(max-height:720px){h1{margin-top:32px}.pasture{margin-top:28px;width:min(100%,45svh)}form{margin-top:28px}footer{padding:30px 0 22px}.input-note{font-size:9px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

input{font-family:"Playpen Sans",cursive;font-weight:300}
