/* Local articulated SVG. Origins are in the 360 × 260 artwork coordinates. */
.potato-welcome { margin: -.35rem auto 1.1rem; text-align: center; }
.knolli {
    display: block; width: min(100%, 310px); margin: 0 auto; padding: 0;
    border: 0; border-radius: 2rem; background: transparent; color: inherit;
    cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent;
}
.knolli:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.knolli:disabled { cursor: default; }
.knolli:disabled ~ .knolli-hint { display: none; }
.kp-scene { display: block; width: 100%; height: auto; overflow: visible; pointer-events: none; }
.kp-scene g, .kp-scene ellipse, .kp-scene path { transform-box: view-box; }
.kp-character { transform-origin: 173px 228px; }
.kp-upper { transform-origin: 170px 197px; }
.kp-face { transform-origin: 169px 133px; }
.kp-shadow { transform-origin: 173px 230px; }
.kp-dust { transform-origin: 173px 230px; }
.kp-arm-left { transform-origin: 115px 138px; }
.kp-forearm-left { transform-origin: 95px 158px; }
.kp-arm-right { transform-origin: 214px 132px; }
.kp-forearm-right { transform-origin: 239px 155px; }
.kp-hand-right { transform-origin: 245px 178px; }
.kp-leg-left { transform-origin: 151px 192px; }
.kp-leg-right { transform-origin: 188px 192px; }
.kp-foot-left { transform-origin: 150px 209px; }
.kp-foot-right { transform-origin: 191px 209px; }
.kp-scarf-tail { transform-origin: 217px 171px; }
.kp-eye-left { transform-origin: 150px 118px; }
.kp-eye-right { transform-origin: 188px 115px; }
.kp-brow-left { transform-origin: 148px 98px; }
.kp-brow-right { transform-origin: 187px 96px; }
.knolli-greeting { margin: -.1rem 0 .22rem; color: var(--text); font-size: .95rem; line-height: 1.5; }
.knolli-greeting strong { color: var(--accent-dark); }
.knolli-hint { color: var(--muted); font-size: .75rem; line-height: 1.4; }
@media (max-width: 520px) { .knolli { width: 260px; } .knolli-greeting { font-size: .87rem; } }
@media (prefers-color-scheme: dark) { .kp-shadow { fill: #000; opacity: .3; } }
@media (prefers-reduced-motion: reduce) {
    .knolli { cursor: default; }
    .knolli, .knolli * { animation: none !important; transition: none !important; }
    .knolli-hint { display: none; }
}