/* Profile cards share the ROM's40px portrait and56px scenery coordinates. */
.wm-profile-card{box-sizing:border-box;width:min(100%,320px);margin:0 auto;overflow:hidden;border:2px solid #61769c;border-radius:.65rem;background:#101e36;box-shadow:0 8px 24px #0004}
.wm-profile-card-header{display:grid;gap:.15rem;padding:.7rem 1rem}
.wm-profile-name{color:#fff;font-size:1.15rem;overflow-wrap:anywhere}
.wm-profile-scene{position:relative;isolation:isolate;aspect-ratio:2;overflow:hidden;background:#78b8f0;contain:paint}
.wm-profile-scene svg{display:block;width:100%;height:100%;image-rendering:pixelated;shape-rendering:crispEdges;overflow:hidden}
/* World scrolls right while the original sprites walk left. */
/* Align the complete64px scenery band ABOVE the8px floor. Bottom:0 buried
   its lowest eight rows, losing the lower hill ranges on Cloudy Hills. */
.wm-profile-background{position:absolute;left:-114.285714%;bottom:14.285714%;width:228.571429%;height:114.285714%;display:flex;z-index:-1;animation:wm-profile-background 6.4s steps(128) infinite}
.wm-profile-background>svg{width:100%;height:100%;flex:none}
.wm-profile-ground{position:absolute;left:-14.285714%;bottom:0;width:114.285714%;height:14.285714%;display:flex;z-index:2;animation:wm-profile-ground .533333333s steps(16) infinite}
.wm-profile-ground>svg{width:100%;height:100%;flex:none}
.wm-profile-walker{position:absolute;left:32.142857%;bottom:10.714286%;width:35.714286%;height:71.428571%;z-index:3}
.wm-profile-walk-frame{position:absolute;inset:0;visibility:hidden;animation:wm-profile-walk .4s steps(1) infinite}
.wm-profile-walk-1{animation-delay:-.266666667s}
.wm-profile-walk-2{animation-delay:-.133333333s}
.wm-profile-walk-0.wm-profile-cycle-2{animation:wm-profile-walk-two .266666667s steps(1) infinite}
.wm-profile-walk-1.wm-profile-cycle-2{animation:wm-profile-walk-two .266666667s steps(1) -.133333333s infinite}
.wm-profile-scene svg.wm-profile-flag{position:absolute;width:100%;height:60%;overflow:hidden}
.wm-profile-character{position:absolute;inset:0}
.wm-profile-decorations{position:absolute;inset:0;z-index:1;animation:wm-profile-decorations 14.933333333s linear -2.5s infinite}
.wm-profile-scene svg.wm-profile-decoration{position:absolute;bottom:14.285714%}
.wm-page .wm-profile-title,.wm-profile-title{padding:.65rem .75rem;margin:0;text-align:center;font-size:1rem;font-weight:800;line-height:1.35;overflow-wrap:anywhere}
.wm-profile-title-0,.wm-page .wm-profile-title-0{color:#ffd864}.wm-profile-title-1,.wm-page .wm-profile-title-1{color:#8dcaff}.wm-profile-title-2,.wm-page .wm-profile-title-2{color:#7cf2a0}.wm-profile-title-3,.wm-page .wm-profile-title-3{color:#ff9195}.wm-profile-title-4,.wm-page .wm-profile-title-4{color:#ffd864}
/* The entire card is a single keyboard-accessible edit button. */
.wm-profile-launcher{position:relative;padding-bottom:28px;max-width:232px;margin-left:auto}
.wm-profile-saved{position:absolute;right:10px;bottom:38px;z-index:4;padding:7px 12px;border:1px solid #7ce2ba;border-radius:12px;background:#123f36;color:#d9ffef;font-size:.8rem;font-weight:700;line-height:1.4;box-shadow:0 4px 14px #0005;pointer-events:none;animation:wm-profile-saved-in .15s ease-out}
.wm-profile-saved:empty{display:none}
.wm-profile-saved::after{content:"";position:absolute;right:16px;bottom:-5px;width:8px;height:8px;background:#123f36;border-right:1px solid #7ce2ba;border-bottom:1px solid #7ce2ba;transform:rotate(45deg)}
@keyframes wm-profile-saved-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.wm-profile-thumbnail .wm-profile-card-header{padding:.45rem .65rem}
.wm-profile-thumbnail .wm-profile-name{font-size:.95rem}
.wm-profile-thumbnail .wm-profile-title{font-size:.8rem;padding:.4rem .6rem}
.wm-page button.wm-profile-open{position:absolute;inset:0;width:100%;height:100%;padding:0;border:2px solid transparent;border-radius:.65rem;background:transparent;box-shadow:none;color:#b8d9ec;display:flex;align-items:flex-end;justify-content:center;font-size:.78rem;--action-ink:#dceeff}
.wm-page button.wm-profile-open:is(:hover,:focus-visible){background:transparent;border-color:#9ce7e7;color:#fff}
.wm-profile-open>span{padding:3px 8px}
.wm-profile-dialog{box-sizing:border-box;width:min(860px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:24px;border:1px solid #61769c;border-radius:.85rem;background:#0c1b30;color:#f1f6ff;overflow:auto;box-shadow:0 20px 80px #0008}
.wm-profile-dialog::backdrop{background:#000c}
body:has(.wm-profile-dialog[open]){overflow:hidden}
.wm-profile-dialog-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}
.wm-profile-dialog-head h2{margin:0;color:#ffd864;font-size:1.4rem}
.wm-profile-dialog-head button{min-height:44px;width:auto;flex:none;padding:8px 14px}
.wm-profile-editor-content{display:grid;grid-template-columns:minmax(220px,320px) minmax(260px,1fr);gap:24px;align-items:start}
.wm-profile-preview{position:sticky;top:0}
.wm-profile-form{display:grid;gap:.8rem;min-width:0}
.wm-profile-form fieldset{margin:0;border:1px solid #344e70;border-radius:.55rem;padding:.75rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;min-width:0}
.wm-profile-form legend{padding:0 .4rem;color:#ffd864;font-weight:700}
.wm-profile-field{display:flex;flex-direction:column;gap:.35rem;min-width:0;color:#dbe8fd;font-size:.84rem}
.wm-profile-field:is([hidden]){display:none}
.wm-profile-field :is(input,select){box-sizing:border-box;width:100%;max-width:100%;min-height:44px;background:#152942;color:#f1f6ff;border:1px solid #607895;border-radius:.4rem;padding:.5rem;font:inherit}
.wm-profile-field select{text-transform:capitalize}
.wm-profile-field :is(input,select):focus-visible{outline:3px solid #ffd864;outline-offset:2px}
.wm-profile-field :disabled{opacity:.65}
.wm-profile-actions{display:flex;gap:.65rem;flex-wrap:wrap}
.wm-profile-actions button{min-height:44px;width:auto;flex:1}
.wm-profile-form .wm-profile-status{margin:0;min-height:1.5em}
.wm-profile-form .wm-profile-unlock-note{font-size:.8rem;line-height:1.5;margin:0}
.wm-profile-snow{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
/* Full-height carriers keep flakes inside thumbnails and larger cards for
   the same proportion of their fall, without a fixed190px travel distance. */
.wm-profile-flake{position:absolute;display:block;top:0;width:2px;height:100%;animation:wm-profile-snow 4s linear infinite;opacity:var(--snow-opacity,.8)}
.wm-profile-flake::before{content:"";position:absolute;top:-3px;left:0;width:var(--snow-size,2px);height:var(--snow-size,2px);background:#fff}
@keyframes wm-profile-walk{0%,33.32%{visibility:visible}33.33%,100%{visibility:hidden}}
@keyframes wm-profile-walk-two{0%,49.99%{visibility:visible}50%,100%{visibility:hidden}}
@keyframes wm-profile-background{to{transform:translateX(50%)}}
@keyframes wm-profile-ground{to{transform:translateX(12.5%)}}
@keyframes wm-profile-decorations{to{transform:translateX(var(--decoration-travel))}}
@keyframes wm-profile-snow{to{transform:translate(var(--snow-drift,-8px),105%)}}
@media(max-width:700px){
 .wm-profile-dialog{padding:16px}
 .wm-profile-editor-content{grid-template-columns:1fr;gap:20px}
 .wm-profile-preview{position:static}
 .wm-profile-form fieldset{gap:.6rem}
 .wm-profile-dialog-head{margin-bottom:16px}
}
@media(prefers-reduced-motion:reduce){
 .wm-profile-saved{animation:none}
 .wm-profile-walk-frame{animation:none!important;visibility:hidden}.wm-profile-walk-0{visibility:visible}
 .wm-profile-background,.wm-profile-ground,.wm-profile-decorations,.wm-profile-flake{animation:none!important}
 .wm-profile-decorations{transform:translateX(67%)}.wm-profile-flake{transform:translateY(var(--snow-rest-y,40%))}
}