:root{--btn:clamp(76px, 11vmin, 132px);--btn-big:clamp(140px, 26vmin, 240px);--gap:max(14px, env(safe-area-inset-left));--shade:#14283c59}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior:none;background:#9fd0f0;height:100%;margin:0;overflow:hidden}#scene{touch-action:none;outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}#ui{pointer-events:none;position:fixed;inset:0}#ui button{pointer-events:auto;cursor:pointer;touch-action:manipulation;background:0 0;border:0;padding:0}#ui img{object-fit:contain;pointer-events:none;-webkit-user-drag:none;width:100%;height:100%;display:block}.icon-btn{--size:var(--btn);width:var(--size);height:var(--size);border-radius:50%;transition:transform 80ms;box-shadow:0 6px #0000002e,0 10px 24px #0003;padding:calc(var(--size) * .16)!important;background:#ffffffd1!important}.icon-btn:active,.icon-btn.pressed{transform:translateY(4px)scale(.95);box-shadow:0 2px #0000002e,0 6px 16px #0003}.jump{--size:calc(var(--btn) * 1.25);right:calc(var(--gap) + 10px);bottom:calc(max(18px, env(safe-area-inset-bottom)) + 10px);position:absolute}.hud-right{right:var(--gap);top:max(12px, env(safe-area-inset-top));align-items:center;gap:14px;display:flex;position:absolute}.fullscreen{--size:calc(var(--btn) * .62)}.controls-btn{--size:calc(var(--btn) * .62);padding:calc(var(--size) * .13)!important}.fullscreen svg{width:100%;height:100%;display:block}.hud-people{left:var(--gap);top:max(12px, env(safe-area-inset-top));background:#ffffff8c;border-radius:999px;align-items:center;gap:8px;padding:8px 10px;display:flex;position:absolute}.hud-people .conn{background:#2ecc71;border-radius:50%;width:16px;height:16px;box-shadow:0 0 0 3px #ffffffe6}.hud-people .conn[data-state=connecting]{background:#f1c40f;animation:.8s infinite alternate blink}.hud-people .conn[data-state=offline]{background:#e74c3c;animation:.5s infinite alternate blink}.hud-people .person{border:3px solid #00000026;border-radius:50%;width:26px;height:26px;transition:transform .3s,opacity .3s;animation:.4s pop-in}.hud-people .person.self{border-color:#fff;transform:scale(1.15)}.hud-people .person.away{opacity:.35}.hud-farm{left:var(--gap);top:calc(max(12px, env(safe-area-inset-top)) + 60px);gap:10px;display:flex;position:absolute}.hud-farm .counter{color:#4a3320;font-variant-numeric:tabular-nums;background:#ffffffb8;border-radius:999px;align-items:center;gap:6px;padding:5px 16px 5px 8px;font:800 clamp(22px,4.2vmin,38px)/1 system-ui,Segoe UI,Roboto,sans-serif;display:flex;box-shadow:0 4px 12px #00000026}#ui .hud-farm .counter img{width:clamp(34px,6.2vmin,58px);height:clamp(34px,6.2vmin,58px)}.hud-farm .counter.bump{animation:.45s counter-bump}@keyframes counter-bump{0%{transform:scale(1)}35%{transform:scale(1.28)}to{transform:scale(1)}}#ui img.fly{z-index:5;filter:drop-shadow(0 6px 10px #0000004d);will-change:transform;position:fixed}.screen{background:var(--shade);pointer-events:auto;flex-direction:column;justify-content:center;align-items:center;gap:28px;display:none;position:absolute;inset:0}.screen.show{display:flex}.screen .big{--size:var(--btn-big);animation:1.6s ease-in-out infinite breathe}.screen .icon{width:var(--btn-big);height:var(--btn-big);filter:drop-shadow(0 10px 18px #0000004d)}.screen .small{width:var(--btn);height:var(--btn)}.overlay{width:var(--btn);height:var(--btn);margin:calc(var(--btn) / -2) 0 0 calc(var(--btn) / -2);filter:drop-shadow(0 6px 12px #0000004d);display:none;position:absolute;top:50%;left:50%}.overlay.show{display:block}.spin{animation:1.4s linear infinite spin}.bob{animation:1.2s ease-in-out infinite breathe}@keyframes spin{to{transform:rotate(-360deg)}}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}@keyframes blink{to{opacity:.35}}@keyframes pop-in{0%{transform:scale(0)}}.wardrobe-btn{--size:calc(var(--btn) * .78);padding:calc(var(--size) * .14)!important}.wardrobe{--tab:clamp(56px, 10vmin, 92px);--opt:clamp(96px, 17vmin, 156px);--sw:clamp(34px, 6.4vmin, 54px);pointer-events:none;display:none;position:absolute;inset:0}.wardrobe.show{display:block}.wardrobe-panel{right:var(--gap);top:max(12px, env(safe-area-inset-top));bottom:max(12px, env(safe-area-inset-bottom));pointer-events:auto;background:#ffffffdb;border-radius:28px;flex-direction:column;gap:12px;width:min(56vw,780px);padding:14px;animation:.25s slide-in;display:flex;position:absolute;overflow:hidden;box-shadow:0 10px 30px #00000040}.wardrobe-tabs{flex:none;justify-content:center;gap:12px;display:flex}.wardrobe-tabs .tab{width:var(--tab);height:var(--tab);border-radius:22px;transition:transform .1s;padding:calc(var(--tab) * .14)!important;background:#0000000d!important}.wardrobe-tabs .tab.active{transform:scale(1.08);box-shadow:0 0 0 4px #2ecc71;background:#fff!important}.wardrobe-options{grid-template-columns:repeat(auto-fill, minmax(var(--opt), 1fr));flex:1;align-content:start;gap:10px;min-height:0;padding:6px;display:grid;overflow-y:auto}.wardrobe-options .option{aspect-ratio:1;border-radius:22px;transition:transform .1s;background:linear-gradient(#f4faff,#d9ecff)!important;padding:2px!important}.wardrobe-options .option.selected{transform:scale(1.04);box-shadow:0 0 0 5px #2ecc71}.wardrobe-options .option img:not([src]){visibility:hidden}.wardrobe-colors{flex-direction:column;flex:none;gap:8px;display:flex}.color-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}#ui .color-row .row-icon{width:calc(var(--sw) * .95);height:calc(var(--sw) * .95);margin-right:4px}.swatch{width:var(--sw);height:var(--sw);border-radius:50%;box-shadow:inset 0 0 0 3px #00000026}.swatch.selected{box-shadow:0 0 0 4px #fff,0 0 0 7px #2ecc71}.wardrobe-actions{flex:none;justify-content:space-between;align-items:center;display:flex}.wardrobe-actions .random{--size:calc(var(--btn) * .85)}.wardrobe-actions .done{--size:calc(var(--btn) * 1.05);animation:1.6s ease-in-out infinite breathe}@keyframes slide-in{0%{opacity:0;transform:translate(40px)}}.face-row .face-option{width:calc(var(--opt) * .72);height:calc(var(--opt) * .72);border-radius:18px;background:linear-gradient(#f4faff,#d9ecff)!important;padding:2px!important}.face-row .face-option.selected{box-shadow:0 0 0 5px #2ecc71}.hud-people .person.photo{background-position:50% 40%!important;background-size:140%!important}.hud-people .person.photo.head{background-position:50% 68%!important;background-size:330%!important}.master-btn{--size:calc(var(--btn) * .78);padding:calc(var(--size) * .14)!important}.master{--card-btn:clamp(48px, 7.4vmin, 64px);--tab:clamp(56px, 10vmin, 92px);background:var(--shade);pointer-events:auto;color:#2c3e50;justify-content:center;align-items:center;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;display:none;position:absolute;inset:0}.master.show{display:flex}.master-panel{width:min(calc(100vw - 2 * var(--gap)), 1000px);max-height:calc(100% - 2 * max(12px, env(safe-area-inset-top)));background:#ffffffed;border-radius:28px;flex-direction:column;gap:12px;padding:14px;animation:.25s slide-in;display:flex;box-shadow:0 10px 30px #00000040}.master-head{flex:none;justify-content:space-between;align-items:center;display:flex}.master-head .tab{width:var(--tab);height:var(--tab);border-radius:22px;box-shadow:0 0 0 4px #2ecc71;padding:calc(var(--tab) * .14)!important;background:#fff!important}.master-head .close{--size:calc(var(--btn) * .62)}.family-list{flex:1;grid-template-columns:repeat(auto-fill,minmax(min(100%,315px),1fr));align-content:start;gap:12px;min-height:0;padding:6px;display:grid;overflow-y:auto}.family-card{background:linear-gradient(#f4faff,#e1f0ff);border-radius:22px;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px 12px;padding:12px;display:grid}.family-card .portrait{width:calc(var(--card-btn) * 1.5);height:calc(var(--card-btn) * 1.5);background:#fff;border-radius:50%;grid-row:span 2;position:relative;box-shadow:inset 0 0 0 3px #00000014}#ui .family-card .portrait img{border-radius:50%}#ui .family-card .portrait.icon img{padding:18%}#ui .family-card .portrait img:not([src]){visibility:hidden}.family-card .portrait.online:after{content:"";background:#2ecc71;border-radius:50%;width:22%;height:22%;position:absolute;bottom:3%;right:3%;box-shadow:0 0 0 3px #fff}.family-card .who{align-items:center;gap:8px;min-width:0;display:flex}#ui .family-card .who .role{flex:none;width:30px;height:30px}.family-card .who .name{overflow-wrap:anywhere;-webkit-line-clamp:2;-webkit-box-orient:vertical;flex:0 auto;min-width:0;font-size:19px;font-weight:650;line-height:1.2;display:-webkit-box;overflow:hidden}.family-card .who .mini{width:36px;height:36px;padding:6px!important}.master .mini{border-radius:12px;flex:none;width:42px;height:42px;background:#0000000d!important;padding:7px!important}.master .mini.selected{box-shadow:0 0 0 3px #2ecc71;background:#fff!important}.family-card .actions{gap:10px;display:flex}.master .actions .icon-btn{--size:var(--card-btn)}#ui .master button:disabled{opacity:.3;pointer-events:none}.master .newlink.armed{animation:.6s ease-in-out infinite breathe;box-shadow:0 0 0 5px #e74c3c,0 10px 24px #0003}.family-card.no-link .newlink:not(.armed){animation:1.6s ease-in-out infinite breathe}.family-card.add{min-height:calc(var(--card-btn) * 1.5 + 24px);background:#0000000a;justify-content:center;align-items:center;display:flex}.family-card.add.editing{background:linear-gradient(#f4faff,#e1f0ff);flex-direction:column;align-items:stretch;gap:10px}.family-card.add .add{--size:var(--card-btn)}.family-card.add .actions{justify-content:space-between}.name-input{min-width:0;font:inherit;color:inherit;-webkit-user-select:text;user-select:text;background:#fff;border:2px solid #9ec9ef;border-radius:12px;outline:none;flex:1;padding:8px 12px;font-size:20px;font-weight:650}.name-input:focus{border-color:#2ecc71}.role-pick{justify-content:center;gap:10px;display:flex}.role-pick .mini{width:54px!important;height:54px!important}.qr-view{background:#14283c8c;justify-content:center;align-items:center;display:none;position:absolute;inset:0}.qr-view.show{display:flex}.qr-card{max-width:calc(100vw - 2 * var(--gap));background:#fff;border-radius:28px;flex-direction:column;align-items:center;gap:14px;padding:20px;animation:.2s slide-in;display:flex;box-shadow:0 10px 30px #0000004d}.qr-code{aspect-ratio:1;width:min(64vmin,420px)}.qr-code svg{width:100%;height:100%;display:block}.qr-side{flex-direction:column;align-items:center;gap:12px;max-width:min(64vmin,420px);display:flex}.qr-who{align-items:center;gap:10px;font-size:24px;font-weight:700;display:flex}#ui .qr-who .role{width:36px;height:36px}.qr-link{color:#5b6b7a;word-break:break-all;text-align:center;-webkit-user-select:text;user-select:text;font:13px/1.35 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.qr-card .actions{gap:16px;display:flex}@media (max-height:600px){.qr-card{flex-direction:row}.qr-code{width:min(100vh - 80px,420px)}}.shake{animation:.4s shake}@keyframes shake{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.joystick-zone{--stick:clamp(120px, 24vmin, 190px);pointer-events:auto;touch-action:none;width:46%;height:62%;position:absolute;bottom:0;left:0}.joystick{left:calc(var(--gap) + var(--stick) / 2 + 12px);top:calc(100% - max(18px, env(safe-area-inset-bottom)) - var(--stick) / 2 - 12px);width:var(--stick);height:var(--stick);margin:calc(var(--stick) / -2) 0 0 calc(var(--stick) / -2);opacity:.6;pointer-events:none;background:#ffffff38;border-radius:50%;transition:opacity .25s,left .25s,top .25s;position:absolute;box-shadow:inset 0 0 0 4px #ffffffbf,0 8px 22px #00000026}.joystick.active{opacity:1;transition:none}.joystick .knob{background:#fffffff2;border-radius:50%;width:40%;height:40%;position:absolute;top:30%;left:30%;box-shadow:0 5px 12px #00000047}.joystick:not(.active) .knob{transition:transform .15s}