.pm-number{border:2px solid var(--color-ink);background:var(--color-paint-2);width:1.75rem;height:1.75rem;color:var(--color-ink);font:700 .9375rem/1 var(--font-body);border-radius:50%;place-items:center;display:grid;position:absolute;top:0;left:50%;transform:translate(-50%,-60%)}@media (width<=760px){.pm-number{width:1.5rem;height:1.5rem;font-size:.8125rem}}.pm-mark{border:2px dashed color-mix(in srgb, var(--color-surface) 90%, transparent);box-shadow:0 0 0 1px color-mix(in srgb, var(--color-ink) 55%, transparent), inset 0 0 0 1px color-mix(in srgb, var(--color-ink) 55%, transparent);cursor:pointer;background:0 0;border-radius:.4rem;padding:0;position:absolute}.pm-mark:after{content:"";width:max(100%,44px);height:max(100%,44px);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.pm-mark.paired{border:2px solid var(--color-paint-2)}.pm-mark.active{border-color:var(--color-ink);box-shadow:0 0 0 3px var(--color-paint-2), 0 0 0 5px var(--color-ink)}.pm-remove{border:2px solid var(--color-surface);background:var(--color-ink);width:1.5rem;height:1.5rem;color:var(--color-surface);font:700 1rem/1 var(--font-body);cursor:pointer;border-radius:50%;place-items:center;padding:0;display:grid;position:absolute;transform:translate(-50%,-50%)}.pm-remove:after{content:"";position:absolute;inset:-.625rem}.pm-actions{z-index:1;white-space:nowrap;transform:translateX(calc(-1 * var(--shift)));cursor:default;gap:.375rem;margin:.5rem 0;display:flex;position:absolute}.pm-board{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.pm-board .pm-art-panel{position:sticky;top:1rem}.pm-board .pm-art{width:min(100%, calc((100svh - 3.5rem) * var(--ratio)))}.pm-board .pm-photo{width:min(100%, calc(55svh * var(--ratio)));justify-self:center}@media (width<=760px){.pm-board{margin-inline:calc(-1 * var(--gutter));grid-template-columns:minmax(0,1fr);gap:.75rem}.pm-board .pm-art{width:min(100%, calc(42svh * var(--ratio)))}.pm-board .pm-art-panel{z-index:1;box-shadow:0 0 0 .5rem var(--color-paper), 0 .75rem 1rem 0 color-mix(in srgb, var(--color-ink) 40%, transparent);top:.5rem}.pm-board .pm-photo{width:min(100%, calc(40svh * var(--ratio)))}}.pm-figure{cursor:pointer;background:0 0;border:2px solid #0000;border-radius:.4rem;padding:0;position:absolute}.pm-figure.filled{border-color:color-mix(in srgb, var(--color-paint-2) 70%, transparent)}.pm-figure.empty{border:2px dashed color-mix(in srgb, var(--color-surface) 90%, transparent);box-shadow:0 0 0 1px color-mix(in srgb, var(--color-ink) 55%, transparent), inset 0 0 0 1px color-mix(in srgb, var(--color-ink) 55%, transparent)}.pm-figure.needed{border:2px dashed var(--color-primary)}.pm-figure.empty .pm-number,.pm-figure.needed .pm-number{background:var(--color-surface)}.pm-figure.next{border:2px solid var(--color-ink);box-shadow:0 0 0 3px var(--color-paint-2)}@media (prefers-reduced-motion:no-preference){.pm-figure.next{animation:1.4s ease-in-out infinite pm-figure-next}}@keyframes pm-figure-next{50%{box-shadow:0 0 0 6px color-mix(in srgb, var(--color-paint-2) 40%, transparent)}}.pm-figure.target:hover{border-color:var(--color-ink);box-shadow:0 0 0 3px var(--color-paint-2)}.pm-next-step{z-index:20;padding:1.5rem var(--gutter) max(1rem, env(safe-area-inset-bottom));background:linear-gradient(to top, var(--color-paper) 55%, transparent);pointer-events:none;justify-content:center;display:flex;position:fixed;inset:auto 0 0}.pm-next-step .button{pointer-events:auto}.pm-wait-game canvas{border:2px solid var(--color-ink);background:var(--color-paper);cursor:pointer;touch-action:manipulation;user-select:none;border-radius:.5rem}.pm-ring{isolation:isolate;width:9rem;height:9rem;position:relative}.pm-ring svg{position:absolute;inset:0;transform:rotate(-90deg)}.pm-ring circle{fill:none;stroke-width:6px}.pm-ring .track{stroke:var(--color-line)}.pm-ring .bar{stroke:var(--color-primary);stroke-dasharray:1;stroke-linecap:round;transition:stroke-dashoffset .25s linear}.pm-ring-face{background-repeat:no-repeat;background-color:var(--color-line);border-radius:50%;display:block;position:absolute;inset:.75rem}.pm-ring-swirl{mix-blend-mode:soft-light;opacity:calc(.9 - var(--shown) * .75);border-radius:50%;transition:opacity .25s linear;position:absolute;inset:.75rem;overflow:hidden}.pm-ring-swirl svg{width:100%;height:100%;display:block}.pm-ring-swirl .p1{fill:gray}.pm-ring-swirl .p2{fill:#fff}.pm-ring-swirl .p3{fill:#000}.pm-ring-swirl .p4{fill:#bfbfbf}@media (prefers-reduced-motion:no-preference){.pm-ring-swirl svg{animation:7s linear infinite pm-ring-stir}}@keyframes pm-ring-stir{to{transform:rotate(360deg)}}.pm-notify .input{width:min(100%,18rem)}.pm-quip{border:1px solid var(--color-line);background:var(--color-surface);max-width:24rem;box-shadow:0 6px 16px -8px color-mix(in srgb, var(--color-ink) 45%, transparent);border-radius:3px;margin:.75rem 0 .25rem;padding:.9rem 1.4rem;animation:.5s ease-out pm-quip;position:relative}[data-mood=playful] .pm-quip{rotate:-1deg}[data-mood=playful] .pm-quip:before{content:"";background:color-mix(in srgb, var(--color-paint-2) 55%, transparent);width:3.5rem;height:.95rem;position:absolute;top:-.5rem;left:50%;translate:-50%;rotate:3deg}@keyframes pm-quip{0%{opacity:0;transform:translateY(.25rem)}}@media (prefers-reduced-motion:reduce){.pm-quip{animation:none}}.pm-face-button{cursor:pointer;background:0 0;border:0;padding:0;position:relative}.pm-face-button:disabled{opacity:.45;cursor:not-allowed}.pm-face{border:2px solid var(--color-ink);background-repeat:no-repeat;background-color:var(--color-line);border-radius:50%;width:4.5rem;height:4.5rem;display:block}.pm-face-button .pm-number{top:auto;bottom:-.5rem;transform:translate(-50%)}.pm-portrait{--preview-max-h:80vh}@media (width>=861px) and (height>=560px){.pm-portrait{--preview-max-h:calc(100svh - 14rem)}.pm-portrait-art{position:sticky;top:1rem}}.pm-preview{max-height:var(--preview-max-h);border-radius:var(--radius);box-shadow:4px 4px 10px var(--color-ink)}@media (width<=860px){.pm-portrait[data-view=preview] .room-scene,.pm-portrait[data-view=wall] .pm-preview-figure,.pm-portrait[data-view=wall] .pm-try-another{display:none}}.pm-preview-frame{display:grid;position:relative}.pm-preview-frame[data-loading]{width:var(--frame-width);aspect-ratio:var(--ratio)}.pm-preview-frame[data-loading] .pm-preview{opacity:0;position:absolute;inset:0}.pm-preview-frame .pm-preview{transition:opacity .3s ease-out}.pm-preview-wait{border:1px solid var(--color-line);border-radius:var(--radius);background:var(--color-surface);text-align:center;place-content:center;justify-items:center;gap:.75rem;padding:1rem;display:grid;position:absolute;inset:0}