/* Your vibe: theme overrides (html[data-vibe] sits on the dark/light look and recolors it) + VIBE menu + ball maker. Matches mock/r4/vibe. */
html[data-vibe] body{background:linear-gradient(180deg,var(--vb-bg1),var(--vb-bg2)) fixed;color:var(--vb-ink)}
html[data-vibe] body:has(.home){background:linear-gradient(180deg,var(--vb-bg1),var(--vb-bg2)) fixed}
html[data-vibe] header,html[data-vibe] body:has(.home) header{background:linear-gradient(180deg,var(--vb-hdr1),var(--vb-hdr2));border-bottom:3px solid color-mix(in srgb,var(--vb-btn) 70%,#000);box-shadow:none}
html[data-vibe] #theme-bar{background:var(--vb-card);border-bottom:1px solid var(--vb-line);color:var(--vb-ink)}
html[data-vibe] #theme-bar .tb-look{color:var(--vb-ink);border-color:var(--vb-ink)}
html[data-vibe] .card,html[data-vibe] .home-hero,html[data-vibe] .home-tip{background:var(--vb-card);color:var(--vb-ink);border-color:var(--vb-line);box-shadow:0 2px 8px rgba(0,0,0,.08),0 8px 24px rgba(0,0,0,.08)}
html[data-vibe] .home-hero h1{background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--vb-ink)}
html[data-vibe] h1,html[data-vibe] h2,html[data-vibe] h3{color:var(--vb-ink)}
/* the maker sheet and its popups are always dark: keep their own heading colors under a light vibe */
html[data-vibe] .vb-h3s{color:#b8b8c4}html[data-vibe] .vb-confirm .vb-h3,html[data-vibe] .lp-ask-card h3{color:#fff}
html[data-vibe] .muted,html[data-vibe] .home-tag,html[data-vibe] .home-sub{color:var(--vb-muted)}
html[data-vibe] a,html[data-vibe] .link{color:var(--vb-link)}
html[data-vibe] .btn,html[data-vibe] .home .btn-pulse,html[data-vibe] .btn-crown{background:var(--vb-btn);color:var(--vb-btn-t);border-color:color-mix(in srgb,var(--vb-btn) 55%,#000);box-shadow:0 3px 0 var(--vb-btn-d)}
html[data-vibe] .btn.alt{background:var(--vb-soft);color:var(--vb-ink);border-color:var(--vb-line);box-shadow:0 3px 0 var(--vb-line)}
html[data-vibe] .home-kicker,html[data-vibe] .tip-pill,html[data-vibe] .comp-pill{background:var(--vb-soft);color:var(--vb-link)}
html[data-vibe] .step,html[data-vibe] .rar-strip,html[data-vibe] .ev-tile{background:var(--vb-soft);box-shadow:none}
html[data-vibe] .r2-line{border-color:var(--vb-line);color:var(--vb-ink);background:color-mix(in srgb,var(--vb-card) 55%,transparent)}
html[data-vibe] .sec-ico{background:var(--vb-soft);color:var(--vb-link)}
html[data-vibe] input,html[data-vibe] select,html[data-vibe] textarea{background:var(--vb-soft);color:var(--vb-ink);border-color:var(--vb-line)}
html[data-vibe] footer{color:var(--vb-muted)}html[data-vibe] footer a{color:var(--vb-link)}
html[data-vibe] .card::before,html[data-vibe] .home-hero::before{background:var(--vb-bar)}
html.vb-lock,html.vb-lock body{overflow:hidden}
/* ---- shared ---- */
canvas.vb-pb{image-rendering:pixelated;display:inline-block;vertical-align:middle}
.vb-menu-wrap,.vb-maker,.vb-succ-wrap,.vb-confirm-wrap{font:17px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#eee;-webkit-tap-highlight-color:transparent}
.vb-menu-wrap button,.vb-maker button,.vb-succ-wrap button,.vb-confirm-wrap button{font-family:system-ui,-apple-system,sans-serif;cursor:pointer;-webkit-user-select:none;user-select:none}
.vb-menu-wrap .vb-h2,.vb-maker .vb-h2,.vb-succ-wrap .vb-h2{font:600 22px/1.25 "Pixelify Sans",system-ui,sans-serif;margin:0;color:#fff;letter-spacing:0}
.vb-dim,.vb-dim2{position:fixed;inset:0;background:#0009;z-index:1000}.vb-dim2{background:#000a;z-index:1030}
/* ---- VIBE menu ---- */
.vb-menu{position:fixed;left:10px;right:10px;top:max(70px,env(safe-area-inset-top));max-width:460px;margin:0 auto;max-height:calc(100dvh - 90px);overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;background:#1b1a24;color:#eee;border-radius:16px;box-shadow:0 18px 50px #000c;padding:12px;z-index:1010;border:1px solid #ffffff18}
.vb-mh{display:flex;align-items:center;gap:8px;margin:2px 4px 8px}.vb-mh .vb-h2{font-size:18px;flex:1}.vb-cnt{font:700 13px system-ui;color:#b8b8c4}
.vb-x{width:36px;height:36px;border-radius:10px;border:2px solid #ffffff22;background:transparent;color:#ddd;display:grid;place-items:center;padding:0}.vb-x svg{width:18px;height:18px}
.vb-empty{color:#c8c8d2;font-size:15px;margin:2px 4px 10px}
.vb-row{background:#23232b;border-radius:14px;padding:10px;margin-bottom:8px;border:2px solid transparent}.vb-row.vb-on{border-color:#ffe680}
.vb-r1{display:flex;align-items:center;gap:10px}.vb-nm{min-width:0;flex:1}.vb-nm b{font-size:16px;display:block;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vb-tags{display:flex;gap:5px;margin-top:2px}.vb-tag{font:700 11px system-ui;padding:2px 7px;border-radius:999px;background:#ffffff1a;color:#ddd}.vb-tag.sh{background:#2fa36b33;color:#9ff0c4}.vb-tag.use{background:#ffe68033;color:#ffe680}
.vb-use{margin-left:auto;height:44px;padding:0 18px;border-radius:12px;border:0;background:#ffd84a;color:#14121c;font:700 16px system-ui}
.vb-r2{display:flex;align-items:center;gap:8px;margin-top:10px}.vb-eb{height:44px;padding:0 16px;border-radius:10px;border:2px solid #ffffff30;background:transparent;color:#fff;font:700 15px system-ui}
.vb-shw{display:flex;align-items:center;gap:8px;font:700 15px system-ui;margin-left:auto;color:#fff}
.vb-sw{width:52px;height:32px;border-radius:999px;background:#c7cbd6;position:relative;flex:none;border:0;padding:0}.vb-sw::after{content:"";position:absolute;left:3px;top:3px;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0004;transition:left .2s}
.vb-sw.on{background:#2fa36b}.vb-sw.on::after{left:23px}
.vb-del{width:44px;height:44px;border-radius:10px;border:2px solid #ff8a8055;background:transparent;color:#ffb3ad;display:grid;place-items:center;padding:0}.vb-del svg{width:20px;height:20px}
.vb-newv{display:flex;width:100%;align-items:center;justify-content:center;gap:8px;height:54px;border-radius:14px;border:2px dashed #ffffff40;background:transparent;color:#fff;font:700 17px system-ui}
.vb-foot{text-align:center;margin:10px 0 2px}.vb-link{background:none;border:0;color:#cfd3ff;text-decoration:underline;font-size:15px;padding:6px 4px}
.vb-confirm{position:fixed;left:24px;right:24px;max-width:400px;margin:0 auto;top:30%;background:#16161c;color:#eee;border-radius:16px;padding:18px;z-index:1040;text-align:center;box-shadow:0 20px 60px #000e}
.vb-confirm .vb-h3{font:600 19px "Pixelify Sans",system-ui;margin:8px 0 6px;color:#fff}.vb-confirm p{color:#c8c8d2;font-size:14.5px;margin:0 0 12px}
.vb-row2{display:flex;gap:10px}.vb-row2 button{flex:1;height:50px;border-radius:12px;font:700 16px system-ui;border:0}.vb-k{background:#2a2a34;color:#fff}.vb-d{background:#e3262e;color:#fff}
/* ---- maker ---- */
.vb-maker{position:fixed;inset:0;z-index:1020;background:#0f0f14;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.vb-yv{background:#16161c;max-width:460px;margin:10px auto 30px;border-radius:16px;padding:0 14px 18px;box-shadow:0 10px 40px #0008;overflow:hidden}
.vb-credit2{background:#2c2618;border:1px solid #ffe9a855;border-radius:12px;padding:8px 10px;margin:12px 0 10px;font-size:13.5px;line-height:1.35;color:#ffe9a8;display:flex;gap:8px;align-items:center}
.vb-stage{position:relative;height:344px;margin:0 -14px 6px;background:radial-gradient(200px 200px at 50% 150px,#9a93c4 0%,#7a73a6 52%,#4a4466 72%,#24222f 92%,#1a1922 100%);display:flex;flex-direction:column;align-items:center;padding-top:18px;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;overflow:hidden}
.vb-bob{animation:vb-bob 3.2s ease-in-out infinite;position:relative;z-index:2}@keyframes vb-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.vb-ball{position:relative;width:260px;height:260px}.vb-ball canvas{position:absolute;left:0;top:0;width:260px;height:260px;image-rendering:pixelated;pointer-events:none;-webkit-touch-callout:none}
.vb-float.vb-held{filter:drop-shadow(0 2px 0 #0007)}.vb-float.vb-fl{animation:vb-flash 1.25s ease-in-out infinite}
@keyframes vb-flash{0%,100%{opacity:1}50%{opacity:.35}}
.vb-selbox{position:absolute;border:3px dashed #fff;border-radius:4px;box-shadow:0 0 0 2px #0008;pointer-events:none;box-sizing:border-box}.vb-selbox.vb-fl{border-color:#ffe680;box-shadow:0 0 0 2px #0008,0 0 14px 2px #fff6c0;animation:vb-sb 1.25s ease-in-out infinite}@keyframes vb-sb{50%{opacity:.5}}
.vb-handle{position:absolute;right:-12px;bottom:-12px;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid #14121c;pointer-events:auto;cursor:nwse-resize}
@media (pointer:coarse){.vb-handle{display:none}}
.vb-hint{position:absolute;left:50%;transform:translateX(-50%);top:6px;background:#ffd84a;color:#14121c;font:700 14px system-ui;padding:8px 12px;border-radius:12px;white-space:nowrap;z-index:6;box-shadow:0 3px 0 #b99418;pointer-events:none}
.vb-hint:after{content:"";position:absolute;left:50%;bottom:-7px;margin-left:-7px;border:7px solid transparent;border-bottom:0;border-top-color:#ffd84a}
.vb-ped{width:286px;height:52px;image-rendering:pixelated;margin-top:-2px;position:relative;z-index:1}
.vb-pshadow{position:absolute;left:50%;bottom:2px;width:300px;height:26px;margin-left:-150px;border-radius:50%;background:radial-gradient(closest-side,#000a,#0000);z-index:0}
.vb-live{position:absolute;left:12px;top:10px;font:700 11px system-ui;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:#1b1a2ecc;border-radius:999px;padding:4px 9px;z-index:3}
.vb-sb{position:absolute;bottom:10px;z-index:3;height:44px;min-width:46px;padding:0 12px;border-radius:12px;border:2px solid #ffffff30;background:#16161ccc;color:#fff;font:700 15px system-ui;display:grid;place-items:center}.vb-sb svg{width:20px;height:20px}
.vb-sb-l{left:12px}.vb-sb-r{right:12px}.vb-sb-x{top:8px;bottom:auto;right:10px;height:40px;min-width:40px;padding:0}
.vb-size{position:absolute;left:50%;transform:translateX(-50%);bottom:18px;font:700 12px system-ui;color:#fff;background:#0009;border-radius:999px;padding:4px 9px;z-index:3}
.vb-tabs2{display:flex;background:#0f0f14;border-radius:14px;padding:4px;margin:12px 0 4px}.vb-tabs2 button{flex:1;text-align:center;padding:12px 0;border-radius:11px;font:700 16px system-ui;color:#b8b8c4;background:transparent;border:0}.vb-tabs2 button.on{background:#ffd84a;color:#14121c}
.vb-h3s{font:700 13px system-ui;letter-spacing:.04em;text-transform:uppercase;color:#b8b8c4;margin:14px 2px 8px}
.vb-cnt2{float:right;font:700 13px system-ui;color:#ffe680;text-transform:none;letter-spacing:0}
.vb-parts{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.vb-parts button{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 2px;border-radius:12px;border:2px solid #ffffff22;background:transparent;font:700 12.5px/1.15 system-ui;color:#ddd;min-height:66px}
.vb-parts button.on{border-color:#ffe680;background:#ffffff10;color:#fff}.vb-parts i{width:26px;height:26px;border-radius:50%;border:2px solid #fff6;display:block}
.vb-pal{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.vb-pal button{height:46px;border-radius:12px;border:3px solid #ffffff22;padding:0}.vb-pal button.on{border-color:#fff;box-shadow:0 0 0 3px #ffe680}
.vb-seg4{display:flex;border:2px solid #ffffff30;border-radius:12px;overflow:hidden}.vb-seg4 button{flex:1;text-align:center;padding:12px 0;font:700 15px system-ui;color:#cfcfd8;background:transparent;border:0}.vb-seg4 button.on{background:#cfe0ff;color:#14121c}
.vb-placed{display:flex;gap:6px;flex-wrap:wrap}.vb-chip3{display:flex;align-items:center;gap:6px;height:48px;padding:0 10px 0 8px;border-radius:12px;background:#23232b;border:2px solid #ffffff22;color:#fff;font:700 13px system-ui}.vb-chip3.on{border-color:#ffe680;background:#2c2a1e}.vb-cd{width:14px;height:14px;border-radius:50%;border:2px solid #fff8}
.vb-small{font-size:13px;color:#b8b8c4;text-align:center;margin:8px 0 0}
.vb-lib{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.vb-lib button{height:52px;border-radius:12px;background:#23232b;border:2px solid #ffffff14;display:grid;place-items:center;padding:0}.vb-lib button:active{border-color:#ffe680;background:#2c2a1e}
.vb-lib.named button{height:66px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;font:600 10.5px system-ui;color:#cfcfd8}
.vb-selhead{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:10px 2px 0;font:700 15px system-ui;color:#fff}.vb-selhead span{color:#b8b8c4;font-weight:600;font-size:13px;text-align:right}
.vb-tools{display:flex;gap:6px;margin:8px 0 2px}.vb-tools button{flex:1;min-height:60px;border-radius:12px;background:#23232b;border:2px solid #ffffff22;color:#fff;font:700 12px/1.1 system-ui;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:4px 2px}
.vb-tools button svg{width:22px;height:22px}.vb-tools button.on{border-color:#ffe680;background:#2c2a1e}.vb-tools button[disabled]{opacity:.35}.vb-cdot{width:20px;height:20px;border-radius:50%;border:2px solid #ffffff60;display:block}
.vb-tools+.vb-pal{margin-top:8px}
.vb-vname input{width:100%;box-sizing:border-box;font:600 16px system-ui;padding:12px;border-radius:10px;border:2px solid #ffffff30;background:#0f0f14;color:#fff}
.vb-btn{display:block;width:100%;padding:15px;margin:14px 0 0;font:600 18px/1.2 "Pixelify Sans",system-ui;text-align:center;background:#ffd84a;color:#14121c;border:0;border-radius:14px;box-shadow:0 3px 0 #b99418}
.vb-back{display:block;margin:6px auto 0}
/* ---- success ---- */
.vb-succ{position:fixed;left:14px;right:14px;top:50%;transform:translateY(-50%);max-width:440px;margin:0 auto;z-index:1010;text-align:center;background:var(--vb-card,#23232b);color:var(--vb-ink,#eee);border-radius:16px;padding:18px;box-shadow:0 20px 60px #000a;overflow:hidden}
.vb-succ::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--vb-bar,#ffd84a)}
.vb-succ .vb-h2{color:var(--vb-ink,#fff);margin:6px 0 4px}.vb-by{color:var(--vb-muted,#b8b8c4);font-size:15px;margin:0 0 10px}
.vb-succ .vb-btn{background:var(--vb-btn,#ffd84a);color:var(--vb-btn-t,#14121c);box-shadow:0 3px 0 var(--vb-btn-d,#b99418)}
.vb-sm-btn{display:inline-flex;align-items:center;gap:6px;margin:12px auto 0;padding:9px 16px;border-radius:999px;border:2px solid var(--vb-line,#ffffff30);background:var(--vb-soft,#2a2a34);color:var(--vb-ink,#fff);font:700 15px system-ui}.vb-sm-btn svg{width:16px;height:16px}
.vb-note{font-size:13px;color:var(--vb-muted,#b8b8c4);margin:10px 0 0}
/* ---- vibe5: add-on shape layer, 6 tabs, Shape / Sound / Case / Site tabs ---- */
.vb-stage{padding-top:50px}
.vb-ball{width:220px;height:220px}.vb-ball canvas{width:220px;height:220px}.vb-ball canvas.vb-ext{left:-44px;top:-44px;width:308px;height:308px}
.vb-tabs6{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.vb-tabs6 button{padding:10px 2px;font:700 14.5px/1.15 system-ui}
.vb-shapes{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.vb-shapes button,.vb-frames button{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 2px 6px;border-radius:12px;border:2px solid #ffffff22;background:#23232b;color:#ddd;font:700 11.5px/1.15 system-ui;min-height:86px}
.vb-shapes canvas{width:56px;height:56px}.vb-shapes button.on,.vb-frames button.on,.vb-snds button.on,.vb-glass button.on{border-color:#ffe680;background:#2c2a1e;color:#fff}
.vb-snds{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.vb-snds button{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 2px 5px;border-radius:12px;background:#23232b;border:2px solid #ffffff14;color:#d8d8e2;font:600 11.5px/1.15 system-ui;min-height:64px}
.vb-snds canvas{width:36px;height:36px}.vb-snds button.on::after{content:"";position:absolute;right:4px;top:4px;width:12px;height:12px;border-radius:50%;background:#ffd84a url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><path d="M3 6.2 5.1 8.3 9 4" fill="none" stroke="%2314121c" stroke-width="2"/></svg>') center/12px no-repeat}
.vb-sl{margin:12px 2px 0}.vb-sl-top{display:flex;justify-content:space-between;align-items:baseline;font:700 15px system-ui;color:#fff}.vb-sl-top i{font-style:normal;font-weight:600;color:#ffe680;font-size:13.5px}
.vb-sl input{width:100%;height:40px;margin:2px 0 0;accent-color:#ffd84a;touch-action:pan-y}.vb-sl-ends{display:flex;justify-content:space-between;font:600 12px system-ui;color:#9a9aac}
.vb-hearrow{display:flex;align-items:center;gap:10px;margin-top:12px}.vb-hear{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;height:54px;border:0;border-radius:14px;background:#ffd84a;color:#14121c;font:600 18px/1 "Pixelify Sans",system-ui!important;box-shadow:0 3px 0 #b99418}
.vb-hear svg{width:20px;height:20px}.vb-hear.vb-playing{background:#ffe680;transform:translateY(2px);box-shadow:0 1px 0 #b99418}
.vb-casepv{display:flex;justify-content:center;padding:10px 0 0}.vb-casepv canvas{filter:drop-shadow(0 4px 0 #0006)}
.vb-frames{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.vb-frames button{min-height:78px}.vb-frames .c{display:block;height:48px}
.vb-glass{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.vb-glass button{display:flex;align-items:center;gap:6px;height:46px;padding:0 8px;border-radius:12px;border:2px solid #ffffff22;background:#23232b;color:#ddd;font:700 12.5px system-ui}.vb-glass i{width:20px;height:20px;border-radius:6px;border:2px solid #ffffff66;flex:none}
.vb-swg{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}.vb-swg button{position:relative;height:44px;min-width:0;border-radius:12px;border:2px solid #ffffff30;padding:0;background:#23232b;display:grid;place-items:center;overflow:visible}
.vb-swg button.on{outline:3px solid #ffe680;outline-offset:2px}.vb-swg button canvas.vb-pb{width:34px;height:34px;margin:0}.vb-swg button b{font:700 10px system-ui;color:#4a5070;background:#f6f7f9;position:absolute;inset:0;border-radius:10px;display:grid;place-items:center}
.vb-swg button.off{opacity:.55;background-image:repeating-linear-gradient(135deg,transparent 0 5px,#0009 5px 7px)!important;cursor:not-allowed}
.vb-hardm{display:inline-grid;place-items:center;width:17px;height:17px;border-radius:50%;background:#2a2a33;border:1.5px solid #ffd84a;color:#ffd84a;flex:none}.vb-hardm svg{width:12px;height:12px}
.vb-swg .vb-hardm{position:absolute;right:-6px;top:-6px}
.vb-why{display:flex;gap:8px;align-items:flex-start;font-size:13px;line-height:1.35;color:#b8b8c4;margin:10px 2px 0}
.vb-spv{border-radius:14px;overflow:hidden;border:2px solid #0006;font:14px/1.4 system-ui}.vb-spv-h{display:flex;align-items:center;gap:8px;padding:8px 10px;font:700 15px "Pixelify Sans",system-ui}
.vb-spv-pill{margin-left:auto;display:flex;align-items:center;gap:4px;font:700 11px system-ui;padding:2px 8px 2px 2px;border-radius:99px;border:2px solid currentColor}.vb-spv-pill canvas{width:22px;height:22px}
.vb-spv-b{padding:10px}.vb-spv-c{display:flex;flex-direction:column;gap:4px;border-radius:12px;padding:10px 12px;border:1.5px solid}.vb-spv-t{font:600 16px "Pixelify Sans",system-ui}.vb-spv-m{font-size:12.5px}
.vb-spv-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:4px}.vb-spv-btn{padding:7px 13px;border-radius:10px;font:600 13px "Pixelify Sans",system-ui;box-shadow:0 2px 0 #0005}.vb-spv-a{text-decoration:underline;font-weight:600}
.vb-spv-chip{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:99px;font:600 11.5px system-ui;border:1.5px solid}.vb-spv-chip svg{width:14px;height:14px}
/* ---- room (look-pick.js + vibe-room.js) ---- */
.lp-scene .lp-room{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;pointer-events:none}
.lp-taps{position:absolute;inset:0}.lp-tap{position:absolute;background:transparent;border:0;padding:0;margin:0;cursor:pointer;-webkit-tap-highlight-color:transparent}.lp-tap:focus-visible{outline:3px solid #ffe680;outline-offset:-2px;border-radius:6px}
.lookpick.lp-made .lp-cap,.lookpick.lp-made .lp-spot{display:none}
.lookpick.lp-made .lp-names span{width:19%;font-size:11px}.lookpick .lp-names span.dim{opacity:.6}
.lp-ask{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:5}.lp-ask-dim{position:absolute;inset:0;background:#0009}
.lp-ask-card{position:relative;max-width:340px;margin:0 16px;background:#16161c;color:#eee;border-radius:16px;padding:18px;text-align:center;box-shadow:0 20px 60px #000c}
.lp-ask-card h3{font:600 21px/1.25 "Pixelify Sans",system-ui;margin:0 0 6px;color:#fff}.lp-ask-card p{color:#c8c8d2;font-size:15px;margin:0 0 14px}
.lp-ask-row{display:flex;gap:10px;align-items:center}.lp-ask-row .btn{flex:1;margin:0}.lp-ask-row .link{flex:1;min-height:48px;color:#cfd3ff}
.vb-maker,.vb-succ-wrap,.vb-menu-wrap,.lookpick{font-variant-ligatures:none} /* Pixelify Sans draws 'fi' as one odd glyph */
.lookpick .lp-card h2{font-family:"Pixelify Sans",system-ui,sans-serif;font-size:21px;letter-spacing:0;word-spacing:0} /* the light look's wide pixel font made the title look loose; same title font in every look */
/* the selected case's Edit / Share / Delete row in the room (replaces the old VIBE dropdown menu) */
.lp-acts{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:0 0 10px}
.lp-act{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:12px;border:2px solid currentColor;background:transparent;color:inherit;font:600 16px/1 system-ui,-apple-system,sans-serif;cursor:pointer}
.lp-shw{border-color:transparent;padding:0 4px}.lp-del{color:#c0392b}html[data-theme=team-rocket] .lp-del{color:#ff7b6b}
/* vibe sharing (vibe-share.js): success-screen button, friend's vibe preview page, Shared vibes on profiles, alert row, avatar ball badge */
.vb-sharebtn{display:inline-flex;align-items:center;gap:8px;margin:14px auto 0;min-height:44px;padding:0 18px;border-radius:999px;border:2px solid #fff6;background:transparent;color:inherit;font:600 16px/1 system-ui,-apple-system,sans-serif}
.vb-sharebtn svg{width:16px;height:16px}.vb-sharebtn:disabled{opacity:.75}.vb-sharenote{margin:8px 0 0;text-align:center}
.vs-page{text-align:center;font-variant-ligatures:none}.vs-ball{margin:6px auto 10px;display:flex;justify-content:center}.vs-h{font-family:"Pixelify Sans",system-ui,sans-serif;letter-spacing:0;margin:0}
.vs-by{margin:2px 0 14px}.vs-spv{text-align:left;margin:0 0 14px}.vs-use{width:100%;margin-top:4px}.vs-note{margin:8px 0}.vs-close{margin-top:6px}
.vs-hear{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;margin:0 0 12px;border-radius:12px;border:2px solid currentColor;background:transparent;color:inherit;font:600 15px/1 system-ui,-apple-system,sans-serif;cursor:pointer}.vs-hear svg{width:16px;height:16px}
.vs-chip{display:inline-flex;align-items:center;gap:8px;margin:4px 0;padding:4px 12px 4px 6px;border-radius:999px;background:var(--light,#eef);font-weight:600}
.vs-sh{display:flex;align-items:center;gap:12px;font-family:"Pixelify Sans",system-ui,sans-serif;letter-spacing:0;font-variant-ligatures:none}
.vs-row{display:flex;align-items:center;gap:14px;min-height:64px;padding:8px 14px;margin:8px 0;border-radius:14px;background:var(--light,#eef3fb);color:inherit;text-decoration:none}
.vs-rt{display:flex;flex-direction:column;flex:1;min-width:0}.vs-rt b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vs-chev{font-size:22px;opacity:.6}
.vs-dots{display:inline-flex;gap:5px}.vs-dots i{width:14px;height:14px;border-radius:50%;border:1px solid #0004}
.vs-mini{display:flex;align-items:center;gap:14px;margin:8px 0;padding:8px 12px;border-radius:12px;background:var(--card,#fff)}.vs-mini .vs-rt{gap:4px}
.vs-badge{display:inline-block;position:relative;width:0;height:0;vertical-align:bottom}
.vs-badge canvas{position:absolute;image-rendering:pixelated;pointer-events:none}
/* Quick room (State A of the vibe room, f232, Will r5): his lab art + sunset loop, balls on dishes, no spotlight; the egg closeup */
.lookpick.lp-quick .lp-scene,.lookpick.lp-quick .lp-names,.lookpick.lp-quick .lp-desc,.lookpick:not(.lp-quick) .qr-wrap{display:none}
.lookpick.lp-quick .lp-card{padding:14px 12px 16px}.lookpick.lp-quick .lp-p{margin:0 0 10px}
.qr-room{position:relative;width:100%;border:3px solid #14121c;border-radius:12px;overflow:hidden;background:#2a1a12;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.qr-room .qr-still{position:absolute;inset:0;width:100%;height:100%;display:block}
.qr-room .qr-vid{position:absolute;object-fit:fill;pointer-events:none}
.qr-o{position:absolute;pointer-events:none}.qr-sh{z-index:2}
.qr-room .qr-sky{z-index:1;overflow:hidden;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.qr-sky img,.qr-sky i{position:absolute;top:0;left:0;width:100%;height:100%;display:block;image-rendering:pixelated}
/* the cloud strip: two strip widths wide, starting one strip to the left; it slides right by exactly one strip (50% of itself) per 180 s,
   in 900 whole steps (f713, Will Oct 24 2026: 10% faster, 180 s / 1.1 = 163.636 s), then repeats on the identical frame: an endless left-to-right drift with no jump back (transform = no repaint) */
.qr-sky i{left:-297.03%;width:594.06%;background-repeat:repeat-x;background-position:0 0;background-size:50% 100%!important;animation:qrSky 163.636s steps(900) infinite;will-change:transform}
@keyframes qrSky{from{transform:translateX(0)}to{transform:translateX(50%)}}
.qr-room .qb{z-index:3;transition:transform .2s ease;image-rendering:pixelated}.qr-room .qr-sh{image-rendering:pixelated}
.qr-room .qb.on{transform:translateY(var(--lift,-2px))}
.qr-spark{z-index:7;aspect-ratio:1;transform:translate(-50%,-50%);opacity:0;background:radial-gradient(circle,#fffdf2 0 22%,#ffeeb8 22% 38%,#ffd88a99 38% 54%,transparent 54%)}
.qr-tap{position:absolute;z-index:8;width:11%;height:24%;transform:translate(-50%,-50%);background:transparent;border:0;padding:0;margin:0;border-radius:12px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.qr-egg{position:absolute;z-index:8;aspect-ratio:1;transform:translate(-50%,-50%);background:transparent;border:0;padding:0;margin:0;border-radius:50%;cursor:pointer;-webkit-tap-highlight-color:transparent}
.qr-tap:focus-visible,.qr-egg:focus-visible{outline:3px solid #ffe680;outline-offset:-2px}.qr-tap:focus:not(:focus-visible),.qr-egg:focus:not(:focus-visible){outline:none}
.qr-labs{display:flex;justify-content:space-around;margin:8px 0 0}
.qr-lab{flex:1;min-width:0;background:none;border:0;padding:4px 2px;color:inherit;cursor:pointer;text-align:center;font:inherit;-webkit-tap-highlight-color:transparent}
.qr-lab b{display:block;overflow-wrap:break-word;font:600 15px/1.2 "Pixelify Sans",system-ui,sans-serif;transition:color .2s ease}.qr-lab small{display:block;font:400 12px/1.3 system-ui,-apple-system,sans-serif;opacity:.72}
.qr-lab.on b{color:#8a6508}html[data-theme=team-rocket] .qr-lab.on b{color:#f5d76e}
.lookpick.lp-quick .lp-ok{margin-top:12px}.qr-next{margin:8px 0 0;font-size:13px;opacity:.75}.qr-next[hidden]{display:none}
/* f283: the old full-screen white burst layer and the SECRET FOUND!-on-white text are gone; the banner + stars live in qroom.js */
.qr-star{position:absolute;left:50%;top:50%;display:block}.qr-star svg{display:block;width:100%;height:100%}@keyframes qrSecPop{0%{transform:scale(.2)}60%{transform:scale(1.18)}100%{transform:scale(1)}}@keyframes qrSecCyc{0%{color:#ffd84a}25%{color:#ff5fa2}50%{color:#7fd6f5}75%{color:#b6f06a}}@keyframes qrSecBlink{0%,34%,67%{opacity:1}17%,50%,84%{opacity:0}100%{opacity:1}}
.qr-acc{background:#ffffff14;border-radius:14px;padding:12px;margin:12px 0 0;text-align:left;font-size:15px}.qr-acc b{display:block;font:600 17px/1.25 "Pixelify Sans",system-ui,sans-serif;margin-bottom:2px}
.qr-note{margin:8px 0 0;font-size:13px;opacity:.75}.qr-saved .qr-later{margin:6px 0 0;color:inherit;opacity:.85}
@media (prefers-reduced-motion:reduce){.qr-room .qr-vid,.qr-room .qr-sky{display:none}.qr-room .qb{transition:none}}

/* the maker from the egg: arcade title; Randomize (dice) for people in a hurry (Will r5) */
.vb-mtitle{font-family:"Pixelify Sans",system-ui,sans-serif;font-weight:700;font-size:24px;line-height:1.15;text-align:center;color:#ffd84a;margin:14px 0 2px;letter-spacing:.02em;text-shadow:-2px 0 0 #2a1440,2px 0 0 #2a1440,0 -2px 0 #2a1440,0 2px 0 #2a1440,0 4px 0 #2a1440;-webkit-font-smoothing:none}.vb-rand{display:flex;flex-direction:column;align-items:center;gap:6px;margin:10px 0 4px}.vb-randb{display:inline-flex;align-items:center;gap:9px;font:700 17px/1 "Pixelify Sans",system-ui,sans-serif;color:#1b1a24;background:#ffd84a;border:2px solid #14121c;border-radius:4px;padding:9px 16px 9px 12px;box-shadow:inset 0 -3px 0 #c9a227,inset 0 2px 0 #fff3b0,0 3px 0 #14121c;cursor:pointer;min-height:44px}.vb-randb:active{transform:translateY(2px);box-shadow:inset 0 -2px 0 #c9a227,0 1px 0 #14121c}.vb-randb svg{width:24px;height:24px;image-rendering:pixelated}.vb-randb.vb-roll svg{animation:vbRoll .36s steps(4,end)}@keyframes vbRoll{0%{transform:rotate(0)}50%{transform:rotate(180deg) translateY(-3px)}100%{transform:rotate(360deg)}}.vb-hurry{text-align:center;margin:0;max-width:330px}@media (prefers-reduced-motion:reduce){.vb-randb.vb-roll svg{animation:none}}
/* ---- ball editor v2 (Will, Oct 19 2026): 5 steps on a close-up Sunset Lab workbench, lab palette; day = parchment, Dark look = dusk ---- */
.vb-maker:has(.vb2){background:#2a1a10}
.vb2{--ink:#150e07;--wood:#472917;--wood2:#724120;--glow:#e59f56;--glow2:#c27845;--sky:#d26656;--paper:#ecd3a2;--card:#f6e7c6;--txt:#2a180c;--mut:#6b4a2c;--line:#c9a46d;--tile:#fbf1da;
  max-width:460px;margin:0 auto;min-height:100%;display:flex;flex-direction:column;background:var(--card);color:var(--txt);font-family:system-ui,sans-serif}
html[data-theme="team-rocket"] .vb2{--card:#24150d;--txt:#f6e3c0;--mut:#c9a67a;--line:#5a3a22;--tile:#33200f;--paper:#3a2414}
.vb2 :is(button,input){font-variant-ligatures:none}
.vb2-top{display:flex;align-items:center;gap:6px;padding:8px 10px 6px;background:var(--wood);color:var(--paper);border-bottom:3px solid var(--ink)}
html:not([data-theme="team-rocket"]) .vb2-top{color:#f6e3c0}
.vb2-ib{width:44px;height:44px;flex:none;display:grid;place-items:center;border-radius:10px;border:2px solid var(--ink);background:var(--wood2);color:#fff3d6;padding:0;box-shadow:inset 0 -3px 0 #0004}.vb2-ib svg{width:22px;height:22px}
.vb2-ttl{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.1;padding-left:4px}.vb2-ttl b{font:600 17px "Pixelify Sans",system-ui;color:#fff3d6}.vb2-ttl span{font:700 12px system-ui;color:#f2c48a;letter-spacing:.04em;text-transform:uppercase}
.vb2-prog{display:flex;gap:4px;padding:6px 10px;background:var(--wood);border-bottom:3px solid var(--ink)}
.vb2-prog button{flex:1;height:22px;padding:0;border:0;background:none;display:flex;align-items:center}.vb2-prog i{display:block;width:100%;height:12px;border:2px solid var(--ink);background:#2a1a10;border-radius:3px;position:relative;overflow:hidden}
.vb2-prog i::after{content:"";position:absolute;inset:0;background:linear-gradient(#ffd27a,var(--glow) 60%,var(--glow2));transform:scaleX(0);transform-origin:left}
.vb2-prog .done i::after,.vb2-prog .on i::after{transform:scaleX(1)}.vb2-prog .on i{box-shadow:0 0 0 2px #fff3d6}.vb2-prog .fill i::after{animation:vb2-fill .35s steps(8,end)}
@keyframes vb2-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.vb2 .vb-credit2{margin:8px 10px 0}
/* the workbench: only the ball on its dish, warm light from the top-left window, no room */
.vb2-bench.vb-stage{height:262px;margin:0;padding:22px 0 0;flex:none;background:#3a2112 url(/look/lab/bench.webp) center/cover;image-rendering:pixelated;border-bottom:3px solid var(--ink);overflow:hidden;touch-action:none}
.vb2-bench::before{content:"";position:absolute;inset:0;background:radial-gradient(240px 170px at 30% 18%,#ffd9a055,#0000 70%),radial-gradient(260px 120px at 50% 100%,#0006,#0000 70%);pointer-events:none}
html[data-theme="team-rocket"] .vb2-bench::before{background:radial-gradient(220px 160px at 30% 18%,#ffb36a40,#0000 70%),linear-gradient(#1a0f2a66,#0000 60%),radial-gradient(260px 120px at 50% 100%,#000a,#0000 70%)}
.vb2-dish{position:absolute;left:50%;top:150px;width:236px;margin-left:-118px;image-rendering:pixelated;pointer-events:none;z-index:1;filter:drop-shadow(0 6px 0 #0005)}
.vb2-spin{position:relative;z-index:2;will-change:transform}
.vb2 .vb-ball{position:relative}.vb2 .vb-ball canvas{position:absolute;left:0;top:0;image-rendering:pixelated;pointer-events:none}
.vb2 .vb-ball canvas.vb-ext{filter:drop-shadow(0 3px 0 #150e0766)}
.vb2 .vb2-prev{z-index:3}
.vb2 .vb-ball canvas[hidden],.vb2 .vb2-prev[hidden]{display:none} /* f268: canvas.vb-pb sets display:inline-block, which beat [hidden], so the old pour snapshot stayed on top (two ball types stacked) */
.vb2 .vb-bob{animation-duration:3.6s}
.vb2 .vb-size{bottom:8px;background:#150e07cc}
.vb2 .vb-hint{background:#ffd27a;box-shadow:0 3px 0 #a8641e}.vb2 .vb-hint:after{border-top-color:#ffd27a}
.vb2-panel{flex:1;padding:4px 12px 14px;overflow:visible}
.vb2 .vb-h3s{color:var(--mut);margin:12px 2px 7px}.vb2 .vb-cnt2{color:var(--glow2)}.vb2 .vb-small{color:var(--mut)}
.vb2-bot{position:sticky;bottom:0;display:flex;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:var(--wood);border-top:3px solid var(--ink);z-index:5}
.vb2-bot button{height:52px;border-radius:12px;border:2px solid var(--ink);font:600 18px "Pixelify Sans",system-ui;padding:0 18px}
.vb2-back{background:var(--wood2);color:#fff3d6;min-width:96px;box-shadow:inset 0 -3px 0 #0004}
.vb2-next{flex:1;background:linear-gradient(#ffd27a,var(--glow));color:var(--ink);box-shadow:inset 0 -4px 0 var(--glow2)}.vb2-next.save{background:linear-gradient(#ffe7a0,#ffc94a);box-shadow:inset 0 -4px 0 #c78a1e}
.vb2-next:disabled{opacity:.7}
/* tiles in the lab palette */
.vb2 :is(.vb-shapes,.vb-snds,.vb-lib,.vb-tools,.vb-placed) button,.vb2 .vb-parts button{background:var(--tile);border:2px solid var(--line);color:var(--txt)}
.vb2 :is(.vb-shapes,.vb-snds) button.on,.vb2 .vb-parts button.on,.vb2 .vb-chip3.on,.vb2 .vb-tools button.on{border-color:var(--ink);background:#ffd27a;color:var(--ink);box-shadow:0 0 0 2px var(--glow)}
.vb2 .vb-lib button{min-height:48px}.vb2 #vb-libL button{background:#3a2414;border-color:var(--ink)}
.vb2 .vb-lib.named button{color:var(--txt)}
html[data-theme="team-rocket"] .vb2 .vb-lib.named button{background:#3a2414}
.vb2 .vb-seg4{border-color:var(--line)}.vb2 .vb-seg4 button{color:var(--txt);min-height:44px}.vb2 .vb-seg4 button.on{background:#ffd27a;color:var(--ink)}
.vb2 .vb-pal button{border-color:var(--ink);height:44px}.vb2 .vb-pal button.on{border-color:#fff3d6;box-shadow:0 0 0 3px var(--glow)}
.vb2 .vb-sl-top{color:var(--txt)}.vb2 .vb-sl-top i{color:var(--glow2)}.vb2 .vb-sl input{accent-color:var(--glow);height:44px}.vb2 .vb-sl-ends{color:var(--mut)}
.vb2 .vb-hear{background:linear-gradient(#ffd27a,var(--glow));box-shadow:0 3px 0 var(--glow2);color:var(--ink)}.vb2 .vb-link{color:var(--glow2);min-height:44px}
.vb2 .vb-selhead{color:var(--txt)}.vb2 .vb-selhead span{color:var(--mut)}
.vb2 .vb-vname input{background:var(--tile);color:var(--txt);border:2px solid var(--line);min-height:48px}
.vb2 .vb-swg button{border-color:var(--ink)}.vb2 .vb-why{color:var(--mut)}
.vb2-shapes{grid-template-columns:repeat(5,1fr)}.vb2-shapes button{position:relative;min-height:80px}.vb2-shapes canvas{width:52px;height:52px}
.vb2-shapes button.sup{border-color:#c79a2a;background:linear-gradient(#232a4d,#1b1f3b);color:#ffe7a0}html[data-theme="team-rocket"] .vb2-shapes button.sup{background:linear-gradient(#232a4d,#1b1f3b);color:#ffe7a0}
.vb2-lk{position:absolute;right:3px;top:3px;width:18px;height:18px}.vb2-lk svg,.vb2-suph svg,.vb2-sheet h3 svg{width:16px;height:16px;image-rendering:pixelated;vertical-align:-2px}
.vb2-suph{display:flex;gap:6px;align-items:center;color:#a8741a!important}
.vb2-shapes button.lk canvas{opacity:.82}.vb2-shapes button.lk span{opacity:.85}
.vb2-parts button{min-height:60px}
/* f285 option 186: Ball type | Accent color tabs on the Ball type step */
.vb2-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:2px 0 8px}
.vb2 .vb2-tabs button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border-radius:12px;font:700 14px system-ui;background:var(--tile);border:2px solid var(--line);color:var(--txt);padding:0 6px}
.vb2 .vb2-tabs button.on{border-color:var(--ink);background:#ffd27a;color:var(--ink);box-shadow:0 0 0 2px var(--glow)}
.vb2 .vb2-tabs button.off{opacity:.45}.vb2 .vb2-tabs button.off .vb2-adot{background:#6b5a4a}
.vb2-tabs canvas{width:26px;height:26px;image-rendering:pixelated;flex:none}
.vb2-adot{width:18px;height:18px;border-radius:50%;border:2px solid #14121c;display:inline-block;flex:none}
.vb2 .vb2-noacc{text-align:center;margin:0 0 8px}.vb2 .vb2-acch{text-align:center}
/* f285 option 184: the ring with the shade tower beside it (the ring keeps its full size) */
.vb2-rw{display:flex;justify-content:center;align-items:center;gap:10px;margin:10px 0 0}.vb2-rw .vb2-ring{margin:0}
.vb2-tower{width:44px;height:min(250px,72vw);flex:none;touch-action:none;outline-offset:3px;border-radius:8px;cursor:pointer}
.vb2-tower canvas{width:44px;height:100%;display:block;image-rendering:pixelated}
@media (max-width:340px){.vb2-rw .vb2-ring{width:min(250px,64vw)}.vb2-tower{height:min(250px,64vw)}}
/* the color ring */
.vb2-ring{position:relative;width:min(250px,72vw);aspect-ratio:1;margin:10px auto 0;touch-action:none;border-radius:50%;outline-offset:4px}
.vb2-ring canvas{width:100%;height:100%;display:block}
.vb2-mid{position:absolute;inset:30%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;pointer-events:none}
.vb2-mid i{width:56px;height:56px;border-radius:50%;border:3px solid var(--ink);box-shadow:inset -6px -6px 0 #0003,inset 5px 5px 0 #fff5}.vb2-mid b{font:700 13px system-ui;color:var(--txt)}
.vb2-grp{margin:12px 0 8px}
/* f286 option 188: Home / Trades / Profile as live mini phones (site-preview.js) + the hard-to-read tip (gold border, never red) */
.vb-pv{margin:2px 0 4px}.vb-pv-hd{display:flex;align-items:center;justify-content:space-between}.vb-pv-hd .vb-h3s{margin-bottom:6px}
.vb-pv-live{display:inline-flex;align-items:center;gap:5px;font:700 11px "Pixelify Sans",system-ui;letter-spacing:.06em;text-transform:uppercase;color:var(--glow2)}
html[data-theme="team-rocket"] .vb-pv-live{color:#ffd84a}.vb-pv-live i{width:7px;height:7px;border-radius:50%;background:#3fbf6e;box-shadow:0 0 0 2px #3fbf6e44}
.vb-pv-track{display:flex;gap:14px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;margin:0 -12px;padding:2px 12px 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.vb-pv-track::-webkit-scrollbar{display:none}.vb-pv-track:focus-visible{outline:3px solid var(--glow);outline-offset:-3px;border-radius:12px}
.vb-pv-fig{margin:0;flex:none;scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer}
/* f287 option 202: the phone body is device-frame.js (the player's own phone shape: island / notch / home button / hole-punch / generic) */
.vb-pv-ph{position:relative;padding:2px}
.vb-pv-scr{overflow:hidden;background:#16161c}
.vb-pv-fig figcaption{font:700 13px "Pixelify Sans",system-ui;color:var(--mut)}.vb-pv-fig.on figcaption{color:var(--txt)}
.vb-pv-dots{display:flex;align-items:center;justify-content:center;gap:4px;margin:6px 0 0;font:12.5px system-ui;color:var(--mut)}
.vb-pv-dots button{width:26px;height:26px;padding:0;border:0;background:none;display:grid;place-items:center;cursor:pointer}
.vb-pv-dots button::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--line)}.vb-pv-dots button.on::before{background:var(--glow)}
html[data-theme="team-rocket"] .vb-pv-dots button.on::before{background:#ffd84a}.vb-pv-dots span{margin-left:4px}
.vb-hardtip{display:flex;gap:10px;align-items:center;margin:10px 0 2px;padding:10px;border-radius:12px;border:2px solid #ffd84a;background:var(--tile);color:var(--txt);font:13px/1.35 system-ui}
.vb-hardtip b{display:inline-flex;gap:6px;align-items:flex-start}.vb-hardtip .vb-hardm{margin-top:1px}
.vb-ht-smp{flex:none;width:76px;height:48px;border-radius:9px;display:grid;place-items:center;text-align:center;font:700 12px "Pixelify Sans",system-ui;border:2px solid #00000055}
.vb-ht-fix{display:block;margin-top:7px;padding:7px 11px;min-height:38px;border-radius:9px;border:2px solid var(--ink);background:linear-gradient(#ffe7a0,#ffc94a);color:#150e07;font:700 13px "Pixelify Sans",system-ui;box-shadow:inset 0 -3px 0 #c78a1e;cursor:pointer}
.vb-ht-none{display:block;margin-top:5px;color:var(--mut)}
.vb2 .vb-swg button.off{cursor:help}
.vb2-labnote{text-align:left;margin:6px 2px 0}
/* juice bits */
.bj-dust{position:absolute;z-index:6;pointer-events:none;image-rendering:pixelated;box-shadow:0 0 0 1px #150e0755}
.bj-conf{position:absolute;inset:0;width:100%;height:100%;z-index:7;pointer-events:none}
/* Supporter sheet */
.vb2-sheet{background:#f6e7c6;color:#2a180c}.vb2-sheet .vb-h3{color:#2a180c}.vb2-sheet p{color:#6b4a2c}
html[data-theme="team-rocket"] .vb2-sheet{background:#24150d;color:#f6e3c0}html[data-theme="team-rocket"] .vb2-sheet .vb-h3{color:#f6e3c0}html[data-theme="team-rocket"] .vb2-sheet p{color:#c9a67a}
.vb2-sheetball canvas{width:84px;height:84px;image-rendering:pixelated}.vb2-col{display:flex;flex-direction:column;gap:8px}.vb2-col .vb-btn{margin:0;background:linear-gradient(#ffd27a,#e59f56);box-shadow:0 3px 0 #c27845}
.vb2-gold{height:50px;border-radius:14px;border:2px solid #8a5a10;background:linear-gradient(#fff3b0,#ffcf3a);color:#3a2404;font:600 17px "Pixelify Sans",system-ui}
.vb2-col .vb-link{color:#c27845;min-height:44px}
/* f268: Supporter unlock sheet (warm cream, bottom sheet on phones) */
.vb2-unlock{position:fixed;left:0;right:0;bottom:0;max-width:440px;margin:0 auto;max-height:88vh;overflow:auto;z-index:1040;box-sizing:border-box;padding:18px 16px calc(14px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;background:#f6e7c6;color:#2a180c;border:3px solid #150e07;border-bottom:0;box-shadow:0 -12px 40px #0008;text-align:left;font:15px/1.4 system-ui,-apple-system,sans-serif;animation:vb2-up .22s cubic-bezier(.2,.9,.3,1.1)}
@keyframes vb2-up{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}@media (prefers-reduced-motion:reduce){.vb2-unlock{animation:none}}
.vb2-ulx{position:absolute;right:10px;top:10px;width:36px;height:36px;border:0;background:none;color:#6b4a2c;padding:6px}.vb2-ulx svg{width:100%;height:100%}
.vb2-ulhead{display:flex;gap:12px;align-items:center;padding-right:30px}.vb2-ulball{position:relative;flex:none;width:76px;height:76px;border-radius:16px;background:radial-gradient(circle at 50% 70%,#e7b874,#c98a4a);border:2px solid #8a5a10;display:grid;place-items:center}
.vb2-ulball canvas{width:72px;height:72px;image-rendering:pixelated}.vb2-ulball .vb2-lk{right:-6px;top:-6px;width:22px;height:22px}.vb2-ulball .vb2-lk svg{width:20px;height:20px}
.vb2-unlock .vb-h3{font:600 20px/1.2 "Pixelify Sans",system-ui;margin:0 0 4px;color:#2a180c}.vb2-unlock p{margin:0;color:#6b4a2c;font-size:14px}
.vb2-unlock h4{margin:12px 0 5px;font:700 13px system-ui;letter-spacing:.04em;text-transform:uppercase;color:#a8741a}
.vb2-perks{list-style:none;margin:0;padding:0;display:grid;gap:4px}.vb2-perks li{display:flex;gap:9px;align-items:center;padding:5px 9px;border-radius:10px;background:#fff7e4;border:2px solid #e2c48e;font-size:13.5px;line-height:1.28}
.vb2-perks .ic{flex:none;width:22px;text-align:center;font-size:16px}.vb2-perks .ic .xb{vertical-align:middle}
.vb2-ulfoot{position:sticky;bottom:calc(-14px - env(safe-area-inset-bottom));margin:12px -16px calc(-14px - env(safe-area-inset-bottom));padding:10px 16px calc(6px + env(safe-area-inset-bottom));background:#f6e7c6;border-top:2px solid #e2c48e;box-shadow:0 -8px 14px -10px #6b4a2c66}
html[data-theme="team-rocket"] .vb2-ulfoot{background:#24150d;border-color:#5a3a1e}
.vb2-ulgo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;height:auto;min-height:58px;margin:0;text-decoration:none;box-shadow:0 4px 0 #8a5a10;font-size:19px}.vb2-ulgo small{font:600 12.5px system-ui;opacity:.8}
.vb2-unlock,.vb2-unlock *{font-variant-ligatures:none;font-feature-settings:"liga" 0,"clig" 0} /* pixel font draws 'fi' (Ko-fi) as a broken ligature */
.vb2-unlock a.vb2-ulgo,html[data-theme] .vb2-unlock a.vb2-ulgo,html[data-vibe] .vb2-unlock a.vb2-ulgo{color:#3a2404!important}
.vb2-ulpay{text-align:center;margin:8px 0 0!important;font-size:12.5px!important}
.vb2-ulrow{display:flex;justify-content:space-between;align-items:center;margin-top:2px}.vb2-ulrow .vb-link{color:#a8641e;font-weight:700;min-height:44px;display:inline-flex;align-items:center;padding:0 6px;text-decoration:underline;background:none;border:0;font-size:15px}
html[data-theme="team-rocket"] .vb2-unlock{background:#24150d;color:#f6e3c0;border-color:#000}html[data-theme="team-rocket"] .vb2-unlock .vb-h3{color:#f6e3c0}html[data-theme="team-rocket"] .vb2-unlock p,html[data-theme="team-rocket"] .vb2-ulx{color:#d9b98c}
html[data-theme="team-rocket"] .vb2-unlock h4{color:#ffc94a}html[data-theme="team-rocket"] .vb2-perks li{background:#331e12;border-color:#5a3a1e;color:#f6e3c0}html[data-theme="team-rocket"] .vb2-ulrow .vb-link{color:#ffc94a}
/* ---- State B: your balls on the Sunset Lab table (look-pick.js) ---- */
.lookpick.lp-made .lp-scene,.lookpick.lp-made .lp-names,.lookpick:not(.lp-made) .lr-wrap{display:none}
.lr-room{position:relative;width:100%;border:3px solid #14121c;border-radius:12px;overflow:hidden;background:#2a1a12;-webkit-user-select:none;user-select:none}
.lr-bg{position:absolute;inset:0;width:100%;height:100%;display:block}
.lr-riser{position:absolute;z-index:1;background:linear-gradient(#a8662f 0 28%,#724120 28% 46%,#472917 46%);border:1px solid #150e07;border-radius:2px;box-shadow:0 2px 0 #0005}
.lr-ball{position:absolute;transform:translate(-50%,-50%);padding:0;border:0;background:none;aspect-ratio:89/76}
.lr-ball::before{content:"";position:absolute;inset:-60% -14% -20%}
.lr-ball .lr-dish{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}
.lr-ball .lr-sh{position:absolute;left:13.5%;top:47.4%;width:74.2%;height:102.6%;image-rendering:pixelated;pointer-events:none}
.lr-ball .lr-b{position:absolute;left:50%;top:16.4%;width:101.2%;aspect-ratio:1;transform:translate(-50%,-50%);image-rendering:pixelated;transition:translate .2s ease}
.lr-ball.on .lr-b{translate:0 -2px}
.lr-orig{position:absolute;transform:translate(-50%,-50%);padding:0;border:0;background:none;z-index:3;transition:translate .2s ease}.lr-orig img{width:100%;display:block;image-rendering:pixelated}.lr-orig.on{translate:0 -2px}.lr-orig::before{content:"";position:absolute;inset:-40%}
.lr-head{display:flex;justify-content:space-between;align-items:baseline;margin:10px 2px 6px;font:700 13px system-ui;letter-spacing:.03em;text-transform:uppercase;opacity:.85}
.lr-chips{display:flex;flex-wrap:wrap;gap:6px}
.lr-chip,.lr-new,.lr-drw{min-height:44px;display:inline-flex;align-items:center;gap:6px;padding:0 12px 0 6px;border-radius:12px;border:2px solid #c9a46d;background:#fbf1da;color:#2a180c;font:700 14px system-ui}
.lr-chip canvas{width:30px;height:30px;image-rendering:pixelated}.lr-chip.on{border-color:#150e07;background:#ffd27a;box-shadow:0 0 0 2px #e59f56}
.lr-new{padding:0 14px;border-style:dashed;border-color:#c27845;background:transparent;color:inherit;font:600 16px "Pixelify Sans",system-ui}
.lr-drw{padding:0 14px;background:#724120;border-color:#150e07;color:#fff3d6}
html[data-theme="team-rocket"] .lr-chip{background:#33200f;border-color:#5a3a22;color:#f6e3c0}html[data-theme="team-rocket"] .lr-chip.on{background:#ffd27a;color:#150e07}
.lr-pick .lr-pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:6px 0}.lr-pick .lr-pgrid button{min-height:76px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:12px;border:2px solid #ffffff30;background:#23232b;color:#eee;font:700 11.5px system-ui;padding:4px 2px}
.lr-pick .lr-pgrid button.on{border-color:#ffd27a;background:#3a2a14;box-shadow:0 0 0 2px #e59f56}.lr-pick canvas{width:44px;height:44px;image-rendering:pixelated}.lr-pcnt{font:700 14px system-ui;color:#ffd27a!important}
.lr-pick .vb-btn:disabled{opacity:.5}
@media (prefers-reduced-motion:reduce){.vb2 .vb-bob{animation:none}.vb2-prog .fill i::after{animation:none}}
.lr-art{position:absolute}
/* f269: ball name cap (16) live counter inside the name field */
.vb-vname{position:relative}.vb-vname input{padding-right:58px}.vb-ncount{position:absolute;right:12px;top:50%;transform:translateY(-50%);font:600 12px/1 system-ui,sans-serif;opacity:.65;pointer-events:none;font-variant-numeric:tabular-nums}.vb-ncount.full{opacity:1;color:#c78a1e}
/* f287 option 203: Match my ball = one big lit ball on a small pedestal; 'Pick a different color' reveals the tiles + a Match my ball button */
.vb-mb{margin:10px 0 2px;padding:12px 12px 10px;border-radius:16px;border:2px solid var(--ink);background:var(--tile);text-align:center}
.vb-mb-stage{position:relative;width:190px;height:170px;margin:0 auto}
.vb-mb-stage::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 50% 46% at 50% 46%,#ffffffd0,#e8fbf366 45%,transparent 72%)}
.vb-mb-beam{position:absolute;left:50%;top:-12px;width:140px;height:178px;transform:translateX(-50%);background:linear-gradient(#ffffffb0,#ffffff00);clip-path:polygon(36% 0,64% 0,100% 100%,0 100%);opacity:.7}
.vb-mb-ped{position:absolute;left:50%;bottom:8px;width:144px;height:28px;transform:translateX(-50%);border-radius:50%;background:linear-gradient(#ffffff,#d9e4e8);border:2.5px solid var(--ink);box-shadow:0 5px 0 #8fd8bd,0 7px 0 var(--ink)}
.vb-mb-ped::after{content:"";position:absolute;inset:6px 22px;border-radius:50%;border:2px solid #a8e6cf}
.vb-mb-ball{position:absolute;left:50%;bottom:6px;width:136px;height:136px;transform:translateX(-50%);image-rendering:pixelated;filter:drop-shadow(0 0 10px #ffffffaa)}
.vb-mb-t{margin:6px 0 0;font:700 20px/1.2 "Pixelify Sans",system-ui;color:var(--txt);text-shadow:2px 2px 0 #2a9d7855}
.vb-mb-s{margin:3px 0 0}
.vb-mb-link{display:inline-block;margin:10px auto 2px;padding:8px 6px;min-height:40px;border:0;background:none;color:var(--txt);font:700 15px "Pixelify Sans",system-ui;text-decoration:underline;text-decoration-color:#3fbf94;text-decoration-thickness:2px;text-underline-offset:4px;cursor:pointer}
.vb-mb-back{margin:10px 0 4px}
.vb-mb-use{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px 8px 8px;min-height:56px;border-radius:14px;border:2px solid var(--ink);background:var(--tile);color:var(--txt);text-align:left;cursor:pointer;box-shadow:0 3px 0 var(--ink)}
.vb-mb-use canvas.vb-pb{width:42px;height:42px;margin:0;flex:none;image-rendering:pixelated}.vb-mb-use b{display:block;font:700 15px "Pixelify Sans",system-ui}.vb-mb-use small{font:12px system-ui;color:var(--mut)}
.vb-mb-go{margin-left:auto;flex:none;padding:7px 10px;border-radius:10px;border:2px solid var(--ink);background:linear-gradient(#d4f6e8,#9fe5c7);color:#14261f;font:700 13px "Pixelify Sans",system-ui}
/* ---- f288 the ball maker in Will's white lab workshop (option 193): white / very light grey panels, mint pipe accents, slate ink, the site pixel font
   with crisp drop shadows. The Sunset Lab room + saved balls keep their warm look; only the maker (.vb2) is restyled. ---- */
.vb-maker:has(.vb2){background:#e9f0f1}
.vb2,html[data-theme="team-rocket"] .vb2{--ink:#23343c;--wood:#ffffff;--wood2:#eef3f4;--glow:#5cc9a4;--glow2:#2f9c79;--paper:#f4f8f9;--card:#f4f8f9;--txt:#1f2d33;--mut:#566b72;--line:#cfe1dc;--tile:#ffffff;color-scheme:light}
.vb2-top,html:not([data-theme="team-rocket"]) .vb2-top{background:#fff;color:var(--txt);border-bottom:0}
.vb2-ib{background:#fff;color:var(--ink);border-color:var(--ink);box-shadow:inset 0 -3px 0 #23343c22}
.vb2-ib.vb2-snd svg{width:22px;height:22px;image-rendering:pixelated}.vb2-ib.vb2-snd.muted{background:#eef3f4}
.vb2-ttl b{font:700 20px "Pixelify Sans",system-ui;color:#1f2d33;text-shadow:2px 2px 0 #a6e8d1}
.vb2-ttl span{font:700 15px "Pixelify Sans",system-ui;letter-spacing:.06em;color:#2f9c79;text-shadow:1px 1px 0 #10302a40}
.vb2-prog{background:#fff;border-bottom:4px solid #8fd3bd;box-shadow:0 1px 0 #5aa98f;padding:6px 10px 4px}
.vb2-prog button{flex-direction:column;height:auto;gap:3px}
.vb2-prog em{font:700 11px/1 "Pixelify Sans",system-ui;font-style:normal;color:#566b72;white-space:nowrap}.vb2-prog .on em{color:#10302a}
.vb2-prog i{background:#e3ecee;border-color:var(--ink)}
.vb2-prog i::after{background:linear-gradient(#b6f5de,var(--glow) 60%,var(--glow2))}
.vb2-prog .on i{box-shadow:0 0 0 2px #5cc9a4}
/* the bench: the 193 sprite sheet on a canvas at art size, 3x, pixelated, centred (pedestal axis = the middle of the stage) */
.vb2-bench.vb-stage{height:262px;padding:0;display:block;background:#eef4f6;border-bottom:4px solid #8fd3bd;box-shadow:0 1px 0 #5aa98f;overflow:hidden}
.vb2-bench::before,html[data-theme="team-rocket"] .vb2-bench::before{display:none}
.vb2-room{position:absolute;left:50%;top:-30px;width:684px;height:368px;margin-left:-342px;image-rendering:pixelated;pointer-events:none;z-index:0}
.vb2 .vb2-spin{position:absolute;left:50%;top:26px;width:200px;height:200px;margin-left:-100px}
.vb2 .vb-bob,html .vb2 .vb-bob{animation:none}
.vb2 .vb-ball canvas.vb-ext{filter:none}
.vb2 :is(.vb-shapes,.vb-snds) button.on,.vb2 .vb-parts button.on,.vb2 .vb-chip3.on,.vb2 .vb-tools button.on,.vb2 .vb2-tabs button.on{background:#d6f5ea;border-color:var(--ink);color:var(--ink);box-shadow:0 0 0 2px #5cc9a4}
.vb2 .vb-parts button,.vb2 .vb2-tabs button,.vb2 :is(.vb-shapes,.vb-snds) button{box-shadow:0 2px 0 #cfe1dc}
.vb2 .vb-parts i{border-color:#23343c}
.vb2 .vb-parts button,.vb2 .vb2-shapes button span{font:700 16px/1.1 "Pixelify Sans",system-ui;color:#1f2d33;text-shadow:1px 1px 0 #cfe9e0}
.vb2 .vb-parts button{font-size:15px;white-space:nowrap;letter-spacing:-.01em}.vb2 .vb-parts button.on{text-shadow:2px 2px 0 #fff;color:#10302a}
.vb2-ring::before{content:"";position:absolute;inset:22.7%;border-radius:50%;background:radial-gradient(circle at 40% 35%,#ffffff,#e8f1f2);border:3px solid #23343c;box-sizing:border-box}
.vb2-mid{z-index:1;inset:22.7%;gap:0}
.vb2-mid i{width:86%;height:86%;border-width:4px;box-shadow:inset -12px -12px 0 #0002,inset 9px 9px 0 #fff6}
.vb2-mid b{position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);white-space:nowrap;padding:3px 12px 4px;border-radius:9px;background:#fff;border:3px solid #23343c;box-shadow:0 3px 0 #23343c;font:700 17px/1 "Pixelify Sans",system-ui;color:#1f2d33;text-shadow:1px 1px 0 #a6e8d1}
.vb2-tower{background:#23343c;border-radius:10px;box-shadow:0 0 0 3px #8fd3bd}
.vb2-rw{gap:12px;margin:14px 0 4px}.vb2-ring,.vb2-rw .vb2-ring{width:min(296px,74vw)}.vb2-tower{height:min(296px,74vw)}
.vb2[data-step="color"] .vb2-panel .vb-small{display:none}
.vb2-bot{background:#fff;border-top:4px solid #8fd3bd;box-shadow:0 -1px 0 #5aa98f}
.vb2-back{background:#eef3f4;color:var(--ink);border-color:var(--ink);box-shadow:inset 0 -3px 0 #23343c22;text-shadow:1px 1px 0 #ffffff99}
.vb2-next{background:linear-gradient(#b6f5de,#5cc9a4);color:#10302a;border-color:var(--ink);box-shadow:inset 0 -4px 0 #2f9c79;text-shadow:1px 1px 0 #ffffff99}
.vb2-next.save{background:linear-gradient(#b6f5de,#5cc9a4);box-shadow:inset 0 -4px 0 #2f9c79}
.vb2 .vb2-next.gold{background:linear-gradient(#fff1b0,#f2c440 55%,#e0a417);color:#3b2a00;box-shadow:inset 0 -4px 0 #b9800c;text-shadow:1px 1px 0 #fff4c4}
.vb2 .vb-small,.vb2 .vb-h3s{color:var(--mut)}
.vb2-shapes button.sup{border-color:#c79a2a;background:linear-gradient(160deg,#1b1f3b 0%,#232a4d 40%,#2e3766 48%,#232a4d 56%,#1b1f3b 100%);color:#ffe7a0;box-shadow:0 2px 0 #e2c46a} /* f794b: Supporter shapes = navy with a gold sheen edge, gold text (no text on yellow) */
html[data-theme="team-rocket"] .vb2-shapes button.sup{background:linear-gradient(160deg,#1b1f3b 0%,#232a4d 40%,#2e3766 48%,#232a4d 56%,#1b1f3b 100%);color:#ffe7a0}
.vb2 .vb2-shapes button.sup span{color:#ffe7a0;text-shadow:1px 1px 0 #0b0e1f}
.vb2 .vb-seg4 button.on{background:#d6f5ea;color:var(--ink)}
.vb2 .vb-hear{background:linear-gradient(#b6f5de,#5cc9a4);box-shadow:0 3px 0 #2f9c79;color:#10302a}
/* f288 Accent & Type (option 220): type grid in the middle (3 rows, sideways), the accent rainbow bar always at the bottom */
.vb2[data-step="body"] .vb2-panel{padding:8px 12px 10px}
.vb3-th{margin:0 0 4px;text-align:center;font:700 13px "Pixelify Sans",system-ui;letter-spacing:.06em;text-transform:uppercase;color:#2f9c79;text-shadow:1px 1px 0 #10302a30}
.vb3-gw{position:relative;margin-right:-12px}
.vb2 .vb3-grid{display:grid;grid-auto-flow:column;grid-template-rows:repeat(3,auto);grid-template-columns:none;grid-auto-columns:54px;gap:5px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;padding:3px 12px 4px 1px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.vb3-grid::-webkit-scrollbar{display:none}
.vb2 .vb3-grid button{min-height:74px;padding:3px 1px;gap:0;justify-content:flex-start;scroll-snap-align:start}
.vb2 .vb3-grid canvas.vb-pb{width:44px;height:44px;margin:-3px 0;image-rendering:pixelated}
.vb2 .vb3-grid button span{font-size:10.5px;line-height:1.02;letter-spacing:-.01em}
.vb3-grid .vb2-lk{right:1px;top:1px;transform:scale(.85)}
.vb2 .vb3-grid button.sup.tap{border-color:#23343c;box-shadow:0 0 0 3px #f2b62a,0 0 14px #f2b62a99}
.vb3-acc{margin-top:8px;position:relative}
.vb3-ah{display:flex;align-items:center;gap:8px;margin:0 2px 6px}.vb3-ah b{font:700 13px "Pixelify Sans",system-ui;letter-spacing:.06em;text-transform:uppercase;color:#2f9c79;text-shadow:1px 1px 0 #10302a30}
.vb3-adot{width:16px;height:16px;border-radius:50%;border:2px solid #23343c;display:inline-block;flex:none}
.vb3-nai{width:20px;height:20px;border-radius:50%;border:3px solid #566b72;position:relative;margin-left:auto;box-sizing:border-box}.vb3-nai::after{content:"";position:absolute;left:50%;top:-2px;bottom:-2px;width:3px;background:#566b72;transform:translateX(-50%) rotate(45deg)}
.vb3-acc.off .vb3-pk{opacity:.32;filter:grayscale(1)}.vb3-acc.off .vb3-adot{opacity:.3}
.vb3-sup{position:absolute;z-index:4}
.vb3-suplk{left:calc(50% + 69px);top:50px;width:34px;height:34px;border-radius:50%;background:linear-gradient(#ffe48a,#e6a91f);border:3px solid #23343c;display:grid;place-items:center;box-shadow:0 3px 0 #23343c}
.vb3-suplk svg{width:20px;height:20px;image-rendering:pixelated}
.vb3-supban{left:50%;bottom:10px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:5px 14px 6px 8px;border-radius:12px;background:#fffbe8;border:3px solid #23343c;box-shadow:0 3px 0 #23343c,0 0 0 2px #f2b62a inset;white-space:nowrap;pointer-events:none}
.vb3-supban .pin :is(img,canvas,svg){width:26px;height:26px;image-rendering:pixelated}
.vb3-supban b{display:block;font:700 15px/1.05 "Pixelify Sans",system-ui;color:#5a3d00;text-shadow:1px 1px 0 #ffe27a}.vb3-supban small{display:block;font:700 11.5px/1.1 "Pixelify Sans",system-ui;color:#566b72}
/* f288 the rainbow bar picker (rainbow-pick.js): chunky pixel bars, a thumb that follows the finger, a pixel magnifier while dragging */
.rp{position:relative;padding:0 2px;-webkit-user-select:none;user-select:none}
.rp-hue,.rp-lt{position:relative;border:3px solid #23343c;box-shadow:0 0 0 3px #8fd3bd;touch-action:none;cursor:pointer;outline-offset:5px}
.rp-hue{height:40px;border-radius:10px}.rp-lt{height:26px;margin-top:14px;border-radius:9px}
.rp-hue canvas,.rp-lt canvas{display:block;width:100%;height:100%;border-radius:7px;image-rendering:pixelated}
.rp-kn{position:absolute;top:50%;width:22px;height:calc(100% + 14px);transform:translate(-50%,-50%);border:3px solid #fff;outline:3px solid #23343c;border-radius:7px;box-shadow:0 0 10px 3px #5cc9a4,0 3px 0 #23343c;pointer-events:none;box-sizing:border-box}
.rp-kn.rp-glide{transition:left 90ms steps(3,end)}
.rp-drag .rp-hue .rp-kn{transform:translate(-50%,-50%) scale(1.08)}
.rp-hard .rp-hue .rp-kn,.rp-hard .rp-lt .rp-kn{box-shadow:0 0 0 3px #f2c440,0 0 10px 3px #f2c44099,0 3px 0 #23343c}
.rp-none .rp-hue .rp-kn{background:#fff!important}.rp-none .rp-lt{opacity:.35}
.rp-off .rp-hue,.rp-off .rp-lt{pointer-events:none;cursor:default}
.rp-snap{display:flex;align-items:center;gap:8px;justify-content:flex-end;min-height:22px;margin-top:10px;font:700 12.5px "Pixelify Sans",system-ui;color:#566b72}
.rp-sw{width:22px;height:22px;border-radius:6px;border:2px solid #23343c;box-shadow:0 0 0 2px #5cc9a4;box-sizing:border-box}
.rp-none .rp-sw{border-style:dashed;box-shadow:none}
.rp-mag{position:absolute;bottom:calc(100% - 46px);width:92px;height:118px;transform:translateX(-50%);z-index:6;pointer-events:none}
.rp-mag canvas{display:block;width:92px;height:92px;border-radius:50%;border:4px solid #23343c;box-shadow:0 0 0 3px #fff,0 6px 12px #0004;box-sizing:border-box;image-rendering:pixelated}
.rp-ctr{position:absolute;left:50%;top:46px;width:20px;height:20px;transform:translate(-50%,-50%);border:3px solid #fff;outline:3px solid #23343c}
.rp-mag::after{content:"";position:absolute;left:50%;top:92px;width:6px;height:26px;margin-left:-3px;background:#23343c;border-radius:0 0 3px 3px}
/* f288 Name step (option 222b): the same rainbow bar for the Main color and the Background */
.vb2 .vb-mb-use.on{background:#d6f5ea;box-shadow:0 0 0 2px #5cc9a4,0 3px 0 var(--ink)}
.vb3-sw2{display:grid;grid-template-columns:1fr 1fr;margin:8px 0 10px;border:2px solid var(--ink);border-radius:12px;overflow:hidden;background:#fff}
.vb3-sw2 button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:0;background:#fff;color:#1f2d33;font:700 15px "Pixelify Sans",system-ui;padding:0 8px}
.vb3-sw2 button+button{border-left:2px solid var(--ink)}
.vb3-sw2 button.on{background:#d6f5ea;color:#10302a;text-shadow:2px 2px 0 #fff;box-shadow:inset 0 -3px 0 #5cc9a4}
.vb3-sw2 i{width:16px;height:16px;border-radius:4px;border:2px solid #23343c;flex:none}
.vb3-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 2px 8px;min-height:30px}
.vb3-row b{font:700 13px "Pixelify Sans",system-ui;letter-spacing:.06em;text-transform:uppercase;color:#2f9c79}.vb3-row em{font:12.5px system-ui;font-style:normal;color:var(--mut)}
.vb3-none{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 10px;border-radius:9px;border:2px solid var(--ink);background:#fff;color:#1f2d33;font:700 13px "Pixelify Sans",system-ui}
.vb3-none s{width:14px;height:14px;border-radius:50%;border:2px solid #566b72;position:relative;box-sizing:border-box}.vb3-none s::after{content:"";position:absolute;left:50%;top:-2px;bottom:-2px;width:2px;background:#566b72;transform:translateX(-50%) rotate(45deg)}
.vb3-none.on{background:#d6f5ea;box-shadow:0 0 0 2px #5cc9a4}
.vb2[data-step="finish"] .rp-mag{bottom:calc(100% - 46px)}
/* ---- f289 "Choose your vibe" = Will's option 223 (look-pick.js + lab-room.js): the whole Sunset Lab painting, full screen, no words until a tap ---- */
.lr7{position:fixed;inset:0;z-index:900;overflow:hidden;background:#030201;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;font-variant-ligatures:none}
.lr7-blur{position:absolute;inset:-40px;background-size:cover;background-position:62% 50%;filter:blur(22px) brightness(.42) saturate(1.1);display:none}.lr7.lr7-wide .lr7-blur{display:block}
/* f363: tall screens (iPhone / iPad portrait): no stretched edge rows any more. A blurred, darkened copy of the room (scaled evenly) glows
   out from behind the painting and fades into the painting's own sampled edge colour (lab-room.js sets the .lr7 gradient); the painting's top
   and bottom edges melt into it. No streaks on any browser (iOS ignores canvas ctx.filter, which the old fill needed). */
.lr7.lr7-tall .lr7-blur{display:block;inset:auto;filter:blur(18px) brightness(.4) saturate(1.05);background-position:50% 50%;-webkit-mask-image:linear-gradient(transparent 0,#000 30%,#000 70%,transparent 100%);mask-image:linear-gradient(transparent 0,#000 30%,#000 70%,transparent 100%)}
.lr7.lr7-tall .lr7-room{-webkit-mask-image:linear-gradient(transparent 0,#000 6%,#000 93%,transparent 100%);mask-image:linear-gradient(transparent 0,#000 6%,#000 93%,transparent 100%)}
.lr7-room{position:absolute;-webkit-mask-image:linear-gradient(transparent 0,#000 7%,#000 92%,transparent 100%);mask-image:linear-gradient(transparent 0,#000 7%,#000 92%,transparent 100%)}
.lr7.lr7-wide .lr7-room{-webkit-mask-image:linear-gradient(transparent 0,#000 7%,#000 92%,transparent 100%),linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(transparent 0,#000 7%,#000 92%,transparent 100%),linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);mask-composite:intersect}
.lr7-room img,.lr7-room canvas,.lr7-room video,.lr7-clk,.lr7-bsh{image-rendering:pixelated}
/* f293 glitch fix 4: on a phone the painting is SHRUNK (0.67 device px per painting px at 390 @2x, 0.74 at 430): nearest-neighbour drops a third of
   the rows/columns and anything that moves (loop, clouds, clock hand, motes) crawls. lab-room.js sets .lr7-shrink then: smooth scaling for the
   painting layers only; the balls (canvases + starter sprites) and the pill icons stay pixelated */
.lr7-shrink .lr7-room img,.lr7-shrink .lr7-room video,.lr7-shrink .lr7-clk,.lr7-shrink .lr7-bsh,.lr7-shrink .lr7-room .qr-sky img,.lr7-shrink .lr7-room .qr-sky i{image-rendering:auto}
.lr7-shrink .lr7-room img.lr7-b{image-rendering:pixelated}
.lr7-still{position:absolute;inset:0;width:100%;height:100%;display:block}.lr7-vid{position:absolute;object-fit:fill;pointer-events:none}
.lr7-o,.lr7-set>*{position:absolute;pointer-events:none}.lr7-set{position:absolute;inset:0}.lr7-set img{display:block;max-width:none}
.lr7-room .lr7-sky i{animation-timing-function:linear}
.lr7-room .lr7-sky{overflow:hidden;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.lr7-bird{position:absolute;display:none;width:1.6502%;height:1.8634%;opacity:.6}.lr7-bird svg{display:block;width:100%;height:100%;shape-rendering:crispEdges}
/* the window light breathing: x1.03 at most (colour-dodge by rgb 8 = brightness 1.032), masked to the window and its beams */
.lr7-breathe{left:0;top:0;width:100%;height:100%;opacity:0;background:#080808;mix-blend-mode:color-dodge;-webkit-mask-image:radial-gradient(30% 38% at 52% 38%,#000 0,#0008 55%,transparent 100%);mask-image:radial-gradient(30% 38% at 52% 38%,#000 0,#0008 55%,transparent 100%)}
.lr7-clk{background-size:1000% 600%;background-repeat:no-repeat;background-position:0 0}
.lr7-gl{background:#fff4dc;opacity:0}.lr7-mote{width:.1712%;height:.2545%;background:#fff3d0;opacity:0}
/* balls: a still lift (4 room px up, 5% brighter), no hop. f293 glitch fix 2: ONE copy that steps up in whole device px (--lpx from lab-room.js,
   3 device px on a 2x phone), no two-copy opacity crossfade (it went see-through and doubled mid-way); soft no-dither shadows */
.lr7-bsh{background:url(/look/lab/v7/ballshadow.png?v=289) 0 0/100% 100% no-repeat;transition:opacity .25s linear}
.lr7-shf{opacity:0;transition:opacity .25s linear}.lr7-shf.on{opacity:1}
.lr7-ped{z-index:3}.lr7-ped>*{position:absolute}.lr7-ped .lr7-dish{inset:0;width:100%;height:100%}.lr7-ped .lr7-bsh{left:0;top:0;width:100%;height:144.74%}
.lr7-ped .lr7-b{left:50%;top:16.4%;width:101.2%;aspect-ratio:1;transform:translate(-50%,-50%);transition:transform .25s steps(3,end),filter .25s linear}
.lr7-ped.on .lr7-b{transform:translate(-50%,calc(-50% - var(--lpx,1.5px)));filter:brightness(1.05)}.lr7-ped.on .lr7-bsh{opacity:.75}
/* f293: a starter (State A) on the same big dish as a custom ball: its 32 px art is just the disc, drawn as big as the 40 px disc of the 56 px lit canvas */
.lr7-ped .lr7-b.lr7-st{width:72.29%}
.lr7-plus{left:37.64%;top:27.63%;width:24.72%;height:15.79%}.lr7-plus svg{display:block;width:100%;height:100%}
.lr7-set .lr7-tap{pointer-events:auto;z-index:8;transform:translate(-50%,-50%);background:transparent;border:0;padding:0;margin:0;border-radius:10px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.lr7-set .lr7-egg{pointer-events:auto}
.lr7-tap:focus-visible{outline:2px solid #ffe6b0aa;outline-offset:2px}.lr7-tap:focus:not(:focus-visible){outline:none}
/* the X and the 214 pill */
.lr7-top{position:absolute;left:0;right:0;top:0;padding:max(12px,env(safe-area-inset-top)) 14px 0;pointer-events:none}
.lr7-x{pointer-events:auto;width:40px;height:40px;margin-top:2px;border-radius:12px;background:#ffffffee;border:2.5px solid #23343c;box-shadow:inset 0 -3px 0 #23343c22,0 3px 0 #00000055;display:grid;place-items:center;color:#23343c;padding:0;cursor:pointer}
/* f293 glitch fix 3: the room stays dark (content hidden) until the balls, the still and the fill are ready, then fades in once */
.lr7>*{transition:opacity .25s linear}.lr7.lr7-wait>*{opacity:0;visibility:hidden}
.lr7-bot{position:absolute;left:0;right:0;bottom:calc(40px + env(safe-area-inset-bottom));display:flex;justify-content:center;pointer-events:none}
.lr7-row{display:flex;gap:8px;align-items:center;opacity:0;transition:opacity .3s linear;visibility:hidden}.lr7-row.show{opacity:1;visibility:visible;pointer-events:auto}
.lr7-pill{height:36px;border:1px solid rgba(255,240,210,.3);background:rgba(18,10,6,.6);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff1d6;cursor:pointer;transition:background-color .2s linear}
.lr7-pill{padding:0 16px 0 14px;border-radius:18px;display:inline-flex;align-items:center;gap:8px;font:400 16px/1 "Pixelify Sans",system-ui,sans-serif;letter-spacing:.04em;-webkit-font-smoothing:none;text-shadow:1px 1px 0 #120a06;white-space:nowrap;max-width:calc(100vw - 90px)}
.lr7-pill b{font:inherit;font-weight:400;overflow:hidden;text-overflow:ellipsis}
.lr7-ico{display:block;width:20px;height:20px;margin-left:-6px;flex:none}.lr7-ico>*{display:block;width:20px;height:20px;image-rendering:pixelated}
.lr7-pill.press,.lr7-pill:active{background:rgba(6,3,2,.82)}
.lr7-pill:focus-visible,.lr7-x:focus-visible{outline:2px solid #ffe6b0;outline-offset:3px}
@media (prefers-reduced-motion:reduce){.lr7 *{transition:none!important}.lr7-vid,.lr7-sky{display:none}}
.lr7-actw .vb-confirm{text-align:center}.lr7-actw .lp-acts{margin:0}.lr7-set .lr7-tap{-webkit-touch-callout:none;touch-action:manipulation}
/* ---- f290 option 224: the vibe name is required + the name dice (vibes.js / vibe-name.js) ---- */
.vb-vname{display:flex;gap:8px;align-items:stretch}.vb-nin{position:relative;flex:1;min-width:0}
.vb2 .vb-vname{margin:6px 0 18px}.vb2 .vb-vname .vb-nin input,.vb-vname .vb-nin input{margin:0;display:block}
.vb-vname .vb-ndice{width:52px;height:auto;min-height:44px;align-self:stretch}.vb-vname .vb-ndice:active{transform:translateY(2px);box-shadow:inset 0 -1px 0 #23343c22}
.vb2 .vb-vname.ask input,.vb-vname.ask input{border-color:#e0a417;box-shadow:0 0 0 3px #f2c44055;outline:none}
/* f298 (Will's option 232, 'a quick button to clear your ball and start from scratch or undo the last change' + 'the ball should be centered more'):
   the room art 4x (was 3x, whole pixels) pulled up, the ball 200 px (Z 10) centred on the stage, less pedestal; a tall add-on (antenna, halo)
   lowers both 18 px so its tip stays on the stage. Header: Undo | Clear | Dice with tiny Pixelify labels; the speaker is a small faint button
   in the stage corner. Undo is flat grey + dashed when there is nothing to undo. Clear: a dim scrim + a small "Start over?" bubble (gold, never warning colours). */
.vb2{position:relative}
.vb2-ttl b{white-space:nowrap;overflow:hidden}
.vb2.vb2-tall .vb2-room{top:-12px}.vb2.vb2-tall .vb2-spin{top:44px}.vb2.vb2-tall .vb3-suplk{top:68px}
.vb2-top .vb2-lb{width:52px;height:50px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:2px 0 0;border-radius:10px;
  font:400 11px/1 "Pixelify Sans",system-ui,sans-serif;letter-spacing:0;color:var(--ink);white-space:nowrap;overflow:hidden;min-height:0;-webkit-font-smoothing:none;font-variant-ligatures:none}
.vb2-top .vb2-lb svg{width:22px;height:22px;flex:none;image-rendering:pixelated}.vb2-top .vb2-lb.vb-randb svg{width:20px;height:20px}
.vb2-top .vb2-lb span{display:block;max-width:48px;text-shadow:none}
.vb2-top .vb2-lb.off{background:#f3f6f7;border:2px dashed #b9c4c8;color:#a9b5ba;box-shadow:none;cursor:default}.vb2-top .vb2-lb.off svg{opacity:.5}
.vb2-top .vb2-lb.on{border-color:#a8801a;box-shadow:0 0 0 3px #f5d76e}
.vb2-ssnd{position:absolute;right:10px;top:10px;z-index:6;width:38px;height:38px;border-radius:10px;border:2px solid #23343c55;background:#ffffffb3;color:#23343c;display:grid;place-items:center;padding:0;box-shadow:none}
.vb2-ssnd::after{content:"";position:absolute;inset:-5px}.vb2-ssnd svg{width:20px;height:20px;image-rendering:pixelated}.vb2-ssnd.muted{background:#eef3f4b3;color:#566b72}
.vb2-scrim{position:absolute;inset:0;z-index:29;background:#1f2d3333}
.vb2-ask{position:absolute;z-index:30;min-width:214px;max-width:calc(100% - 16px);background:#fff;border:2px solid var(--ink);border-radius:12px;padding:12px;box-shadow:0 4px 0 #1f2d3333;text-align:center}
.vb2-ask::before{content:"";position:absolute;top:-8px;right:var(--cx,26px);width:12px;height:12px;background:#fff;border-left:2px solid var(--ink);border-top:2px solid var(--ink);transform:rotate(45deg)}
.vb2-askq{display:flex;align-items:center;justify-content:center;gap:8px;margin:2px 0 12px;font:400 17px/1.15 "Pixelify Sans",system-ui,sans-serif;color:var(--ink);font-variant-ligatures:none}
.vb2-askq svg{width:32px;height:32px;flex:none;image-rendering:pixelated}
.vb2-askrow{display:flex;gap:8px}.vb2-askrow button{flex:1;min-width:84px;height:44px;padding:0 10px;border-radius:10px;border:2px solid var(--ink);font:400 16px/1 "Pixelify Sans",system-ui,sans-serif;color:var(--ink);background:#eef3f4;box-shadow:inset 0 -3px 0 #23343c22;white-space:nowrap}
.vb2-askrow .gold{background:linear-gradient(#ffe9a3,#f5c542);box-shadow:inset 0 -3px 0 #c9a227}
/* f330 (Will's son, Oct 20 2026): Gloss / Matte / Shiny per part, the 'Now coloring' part flash, and the one-screen Sound step */
.vb2-fin{display:flex;gap:6px;margin:8px 0 0}
.vb2-fin button{flex:1;display:flex;align-items:center;justify-content:center;gap:4px;min-height:44px;padding:0 4px;border-radius:12px;border:2px solid var(--line);background:var(--tile);color:var(--txt);box-shadow:0 2px 0 #cfe1dc;font:400 15px/1 "Pixelify Sans",system-ui,sans-serif;font-variant-ligatures:none;white-space:nowrap;min-width:0;letter-spacing:-.02em}
@media (max-width:380px){.vb2-fin button{font-size:13.5px}.vb2-fin svg{width:20px;height:20px}}
.vb2-fin button span{overflow:hidden;text-overflow:ellipsis}
.vb2-fin svg{width:24px;height:24px;flex:none;image-rendering:pixelated}
.vb2-fin button.on{border-color:var(--ink);background:#1b1f3b;color:#fff;box-shadow:0 0 0 2px #f5c542} /* f794b: was dark text on a yellow chip */
.vb2-fin button[data-fin="2"].on{background:linear-gradient(100deg,#ffe3f4,#e4f7ff 45%,#efe8ff 75%,#fff6d2)}
/* f715b: Shiny's holo pattern chips (shown only while Shiny is picked); selected = ink border + cool pearl, never yellow */
.vb2-holo{margin:8px 0 0}.vb2-holo>b{display:block;font:400 13px/1.2 "Pixelify Sans",system-ui,sans-serif;color:var(--txt);opacity:.8;margin:0 0 4px 2px}
.vb2-holo>b em{display:none}
.vb2-hscr{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 2px 4px}.vb2-hscr::-webkit-scrollbar{display:none}
.vb2-holo button{flex:1 0 62px;display:flex;flex-direction:column;align-items:center;gap:2px;min-height:44px;padding:4px 2px;border-radius:12px;border:2px solid var(--line);background:var(--tile);color:var(--txt);box-shadow:0 2px 0 #cfe1dc;font:400 12px/1.15 "Pixelify Sans",system-ui,sans-serif;cursor:pointer}
.vb2-holo canvas{width:34px;height:34px;image-rendering:pixelated}
.vb2-holo button span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vb2-holo button.on{border-color:var(--ink);background:linear-gradient(120deg,#f4f0ff,#e8f6ff 55%,#f7eefc);color:var(--ink,#14121c);box-shadow:0 0 0 2px #b9a8ff}
.vb2-holo.cmp{display:flex;align-items:center;gap:6px}.vb2-holo.cmp>b{margin:0;flex:0 1 auto;max-width:30%;min-width:0;overflow:hidden;text-overflow:ellipsis}.vb2-holo.cmp>b em{display:block;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vb2-holo.cmp .vb2-hscr{flex:1;min-width:0}.vb2-holo.cmp button{flex:1 0 40px;min-height:40px;padding:2px}.vb2-holo.cmp button span{display:none}.vb2-holo.cmp canvas{width:30px;height:30px}
.vb2[data-step="color"] .vb2-rw{margin-top:8px}
.vb2[data-step="color"] .vb2-ring,.vb2[data-step="color"] .vb2-rw .vb2-ring{width:min(250px,66vw)}.vb2[data-step="color"] .vb2-tower{height:min(250px,66vw)}
.vb2 .vb-ball canvas.vb2-pfx{z-index:3;opacity:0;filter:drop-shadow(0 0 3px #ffd84a) drop-shadow(0 0 6px #fff3b0)}
.vb2 .vb-ball canvas.vb2-pfx.on{opacity:1}
.vb2 .vb-ball canvas.vb2-pfx.sel{filter:none} /* f715: the part flash is an outline only; no glow spills onto the part, so its colour never changes */
.vb2-now{position:absolute;left:50%;top:8px;z-index:7;transform:translateX(-50%) scale(.6);opacity:0;pointer-events:none;white-space:nowrap;max-width:calc(100% - 64px);overflow:hidden;text-overflow:ellipsis;padding:5px 12px 6px;border-radius:10px;background:#fffbe8;border:3px solid #23343c;box-shadow:0 3px 0 #23343c,0 0 0 2px #f5c542 inset;font:400 15px/1.1 "Pixelify Sans",system-ui,sans-serif;color:#3a2a00;font-variant-ligatures:none}
.vb2-now b{font-weight:400;text-transform:uppercase;color:#7a5200;letter-spacing:.02em}
.vb2-now.on{animation:vb2-now 1.5s steps(10,end) forwards}
.vb2-now.on.still{animation:none;opacity:1;transform:translateX(-50%)}
@keyframes vb2-now{0%{opacity:0;transform:translateX(-50%) scale(.6)}10%{opacity:1;transform:translateX(-50%) scale(1.12)}18%{transform:translateX(-50%) scale(1)}85%{opacity:1;transform:translateX(-50%) scale(1)}100%{opacity:0;transform:translateX(-50%) scale(1)}}
@media (prefers-reduced-motion:reduce){.vb2-now.on{animation:none;opacity:1;transform:translateX(-50%)}}
/* the Sound step fits one screen: 5 small face tiles a row, a compact Speed | Pitch | Hear | Reset bar, the stage takes what is left (vibes.js fitSound) */
.vb2[data-step="sound"] .vb2-panel{padding:4px 10px 4px;display:flex;flex-direction:column}
.vb2[data-step="sound"] .vb2-sh{display:none}
.vb2 .vb2-snds{grid-template-columns:repeat(5,1fr);gap:3px}
.vb2 .vb2-snds button{min-height:44px;padding:2px 1px 2px;gap:1px;border-radius:10px;justify-content:center}
.vb2 .vb2-snds canvas{width:24px;height:24px;image-rendering:pixelated}
.vb2 .vb2-snds button span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:400 10.5px/1.1 "Pixelify Sans",system-ui,sans-serif;font-variant-ligatures:none;letter-spacing:-.01em;padding:0 2px}
.vb2 .vb2-snds button.on::after{right:2px;top:2px;width:11px;height:11px}
.vb2-sbar{display:flex;align-items:flex-end;gap:6px;margin:6px 0 0}
.vb2-sbar .vb-sl{flex:1;min-width:0;margin:0}
.vb2-sbar .vb-sl-top{font:400 13px/1 "Pixelify Sans",system-ui,sans-serif;gap:4px;white-space:nowrap}.vb2-sbar .vb-sl-top i{font-size:11.5px;overflow:hidden;text-overflow:ellipsis}
.vb2-sbar .vb-sl-ends{display:none}.vb2-sbar .vb-sl input{height:44px;margin:0}
.vb2-sbar .vb2-shear{flex:none;width:48px;height:48px;padding:0;border-radius:12px}.vb2-sbar .vb2-shear svg{width:20px;height:20px}
.vb2-sres{flex:none;width:44px;height:48px;padding:0;border-radius:12px;border:2px solid var(--line);background:var(--tile);color:var(--glow2);display:grid;place-items:center}.vb2-sres svg{width:20px;height:20px;image-rendering:pixelated}
.vb2[data-step="sound"] .vb2-room{scale:var(--vbk,1);transform-origin:50% 30px}
.vb2[data-step="sound"] .vb2-spin{scale:var(--vbk,1);transform-origin:50% -26px}
.vb2[data-step="sound"].vb2-tall .vb2-room{transform-origin:50% 12px}.vb2[data-step="sound"].vb2-tall .vb2-spin{transform-origin:50% -44px}
/* f338 (Will): the dice buttons say what they do: 'Random ball' (top bar) and 'Random name' (next to the name), dice icon kept */
.vb2-top .vb2-lb.vb-randb{width:auto;min-width:52px;max-width:72px;padding:2px 4px 0}
.vb2-top .vb2-lb.vb-randb span{max-width:64px;white-space:normal;line-height:1;text-align:center;overflow-wrap:anywhere}
.vb-vname .vb-ndice{width:auto;min-width:64px;max-width:84px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:4px 6px}
.vb-vname .vb-ndice svg{width:20px;height:20px;flex:none}
.vb-vname .vb-ndice span{font:400 11px/1 "Pixelify Sans",system-ui,sans-serif;white-space:normal;text-align:center;color:var(--ink,#23343c);-webkit-font-smoothing:none;font-variant-ligatures:none}
/* f338 (Will): Gloss / Matte / Shiny for the accents, under the accent color bar (same buttons as the Color step) */
.vb2 .vb3-efin{margin:8px 0 0}.vb2 .vb3-efin-no{margin:8px 0 0;padding:8px 10px;border:2px dashed #c9d3d6;border-radius:10px;font:400 12px/1.2 "Pixelify Sans",sans-serif;color:#5f7076;text-align:center}
/* f336 look setup (Will + his son: Save looked dead and the name field had scrolled away): Save and use always looks tappable; the name row is
   pinned at the top of the Name step; a tap with no name glows the field gold (two soft pulses) and shows 'Name your ball first!' under it, all in gold. */
.vb2 .vb2-nmbox{position:sticky;top:0;z-index:7;margin:0 -12px;padding:2px 12px 4px;background:var(--card);border-bottom:2px solid transparent}
.vb2[data-step="finish"] .vb2-nmbox{box-shadow:0 6px 10px -8px #23343c40}
.vb2 .vb2-nmbox .vb-vname{margin:4px 0 8px}
.vb2 .vb-vname.ask input,.vb-vname.ask input{border-color:#e0a417;box-shadow:0 0 0 3px #f2c44066,0 0 18px #ffd84a99;outline:none;animation:vbNameGlow 1.1s ease-out 1}
@keyframes vbNameGlow{0%{box-shadow:0 0 0 0 #ffd84a00}20%{box-shadow:0 0 0 6px #ffd84acc,0 0 26px #ffd84a}45%{box-shadow:0 0 0 3px #f2c44066,0 0 12px #ffd84a66}70%{box-shadow:0 0 0 6px #ffd84acc,0 0 26px #ffd84a}100%{box-shadow:0 0 0 3px #f2c44066,0 0 18px #ffd84a99}}
.vb-nask{display:flex;align-items:center;gap:7px;margin:-2px 2px 8px;padding:7px 11px;border-radius:10px;background:#1b1f3b;border:2px solid #e0a417;color:#fff;font:600 15px/1.2 "Pixelify Sans",system-ui,sans-serif;width:fit-content;max-width:100%;box-sizing:border-box}
.vb-nask[hidden]{display:none}.vb-nask i{font-style:normal;font-size:16px;color:#ffd84a} /* f794b (Will, Oct 26 2026: no text on yellow): navy pill, white text, gold pencil + edge */
.vb-nask.pop{animation:vbNaskPop .42s cubic-bezier(.2,1.6,.4,1) 1}
@keyframes vbNaskPop{0%{transform:translateY(-6px) scale(.85);opacity:0}100%{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.vb-vname.ask input,.vb-nask.pop{animation:none}}
.lr-pcnt.ask{color:#c78a1e;animation:vbNaskPop .42s cubic-bezier(.2,1.6,.4,1) 1}.lr-pick .vb-btn.need{opacity:.85}
/* f338 smooth Speed / Pitch sliders (smooth-slider.js): a 44 px grab area, a filled track, 9 soft stops, a big thumb that follows the finger */
.vb-ss{position:relative;display:block;height:44px;margin:0;touch-action:none;cursor:pointer;outline:none;-webkit-user-select:none;user-select:none;--th:30px}
.vb-ss i{position:absolute;display:block;pointer-events:none}
.vb-ss-tr{left:calc(var(--th) / 2 - 4px);right:calc(var(--th) / 2 - 4px);top:50%;height:12px;margin-top:-6px;border-radius:7px;background:#e3ecee;border:2px solid #23343c;box-sizing:border-box;box-shadow:inset 0 2px 0 #23343c1f}
.vb-ss-fill{left:calc(var(--th) / 2 - 4px);top:50%;height:12px;margin-top:-6px;width:calc(var(--p) * (100% - var(--th)) + 8px);border-radius:7px 0 0 7px;background:linear-gradient(#b6f5de,#5cc9a4 60%,#2f9c79);border:2px solid #23343c;border-right:0;box-sizing:border-box}
.vb-ss-ticks{left:calc(var(--th) / 2);right:calc(var(--th) / 2);top:50%;height:4px;margin-top:-2px;display:flex!important;justify-content:space-between}
.vb-ss-ticks b{width:4px;height:4px;margin:0 -2px;border-radius:1px;background:#23343c40}
.vb-ss-th{left:calc(var(--p) * (100% - var(--th)));top:50%;width:var(--th);height:var(--th);margin-top:calc(var(--th) / -2);border-radius:50%;background:radial-gradient(circle at 38% 32%,#ffffff,#eef6f4 55%,#cfe9e0);border:3px solid #23343c;box-sizing:border-box;box-shadow:0 3px 0 #23343c,0 0 0 0 #f5c54200;transition:box-shadow .15s,scale .15s;will-change:left}
.vb-ss:hover .vb-ss-th{box-shadow:0 3px 0 #23343c,0 0 0 4px #5cc9a455}
.vb-ss.drag .vb-ss-th{scale:1.12;box-shadow:0 4px 0 #23343c,0 0 0 5px #f5c54266}
.vb-ss:focus-visible .vb-ss-th{box-shadow:0 3px 0 #23343c,0 0 0 4px #f5c542}
.vb-ss.settle .vb-ss-th{transition:left .3s cubic-bezier(.3,1.7,.5,1),box-shadow .15s,scale .15s}.vb-ss.settle .vb-ss-fill{transition:width .3s cubic-bezier(.3,1.7,.5,1)}
@media (prefers-reduced-motion:reduce){.vb-ss.settle .vb-ss-th,.vb-ss.settle .vb-ss-fill{transition:none}}
.vb2-sbar .vb-ss{height:44px}
/* f338 pedestal glow + pick reaction (lab-fx.js): a layer between the room and the ball, same box as the room */
.vb2-ped{position:absolute;left:50%;top:-30px;width:684px;height:368px;margin-left:-342px;pointer-events:none;z-index:1}
.vb2.vb2-tall .vb2-ped{top:-12px}
.vb2[data-step="sound"] .vb2-ped{scale:var(--vbk,1);transform-origin:50% 30px}.vb2[data-step="sound"].vb2-tall .vb2-ped{transform-origin:50% 12px}
.vb2-pedglow{position:absolute;left:166px;top:216px;width:352px;height:80px;border-radius:50%;background:radial-gradient(closest-side,var(--pc,#9fe8d2),#9fe8d200);opacity:.08;will-change:opacity}
.vb2-pedcv{position:absolute;left:0;top:0;width:684px;height:368px;image-rendering:pixelated}
/* ===== f363 (Will, Oct 20 2026): what you're coloring is always clear + touch tablets get the phone maker, scaled up ===== */
/* the part being coloured: a pixel gold outline with a slow soft pulse, the other parts a little dimmer (vibes.js drawSel); the ball never spins on its own */
.vb2 .vb-ball canvas.vb2-psel{z-index:2;animation:vb2-psel 2.4s ease-in-out infinite}
.vb2 .vb-ball canvas.vb2-psel[hidden]{display:none}
@keyframes vb2-psel{0%,100%{opacity:1}50%{opacity:.62}}
.vb2-plbl{position:absolute;left:10px;bottom:10px;z-index:6;display:flex;align-items:center;gap:6px;max-width:calc(100% - 70px);box-sizing:border-box;padding:4px 10px 5px 6px;border-radius:10px;background:#fffbe8;border:2px solid #23343c;box-shadow:0 2px 0 #23343c;font:400 13px/1.15 "Pixelify Sans",system-ui,sans-serif;font-variant-ligatures:none;color:#3a2a00;white-space:nowrap;pointer-events:none;transform-origin:0 100%}
.vb2-plbl[hidden]{display:none}
.vb2-plbl i{width:14px;height:14px;flex:none;border-radius:50%;border:2px solid #23343c;box-sizing:border-box}
.vb2-plbl span{overflow:hidden;text-overflow:ellipsis;min-width:0}
.vb2-plbl b{font-weight:400;text-transform:uppercase;color:#7a5200;letter-spacing:.02em}
.vb2[data-step="sound"] .vb2-plbl{display:none}
/* each part tab: a tiny ball with only that part in colour */
.vb2 .vb-parts i.vb2-pv{width:30px;height:30px;border:0;border-radius:0;background:none!important;display:block;flex:none}
.vb2 .vb-parts i.vb2-pv canvas{width:100%;height:100%;display:block}
/* PC / Mac big-screen lab: the label sits under the ball (where 'Now coloring' used to pop) */
.lw-c .vb2 .vb2-plbl{left:var(--lw-nx,50%);top:var(--lw-ny,14px);bottom:auto;translate:-50% 0;transform-origin:50% 0;max-width:none;background:#0a080e99;border-color:#ffd84a73;box-shadow:none;color:#fff6d8;font-size:16px;padding:5px 12px 6px 8px}
.lw-c .vb2 .vb2-plbl b{color:#ffd84a}.lw-c .vb2 .vb2-plbl i{border-color:#fff6d8aa}
.lw-c .vb2 .vb2-parts i.vb2-pv{width:30px;height:30px}
.lw-d .vb2 .vb2-plbl{display:none}
/* touch tablets (iPad, Android tablet): the phone maker in a wider column, the bench + ball up to 1.5x (--vbk, the same scale the Sound step uses) */
.vb-tbig .vb2{max-width:760px}
.vb-tbig .vb2 :is(.vb2-room,.vb2-ped){scale:var(--vbk,1);transform-origin:50% 30px}
.vb-tbig .vb2 .vb2-spin{scale:var(--vbk,1);transform-origin:50% -26px}
.vb-tbig .vb2.vb2-tall :is(.vb2-room,.vb2-ped){transform-origin:50% 12px}.vb-tbig .vb2.vb2-tall .vb2-spin{transform-origin:50% -44px}
.vb-tbig .vb2-top{padding:10px 14px 8px;gap:10px}
.vb-tbig .vb2-top .vb2-ib{width:54px;height:54px}.vb-tbig .vb2-top .vb2-ib svg{width:26px;height:26px}
.vb-tbig .vb2-prog{padding:8px 14px 6px}.vb-tbig .vb2-prog em{font-size:13px}
.vb-tbig .vb2-panel{padding:6px 18px 18px}
.vb-tbig .vb2 .vb-parts{gap:10px}
.vb-tbig .vb2 .vb-parts button{min-height:78px;font-size:18px;gap:6px}
.vb-tbig .vb2 .vb-parts i.vb2-pv{width:40px;height:40px}
.vb-tbig .vb2 .vb2-fin{gap:10px}.vb-tbig .vb2 .vb2-fin button{min-height:58px;font-size:17px}.vb-tbig .vb2 .vb2-fin svg{width:26px;height:26px}
.vb-tbig .vb2-bot{padding:12px 18px calc(12px + env(safe-area-inset-bottom))}.vb-tbig .vb2-bot button{height:62px;font-size:21px}
.vb-tbig .vb2-plbl{left:14px;bottom:14px;font-size:16px;padding:6px 12px 7px 8px}.vb-tbig .vb2-plbl i{width:18px;height:18px}
.vb-tbig .vb2 .vb2-rw{gap:18px;margin:18px 0 6px}
.vb-tbig.vb-ttall .vb2-rw .vb2-ring{width:min(370px,60vw)}.vb-tbig.vb-ttall .vb2-tower{height:min(370px,60vw)}
.vb-tbig .vb2 .vb3-grid{grid-auto-columns:66px;gap:7px}.vb-tbig .vb2 .vb3-grid button{min-height:88px}.vb-tbig .vb2 .vb3-grid canvas.vb-pb{width:54px;height:54px}
.vb-tbig .vb2 .vb3-grid button span{font-size:12px}
.vb-tbig .vb2 .vb2-snds button{min-height:72px}.vb-tbig .vb2 .vb2-snds button span{font-size:12.5px}
@media (prefers-reduced-motion:reduce){.vb2 .vb-ball canvas.vb2-psel{animation:none}}
.lw-c .vb2[data-step="color"] .vb2-now{display:none} /* the PC / Mac label is .vb2-plbl now (with the part's colour dot) */
.vb-tbig .vb2 .vb2-fin button span{font-size:17px}
/* landscape tablet: bench left (fills its column, ball centred in it), the phone controls right, so the ball never scrolls away while painting */
.vb-tland .vb2{max-width:1180px;height:100%;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 460px;grid-template-rows:auto auto auto minmax(0,1fr) auto;overflow:hidden}
.vb-tland .vb2 > .vb2-top,.vb-tland .vb2 > .vb2-prog{grid-column:1/-1}
.vb-tland .vb2 > #vb-cr{grid-column:2;grid-row:3}
.vb-tland .vb2 > #vb-stage{grid-column:1;grid-row:3/6;height:auto!important;min-height:0;border-bottom:0;box-shadow:none;border-right:4px solid #8fd3bd}
.vb-tland .vb2 > #vb-body{grid-column:2;grid-row:4;min-height:0;overflow:auto;overscroll-behavior:contain}
.vb-tland .vb2 > .vb2-bot{grid-column:2;grid-row:5}
.vb-tland .vb2 :is(.vb2-room,.vb2-ped,.vb2-spin){translate:0 var(--vby,0px)}
.vb-tland .vb-maker,.vb-maker.vb-tland{overflow:hidden}
.vb-tland .vb2 .vb2-rw .vb2-ring{width:min(330px,calc(100vh - 480px),calc(100dvh - 480px))}.vb-tland .vb2 .vb2-tower{height:min(330px,calc(100vh - 480px),calc(100dvh - 480px))}
/* f593 (Will, Oct 23): the name dice is a full-width line under the field ('Try one of our names for inspiration', dice icon), so the field keeps
   the whole width on a phone. Guests (no profile): the Name step is only the name; the bench + ball scale up to fill the freed space (vibes.js fitSound),
   and on PC the name sits in the middle of the panel. */
.vb2 .vb-vname,.vb-vname{flex-wrap:wrap;row-gap:8px}
.vb-vname .vb-nin{flex:1 1 100%}
.vb-vname .vb-ndice{flex:1 1 100%;width:100%;max-width:none;min-width:0;min-height:44px;flex-direction:row;gap:8px;padding:8px 12px;align-self:auto}
.vb-vname .vb-ndice span{font:400 15px/1.15 "Pixelify Sans",system-ui,sans-serif;white-space:normal;text-align:center}
.vb-vname .vb-ndice svg{width:22px;height:22px}
.vb2.vb2-gst[data-step="finish"] .vb2-room{scale:var(--vbk,1);transform-origin:50% 30px}
.vb2.vb2-gst[data-step="finish"] .vb2-spin{scale:var(--vbk,1);transform-origin:50% -26px}
.vb2.vb2-gst.vb2-tall[data-step="finish"] .vb2-room{transform-origin:50% 12px}.vb2.vb2-gst.vb2-tall[data-step="finish"] .vb2-spin{transform-origin:50% -44px}
.vb2.vb2-gst[data-step="finish"] #vb-body{display:flex;flex-direction:column;justify-content:center}
.vb2.vb2-gst[data-step="finish"] .vb2-gnm{position:static;box-shadow:none;margin:0;padding:4px 0}
.lw .vb2.vb2-gst[data-step="finish"] .vb2-gnm .vb-h3s{font-size:15px}
/* f593 (Will, Oct 23): the Ball lab 'Saved!' card, storybook style: cream panel with an ink border + pixel drop shadow, the ball on a glowing
   dish (a small hop in), Pixelify heading, a clear teal primary (guests: Make an account to keep your ball) and a quiet outlined Done. */
.vb-succ.lab-sv{max-width:400px;padding:26px 22px 22px;border-radius:18px;background:linear-gradient(#fffaf0,#fbefd6);color:#23343c;border:3px solid #23343c;box-shadow:0 6px 0 #23343c,0 24px 60px #0008;overflow:visible;animation:labSvIn .38s cubic-bezier(.2,1.4,.4,1) both}
.vb-succ.lab-sv::before{display:none}
.lab-sv-stage{position:relative;width:180px;height:150px;margin:0 auto 6px;display:flex;align-items:flex-end;justify-content:center}
.lab-sv-glow{position:absolute;z-index:0;left:50%;top:46%;width:190px;height:190px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#ffe9a8cc 0,#ffe9a855 38%,#ffe9a800 68%);pointer-events:none}
.lab-sv-dish{position:absolute;z-index:1;left:50%;bottom:4px;width:132px;height:26px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse at 50% 40%,#e8f5f1 0,#bcdcd3 55%,#7fb3a6 100%);border:3px solid #23343c;box-shadow:0 4px 0 #23343c33}
.lab-sv .lab-sv-ball{position:relative;z-index:2;margin:0 0 14px;line-height:0;animation:labSvHop .6s .12s cubic-bezier(.3,1.6,.5,1) both}
.lab-sv .lab-sv-ball canvas{image-rendering:pixelated}
.lab-sv .vb-h2{font:700 30px/1.1 "Pixelify Sans",system-ui,sans-serif;color:#23343c;margin:4px 0 6px;-webkit-font-smoothing:none}
.lab-sv-p{margin:0 0 16px;font:500 15px/1.35 system-ui,sans-serif;color:#4c5f66}
.lab-sv .lab-sv-go{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;box-sizing:border-box;margin:0;padding:14px 10px;border-radius:14px;background:#1f8f70;border:0;color:#fff;font:600 16px/1.2 "Pixelify Sans",system-ui,sans-serif;box-shadow:0 4px 0 #11573d;text-decoration:none;-webkit-font-smoothing:none}
.lab-sv .lab-sv-go svg{width:12px;height:14px;color:#fff}
.lab-sv .lab-sv-go:hover{background:#23a07d}.lab-sv .lab-sv-go:active{transform:translateY(3px);box-shadow:0 1px 0 #11573d}
.lab-sv .vb-btn.vb-done{margin:18px 0 0;background:#1f8f70;color:#fff;box-shadow:0 4px 0 #11573d;border-radius:14px}
.lab-sv .vb-btn.vb-done.lab-sv-q{margin:12px 0 0;padding:12px;background:transparent;color:#23343c;border:2px solid #23343c55;box-shadow:none;font-size:17px}
.lab-sv .vb-btn.vb-done.lab-sv-q:hover{background:#23343c0d;border-color:#23343c}
.lab-sv a:focus-visible,.lab-sv button:focus-visible{outline:3px solid #2f6fd6;outline-offset:3px}
@keyframes labSvIn{0%{opacity:0;transform:translateY(-50%) scale(.86)}70%{opacity:1;transform:translateY(-50%) scale(1.03)}100%{opacity:1;transform:translateY(-50%) scale(1)}}
@keyframes labSvHop{0%{transform:translateY(-34px);opacity:0}60%{transform:translateY(3px);opacity:1}100%{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.vb-succ.lab-sv,.lab-sv .lab-sv-ball{animation:none}}
@media (max-width:400px){.lab-sv .lab-sv-go{font-size:15px;gap:6px}}
/* f594 guest Name step on PC / Mac (lab-wide .lw): name block at the top with a bigger field, a name plate (ball on its dish + the name in
   Pixelify) filling the middle, the 'make an account' note + teal button at the bottom. Phones never show the plate (name only). */
.vb2-gpc{display:none}
.lw .vb2.vb2-gst[data-step="finish"] #vb-body{justify-content:flex-start}
.lw .vb2.vb2-gst[data-step="finish"] .vb2-gnm{padding:6px 0 0}
.lw .vb2.vb2-gst[data-step="finish"] .vb2-gnm .vb-h3s{font-size:15px;margin:0 0 6px}
.lw .vb2.vb2-gst[data-step="finish"] .vb-vname input{font-size:20px;min-height:58px;padding-left:16px}
.lw .vb2.vb2-gst[data-step="finish"] .vb-vname .vb-ndice{min-height:48px}
.lw .vb2.vb2-gst[data-step="finish"] .vb2-gpc{display:flex;flex-direction:column;gap:16px;flex:1 1 auto;min-height:0;margin:14px 0 6px}
.vb2-gplate{flex:1 1 auto;min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:22px 16px;border-radius:18px;background:linear-gradient(#fffaf0,#fbefd6);border:3px solid #23343c;box-shadow:0 5px 0 #23343c;box-sizing:border-box}
.vb2-gpst{position:relative;width:200px;height:170px;display:flex;align-items:flex-end;justify-content:center}
.vb2-gpst .lab-sv-dish{width:150px}
.vb2-gpball{position:relative;z-index:2;width:150px;height:150px;margin-bottom:14px;image-rendering:pixelated}
.vb2-gpn{max-width:100%;font:700 30px/1.15 "Pixelify Sans",system-ui,sans-serif;color:#23343c;text-align:center;overflow-wrap:anywhere;-webkit-font-smoothing:none}
.vb2-gpn.ph{color:#23343c66}
.vb2-gfoot{display:flex;flex-direction:column;gap:10px}
.vb2-gnote{margin:0;text-align:center;font:500 15px/1.35 system-ui,sans-serif;color:#4c5f66}
.vb2 .vb2-gsign{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:13px 12px;border-radius:14px;border:0;background:#1f8f70;color:#fff;font:600 17px/1.2 "Pixelify Sans",system-ui,sans-serif;box-shadow:0 4px 0 #11573d;-webkit-font-smoothing:none}
.vb2 .vb2-gsign:hover{background:#23a07d}.vb2 .vb2-gsign:active{transform:translateY(3px);box-shadow:0 1px 0 #11573d}
@media (max-height:820px){.vb2-gplate{min-height:180px;padding:14px}.vb2-gpst{height:130px;transform:scale(.8);transform-origin:50% 100%;margin-top:-20px}}
@media (min-height:1000px){.vb2-gpst{width:250px;height:220px}.vb2-gpst .lab-sv-glow{width:250px;height:250px}.vb2-gpst .lab-sv-dish{width:186px;height:30px}.vb2-gpball{width:190px;height:190px;margin-bottom:16px}.vb2-gpn{font-size:34px}}