body.village{overflow:hidden;height:100svh;background:var(--sky)}.village canvas{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}.village canvas:active{cursor:grabbing}.tags{position:fixed;inset:0;pointer-events:none;overflow:hidden}.tag{position:absolute;left:0;top:0;padding:2px var(--s2);border-radius:var(--r-button);background:var(--milk);border:2px solid var(--ink);font:700 var(--t-sm)/1.2 var(--text);white-space:nowrap}.tag.on{background:var(--yellow)}.bar{position:fixed;top:var(--s4);left:var(--s4)}.wordmark{font:400 var(--t-xl)/1 var(--display);color:var(--yellow);-webkit-text-stroke:.1em var(--ink);paint-order:stroke fill;text-shadow:0 .08em 0 var(--tomato),0 .12em 0 var(--ink);text-decoration:none}.wordmark:focus-visible{outline:3px solid var(--yellow);outline-offset:4px;border-radius:6px}.panel{position:fixed;background:var(--milk);border:2px solid var(--ink);border-radius:var(--r-box);padding:var(--s4)}.panel h2{margin:0 0 var(--s3);font:400 var(--t-md)/1 var(--display);letter-spacing:.02em}.panel ul{list-style:none;margin:0;padding:0}.who{top:80px;left:var(--s4);width:264px}.who button{display:grid;grid-template-columns:12px 1fr;column-gap:var(--s2);width:100%;padding:var(--s1) var(--s2);border:0;border-radius:10px;background:none;color:var(--ink);font:400 var(--t-sm)/1.35 var(--text);text-align:left;cursor:pointer}.who button:before{content:"";grid-row:span 2;align-self:center;width:12px;height:12px;border-radius:3px;background:var(--home);border:2px solid var(--ink)}.who strong{font-weight:700}.who span{color:var(--ink-soft)}.who button:hover{background:var(--yellow-soft)}.who button[aria-pressed=true]{background:var(--yellow)}.who button:focus-visible{outline:3px solid var(--tomato);outline-offset:1px}.log{right:var(--s4);bottom:var(--s4);width:340px}.log li{font-size:var(--t-sm);line-height:1.35;padding:3px 0}.log time{color:var(--ink-soft);font-variant-numeric:tabular-nums;margin-right:var(--s1)}.aside{margin:var(--s3) 0 0;padding-top:var(--s3);border-top:2px solid var(--ink);font-size:var(--t-sm);line-height:1.35}.hint{position:fixed;left:50%;bottom:var(--s4);transform:translate(-50%);margin:0;padding:var(--s2) var(--s4);border-radius:var(--r-button);background:var(--ink);color:var(--milk);font-size:var(--t-sm);transition:opacity .4s}.hint.gone{opacity:0}@media(max-width:760px){.who{top:auto;bottom:var(--s4);left:var(--s4);right:var(--s4);width:auto;max-height:30svh;overflow-y:auto;padding:var(--s3)}.who{max-height:32svh}.who h2{margin-bottom:var(--s2)}.who button{display:flex;gap:var(--s2);align-items:center;min-height:36px}.who button:before{flex:none}.who span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.log{display:none}.hint{bottom:auto;top:72px}}.attach-open{position:fixed;top:var(--s4);right:var(--s4);min-height:44px;padding:0 var(--s5);font-size:var(--t-sm)}.panel .visitors-title{margin-top:var(--s4)}.who button.mine strong{color:var(--tomato)}.tag.visitor{background:var(--sky);color:var(--milk)}.tag.visitor.mine{background:var(--tomato)}.tag.on,.tag.visitor.on{background:var(--yellow);color:var(--ink)}.log li.live{font-weight:700}.attach{width:min(560px,calc(100vw - 2 * var(--s4)));padding:var(--s6);border:3px solid var(--ink);border-radius:var(--r-box);background:var(--milk);color:var(--ink)}.attach::backdrop{background:#1d14268c}.attach h2{margin:0 0 var(--s4);font:400 var(--t-xl)/1.1 var(--display);letter-spacing:.02em}.attach p{margin:0 0 var(--s3)}.attach .actions{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s5)}.attach .actions.small{margin-top:0}.attach .status{min-height:1.5em;margin-top:var(--s4);font-weight:700}.attach .fine{margin:var(--s4) 0 0;font-size:var(--t-sm);color:var(--ink-soft)}.attach .close{position:absolute;top:var(--s4);right:var(--s4);border:0;background:none;color:var(--ink-soft);font:700 var(--t-sm)/1 var(--text);cursor:pointer;padding:var(--s2)}.button.ghost{background:var(--milk);color:var(--ink)}.button.ghost:hover{background:var(--yellow-soft)}.button:disabled{opacity:.5;cursor:wait}.text-button{border:0;background:none;padding:var(--s2) 0;color:var(--ink);font:700 var(--t-sm)/1.3 var(--text);text-decoration:underline;text-underline-offset:3px;cursor:pointer}.text-button:focus-visible,.attach .close:focus-visible{outline:3px solid var(--tomato);outline-offset:2px}@media(max-width:760px){.attach-open{top:var(--s3);right:var(--s3);padding:0 var(--s4)}.attach{padding:var(--s5)}.attach h2{font-size:var(--t-lg);padding-right:var(--s7)}}@media(min-width:761px){.who{max-height:calc(100svh - 120px);overflow-y:auto}}#visitors button:before{background:var(--crumb)}
