body.hub{display:block;touch-action:manipulation;color:#fff4e6;font-family:system-ui,sans-serif;background:radial-gradient(110% 70% at 8% -12%,#6a3d5d 0,rgba(106,61,93,0) 60%),radial-gradient(90% 70% at 105% 115%,#283a6a 0,rgba(40,58,106,0) 62%),linear-gradient(180deg,#2a1f3d,#150f22)}.hub #hub{--aw:clamp(160px,21vw,260px);--g:clamp(14px,2.2vw,28px);--pad:clamp(12px,1.8vw,22px);height:100%;width:min(1500px,100%);margin:auto;display:flex;flex-direction:column;padding:18px 24px 12px;gap:14px}.hub svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;pointer-events:none}.hub button{appearance:none;-webkit-appearance:none;display:flex;align-items:center;justify-content:center;min-width:52px;min-height:52px;border:0;border-radius:18px;background:#3b2d57;color:#fff4e6;cursor:pointer;touch-action:manipulation;flex-shrink:0;font:inherit;-webkit-tap-highlight-color:transparent;transition:transform .18s cubic-bezier(.3,1.6,.5,1),background-color .16s,box-shadow .16s,opacity .16s}.hub button:hover{background:#4a3a6c}.hub button:active{transform:scale(.95)}.hub button:focus{outline:none}.hub button:focus-visible{outline:4px solid #ffc94d;outline-offset:4px}.hub .game-card:focus-visible{outline:none}.hub button[aria-pressed=true],.hub button[aria-current]{background:#ffc94d;color:#3a2410}.hub [hidden]{display:none!important}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;flex-shrink:0}.brand{display:flex;align-items:center}.hub .brand-mark{width:54px;height:54px;overflow:visible;filter:drop-shadow(0 4px 0 rgba(10,4,20,.35))}.hub .brand-roof{fill:#ffb547;stroke:#ffe7b8;stroke-width:2.5}.hub .brand-door{fill:#3a2350;stroke:none}.hub .brand-face circle{fill:#fff4e6;stroke:none;transform-box:fill-box;transform-origin:center;animation:blink 6s infinite}.hub .brand-face path{fill:none;stroke:#fff4e6;stroke-width:2.6}@keyframes blink{0%,95%,100%{transform:scaleY(1)}97%{transform:scaleY(.1)}}.view-nav{--tab:78px;--gap:6px;position:relative;display:flex;gap:var(--gap);padding:6px;border-radius:999px;background:rgba(16,9,28,.55);box-shadow:inset 0 2px 6px rgba(0,0,0,.4),0 1px 0 rgba(255,255,255,.07)}.nav-pill{position:absolute;top:6px;left:6px;width:var(--tab);height:calc(100% - 12px);border-radius:999px;background:linear-gradient(#ffd770,#ffb22e);box-shadow:0 4px 0 #c27312,0 6px 16px rgba(255,170,40,.35),inset 0 2px 0 rgba(255,255,255,.55);transform:translateX(calc(var(--active,0) * (var(--tab) + var(--gap))));transition:transform .3s cubic-bezier(.3,1.35,.5,1)}.hub .view-tab{position:relative;z-index:1;width:var(--tab);height:52px;border-radius:999px;background:transparent;color:#cdbfe6}.hub .view-tab:hover{background:rgba(255,255,255,.07)}.hub .view-tab[aria-current]{background:transparent;color:#3a2410}.hub .view-tab[aria-current] svg{stroke-width:2.5}.hud{display:flex;justify-content:flex-end;min-width:0}.token-budget{--coins:1;display:flex;align-items:center;padding:7px 14px 7px 9px;border-radius:999px;background:rgba(16,9,28,.55);box-shadow:inset 0 2px 6px rgba(0,0,0,.4),0 1px 0 rgba(255,255,255,.07);min-width:0;max-width:100%;color:#ffd770}.token-budget .coin{display:flex;flex:none;margin-left:clamp(-21px,(min(28vw,320px) - 30px) / var(--coins) - 30px,3px)}.token-budget .coin:first-child{margin-left:0}.hub .token-budget svg{width:30px;height:30px;fill:#f4a623;stroke:#fff0b8;stroke-width:1.8;filter:drop-shadow(0 2px 0 #9c5a0c)}.empty-budget{opacity:.55}.hub .empty-budget svg{fill:none;stroke:#ffd770;stroke-dasharray:3 3;filter:none}.hub .no-budget svg{fill:none;stroke:#ff8f7f;filter:none}.view-body{display:flex;flex-direction:column;gap:4px;min-height:0;flex:1}.hero{position:relative;flex:1;min-height:0;border-radius:30px;overflow:hidden;isolation:isolate;background:linear-gradient(160deg,#43315f,#291e40);box-shadow:0 18px 40px rgba(8,4,18,.5),inset 0 1px 0 rgba(255,255,255,.1)}.hero-backdrop{position:absolute;inset:-48px;z-index:-1;background:center/cover no-repeat;filter:blur(40px) saturate(1.25);opacity:.5}.hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,rgba(28,18,46,.1) 30%,rgba(28,18,46,.78) 100%)}.detail,.hero-rest{height:100%;display:flex;align-items:center;justify-content:center;gap:var(--g);padding:var(--pad);container-type:size}.detail:not([hidden])~.hero-rest{display:none}.stage{position:relative;flex:none;height:100%;aspect-ratio:4/3;max-width:calc(100% - var(--aw) - var(--g));border-radius:22px;overflow:hidden;background:#120b1d;box-shadow:0 12px 30px rgba(0,0,0,.45),0 0 0 3px rgba(255,255,255,.09)}@supports (width:1cqh){.stage{height:auto;max-width:none;width:min(100cqw - var(--aw) - var(--g),100cqh * 4 / 3)}}.preview-media,.rest-media{display:block;width:100%;height:100%;object-fit:contain;background:#120b1d;image-rendering:pixelated}img.preview-media,.rest-media{object-fit:contain}.detail .stage,.detail-actions{animation:rise .28s ease-out}@keyframes rise{from{opacity:0;transform:translateY(8px) scale(.985)}}.hub .detail-close{position:absolute;top:12px;left:12px;z-index:2;width:54px;height:54px;border-radius:50%;background:#2e2248;box-shadow:0 4px 0 rgba(8,4,16,.5),0 6px 14px rgba(0,0,0,.4),inset 0 0 0 2px rgba(255,255,255,.16)}.hub .detail-close:hover{background:#3d2e5e}.hub .detail-close svg{stroke-width:2.6}.detail-actions{flex:none;width:var(--aw);align-self:stretch;display:flex;flex-direction:column;justify-content:center;gap:18px}.hub .play-game,.hub .download-game{order:-2;width:100%;min-height:clamp(96px,22vh,150px);border-radius:34px;background:linear-gradient(180deg,#ffd970,#ffab28);color:#4a2a08;box-shadow:0 8px 0 #bf690e,0 16px 28px rgba(255,160,40,.32),inset 0 3px 0 rgba(255,255,255,.6)}.hub .play-game:hover{background:linear-gradient(180deg,#ffe28c,#ffb73e)}.hub .play-game:active,.hub .download-game:active{transform:translateY(5px);box-shadow:0 3px 0 #bf690e,inset 0 3px 0 rgba(255,255,255,.6)}.hub .play-game:focus-visible{outline-color:#fff4e6;box-shadow:0 8px 0 #bf690e,0 0 36px 10px rgba(255,186,56,.55),inset 0 3px 0 rgba(255,255,255,.6)}.hub .play-game svg{width:clamp(50px,8vh,76px);height:clamp(50px,8vh,76px);fill:currentColor;stroke:currentColor;stroke-width:1.5;margin-left:6px;animation:beat 1.8s ease-in-out infinite}@keyframes beat{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}.hub .play-game svg+svg{width:34px;height:34px;margin-left:10px;fill:#f4a623;stroke:#fff0b8;stroke-width:1.8;animation:none;filter:drop-shadow(0 2px 0 #9c5a0c)}.hub .play-game:disabled{cursor:default;background:#5e5073;color:#b9aecb;box-shadow:0 8px 0 #3e3352;opacity:.8}.hub .play-game:disabled svg{animation:none}.hub .download-game{background:linear-gradient(180deg,#86ecc4,#3fbf8c);color:#0f3b2a;box-shadow:0 8px 0 #22825b,0 16px 28px rgba(63,191,140,.3),inset 0 3px 0 rgba(255,255,255,.55)}.hub .download-game:hover{background:linear-gradient(180deg,#9af2cf,#4cc996)}.hub .download-game:focus-visible{outline-color:#fff4e6;box-shadow:0 8px 0 #22825b,0 0 36px 10px rgba(95,214,164,.5),inset 0 3px 0 rgba(255,255,255,.55)}.hub .download-game svg{width:clamp(44px,7vh,64px);height:clamp(44px,7vh,64px);stroke-width:2.6}.hub .download-game:disabled{cursor:default;opacity:.85}.hub .favorite{width:100%;min-height:clamp(60px,12vh,84px);border-radius:26px;background:rgba(255,255,255,.1);box-shadow:0 5px 0 rgba(0,0,0,.28),inset 0 2px 0 rgba(255,255,255,.08)}.hub .favorite:hover{background:rgba(255,255,255,.16)}.hub .favorite svg{width:40px;height:40px;stroke-width:2.2}.hub .favorite[aria-pressed=true]{background:rgba(255,201,77,.2);color:#ffc94d}.favorite[aria-pressed=true] svg{fill:#ffc94d;stroke:#ffe9a8;animation:pop .35s cubic-bezier(.3,1.8,.5,1)}@keyframes pop{40%{transform:scale(1.35) rotate(-8deg)}}.not-installed{order:-2;display:flex;align-items:center;justify-content:center;min-height:clamp(96px,22vh,150px);border-radius:34px;border:3px dashed rgba(255,255,255,.22);color:rgba(255,244,230,.5)}.hub .not-installed svg{width:52px;height:52px}.install-progress{order:-1;-webkit-appearance:none;appearance:none;width:100%;height:16px;border:0;border-radius:999px;overflow:hidden;background:rgba(10,5,20,.5);color:#5fd6a4;accent-color:#5fd6a4}.install-progress::-webkit-progress-bar{background:rgba(10,5,20,.5);border-radius:999px}.install-progress::-webkit-progress-value{background:linear-gradient(90deg,#86ecc4,#3fbf8c);border-radius:999px}.install-progress::-moz-progress-bar{background:linear-gradient(90deg,#86ecc4,#3fbf8c);border-radius:999px}.launch-error{display:flex;align-items:center;justify-content:center;align-self:center;width:56px;height:56px;border-radius:50%;background:rgba(255,123,107,.2);color:#ff8f7f}.rest-hint{flex:none;width:var(--aw);align-self:stretch;display:flex;align-items:center;justify-content:center;color:#ffc94d}.hub .rest-hint svg{width:76px;height:76px;padding:16px;border-radius:50%;background:rgba(255,201,77,.15);stroke-width:3;animation:nudge 1.5s ease-in-out infinite}@keyframes nudge{50%{transform:translateY(12px)}}.hero-rest .stage img{filter:saturate(.9) brightness(.85)}.shelf-rail{position:relative;flex-shrink:0}.shelf-rail::after{content:"";position:absolute;left:1.5%;right:1.5%;bottom:2px;height:20px;border-radius:10px;background:linear-gradient(180deg,#e0a265 0,#bd7a42 42%,#8a5229 100%);box-shadow:0 8px 16px rgba(0,0,0,.45),inset 0 2px 0 rgba(255,232,195,.5),inset 0 -2px 0 rgba(60,30,10,.4)}.shelf{--card-h:clamp(84px,17vh,180px);position:relative;z-index:1;display:flex;align-items:flex-end;gap:clamp(14px,1.8vw,24px);overflow-x:auto;overflow-y:hidden;padding:30px 28px 12px;scrollbar-width:none;scroll-padding:0 48px}.shelf::-webkit-scrollbar{display:none}.shelf>:first-child{margin-left:auto}.shelf>:last-child{margin-right:auto}.hub .game-card{position:relative;flex:none;display:block;padding:0;height:var(--card-h);width:calc(var(--card-h) * 4 / 3);border-radius:18px;overflow:hidden;background:#2c2244;box-shadow:0 6px 0 rgba(10,4,20,.35),0 10px 18px rgba(0,0,0,.3);transform-origin:50% 100%;transition:transform .22s cubic-bezier(.3,1.5,.5,1),box-shadow .2s}.game-card img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;transition:opacity .2s}.hub .game-card:hover{background:#2c2244;transform:translateY(-4px)}.hub .game-card.is-selected{transform:translateY(-6px) scale(1.04);box-shadow:0 0 0 3px rgba(255,201,77,.8),0 14px 22px rgba(0,0,0,.45)}.hub .game-card:focus,.hub .game-card:focus-visible{transform:translateY(-8px) scale(1.09);box-shadow:0 0 0 4px #ffc94d,0 0 28px 6px rgba(255,184,56,.55),0 18px 28px rgba(0,0,0,.5)}.shelf.has-selection .game-card:not(.is-selected):not(:focus) img{opacity:.62}.card-badge{position:absolute;top:8px;right:8px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#ffc94d;color:#5a3608;box-shadow:0 3px 0 #b8650c,0 4px 10px rgba(0,0,0,.35)}.card-badge:empty{display:none}.hub .card-badge svg{width:22px;height:22px;fill:currentColor;stroke:currentColor;stroke-width:1.4}.card-badge[data-kind=installed]{background:#5fd6a4;color:#0f3b2a;box-shadow:0 3px 0 #22825b,0 4px 10px rgba(0,0,0,.35)}.hub .card-badge[data-kind=installed] svg{fill:none;stroke-width:3.4}.view-body.is-status .hero{display:none}.view-body.is-status .shelf-rail{flex:1;display:flex}.view-body.is-status .shelf-rail::after{display:none}.view-body.is-status .shelf{flex:1;overflow:hidden;padding:0}.shelf-status{margin:auto;display:flex;flex-direction:column;align-items:center;gap:22px;color:#cdbfe6}.status-art{display:grid;place-items:center;width:clamp(140px,32vh,230px);height:clamp(140px,32vh,230px);border-radius:50%;background:radial-gradient(circle at 35% 28%,#57417e,#2c2146 70%);box-shadow:0 20px 44px rgba(0,0,0,.45),inset 0 2px 0 rgba(255,255,255,.14)}.hub .status-art svg{width:52%;height:52%;stroke-width:1.6}.shelf-status.empty .status-art{color:#ffc94d}.shelf-status.error .status-art{color:#a9d4ff}.shelf-status.empty svg,.shelf-status.error svg{animation:bob 3.2s ease-in-out infinite}.shelf-status.loading .status-art{color:#ffc94d}.hub .shelf-status.loading svg{stroke-width:2.4}@keyframes bob{50%{transform:translateY(-8px)}}.loading svg{animation:turn 1.1s linear infinite}@keyframes turn{to{transform:rotate(360deg)}}.status-dots{display:flex;gap:12px}.status-dots i{width:14px;height:14px;border-radius:50%;background:#ffc94d;animation:dot 1.2s ease-in-out infinite}.status-dots i:nth-child(2){animation-delay:.15s}.status-dots i:nth-child(3){animation-delay:.3s}@keyframes dot{0%,80%,100%{opacity:.3;transform:scale(.7)}40%{opacity:1;transform:scale(1)}}.options-panel{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;overflow:auto;padding:12px}.hub .quit-app{width:96px;height:96px;border-radius:50%;background:linear-gradient(#ff9a8a,#ef5f4e);color:#fff;box-shadow:0 7px 0 #a63a2d,0 14px 26px rgba(239,95,78,.3),inset 0 3px 0 rgba(255,255,255,.45)}.hub .quit-app:hover{background:linear-gradient(#ffa99b,#f26e5e)}.hub .quit-app svg{width:46px;height:46px;stroke-width:2.6}.hub .adult-entry button{gap:8px;min-width:120px;height:52px;padding:0 18px;border-radius:999px;background:rgba(255,255,255,.06);color:#a898c4;box-shadow:inset 0 0 0 2px rgba(255,255,255,.08)}.hub .adult-entry button:hover{background:rgba(255,255,255,.1)}.hub .adult-entry svg{width:26px;height:26px}.hub .adult-entry svg+svg{width:20px;height:20px}.quit-confirm{border:0;border-radius:34px;padding:30px 34px;background:linear-gradient(160deg,#47356a,#2a1f42);color:#fff4e6;box-shadow:0 30px 60px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.12)}.quit-confirm[open],.adult-setup[open]{animation:rise .22s ease-out}.quit-confirm::backdrop,.adult-setup::backdrop{background:rgba(12,6,22,.8)}.quit-picture{display:flex;justify-content:center;padding:0 0 26px}.hub .quit-picture svg{width:92px;height:92px;padding:20px;border-radius:50%;background:rgba(255,123,107,.18);color:#ff8f7f;stroke-width:2.4}.quit-actions{display:flex;gap:22px}.hub .quit-actions button{width:108px;height:84px;border-radius:28px}.hub .quit-actions svg{width:40px;height:40px;stroke-width:2.6}.hub .cancel-quit{background:rgba(255,255,255,.12);box-shadow:0 6px 0 rgba(0,0,0,.3),inset 0 2px 0 rgba(255,255,255,.08)}.hub .confirm-quit{background:linear-gradient(#ff9a8a,#ef5f4e);color:#fff;box-shadow:0 6px 0 #a63a2d,inset 0 3px 0 rgba(255,255,255,.45)}.hub .confirm-quit:focus-visible,.hub .quit-app:focus-visible{outline-color:#fff4e6}.hub .cancel-quit:focus{outline:none;box-shadow:0 6px 0 rgba(0,0,0,.3),0 0 0 4px #ffc94d,0 0 26px 4px rgba(255,184,56,.45)}.hub .confirm-quit:focus{outline:none;box-shadow:0 6px 0 #a63a2d,0 0 0 4px #fff4e6,0 0 26px 4px rgba(255,143,127,.55)}.hub .adult-setup button:focus{outline:3px solid #ffc94d;outline-offset:2px}.adult-setup{width:min(640px,94vw);max-height:92vh;overflow:auto;border:0;border-radius:26px;padding:24px 26px;background:#241b36;color:#f6efe6;box-shadow:0 30px 60px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.1)}.adult-setup h1{margin:0 0 6px;font-size:22px;font-weight:750;letter-spacing:.01em}.adult-setup p{margin:0 0 16px;font-size:14px;line-height:1.5;color:#cbbfdc}.key-rows{display:grid;grid-template-columns:1fr 1fr;gap:8px}.hub .key-rows button{justify-content:space-between;gap:12px;min-height:48px;padding:10px 14px;border-radius:14px;background:#2f2445;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);text-align:left;font-size:14px}.hub .key-rows button:hover{background:#3a2d55}.key-name{font-weight:700;text-transform:capitalize}.key-codes{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;color:#ffd770;text-align:right;overflow-wrap:anywhere}.hub .key-rows .capturing{background:#40311a;box-shadow:inset 0 0 0 2px #ffc94d}.adult-setup .key-feedback{min-height:20px;margin:12px 0;color:#ffd770}.hub .refill-tokens{min-height:44px;margin:0 0 14px;padding:8px 16px;border-radius:12px;background:#3a2d16;color:#ffd770;font-size:14px}.adult-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.hub .adult-actions button{min-height:44px;padding:8px 16px;border-radius:12px;background:#2f2445;font-size:14px}.hub .adult-actions .primary{background:linear-gradient(#ffd770,#ffb22e);color:#3a2410;font-weight:700}@media (max-width:600px){.hub #hub{padding:10px 12px 8px;gap:10px}.topbar{grid-template-columns:auto 1fr auto;gap:8px}.view-nav{--tab:56px;justify-self:center}.hub .view-tab{height:48px}.hub .brand-mark{width:38px;height:38px}.hero{border-radius:24px}.detail,.hero-rest{flex-direction:column;justify-content:center;gap:16px;padding:12px;container-type:normal}.stage,.hero .stage{width:100%;height:auto;max-width:none;aspect-ratio:4/3;border-radius:18px}.detail-actions{width:100%;align-self:auto;flex-direction:row;flex-wrap:wrap;gap:12px}.hub .play-game,.hub .download-game,.not-installed{flex:1;width:auto;min-height:84px;border-radius:28px}.hub .favorite{width:84px;min-height:84px}.install-progress{order:5}.shelf{--card-h:clamp(100px,15vh,132px);padding:26px 16px 12px;gap:16px}.rest-hint{width:100%;height:84px;align-self:auto}.token-budget{padding:5px 10px 5px 6px}.hub .token-budget svg{width:24px;height:24px}.token-budget .coin{margin-left:clamp(-17px,(22vw - 24px) / var(--coins) - 24px,2px)}.key-rows{grid-template-columns:1fr}}@media (max-height:520px){.hub #hub{--aw:150px;--g:10px;--pad:10px;padding:8px 10px 4px;gap:8px}.hub .brand-mark{width:40px;height:40px}.view-nav{--tab:64px;padding:4px}.nav-pill{top:4px;left:4px;height:calc(100% - 8px);box-shadow:0 3px 0 #c27312,inset 0 2px 0 rgba(255,255,255,.55)}.hub .view-tab{height:42px;min-height:42px}.hub .view-tab svg{width:26px;height:26px}.token-budget{padding:4px 10px 4px 6px}.hub .token-budget svg{width:24px;height:24px}.token-budget .coin{margin-left:clamp(-17px,(min(30vw,230px) - 24px) / var(--coins) - 24px,2px)}.hero{border-radius:20px;box-shadow:0 10px 24px rgba(8,4,18,.5),inset 0 1px 0 rgba(255,255,255,.1)}.hero-backdrop{display:none}.stage{border-radius:14px}.hub .detail-close{top:8px;left:8px;width:44px;height:44px;min-width:44px;min-height:44px}.hub .detail-close svg{width:24px;height:24px}.detail-actions{gap:12px}.hub .play-game,.hub .download-game,.not-installed{min-height:92px;border-radius:26px}.hub .play-game svg{width:52px;height:52px}.hub .play-game svg+svg{width:26px;height:26px;margin-left:6px}.hub .favorite{min-height:58px;border-radius:20px}.hub .favorite svg{width:32px;height:32px}.hub .rest-hint svg{width:60px;height:60px;padding:12px}.shelf{--card-h:80px;padding:20px 16px 10px;gap:14px}.shelf-rail::after{height:16px}.hub .game-card{border-radius:14px}.card-badge{top:5px;right:5px;width:26px;height:26px}.hub .card-badge svg{width:17px;height:17px}.status-art{width:150px;height:150px}.options-panel{gap:14px}.hub .quit-app{width:76px;height:76px}.hub .quit-app svg{width:38px;height:38px}.quit-confirm{padding:20px 24px}.quit-picture{padding-bottom:16px}.hub .quit-picture svg{width:64px;height:64px;padding:14px}}@media (prefers-reduced-motion:reduce){.hub *,.hub *::before,.hub *::after,.hub dialog{animation:none!important;transition:none!important}}

/* A separate, picture-only confirmation keeps removal away from play. */
.detail-actions .uninstall-game{background:transparent;color:var(--muted,#cdbfe6);border:2px solid currentColor;min-width:48px;min-height:48px;width:52px;height:52px;}
.uninstall-confirm{width:min(360px,calc(100vw - 40px));box-sizing:border-box;border:2px solid #79658f;border-radius:26px;padding:24px;background:#291e40;color:#fff4e6;box-shadow:0 24px 80px #0009;}
.uninstall-confirm::backdrop{background:#10091cce;backdrop-filter:blur(8px);}
.uninstall-picture{position:relative;width:min(200px,100%);margin:0 auto 24px;}
.uninstall-picture img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:16px;}
.uninstall-symbol{display:grid;place-items:center;position:absolute;right:-8px;bottom:-8px;width:56px;height:56px;background:#854b51;border:3px solid #291e40;border-radius:50%;}
.uninstall-symbol svg,.uninstall-actions svg,.uninstall-error svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.uninstall-actions{display:flex;justify-content:center;gap:28px;}
.uninstall-actions button{display:grid;place-items:center;min-width:72px;min-height:64px;border:2px solid transparent;border-radius:18px;background:#43315f;color:#fff4e6;}
.uninstall-actions .cancel-uninstall{background:linear-gradient(#ffd770,#ffb22e);color:#3a2410;}
.uninstall-actions .confirm-uninstall{background:#854b51;}
.hub .uninstall-actions button:focus{outline:4px solid #ffc94d;outline-offset:5px;}
.uninstall-actions button:disabled{opacity:.45;}
.uninstall-error{display:flex;justify-content:center;margin-top:20px;color:#ff8f7f;}
@media(max-width:420px){.uninstall-confirm{padding:20px}.uninstall-actions{gap:24px}.detail-actions .uninstall-game{width:48px;height:48px}}
.browser-storage-error{min-height:80vh;display:grid;place-items:center;font-size:64px;color:#ffc94d;}

/* Non-interactive, picture-only status; no fake charge in non-device hosts. */
.hud{align-items:center;gap:10px}
.brand{gap:8px}
.battery-indicator{flex:none;display:flex;align-items:center;justify-content:center;width:42px;height:34px;color:#86ecc4}
.battery-indicator[hidden]{display:none}
.hub .battery-indicator svg{width:38px;height:28px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.battery-fill{fill:currentColor;stroke:none}
.battery-indicator[data-low=true]{color:#ff8f7f}
.hub .battery-indicator .battery-bolt{fill:#ffd770;stroke:#291e40;stroke-width:1.5}
/* Device settings: picture tiles that open the worded adult pages. */
.settings-tiles{display:flex;gap:24px}
.hub .settings-tile{width:150px;height:130px;border-radius:30px;background:rgba(255,255,255,.1);box-shadow:0 6px 0 rgba(0,0,0,.28),inset 0 2px 0 rgba(255,255,255,.08)}
.hub .settings-tile:hover{background:rgba(255,255,255,.16)}
.hub .settings-tile:focus{outline:none;background:rgba(255,201,77,.18);color:#ffc94d;box-shadow:0 6px 0 rgba(0,0,0,.28),0 0 0 4px #ffc94d,0 0 26px 4px rgba(255,184,56,.45)}
.hub .settings-tile svg{width:64px;height:64px;stroke-width:1.8}

/* The gear tab's content until answered; a keypad works with D-pad or touch. */
.settings-gate{box-sizing:border-box;width:min(340px,94vw);flex:none;border-radius:26px;padding:14px 22px;background:#241b36;color:#f6efe6;box-shadow:0 12px 30px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.1)}
.gate-question{margin:0;font-size:22px;font-weight:750;text-align:center}
.gate-entry{display:block;height:42px;margin:10px 0 0;border-radius:12px;background:rgba(16,9,28,.65);box-shadow:inset 0 2px 6px rgba(0,0,0,.4);color:#ffd770;font-size:26px;font-weight:700;line-height:42px;text-align:center}
.settings-gate .gate-feedback{min-height:18px;margin:4px 0;color:#ff8f7f;font-size:13px;text-align:center}
.gate-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.hub .gate-pad button{min-height:48px;border-radius:14px;font-size:20px;font-weight:650}
.hub .gate-pad svg{width:24px;height:24px}
.hub .gate-pad .gate-submit{background:linear-gradient(#ffd770,#ffb22e);color:#3a2410}
.hub .settings-gate button:focus{outline:3px solid #ffc94d;outline-offset:2px}
.hub .settings-gate .gate-submit:focus{outline-color:#fff4e6}
.power-note{margin:0 0 20px;text-align:center;font-size:18px;font-weight:650}
.hub .quit-actions button:disabled{opacity:.45}

/* Update notice: things look normal, and a glint of light sweeps across them every
   few seconds. The selected tab stays plain, since the tile below carries the notice. */
.hub .settings-tile{position:relative}
.hub .has-notice:not([aria-current]){overflow:hidden}
.hub .has-notice:not([aria-current])::after{content:"";position:absolute;top:0;bottom:0;left:0;width:48%;background:linear-gradient(90deg,rgba(255,244,214,0),rgba(255,244,214,.6),rgba(255,244,214,0));pointer-events:none;animation:notice-shimmer 3.6s ease-in-out infinite}
@keyframes notice-shimmer{0%{transform:translateX(-140%) skewX(-20deg)}30%,100%{transform:translateX(260%) skewX(-20deg)}}
/* With motion off there is no sweep, so hold the icon in gold instead. */
@media (prefers-reduced-motion:reduce){.hub .has-notice:not([aria-current]){color:#ffd770}}

/* Store: a game already in the Library is a dimmed picture with a check, not a control. */
.hub .game-card.is-owned{pointer-events:none;cursor:default;box-shadow:0 3px 0 rgba(10,4,20,.35)}
.game-card.is-owned img{filter:grayscale(1) brightness(.6)}
.rest-done{display:none}
.all-owned .rest-hint{display:none}
.all-owned .rest-done{flex:none;width:var(--aw);align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:#5fd6a4}
.hub .rest-done svg{width:44px;height:44px}
.hub .rest-done svg:first-child{width:76px;height:76px;padding:16px;border-radius:50%;background:#5fd6a4;color:#0f3b2a;stroke-width:3.4}
.all-owned .hero-rest .stage img{filter:grayscale(1) brightness(.6)}
@media (max-width:600px){.all-owned .rest-done{width:100%;height:84px;align-self:auto;flex-direction:row}}
@media (max-height:520px){.hub .rest-done svg:first-child{width:60px;height:60px;padding:12px}.hub .rest-done svg{width:34px;height:34px}}

/* Device settings: version for whoever is troubleshooting, out of the way. */
.app-version{position:fixed;right:12px;bottom:8px;font-size:11px;color:rgba(205,191,230,.55)}
/* Worded save management exists only behind the gear tab's adult math check. */
:is(.save-management,.controller-setup){box-sizing:border-box;width:min(560px,94vw);max-height:90vh;overflow:auto;border:2px solid #79658f;border-radius:26px;padding:24px;background:#291e40;color:#fff4e6;box-shadow:0 24px 80px #0009}
:is(.save-management,.controller-setup)::backdrop{background:#10091cde}
:is(.save-management,.controller-setup) h1{margin:0 0 12px;font-size:24px}:is(.save-management,.controller-setup) h2{font-size:20px;overflow-wrap:anywhere}
:is(.save-management,.controller-setup) p{line-height:1.5}.save-feedback{min-height:24px;color:#ffd770}
.save-rows{display:grid;gap:10px;margin:18px 0}.hub :is(.save-management,.controller-setup) button{padding:12px 18px;white-space:normal;overflow-wrap:anywhere;text-align:center}
.save-actions{display:flex;flex-wrap:wrap;gap:16px}.hub :is(.save-management,.controller-setup) .confirm-reset{background:#854b51}
.hub :is(.save-management,.controller-setup) .cancel-reset{background:#ffc94d;color:#3a2410}.hub :is(.save-management,.controller-setup) button:focus{outline:3px solid #ffc94d;outline-offset:3px}
.hub :is(.save-management,.controller-setup) button:disabled{opacity:.45}.settings-tiles{flex-wrap:wrap;justify-content:center}
/* Controller setup is driven by the pad itself: one big face-button letter to press,
   and the four letters below light up as each is taken. */
.controller-setup{position:relative;width:min(420px,94vw);padding:30px 24px 26px;text-align:center}.controller-setup:focus{outline:none}
.calibration-prompt{display:grid;place-items:center;width:clamp(112px,28vh,168px);aspect-ratio:1;margin:6px auto 0;border-radius:50%;background:linear-gradient(#ffd770,#ffb22e);color:#3a2410;font:800 clamp(60px,15vh,96px)/1 system-ui,sans-serif;box-shadow:0 8px 0 #bf690e,0 16px 28px rgba(255,160,40,.32),inset 0 3px 0 rgba(255,255,255,.6);transition:opacity .16s,transform .16s}
.calibration-prompt.waiting{opacity:.45;transform:scale(.94)}
.calibration-prompt.rejected{background:linear-gradient(#ff9a8a,#ef5f4e);color:#fff;box-shadow:0 8px 0 #a63a2d,inset 0 3px 0 rgba(255,255,255,.45);animation:calibration-shake .36s}
@keyframes calibration-shake{20%,60%{transform:translateX(-10px)}40%,80%{transform:translateX(10px)}}
.calibration-prompt.done{background:linear-gradient(#86ecc4,#3fbf8c);color:#0f3b2a;box-shadow:0 8px 0 #22825b,0 16px 28px rgba(63,191,140,.3),inset 0 3px 0 rgba(255,255,255,.55);animation:pop .35s cubic-bezier(.3,1.8,.5,1)}
.hub .calibration-prompt svg{width:52%;height:52%;stroke-width:3.4}
.calibration-prompt.done.unsaved{background:linear-gradient(#ffd770,#ffb22e);color:#3a2410;box-shadow:0 8px 0 #bf690e,inset 0 3px 0 rgba(255,255,255,.6)}
.calibration-row{display:flex;justify-content:center;gap:12px;margin:26px 0 4px}
.calibration-glyph{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.08);color:#a898c4;font:700 21px/1 system-ui,sans-serif;box-shadow:inset 0 0 0 2px rgba(255,255,255,.12);transition:background-color .16s,color .16s}
.calibration-glyph.is-next{color:#ffc94d;box-shadow:inset 0 0 0 3px #ffc94d}
.calibration-glyph.is-set{background:#ffc94d;color:#3a2410;box-shadow:0 3px 0 #b8650c}
.done~.calibration-row .calibration-glyph{background:#5fd6a4;color:#0f3b2a;box-shadow:0 3px 0 #22825b}
.hub .controller-setup .cancel-controller{position:absolute;top:12px;right:12px;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border-radius:50%;background:rgba(255,255,255,.08);color:#cdbfe6}
.hub .controller-setup .cancel-controller svg{width:22px;height:22px}
@media(max-height:540px){:is(.save-management,.controller-setup){padding:16px}.calibration-row{margin:16px 0 2px}:is(.save-management,.controller-setup) h1{font-size:21px}:is(.save-management,.controller-setup) p{margin:8px 0}}
/* Players. For a child the faces are the whole interface: big, round, and lit when chosen. */
.hub :is(.player-button,.picker-face,.player-face,.avatar-choice) svg{stroke:none}
.player-picker{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(12px,4vh,34px);padding:16px;background:radial-gradient(110% 70% at 8% -12%,#6a3d5d 0,rgba(106,61,93,0) 60%),radial-gradient(90% 70% at 105% 115%,#283a6a 0,rgba(40,58,106,0) 62%),linear-gradient(180deg,#2a1f3d,#150f22);animation:rise .28s ease-out}
/* Faces sit in rows of a set width: 2-4 in one row, 5-6 as three a row, 7-8 as four.
   A light rim and a soft shadow keep every face's round edge readable on the dark
   background; a hard dark drop shadow there made the bottom edge look cut off. */
.picker-faces{--size:clamp(104px,min(25vh,20vw),210px);--gap:clamp(18px,4vw,44px);display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--gap);max-width:calc(var(--size) * 4 + var(--gap) * 3 + 1px)}
.picker-faces:is([data-count="2"],[data-count="3"]){--size:clamp(130px,min(40vh,27vw),280px)}
.picker-faces[data-count="4"]{--size:clamp(110px,min(32vh,20vw),240px)}
.picker-faces:is([data-count="5"],[data-count="6"]){--size:clamp(110px,min(30vh,24vw),230px);max-width:calc(var(--size) * 3 + var(--gap) * 2 + 1px)}
/* Each face is a button: the round picture, and the child's name under it in big letters. */
.picker-faces{--name:clamp(16px,3.8vh,26px)}
.picker-faces:is([data-count="2"],[data-count="3"]){--name:clamp(22px,5.5vh,40px)}
.picker-faces[data-count="4"]{--name:clamp(20px,4.6vh,34px)}
.picker-faces:is([data-count="5"],[data-count="6"]){--name:clamp(18px,4.4vh,30px)}
.hub .picker-face{flex-direction:column;justify-content:flex-start;gap:clamp(14px,3vh,20px);width:var(--size);min-width:0;min-height:0;padding:0;border-radius:0;background:transparent;transition:opacity .2s}
.hub .picker-face:hover,.hub .picker-face:active{background:transparent;transform:none}
.hub .picker-face:focus,.hub .picker-face:focus-visible{outline:none}
/* Focus grows the face upward, so its ring never covers the name below. */
.face-disc{display:block;width:var(--size);height:var(--size);border-radius:50%;transform-origin:50% 100%;box-shadow:0 0 0 3px rgba(255,244,230,.16),0 12px 28px rgba(0,0,0,.45);transition:transform .22s cubic-bezier(.3,1.5,.5,1),box-shadow .2s}
.hub .face-disc svg{width:100%;height:100%}
.hub .picker-face:hover .face-disc{transform:scale(1.04)}
/* A cream ring inside the gold one keeps the focus clear on a yellow face too. */
.hub .picker-face:focus .face-disc{transform:scale(1.1);box-shadow:0 0 0 5px #fff4e6,0 0 0 10px #ffc94d,0 0 40px 12px rgba(255,184,56,.5),0 14px 30px rgba(0,0,0,.5)}
.hub .picker-face:focus .face-disc svg{animation:wiggle 1.8s ease-in-out infinite}
.face-name{display:block;max-width:calc(var(--size) + var(--gap) - 6px);font-size:var(--name);font-weight:800;line-height:1.15;letter-spacing:.01em;color:#fff4e6;text-shadow:0 2px 0 rgba(10,4,20,.6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hub .picker-face:focus .face-name{color:#ffd770}
.picker-faces:focus-within .picker-face:not(:focus){opacity:.8}
/* The hub's player: face and name in one pill, the same height as the tab bar beside it (tab + its padding); the name hides if the bar has no room. */
.brand{min-width:0}
.hub .player-button{flex-shrink:1;gap:10px;min-width:64px;height:64px;padding:6px;border-radius:999px;background:rgba(16,9,28,.55);box-shadow:inset 0 2px 6px rgba(0,0,0,.4),0 1px 0 rgba(255,255,255,.07)}
.hub .player-button:hover{background:rgba(16,9,28,.7)}
.hub .player-button:focus{outline:none;box-shadow:0 0 0 3px #fff4e6,0 0 0 6px #ffc94d,0 0 22px 5px rgba(255,184,56,.55)}
.player-disc{display:block;flex:none;width:52px;height:52px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,244,230,.16)}
.hub .player-disc svg{width:100%;height:100%}
.player-label{min-width:0;padding-right:16px;font-size:19px;font-weight:800;color:#fff4e6;white-space:nowrap;overflow:hidden}
@keyframes wiggle{0%,60%,100%{transform:rotate(0)}70%{transform:rotate(-7deg)}85%{transform:rotate(6deg)}}
.hub .picker-back{position:absolute;top:14px;left:14px;width:54px;height:54px;border-radius:50%;background:#2e2248;box-shadow:0 4px 0 rgba(8,4,16,.5),inset 0 0 0 2px rgba(255,255,255,.16)}
.hub .picker-back:focus{outline:none;box-shadow:0 0 0 4px #ffc94d,0 0 22px 4px rgba(255,184,56,.45)}
/* The adult players page shares the worded save page's look. */
.player-rows{display:grid;gap:10px;margin:16px 0}
.player-row{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:18px;background:rgba(255,255,255,.06)}
.player-face{flex:none;display:block;width:52px;height:52px}
.hub .player-face svg{width:100%;height:100%}
.player-name{flex:1;min-width:0;display:flex;flex-direction:column;font-size:19px;font-weight:700}
.player-note{font-size:13px;font-weight:600;color:#86ecc4}
.hub .player-management .player-row button{min-height:46px;padding:10px 14px}
.player-heading{display:flex;align-items:center;gap:12px}
.player-heading .player-face{width:44px;height:44px}
.hub .save-management .choose-player{justify-content:flex-start;gap:14px;font-size:18px;font-weight:700;text-align:left}
.choose-player .player-face{width:44px;height:44px}
.avatar-choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 18px}
.hub .player-management .avatar-choice{flex-direction:column;gap:6px;padding:10px 6px;border-radius:18px;font-weight:700}
.hub .avatar-choice svg{width:64px;height:64px}
@media (max-height:520px){.hub .player-button{height:50px;min-width:50px;min-height:50px;padding:4px}.player-disc{width:42px;height:42px}.player-label{font-size:17px;padding-right:14px}.hub .avatar-choice svg{width:52px;height:52px}.player-rows{margin:10px 0}.player-face{width:44px;height:44px}}
.player-management .save-feedback:empty{min-height:0;margin:0}
@media (max-height:540px){.player-management p{margin:6px 0}.player-rows{gap:8px}.player-row{padding:6px 10px}.hub .player-management .player-row button{min-height:42px;padding:8px 14px}}
/* A seventh settings tile: a short screen fits four smaller tiles a row, still two rows. */
@media (max-height:520px){.settings-tiles.many{gap:16px}.hub .settings-tiles.many .settings-tile{width:128px;height:116px;border-radius:26px}.hub .settings-tiles.many .settings-tile svg{width:56px;height:56px}}

/* Naming a player: a big field, and on the handheld Cubby's shared keyboard under it. */
.name-entry{margin:10px 0 12px}
.hub .player-name-field{box-sizing:border-box;width:100%;height:52px;padding:0 14px;border:0;border-radius:14px;background:rgba(16,9,28,.65);box-shadow:inset 0 2px 6px rgba(0,0,0,.4);color:#ffd770;font:800 24px system-ui,sans-serif}
.hub .player-name-field:focus{outline:3px solid #ffc94d;outline-offset:2px}
:is(.player-management,.kid-name) .name-keyboard{grid-auto-rows:40px;margin:0 0 14px}
.hub :is(.player-management,.kid-name,.feed-management) .cubby-keyboard button{min-width:0;min-height:0;padding:0;border-radius:9px;background:#3b2d57;font-size:16px;white-space:nowrap}
.hub :is(.player-management,.kid-name,.feed-management) .cubby-keyboard button:focus{outline:none;background:#ffc94d;color:#3a2410}
.hub :is(.player-management,.kid-name,.feed-management) .cubby-keyboard svg{width:20px;height:20px}
@media (max-height:540px){:is(.player-management,.kid-name) .name-keyboard{grid-auto-rows:32px;margin:0 0 10px}.hub .player-name-field{height:46px;font-size:22px}.name-entry{margin:6px 0 14px}}/* Players screens use pictures, not words: icon buttons in the settings tiles' line style. */
.hub .save-management .dialog-back{display:grid;place-items:center;width:48px;height:48px;min-width:48px;min-height:48px;padding:0;margin:0 0 10px;border-radius:50%;background:#2e2248;box-shadow:0 3px 0 rgba(8,4,16,.5),inset 0 0 0 2px rgba(255,255,255,.16)}
.hub :is(.save-management,.player-picker) .icon-button{display:grid;place-items:center;width:52px;height:52px;min-width:52px;min-height:52px;padding:0;border-radius:16px}
.hub :is(.save-management,.player-picker) .icon-button svg{width:26px;height:26px;stroke-width:2.2}
.hub .player-management .player-row .icon-button{width:48px;height:48px;min-width:48px;min-height:48px;background:rgba(255,255,255,.08)}
.player-row.is-playing{background:rgba(255,201,77,.1)}
.player-row.is-playing .player-face{border-radius:50%;box-shadow:0 0 0 3px #fff4e6,0 0 0 6px #ffc94d,0 0 16px 4px rgba(255,184,56,.5)}
.hub .player-management .add-player{width:100%;height:60px;border-radius:18px;background:transparent;border:2px dashed rgba(255,244,230,.28);color:#ffd770}
.hub .player-management .add-player svg{width:34px;height:34px;stroke-width:2.6}
.hub .player-management .add-player:disabled{display:none}
.icon-actions{display:flex;justify-content:center;gap:24px;margin-top:14px}
.hub :is(.save-management,.player-picker) .icon-actions .icon-button,.hub .kid-actions .icon-button{width:80px;height:58px;border-radius:20px}
.hub :is(.save-management,.player-picker) .icon-actions .icon-button svg,.hub .kid-actions .icon-button svg{width:30px;height:30px;stroke-width:2.6}
.hub :is(.save-management,.player-picker) :is(.cancel-player,.kid-cancel){background:rgba(255,255,255,.12);color:#fff4e6}
.hub :is(.save-management,.player-picker) .save-name{background:linear-gradient(#ffd770,#ffb22e);color:#3a2410}
.hub :is(.save-management,.player-picker) .save-name:disabled{opacity:.35}
.hub .save-management .remove-confirm{background:#854b51;color:#fff4e6}
.remove-picture{position:relative;width:112px;margin:6px auto 18px}
.remove-picture .player-face{width:112px;height:112px}
.remove-symbol{position:absolute;right:-6px;bottom:-6px;display:grid;place-items:center;width:46px;height:46px;border:3px solid #291e40;border-radius:50%;background:#854b51;color:#fff4e6}
.hub .remove-symbol svg{width:24px;height:24px}
.name-entry{display:flex;align-items:center;gap:12px}
.name-entry .player-face{width:52px;height:52px}
.name-entry .player-name-field{flex:1;min-width:0}
.hub .player-name-field.invalid,.hub .player-name-field.invalid:focus{outline:3px solid #ff8f7f;outline-offset:2px}
.hub :is(.save-management,.player-picker) .refused{outline:3px solid #ff8f7f;outline-offset:3px;animation:refuse .38s ease}
@keyframes refuse{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.hub .player-management .avatar-choice{padding:10px;border-radius:18px}
.hub .player-management .avatar-choice svg{width:72px;height:72px}
.hub :is(.player-management,.kid-name,.feed-management) .cubby-keyboard .case[aria-pressed=true]{color:#ffd770}
@media (max-height:540px){.hub .player-management .avatar-choice svg{width:60px;height:60px}.hub .save-management .dialog-back{width:44px;height:44px;min-width:44px;min-height:44px;margin-bottom:8px}.icon-actions{margin-top:10px}}

/* A fresh Cubby's player chip is the logo itself, so the logo steps aside for it. */
.hub .brand.has-player .brand-mark{display:none}
/* The house inside Cubby's token: sizes are in the token's 100-unit picture. */
.hub svg.cubby-art svg{width:66px;height:66px;animation:none}
/* The picker's +: an empty face to fill, sized like the others. */
.hub .picker-plus .face-disc{display:grid;place-items:center;background:rgba(255,255,255,.05);border:3px dashed rgba(255,244,230,.35);box-shadow:none;color:#ffd770;box-sizing:border-box}
.hub .picker-plus .face-disc svg{width:42%;height:42%;stroke:currentColor;stroke-width:2.6}
.hub .picker-plus:focus .face-disc{border-color:#ffc94d;background:rgba(255,201,77,.12);box-shadow:0 0 0 5px #fff4e6,0 0 0 10px #ffc94d,0 0 40px 12px rgba(255,184,56,.5)}
.hub .picker-plus:focus .face-disc svg{animation:none}
.picker-plus .face-name{min-height:1.15em}
.kid-actions{display:flex;justify-content:center;margin-top:clamp(10px,3vh,24px)}
/* A child's name step: the same face, field, keys and ✕ ✓ as the adult page. */
.kid-name{box-sizing:border-box;width:min(600px,94vw);padding:18px;border-radius:26px;background:#291e40;box-shadow:0 24px 60px #0008}
@media (max-height:540px){.kid-name{padding:14px}}
/* Game feeds: the Players screens' look. Cards of name, covers and picture buttons; no words but names. */
.feed-management{width:min(600px,94vw);overflow-x:hidden}
.feed-top{display:flex;align-items:center;gap:14px;margin:0 0 4px}
.hub .feed-top .dialog-back{margin:0}
.feed-heading{display:grid;place-items:center;color:#ffd770}
.hub .feed-heading svg{width:38px;height:38px;stroke-width:1.8}
.feed-rows{display:grid;gap:12px;margin:12px 0 4px}
.feed-card{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"head head" "covers tools";align-items:center;gap:10px 12px;min-width:0;padding:12px 14px;border:2px solid transparent;border-radius:18px;background:rgba(255,255,255,.06)}
.feed-card.is-down{border-color:#ff8f7f;background:rgba(255,143,127,.08)}
.feed-head{grid-area:head;display:flex;align-items:center;gap:10px;min-width:0}
.feed-title{flex:1;min-width:0;overflow:hidden;font-size:19px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.feed-mark{display:grid;place-items:center}
.hub .feed-mark svg{width:24px;height:24px;stroke-width:2.2}
.is-stale .feed-mark{color:#ffc94d;opacity:.7}.is-down .feed-mark{color:#ff8f7f}
.feed-card.is-off :is(.feed-title,.feed-covers){opacity:.4}
.feed-covers{grid-area:covers;display:flex;align-items:center;gap:6px;min-width:0;min-height:44px;overflow:hidden}
.feed-covers img{flex:none;height:44px;aspect-ratio:4/3;border-radius:8px;object-fit:contain;image-rendering:pixelated;background:#2c2244;box-shadow:0 2px 0 rgba(10,4,20,.35)}
.feed-covers:empty{display:none}.feed-none{display:grid;place-items:center;opacity:.45}.hub .feed-none svg{width:30px;height:30px}
.feed-tools{grid-area:tools;display:flex;align-items:center;gap:8px}
.hub .feed-management .feed-tools .icon-button{width:44px;height:44px;min-width:44px;min-height:44px;border-radius:14px;background:rgba(255,255,255,.08)}
.hub .feed-management .feed-tools .icon-button svg{width:22px;height:22px}
.hub .feed-management .feed-tools .icon-button:disabled{opacity:.2}
/* The switch: a pill whose knob slides over and lights up when the feed is in use. */
.hub .feed-management .feed-toggle{position:relative;display:block;width:64px;height:36px;min-width:64px;min-height:36px;padding:0;border-radius:999px;background:rgba(16,9,28,.65);box-shadow:inset 0 2px 6px rgba(0,0,0,.45)}
.feed-knob{position:absolute;top:4px;left:4px;width:28px;height:28px;border-radius:50%;background:#8f7ca4;box-shadow:0 2px 0 rgba(0,0,0,.3);transition:transform .2s cubic-bezier(.3,1.5,.5,1),background-color .16s}
.hub .feed-management .feed-toggle[aria-checked=true]{background:linear-gradient(#ffd770,#ffb22e)}
.feed-toggle[aria-checked=true] .feed-knob{transform:translateX(28px);background:#fff4e6}
.hub .feed-management .add-feed{width:100%;height:60px;border-radius:18px;background:transparent;border:2px dashed rgba(255,244,230,.28);color:#ffd770}
.hub .feed-management .add-feed svg{width:34px;height:34px;stroke-width:2.6}
.hub .feed-management .add-feed:disabled{display:none}
.hub :is(.save-management,.player-picker) .cancel-feed{background:rgba(255,255,255,.12);color:#fff4e6}
.hub .save-management .save-feed{background:linear-gradient(#ffd770,#ffb22e);color:#3a2410}
.hub .save-management .save-feed.is-dim{opacity:.35}
/* Saving: every control waits and the one pressed pulses. */
.hub .feed-management .is-busy:disabled{opacity:1;animation:feed-busy 1s ease-in-out infinite}
@keyframes feed-busy{50%{opacity:.45}}
@media (prefers-reduced-motion:reduce){.hub .feed-management .is-busy:disabled{animation:none;opacity:.7}}
.feed-fields{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin:6px 0 14px}
.feed-field{display:flex;align-items:center;gap:12px;min-width:0}
.feed-field-icon{display:grid;place-items:center;flex:none;width:36px;color:#ffd770}
.hub .feed-field-icon svg{width:30px;height:30px;stroke-width:2}
.hub .feed-field input{box-sizing:border-box;flex:1;width:0;min-width:0;height:52px;padding:0 14px;border:0;border-radius:14px;background:rgba(16,9,28,.65);box-shadow:inset 0 2px 6px rgba(0,0,0,.4);color:#ffd770;font:800 20px system-ui,sans-serif}
.hub .feed-field .feed-url-input{font-size:17px;font-weight:700}
.hub .feed-field input:focus,.hub .feed-field.is-typing input{outline:3px solid #ffc94d;outline-offset:2px}
.hub .feed-field input.invalid,.hub .feed-field input.invalid:focus{outline:3px solid #ff8f7f;outline-offset:2px}
.feed-management .feed-keyboard{grid-auto-rows:36px;margin:0 0 12px}
.feed-remove-picture .feed-picture{display:grid;place-items:center;width:112px;height:112px;overflow:hidden;border-radius:26px;background:rgba(255,255,255,.1);color:#ffd770}
.feed-picture img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated}
.hub .feed-picture svg{width:56px;height:56px;stroke-width:1.8}
.hub .feed-management .feed-remove-name{margin:0 0 6px;font-size:20px;text-align:center;white-space:normal;overflow-wrap:anywhere}
.feed-wait{display:grid;place-items:center;min-height:140px;color:#ffd770}.hub .feed-wait svg{width:64px;height:64px;stroke-width:1.8}
@media (max-width:460px){.feed-card{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "covers" "tools"}.hub .feed-management .feed-tools .feed-edit{margin-left:auto}}
@media (max-height:540px){.feed-card{gap:8px 10px;padding:8px 10px}.feed-rows{gap:8px;margin:8px 0 2px}.feed-covers{min-height:36px}.feed-covers img{height:36px}.hub .feed-management .feed-tools .icon-button{width:40px;height:40px;min-width:40px;min-height:40px}.hub .feed-field input{height:44px}.feed-fields{gap:8px;margin:0 0 10px}.feed-management .feed-keyboard{grid-auto-rows:28px;margin:0 0 8px}.hub .feed-management .add-feed{height:50px}.hub .feed-heading svg{width:32px;height:32px}}

/* Adult feed settings identify whose Store and Library these switches affect. */
.feed-player{display:flex;align-items:center;gap:.5em;margin-left:auto}.feed-player .player-face{width:2.3em;height:2.3em}.feed-player .player-face svg{width:100%;height:100%}.feed-player-name{font-weight:700}
.link-code{width:min(300px,56vh);margin:14px auto;border-radius:14px;overflow:hidden;background:#fff}.link-code svg{display:block;width:100%;height:auto}.hub .link-code svg :is(rect,path){stroke:none;stroke-width:0}