:root{--black:#000;--navy:#1d2b53;--plum:#7e2553;--green:#008751;--brown:#ab5236;--stone:#5f574f;--gray:#c2c3c7;--white:#fff1e8;--red:#ff004d;--orange:#ffa300;--yellow:#ffec27;--lime:#00e436;--blue:#29adff;--purple:#83769c;--pink:#ff77a8;--peach:#fca;--display:"Press Start 2P", monospace;--body:"Pixelify Sans", sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html{background:var(--navy);scrollbar-color:var(--purple) var(--navy);scrollbar-width:thin}body{color:var(--white);font:500 20px/1.35 var(--body);overscroll-behavior:none;-webkit-tap-highlight-color:transparent;margin:0}::selection{background:var(--yellow);color:var(--navy)}input{caret-color:var(--yellow)}button,input{font:inherit}button,a,input{touch-action:manipulation}button{min-height:46px;color:var(--white);background:var(--plum);border:3px solid var(--black);box-shadow:3px 3px 0 var(--black);cursor:pointer;font:400 11px/1.6 var(--display);border-radius:0;justify-content:center;align-items:center;gap:10px;padding:10px 16px;transition:transform 80ms steps(2,end);display:inline-flex}button:hover{border-color:var(--white)}button:active,button.pressed{box-shadow:1px 1px 0 var(--black);transform:translate(2px,2px)}button:disabled{background:var(--stone);color:var(--gray);cursor:wait;box-shadow:none}button:disabled:hover{border-color:var(--black)}:focus-visible,.gamepad-focus{outline:3px solid var(--yellow);outline-offset:4px}button:focus-visible{z-index:2;position:relative}a{color:inherit;text-underline-offset:5px}svg{vertical-align:middle;width:24px;height:24px;image-rendering:pixelated;flex:none}[data-icon]{justify-content:center;align-items:center;display:inline-flex}img,canvas{image-rendering:pixelated}h1,h2,p{margin:0}h1{font:400 clamp(20px, 2.5vw, 30px)/1.5 var(--display);text-wrap:balance}h2{font:400 14px/1.6 var(--display);text-wrap:balance;margin-bottom:16px}label{display:block}input:not([type=checkbox],[type=range]){width:100%;min-width:0;min-height:48px;color:var(--white);background:var(--navy);border:3px solid var(--purple);border-radius:0;padding:10px 12px;font-size:23px}input::placeholder{color:var(--gray);opacity:1}input[type=checkbox]{appearance:none;border:3px solid var(--purple);background:var(--navy);flex:none;width:24px;height:24px;margin:0}input[type=checkbox]:checked{background:var(--lime);box-shadow:inset 0 0 0 4px var(--navy)}input[type=range]{appearance:none;border:3px solid var(--black);background:repeating-linear-gradient(90deg, var(--purple) 0 10px, var(--navy) 10px 13px);cursor:pointer;border-radius:0;width:100%;height:18px;margin:16px 0 12px;display:block}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--yellow);border:3px solid var(--black);width:24px;height:32px;box-shadow:3px 3px 0 var(--black);border-radius:0}input[type=range]::-moz-range-thumb{background:var(--yellow);border:3px solid var(--black);width:20px;height:26px;box-shadow:3px 3px 0 var(--black);border-radius:0}.panel{background:var(--navy);border:3px solid var(--purple);box-shadow:6px 6px 0 var(--black)}.primary{background:var(--yellow);color:var(--navy)}.primary:hover{border-color:var(--yellow)}.secondary{background:var(--navy);border-color:var(--purple)}.danger{background:var(--red);color:var(--black)}.icon-button,.menu-button{width:48px;height:48px;padding:10px}.text-button{box-shadow:none;background:0 0;border-color:#0000;padding:6px 0}#game{touch-action:none;outline:none;width:100%;height:100dvh;display:block;position:fixed;inset:0}#lobby{min-height:100dvh;padding:max(22px, env(safe-area-inset-top)) max(26px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(26px, env(safe-area-inset-left));background-color:var(--navy);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath fill='%2383769C' fill-opacity='.15' d='M0 0h1v1H0zM4 4h1v1H4z'/%3E%3C/svg%3E");position:relative}.lobby-header{border-bottom:3px solid var(--purple);align-items:center;gap:28px;max-width:1400px;margin:0 auto 26px;padding-bottom:22px;display:flex}.brand{font:400 clamp(22px, 3vw, 34px)/1.3 var(--display);letter-spacing:-1px;text-decoration:none}.brand span{color:var(--yellow)}.lobby-header p{color:var(--peach)}.connection{text-align:right;max-width:240px;margin-left:auto;font-size:17px}.connection:before{content:"";background:var(--orange);width:8px;height:8px;margin-right:8px;display:inline-block}.connection.online:before{background:var(--lime)}#family-step,#character-step{max-width:1400px;margin:0 auto}.steps{min-height:38px;color:var(--gray);font:400 10px/1.8 var(--display);flex-wrap:wrap;align-items:center;gap:24px;margin-bottom:28px;display:flex}.steps .current{color:var(--yellow)}#chosen-family{color:var(--peach);font:500 18px/1.3 var(--body);overflow-wrap:anywhere;margin-left:auto}.family-layout{grid-template-columns:1fr 1.15fr;align-items:center;gap:clamp(40px,8vw,120px);display:grid}.family-intro{padding:10px 0 30px}.family-emblem{color:var(--blue);margin-bottom:20px}.family-emblem svg{width:88px;height:88px}.family-intro h1{margin-bottom:26px;font-size:clamp(26px,3.1vw,40px)}.family-intro h1 span{color:var(--yellow)}.family-intro>p{max-width:32ch;color:var(--peach);font-size:24px}.controller-hint{align-items:center;gap:14px;margin-top:30px;display:flex;color:var(--gray)!important;font-size:18px!important}.family-panel{padding:28px}.field-row{align-items:center;gap:12px;margin:8px 0 16px;display:flex}.field-row button{flex:none}.check{flex-wrap:wrap;align-items:center;gap:10px;font-size:18px;display:flex}.check small{color:var(--gray)}.code-panel{border-top:3px solid var(--purple);margin-top:24px;padding-top:24px}#join-code{gap:12px;display:flex}#family-code{text-transform:uppercase;letter-spacing:.2em}.world-heading{justify-content:space-between;align-items:center;gap:20px;margin-top:26px;display:flex}.world-heading h2{margin:0}.worlds{max-height:220px;margin:16px 0 24px;overflow-y:auto}.world-row{border-bottom:2px solid var(--purple);align-items:center;gap:12px;padding:16px 0;display:flex}.world-info{flex:1;min-width:0}.world-info b{overflow-wrap:anywhere;font-size:24px;display:block}.world-info small{color:var(--gray);font-size:17px;display:block}.world-stamp{color:var(--blue)}.empty{color:var(--gray);max-width:48ch;font-size:19px}.lobby-footer{border-top:2px solid var(--purple);max-width:1400px;color:var(--gray);justify-content:space-between;gap:16px;margin:36px auto 0;padding-top:18px;font-size:16px;display:flex}.screen-heading{justify-content:space-between;align-items:end;gap:20px;margin-bottom:28px;display:flex}.screen-heading h1{margin-bottom:12px}.screen-heading p{color:var(--peach)}.navigation-hint{color:var(--gray);align-items:center;gap:10px;font-size:16px;display:inline-flex}.roles{grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;padding-bottom:6px;display:grid}.role-card{background:var(--navy);border-color:var(--purple);flex-direction:column;gap:12px;min-width:0;padding:16px 10px;position:relative}.role-card:nth-child(3n+1){--role-accent:var(--blue)}.role-card:nth-child(3n+2){--role-accent:var(--pink)}.role-card:nth-child(3n){--role-accent:var(--lime)}.role-card:after{content:"";background:var(--role-accent);width:8px;height:8px;position:absolute;top:10px;right:10px}.role-card[aria-pressed=true]{border-color:var(--yellow)}.role-card img{aspect-ratio:1;object-fit:contain;background:var(--stone);width:min(100%,180px);height:auto}.role-card b{font-weight:400}.role-card:hover,.role-card:focus-visible,.role-card.gamepad-focus{border-color:var(--role-accent)}.role-card:hover img,.role-card:focus-visible img,.role-card.gamepad-focus img{animation:.9s steps(2,end) infinite card-idle}@keyframes card-idle{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.editor-heading{align-items:center;gap:24px;margin-bottom:20px;display:flex}.editor-heading h1{font-size:20px}.editor-heading .navigation-hint{margin-left:auto}#character-form:not([hidden]){animation:.18s steps(4,end) enter-editor}@keyframes enter-editor{0%{opacity:.5;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.creator-workbench{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px;display:grid}.preview-panel{flex-direction:column;min-width:0;height:clamp(430px,63dvh,750px);display:flex;position:relative}.preview-caption{z-index:1;pointer-events:none;position:absolute;top:18px;left:20px}.preview-caption h2{color:var(--yellow);overflow-wrap:anywhere;margin-bottom:6px;font-size:20px}.preview-caption p{color:var(--peach);font-size:20px}#preview-slot{flex:1;min-height:0;position:relative}#character-preview{touch-action:none;cursor:grab;width:100%;height:100%;display:block}#character-preview:active{cursor:grabbing}.drag-hint{text-align:center;color:var(--gray);pointer-events:none;font-size:16px;position:absolute;bottom:8px;left:0;right:0}.preview-controls{border-top:2px solid var(--purple);justify-content:center;align-items:center;gap:14px;padding:14px 10px 18px;display:flex}.customization{flex-direction:column;min-width:0;height:clamp(430px,63dvh,750px);display:flex}.custom-tabs{border-bottom:3px solid var(--purple);flex:none;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:16px 16px 18px;display:grid}.custom-tabs button{background:var(--navy);min-width:0;font:600 18px/1.3 var(--body);border-color:var(--purple);overflow-wrap:anywhere;padding:10px 4px}.custom-tabs [aria-selected=true]{background:var(--yellow);color:var(--navy);border-color:var(--black)}.custom-scroll{flex:1;min-height:0;padding:22px;scroll-padding:18px;overflow-y:auto}.identity-fields{gap:24px;display:grid}.identity-fields input:not([type=range]){margin-top:8px}.age-label output{float:right;color:var(--yellow);font-variant-numeric:tabular-nums}.stats{grid-template-columns:1fr 1fr;gap:14px 20px;margin:22px 0 30px;display:grid}.stat span{margin-bottom:6px;font-size:18px;display:block}.meter{border:2px solid var(--black);background:var(--stone);height:14px;position:relative;overflow:hidden}.meter i{background:var(--lime);width:100%;height:100%;display:block}.meter:after{content:"";background:repeating-linear-gradient(90deg, transparent 0 9px, var(--navy) 9px 12px);pointer-events:none;position:absolute;inset:0}.stat:nth-child(2) .meter i{background:var(--orange)}.stat:nth-child(3) .meter i{background:var(--blue)}.stat:nth-child(4) .meter i{background:var(--pink)}.cosmetic-group{border:0;min-width:0;margin:0 0 28px;padding:0}.cosmetic-group:last-child{margin-bottom:0}.cosmetic-group legend{color:var(--peach);margin-bottom:12px;padding:0;font-size:21px}.swatches{flex-wrap:wrap;gap:12px;padding:3px 4px 5px 0;display:flex}.swatch{background:var(--swatch);border:3px solid var(--black);flex:none;width:42px;min-height:42px;padding:0;position:relative}.swatch[aria-pressed=true]{outline:3px solid var(--yellow);outline-offset:2px}.swatch[aria-pressed=true]:after{content:"";background:var(--black);border:2px solid var(--white);width:10px;height:10px;position:absolute}.option-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.look-option{background:var(--navy);border-color:var(--purple);min-width:0;font:500 17px/1.2 var(--body);flex-direction:column;gap:5px;padding:8px 4px;display:flex}.look-option[aria-pressed=true]{border-color:var(--yellow);color:var(--yellow)}.look-option img{aspect-ratio:1;object-fit:contain;background:var(--stone);width:100%;max-width:90px;height:auto}.look-option span{overflow-wrap:anywhere}.silhouette{place-items:center;height:62px;display:grid}.silhouette svg{width:56px;height:56px}.group-body .option-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.cosmetic-note{color:var(--gray);margin-top:20px;font-size:17px}.creator-actions{justify-content:space-between;gap:16px;padding:24px 0 0;display:flex}.creator-actions .primary{background:var(--yellow);min-width:240px}.error-note{color:var(--pink);overflow-wrap:anywhere;font-size:19px}.error-note:not(:empty){padding:14px 0}#suggest-age{font-size:10px}#hud{pointer-events:none;position:fixed;inset:0}.hud-top{top:max(16px, env(safe-area-inset-top));left:max(16px, env(safe-area-inset-left));right:max(16px, env(safe-area-inset-right));align-items:flex-start;gap:14px;display:flex;position:absolute}.portraits{flex-wrap:wrap;flex:1;gap:8px;min-width:0;display:flex}.portrait{background:var(--navy);border:2px solid var(--purple);box-shadow:3px 3px 0 var(--black);grid-template-rows:25px 14px;grid-template-columns:34px 90px;column-gap:8px;padding:8px;display:grid}.portrait.local{border-color:var(--yellow)}.portrait img{object-fit:cover;grid-row:span 2;width:34px;height:39px}.portrait b{white-space:nowrap;text-overflow:ellipsis;font-size:18px;overflow:hidden}.portrait .meter{align-self:end}.menu-button{pointer-events:auto;background:var(--navy);border-color:var(--purple);flex:none}#floating{position:absolute;inset:0}.damage{font:400 16px var(--display);color:var(--yellow);text-shadow:2px 2px 0 var(--black);position:absolute;transform:translate(-50%,-50%)}#touch-controls{bottom:max(24px, env(safe-area-inset-bottom));left:max(24px, env(safe-area-inset-left));right:max(24px, env(safe-area-inset-right));justify-content:space-between;align-items:end;display:none;position:absolute}#joystick{border:3px solid var(--purple);background:var(--navy);width:132px;height:132px;box-shadow:4px 4px 0 var(--black);pointer-events:auto;touch-action:none;position:relative}#joystick>span{opacity:.6;position:absolute;inset:8px}#joystick svg{width:100%;height:100%;color:var(--purple)}#stick{border:3px solid var(--black);background:var(--blue);width:40px;height:40px;box-shadow:3px 3px 0 var(--black);position:absolute;top:44px;left:44px}#touch-attack{width:116px;height:106px;color:var(--navy);background:var(--orange);pointer-events:auto;touch-action:none;flex-direction:column;font-size:12px;display:flex}#touch-attack svg{width:38px;height:38px}.modal{width:100%;max-width:min(480px,100vw - 40px);color:var(--white);border-radius:0;padding:28px}.modal::backdrop{background:#000a}.modal h2{color:var(--yellow);font-size:20px}.modal>p{color:var(--peach);overflow-wrap:anywhere;margin:16px 0 24px}.modal button{width:100%;margin-top:14px;display:flex}#pause-note:not(:empty){border-top:2px solid var(--purple);padding-top:14px}.toast{bottom:max(24px, env(safe-area-inset-bottom));z-index:20;overflow-wrap:anywhere;pointer-events:none;width:max-content;max-width:calc(100vw - 40px);padding:16px 22px;position:fixed;left:50%;transform:translate(-50%)}.fatal{z-index:30;color:var(--pink);padding:22px;position:fixed;inset:auto 20px 20px}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (any-pointer:coarse){#touch-controls{display:flex}}@media (width<=1050px){.family-layout{grid-template-columns:.9fr 1.1fr;gap:36px}.lobby-header p{display:none}.family-panel{padding:22px}.navigation-hint{display:none}.roles{gap:14px}.role-card{padding:12px 6px;font-size:10px}.creator-workbench{grid-template-columns:1fr 1fr;gap:16px}.custom-scroll{padding:18px}.custom-tabs{gap:7px;padding:12px 10px 14px}.custom-tabs button{font:600 18px var(--body)}.swatches{gap:10px}.swatch{width:38px;min-height:40px}.option-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=700px){body{font-size:20px}#lobby{padding:max(18px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left))}.lobby-header{gap:12px;margin-bottom:18px;padding-bottom:18px}.brand{font-size:22px}.connection{max-width:140px;font-size:15px}.steps{gap:16px;margin-bottom:20px;font-size:9px}#chosen-family{flex-basis:100%;margin:0;font-size:17px}.family-layout{display:block}.family-intro{padding:4px 0 24px}.family-emblem{display:none}.family-intro h1{margin-bottom:16px;font-size:24px}.family-intro h1 br{display:none}.family-intro>p{max-width:40ch;font-size:21px}.controller-hint{margin-top:18px}.family-panel{padding:20px 16px}h2{font-size:12px}.field-row,#join-code{gap:8px}.field-row button,#join-code button{padding:10px;font-size:10px}.field-row button svg,#join-code button svg{width:18px;height:18px}.lobby-footer{flex-wrap:wrap;margin-top:28px;font-size:15px}.screen-heading{margin-bottom:22px}.screen-heading h1{font-size:22px}.roles{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.role-card{padding:12px 8px;font-size:12px}.role-card img{max-width:160px}.editor-heading{justify-content:space-between;gap:12px;margin-bottom:14px}.editor-heading button{gap:6px;padding:8px;font-size:9px}.editor-heading button svg{width:18px;height:18px}.editor-heading h1{font-size:13px}.creator-workbench{flex-direction:column;gap:16px;display:flex}.preview-panel{height:45dvh;min-height:290px;max-height:460px}.preview-caption{top:12px;left:14px}.preview-caption h2{font-size:16px}.preview-caption p{font-size:18px}.preview-controls{gap:12px;padding:10px 8px 12px}.preview-controls button{font-size:10px}.drag-hint{font-size:15px}.customization{height:min(56dvh,550px);min-height:310px}.custom-tabs{gap:8px;padding:12px 12px 14px;scroll-padding-inline:12px}.custom-tabs button{min-height:44px;font-size:18px}.custom-scroll{padding:20px 18px}.option-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.look-option{font-size:16px}.swatch{width:44px;min-height:44px}.swatches{gap:12px}.creator-actions{z-index:3;padding:14px 0 max(12px, env(safe-area-inset-bottom));background:var(--navy);position:sticky;bottom:0}.creator-actions button{gap:6px;padding:10px;font-size:10px}.creator-actions .primary{flex:1;min-width:0}.creator-actions svg{width:18px;height:18px}.portraits{max-height:134px;overflow-y:auto}.portrait{grid-template-rows:20px 10px;grid-template-columns:24px 68px;column-gap:6px;padding:5px}.portrait img{width:24px;height:30px}.portrait b{font-size:16px}.portrait .meter{height:10px}.hud-top{top:max(12px, env(safe-area-inset-top));gap:8px;left:12px;right:12px}}@media (width<=380px){.brand{font-size:19px}button{font-size:10px}.option-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.swatch{width:44px;min-height:44px}.creator-actions{gap:10px}.creator-actions button{font-size:9px}.world-stamp{display:none}}@media (height<=500px) and (orientation:landscape){.preview-panel,.customization{height:390px}#joystick{width:96px;height:96px}#stick{width:34px;height:34px;top:28px;left:28px}#touch-attack{width:96px;height:82px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}