:root{ --black:#0b0b0d; --charcoal:#17171b; --cream:#f7f0df; --gold:#d7b05b; --soft-gold:#edd79b; --white:#ffffff; --muted:#b9b4aa; } *{box-sizing:border-box} html{scroll-behavior:smooth} body{ margin:0; font-family:Arial, Helvetica, sans-serif; background:var(--black); color:var(--cream); line-height:1.6; padding-bottom:86px; } a{color:inherit} .wrap{max-width:1120px;margin:auto;padding:0 22px} header{ position:sticky; top:0; z-index:30; background:rgba(11,11,13,.92); backdrop-filter:blur(10px); border-bottom:1px solid rgba(215,176,91,.2); } nav{ min-height:74px; display:flex; align-items:center; justify-content:space-between; gap:18px; } .brand{ display:flex; align-items:center; gap:10px; font-family:Georgia, "Times New Roman", serif; font-size:1.3rem; font-weight:700; letter-spacing:.04em; text-decoration:none; } .brand img{width:42px;height:42px;border-radius:50%;object-fit:cover;border:1px solid rgba(215,176,91,.5)} .brand span{color:var(--gold)} .navlinks{display:flex;gap:20px;align-items:center} .navlinks a{text-decoration:none;font-size:.95rem;color:#eee7d8} .btn{ display:inline-block; background:var(--gold); color:#111; text-decoration:none; font-weight:700; padding:12px 18px; border-radius:999px; border:1px solid var(--gold); cursor:pointer; transition:transform .2s ease,box-shadow .2s ease,background .2s ease; } .btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(215,176,91,.2)} .btn.alt{background:transparent;color:var(--cream)} .hero{ min-height:78vh; display:grid; align-items:center; background: radial-gradient(circle at 15% 20%, rgba(215,176,91,.16), transparent 28%), radial-gradient(circle at 90% 75%, rgba(215,176,91,.10), transparent 30%), linear-gradient(135deg,#08080a 0%,#161219 100%); border-bottom:1px solid rgba(215,176,91,.18); overflow:hidden; } .hero-grid{ display:grid; grid-template-columns:1.2fr .8fr; gap:50px; align-items:center; padding:80px 0; } .kicker{color:var(--gold);font-weight:700;letter-spacing:.18em;text-transform:uppercase;font-size:.78rem} h1,h2,h3{font-family:Georgia, "Times New Roman", serif;line-height:1.12;margin-top:0} h1{font-size:clamp(3rem,7vw,6.3rem);margin-bottom:18px} h1 .amp{color:var(--gold)} .hero p{font-size:1.15rem;max-width:700px;color:#d6d0c5} .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px} .logo-stage{ aspect-ratio:1; display:grid; place-items:center; position:relative; isolation:isolate; } .logo-stage:before{ content:""; position:absolute; inset:9%; border-radius:50%; background:radial-gradient(circle,rgba(215,176,91,.18),rgba(215,176,91,.03) 50%,transparent 70%); filter:blur(12px); opacity:.75; } .hero-logo{ width:min(100%,480px); aspect-ratio:1; object-fit:cover; border-radius:24px; position:relative; z-index:2; box-shadow:0 25px 70px rgba(0,0,0,.35),0 0 45px rgba(215,176,91,.08); } .home-only .hero-logo{animation:logoFloat 6s ease-in-out infinite,logoGlow 4s ease-in-out infinite} .logo-stage--loop:before{ inset:6%; border-radius:28px; background:radial-gradient(circle,rgba(215,176,91,.22),rgba(215,176,91,.06) 54%,transparent 74%); } .hero-loop-frame{ width:min(100%,420px); aspect-ratio:4/5; overflow:hidden; border-radius:28px; position:relative; z-index:2; margin-top:26px; box-shadow:0 25px 70px rgba(0,0,0,.35),0 0 45px rgba(215,176,91,.08); border:1px solid rgba(215,176,91,.18); background:rgba(14,14,18,.5); } .hero-loop-frame:after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 25%,transparent 72%,rgba(0,0,0,.1)); pointer-events:none; } .hero-loop-media{ width:100%; height:100%; object-fit:cover; border-radius:0; box-shadow:none; animation:heroLoopFloat 7s ease-in-out infinite,heroLoopPulse 10s ease-in-out infinite; transform-origin:center center; } @keyframes heroLoopFloat{0%,100%{transform:scale(1.02) translate3d(0,0,0)}25%{transform:scale(1.045) translate3d(-1.2%,-.8%,0)}50%{transform:scale(1.035) translate3d(.9%,-1.2%,0)}75%{transform:scale(1.05) translate3d(-.8%,.9%,0)}} @keyframes heroLoopPulse{0%,100%{filter:saturate(1) brightness(1)}50%{filter:saturate(1.08) brightness(1.04)}} @keyframes logoFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-9px) scale(1.012)}} @keyframes logoGlow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.07)}} section{padding:85px 0} .section-title{max-width:720px;margin-bottom:34px} .section-title h2{font-size:clamp(2rem,4vw,3.6rem);margin-bottom:12px} .section-title p{color:#c5bfb4} .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px} .card{ background:var(--charcoal); border:1px solid rgba(215,176,91,.16); border-radius:18px; padding:28px; min-height:260px; } .card .num{color:var(--gold);font-size:.85rem;font-weight:700;letter-spacing:.15em} .card h3{font-size:1.55rem;margin:14px 0 10px} .card p{color:#beb8ad} .split{display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(215,176,91,.2);border-radius:24px;overflow:hidden} .half{padding:44px} .half.grim{background:#09090b} .half.goldie{background:linear-gradient(145deg,#f2dfad,#c89e49);color:#17120a} .half h3{font-size:2.4rem;margin-bottom:8px} .half p{max-width:500px} .quote{font-family:Georgia,serif;font-style:italic;font-size:1.2rem} .contact{background:linear-gradient(135deg,#17171b,#0d0d0f);border-top:1px solid rgba(215,176,91,.18);border-bottom:1px solid rgba(215,176,91,.18)} .contact-grid{display:grid;grid-template-columns:1fr .8fr;gap:36px;align-items:start} .contact-box{background:#0b0b0d;border:1px solid rgba(215,176,91,.25);border-radius:18px;padding:28px} .contact-box p{margin:10px 0;color:#d4cdc1} .page-hero{padding:95px 0 62px;background:radial-gradient(circle at 75% 15%,rgba(215,176,91,.13),transparent 35%),linear-gradient(135deg,#08080a,#171219);border-bottom:1px solid rgba(215,176,91,.18)} .page-hero .inner{display:grid;grid-template-columns:1fr 280px;gap:40px;align-items:center} .page-hero h1{font-size:clamp(3rem,6vw,5.8rem);margin:8px 0 16px} .page-hero p{color:#c9c3b8;max-width:700px;font-size:1.08rem} .page-logo{width:100%;border-radius:22px;box-shadow:0 20px 50px rgba(0,0,0,.35)} .portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px} .portfolio-card{min-height:260px;border-radius:20px;border:1px solid rgba(215,176,91,.18);background:linear-gradient(145deg,#17171b,#101013);padding:28px;display:flex;flex-direction:column;justify-content:flex-end} .portfolio-card h3{margin-bottom:8px} .portfolio-card p{margin:0;color:#bbb4a8} .shop-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px} .shop-card{border:1px solid rgba(215,176,91,.22);border-radius:22px;padding:40px;background:linear-gradient(145deg,#18171a,#0e0e10)} .shop-card.gold{background:linear-gradient(145deg,#f2dfad,#c89e49);color:#17120a} .shop-card h2{font-size:2.25rem;margin-bottom:10px} .shop-card p{min-height:72px} .shop-card.gold .btn{background:#111;color:var(--cream);border-color:#111} .floating-portfolios{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column;gap:10px} .float-choice{min-width:92px;text-align:center;text-decoration:none;font-weight:800;padding:11px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.14);box-shadow:0 8px 25px rgba(0,0,0,.28);transition:transform .2s ease} .float-choice:hover{transform:translateX(-4px)} .float-choice.grim{background:#050506;color:#fff;border-color:#35353a} .float-choice.goldie{background:var(--gold);color:#111;border-color:var(--soft-gold)} .book-now{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:50;text-decoration:none;background:var(--gold);color:#111;font-weight:900;letter-spacing:.03em;padding:14px 26px;border-radius:999px;border:1px solid var(--soft-gold);box-shadow:0 12px 35px rgba(0,0,0,.45),0 0 25px rgba(215,176,91,.18);white-space:nowrap} .book-now:hover{transform:translateX(-50%) translateY(-2px)} footer{padding:30px 0;color:#8f8a82;font-size:.9rem} /* Slow parallax star/spark overlay for the home page */ :root{--star-scroll-near:0px;--star-scroll-far:0px} .home-only main,.home-only footer{position:relative;z-index:5} .scroll-star-overlay{ position:fixed; inset:-18vh -10vw; z-index:4; pointer-events:none; overflow:hidden; opacity:.62; mix-blend-mode:screen; } .scroll-star-overlay span{position:absolute;inset:0;will-change:transform,background-position} .stars-near{ transform:translate3d(0,var(--star-scroll-near),0); background-image: radial-gradient(circle,rgba(255,246,218,.92) 0 1px,transparent 1.7px), radial-gradient(circle,rgba(215,176,91,.85) 0 1.25px,transparent 2px), radial-gradient(circle,rgba(255,255,255,.72) 0 .8px,transparent 1.5px); background-size:137px 173px,211px 257px,97px 131px; background-position:19px 31px,83px 119px,47px 71px; animation:starDriftNear 34s linear infinite; filter:drop-shadow(0 0 4px rgba(215,176,91,.28)); } .stars-far{ transform:translate3d(0,var(--star-scroll-far),0); opacity:.52; background-image: radial-gradient(circle,rgba(237,215,155,.82) 0 .7px,transparent 1.4px), radial-gradient(circle,rgba(255,255,255,.58) 0 .65px,transparent 1.25px); background-size:73px 89px,149px 191px; background-position:11px 23px,67px 41px; animation:starDriftFar 52s linear infinite; } @keyframes starDriftNear{from{background-position:19px 31px,83px 119px,47px 71px}to{background-position:63px 171px,131px 299px,91px 231px}} @keyframes starDriftFar{from{background-position:11px 23px,67px 41px}to{background-position:43px 137px,101px 201px}} @media(max-width:800px){ .brand{font-size:1rem}.brand img{width:36px;height:36px} .navlinks a:not(.btn){display:none} .hero-grid,.split,.contact-grid,.cards,.portfolio-grid,.shop-grid,.page-hero .inner{grid-template-columns:1fr} .hero-grid{padding:58px 0} .logo-stage{max-width:360px;width:92%;margin:auto} .half{padding:32px 25px} .page-hero .inner{padding-bottom:10px}.page-logo{max-width:260px} .floating-portfolios{top:auto;right:12px;bottom:82px;transform:none;flex-direction:row} .float-choice{min-width:auto;padding:10px 14px} .book-now{bottom:16px} } @media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.home-only .hero-logo,.hero-loop-media{animation:none}.btn,.float-choice{transition:none}.stars-near,.stars-far{animation:none!important;transform:none!important}} /* Avatar Studio */ .avatar-page{background:radial-gradient(circle at 15% 15%,rgba(215,176,91,.09),transparent 24%),var(--black)} .avatar-hero{padding:72px 0 28px;border-bottom:1px solid rgba(215,176,91,.15)} .avatar-hero h1{margin:6px 0 12px}.avatar-hero p{color:#c9c3b8;max-width:760px;font-size:1.08rem} .avatar-builder-section{padding-top:42px}.avatar-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);gap:26px;align-items:start} .avatar-preview-card,.avatar-controls-card{background:rgba(23,23,27,.92);border:1px solid rgba(215,176,91,.2);border-radius:24px;padding:24px;box-shadow:0 18px 55px rgba(0,0,0,.25)} .avatar-preview-card{position:sticky;top:96px}.avatar-preview-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px} .avatar-badge{font-size:.78rem;font-weight:900;letter-spacing:.17em;color:#111;background:var(--gold);padding:7px 11px;border-radius:999px} .tiny-button,.text-button{background:transparent;color:var(--cream);border:0;text-decoration:underline;text-underline-offset:3px;cursor:pointer;font-weight:700} .avatar-stage{border-radius:22px;overflow:hidden;background:radial-gradient(circle,#29231a,#09090b 72%);border:1px solid rgba(215,176,91,.18);aspect-ratio:1;display:grid;place-items:center} .avatar-stage svg{width:100%;height:100%;filter:none}.avatar-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.save-note{margin:12px 0 0;color:#aaa49b;font-size:.88rem} .avatar-title{margin-bottom:22px}.avatar-title h2{font-size:2.2rem;margin:4px 0 0}.control-group{margin:0 0 20px}.control-group>label,.field-label{display:block;font-size:.86rem;font-weight:800;letter-spacing:.05em;margin-bottom:8px;color:#e9e1d2} .control-group select,.text-input{width:100%;appearance:none;background:#0c0c0f;color:var(--cream);border:1px solid rgba(215,176,91,.25);border-radius:13px;padding:13px 14px;font-size:1rem;outline:none}.control-group select:focus,.text-input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(215,176,91,.12)} .segmented{display:grid;grid-template-columns:1fr 1fr;background:#0c0c0f;border-radius:13px;padding:4px;border:1px solid rgba(215,176,91,.18)}.segmented button{border:0;background:transparent;color:#c8c1b5;padding:11px;border-radius:10px;font-weight:800;cursor:pointer}.segmented button.active{background:var(--gold);color:#111} .toggle-row,.consent-row{display:flex;gap:10px;align-items:flex-start;color:#d0c8ba;font-size:.92rem;cursor:pointer}.toggle-row input,.consent-row input{margin-top:4px;accent-color:var(--gold)} body[data-avatar-style="goldie"] .avatar-badge{background:#f1d58d}body[data-avatar-style="goldie"] .avatar-stage{background:radial-gradient(circle,#5d4822,#100e0a 74%)} .modal-shell[hidden]{display:none}.modal-shell{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:18px}.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.76);backdrop-filter:blur(8px)}.account-modal{position:relative;z-index:2;width:min(100%,560px);max-height:90vh;overflow:auto;background:#131317;border:1px solid rgba(215,176,91,.35);border-radius:24px;padding:30px;box-shadow:0 28px 90px rgba(0,0,0,.55)}.modal-close{position:absolute;right:16px;top:12px;border:0;background:transparent;color:#fff;font-size:2rem;cursor:pointer}.account-modal h2{font-size:2.2rem;margin:6px 0 8px}.modal-copy{color:#c7c0b4}.text-input{margin-bottom:14px}.consent-row{background:#0c0c0f;border:1px solid rgba(255,255,255,.07);padding:12px;border-radius:12px;margin:10px 0}.required-consent{border-color:rgba(215,176,91,.24)}.account-submit{width:100%;text-align:center;margin-top:8px}.form-status{min-height:24px;color:#edd79b;font-size:.88rem;margin-bottom:0}.code-input{text-align:center;font-size:1.45rem;letter-spacing:.24em}.text-button{display:block;margin:14px auto 0}.modal-open{overflow:hidden} .avatar-nav-callout{display:inline-flex;align-items:center;gap:8px}.avatar-nav-callout:before{content:"✦";font-size:.9em} @media(max-width:800px){.avatar-layout{grid-template-columns:1fr}.avatar-preview-card{position:relative;top:auto}.avatar-hero{padding-top:48px}.avatar-preview-card,.avatar-controls-card{padding:18px}.account-modal{padding:26px 20px}} /* Avatar Studio v005 — icon carousel creator */ .compact-avatar-hero{padding-bottom:22px}.rich-builder-section{padding:28px 0 80px}.rich-avatar-shell{max-width:760px}.rich-avatar-card{position:relative!important;top:auto!important;padding:20px 20px 24px}.avatar-preview-top>div{display:flex;align-items:center;gap:10px;min-width:0}.avatar-mode-label{color:#a9a296;font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tiny-icon-button,.save-check-button{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(215,176,91,.3);background:#0d0d10;color:var(--cream);font-size:1.35rem;font-weight:900;cursor:pointer;box-shadow:0 8px 22px rgba(0,0,0,.25)}.tiny-icon-button:hover,.save-check-button:hover{border-color:var(--gold);transform:translateY(-1px)} .rich-avatar-card .avatar-stage{max-width:540px;margin:0 auto;border-radius:28px}.category-loop-wrap,.option-loop-wrap{position:relative;margin-top:18px}.icon-loop,.option-loop{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:6px 42px 10px;-webkit-overflow-scrolling:touch}.icon-loop::-webkit-scrollbar,.option-loop::-webkit-scrollbar{display:none}.category-icon,.option-chip{flex:0 0 auto;scroll-snap-align:center;border:1px solid rgba(215,176,91,.16);background:#0c0c0f;color:#d9d2c5;border-radius:18px;min-width:82px;height:82px;padding:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;transition:.18s ease}.category-icon svg,.option-chip svg{width:31px;height:31px;fill:none;stroke:currentColor;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}.category-icon span,.option-chip span{font-size:.69rem;font-weight:800;max-width:75px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.category-icon.active,.option-chip.selected{background:linear-gradient(145deg,#ead899,#c79c43);color:#111;border-color:#f0d797;box-shadow:0 6px 24px rgba(215,176,91,.2)}.carousel-nudge{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:34px;height:48px;border:0;border-radius:14px;background:rgba(8,8,10,.88);color:#d7b05b;font-size:2rem;line-height:1;cursor:pointer;backdrop-filter:blur(6px)}.carousel-nudge.left{left:0}.carousel-nudge.right{right:0}.option-drawer{margin-top:8px;padding:14px 8px 4px;border-radius:20px;background:linear-gradient(180deg,rgba(215,176,91,.07),rgba(255,255,255,.015));border:1px solid rgba(215,176,91,.14);animation:drawerIn .2s ease}.option-drawer[hidden]{display:none}.option-drawer-head{display:flex;justify-content:space-between;align-items:center;padding:0 10px;color:#ddd4c6}.option-drawer-head>span:first-child{font-weight:900}.option-drawer-head>span:last-child{font-size:.72rem;color:#8f897f}.option-loop{padding-left:38px;padding-right:38px}.option-chip{min-width:76px;height:76px;border-radius:16px}.option-swatch{width:32px;height:32px;border-radius:50%;background:var(--sw);border:2px solid rgba(255,255,255,.5);box-shadow:inset 0 0 0 2px rgba(0,0,0,.2)}@keyframes drawerIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}} .icon-actions{justify-content:center;position:relative}.save-check-button{background:var(--gold);color:#111;border-color:var(--soft-gold);width:56px;height:56px;font-size:1.75rem}.reset-round{width:42px;height:42px;align-self:center}.save-toast{position:absolute;left:50%;top:-40px;transform:translate(-50%,8px);background:#111;color:#f3ddb0;border:1px solid rgba(215,176,91,.38);padding:8px 15px;border-radius:999px;font-weight:900;opacity:0;pointer-events:none;transition:.25s ease}.save-toast.show{opacity:1;transform:translate(-50%,0)}.rich-avatar-card .save-note{text-align:center}.avatar-nav-icon{width:44px;height:44px!important;padding:0!important;border-radius:50%!important;overflow:hidden;border:2px solid rgba(215,176,91,.55)!important;background:#111!important;display:grid!important;place-items:center}.avatar-nav-live,.avatar-nav-live svg{display:block;width:100%;height:100%}.avatar-nav-icon:hover{transform:scale(1.05)} @media(max-width:800px){.compact-avatar-hero{padding:36px 0 18px}.compact-avatar-hero h1{font-size:clamp(2.6rem,12vw,4rem)}.rich-builder-section{padding-top:18px}.rich-avatar-card{padding:14px 10px 22px;border-left:0;border-right:0;border-radius:0}.rich-avatar-shell{padding:0}.rich-avatar-card .avatar-stage{border-radius:22px}.category-icon{min-width:76px;height:76px}.option-chip{min-width:72px;height:72px}.carousel-nudge{display:none}.icon-loop,.option-loop{padding-left:14vw;padding-right:14vw}.avatar-nav-icon{width:40px!important;height:40px!important}} /* Avatar Studio v006 — expanded hair/color/pattern creator */ .brand{font-size:.78rem;opacity:.76;letter-spacing:.075em;gap:7px} .brand img{width:34px;height:34px} nav{min-height:62px} .pattern-swatch{background-size:100% 100%!important} .pattern-swatch.cheetah{background:radial-gradient(circle at 25% 25%,#21160f 0 13%,transparent 14%),radial-gradient(circle at 72% 65%,#2a1b12 0 17%,transparent 18%),#d6a64b} .pattern-swatch.zebra{background:repeating-linear-gradient(70deg,#f6f2eb 0 7px,#111116 7px 13px,#f6f2eb 13px 20px)} .pattern-swatch.hearts{background-color:#f3c3d4;background-image:radial-gradient(circle at 35% 38%,#a32645 0 18%,transparent 19%),radial-gradient(circle at 63% 38%,#a32645 0 18%,transparent 19%),linear-gradient(45deg,transparent 43%,#a32645 44% 61%,transparent 62%);background-size:22px 22px} .pattern-swatch.dalmatian{background:radial-gradient(circle at 28% 30%,#111 0 16%,transparent 17%),radial-gradient(ellipse at 72% 70%,#111 0 18%,transparent 19%),#f5f2ec} .option-chip[title="Clear / Brain Light"] .option-swatch{background:rgba(210,240,255,.22)} .category-icon[title="Hair Color"] svg{stroke:#e9ca76;fill:rgba(215,176,91,.09)} .category-icon[title="Skin"] svg{stroke:#d8a886;fill:rgba(201,134,98,.08)} @media(max-width:800px){.brand{font-size:.62rem;opacity:.68;max-width:145px;line-height:1.1}.brand img{width:30px;height:30px}nav{min-height:56px}.category-icon span,.option-chip span{font-size:.64rem}.option-chip{min-width:78px}} /* v007 — home logo splash + returning-member welcome */ html.splash-lock,html.splash-lock body{overflow:hidden} .home-splash{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:radial-gradient(circle at 50% 45%,#211a10 0,#0b0b0d 46%,#050506 100%);opacity:1;visibility:visible;transition:opacity .68s ease,visibility .68s ease} .home-splash:before,.home-splash:after{content:"";position:absolute;inset:0;pointer-events:none} .home-splash:before{background:radial-gradient(circle at 50% 50%,rgba(215,176,91,.2),transparent 35%);animation:splashGlow 1.7s ease-in-out both} .home-splash:after{background-image:radial-gradient(circle,rgba(255,231,167,.72) 0 1px,transparent 1.8px);background-size:72px 72px;opacity:.16;animation:splashDrift 2.6s linear both} .home-splash-logo{position:relative;z-index:2;width:min(58vw,290px);aspect-ratio:1;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(215,176,91,.36),0 0 55px rgba(215,176,91,.16);opacity:0;transform:scale(.72) rotate(-3deg);filter:brightness(.78);transition:opacity .52s ease,transform 1.35s cubic-bezier(.18,.8,.2,1),filter 1s ease} .home-splash.playing .home-splash-logo{opacity:1;transform:scale(1) rotate(0);filter:brightness(1.08)} .home-splash.leaving{opacity:0;visibility:hidden} .home-splash.leaving .home-splash-logo{transform:scale(1.08);filter:brightness(1.18)} @keyframes splashGlow{0%{opacity:0;transform:scale(.7)}55%{opacity:1}100%{opacity:.4;transform:scale(1.3)}} @keyframes splashDrift{from{background-position:0 0}to{background-position:36px 72px}} .welcome-back-toast{position:fixed;z-index:9000;left:50%;top:max(22px,env(safe-area-inset-top));transform:translate(-50%,-18px) scale(.97);width:min(calc(100% - 34px),440px);padding:16px 20px;border-radius:18px;text-align:center;background:rgba(17,17,20,.94);color:#f8ecd1;border:1px solid rgba(215,176,91,.46);box-shadow:0 18px 55px rgba(0,0,0,.42),0 0 26px rgba(215,176,91,.09);backdrop-filter:blur(14px);font-family:Georgia,"Times New Roman",serif;font-size:1.05rem;font-weight:700;letter-spacing:.015em;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .42s ease,transform .42s ease,visibility .42s ease} .welcome-back-toast.show{opacity:1;visibility:visible;transform:translate(-50%,0) scale(1)} .welcome-back-toast.fade{opacity:0;transform:translate(-50%,-8px) scale(.985)} @media (prefers-reduced-motion:reduce){.home-splash-logo,.home-splash,.welcome-back-toast{transition-duration:.15s!important;animation:none!important}} /* v008 — touch/click star sprinkler + shop promos */ .gg-touch-spark{position:fixed;z-index:12000;pointer-events:none;left:0;top:0;color:#f7df91;text-shadow:0 0 8px rgba(255,224,130,.9),0 0 18px rgba(215,176,91,.72);font-size:clamp(12px,2.2vw,21px);line-height:1;transform:translate(-50%,-50%);animation:ggSparkFly .78s cubic-bezier(.18,.72,.2,1) var(--delay,0ms) forwards;will-change:transform,opacity} @keyframes ggSparkFly{0%{opacity:0;transform:translate(-50%,-50%) scale(.35) rotate(0)}18%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.05) rotate(var(--rot))}} .top-shop-icon{width:42px;height:42px!important;min-width:42px;padding:0!important;border-radius:50%!important;display:inline-grid!important;place-items:center;border:1px solid rgba(215,176,91,.45)!important;background:rgba(215,176,91,.08)!important;color:#efd38a!important;font-size:1.45rem!important;line-height:1;transform:rotate(45deg)} .top-shop-icon span{display:block;transform:rotate(-45deg);font-size:0} .top-shop-icon span:before{content:"🛍";font-size:1.05rem;filter:grayscale(.15)} .top-shop-icon:hover{background:rgba(215,176,91,.2)!important;transform:rotate(45deg) scale(1.05)!important} .shop-promo-shell{margin:38px 0 0;padding:22px;border:1px solid rgba(215,176,91,.18);border-radius:24px;background:rgba(11,11,14,.52);overflow:hidden} .shop-promo-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:16px}.shop-promo-head h3{margin:4px 0 0;font-size:clamp(1.45rem,3vw,2.2rem)}.shop-promo-link{color:#efd38a;font-weight:900;text-decoration:none;white-space:nowrap} .shop-promo-track{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}.shop-promo-track::-webkit-scrollbar{display:none} .shop-promo-slide{position:relative;isolation:isolate;flex:0 0:min(82vw,430px);min-height:220px;border-radius:22px;overflow:hidden;scroll-snap-align:center;text-decoration:none;color:#fff;padding:24px;display:flex;flex-direction:column;justify-content:end;border:1px solid rgba(255,255,255,.12);box-shadow:0 18px 44px rgba(0,0,0,.28);background-image:linear-gradient(180deg,rgba(4,4,6,.12),rgba(4,4,6,.88)),url("grim-goldie-logo.jpg");background-size:cover;background-position:center} .shop-promo-slide:after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 75% 20%,rgba(215,176,91,.38),transparent 36%)} .promo-style{background-position:35% 50%;filter:saturate(.88)}.promo-deals{background-position:70% 50%}.promo-eyebrow{display:inline-block;width:max-content;margin-bottom:7px;padding:6px 10px;border-radius:999px;background:rgba(215,176,91,.92);color:#111;font-size:.72rem;font-weight:950;letter-spacing:.06em;text-transform:uppercase}.shop-promo-slide strong{font-size:1.65rem}.shop-promo-slide small{font-size:.9rem;color:#e8e1d4;margin-top:5px} .shop-promo-dots{display:flex;justify-content:center;gap:7px;margin-top:14px}.shop-promo-dots button{width:8px;height:8px;border-radius:50%;border:0;padding:0;background:rgba(255,255,255,.25)}.shop-promo-dots button.active{width:22px;border-radius:99px;background:#d7b05b}.shop-promo-hint{text-align:center;font-size:.72rem;color:#8f897f;margin:8px 0 0} @media(max-width:800px){.top-shop-icon{width:38px!important;height:38px!important;min-width:38px}.shop-promo-shell{margin-left:-4px;margin-right:-4px;padding:14px}.shop-promo-slide{flex-basis:86vw;min-height:190px;padding:19px}} /* v009 animated avatar extras */ .avatar-bees .bee{animation:beeOrbit 3.8s linear infinite;transform-origin:210px 175px}.avatar-bees .bee-1{animation-delay:-.95s}.avatar-bees .bee-2{animation-delay:-1.9s}.avatar-bees .bee-3{animation-delay:-2.85s}@keyframes beeOrbit{0%{transform:translate(105px,125px) rotate(0)}25%{transform:translate(310px,145px) rotate(12deg)}50%{transform:translate(285px,275px) rotate(-8deg)}75%{transform:translate(115px,250px) rotate(10deg)}100%{transform:translate(105px,125px) rotate(0)}} .snake-hair path{animation:snakeWiggle 1.7s ease-in-out infinite;transform-origin:center}.snake-hair path:nth-child(2){animation-delay:-.4s}.snake-hair path:nth-child(3){animation-delay:-.8s}.snake-hair path:nth-child(4){animation-delay:-1.2s}@keyframes snakeWiggle{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(4deg)}} .halo-flames path{transform-origin:center bottom;animation:haloFire .48s ease-in-out infinite alternate}.halo-flames path:nth-child(2){animation-delay:-.18s}.halo-flames path:nth-child(3){animation-delay:-.31s}@keyframes haloFire{from{transform:scaleY(.82) translateY(4px);opacity:.75}to{transform:scaleY(1.18) translateY(-3px);opacity:1}} /* v010 avatar animations */ #eyesWhite,#eyes{transform-box:fill-box;transform-origin:center;animation:avatarBlink 8s infinite} @keyframes avatarBlink{0%,94%,98%,100%{transform:scaleY(1)}95%,97%{transform:scaleY(.08)}} .fire-hair{fill:#ff7a18!important;stroke:#ffb000!important;filter:drop-shadow(0 0 10px #ff6a00);transform-box:fill-box;transform-origin:center bottom;animation:fireHairFlicker .45s ease-in-out infinite alternate} @keyframes fireHairFlicker{from{transform:scaleY(.96) skewX(-1deg);filter:drop-shadow(0 0 7px #ff6a00)}to{transform:scaleY(1.05) skewX(2deg);filter:drop-shadow(0 0 15px #ffb000)}} /* v011 avatar additions */ .googly-pupil{transform-box:fill-box;transform-origin:center;animation:googlyRoll 2.2s linear infinite} .googly-pupil.right{animation-direction:reverse;animation-duration:1.75s} @keyframes googlyRoll{to{transform:rotate(360deg)}} /* v012 avatar realism upgrades */ #hairLayer,#hairBack{filter:drop-shadow(0 6px 5px rgba(0,0,0,.20)) drop-shadow(0 1px 0 rgba(255,255,255,.16));} #hairFront,#hairBack{stroke-linejoin:round;} .fire-hair{fill:url(#fireHairGradient)!important;stroke:#ffb640!important;filter:drop-shadow(0 0 8px #ff4d00) drop-shadow(0 0 18px rgba(255,172,28,.7))!important;animation:fireHairReal .33s ease-in-out infinite alternate!important} @keyframes fireHairReal{0%{transform:translateY(2px) scaleY(.97) skewX(-1deg)}50%{transform:translateY(-2px) scaleY(1.04) skewX(1deg)}100%{transform:translateY(1px) scaleY(1.01) skewX(-2deg)}} .halo-flames{transform-box:fill-box;transform-origin:center bottom;filter:drop-shadow(0 0 7px #ff4d00);animation:haloReal .28s ease-in-out infinite alternate} @keyframes haloReal{from{transform:scaleY(.92) translateY(2px);opacity:.82}to{transform:scaleY(1.12) translateY(-3px);opacity:1}} .chameleon-pupil{transform-box:fill-box;transform-origin:center;animation:chameleonLook 3.2s ease-in-out infinite alternate} .chameleon-pupil.right{animation-delay:-1.6s;animation-direction:alternate-reverse} @keyframes chameleonLook{0%{transform:translate(-7px,-5px)}35%{transform:translate(7px,-2px)}65%{transform:translate(-2px,7px)}100%{transform:translate(6px,5px)}} /* v013 avatar fit, animation, and category upgrades */ #hairLayer,#hairBack{transform-box:fill-box;transform-origin:center top;} #hairLayer{filter:drop-shadow(0 8px 5px rgba(0,0,0,.24)) drop-shadow(0 1px 0 rgba(255,255,255,.14));} #hairFront{filter:drop-shadow(0 3px 1px rgba(0,0,0,.18));} #dreads path,#braids path{filter:drop-shadow(2px 4px 2px rgba(0,0,0,.22));} .pulse-eyes{transform-box:fill-box;transform-origin:center;animation:avatarEyePulse 2.1s cubic-bezier(.42,0,.22,1) infinite;} @keyframes avatarEyePulse{0%,100%{transform:scale(.96)}50%{transform:scale(1.05)}} .googly-pupil{animation:googlyOrbit 1.8s linear infinite;transform-box:fill-box;transform-origin:center}.googly-pupil.right{animation-direction:reverse;animation-duration:1.35s} @keyframes googlyOrbit{0%{transform:translate(0,-7px)}25%{transform:translate(7px,0)}50%{transform:translate(0,7px)}75%{transform:translate(-7px,0)}100%{transform:translate(0,-7px)}} .avatar-butterfly{transform-origin:center;filter:drop-shadow(0 2px 3px rgba(0,0,0,.25));transition:transform .9s cubic-bezier(.25,.8,.25,1)} .avatar-butterfly.flying{animation:butterflyFlutter .34s ease-in-out infinite alternate, butterflyDrift 7s ease-in-out forwards;} .avatar-butterfly.landed{animation:butterflyRest .8s ease-in-out infinite alternate;} @keyframes butterflyFlutter{from{scale:.55 .88}to{scale:.9 .55}} @keyframes butterflyDrift{0%{transform:translate(65px,290px) scale(.65) rotate(-10deg)}20%{transform:translate(300px,105px) scale(.72) rotate(12deg)}45%{transform:translate(95px,125px) scale(.62) rotate(-15deg)}70%{transform:translate(320px,250px) scale(.7) rotate(14deg)}100%{transform:translate(205px,135px) scale(.62)}} @keyframes butterflyRest{from{opacity:.92}to{opacity:1}} .zipper-eyes{filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))} .category-icon.wardrobe-child{border-color:rgba(120,180,255,.28);background:linear-gradient(180deg,rgba(80,130,190,.10),#0c0c0f)} .category-icon.wardrobe-child span{color:#bfdcff} /* v015 Wardrobe zoom + idle personality */ .avatar-stage svg{transform-origin:50% 48%;transition:transform .38s cubic-bezier(.2,.8,.2,1)} .avatar-stage:not(.wardrobe-view) svg{transform:scale(1.18) translateY(3%)} .avatar-stage.wardrobe-view svg{transform:scale(.72) translateY(-3%)} .idle-fly{animation:idleFly 2.2s ease-in-out infinite alternate;transform-origin:210px 150px} .idle-tear{animation:idleTear 1.8s ease-in infinite} .idle-sleep text{animation:idleZ 1.8s ease-in-out infinite alternate} .idle-wrinkles{animation:wrinkleIn 1.4s ease both} @keyframes idleFly{0%{transform:translate(-68px,-38px) rotate(-8deg)}35%{transform:translate(58px,-18px) rotate(8deg)}70%{transform:translate(-22px,52px) rotate(-5deg)}100%{transform:translate(72px,38px) rotate(9deg)}} @keyframes idleTear{0%{transform:translateY(-4px);opacity:0}20%{opacity:1}100%{transform:translateY(52px);opacity:0}} @keyframes idleZ{from{opacity:.45;transform:translateY(4px)}to{opacity:1;transform:translateY(-6px)}} @keyframes wrinkleIn{from{opacity:0}to{opacity:.78}} /* v017: layered hair composition — back hair behind body, front hair above head */ #backHairLayer{filter:drop-shadow(0 7px 5px rgba(0,0,0,.24));} #backHairLayer #hairBack{stroke-linejoin:round;} #backHairLayer #dreads,#backHairLayer #braids{filter:drop-shadow(0 3px 2px rgba(0,0,0,.22));} /* v021 polished Avatar Studio controls */ .avatar-polish-controls{display:flex;gap:7px;align-items:center;flex-wrap:wrap;justify-content:flex-end} .avatar-polish-controls .tiny-icon-button{min-width:38px} body.avatar-page #randomizeBtn.gg-randomizing-v986{animation:ggDiceRollV986 .5s cubic-bezier(.2,.85,.25,1)} @keyframes ggDiceRollV986{0%{transform:rotate(0) scale(1)}45%{transform:rotate(190deg) scale(1.14)}100%{transform:rotate(360deg) scale(1)}} .preset-btn{font-size:1.05rem} .grim-preset{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)} .goldie-preset{box-shadow:inset 0 0 0 1px rgba(215,176,91,.35)} #undoBtn:disabled,#redoBtn:disabled{opacity:.34;cursor:default} @keyframes ggShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}} @keyframes ggBounce{0%,100%{transform:translateY(0)}45%{transform:translateY(-8px)}} @keyframes ggSparkPop{0%{opacity:0;transform:scale(.3)}35%{opacity:1;transform:scale(1.15)}100%{opacity:0;transform:scale(.8) translateY(-10px)}} .avatar-stage.gg-shake #avatarSvg{animation:ggShake .55s ease-in-out} .avatar-stage.gg-bounce #avatarSvg{animation:ggBounce .6s ease-in-out} #reactionEffect .reaction-spark{transform-origin:center;animation:ggSparkPop 1.1s ease-out forwards} /* v022 Avatar Card social sharing */ .avatar-card-actions{display:flex;flex-direction:column;gap:10px;align-items:center;margin-top:14px} .share-avatar-card-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(215,176,91,.55);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:999px;padding:10px 16px;font-weight:700;letter-spacing:.02em;} .share-avatar-card-btn:active{transform:scale(.98)} .social-share-fallbacks{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:720px} .social-share-fallbacks button{border:1px solid rgba(255,255,255,.14);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:999px;padding:8px 12px;font-size:.9rem;} .avatar-share-toast{position:fixed;left:50%;bottom:92px;transform:translateX(-50%);z-index:99999;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border:1px solid rgba(215,176,91,.5);border-radius:999px;padding:9px 14px;opacity:0;transition:opacity .25s ease;pointer-events:none;} .avatar-share-toast.show{opacity:1} /* v023 Avatar of the Day + public avatar consent */ .avatar-of-day-section{padding:36px 18px 48px} .avatar-of-day-shell{max-width:1050px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,420px);gap:28px;align-items:center;padding:26px;border:1px solid rgba(215,176,91,.28);border-radius:28px;background:linear-gradient(145deg,rgba(10,9,12,.84),rgba(31,25,22,.78));box-shadow:0 18px 60px rgba(0,0,0,.28)} .avatar-of-day-copy .eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.75rem;color:#d7b05b} .avatar-of-day-copy h2{margin:.4rem 0 .7rem;font-size:clamp(1.8rem,5vw,3rem)} .avatar-of-day-copy p{margin:0;color:rgba(255,255,255,.72);line-height:1.6} .avatar-of-day-card{position:relative;min-height:390px;border-radius:24px;overflow:hidden;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid rgba(255,255,255,.09);display:flex;align-items:center;justify-content:center;color:#181818;} .avatar-of-day-card img{width:100%;height:100%;min-height:390px;object-fit:cover} .avatar-of-day-placeholder{padding:34px;text-align:center;display:flex;flex-direction:column;gap:10px;align-items:center;color:rgba(255,255,255,.78)} .avatar-of-day-orb{font-size:3rem;filter:drop-shadow(0 6px 12px rgba(0,0,0,.45))} .avatar-of-day-meta{position:absolute;left:14px;right:14px;bottom:14px;border-radius:16px;padding:12px 14px;background:rgba(8,7,10,.78);backdrop-filter:blur(12px);display:flex;justify-content:space-between;gap:10px;align-items:center} .avatar-of-day-meta span{font-size:.85rem;color:#d7b05b} .world-public-btn[aria-pressed="true"]{box-shadow:0 0 0 2px rgba(91,190,255,.45),0 0 20px rgba(91,190,255,.25)} .public-avatar-modal{position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,.72);display:grid;place-items:center;padding:20px} .public-avatar-dialog{width:min(92vw,500px);border-radius:26px;padding:26px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid rgba(215,176,91,.35);box-shadow:0 28px 80px rgba(0,0,0,.55);text-align:center;color:#181818;} .public-avatar-dialog h2{margin:.5rem 0 .8rem} .public-avatar-dialog p{color:rgba(255,255,255,.76);line-height:1.6} .public-avatar-icon{font-size:3rem} .public-avatar-actions{display:flex;gap:10px;justify-content:center;margin-top:18px} .public-avatar-actions button{min-width:120px;border-radius:999px;padding:10px 16px} .public-avatar-actions .primary{background:#d7b05b;color:#151116;border:0} .public-avatar-actions .secondary{background:#211c25;color:#fff;border:1px solid rgba(255,255,255,.15)} @media(max-width:760px){.avatar-of-day-shell{grid-template-columns:1fr}.avatar-of-day-card{min-height:320px}.avatar-of-day-card img{min-height:320px}} /* v025 favorites, moods, saved looks, card formats */ .option-title-row{display:flex;align-items:center;justify-content:space-between;gap:10px} #favoriteOptionBtn.is-favorite{color:#ff6b9d;border-color:rgba(255,107,157,.5)} .avatar-utility-panel{display:grid;gap:12px;margin:16px 0;padding:14px;border:1px solid rgba(215,176,91,.2);border-radius:18px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;} .utility-block{display:grid;gap:8px} .utility-block>strong{font-size:.82rem;text-transform:uppercase;letter-spacing:.1em;color:#d7b05b} .utility-block small{color:rgba(255,255,255,.55)} .avatar-mood-controls,.saved-look-slots,.share-format-controls{display:flex;gap:7px;flex-wrap:wrap} .avatar-mood-controls button,.saved-look-slots button,.share-format-controls button{border:1px solid rgba(255,255,255,.12);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:999px;padding:7px 11px;} .avatar-mood-controls button.selected,.share-format-controls button.selected{border-color:#d7b05b;box-shadow:0 0 0 1px rgba(215,176,91,.22)} .saved-look-slots button.has-look{border-color:#d7b05b;color:#d7b05b} #moodEffect{pointer-events:none} /* v026 moods: emoji pops up for 3 seconds and fades away; avatar face is unchanged */ .mood-popup{ position:absolute; z-index:120; left:50%; top:22%; transform:translate(-50%,-50%) scale(.72); font-size:clamp(3rem,10vw,5.5rem); opacity:0; pointer-events:none; filter:drop-shadow(0 8px 18px rgba(0,0,0,.45)); } .mood-popup.show{ animation:ggMoodPop 3s ease forwards; } @keyframes ggMoodPop{ 0%{opacity:0;transform:translate(-50%,-50%) scale(.55)} 10%{opacity:1;transform:translate(-50%,-50%) scale(1.08)} 18%{transform:translate(-50%,-50%) scale(1)} 78%{opacity:1;transform:translate(-50%,-54%) scale(1)} 100%{opacity:0;transform:translate(-50%,-68%) scale(.92)} } .avatar-mood-controls button.selected{border-color:rgba(255,255,255,.12)!important;box-shadow:none!important} /* v027 expansion */ .goldie-photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.goldie-photo-card{margin:0;background:#121216;border:1px solid rgba(215,176,91,.22);border-radius:18px;overflow:hidden}.goldie-photo-card img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}.goldie-photo-card figcaption{padding:12px 14px;color:#d8d1c5;font-size:.9rem} .avatar-account-name{text-align:center;font-weight:900;letter-spacing:.08em;color:#f1ddb0;margin:4px 0 8px}.avatar-room-dock{position:fixed;z-index:90;right:18px;bottom:82px;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#17171b;border:1px solid rgba(215,176,91,.5);color:#f4f0e7;font-size:27px;box-shadow:0 10px 30px rgba(0,0,0,.35)} .gg-kind-toast{position:fixed;z-index:999;left:50%;top:18px;transform:translate(-50%,-20px);opacity:0;pointer-events:none;background:#17171b;color:#fff5e7;border:1px solid #d7b05b;border-radius:999px;padding:11px 16px;transition:.25s}.gg-kind-toast.show{opacity:1;transform:translate(-50%,0)} .room-main{padding:42px 0 90px}.room-toolbar{display:flex;justify-content:space-between;gap:16px;align-items:end;margin-bottom:18px}.room-tools{display:flex;gap:8px}.room-tools button,.room-option-drawer button{border:1px solid rgba(215,176,91,.35);background:#17171b;color:#f4f0e7;border-radius:12px;padding:12px 14px}.level-meter{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.level-meter>div{width:180px;height:10px;border-radius:99px;background:#2a2a31;overflow:hidden}.level-meter i{display:block;height:100%;background:linear-gradient(90deg,#d7b05b,#fff0aa);width:0}.avatar-room{position:relative;min-height:560px;border-radius:24px;overflow:hidden;border:1px solid rgba(215,176,91,.3);background:#111}.room-scene-layer,.room-wall-layer,.room-floor,.dust-layer,.cobweb-layer{position:absolute;inset:0}.room-scene-layer{z-index:1}.room-wall-layer{z-index:2;background:#29292f;clip-path:polygon(0 0,100% 0,100% 72%,0 72%)}.room-window{position:absolute;width:32%;height:38%;left:34%;top:14%;border:16px solid #211d20;background:transparent;box-shadow:inset 0 0 0 3px #6f5c48}.room-floor{z-index:3;top:72%;background:linear-gradient(165deg,#4b3b32,#1f1a18)}.room-avatar{position:absolute;z-index:5;left:50%;bottom:72px;transform:translateX(-50%);text-align:center}.room-avatar .avatar-nav-live{width:150px;height:150px;display:block}.room-avatar strong{display:block;margin-top:4px;color:#fff}.cobweb-layer{z-index:8;pointer-events:none}.cobweb-layer span{position:absolute;font-size:72px;top:-8px}.cobweb-layer span:nth-child(2){right:0;transform:scaleX(-1)}.dust-layer{z-index:7;pointer-events:none}.dust-layer i{position:absolute;width:80px;height:14px;border-radius:50%;background:rgba(210,200,185,.22);filter:blur(4px);bottom:45px}.dust-layer i:nth-child(2){left:20%;bottom:90px}.dust-layer i:nth-child(3){right:12%}.dust-layer i:nth-child(4){left:45%;bottom:35px}.dust-layer i:nth-child(5){right:38%;bottom:115px}.brush-btn.needs-cleaning{animation:brushNotice 1s infinite}@keyframes brushNotice{50%{transform:scale(1.15);box-shadow:0 0 18px #d7b05b}}.room-option-drawer{display:flex;gap:8px;overflow:auto;padding:14px 0}.room-option-drawer[hidden]{display:none}.daily-card{margin-top:22px;padding:22px;border:1px solid rgba(215,176,91,.25);border-radius:18px;background:#141419}.room-scene-night .room-scene-layer{background:radial-gradient(circle at 70% 20%,#d6e5ff 0 3%,transparent 4%),linear-gradient(#10152c,#3d3150)}.room-scene-forest .room-scene-layer{background:linear-gradient(#5d8b74,#163c2d)}.room-scene-sunset .room-scene-layer{background:linear-gradient(#ffad79,#7f4f85)}.room-scene-space .room-scene-layer{background:radial-gradient(circle,#fff 0 1px,transparent 2px) 0 0/34px 34px,#090b1e}.room-scene-city .room-scene-layer{background:linear-gradient(#25354f 55%,#10131b 55%)}.room-wall-goth .room-wall-layer{background:linear-gradient(90deg,#19171c,#312631)}.room-wall-goldie .room-wall-layer{background:linear-gradient(135deg,#ffd4ea,#f1e2ff)}.room-wall-brick .room-wall-layer{background:repeating-linear-gradient(0deg,#5d4037 0 24px,#2b211f 25px 29px)}.room-wall-stars .room-wall-layer{background:radial-gradient(circle at 20% 20%,#ffd75a 0 3px,transparent 4px) 0 0/70px 70px,#25304b}.golden-name #roomAvatarName,.golden-name #roomOwnerName{background:linear-gradient(90deg,#fff1a6,#d9a82e,#fff7c7);background-size:200%;-webkit-background-clip:text;color:transparent;animation:goldShine 2s linear infinite}@keyframes goldShine{to{background-position:200%}} @media(max-width:760px){.goldie-photo-grid{grid-template-columns:repeat(2,1fr)}.room-toolbar{align-items:flex-start;flex-direction:column}.avatar-room{min-height:500px}} /* v028 launch polish */ .gg-tutorial{position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.78);display:grid;place-items:center;padding:18px;backdrop-filter:blur(8px)}.gg-tutorial-card{position:relative;width:min(480px,100%);background:#151519;border:1px solid rgba(215,176,91,.4);border-radius:24px;padding:30px;text-align:center;box-shadow:0 30px 100px #000}.tutorial-close,.booking-x{position:absolute;right:14px;top:10px;border:0;background:transparent;color:#fff;font-size:2rem}.tutorial-icon{font-size:3rem}.tutorial-actions{display:flex;gap:10px;justify-content:center}.tutorial-actions button,.random-lock-row button,.avatar-launch-settings button{border:1px solid rgba(215,176,91,.35);background:#202026;color:#fff;border-radius:999px;padding:9px 13px}.random-lock-panel{margin:18px 0;padding:14px;border:1px solid rgba(215,176,91,.24);border-radius:16px;background:#121217}.random-lock-panel>div:first-child{display:flex;gap:9px;align-items:baseline;flex-wrap:wrap}.random-lock-panel small,.avatar-launch-settings small{color:#aaa}.random-lock-row{display:flex;gap:7px;overflow:auto;padding-top:10px}.random-lock-row button{white-space:nowrap}.random-lock-row button.active{background:#d7b05b;color:#111}.avatar-launch-settings{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px}.auto-save-status{opacity:0;transform:translateY(4px);transition:.2s;color:#d7b05b;font-weight:800}.auto-save-status.show{opacity:1;transform:none}.booking-modal[hidden]{display:none}.booking-modal{position:fixed;inset:0;z-index:290;display:grid;place-items:center;padding:18px}.booking-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.76);backdrop-filter:blur(8px)}.booking-card{position:relative;z-index:2;width:min(580px,100%);background:#141418;border:1px solid rgba(215,176,91,.35);border-radius:24px;padding:26px}.booking-types{display:grid;grid-template-columns:1fr 1fr;gap:10px}.booking-types button{display:grid;gap:6px;text-align:left;background:#1d1d23;color:#fff;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:16px}.booking-types button.active{border-color:#d7b05b;box-shadow:0 0 0 2px rgba(215,176,91,.15)}.booking-types span{color:#aaa;font-size:.85rem}.booking-details{margin-top:14px;display:grid;gap:10px}.booking-details[hidden]{display:none}.booking-details label{display:grid;gap:5px;color:#ddd}.booking-details input{padding:11px;border-radius:10px;border:1px solid #444;background:#0d0d10;color:#fff}.goldie-photo-grid.launch-masonry{columns:3 230px;display:block}.goldie-photo-grid.launch-masonry .goldie-photo-card{break-inside:avoid;margin:0 0 16px;cursor:zoom-in}.goldie-photo-grid.launch-masonry .goldie-photo-card img{aspect-ratio:auto}.goldie-lightbox{position:fixed;inset:0;z-index:280;background:rgba(0,0,0,.92);display:grid;place-items:center;padding:20px}.goldie-lightbox[hidden]{display:none}.goldie-lightbox img{max-width:92vw;max-height:88vh;object-fit:contain;border-radius:14px}.goldie-lightbox button{position:absolute;right:18px;top:14px;border:0;background:#111a;color:#fff;font-size:2.2rem;border-radius:50%;width:48px;height:48px}.room-inventory{margin-top:20px;border:1px solid rgba(215,176,91,.25);border-radius:18px;padding:18px;background:#141419}.inventory-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.inventory-slot{min-height:82px;border:1px dashed rgba(215,176,91,.35);border-radius:12px;display:grid;place-items:center;text-align:center;color:#aaa;padding:8px}.streak-badge{display:inline-flex;gap:5px;align-items:center;padding:5px 9px;border-radius:999px;background:#261b12;color:#ffd67a;font-weight:800}@media(max-width:650px){.booking-types{grid-template-columns:1fr}.goldie-photo-grid.launch-masonry{columns:2 145px}.inventory-slots{grid-template-columns:repeat(2,1fr)}} /* v029 navigation + room/save polish */ .room-nav-icon,.save-room-button{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:2px solid rgba(215,176,91,.55);background:#17171b;color:#f4f0e7;font-size:24px;line-height:1;text-decoration:none;flex:0 0 auto}.room-nav-icon:hover,.save-room-button:hover{transform:scale(1.05)}.save-room-button{width:56px;height:56px;font-size:28px}.avatar-actions.icon-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.room-studio-card{margin-top:18px}.room-studio-card .avatar-preview-top{margin-bottom:14px}.room-category-loop,.room-option-loop{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;overscroll-behavior-inline:contain;padding:7px 14vw 12px;scroll-snap-type:x proximity}.room-category-loop::-webkit-scrollbar,.room-option-loop::-webkit-scrollbar{display:none}.room-category-icon,.room-option-chip{border:1px solid rgba(215,176,91,.28);background:#17171b;color:#eee;border-radius:18px;display:grid;place-items:center;gap:5px;flex:0 0 auto;scroll-snap-align:center}.room-category-icon{width:82px;height:82px;font-size:27px}.room-category-icon span,.room-option-chip span{font-size:.72rem;font-weight:800}.room-category-icon.active,.room-option-chip.selected{border-color:#d7b05b;box-shadow:0 0 0 2px rgba(215,176,91,.15);background:#242019}.room-option-chip{min-width:82px;height:78px;padding:8px 10px;font-size:23px}.room-studio-drawer[hidden]{display:none}.room-studio-drawer{margin-top:12px;padding:12px 0;border-radius:18px;background:#101014;border:1px solid rgba(215,176,91,.2)}.room-drawer-head{display:flex;justify-content:space-between;align-items:center;padding:0 14px 8px;color:#ddd4c6}.room-drawer-head small{color:#8f897f}.room-floor-darkwood .room-floor{background:linear-gradient(165deg,#55372a,#211613)}.room-floor-checker .room-floor{background:repeating-conic-gradient(#24242b 0 25%,#c9b88d 0 50%) 50%/72px 72px}.room-floor-goldie .room-floor{background:linear-gradient(165deg,#f2c7dc,#caa8db)}.room-wall-none .room-wall-layer{background:transparent}.room-scene-none .room-scene-layer{background:#111}.room-decor-layer{position:absolute;z-index:6;inset:0;pointer-events:none}.room-decor-item{position:absolute;right:8%;bottom:72px;font-size:68px;filter:drop-shadow(0 8px 12px #0008)}@media(max-width:800px){.room-nav-icon{width:40px;height:40px}.room-category-icon{width:76px;height:76px}.room-option-chip{min-width:74px;height:74px}} /* v030 social room + standing avatar */ .room-identity-tag{font-size:.78rem;font-weight:900;letter-spacing:.06em;color:#d7b05b;margin:.15rem 0 .35rem} .room-avatar{bottom:58px;min-width:170px;height:270px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end} .room-avatar-head{position:relative;z-index:3;margin-bottom:-18px} .room-avatar .room-avatar-head .avatar-nav-live{width:118px;height:118px;display:block;filter:drop-shadow(0 8px 8px #0007)} .room-avatar-body{position:relative;z-index:2;width:118px;height:142px;border-radius:52% 52% 45% 45% / 38% 38% 62% 62%;background:linear-gradient(155deg,#29242a,#151419);border:3px solid rgba(215,176,91,.38);box-shadow:0 12px 22px #0007} .room-avatar-body::before{content:"";position:absolute;inset:18px 14px 23px;border-radius:50% 50% 44% 44%;background:linear-gradient(160deg,#34303a,#201e25);opacity:.9} .room-avatar-arm{position:absolute;top:34px;width:23px;height:88px;border-radius:18px;background:#242129;border:2px solid rgba(215,176,91,.24);z-index:-1} .room-avatar-arm.left{left:-15px;transform:rotate(8deg)} .room-avatar-arm.right{right:-15px;transform:rotate(-8deg)} .room-avatar-leg{position:absolute;bottom:-43px;width:34px;height:62px;border-radius:0 0 18px 18px;background:#1c1a20;border:2px solid rgba(215,176,91,.22);z-index:-1} .room-avatar-leg.left{left:23px}.room-avatar-leg.right{right:23px} .room-friends{margin:16px 0 10px;padding:14px 14px 10px;border:1px solid rgba(215,176,91,.22);background:#101014;border-radius:20px} .room-friends-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px} .room-friends-head>div{display:flex;flex-direction:column}.room-friends-head strong{font-size:1.05rem}.room-friends-head small,.room-friends-head>span{color:#8f897f;font-size:.76rem} .friend-avatar-strip{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:4px 2px 8px}.friend-avatar-strip::-webkit-scrollbar{display:none} .friend-card,.friend-add-card{width:78px;min-width:78px;border:1px solid rgba(215,176,91,.28);border-radius:18px;background:#17171b;color:#f4f0e7;padding:8px 5px;display:grid;place-items:center;gap:4px} .friend-card:hover,.friend-add-card:hover{border-color:#d7b05b}.friend-add-card>span{font-size:34px;line-height:42px;color:#d7b05b} .friend-card .friend-avatar-mini{width:48px;height:48px;border-radius:50%;overflow:hidden;border:2px solid rgba(215,176,91,.48);display:grid;place-items:center;background:#23232a;font-size:24px} .friend-card small,.friend-add-card small{max-width:66px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.68rem;font-weight:800} .friend-code{font-size:.58rem;color:#a99d88;letter-spacing:.04em} .friend-view-banner{position:absolute;z-index:15;left:50%;top:12px;transform:translateX(-50%);padding:8px 12px;border-radius:999px;background:#0d0d11e8;border:1px solid rgba(215,176,91,.4);color:#f3e2b7;font-weight:900;font-size:.78rem} @media(max-width:760px){.room-avatar{height:238px;bottom:50px}.room-avatar .room-avatar-head .avatar-nav-live{width:100px;height:100px}.room-avatar-body{width:100px;height:125px}.room-avatar-leg{height:54px;bottom:-38px}} /* v031 home sun/moon theme controls */ .home-theme-switch{display:flex;align-items:center;gap:7px;padding-left:2px} .theme-orb{width:42px;height:42px;border-radius:50%;border:1px solid rgba(215,176,91,.42);background:#121216;color:#f4f0e7;display:grid;place-items:center;font-size:22px;cursor:pointer;box-shadow:0 8px 20px rgba(0,0,0,.24);transition:.2s ease} .theme-orb:hover{transform:translateY(-1px) scale(1.04)} .theme-orb.active{border-color:var(--gold);box-shadow:0 0 0 2px rgba(215,176,91,.18),0 8px 22px rgba(0,0,0,.25)} .theme-orb.sun{background:linear-gradient(145deg,#fff8bd,#ffd36b);color:#744c00} .theme-orb.moon{background:linear-gradient(145deg,#191a22,#07070a);color:#fff0b2} @media(max-width:760px){.home-theme-switch{gap:5px}.theme-orb{width:38px;height:38px;font-size:20px}} /* v032 exact Avatar Studio avatar inside room */ .room-avatar-exact{position:absolute;z-index:6;left:50%;bottom:24px;transform:translateX(-50%);width:min(46%,330px);height:auto;min-width:190px;display:block!important} .room-exact-avatar{width:100%;aspect-ratio:1/1;display:grid;place-items:center;filter:drop-shadow(0 16px 18px rgba(0,0,0,.38))} .room-exact-avatar>svg{width:100%!important;height:100%!important;overflow:visible} .room-exact-avatar>.avatar-nav-live{width:140px;height:140px} .room-avatar-exact .room-avatar-head,.room-avatar-exact .room-avatar-body,.room-avatar-exact .room-avatar-arm,.room-avatar-exact .room-avatar-leg{display:none!important} @media(max-width:760px){.room-avatar-exact{width:min(56%,285px);bottom:18px;min-width:180px}} /* v038 unified Sun / Goldie theme — single source of truth */ html[data-site-theme="goldie"]{ --gold:#d9ab4c; --cream:#fffaf2; --sun-bg:#fffaf2; --sun-card:#fffefd; --sun-blush:#f7e6ed; --sun-border:#e7cda2; --sun-ink:#49333f; --sun-muted:#785f6c; } html[data-site-theme="goldie"] body{ background:linear-gradient(180deg,#fffaf2 0%,#f9edf1 52%,#fff8e9 100%)!important; color:var(--sun-ink)!important; } html[data-site-theme="goldie"] header{ background:rgba(255,250,242,.97)!important; border-bottom-color:rgba(217,171,76,.34)!important; box-shadow:0 5px 22px rgba(96,63,78,.08)!important; } html[data-site-theme="goldie"] .brand, html[data-site-theme="goldie"] .navlinks a{color:var(--sun-ink)!important} html[data-site-theme="goldie"] .hero, html[data-site-theme="goldie"] .services, html[data-site-theme="goldie"] .about{background:transparent!important} html[data-site-theme="goldie"] .card, html[data-site-theme="goldie"] .contact-box, html[data-site-theme="goldie"] .daily-card, html[data-site-theme="goldie"] .room-friends, html[data-site-theme="goldie"] .portfolio-card, html[data-site-theme="goldie"] .goldie-photo-card{ background:rgba(255,254,253,.92)!important; color:var(--sun-ink)!important; border-color:var(--sun-border)!important; box-shadow:0 10px 28px rgba(94,64,75,.08)!important; } html[data-site-theme="goldie"] .kicker{color:#a47138!important} html[data-site-theme="goldie"] .section-title p, html[data-site-theme="goldie"] .card p, html[data-site-theme="goldie"] .contact p, html[data-site-theme="goldie"] .goldie-photo-card figcaption{color:var(--sun-muted)!important} html[data-site-theme="goldie"] .btn, html[data-site-theme="goldie"] .book-now, html[data-site-theme="goldie"] .float-choice.goldie{ background:linear-gradient(135deg,#e7bd68,#f2d894)!important; color:#3f3027!important; border-color:#d4a84f!important; box-shadow:0 8px 20px rgba(174,127,48,.16)!important; } html[data-site-theme="goldie"] .btn.alt, html[data-site-theme="goldie"] .float-choice.grim{ background:#fffefd!important; color:var(--sun-ink)!important; border-color:#dfc9b1!important; } html[data-site-theme="goldie"] .theme-orb.sun{ transform:scale(1.05); border-color:#d5a33f!important; box-shadow:0 0 0 3px rgba(217,171,76,.18),0 8px 22px rgba(122,87,35,.14)!important; } html[data-site-theme="goldie"] .theme-orb.moon{opacity:.72} html[data-site-theme="goldie"] .room-privacy-row, html[data-site-theme="goldie"] .room-inventory{ background:rgba(255,254,253,.88)!important; border-color:var(--sun-border)!important; color:var(--sun-ink)!important; } /* v034 social room launch hardening */ .room-privacy-row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:.45rem 0 .15rem;padding:8px 10px;border:1px solid rgba(215,176,91,.2);border-radius:14px;background:#11111688} .room-privacy-row>span{display:flex;flex-direction:column;gap:2px}.room-privacy-row small{font-size:.68rem;color:#9d978e}.privacy-toggle{border:1px solid rgba(215,176,91,.34);background:#19191e;color:#f4f0e7;border-radius:999px;padding:8px 11px;font-weight:900;white-space:nowrap}.privacy-toggle.public{background:#183727;border-color:#69c58f}.privacy-toggle:disabled{opacity:.55} .friend-visit-bar{position:absolute;z-index:20;top:12px;left:12px;right:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;border-radius:15px;background:#0d0d11eF;border:1px solid rgba(215,176,91,.46);box-shadow:0 8px 28px #0008;color:#f3e2b7;font-size:.76rem;font-weight:900}.friend-visit-bar[hidden]{display:none}.friend-visit-bar button{border:1px solid rgba(215,176,91,.4);border-radius:999px;background:#201c17;color:#fff2c6;padding:7px 10px;font-weight:900} .friend-avatar-mini img{width:100%;height:100%;object-fit:cover;border-radius:50%}.friend-room-avatar-image{width:100%;height:100%;object-fit:contain;display:block} .inventory-slot{position:relative}.inventory-slot em{font-size:.52rem;font-style:normal;text-transform:uppercase;letter-spacing:.05em;color:#d7b05b} /* exact avatar must sit entirely inside the room and never use the old generic body */ .room-avatar-exact{bottom:22px!important;width:min(52%,360px)!important;min-width:210px!important;height:auto!important;display:block!important}.room-exact-avatar{aspect-ratio:420/460!important}.room-exact-avatar>svg,.room-exact-avatar>img{width:100%!important;height:100%!important;max-height:430px;object-fit:contain;overflow:visible}.room-avatar-body{display:none!important} @media(max-width:760px){.room-privacy-row{align-items:flex-start;flex-direction:column}.privacy-toggle{align-self:flex-start}.friend-visit-bar{flex-direction:column;align-items:flex-start}.room-avatar-exact{width:min(60%,310px)!important;min-width:190px!important}.room-exact-avatar>svg,.room-exact-avatar>img{max-height:390px}} /* v035: Home-page Avatar Studio + Avatar Room controls stay together in the top nav. */ .home-only .navlinks .avatar-nav-icon + .room-nav-icon{margin-left:-10px} @media(max-width:800px){.home-only .navlinks .avatar-nav-icon + .room-nav-icon{margin-left:-12px}} /* v036: keep Avatar Studio + Avatar Room side-by-side in the top Home header */ .home-avatar-pair{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto} .home-avatar-pair .avatar-nav-icon,.home-avatar-pair .room-nav-icon{margin:0!important} @media(max-width:800px){ .home-only .navlinks{display:flex!important;gap:7px!important;margin-left:auto} .home-only .navlinks .home-avatar-pair{display:inline-flex!important;order:1} .home-only .navlinks .home-avatar-pair>a{display:grid!important} .home-only .navlinks>a:not(.top-shop-icon){display:none!important} .home-only .navlinks .top-shop-icon{display:inline-grid!important;order:2} .home-only nav{gap:8px} .home-only .brand{max-width:150px} } /* v036: room gets the exact full Avatar Studio SVG, not the miniature avatar icon */ .room-exact-avatar{width:100%;height:100%;display:grid;place-items:end center} .room-avatar-exact{width:min(62%,390px)!important;min-width:230px!important;bottom:18px!important;height:min(76%,470px)!important} .room-avatar-exact .room-exact-avatar>svg{display:block!important;width:100%!important;height:100%!important;max-height:none!important;overflow:visible!important} @media(max-width:760px){ .room-avatar-exact{width:min(68%,340px)!important;min-width:220px!important;height:min(73%,430px)!important;bottom:14px!important} } /* v037 Avatar Presets + Favorites */ .option-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:10px} .option-favorite-tools{display:flex;align-items:center;gap:7px;margin-left:auto} .favorite-option-button,.favorites-filter-button{ border:1px solid rgba(215,176,91,.28); background:#17171b; color:#f4f0e7; border-radius:999px; min-height:34px; } .favorite-option-button{width:36px;padding:0;font-size:1.1rem} .favorites-filter-button{padding:7px 11px;font-size:.72rem;font-weight:900;letter-spacing:.03em} .favorite-option-button.is-favorite,.favorites-filter-button.active{ color:#ffd766; border-color:#d7b05b; box-shadow:0 0 0 1px rgba(215,176,91,.2),0 0 16px rgba(215,176,91,.12); } .favorite-option-button:disabled{opacity:.35} .option-chip.favorite-chip{position:relative;border-color:rgba(215,176,91,.58)} .favorite-chip-star{position:absolute;right:8px;top:7px;font-style:normal;font-size:.72rem;color:#ffd766;filter:drop-shadow(0 2px 4px #000)} .favorites-empty-state{ min-width:min(72vw,360px); margin:auto; padding:20px; border:1px dashed rgba(215,176,91,.3); border-radius:16px; color:rgba(244,240,231,.62); text-align:center; line-height:1.45; } .saved-look-slots button{min-width:42px;font-weight:900} .saved-look-slots button.has-look::before{content:"★ ";color:#d7b05b} @media(max-width:760px){ .option-drawer-head{align-items:flex-start} .option-favorite-tools{flex-shrink:0} .favorites-filter-button{font-size:0;width:36px;padding:0} .favorites-filter-button::after{content:"★";font-size:1rem} } /* v039 Sun theme refinement: no pure white surfaces */ body.sun-theme, body.goldie-theme{ --sun-bg:#e4e4e6; --sun-surface:#d6d6d9; --sun-surface-2:#c9c9cd; --sun-border:#b8a46f; --sun-text:#2b2530; --sun-muted:#68636d; --sun-accent:#c8a44d; } body.sun-theme, body.goldie-theme{ background:var(--sun-bg)!important; color:var(--sun-text)!important; } body.sun-theme .card, body.sun-theme .panel, body.sun-theme .section-card, body.sun-theme .option-drawer, body.sun-theme .avatar-stage, body.sun-theme .room-stage, body.sun-theme .room-friends, body.sun-theme .room-visibility-card, body.sun-theme .reward-card, body.sun-theme .modal-card, body.goldie-theme .card, body.goldie-theme .panel, body.goldie-theme .section-card, body.goldie-theme .option-drawer, body.goldie-theme .avatar-stage, body.goldie-theme .room-stage, body.goldie-theme .room-friends, body.goldie-theme .room-visibility-card, body.goldie-theme .reward-card, body.goldie-theme .modal-card{ background:var(--sun-surface)!important; color:var(--sun-text)!important; } body.sun-theme button, body.sun-theme .btn, body.sun-theme .option-chip, body.sun-theme .category-chip, body.sun-theme .nav-icon, body.goldie-theme button, body.goldie-theme .btn, body.goldie-theme .option-chip, body.goldie-theme .category-chip, body.goldie-theme .nav-icon{ background:var(--sun-surface-2)!important; color:var(--sun-text)!important; border-color:var(--sun-border)!important; } body.sun-theme .sun-theme-btn, body.sun-theme [data-theme="sun"], body.goldie-theme .sun-theme-btn, body.goldie-theme [data-theme="sun"]{ background:#bfc0c4!important; color:#29262d!important; box-shadow:0 0 0 2px rgba(200,164,77,.35),0 6px 16px rgba(0,0,0,.10)!important; } body.sun-theme input, body.sun-theme select, body.sun-theme textarea, body.goldie-theme input, body.goldie-theme select, body.goldie-theme textarea{ background:#d1d1d4!important; color:#2b2530!important; border-color:#aaa0a8!important; } body.sun-theme *::selection, body.goldie-theme *::selection{ background:#bfc0c4; color:#242027; } /* v040 game/store polish */ .gg-game-panel,.gg-dev-panel{max-width:1100px;margin:22px auto;padding:20px;border:1px solid rgba(215,176,91,.28);border-radius:24px;background:#101014} .gg-panel-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.gg-panel-head h2{margin:3px 0}.gg-panel-head small{color:#d7b05b;letter-spacing:.15em;font-weight:900} .gg-mini-btn{width:42px;height:42px;border-radius:50%;border:1px solid rgba(215,176,91,.4);background:#17171b;color:#eee;font-size:1.2rem} .gg-progress-row{display:grid;grid-template-columns:minmax(130px,auto) 1fr;align-items:center;gap:16px;margin:18px 0}.gg-progress-row div:first-child{display:flex;flex-direction:column} .gg-xp-track{height:10px;background:#292930;border-radius:999px;overflow:hidden}.gg-xp-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,#b58a32,#f2d67a);transition:width .35s} .gg-achievements{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.gg-achievement{padding:13px;border-radius:15px;border:1px solid #292930;display:flex;flex-direction:column;gap:5px}.gg-achievement small{opacity:.65}.gg-achievement.unlocked{border-color:#8f7338;background:rgba(215,176,91,.08)} .gg-dev-actions{display:flex;flex-wrap:wrap;gap:8px}.gg-dev-actions button{padding:10px 12px;border-radius:12px}.gg-dev-panel pre{white-space:pre-wrap;background:#09090b;padding:12px;border-radius:12px} .gg-preset-thumb{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;margin-right:4px;background:hsl(var(--preset-hue,40) 45% 45%);font-size:.75rem} .gg-react-wiggle{animation:ggWiggle .6s ease}.gg-react-pop{animation:ggPop .55s ease}.gg-react-tilt{animation:ggTilt .6s ease} @keyframes ggWiggle{25%{transform:rotate(-1.5deg)}50%{transform:rotate(1.5deg)}75%{transform:rotate(-.7deg)}}@keyframes ggPop{50%{transform:scale(1.015)}}@keyframes ggTilt{50%{transform:rotate(1deg) translateY(-2px)}} @media(max-width:700px){.gg-game-panel,.gg-dev-panel{margin:14px 12px;padding:15px}.gg-progress-row{grid-template-columns:1fr}.gg-achievements{grid-template-columns:1fr 1fr}} /* v040 mobile launch pass */ html,body{max-width:100%;overflow-x:hidden} header,.site-header{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))} .bottom-nav,.floating-nav,.book-now-floating{padding-bottom:max(8px,env(safe-area-inset-bottom))} img,svg{max-width:100%} .gg-product-inspect{transform:scale(1.04);filter:drop-shadow(0 10px 18px rgba(0,0,0,.28));transition:.2s} /* v043 Avatar layering is controlled by SVG DOM order in assets/avatar.js. Do not add z-index rules to SVG feature groups; update GG_LAYER_STACK instead. */ /* v044 repeated-tap anger reaction */ .gg-angry-brows{animation:ggAngryBrows .7s ease both} .gg-steam-left,.gg-steam-right{ transform-box:fill-box; transform-origin:center; animation:ggSteamPuff .7s ease-in-out infinite alternate; } .gg-steam-right{animation-delay:.12s} .gg-angry-rumble{animation:ggAngryRumble .12s linear 12} .gg-steam-left{--steam-dir:-7px} .gg-steam-right{--steam-dir:7px} @keyframes ggAngryBrows{ 0%{opacity:0;transform:translateY(-3px)} 25%,100%{opacity:1;transform:translateY(0)} } @keyframes ggSteamPuff{ from{opacity:.35;transform:translateX(0) scale(.88)} to{opacity:.95;transform:translateX(var(--steam-dir,0)) scale(1.12)} } @keyframes ggAngryRumble{ 0%,100%{transform:translateX(0)} 50%{transform:translateX(2px)} } @media(prefers-reduced-motion:reduce){ .gg-angry-brows,.gg-steam-left,.gg-steam-right,.gg-angry-rumble{animation:none!important} } /* v045 character personality, photo booth, evolution, room life */ .gg-character-panel,.gg-photo-booth,.gg-room-life{max-width:1100px;margin:22px auto;padding:20px;border:1px solid rgba(215,176,91,.28);border-radius:24px;background:#101014} .gg-character-controls,.gg-photo-controls,.gg-room-life-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:end} .gg-character-controls label,.gg-photo-controls label,.gg-room-life-controls label{display:flex;flex-direction:column;gap:6px;font-size:.78rem;font-weight:800} .gg-character-controls select,.gg-photo-controls select,.gg-room-life-controls select,.gg-physical-unlock input{min-height:42px;border-radius:12px;padding:8px 10px} .gg-evolution{margin-top:14px;padding:10px 12px;border-radius:12px;background:rgba(215,176,91,.08)} .gg-photo-preview{margin-top:15px;min-height:180px;border-radius:20px;display:grid;place-items:center;text-align:center;padding:16px;overflow:hidden} .gg-photo-preview[data-bg="grim"]{background:radial-gradient(circle,#302530,#09090b)} .gg-photo-preview[data-bg="goldie"]{background:radial-gradient(circle,#ded2b5,#b99e69)} .gg-photo-preview[data-bg="stars"]{background:radial-gradient(circle at 20% 20%,#fff 1px,transparent 2px),#111629;background-size:28px 28px} .gg-photo-avatar svg{width:min(280px,70vw);height:auto} .gg-secret-pop{position:absolute;left:50%;top:14%;z-index:999;pointer-events:none;font-size:2.3rem;animation:ggSecretPop 2.2s ease forwards} @keyframes ggSecretPop{0%{opacity:0;transform:translate(-50%,10px) scale(.5)}20%,70%{opacity:1;transform:translate(-50%,0) scale(1.1)}100%{opacity:0;transform:translate(-50%,-30px) scale(.9)}} .gg-ear-snap{animation:ggEarSnap .45s ease}.gg-nose-scrunch{animation:ggNoseScrunch .4s ease} @keyframes ggEarSnap{30%{transform:scaleX(1.025)}65%{transform:scaleX(.99)}}@keyframes ggNoseScrunch{50%{transform:scale(.992) translateY(-2px)}} #avatarStage #eyes{transform:translate(var(--look-x,0),var(--look-y,0));transition:transform .08s linear} #avatarStage[data-evolution="1"] #face{filter:drop-shadow(0 0 2px rgba(215,176,91,.45))} #avatarStage[data-evolution="2"] #eyes{filter:drop-shadow(0 0 4px rgba(230,225,170,.65))} #avatarStage[data-evolution="3"]{filter:drop-shadow(0 0 8px rgba(215,176,91,.35))} .gg-combo-vampire-aura{filter:drop-shadow(0 0 14px rgba(160,20,40,.65))!important} .gg-combo-skeleton-king{filter:drop-shadow(0 0 14px rgba(225,215,175,.55))!important} .gg-combo-fire-spirit{filter:drop-shadow(0 0 16px rgba(255,120,30,.65))!important} .gg-combo-cyber-scout{filter:drop-shadow(0 0 14px rgba(60,210,230,.6))!important} .gg-combo-rainbow-royal{animation:ggRoyalGlow 1.2s ease-in-out infinite alternate} @keyframes ggRoyalGlow{from{filter:hue-rotate(0deg) drop-shadow(0 0 8px rgba(255,255,255,.3))}to{filter:hue-rotate(120deg) drop-shadow(0 0 15px rgba(255,255,255,.6))}} .gg-badge-display{margin-top:18px;display:flex;flex-direction:column;gap:8px}.gg-badge-options{display:flex;flex-wrap:wrap;gap:7px}.gg-badge-options button.active{border-color:#d7b05b;color:#ffd766} .gg-physical-unlock{display:flex;gap:8px;margin-top:14px}.gg-physical-unlock input{flex:1;min-width:0} .gg-visitor-book{margin-top:15px;padding:12px;border:1px solid rgba(215,176,91,.2);border-radius:15px}.gg-visitor-book>strong,.gg-visitor-book>small{display:block}.gg-visitor-book button{font-size:1.2rem;margin:8px 4px 5px 0}.gg-visitor-book button.sent{transform:scale(1.25)} .room-stage[data-weather="rain"]::after{content:"🌧️";position:absolute;right:8%;top:8%;font-size:3rem;animation:ggWeather 2s ease-in-out infinite alternate} .room-stage[data-weather="snow"]::after{content:"❄️ ❄️ ❄️";position:absolute;right:8%;top:8%;font-size:2rem;animation:ggWeather 3s linear infinite} .room-stage[data-weather="fog"]::after{content:"〰️ 〰️";position:absolute;right:8%;top:10%;font-size:3rem;opacity:.45} .room-stage[data-weather="storm"]::after{content:"⚡";position:absolute;right:12%;top:8%;font-size:3rem;animation:ggFlash 2.5s steps(1) infinite} .room-stage[data-weather="stars"]::after{content:"✨ ✦ ✨";position:absolute;right:8%;top:8%;font-size:2rem} .room-stage[data-pet="bat"]::before{content:"🦇"}.room-stage[data-pet="snake"]::before{content:"🐍"}.room-stage[data-pet="spider"]::before{content:"🕷️"}.room-stage[data-pet="frog"]::before{content:"🐸"}.room-stage[data-pet="cat"]::before{content:"🐈"} .room-stage[data-pet]:not([data-pet="none"])::before{position:absolute;left:12%;bottom:8%;font-size:2.2rem;z-index:40;animation:ggPetWander 7s ease-in-out infinite alternate} @keyframes ggPetWander{from{transform:translateX(0)}to{transform:translateX(80px)}}@keyframes ggWeather{from{transform:translateY(0)}to{transform:translateY(15px)}}@keyframes ggFlash{0%,92%,100%{opacity:.15}93%,95%{opacity:1}} body[data-room-time="day"] .room-stage{filter:brightness(1.06)}body[data-room-time="night"] .room-stage{filter:brightness(.88) saturate(.9)} @media(max-width:700px){.gg-character-panel,.gg-photo-booth,.gg-room-life{margin:14px 12px;padding:15px}.gg-character-controls,.gg-photo-controls,.gg-room-life-controls{display:grid;grid-template-columns:1fr}.gg-physical-unlock{flex-direction:column}} @media(prefers-reduced-motion:reduce){.gg-secret-pop,.gg-combo-rainbow-royal,.room-stage::before,.room-stage::after{animation:none!important}} /* v049 launch-prep: room positioning, furniture slots, cleanliness, daily calendar, sharing */ .gg-room-controls-panel,.gg-share-panel,.gg-unlock-preview-panel{max-width:1100px;margin:22px auto;padding:20px;border:1px solid rgba(215,176,91,.28);border-radius:24px;background:#101014} .gg-position-controls,.gg-furniture-slots,.gg-cleanliness-card,.gg-daily-calendar,.gg-friend-reaction-panel{margin-top:16px;padding:14px;border:1px solid rgba(215,176,91,.18);border-radius:16px} .gg-position-buttons,.gg-slot-grid,.gg-share-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px} .gg-position-buttons button.active,.gg-slot-grid button.active{border-color:#d7b05b;color:#ffd766} .room-stage,.room-stage *{box-sizing:border-box} .room-avatar-exact,.room-exact-avatar,.room-avatar,[data-room-avatar]{transition:left .25s ease,right .25s ease,transform .25s ease} .room-stage[data-avatar-position="left"] .room-avatar-exact, .room-stage[data-avatar-position="left"] .room-exact-avatar, .room-stage[data-avatar-position="left"] .room-avatar{left:20%!important;right:auto!important;transform:translateX(-50%)!important} .room-stage[data-avatar-position="center"] .room-avatar-exact, .room-stage[data-avatar-position="center"] .room-exact-avatar, .room-stage[data-avatar-position="center"] .room-avatar{left:50%!important;right:auto!important;transform:translateX(-50%)!important} .room-stage[data-avatar-position="right"] .room-avatar-exact, .room-stage[data-avatar-position="right"] .room-exact-avatar, .room-stage[data-avatar-position="right"] .room-avatar{left:80%!important;right:auto!important;transform:translateX(-50%)!important} /* avatars stand on the floor */ .room-avatar-exact,.room-exact-avatar,.room-avatar,[data-room-avatar]{bottom:0!important} .gg-room-placement{position:absolute;pointer-events:none;border:1px dashed rgba(215,176,91,.0);border-radius:12px;z-index:8} .gg-room-placement[data-room-placement="wall"]{left:25%;top:8%;width:50%;height:24%} .gg-room-placement[data-room-placement="shelf"]{right:7%;top:34%;width:28%;height:10%} .gg-room-placement[data-room-placement="floor-left"]{left:4%;bottom:1%;width:28%;height:25%} .gg-room-placement[data-room-placement="floor-right"]{right:4%;bottom:1%;width:28%;height:25%} .gg-room-placement[data-room-placement="desk"]{left:34%;bottom:1%;width:32%;height:22%} .gg-room-placement[data-room-placement="window"]{left:34%;top:12%;width:32%;height:28%} .gg-slot-pulse{border-color:rgba(215,176,91,.8);animation:ggSlotPulse .7s ease} @keyframes ggSlotPulse{50%{background:rgba(215,176,91,.12)}} .gg-room-bounce{animation:ggRoomBounce .5s ease}.gg-room-look{animation:ggRoomLook .6s ease}.gg-room-annoyed{animation:ggRoomAnnoyed .12s linear 8} @keyframes ggRoomBounce{50%{transform:translateX(-50%) translateY(-12px) scale(1.02)}} @keyframes ggRoomLook{50%{transform:translateX(-50%) rotate(2deg)}} @keyframes ggRoomAnnoyed{50%{filter:drop-shadow(0 0 8px rgba(220,70,60,.45));transform:translateX(calc(-50% + 3px))}} .gg-cleanliness-card{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center}.gg-cleanliness-card>div:first-child{display:flex;flex-direction:column} .gg-cleanliness-track{height:10px;background:#26262d;border-radius:999px;overflow:hidden}.gg-cleanliness-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,#827465,#b78f64);transition:width .3s} #ggCleanRoomBtn.needs-cleaning{animation:ggBrushNotice 1.2s ease-in-out infinite} @keyframes ggBrushNotice{50%{box-shadow:0 0 0 5px rgba(215,176,91,.14);transform:translateY(-1px)}} .room-stage[data-dirt-level="1"]::before{content:"· ·";position:absolute;left:8%;top:10%;opacity:.25;font-size:2rem} .room-stage[data-dirt-level="2"]::before{content:"· · · 🕸️";position:absolute;left:6%;top:7%;opacity:.35;font-size:1.7rem} .room-stage[data-dirt-level="3"]::before{content:"🕸️ · · · 🕸️";position:absolute;left:5%;top:5%;opacity:.5;font-size:1.8rem} .room-stage[data-dirt-level="4"]::before{content:"🕸️ 🕸️ · · · · 🕸️";position:absolute;left:4%;top:4%;opacity:.62;font-size:1.9rem} .gg-calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;margin:10px 0}.gg-day-reward{padding:10px 6px;border-radius:12px;border:1px solid #292930;text-align:center;display:flex;flex-direction:column;gap:4px}.gg-day-reward span{font-size:.7rem;opacity:.7}.gg-day-reward.claimed{border-color:#8f7338;background:rgba(215,176,91,.08)} .gg-friend-reaction-panel button{font-size:1.2rem;margin:8px 4px 0 0}.gg-friend-reaction-panel button.sent{transform:scale(1.25)} .gg-share-card{display:grid;grid-template-columns:minmax(160px,1fr) auto auto;gap:16px;align-items:center;padding:16px;border-radius:20px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid rgba(215,176,91,.28);color:#181818;} .gg-share-avatar{min-height:180px;display:grid;place-items:center}.gg-share-avatar svg{width:min(280px,58vw);height:auto} .gg-share-meta{display:flex;flex-direction:column;gap:5px}.gg-share-meta strong{font-size:1.3rem}.gg-share-meta span{color:#d7b05b;font-weight:900;letter-spacing:.12em}.gg-share-qr{width:96px;height:96px;border-radius:10px;background:#fff;padding:5px} .gg-unlock-preview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}.gg-unlock-preview{padding:14px;border:1px solid #292930;border-radius:16px;display:flex;flex-direction:column;gap:5px}.gg-unlock-silhouette{font-size:1.6rem}.gg-unlock-preview.locked{opacity:.6}.gg-unlock-preview.unlocked{border-color:#8f7338;background:rgba(215,176,91,.08)} .gg-aotd-note{display:block;margin-top:5px;opacity:.66;max-width:580px} @media(max-width:700px){ .gg-room-controls-panel,.gg-share-panel,.gg-unlock-preview-panel{margin:14px 12px;padding:15px} .gg-cleanliness-card{grid-template-columns:1fr} .gg-calendar-grid{grid-template-columns:repeat(4,1fr)} .gg-share-card{grid-template-columns:1fr;text-align:center}.gg-share-qr{margin:auto} } @media(prefers-reduced-motion:reduce){.gg-room-bounce,.gg-room-look,.gg-room-annoyed,#ggCleanRoomBtn.needs-cleaning,.gg-slot-pulse{animation:none!important}} /* v054 Avatar Room — consolidated current layout */ body.room-page-v054{ overflow-x:hidden !important; } body.room-page-v054 .room-main{ padding-top:10px !important; } body.room-page-v054 .rich-avatar-shell{ width:min(100% - 24px,980px); margin:0 auto; } body.room-page-v054 .room-studio-card{ padding:0 !important; border:0 !important; background:transparent !important; box-shadow:none !important; } /* Visible room header: title left, level gauge right. */ .room-reference-head-v054{ display:grid; grid-template-columns:minmax(0,1fr) minmax(150px,210px); gap:18px; align-items:center; margin:10px 0 18px; padding:0 2px; } .room-reference-head-v054 h1{ margin:0; font-family:Georgia,"Times New Roman",serif; color:#f3efe6; font-size:clamp(2.8rem,10vw,5rem); line-height:.94; letter-spacing:-.035em; } .room-level-gauge-v054{ border:1px solid rgba(215,176,91,.32); border-radius:18px; background:#111115; padding:12px 14px; display:grid; gap:6px; text-align:center; } .room-level-gauge-v054 span{ font-size:.92rem; color:#f0ece5; } .room-level-track-v054{ height:9px; border-radius:999px; overflow:hidden; background:#292930; } .room-level-track-v054 i{ display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,#b98b34,#ebc765); transition:width .25s ease; } .room-level-gauge-v054 b{ font-size:.78rem; color:#f0ece5; } /* Underlying privacy/account/identity functions remain available but not visible. */ body.room-page-v054 .room-function-preserve-v054{ position:absolute !important; width:1px !important; height:1px !important; overflow:hidden !important; clip:rect(0 0 0 0) !important; clip-path:inset(50%) !important; white-space:nowrap !important; opacity:0 !important; pointer-events:none !important; } /* Hide obsolete/legacy room header fragments. */ body.room-page-v054 .kicker, body.room-page-v054 .avatar-preview-top, body.room-page-v054 .room-identity-tag, body.room-page-v054 .room-privacy-row, body.room-page-v054 .room-visibility-card, body.room-page-v054 .room-level-card, body.room-page-v054 .room-user-label, body.room-page-v054 .room-username, body.room-page-v054 .friend-code, body.room-page-v054 .friend-name, body.room-page-v054 [class*="visibility"], body.room-page-v054 [id*="roomPrivacy"], body.room-page-v054 [id*="roomIdentity"]{ display:none !important; } /* Main room canvas. */ body.room-page-v054 #avatarRoom{ width:100% !important; min-height:min(72vh,760px); margin:0 auto 18px !important; border:1px solid rgba(215,176,91,.38); border-radius:26px; overflow:hidden; position:relative; } /* Room avatar host and SVG must have no studio plate/background. */ body.room-page-v054 #roomExactAvatar, body.room-page-v054 .room-exact-avatar, body.room-page-v054 .room-avatar-exact, body.room-page-v054 .room-avatar, body.room-page-v054 [data-room-avatar]{ background:transparent !important; box-shadow:none !important; border:0 !important; border-radius:0 !important; filter:none !important; } body.room-page-v054 #roomExactAvatar::before, body.room-page-v054 #roomExactAvatar::after, body.room-page-v054 .room-exact-avatar::before, body.room-page-v054 .room-exact-avatar::after, body.room-page-v054 .room-avatar-exact::before, body.room-page-v054 .room-avatar-exact::after, body.room-page-v054 .room-avatar::before, body.room-page-v054 .room-avatar::after, body.room-page-v054 [data-room-avatar]::before, body.room-page-v054 [data-room-avatar]::after{ content:none !important; display:none !important; background:none !important; box-shadow:none !important; } body.room-page-v054 #roomExactAvatar svg, body.room-page-v054 .room-exact-avatar svg, body.room-page-v054 .room-avatar-exact svg, body.room-page-v054 .room-avatar svg, body.room-page-v054 [data-room-avatar] svg{ background:transparent !important; filter:none !important; overflow:visible !important; } /* Friends and room editor align with the canvas. */ body.room-page-v054 .room-friends, body.room-page-v054 .category-loop-wrap, body.room-page-v054 .room-studio-drawer{ width:100%; margin-left:auto !important; margin-right:auto !important; } body.room-page-v054 .room-friends{ margin-bottom:18px !important; border-radius:22px !important; border:1px solid rgba(215,176,91,.28) !important; background:#101014 !important; padding:18px !important; } body.room-page-v054 .room-category-loop{ display:grid !important; grid-template-columns:repeat(5,minmax(0,1fr)) !important; gap:9px !important; overflow:visible !important; padding:0 0 max(16px,env(safe-area-inset-bottom)) !important; transform:none !important; } body.room-page-v054 .room-category-loop > button:nth-child(n/**/+6){ display:none !important; } body.room-page-v054 .room-category-icon{ min-width:0 !important; width:100% !important; border-radius:18px !important; min-height:76px !important; display:flex !important; flex-direction:column !important; justify-content:center !important; align-items:center !important; gap:5px !important; } /* Advanced room systems remain available farther down the page. */ body.room-page-v054 .daily-card, body.room-page-v054 .room-inventory, body.room-page-v054 .gg-room-life, body.room-page-v054 .gg-room-controls-panel{ width:min(100% - 24px,980px); margin-left:auto !important; margin-right:auto !important; } body.room-page-v054 .gg-position-controls{ display:none !important; } @media(max-width:700px){ body.room-page-v054 .rich-avatar-shell{ width:calc(100% - 20px); } .room-reference-head-v054{ grid-template-columns:minmax(0,1fr) 145px; gap:10px; margin-top:2px; } .room-reference-head-v054 h1{ font-size:clamp(2.65rem,12vw,4.35rem); } .room-level-gauge-v054{ padding:10px; } body.room-page-v054 #avatarRoom{ min-height:68vh; border-radius:24px; } body.room-page-v054 .room-category-loop{ gap:7px !important; } body.room-page-v054 .room-category-icon{ min-height:72px !important; font-size:.8rem !important; } } /* Verified manual-save celebration */ .gg-save-confetti-layer{ position:fixed; inset:0; z-index:99999; pointer-events:none; overflow:hidden; } .gg-save-confetti-piece{ position:absolute; top:-24px; width:9px; height:15px; border-radius:2px; background:var(--confetti-fill,#d7b05b); transform:translate3d(0,0,0) rotate(0deg); animation:ggSaveConfettiFall var(--confetti-duration,1200ms) cubic-bezier(.2,.7,.25,1) forwards; } @keyframes ggSaveConfettiFall{ 0%{ opacity:1; transform:translate3d(0,-10px,0) rotate(0deg); } 100%{ opacity:0; transform:translate3d(var(--confetti-drift,0px),105vh,0) rotate(var(--confetti-spin,540deg)); } } @media(prefers-reduced-motion:reduce){ .gg-save-confetti-piece{ animation:none !important; display:none !important; } } /* v055 Room Scene Window + Pot */ .room-randomize-v055{ display:inline-flex; align-items:center; gap:8px; margin:0 0 14px; min-height:42px; padding:8px 14px; border:1px solid rgba(215,176,91,.35); border-radius:999px; background:#121217; color:#f3efe6; font-weight:800; } .room-randomize-v055.roll{animation:ggRoomDiceRoll .55s ease} @keyframes ggRoomDiceRoll{50%{transform:rotate(-6deg) scale(1.04)}} .room-scene-window-v055{ position:absolute; left:50%; top:16%; width:34%; aspect-ratio:0.72; transform:translateX(-50%); z-index:2; overflow:hidden; border-radius:4px; background:#18181f; } .room-window-frame-v055{ position:absolute; inset:0; border:8px solid #241f23; box-shadow:inset 0 0 0 4px #7f6349,0 0 0 1px rgba(0,0,0,.4); pointer-events:none; z-index:4; } .room-scene-visual-v055{ position:absolute; inset:12px; overflow:hidden; background:#25252d; } /* Scene base graphics */ .room-scene-window-v055[data-scene="none"] .room-scene-visual-v055{ background:#27272e; } /* Storm clouds */ .room-scene-window-v055[data-scene="storm"] .room-scene-visual-v055{ background:linear-gradient(#171824,#42495a 60%,#20242e); } .room-scene-window-v055[data-scene="storm"] .room-scene-visual-v055::before, .room-scene-window-v055[data-scene="storm"] .room-scene-visual-v055::after{ content:""; position:absolute; width:150%; height:36%; left:-25%; border-radius:50%; background:radial-gradient(circle at 20% 60%,#6d7382 0 12%,transparent 13%), radial-gradient(circle at 42% 45%,#555c6c 0 18%,transparent 19%), radial-gradient(circle at 65% 65%,#73798a 0 16%,transparent 17%); animation:ggCloudDrift 7s linear infinite; } .room-scene-window-v055[data-scene="storm"] .room-scene-visual-v055::before{top:18%} .room-scene-window-v055[data-scene="storm"] .room-scene-visual-v055::after{top:38%;animation-duration:10s;opacity:.7} @keyframes ggCloudDrift{to{transform:translateX(18%)}} /* City */ .room-scene-window-v055[data-scene="city"] .room-scene-visual-v055{ background:linear-gradient(#10172a 0 56%,#12131a 57%), repeating-linear-gradient(90deg,#222 0 18px,#151515 18px 28px); } .room-scene-window-v055[data-scene="city"] .room-scene-visual-v055::before{ content:""; position:absolute;left:0;right:0;bottom:0;height:48%; background: linear-gradient(90deg,transparent 0 8%,#1a1a1f 8% 18%,transparent 18% 25%,#202026 25% 43%,transparent 43% 50%,#18181d 50% 64%,transparent 64% 70%,#222229 70% 88%,transparent 88%), radial-gradient(circle,#ffd96a 0 2px,transparent 3px); background-size:auto,18px 18px; animation:ggCityTwinkle 2.6s steps(2,end) infinite; } @keyframes ggCityTwinkle{50%{filter:brightness(1.25)}} /* Sunny */ .room-scene-window-v055[data-scene="sunny"] .room-scene-visual-v055{ background:linear-gradient(#67c7ff 0 68%,#8bd77a 69%); } .room-scene-window-v055[data-scene="sunny"] .room-scene-visual-v055::before{ content:"☀️"; position:absolute; right:12%; top:10%; font-size:2rem; animation:ggSunFloat 5s ease-in-out infinite; } .room-scene-window-v055[data-scene="sunny"] .room-scene-visual-v055::after{ content:""; position:absolute;left:-30%;top:28%;width:160%;height:22%; background: radial-gradient(ellipse at 25% 50%,rgba(255,255,255,.9) 0 11%,transparent 12%), radial-gradient(ellipse at 48% 55%,rgba(255,255,255,.85) 0 13%,transparent 14%), radial-gradient(ellipse at 72% 45%,rgba(255,255,255,.85) 0 10%,transparent 11%); animation:ggCloudDrift 12s linear infinite; } @keyframes ggSunFloat{50%{transform:translateY(5px)}} /* Beach */ .room-scene-window-v055[data-scene="beach"] .room-scene-visual-v055{ background:linear-gradient(#70cfff 0 48%,#0c82c7 49% 70%,#e9cf8a 71%); } .room-scene-window-v055[data-scene="beach"] .room-scene-visual-v055::after{ content:""; position:absolute;left:-20%;right:-20%;top:49%;height:24%; background:repeating-radial-gradient(ellipse at 50% 100%,rgba(255,255,255,.6) 0 3px,transparent 4px 16px); animation:ggOceanWave 2.5s ease-in-out infinite; } @keyframes ggOceanWave{50%{transform:translateX(8px) translateY(3px)}} /* Space */ .room-scene-window-v055[data-scene="space"] .room-scene-visual-v055{ background: radial-gradient(circle at 72% 22%,#8b66d4 0 8%,transparent 9%), radial-gradient(circle at 25% 30%,#fff 0 1px,transparent 2px), radial-gradient(circle at 70% 65%,#fff 0 1px,transparent 2px), radial-gradient(circle at 35% 75%,#fff 0 1px,transparent 2px), #070915; background-size:auto,28px 28px,33px 33px,39px 39px,auto; animation:ggStarsDrift 8s linear infinite; } @keyframes ggStarsDrift{to{background-position:0,20px 10px,-15px 12px,10px -12px,0}} /* Underwater */ .room-scene-window-v055[data-scene="underwater"] .room-scene-visual-v055{ background:linear-gradient(#4fc7d9,#0d6080 68%,#174c52); } .room-scene-window-v055[data-scene="underwater"] .room-scene-visual-v055::before{ content:"🐠 🐟 🐡"; position:absolute;left:-70%;top:42%;font-size:1.25rem;white-space:nowrap; animation:ggFishSwim 7s linear infinite; } .room-scene-window-v055[data-scene="underwater"] .room-scene-visual-v055::after{ content:"◦ ○ ◦ ○"; position:absolute;left:20%;bottom:-20%;font-size:1.2rem;color:rgba(255,255,255,.65); animation:ggBubbles 5s linear infinite; } @keyframes ggFishSwim{to{transform:translateX(220%)}} @keyframes ggBubbles{to{transform:translateY(-320%)}} /* Snow */ .room-scene-window-v055[data-scene="snow"] .room-scene-visual-v055{ background:linear-gradient(#a7c5d8 0 72%,#eef4f7 73%); } .room-scene-window-v055[data-scene="snow"] .room-scene-visual-v055::before{ content:"❄ · ❄ · ❄ ·"; position:absolute;inset:-25% 0 auto;white-space:pre-wrap;color:#fff;font-size:1rem;line-height:2.2; animation:ggSnowFall 5s linear infinite; } @keyframes ggSnowFall{to{transform:translateY(260%)}} /* Wall choices */ body.room-page-v054 #avatarRoom[data-wall="charcoal"]{background-color:#292a31} body.room-page-v054 #avatarRoom[data-wall="plum"]{background-color:#372836} body.room-page-v054 #avatarRoom[data-wall="sage"]{background-color:#49564c} body.room-page-v054 #avatarRoom[data-wall="rose"]{background-color:#5a3d48} body.room-page-v054 #avatarRoom[data-wall="stars"]{background:#1c1d28 radial-gradient(circle,#f3e3a0 0 1px,transparent 2px) 0 0/24px 24px} body.room-page-v054 #avatarRoom[data-wall="moon"]{background:#242431 radial-gradient(circle at 25% 25%,#d8c675 0 7px,transparent 8px) 0 0/76px 76px} body.room-page-v054 #avatarRoom[data-wall="floral"]{background:#473841 radial-gradient(circle at 30% 40%,#d493b4 0 4px,transparent 5px) 0 0/46px 46px} body.room-page-v054 #avatarRoom[data-wall="checker"]{background-color:#292930;background-image:linear-gradient(45deg,#34343d 25%,transparent 25%),linear-gradient(-45deg,#34343d 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#34343d 75%),linear-gradient(-45deg,transparent 75%,#34343d 75%);background-size:40px 40px;background-position:0 0,0 20px,20px -20px,-20px 0} body.room-page-v054 #avatarRoom[data-wall="clouds"]{background:#8ac4de radial-gradient(ellipse,#dcecf2 0 12%,transparent 13%) 0 0/100px 65px} body.room-page-v054 #avatarRoom[data-wall="brick"]{background:#4a2c2c linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px) 0 0/46px 24px} /* Floor overlay */ body.room-page-v054 #avatarRoom::after{ content:""; position:absolute; left:0;right:0;bottom:0;height:28%; z-index:1; pointer-events:none; } body.room-page-v054 #avatarRoom[data-floor="darkwood"]::after{background:repeating-linear-gradient(90deg,#3d2b24 0 42px,#4b352b 42px 44px)} body.room-page-v054 #avatarRoom[data-floor="lightwood"]::after{background:repeating-linear-gradient(90deg,#9d7652 0 42px,#b78c62 42px 44px)} body.room-page-v054 #avatarRoom[data-floor="checker"]::after{background:conic-gradient(#d8c798 25%,#22232a 0 50%,#d8c798 0 75%,#22232a 0) 0 0/56px 56px} body.room-page-v054 #avatarRoom[data-floor="marble"]::after{background:linear-gradient(135deg,#ddd,#aaa 48%,#eee 50%,#bbb 52%,#eee)} body.room-page-v054 #avatarRoom[data-floor="carpet"]::after{background:#5a4a5d} body.room-page-v054 #avatarRoom[data-floor="blacktile"]::after{background:linear-gradient(#1d1e22,#101014);box-shadow:inset 0 1px #3c3c44} body.room-page-v054 #avatarRoom[data-floor="goldtile"]::after{background:conic-gradient(#b7964c 25%,#6d5a2f 0 50%,#c7a75d 0 75%,#806b3a 0) 0 0/62px 62px} body.room-page-v054 #avatarRoom[data-floor="concrete"]::after{background:#6f6e6a} body.room-page-v054 #avatarRoom[data-floor="grass"]::after{background:linear-gradient(#375a35,#1f3e20)} body.room-page-v054 #avatarRoom[data-floor="sand"]::after{background:linear-gradient(#d8c08a,#bda36c)} /* Pot */ .room-pot-layer-v055{ position:absolute; left:var(--pot-x,50%); bottom:4%; transform:translateX(-50%); width:110px; height:190px; z-index:6; touch-action:none; cursor:grab; } .room-pot-layer-v055.dragging{cursor:grabbing} .room-pot-v055{ position:absolute; left:50%;bottom:0;transform:translateX(-50%); width:72px;height:62px; clip-path:polygon(8% 0,92% 0,78% 100%,22% 100%); background:#3a3131; border:3px solid #171313; } .room-pot-layer-v055[data-pot="black"] .room-pot-v055{background:#1b1b20} .room-pot-layer-v055[data-pot="gold"] .room-pot-v055{background:#b8903d} .room-pot-layer-v055[data-pot="terracotta"] .room-pot-v055{background:#a75c3d} .room-pot-layer-v055[data-pot="white"] .room-pot-v055{background:#ddd7ca} .room-pot-plant-v055{ position:absolute;left:50%;bottom:52px;transform:translateX(-50%); width:90px;height:130px; } .room-pot-layer-v055[data-plant="fern"] .room-pot-plant-v055::before{content:"🌿";font-size:5.2rem;position:absolute;left:0;bottom:0} .room-pot-layer-v055[data-plant="snake"] .room-pot-plant-v055::before{content:"🪴";font-size:5rem;position:absolute;left:1px;bottom:0} .room-pot-layer-v055[data-plant="monstera"] .room-pot-plant-v055::before{content:"🌱";font-size:5.5rem;position:absolute;left:0;bottom:0} .room-pot-layer-v055[data-plant="flowers"] .room-pot-plant-v055::before{content:"🌸";font-size:5rem;position:absolute;left:3px;bottom:0} .room-pot-layer-v055[data-plant="bonsai"] .room-pot-plant-v055::before{content:"🌳";font-size:5.2rem;position:absolute;left:0;bottom:0} .room-pot-layer-v055[data-plant="palm"] .room-pot-plant-v055::before{content:"🌴";font-size:5.3rem;position:absolute;left:0;bottom:0} .room-pot-layer-v055[data-plant="pine"] .room-pot-plant-v055::before{content:"🌲";font-size:5.2rem;position:absolute;left:0;bottom:0} /* Ensure avatar remains above floor/scene but behind foreground pot. */ body.room-page-v054 #roomExactAvatar, body.room-page-v054 .room-exact-avatar, body.room-page-v054 .room-avatar-exact, body.room-page-v054 .room-avatar{ position:relative; z-index:5; } /* Options panel */ .room-options-v055{width:100%;margin:0 auto 20px} .room-option-group-v055{display:none;padding:16px;border:1px solid rgba(215,176,91,.2);border-radius:18px;background:#101014} .room-option-group-v055.active{display:block} .room-option-group-v055 h3,.room-option-group-v055 h4{margin:0 0 10px} .room-option-grid-v055{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px} .room-option-grid-v055 button{min-height:46px;border-radius:12px;border:1px solid #303038;background:#17171d;color:#eee;padding:8px} .room-option-grid-v055 button.active{border-color:#d7b05b;box-shadow:0 0 0 2px rgba(215,176,91,.14)} .room-option-group-v055 small{display:block;margin-top:10px;opacity:.7} @media(max-width:700px){ .room-scene-window-v055{width:36%;top:17%} .room-option-grid-v055{grid-template-columns:repeat(2,minmax(0,1fr))} .room-pot-layer-v055{width:92px;height:170px} } /* v056 Avatar Room — authoritative layer order 0 room background/wallpaper 2 scene window 3 floor 4 plant 5 pot 20 avatar 30 idle bubble */ body.room-page-v054 #avatarRoom{ isolation:isolate !important; } /* Wallpaper must remain the room background only. */ body.room-page-v054 #avatarRoom[data-wall]{ background-clip:border-box !important; } /* Window/scene must sit visibly above the wallpaper layer. */ body.room-page-v054 .room-scene-window-v055{ z-index:8 !important; background:#18181f !important; pointer-events:none; } /* Make sure the actual scene visual is above any room background art. */ body.room-page-v054 .room-scene-visual-v055{ z-index:1 !important; } body.room-page-v054 .room-window-frame-v055{ z-index:3 !important; } /* Floor sits over the wall but under every room object and avatar. */ body.room-page-v054 #avatarRoom::after{ z-index:3 !important; } /* Pot group stays behind the avatar. */ body.room-page-v054 .room-pot-layer-v055{ z-index:10 !important; } /* Plant is lower and visually grows from inside the pot. */ body.room-page-v054 .room-pot-plant-v055{ z-index:1 !important; bottom:34px !important; height:116px !important; transform:translateX(-50%) translateY(8px) !important; } /* Pot body is in front of plant stems/leaves. */ body.room-page-v054 .room-pot-v055{ z-index:3 !important; bottom:0 !important; } /* Keep plant emoji/art tucked into the pot rather than floating above it. */ body.room-page-v054 .room-pot-layer-v055[data-plant] .room-pot-plant-v055::before{ bottom:-8px !important; } /* Avatar is always in front of every room object, including pot/window/decor. */ body.room-page-v054 #roomExactAvatar, body.room-page-v054 .room-exact-avatar, body.room-page-v054 .room-avatar-exact, body.room-page-v054 .room-avatar, body.room-page-v054 [data-room-avatar]{ position:relative !important; z-index:20 !important; } /* Prevent cloned SVG internals from escaping into lower stacking contexts. */ body.room-page-v054 #roomExactAvatar svg, body.room-page-v054 .room-exact-avatar svg, body.room-page-v054 .room-avatar-exact svg, body.room-page-v054 .room-avatar svg, body.room-page-v054 [data-room-avatar] svg{ position:relative; z-index:20; } /* Idle burp bubble */ .room-burp-bubble-v056{ position:absolute; left:68%; top:31%; z-index:30; pointer-events:none; opacity:0; transform:translate(-50%,-50%) scale(.75); } .room-burp-main-v056{ display:grid; place-items:center; min-width:56px; height:56px; padding:0 12px; border-radius:50%; background:rgba(194,229,166,.92); border:3px solid rgba(102,139,77,.9); color:#36522c; font-weight:900; font-size:.82rem; text-transform:uppercase; letter-spacing:.04em; box-shadow:0 6px 18px rgba(0,0,0,.18); } .room-burp-dot-v056{ position:absolute; display:block; border-radius:50%; background:rgba(194,229,166,.88); border:2px solid rgba(102,139,77,.75); } .room-burp-dot-v056.d1{ width:16px;height:16px; left:-8px;bottom:-4px; } .room-burp-dot-v056.d2{ width:9px;height:9px; left:-18px;bottom:-13px; } .room-burp-bubble-v056.show{ animation:ggRoomBurpBubbleV056 2.2s ease forwards; } @keyframes ggRoomBurpBubbleV056{ 0%{ opacity:0; transform:translate(-50%,-35%) scale(.65); } 15%{ opacity:1; transform:translate(-50%,-50%) scale(1.06); } 28%{ transform:translate(-50%,-50%) scale(.98); } 75%{ opacity:1; transform:translate(-50%,-62%) scale(1); } 100%{ opacity:0; transform:translate(-50%,-82%) scale(.9); } } @media(max-width:700px){ body.room-page-v054 .room-pot-plant-v055{ bottom:30px !important; height:104px !important; } .room-burp-bubble-v056{ left:61%; top:59%; } } @media(prefers-reduced-motion:reduce){ .room-burp-bubble-v056{ display:none !important; } } /* v057 Room polish */ .room-random-tools-v057{ display:flex; gap:10px; align-items:center; margin-bottom:12px; } .room-locks-toggle-v057{ min-height:42px; padding:8px 14px; border:1px solid rgba(215,176,91,.28); border-radius:999px; background:#121217; color:#f1ede5; font-weight:800; } .room-lock-panel-v057{ margin:0 0 14px; padding:14px; border:1px solid rgba(215,176,91,.22); border-radius:16px; background:#101014; } .room-lock-grid-v057{ display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:8px; margin-top:10px; } .room-lock-grid-v057 button{ min-height:42px; border-radius:12px; border:1px solid #303038; background:#17171d; color:#eee; } .room-lock-grid-v057 button.locked{ border-color:#d7b05b; color:#f2cf78; background:rgba(215,176,91,.08); } /* Scene frame styles */ .room-scene-window-v055[data-frame="classic"] .room-window-frame-v055{ border-color:#241f23; box-shadow:inset 0 0 0 4px #7f6349,0 0 0 1px rgba(0,0,0,.4); } .room-scene-window-v055[data-frame="gothic"] .room-window-frame-v055{ border-color:#0b0b0e; box-shadow:inset 0 0 0 3px #2d2d35,0 0 0 2px #09090b; } .room-scene-window-v055[data-frame="gold"] .room-window-frame-v055{ border-color:#b78b38; box-shadow:inset 0 0 0 4px #e2bf69,0 0 0 2px #6e5426,0 0 16px rgba(215,176,91,.2); } .room-scene-window-v055[data-frame="floral"] .room-window-frame-v055{ border-color:#785263; box-shadow:inset 0 0 0 4px #c98ca7,0 0 0 2px #442d38; } .room-scene-window-v055[data-frame="stone"] .room-window-frame-v055{ border-color:#555057; box-shadow:inset 0 0 0 5px #817a82,0 0 0 2px #2c2930; } .room-scene-window-v055[data-frame="future"] .room-window-frame-v055{ border-color:#293a4d; box-shadow:inset 0 0 0 3px #75c5ff,0 0 14px rgba(117,197,255,.3); } .room-scene-window-v055[data-frame="round"]{ border-radius:50% !important; aspect-ratio:1 !important; } .room-scene-window-v055[data-frame="round"] .room-window-frame-v055{ border-radius:50%; border-color:#6b5745; box-shadow:inset 0 0 0 4px #a48763; } /* Lighting overlays */ body.room-page-v054 #avatarRoom::before{ content:""; position:absolute; inset:0; z-index:19; pointer-events:none; opacity:0; mix-blend-mode:soft-light; } body.room-page-v054 #avatarRoom[data-lighting="neutral"]::before{opacity:0} body.room-page-v054 #avatarRoom[data-lighting="warm"]::before{background:rgba(255,190,100,.20);opacity:1} body.room-page-v054 #avatarRoom[data-lighting="moon"]::before{background:rgba(100,145,255,.22);opacity:1} body.room-page-v054 #avatarRoom[data-lighting="purple"]::before{background:rgba(150,85,210,.23);opacity:1} body.room-page-v054 #avatarRoom[data-lighting="red"]::before{background:rgba(210,65,65,.20);opacity:1} body.room-page-v054 #avatarRoom[data-lighting="green"]::before{background:rgba(70,170,95,.18);opacity:1} body.room-page-v054 #avatarRoom[data-lighting="candle"]::before{ background:radial-gradient(circle at 50% 70%,rgba(255,206,111,.28),rgba(110,62,20,.12) 55%,rgba(0,0,0,.12)); opacity:1; animation:ggCandleFlickerV057 2.3s ease-in-out infinite; } @keyframes ggCandleFlickerV057{50%{opacity:.78}} /* Avatar remains above depth zones and lighting. */ body.room-page-v054 #roomExactAvatar, body.room-page-v054 .room-exact-avatar, body.room-page-v054 .room-avatar-exact, body.room-page-v054 .room-avatar, body.room-page-v054 [data-room-avatar]{ z-index:20 !important; } /* Idle reactions */ body.room-page-v054 #roomExactAvatar.idle-blink-v057, body.room-page-v054 .room-exact-avatar.idle-blink-v057, body.room-page-v054 .room-avatar-exact.idle-blink-v057, body.room-page-v054 .room-avatar.idle-blink-v057{ animation:ggIdleBlinkV057 .55s ease; } @keyframes ggIdleBlinkV057{ 45%,55%{transform:translateX(-50%) scaleY(.97)} } body.room-page-v054 #roomExactAvatar.idle-look-v057, body.room-page-v054 .room-exact-avatar.idle-look-v057, body.room-page-v054 .room-avatar-exact.idle-look-v057, body.room-page-v054 .room-avatar.idle-look-v057{ animation:ggIdleLookV057 .85s ease; } @keyframes ggIdleLookV057{ 45%{transform:translateX(calc(-50% + 8px))} } body.room-page-v054 #roomExactAvatar.idle-tilt-v057, body.room-page-v054 .room-exact-avatar.idle-tilt-v057, body.room-page-v054 .room-avatar-exact.idle-tilt-v057, body.room-page-v054 .room-avatar.idle-tilt-v057{ animation:ggIdleTiltV057 .85s ease; } @keyframes ggIdleTiltV057{ 45%{transform:translateX(-50%) rotate(2.5deg)} } body.room-page-v054 #roomExactAvatar.idle-bounce-v057, body.room-page-v054 .room-exact-avatar.idle-bounce-v057, body.room-page-v054 .room-avatar-exact.idle-bounce-v057, body.room-page-v054 .room-avatar.idle-bounce-v057{ animation:ggIdleBounceV057 .8s ease; } @keyframes ggIdleBounceV057{ 45%{transform:translateX(-50%) translateY(-8px)} } body.room-page-v054 #roomExactAvatar.idle-yawn-v057, body.room-page-v054 .room-exact-avatar.idle-yawn-v057, body.room-page-v054 .room-avatar-exact.idle-yawn-v057, body.room-page-v054 .room-avatar.idle-yawn-v057{ animation:ggIdleYawnV057 1.7s ease; } @keyframes ggIdleYawnV057{ 45%{transform:translateX(-50%) scale(1.015)} } body.room-page-v054 #roomExactAvatar.idle-sneeze-v057, body.room-page-v054 .room-exact-avatar.idle-sneeze-v057, body.room-page-v054 .room-avatar-exact.idle-sneeze-v057, body.room-page-v054 .room-avatar.idle-sneeze-v057{ animation:ggIdleSneezeV057 .7s ease; } @keyframes ggIdleSneezeV057{ 25%{transform:translateX(calc(-50% - 4px)) rotate(-1deg)} 48%{transform:translateX(calc(-50% + 7px)) rotate(2deg)} 70%{transform:translateX(calc(-50% - 2px))} } @media(prefers-reduced-motion:reduce){ [class*="idle-"][class*="-v057"]{animation:none !important} body.room-page-v054 #avatarRoom[data-lighting="candle"]::before{animation:none !important} } /* v058 Avatar Room — floor / plant drag cleanup */ /* Remove unused rectangle/depth-zone presentation. */ body.room-page-v054 .room-depth-v057, body.room-page-v054 #roomDepthBackV057, body.room-page-v054 #roomDepthMidV057, body.room-page-v054 #roomDepthFrontV057{ display:none !important; } /* Room stays one contained canvas. */ body.room-page-v054 #avatarRoom{ position:relative !important; isolation:isolate !important; overflow:hidden !important; touch-action:pan-y !important; } /* Floor overlaps the lower part of the wall, instead of sitting behind it. */ body.room-page-v054 #avatarRoom::after{ content:"" !important; position:absolute !important; left:0 !important; right:0 !important; bottom:0 !important; height:30% !important; z-index:4 !important; pointer-events:none !important; border-radius:0 0 24px 24px !important; box-shadow:0 -1px 0 rgba(0,0,0,.22); } /* Scene/window remains above wallpaper and floor. */ body.room-page-v054 .room-scene-window-v055{ z-index:8 !important; } /* Pot group remains visually behind avatar. Stage handles pointer input, so pot itself doesn't intercept touch. */ body.room-page-v054 .room-pot-layer-v055{ z-index:10 !important; pointer-events:none !important; touch-action:none !important; } /* Plant lowered and tucked into pot. */ body.room-page-v054 .room-pot-plant-v055{ z-index:1 !important; bottom:22px !important; height:104px !important; transform:translateX(-50%) translateY(16px) !important; } body.room-page-v054 .room-pot-layer-v055[data-plant] .room-pot-plant-v055::before{ bottom:-16px !important; } /* Pot body sits in front of plant. */ body.room-page-v054 .room-pot-v055{ z-index:3 !important; bottom:0 !important; } /* Avatar stays in front of normal room items. */ body.room-page-v054 #roomExactAvatar, body.room-page-v054 .room-exact-avatar, body.room-page-v054 .room-avatar-exact, body.room-page-v054 .room-avatar, body.room-page-v054 [data-room-avatar]{ z-index:20 !important; } /* Lighting remains below avatar. */ body.room-page-v054 #avatarRoom::before{ z-index:19 !important; } @media(max-width:700px){ body.room-page-v054 .room-pot-plant-v055{ bottom:18px !important; height:96px !important; transform:translateX(-50%) translateY(18px) !important; } } /* v059 Avatar Room — raised floor + draggable window + foreground extras */ /* Raise floor boundary higher. */ body.room-page-v054 #avatarRoom::after{ height:35% !important; } /* Scene window can move horizontally. */ body.room-page-v054 .room-scene-window-v055{ left:var(--window-x,50%) !important; transform:translateX(-50%) !important; pointer-events:none !important; transition:left .12s ease; } body.room-page-v054 .room-scene-window-v055.dragging{ transition:none !important; } /* Decor sits behind avatar. */ .room-decor-layer-v059{ position:absolute; inset:0; z-index:12; pointer-events:none; } .room-salon-chair-v059{ display:none; position:absolute; left:70%; bottom:7%; width:120px; height:170px; transform:translateX(-50%); } .room-decor-layer-v059[data-decor="salonchair"] .room-salon-chair-v059{ display:block; } /* Hair salon chair, built from simple CSS shapes. */ .room-salon-chair-v059::before{ content:""; position:absolute; left:50%; top:0; width:82px; height:95px; transform:translateX(-50%); background:#17171c; border:5px solid #b99245; border-radius:28px 28px 18px 18px; box-shadow:inset 0 -12px 0 rgba(255,255,255,.025); } .room-salon-chair-v059::after{ content:""; position:absolute; left:50%; bottom:0; width:88px; height:70px; transform:translateX(-50%); background: linear-gradient(#b99245,#b99245) 50% 28%/10px 42px no-repeat, radial-gradient(ellipse,#2c2b31 0 54%,#b99245 56% 62%,transparent 64%) 50% 100%/90px 34px no-repeat; } /* Extras are intentionally in front of everything, including avatar. */ .room-extras-layer-v059{ position:absolute; inset:0; z-index:40; pointer-events:none; } .room-beach-ball-v059{ position:absolute; left:68%; bottom:12%; width:74px; aspect-ratio:1; border:3px solid rgba(0,0,0,.35); border-radius:50%; pointer-events:auto; cursor:pointer; background: conic-gradient( #ef5656 0 16.66%, #f6d65a 16.66% 33.33%, #5ea9ee 33.33% 50%, #f2f0e9 50% 66.66%, #e96c9b 66.66% 83.33%, #6fc88a 83.33% 100% ); box-shadow:inset -8px -10px 14px rgba(0,0,0,.13),0 8px 14px rgba(0,0,0,.18); } .room-beach-ball-v059::after{ content:""; position:absolute; inset:29%; border-radius:50%; background:#f4f1e8; border:2px solid rgba(0,0,0,.12); } .room-beach-ball-v059.bounce{ animation:ggBeachBallBounceV059 .88s cubic-bezier(.2,.7,.25,1); } @keyframes ggBeachBallBounceV059{ 0%{ transform:translate(0,0) rotate(0deg) scale(1); } 45%{ transform:translate(var(--ball-dx,80px),var(--ball-dy,-120px)) rotate(var(--ball-rot,360deg)) scale(1.04); } 72%{ transform:translate(calc(var(--ball-dx,80px) * .72),18px) rotate(var(--ball-rot,360deg)) scale(.96,1.04); } 100%{ transform:translate(0,0) rotate(calc(var(--ball-rot,360deg) * 1.2)) scale(1); } } /* Avatar remains below Extras but above normal Decor. */ body.room-page-v054 #roomExactAvatar, body.room-page-v054 .room-exact-avatar, body.room-page-v054 .room-avatar-exact, body.room-page-v054 .room-avatar, body.room-page-v054 [data-room-avatar]{ z-index:20 !important; } @media(max-width:700px){ .room-salon-chair-v059{ width:98px; height:145px; left:74%; } .room-beach-ball-v059{ width:62px; left:72%; bottom:11%; } } @media(prefers-reduced-motion:reduce){ .room-beach-ball-v059.bounce{ animation:none !important; } } /* v060 Interactive room systems */ .room-status-bar-v060{ width:100%; display:flex; gap:8px; align-items:center; justify-content:flex-end; margin:0 0 12px; } .room-save-state-v060{ margin-right:auto; font-size:.78rem; opacity:.75; } .room-save-state-v060[data-state="saved"]{color:#9bd39b} .room-save-state-v060[data-state="saving"]{color:#e0bd63} .room-save-state-v060[data-state="dirty"]{color:#e2a0a0} .room-status-bar-v060 button{ min-height:38px; border-radius:999px; padding:7px 11px; } .decor-depth-toggle-v060{ display:flex; align-items:center; gap:8px; margin-top:10px; } .decor-depth-toggle-v060 button{ min-height:38px; border-radius:999px; } .room-decor-layer-v059{ left:var(--decor-x,72%); transform:translateX(-50%); width:180px; pointer-events:none; } .room-decor-layer-v059[data-depth="back"]{z-index:12 !important} .room-decor-layer-v059[data-depth="front"]{z-index:35 !important} .room-decor-layer-v059 .room-decor-item-v060{display:none;pointer-events:auto} .room-decor-layer-v059[data-decor="salonchair"] .room-salon-chair-v059, .room-decor-layer-v059[data-decor="lamp"] .room-lamp-v060, .room-decor-layer-v059[data-decor="rug"] .room-rug-v060, .room-decor-layer-v059[data-decor="mirror"] .room-mirror-v060, .room-decor-layer-v059[data-decor="station"] .room-station-v060, .room-decor-layer-v059[data-decor="display"] .room-display-v060, .room-decor-layer-v059[data-decor="wallart"] .room-wallart-v060{ display:block; } /* Generic decor shapes */ .room-lamp-v060{position:absolute;left:50%;bottom:5%;width:70px;height:150px;transform:translateX(-50%)} .room-lamp-v060::before{content:"";position:absolute;left:50%;top:0;width:58px;height:50px;transform:translateX(-50%);background:#d9ba64;clip-path:polygon(15% 0,85% 0,100% 100%,0 100%)} .room-lamp-v060::after{content:"";position:absolute;left:50%;bottom:0;width:8px;height:100px;transform:translateX(-50%);background:#7f6940;box-shadow:0 94px 0 18px #2b2a30} .room-rug-v060{position:absolute;left:50%;bottom:2%;width:150px;height:58px;transform:translateX(-50%);border-radius:50%;background:repeating-linear-gradient(45deg,#5d3d52 0 10px,#8a5c76 10px 20px)} .room-mirror-v060{position:absolute;left:50%;bottom:22%;width:90px;height:150px;transform:translateX(-50%);border:8px solid #b99245;border-radius:46px;background:linear-gradient(135deg,#9db4c5,#d9e4ea 45%,#8aa0b1)} .room-station-v060{position:absolute;left:50%;bottom:5%;width:150px;height:110px;transform:translateX(-50%);background:#24242a;border:4px solid #9a7a3d;border-radius:10px} .room-station-v060::after{content:"";position:absolute;right:12px;top:12px;font-size:1.8rem} .room-display-v060{position:absolute;left:50%;bottom:5%;width:90px;height:115px;transform:translateX(-50%);background:linear-gradient(#37373f,#1d1d23);border:4px solid #b99245;border-radius:10px} .room-display-v060::after{content:"✦";position:absolute;inset:18px;display:grid;place-items:center;color:#e0bd63;font-size:2rem} .room-wallart-v060{position:absolute;left:50%;top:18%;width:120px;height:88px;transform:translateX(-50%);border:6px solid #8e6d38;background:radial-gradient(circle,#dfcb75 0 16%,transparent 17%),#292937} .gg-avatar-sit-v060{animation:ggAvatarSitV060 1.6s ease} @keyframes ggAvatarSitV060{45%,70%{transform:translateX(-50%) translateY(28px) scaleY(.94)}} /* Rare events */ #avatarRoom[data-rare-event="spider"]::before{content:"🕷️";position:absolute;left:8%;top:14%;z-index:38;font-size:2rem;animation:ggSpiderCrossV060 2.2s linear} @keyframes ggSpiderCrossV060{to{transform:translateX(70vw)}} #avatarRoom[data-rare-event="flicker"]{animation:ggRoomFlickerV060 .18s steps(2) 8} @keyframes ggRoomFlickerV060{50%{filter:brightness(.55)}} #avatarRoom[data-rare-event="shootingstar"] .room-scene-window-v055::after{content:"☄️";position:absolute;left:-20%;top:10%;z-index:9;font-size:1.6rem;animation:ggShootingStarV060 1.4s linear} @keyframes ggShootingStarV060{to{transform:translate(220px,120px)}} #avatarRoom[data-rare-event="goldiesparkle"]::before{content:"✨ ✨ ✨";position:absolute;right:8%;top:18%;z-index:38;font-size:1.5rem;animation:ggSparkleV060 2s ease} @keyframes ggSparkleV060{50%{transform:scale(1.2);opacity:.5}} /* Stronger dirt visuals */ #avatarRoom.gg-room-dirty-v060::after{ filter:saturate(.75) brightness(.9); } #avatarRoom.gg-room-dirty-v060 .room-decor-item-v060{ filter:brightness(.88) saturate(.75); } /* Collectibles */ /* persistent beach-ball physics uses top/left */ .room-beach-ball-v059{ transform:none !important; } @media(max-width:700px){ .room-status-bar-v060{flex-wrap:wrap} .room-status-bar-v060 .room-save-state-v060{width:100%} .room-decor-layer-v059{width:150px} } @media(prefers-reduced-motion:reduce){ .gg-avatar-sit-v060, #avatarRoom[data-rare-event]{animation:none !important} } /* v061 Room editor rebuild */ body.room-page-v054 .room-window, body.room-page-v054 .room-wall-layer, body.room-page-v054 .room-scene-layer, body.room-page-v054 .room-floor, body.room-page-v054 #roomDecorLayer, body.room-page-v054 #roomOptionsV055{display:none!important} .room-editor-label-v061{width:min(100% - 24px,980px);margin:18px auto 5px;color:#d8d0c4;font-size:.82rem;font-weight:800} body.room-page-v054 .room-category-wrap-v061{position:relative;width:min(100% - 24px,980px);margin:0 auto} body.room-page-v054 .room-category-loop{display:flex!important;gap:12px!important;overflow-x:auto!important;scrollbar-width:none!important;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:6px 42px 10px!important;transform:none!important;-webkit-overflow-scrolling:touch} body.room-page-v054 .room-category-loop::-webkit-scrollbar,body.room-page-v054 .room-option-loop::-webkit-scrollbar{display:none} body.room-page-v054 .room-category-loop>button:nth-child(n/**/+6){display:flex!important} body.room-page-v054 .room-category-icon,body.room-page-v054 .room-option-chip{flex:0 0 auto;scroll-snap-align:center;border:1px solid rgba(215,176,91,.16)!important;background:#0c0c0f!important;color:#d9d2c5!important;border-radius:18px!important;min-width:82px!important;width:82px!important;height:82px!important;padding:8px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:5px!important;cursor:pointer;transition:.18s ease} body.room-page-v054 .room-option-chip{min-width:76px!important;width:auto!important;height:76px!important;border-radius:16px!important} body.room-page-v054 .room-category-icon b,body.room-page-v054 .room-option-chip b{font-size:1.55rem;line-height:1} body.room-page-v054 .room-category-icon span,body.room-page-v054 .room-option-chip span{font-size:.69rem!important;font-weight:800!important;max-width:75px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} body.room-page-v054 .room-category-icon.active,body.room-page-v054 .room-option-chip.selected{background:linear-gradient(145deg,#ead899,#c79c43)!important;color:#111!important;border-color:#f0d797!important;box-shadow:0 6px 24px rgba(215,176,91,.2)!important} body.room-page-v054 .room-studio-drawer{width:min(100% - 24px,980px);margin:8px auto 0!important;padding:14px 8px 4px!important;border-radius:20px!important;background:linear-gradient(180deg,rgba(215,176,91,.07),rgba(255,255,255,.015))!important;border:1px solid rgba(215,176,91,.14)!important} body.room-page-v054 .room-option-loop{display:flex!important;gap:12px!important;overflow-x:auto!important;padding:6px 38px 10px!important;scroll-snap-type:x proximity;scrollbar-width:none} .room-nudge-v061{display:block!important} body.room-page-v054 #roomDecorLayerV059{display:none!important} /* Raise plant */ body.room-page-v054 .room-pot-plant-v055{bottom:34px!important;height:112px!important;transform:translateX(-50%) translateY(5px)!important} body.room-page-v054 .room-pot-layer-v055[data-plant] .room-pot-plant-v055::before{bottom:-5px!important} /* Floor decor */ .room-floor-decor-v061{position:absolute;left:var(--floor-item-x,72%);top:var(--floor-item-y,82%);transform:translate(-50%,-50%);width:150px;height:150px;z-index:12;pointer-events:none} .room-floor-item-v061{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;filter:drop-shadow(0 9px 10px rgba(0,0,0,.28))} .v061-salon-chair{width:92px;height:132px;position:relative;border-radius:30px 30px 14px 14px;background:#17171c;border:5px solid #b99245} .v061-salon-chair::after{content:"";position:absolute;left:50%;bottom:-23px;width:92px;height:22px;transform:translateX(-50%);border-radius:50%;background:#292930;border:4px solid #b99245} .v061-floor-emoji{font-size:4.5rem} .v061-rug{width:140px;height:68px;border-radius:50%;background:repeating-linear-gradient(45deg,#5d3d52 0 10px,#8a5c76 10px 20px)} .v061-station{width:135px;height:92px;border:4px solid #b99245;border-radius:10px;background:#222229;display:grid;place-items:center;font-size:2rem} .v061-display{width:76px;height:105px;border:4px solid #b99245;border-radius:9px;background:#25252d;color:#e0bd63;display:grid;place-items:center;font-size:2rem} /* Wall decor */ .room-wall-decor-v061{position:absolute;left:var(--wall-item-x,22%);top:var(--wall-item-y,30%);transform:translate(-50%,-50%);width:125px;height:125px;z-index:11;pointer-events:none} .room-wall-item-v061{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none} .v061-mirror{width:72px;height:112px;border:7px solid #b99245;border-radius:38px;background:linear-gradient(135deg,#95aebe,#e3edf2 48%,#829cab)} .v061-wall-art{width:102px;height:72px;border:7px solid #805f31;border-radius:5px;background:#262532;color:#e2c75f;display:grid;place-items:center;font-size:2.2rem} /* Movable avatar anchored by feet */ .gg-room-dragging-v061 .room-floor-decor-v061,.gg-room-dragging-v061 .room-wall-decor-v061{transition:none!important} body.room-page-v054 .room-extras-layer-v059{z-index:40!important} @media(max-width:700px){ .room-floor-decor-v061{width:125px;height:125px} .room-wall-decor-v061{width:105px;height:105px} body.room-page-v054 .room-pot-plant-v055{bottom:30px!important;height:104px!important;transform:translateX(-50%) translateY(5px)!important} } /* v065 cleanup */ .gg-room-life, #roomLifePanel, #roomLaunchPanel, #roomOptionsV055{ display:none !important; } /* Undo / redo are simple arrows only. */ #roomUndoV062,#roomRedoV062{ min-width:40px; font-size:1.25rem; font-weight:900; } /* Gremlin mood faces */ .gremlin-mood-controls-v065{ display:flex; flex-wrap:wrap; gap:9px; } .gremlin-mood-controls-v065>button{ width:70px; height:70px; padding:3px; border-radius:16px; display:grid; place-items:center; overflow:hidden; } .gremlin-mood-controls-v065>button.selected{ border-color:#d7b05b; box-shadow:0 0 0 2px rgba(215,176,91,.18); } /* Always-visible room mood gauge */ .room-mood-gauge-v065{ position:absolute; left:14px; bottom:14px; z-index:48; width:150px; padding:10px 11px; border-radius:14px; background:rgba(11,11,15,.86); border:1px solid rgba(215,176,91,.28); backdrop-filter:blur(6px); pointer-events:none; } .room-mood-gauge-head-v065{ display:flex;justify-content:space-between;gap:8px; font-size:.72rem;margin-bottom:6px; } .room-mood-gauge-head-v065 span{color:#d7b05b;font-weight:900} .room-mood-track-v065{ height:8px;background:#2a2a31;border-radius:999px;overflow:hidden; } .room-mood-track-v065 i{ display:block;height:100%;width:50%; background:linear-gradient(90deg,#9d5260,#d7b05b,#8fcf83); transition:width .3s ease; } /* Avatar care effect anchor */ .room-avatar-care-effect-v065{ position:absolute; left:50%; top:52%; z-index:52; width:220px; height:180px; transform:translate(-50%,-50%); pointer-events:none; opacity:0; } .room-avatar-care-effect-v065.show{opacity:1} .room-avatar-care-effect-v065>span{ position:absolute;left:50%;top:4px;transform:translateX(-50%); padding:8px 12px;border-radius:999px; background:rgba(15,15,19,.88); border:1px solid rgba(215,176,91,.35); color:#fff;font-weight:900;white-space:nowrap; animation:ggCareTextV065 2.5s ease forwards; } @keyframes ggCareTextV065{ 0%{opacity:0;transform:translate(-50%,12px) scale(.8)} 15%,75%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-20px) scale(.92)} } .room-avatar-care-effect-v065.hearts i{ position:absolute;color:#ef6681;font-size:1.7rem; left:50%;top:58%; animation:ggCareHeartV065 2.6s ease forwards; } .room-avatar-care-effect-v065.hearts i:nth-child(2){margin-left:-42px;animation-delay:.15s} .room-avatar-care-effect-v065.hearts i:nth-child(3){margin-left:38px;animation-delay:.28s} .room-avatar-care-effect-v065.hearts i:nth-child(4){margin-left:-12px;animation-delay:.42s} @keyframes ggCareHeartV065{ 0%{opacity:0;transform:translateY(0) scale(.5)} 25%{opacity:1} 100%{opacity:0;transform:translateY(-105px) scale(1.35)} } .room-avatar-care-effect-v065.bubbles i{ position:absolute;width:22px;height:22px;border-radius:50%; border:2px solid rgba(210,245,255,.8); background:rgba(220,250,255,.15); left:50%;top:58%; animation:ggCareBubbleV065 2.5s ease forwards; } .room-avatar-care-effect-v065.bubbles i:nth-child(2){margin-left:-50px;width:15px;height:15px;animation-delay:.1s} .room-avatar-care-effect-v065.bubbles i:nth-child(3){margin-left:44px;width:30px;height:30px;animation-delay:.2s} .room-avatar-care-effect-v065.bubbles i:nth-child(4){margin-left:-24px;animation-delay:.35s} .room-avatar-care-effect-v065.bubbles i:nth-child(5){margin-left:62px;width:13px;height:13px;animation-delay:.5s} .room-avatar-care-effect-v065.bubbles i:nth-child(6){margin-left:10px;width:34px;height:34px;animation-delay:.6s} @keyframes ggCareBubbleV065{ from{opacity:0;transform:translateY(15px) scale(.6)} 25%{opacity:1} to{opacity:0;transform:translateY(-115px) translateX(15px) scale(1.15)} } /* Temporary makeup only in Avatar Room. */ .room-avatar.room-avatar-exact.gg-care-makeup-v065::after{ content:""; position:absolute; left:50%;top:36%; width:46%;height:32%; transform:translate(-50%,-50%); z-index:61; pointer-events:none; background: radial-gradient(ellipse at 28% 43%,rgba(205,86,143,.34) 0 9%,transparent 11%), radial-gradient(ellipse at 72% 43%,rgba(205,86,143,.34) 0 9%,transparent 11%), radial-gradient(ellipse at 50% 77%,rgba(171,39,74,.42) 0 8%,transparent 10%); } .gg-care-food-v065{animation:ggFoodWiggleV065 .16s ease-in-out 10 alternate!important} .gg-care-feather-v065{animation:ggTickleV065 .09s linear 18 alternate!important} .gg-care-soap-v065{filter:brightness(1.08) saturate(1.04)} .gg-happy-hop-v065{animation:ggHappyHopV065 .45s ease 2!important} @keyframes ggFoodWiggleV065{ from{margin-left:-4px;transform:translate(-50%,-100%) rotate(-1.5deg)!important} to{margin-left:4px;transform:translate(-50%,-100%) rotate(1.5deg)!important} } @keyframes ggTickleV065{ from{margin-left:-5px} to{margin-left:5px} } @keyframes ggHappyHopV065{ 50%{margin-top:-12px} } /* City + moonlight bat swarm */ .room-moon-bats-v065{ position:absolute; inset:0; z-index:18; pointer-events:none; display:none; overflow:hidden; } .room-moon-bats-v065.show{display:block} .room-moon-bats-v065 i{ position:absolute; left:-12%; top:18%; width:30px;height:13px; background:#17151a; border-radius:60% 60% 40% 40%; filter:drop-shadow(0 1px 2px rgba(255,255,255,.1)); animation:ggBatFlyV065 3.4s linear infinite; } .room-moon-bats-v065 i::before, .room-moon-bats-v065 i::after{ content:"";position:absolute;top:-4px;width:22px;height:18px;background:#211d24; clip-path:polygon(100% 50%,0 0,17% 55%,0 100%); animation:ggBatWingV065 .14s ease-in-out infinite alternate; } .room-moon-bats-v065 i::before{right:16px} .room-moon-bats-v065 i::after{left:16px;transform:scaleX(-1)} .room-moon-bats-v065 i:nth-child(2){top:27%;animation-delay:.45s;animation-duration:2.9s;transform:scale(.8)} .room-moon-bats-v065 i:nth-child(3){top:12%;animation-delay:1.1s;animation-duration:3.7s;transform:scale(1.15)} .room-moon-bats-v065 i:nth-child(4){top:34%;animation-delay:1.7s;animation-duration:3.1s;transform:scale(.7)} .room-moon-bats-v065 i:nth-child(5){top:21%;animation-delay:2.2s;animation-duration:2.7s;transform:scale(.95)} @keyframes ggBatFlyV065{ 0%{left:-12%;transform:translateY(0)} 45%{transform:translateY(-24px)} 100%{left:108%;transform:translateY(18px)} } @keyframes ggBatWingV065{ from{height:8px} to{height:20px} } /* Hide old Room Life / Layout styling remnants. */ .gg-room-life-controls,.gg-position-controls,.gg-furniture-slots,.gg-cleanliness-card,.gg-daily-calendar,.gg-friend-reaction-panel{ display:none!important; } @media(max-width:700px){ .room-mood-gauge-v065{left:9px;bottom:9px;width:132px} .gremlin-mood-controls-v065>button{width:62px;height:62px} } @media(prefers-reduced-motion:reduce){ .room-moon-bats-v065 i, .room-moon-bats-v065 i::before, .room-moon-bats-v065 i::after, .gg-care-food-v065, .gg-care-feather-v065, .gg-happy-hop-v065{animation:none!important} } /* v066 care polish */ .gg-care-tazer-v066{ animation:ggTazerShakeV066 .055s linear 18 alternate!important; filter:brightness(1.35) contrast(1.15) drop-shadow(0 0 7px rgba(170,220,255,.95))!important; } .gg-care-tazer-v066::before, .gg-care-tazer-v066::after{ content:"⚡"; position:absolute; z-index:70; top:34%; font-size:2rem; color:#dff8ff; text-shadow:0 0 8px #8fdcff,0 0 15px #fff; animation:ggElectricV066 .12s linear infinite alternate; } .gg-care-tazer-v066::before{left:7%} .gg-care-tazer-v066::after{right:7%;animation-delay:.05s} @keyframes ggTazerShakeV066{from{margin-left:-5px}to{margin-left:5px}} @keyframes ggElectricV066{from{transform:rotate(-18deg) scale(.8);opacity:.55}to{transform:rotate(18deg) scale(1.25);opacity:1}} .room-avatar.room-avatar-exact.gg-zero-mood-v066{ filter:saturate(.82) brightness(.94); } .gg-cry-v066::before, .gg-cry-v066::after{ content:"💧"; position:absolute; z-index:72; top:39%; font-size:1.15rem; animation:ggTearDropV066 1.3s ease-in infinite; } .gg-cry-v066::before{left:31%} .gg-cry-v066::after{right:31%;animation-delay:.3s} @keyframes ggTearDropV066{ 0%{opacity:0;transform:translateY(0) scale(.6)} 20%{opacity:1} 100%{opacity:0;transform:translateY(48px) scale(1.1)} } /* Mood visually affects the room avatar without replacing chosen face parts. */ #avatarRoom[data-avatar-mood="happy"] .room-avatar.room-avatar-exact{ filter:brightness(1.035) saturate(1.06); } #avatarRoom[data-avatar-mood="sad"] .room-avatar.room-avatar-exact{ filter:brightness(.95) saturate(.9); } .room-avatar-care-effect-v065.mischief>span{ border-color:rgba(181,91,207,.5); } .room-avatar-care-effect-v065.badge>span{ border-color:rgba(215,176,91,.75); box-shadow:0 0 18px rgba(215,176,91,.2); } .room-avatar-care-effect-v065.shock>span{ border-color:rgba(145,218,255,.8); text-shadow:0 0 8px rgba(145,218,255,.8); } .room-avatar-care-effect-v065.need>span{ font-size:1.05rem; } /* v068 HARD room cleanup — one layout model only */ /* Old v062 architecture is gone. */ #roomModeToolbarV062, #roomObjectsBackV062, #roomObjectsFrontV062, #roomCollectiblesV060, .room-mode-toolbar-v062, .room-object-layer-v062, .room-collectibles-v060{ display:none !important; } /* True wall: fills everything above the raised floor. */ .room-wall-backdrop-v068{ position:absolute !important; left:0 !important; right:0 !important; top:0 !important; bottom:35% !important; z-index:1 !important; display:block !important; pointer-events:none !important; background:#292a31; } .room-wall-backdrop-v068[data-wall="charcoal"]{background:#292a31} .room-wall-backdrop-v068[data-wall="plum"]{background:#372836} .room-wall-backdrop-v068[data-wall="sage"]{background:#49564c} .room-wall-backdrop-v068[data-wall="rose"]{background:#5a3d48} .room-wall-backdrop-v068[data-wall="stars"]{ background:#1c1d28 radial-gradient(circle,#f3e3a0 0 1px,transparent 2px) 0 0/24px 24px; } .room-wall-backdrop-v068[data-wall="moon"]{ background:#242431 radial-gradient(circle at 25% 25%,#d8c675 0 7px,transparent 8px) 0 0/76px 76px; } .room-wall-backdrop-v068[data-wall="floral"]{ background:#473841 radial-gradient(circle at 30% 40%,#d493b4 0 4px,transparent 5px) 0 0/46px 46px; } .room-wall-backdrop-v068[data-wall="checker"]{ background-color:#292930; background-image: linear-gradient(45deg,#34343d 25%,transparent 25%), linear-gradient(-45deg,#34343d 25%,transparent 25%), linear-gradient(45deg,transparent 75%,#34343d 75%), linear-gradient(-45deg,transparent 75%,#34343d 75%); background-size:40px 40px; background-position:0 0,0 20px,20px -20px,-20px 0; } .room-wall-backdrop-v068[data-wall="clouds"]{ background:#8ac4de radial-gradient(ellipse,#dcecf2 0 12%,transparent 13%) 0 0/100px 65px; } .room-wall-backdrop-v068[data-wall="brick"]{ background:#4a2c2c linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px) 0 0/46px 24px; } /* Scene sits on wall. */ body.room-page-v054 .room-scene-window-v055{ z-index:8 !important; } /* Raised floor always covers the lower 35% of the wall. */ body.room-page-v054 #avatarRoom::after{ content:"" !important; position:absolute !important; left:0 !important; right:0 !important; bottom:0 !important; height:35% !important; z-index:4 !important; pointer-events:none !important; } /* FIX: no top%, no translateY, no depth scale, no saved Y position. */ body.room-page-v054 .room-avatar.room-avatar-exact{ position:absolute !important; left:50% !important; right:auto !important; top:auto !important; bottom:10px !important; width:min(62%,390px) !important; height:min(76%,470px) !important; transform:translateX(-50%) !important; transform-origin:50% 100% !important; z-index:20 !important; margin:0 !important; } body.room-page-v054 .room-avatar.room-avatar-exact .room-exact-avatar{ width:100% !important; height:100% !important; display:grid !important; align-items:end !important; justify-items:center !important; } body.room-page-v054 .room-avatar.room-avatar-exact .room-exact-avatar>svg{ width:100% !important; height:100% !important; max-height:none !important; display:block !important; } /* Dedicated Mood card — no longer mixed/scattered through utility sections. */ .avatar-mood-card-v068{ width:min(100% - 20px,520px); margin:14px auto 10px; padding:14px; border:1px solid rgba(215,176,91,.22); border-radius:20px; background:linear-gradient(180deg,rgba(215,176,91,.07),rgba(255,255,255,.018)); } .avatar-mood-card-head-v068{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:10px; } .avatar-mood-card-head-v068 strong{ color:#f1ede5; } .avatar-mood-card-head-v068 small{ color:#9d968e; font-size:.72rem; } .gremlin-mood-row-v068{ display:grid !important; grid-template-columns:repeat(5,1fr) !important; gap:9px !important; width:100% !important; margin:0 !important; } .gremlin-mood-row-v068>button{ position:relative !important; width:100% !important; min-width:0 !important; height:72px !important; display:grid !important; place-items:center !important; padding:3px !important; border-radius:16px !important; overflow:visible !important; } .gremlin-mood-row-v068>button::before{ content:"" !important; position:absolute !important; inset:5px !important; border-radius:50% !important; z-index:0 !important; background: radial-gradient(circle, rgba(255,222,128,.52) 0 34%, rgba(215,176,91,.25) 48%, rgba(215,176,91,.08) 66%, transparent 76%) !important; box-shadow: 0 0 17px rgba(255,220,122,.42), 0 0 32px rgba(215,176,91,.18) !important; } .gremlin-mood-row-v068 .gremlin-mood-face-v065{ position:relative !important; z-index:2 !important; } .gremlin-mood-row-v068>button.selected::before{ background: radial-gradient(circle, rgba(255,236,166,.70) 0 35%, rgba(230,190,90,.34) 50%, rgba(215,176,91,.13) 68%, transparent 78%) !important; box-shadow: 0 0 22px rgba(255,231,150,.62), 0 0 40px rgba(215,176,91,.25) !important; } @media(max-width:700px){ body.room-page-v054 .room-avatar.room-avatar-exact{ width:min(68%,340px) !important; height:min(73%,430px) !important; bottom:6px !important; } .avatar-mood-card-v068{ padding:12px 9px; } .gremlin-mood-row-v068{ gap:4px !important; } .gremlin-mood-row-v068>button{ height:64px !important; } .avatar-mood-card-head-v068 small{ display:none; } } /* v070 Mood UI — self-contained SVG faces, no positioned fragments */ .avatar-mood-card-v068{ overflow:hidden; } .gremlin-mood-row-v068{ display:grid !important; grid-template-columns:repeat(5,minmax(0,1fr)) !important; gap:8px !important; width:100% !important; } .gremlin-mood-row-v068>button{ position:relative !important; display:grid !important; place-items:center !important; min-width:0 !important; width:100% !important; height:76px !important; padding:4px !important; overflow:hidden !important; border-radius:16px !important; } .gremlin-mood-row-v068>button::before{ content:"" !important; position:absolute !important; inset:7px !important; z-index:0 !important; border-radius:50% !important; background:radial-gradient(circle,rgba(245,211,119,.38),rgba(215,176,91,.14) 55%,transparent 72%) !important; box-shadow:0 0 16px rgba(235,198,102,.34) !important; } .gremlin-mood-row-v068>button.selected::before{ background:radial-gradient(circle,rgba(255,232,161,.64),rgba(215,176,91,.22) 58%,transparent 74%) !important; box-shadow:0 0 23px rgba(255,225,145,.55) !important; } .gremlin-mood-svg-v070{ position:relative !important; z-index:2 !important; display:block !important; width:68px !important; height:62px !important; max-width:100% !important; overflow:visible !important; pointer-events:none !important; } .mood-popup.gremlin-popup-v065{ display:grid !important; place-items:center !important; width:112px !important; height:112px !important; padding:8px !important; } .mood-popup.gremlin-popup-v065 .gremlin-mood-svg-v070{ width:100px !important; height:92px !important; } @media(max-width:700px){ .gremlin-mood-row-v068{ gap:4px !important; } .gremlin-mood-row-v068>button{ height:66px !important; padding:2px !important; } .gremlin-mood-svg-v070{ width:58px !important; height:54px !important; } } /* v070 Room load safety */ #avatarRoom.room-runtime-safe-v070{ display:block !important; visibility:visible !important; opacity:1 !important; } /* v071 Avatar care selection + room lighting */ #avatarRoom[data-care-tool="none"]{ cursor:default; } #avatarRoom[data-care-tool="food"], #avatarRoom[data-care-tool="makeup"], #avatarRoom[data-care-tool="soap"], #avatarRoom[data-care-tool="feather"], #avatarRoom[data-care-tool="tazer"]{ cursor:pointer; } /* Dedicated room light visual layer. */ .room-light-overlay-v071{ position:absolute; inset:0; z-index:46; pointer-events:none; opacity:0; transition:opacity .25s ease, background .25s ease, filter .25s ease; mix-blend-mode:screen; } .room-light-overlay-v071[data-lighting="neutral"]{ opacity:.03; background:rgba(255,255,255,.12); } .room-light-overlay-v071[data-lighting="warm"]{ opacity:.28; background:radial-gradient(circle at 50% 10%,rgba(255,210,120,.65),rgba(255,174,69,.12) 45%,transparent 75%); } .room-light-overlay-v071[data-lighting="moon"]{ opacity:.34; background:radial-gradient(circle at 50% 8%,rgba(155,190,255,.75),rgba(90,120,200,.16) 50%,transparent 78%); } .room-light-overlay-v071[data-lighting="purple"]{ opacity:.28; background:radial-gradient(circle at 50% 12%,rgba(183,115,255,.65),rgba(100,43,168,.15) 50%,transparent 78%); } .room-light-overlay-v071[data-lighting="red"]{ opacity:.26; background:radial-gradient(circle at 50% 12%,rgba(255,90,90,.62),rgba(150,20,20,.13) 50%,transparent 78%); } .room-light-overlay-v071[data-lighting="green"]{ opacity:.24; background:radial-gradient(circle at 50% 12%,rgba(117,255,155,.55),rgba(24,130,65,.12) 50%,transparent 78%); } .room-light-overlay-v071[data-lighting="candle"]{ opacity:.30; background:radial-gradient(circle at 50% 25%,rgba(255,198,96,.68),rgba(255,123,43,.10) 42%,transparent 72%); animation:ggCandleFlickerV071 1.4s ease-in-out infinite alternate; } @keyframes ggCandleFlickerV071{ from{opacity:.24;filter:brightness(.94)} to{opacity:.34;filter:brightness(1.08)} } /* Ensure avatar/tool animations override static room positioning cleanly. */ body.room-page-v054 .room-avatar.room-avatar-exact.gg-care-food-v065, body.room-page-v054 .room-avatar.room-avatar-exact.gg-care-feather-v065, body.room-page-v054 .room-avatar.room-avatar-exact.gg-care-tazer-v066, body.room-page-v054 .room-avatar.room-avatar-exact.gg-happy-hop-v065{ transform-origin:50% 100% !important; } body.room-page-v054 .room-avatar.room-avatar-exact.gg-care-food-v065{ animation:ggFoodWiggleV071 .16s ease-in-out 10 alternate !important; } body.room-page-v054 .room-avatar.room-avatar-exact.gg-care-feather-v065{ animation:ggTickleV071 .085s linear 18 alternate !important; } body.room-page-v054 .room-avatar.room-avatar-exact.gg-care-tazer-v066{ animation:ggTazerShakeV071 .055s linear 18 alternate !important; } body.room-page-v054 .room-avatar.room-avatar-exact.gg-happy-hop-v065{ animation:ggHappyHopV071 .42s ease 2 !important; } @keyframes ggFoodWiggleV071{ from{transform:translateX(-50%) rotate(-2deg) scale(1)} to{transform:translateX(-50%) rotate(2deg) scale(1.02)} } @keyframes ggTickleV071{ from{transform:translateX(calc(-50% - 6px)) rotate(-1deg)} to{transform:translateX(calc(-50% + 6px)) rotate(1deg)} } @keyframes ggTazerShakeV071{ from{transform:translateX(calc(-50% - 7px)) scale(1)} to{transform:translateX(calc(-50% + 7px)) scale(1.015)} } @keyframes ggHappyHopV071{ 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(-14px)} } /* Soap gets an avatar scrub shimmer in addition to bubbles. */ body.room-page-v054 .room-avatar.room-avatar-exact.gg-care-soap-v065{ animation:ggSoapScrubV071 .28s ease-in-out 6 alternate !important; } @keyframes ggSoapScrubV071{ from{filter:brightness(1.02)} to{filter:brightness(1.18) saturate(1.08)} } /* v072 visible ceiling light */ .room-ceiling-light-v072{ position:absolute; left:50%; top:0; width:90px; height:105px; transform:translateX(-50%); z-index:32; pointer-events:none; } .room-ceiling-cord-v072{ position:absolute; left:50%; top:0; width:3px; height:32px; transform:translateX(-50%); background:#2f2d33; } .room-ceiling-fixture-v072{ position:absolute; left:50%; top:27px; width:48px; height:48px; transform:translateX(-50%); border-radius:50%; background:#f1dfa1; border:5px solid #4b4433; box-shadow:0 0 12px rgba(245,224,153,.25); } .room-star-fixture-v072, .room-disco-ball-v072{display:none} /* Star fixture replaces bulb visually */ .room-ceiling-light-v072[data-lighting="star"] .room-ceiling-fixture-v072{display:none} .room-ceiling-light-v072[data-lighting="star"] .room-star-fixture-v072{ display:block; position:absolute; left:50%;top:25px; width:58px;height:58px; transform:translateX(-50%); background:#f3cf59; clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 94%,50% 71%,21% 94%,32% 57%,2% 35%,39% 35%); filter:drop-shadow(0 0 12px rgba(244,208,89,.75)); animation:ggStarFixtureGlowV072 1.1s ease-in-out infinite alternate; } @keyframes ggStarFixtureGlowV072{ from{filter:drop-shadow(0 0 7px rgba(244,208,89,.55));transform:translateX(-50%) scale(.96)} to{filter:drop-shadow(0 0 18px rgba(255,231,122,.95));transform:translateX(-50%) scale(1.04)} } /* Disco ball replaces bulb visually */ .room-ceiling-light-v072[data-lighting="disco"] .room-ceiling-fixture-v072{display:none} .room-ceiling-light-v072[data-lighting="disco"] .room-disco-ball-v072{ display:block; position:absolute; left:50%;top:24px; width:52px;height:52px; transform:translateX(-50%); border-radius:50%; background: linear-gradient(90deg,transparent 46%,rgba(0,0,0,.18) 47% 53%,transparent 54%), linear-gradient(0deg,transparent 46%,rgba(0,0,0,.18) 47% 53%,transparent 54%), radial-gradient(circle at 35% 30%,#fff,#b8c0ce 34%,#777f8b 75%); border:4px solid #50545b; box-shadow:0 0 12px rgba(255,255,255,.45); animation:ggDiscoSpinV072 2.4s linear infinite; } .room-disco-ball-v072 i{ position:absolute;inset:8px;border-radius:50%; border:1px solid rgba(255,255,255,.55); } @keyframes ggDiscoSpinV072{ to{transform:translateX(-50%) rotate(360deg)} } /* Star twinkle field */ .room-star-field-v072{ position:absolute;inset:0; z-index:31; pointer-events:none; display:none; } .room-star-field-v072.show{display:block} .room-star-field-v072 i{ position:absolute; width:6px;height:6px;border-radius:50%; background:#f8dc70; box-shadow:0 0 10px rgba(248,220,112,.9); animation:ggStarTwinkleV072 1.2s ease-in-out infinite alternate; } .room-star-field-v072 i:nth-child(1){left:12%;top:19%;animation-delay:.1s} .room-star-field-v072 i:nth-child(2){left:23%;top:35%;animation-delay:.6s} .room-star-field-v072 i:nth-child(3){left:37%;top:15%;animation-delay:.3s} .room-star-field-v072 i:nth-child(4){left:52%;top:29%;animation-delay:.9s} .room-star-field-v072 i:nth-child(5){left:68%;top:18%;animation-delay:.4s} .room-star-field-v072 i:nth-child(6){left:82%;top:32%;animation-delay:.75s} .room-star-field-v072 i:nth-child(7){left:15%;top:48%;animation-delay:.55s} .room-star-field-v072 i:nth-child(8){left:31%;top:56%;animation-delay:.2s} .room-star-field-v072 i:nth-child(9){left:58%;top:50%;animation-delay:.7s} .room-star-field-v072 i:nth-child(10){left:77%;top:57%;animation-delay:.35s} .room-star-field-v072 i:nth-child(11){left:88%;top:44%;animation-delay:1s} .room-star-field-v072 i:nth-child(12){left:45%;top:42%;animation-delay:.5s} @keyframes ggStarTwinkleV072{ from{opacity:.25;transform:scale(.55)} to{opacity:1;transform:scale(1.35)} } /* Disco beams */ .room-disco-effects-v072{ position:absolute;inset:0; z-index:30; pointer-events:none; display:none; overflow:hidden; } .room-disco-effects-v072.show{display:block} .room-disco-effects-v072 i{ position:absolute; left:50%;top:45px; width:7px;height:85%; transform-origin:50% 0; opacity:.28; border-radius:999px; background:linear-gradient(to bottom,rgba(255,255,255,.85),transparent); animation:ggDiscoSweepV072 2.1s linear infinite; } .room-disco-effects-v072 i:nth-child(1){transform:rotate(-55deg);background:linear-gradient(#ff6f91,transparent)} .room-disco-effects-v072 i:nth-child(2){transform:rotate(-30deg);background:linear-gradient(#6ee7ff,transparent);animation-delay:.2s} .room-disco-effects-v072 i:nth-child(3){transform:rotate(-8deg);background:linear-gradient(#ffe76b,transparent);animation-delay:.4s} .room-disco-effects-v072 i:nth-child(4){transform:rotate(18deg);background:linear-gradient(#9bff8e,transparent);animation-delay:.6s} .room-disco-effects-v072 i:nth-child(5){transform:rotate(40deg);background:linear-gradient(#d38aff,transparent);animation-delay:.8s} .room-disco-effects-v072 i:nth-child(6){transform:rotate(60deg);background:linear-gradient(#ff9a62,transparent);animation-delay:1s} @keyframes ggDiscoSweepV072{ 0%{margin-left:-8px;opacity:.14;filter:hue-rotate(0deg)} 50%{margin-left:8px;opacity:.4} 100%{margin-left:-8px;opacity:.14;filter:hue-rotate(360deg)} } /* Room light overlay additions */ .room-light-overlay-v071[data-lighting="star"]{ opacity:.22; background:radial-gradient(circle at 50% 8%,rgba(255,223,112,.42),rgba(255,213,88,.08) 45%,transparent 78%); } .room-light-overlay-v071[data-lighting="disco"]{ opacity:.13; background:radial-gradient(circle at 50% 12%,rgba(255,255,255,.35),transparent 48%); animation:ggDiscoAmbientV072 1.2s linear infinite; } @keyframes ggDiscoAmbientV072{ 0%{filter:hue-rotate(0deg)} 100%{filter:hue-rotate(360deg)} } /* v072 animation bridge — animate actual room SVG as well as wrapper */ .gg-v072-food{ animation:ggRoomFoodV072 .14s ease-in-out 12 alternate !important; transform-origin:50% 100% !important; } .gg-v072-feather{ animation:ggRoomTickleV072 .075s linear 20 alternate !important; transform-origin:50% 100% !important; } .gg-v072-soap{ animation:ggRoomSoapV072 .22s ease-in-out 8 alternate !important; } .gg-v072-tazer{ animation:ggRoomShockV072 .05s linear 22 alternate !important; filter:brightness(1.25) drop-shadow(0 0 7px rgba(130,220,255,.9)) !important; } .gg-v072-makeup{ animation:ggRoomMakeupV072 .45s ease 2 alternate !important; } @keyframes ggRoomFoodV072{from{translate:-4px 0;rotate:-1.2deg}to{translate:4px 0;rotate:1.2deg}} @keyframes ggRoomTickleV072{from{translate:-6px 0;rotate:-1deg}to{translate:6px 0;rotate:1deg}} @keyframes ggRoomSoapV072{from{filter:brightness(1)}to{filter:brightness(1.18) saturate(1.08)}} @keyframes ggRoomShockV072{from{translate:-5px 0}to{translate:5px 0}} @keyframes ggRoomMakeupV072{from{filter:saturate(1)}to{filter:saturate(1.2) brightness(1.08)}} /* Decor drag */ #roomFloorDecorV061, #roomWallDecorV061{ pointer-events:auto !important; touch-action:none !important; transform:translate(-50%,-50%) !important; } #roomFloorDecorV061.dragging-v072, #roomWallDecorV061.dragging-v072{ transition:none !important; cursor:grabbing !important; } /* floor decor can depth-layer around avatar */ #roomFloorDecorV061{z-index:14} #roomWallDecorV061{z-index:12} /* Beach ball must remain interactive and never become static at wall */ #roomBeachBallV059, .room-beach-ball-v059{ position:absolute !important; pointer-events:auto !important; touch-action:manipulation !important; z-index:44 !important; will-change:left,top,transform !important; } /* Keep visible ceiling fixture above scene, but below temporary overlays. */ .room-ceiling-light-v072{z-index:33} .room-star-field-v072{z-index:32} .room-disco-effects-v072{z-index:31} @media(prefers-reduced-motion:reduce){ .room-star-field-v072 i, .room-disco-ball-v072, .room-disco-effects-v072 i{ animation-duration:3s!important; } } /* v073 Soap foam + clean shine */ .room-soap-fx-v073{ position:absolute; left:50%; bottom:6px; width:min(68%,360px); height:min(73%,430px); transform:translateX(-50%); z-index:58; pointer-events:none; } .room-soap-fx-v073 .foam-v073, .room-soap-fx-v073 .shine-v073{ position:absolute; inset:0; opacity:0; pointer-events:none; } /* Foam bubbles sit around the avatar silhouette */ .room-soap-fx-v073.foam-on .foam-v073{ opacity:1; } .room-soap-fx-v073 .foam-v073 i{ position:absolute; width:34px; height:34px; border-radius:50%; background: radial-gradient(circle at 35% 30%,rgba(255,255,255,.96) 0 18%,rgba(223,247,255,.78) 42%,rgba(170,222,242,.36) 72%,transparent 75%); border:2px solid rgba(226,249,255,.88); box-shadow:0 0 10px rgba(204,241,255,.5); opacity:0; } .room-soap-fx-v073.foam-on .foam-v073 i{ animation:ggSoapFoamV073 1.55s ease-in-out forwards; } .room-soap-fx-v073 .foam-v073 i:nth-child(1){left:18%;top:34%;animation-delay:.02s} .room-soap-fx-v073 .foam-v073 i:nth-child(2){left:33%;top:22%;width:46px;height:46px;animation-delay:.12s} .room-soap-fx-v073 .foam-v073 i:nth-child(3){left:54%;top:25%;width:28px;height:28px;animation-delay:.2s} .room-soap-fx-v073 .foam-v073 i:nth-child(4){left:67%;top:38%;width:42px;height:42px;animation-delay:.28s} .room-soap-fx-v073 .foam-v073 i:nth-child(5){left:23%;top:54%;width:29px;height:29px;animation-delay:.36s} .room-soap-fx-v073 .foam-v073 i:nth-child(6){left:43%;top:48%;width:52px;height:52px;animation-delay:.44s} .room-soap-fx-v073 .foam-v073 i:nth-child(7){left:64%;top:58%;width:31px;height:31px;animation-delay:.52s} .room-soap-fx-v073 .foam-v073 i:nth-child(8){left:31%;top:70%;width:40px;height:40px;animation-delay:.6s} .room-soap-fx-v073 .foam-v073 i:nth-child(9){left:53%;top:73%;width:26px;height:26px;animation-delay:.68s} .room-soap-fx-v073 .foam-v073 i:nth-child(10){left:73%;top:72%;width:36px;height:36px;animation-delay:.76s} @keyframes ggSoapFoamV073{ 0%{opacity:0;transform:scale(.25) translateY(14px)} 25%{opacity:1;transform:scale(1.08) translateY(0)} 75%{opacity:.96;transform:scale(.96) translateY(-7px)} 100%{opacity:0;transform:scale(.72) translateY(-26px)} } /* shiny "just cleaned" sparkle pass */ .room-soap-fx-v073.shine-on .shine-v073{ opacity:1; } .room-soap-fx-v073 .shine-v073 b{ position:absolute; color:#fff6c8; font-size:2rem; text-shadow: 0 0 7px #fff, 0 0 14px rgba(255,232,139,.95); opacity:0; } .room-soap-fx-v073.shine-on .shine-v073 b{ animation:ggSoapSparkleV073 1.45s ease-in-out forwards; } .room-soap-fx-v073 .shine-v073 b:nth-child(1){left:19%;top:25%;animation-delay:.02s} .room-soap-fx-v073 .shine-v073 b:nth-child(2){left:73%;top:29%;animation-delay:.2s} .room-soap-fx-v073 .shine-v073 b:nth-child(3){left:28%;top:63%;animation-delay:.4s} .room-soap-fx-v073 .shine-v073 b:nth-child(4){left:69%;top:67%;animation-delay:.58s} .room-soap-fx-v073 .shine-v073 b:nth-child(5){left:48%;top:16%;animation-delay:.75s} @keyframes ggSoapSparkleV073{ 0%{opacity:0;transform:scale(.3) rotate(0deg)} 35%{opacity:1;transform:scale(1.35) rotate(18deg)} 70%{opacity:1;transform:scale(.9) rotate(-10deg)} 100%{opacity:0;transform:scale(.25) rotate(25deg)} } body.room-page-v054 .room-avatar.room-avatar-exact.gg-soap-clean-shine-v073{ animation:ggSoapCleanShineV073 1.55s ease-in-out !important; } @keyframes ggSoapCleanShineV073{ 0%{ filter:brightness(1) saturate(1); } 35%{ filter:brightness(1.28) saturate(1.08) drop-shadow(0 0 8px rgba(255,246,192,.72)); } 70%{ filter:brightness(1.18) saturate(1.05) drop-shadow(0 0 14px rgba(255,246,192,.52)); } 100%{ filter:brightness(1) saturate(1); } } /* Cooldown message style */ .room-avatar-care-effect-v065.cooldown>span{ border-color:rgba(215,176,91,.48); color:#fff4c8; box-shadow:0 0 14px rgba(215,176,91,.12); } /* v074 cooldown feedback — directly over the room avatar */ .room-cooldown-bubble-v074{ position:absolute; left:50%; bottom:min(76%,470px); transform:translate(-50%,18px) scale(.92); z-index:90; max-width:min(84%,320px); padding:9px 14px; border-radius:999px; background:rgba(12,12,16,.94); border:1px solid rgba(230,194,100,.58); color:#fff2bd; font-size:.82rem; line-height:1.15; font-weight:900; text-align:center; white-space:nowrap; box-shadow: 0 8px 24px rgba(0,0,0,.32), 0 0 18px rgba(215,176,91,.16); pointer-events:none; opacity:0; visibility:hidden; } .room-cooldown-bubble-v074.show{ visibility:visible; animation:ggCooldownBubbleV074 2s ease forwards; } @keyframes ggCooldownBubbleV074{ 0%{ opacity:0; transform:translate(-50%,16px) scale(.88); } 10%,78%{ opacity:1; transform:translate(-50%,0) scale(1); } 100%{ opacity:0; transform:translate(-50%,-12px) scale(.96); } } /* Only the two retained frame styles are allowed to render. */ .room-scene-window-v055[data-frame="round"]{ border-radius:50% !important; } @media(max-width:700px){ .room-cooldown-bubble-v074{ bottom:min(74%,430px); max-width:88%; font-size:.76rem; } } /* v075 cooldown message uses the proven avatar-care anchor */ .room-avatar-care-effect-v065.cooldown-v075{ opacity:1 !important; left:50% !important; top:40% !important; width:min(80%,320px) !important; height:auto !important; z-index:95 !important; transform:translate(-50%,-50%) !important; } .room-avatar-care-effect-v065.cooldown-v075>span{ position:relative !important; left:auto !important; top:auto !important; transform:none !important; display:block !important; margin:0 auto !important; width:max-content !important; max-width:100% !important; padding:9px 14px !important; border-radius:999px !important; background:rgba(12,12,16,.96) !important; border:1px solid rgba(232,196,101,.68) !important; color:#fff1b8 !important; font-weight:900 !important; text-align:center !important; white-space:nowrap !important; animation:ggCooldownTextV075 2s ease forwards !important; } @keyframes ggCooldownTextV075{ 0%{opacity:0;transform:translateY(12px) scale(.9)} 10%,78%{opacity:1;transform:translateY(0) scale(1)} 100%{opacity:0;transform:translateY(-12px) scale(.96)} } /* Sun light fixture/room glow */ .room-ceiling-light-v072[data-lighting="sun"] .room-ceiling-fixture-v072{ background:#ffe98a; border-color:#8d6b19; box-shadow: 0 0 18px rgba(255,231,117,.8), 0 0 38px rgba(255,196,64,.38); } .room-light-overlay-v071[data-lighting="sun"]{ opacity:.30; background:radial-gradient(circle at 50% 6%,rgba(255,239,165,.78),rgba(255,198,83,.14) 48%,transparent 78%); } /* Beach + Sun lens flare */ .room-lens-flare-v075{ position:absolute; inset:0; z-index:34; pointer-events:none; display:none; overflow:hidden; } .room-lens-flare-v075.show{display:block} .room-lens-flare-v075::before{ content:""; position:absolute; left:14%; top:12%; width:92px; height:92px; border-radius:50%; background:radial-gradient(circle, rgba(255,255,236,.95) 0 8%, rgba(255,236,148,.58) 16%, rgba(255,217,93,.16) 42%, transparent 68%); box-shadow: 0 0 26px rgba(255,238,163,.65), 0 0 72px rgba(255,203,81,.28); animation:ggLensPulseV075 2.4s ease-in-out infinite alternate; } .room-lens-flare-v075 i{ position:absolute; border-radius:50%; border:2px solid rgba(255,235,164,.25); background:rgba(255,244,201,.06); animation:ggLensDriftV075 3.5s ease-in-out infinite alternate; } .room-lens-flare-v075 i:nth-child(1){left:28%;top:30%;width:48px;height:48px} .room-lens-flare-v075 i:nth-child(2){left:43%;top:43%;width:26px;height:26px;animation-delay:.4s} .room-lens-flare-v075 i:nth-child(3){left:57%;top:55%;width:62px;height:62px;animation-delay:.8s} .room-lens-flare-v075 i:nth-child(4){left:72%;top:67%;width:20px;height:20px;animation-delay:1.1s} @keyframes ggLensPulseV075{ from{opacity:.66;transform:scale(.92)} to{opacity:1;transform:scale(1.08)} } @keyframes ggLensDriftV075{ from{transform:translate(-6px,-4px);opacity:.35} to{transform:translate(8px,6px);opacity:.75} } /* extra storm flash in scene window */ #avatarRoom.combo-storm-moon-v075 .room-scene-window-v055{ box-shadow: 0 0 18px rgba(120,160,220,.18), inset 0 0 20px rgba(180,210,255,.08); } /* v076 avatar-local cooldown: guaranteed above character */ .room-avatar.room-avatar-exact{ overflow:visible !important; } .room-avatar-cooldown-v076{ position:absolute; left:50%; top:-8px; transform:translate(-50%,-100%) scale(.92); z-index:999; min-width:max-content; max-width:90%; padding:9px 14px; border-radius:999px; background:rgba(10,10,14,.97); border:1px solid rgba(240,202,103,.78); color:#fff2bb; font-size:.84rem; line-height:1; font-weight:900; text-align:center; white-space:nowrap; box-shadow: 0 8px 22px rgba(0,0,0,.36), 0 0 20px rgba(225,188,91,.22); opacity:0; visibility:hidden; pointer-events:none; } .room-avatar-cooldown-v076.show{ visibility:visible; animation:ggAvatarCooldownV076 2s ease forwards; } @keyframes ggAvatarCooldownV076{ 0%{ opacity:0; transform:translate(-50%,-82%) scale(.88); } 8%,82%{ opacity:1; transform:translate(-50%,-100%) scale(1); } 100%{ opacity:0; transform:translate(-50%,-118%) scale(.96); } } /* v076 lightning is clipped to the Scene window only */ .room-scene-window-v055{ overflow:hidden !important; } .room-window-lightning-v076{ position:absolute; inset:0; z-index:7; pointer-events:none; overflow:hidden; } .room-window-lightning-v076 i{ position:absolute; left:52%; top:-8%; width:8px; height:92%; opacity:0; background:#eef8ff; box-shadow: 0 0 8px #fff, 0 0 20px rgba(178,220,255,.95); transform:rotate(9deg); clip-path:polygon( 43% 0,100% 0,62% 34%,100% 34%,20% 100%,45% 55%,0 55% ); } .room-window-lightning-v076.strike{ animation:ggWindowStormFlashV076 .8s steps(2,end); } .room-window-lightning-v076.strike i{ animation:ggWindowLightningBoltV076 .8s steps(2,end); } @keyframes ggWindowLightningBoltV076{ 0%,8%,19%,100%{opacity:0} 9%,14%,20%,31%{opacity:1} } @keyframes ggWindowStormFlashV076{ 0%,8%,19%,100%{background:transparent} 9%,14%,20%,31%{background:rgba(220,237,255,.42)} } /* v076 actual tears placed on avatar face */ .room-avatar-tears-v076{ position:absolute; left:50%; top:27%; width:44%; height:30%; transform:translateX(-50%); z-index:85; pointer-events:none; } .room-avatar-tears-v076 i{ position:absolute; top:34%; width:13px; height:20px; border-radius:50% 50% 55% 55%; background:linear-gradient(180deg,#dff7ff,#72ccef); border:1px solid rgba(234,251,255,.88); box-shadow: inset 2px 2px 4px rgba(255,255,255,.72), 0 0 6px rgba(100,204,239,.48); opacity:0; } .room-avatar-tears-v076 i.left{left:26%} .room-avatar-tears-v076 i.right{right:26%} .room-avatar-tears-v076.cry i{ animation:ggFaceTearV076 1.75s ease-in forwards; } .room-avatar-tears-v076.cry i.right{ animation-delay:.28s; } @keyframes ggFaceTearV076{ 0%{ opacity:0; transform:translateY(-3px) scale(.55,.72); } 14%{ opacity:1; transform:translateY(0) scale(.85,1); } 55%{ opacity:1; transform:translateY(26px) scale(.9,1.2); } 100%{ opacity:0; transform:translateY(58px) scale(.72,1.35); } } /* disable superseded broad zero-mood emoji-style tear pseudo elements */ .gg-cry-v066::before, .gg-cry-v066::after{ display:none !important; } /* v077 cooldown hard fix */ .room-avatar.room-avatar-exact{ overflow:visible !important; isolation:isolate !important; } .room-avatar-cooldown-v077{ position:absolute !important; left:50% !important; top:3% !important; transform:translate(-50%,-100%) !important; z-index:9999 !important; display:block; visibility:hidden; opacity:0; min-width:max-content; max-width:92%; padding:10px 15px; border-radius:999px; background:#0b0b0f !important; border:2px solid #e0bd63 !important; color:#fff0b6 !important; font-size:.86rem !important; line-height:1 !important; font-weight:900 !important; text-align:center !important; white-space:nowrap !important; box-shadow: 0 9px 24px rgba(0,0,0,.42), 0 0 18px rgba(224,189,99,.28) !important; pointer-events:none !important; } .room-avatar-cooldown-v077.show{ visibility:visible !important; opacity:1 !important; animation:ggCooldownV077 2s ease forwards !important; } @keyframes ggCooldownV077{ 0%{ opacity:0; transform:translate(-50%,-82%) scale(.9); } 8%,82%{ opacity:1; transform:translate(-50%,-100%) scale(1); } 100%{ opacity:0; transform:translate(-50%,-120%) scale(.96); } } /* v077 tear drops lower: start directly under eyes */ .room-avatar-tears-v076{ top:35% !important; height:28% !important; } .room-avatar-tears-v076 i{ top:38% !important; } .room-avatar-tears-v076 i.left{ left:29% !important; } .room-avatar-tears-v076 i.right{ right:29% !important; } @media(max-width:700px){ .room-avatar-cooldown-v077{ top:5% !important; font-size:.78rem !important; padding:8px 12px !important; } .room-avatar-tears-v076{ top:36% !important; } } /* v078 absolutely reliable cooldown overlay */ .room-cooldown-overlay-v078{ position:fixed !important; left:50%; top:80px; transform:translate(-50%,-100%) scale(.94); z-index:2147483647 !important; display:block !important; visibility:hidden; opacity:0; max-width:min(90vw,340px); padding:10px 15px; border-radius:999px; background:#08080c !important; border:2px solid #e0bd63 !important; color:#fff2b8 !important; font-size:.88rem !important; line-height:1 !important; font-weight:900 !important; text-align:center !important; white-space:nowrap !important; box-shadow: 0 10px 26px rgba(0,0,0,.48), 0 0 22px rgba(224,189,99,.34) !important; pointer-events:none !important; } .room-cooldown-overlay-v078.show{ visibility:visible !important; opacity:1 !important; animation:ggCooldownOverlayV078 2s ease forwards !important; } @keyframes ggCooldownOverlayV078{ 0%{ opacity:0; transform:translate(-50%,-78%) scale(.9); } 7%,83%{ opacity:1; transform:translate(-50%,-100%) scale(1); } 100%{ opacity:0; transform:translate(-50%,-122%) scale(.96); } } /* Hide superseded avatar-local cooldown element styles if any cache survives. */ .room-avatar-cooldown-v076, .room-avatar-cooldown-v077{ display:none !important; } /* v078 Space + Moonlight floating space cow — Scene window only */ .room-space-cow-v078{ position:absolute; left:-34%; top:34%; width:76px; height:68px; z-index:5; display:none; pointer-events:none; transform-origin:50% 50%; } .room-space-cow-v078.show{ display:block; animation:ggSpaceCowFloatV078 12s linear infinite; } @keyframes ggSpaceCowFloatV078{ 0%{ left:-34%; top:40%; transform:rotate(-7deg) scale(.82); } 23%{ top:24%; transform:rotate(8deg) scale(.96); } 47%{ top:44%; transform:rotate(-4deg) scale(1.04); } 72%{ top:28%; transform:rotate(7deg) scale(.92); } 100%{ left:112%; top:39%; transform:rotate(-5deg) scale(.84); } } @keyframes ggSpaceCowTwinkleV078{ from{opacity:.35;transform:scale(.75) rotate(-8deg)} to{opacity:1;transform:scale(1.2) rotate(8deg)} } @media(max-width:700px){ .room-cooldown-overlay-v078{ font-size:.79rem !important; padding:9px 12px !important; } .room-space-cow-v078{ width:64px; height:58px; } } /* v079 gremlin space cow */ .room-space-cow-v078{ width:96px !important; height:78px !important; } .gremlin-space-cow-v079{ display:block; width:100%; height:100%; overflow:visible; filter: drop-shadow(0 0 9px rgba(158,208,245,.35)) drop-shadow(0 5px 6px rgba(0,0,0,.28)); } .room-space-cow-v078.show .gremlin-space-cow-v079{ animation:ggGremlinCowBobV079 1.8s ease-in-out infinite alternate; } @keyframes ggGremlinCowBobV079{ from{transform:rotate(-4deg) translateY(-2px)} to{transform:rotate(5deg) translateY(4px)} } /* Selected cooldown care tools stay visibly armed between taps. */ #avatarRoom[data-care-tool="food"] .room-avatar.room-avatar-exact, #avatarRoom[data-care-tool="soap"] .room-avatar.room-avatar-exact, #avatarRoom[data-care-tool="makeup"] .room-avatar.room-avatar-exact{ cursor:pointer !important; } @media(max-width:700px){ .room-space-cow-v078{ width:78px !important; height:64px !important; } } /* v080 random Tazer sparks across avatar */ .room-tazer-sparks-v080{ position:absolute; inset:0; z-index:96; pointer-events:none; overflow:visible; } .room-tazer-sparks-v080 i{ position:absolute; left:var(--sx); top:var(--sy); width:5px; height:30px; opacity:0; transform: translate(-50%,-50%) rotate(var(--rot)) scale(var(--scale)); transform-origin:50% 50%; background:#eafcff; clip-path:polygon( 45% 0, 100% 0, 62% 38%, 100% 38%, 20% 100%, 45% 56%, 0 56% ); filter: drop-shadow(0 0 3px #fff) drop-shadow(0 0 8px #78d9ff) drop-shadow(0 0 13px rgba(91,180,255,.85)); } .room-tazer-sparks-v080.active i{ animation:ggTazerSparkPopV080 .62s steps(2,end) var(--delay) 2; } @keyframes ggTazerSparkPopV080{ 0%,100%{ opacity:0; scale:.55; } 20%,55%{ opacity:1; scale:1.25; } 72%{ opacity:.3; scale:.8; } } /* A few sparks also appear as small electric dots */ .room-tazer-sparks-v080 i:nth-child(3n){ width:11px; height:11px; border-radius:50%; clip-path:none; background:#dff9ff; box-shadow: 0 0 5px #fff, 0 0 12px #68d6ff; } /* v081 Space Helmet unlock notification */ .gg-space-helmet-unlock-v081{ position:fixed; left:50%; top:max(20px,env(safe-area-inset-top)); transform:translate(-50%,-18px) scale(.94); z-index:2147483647; width:min(calc(100% - 28px),390px); padding:12px 16px; border-radius:17px; background:rgba(10,12,18,.97); border:1px solid rgba(166,218,255,.7); color:#f2fbff; box-shadow: 0 12px 34px rgba(0,0,0,.4), 0 0 25px rgba(132,204,255,.24); text-align:center; opacity:0; visibility:hidden; pointer-events:none; } .gg-space-helmet-unlock-v081 b, .gg-space-helmet-unlock-v081 span{ display:block; } .gg-space-helmet-unlock-v081 b{ font-size:.92rem; } .gg-space-helmet-unlock-v081 span{ margin-top:4px; color:#bfe6ff; font-size:.72rem; font-weight:800; } .gg-space-helmet-unlock-v081.show{ visibility:visible; animation:ggHelmetUnlockV081 3.2s ease forwards; } @keyframes ggHelmetUnlockV081{ 0%{ opacity:0; transform:translate(-50%,-18px) scale(.94); } 9%,80%{ opacity:1; transform:translate(-50%,0) scale(1); } 100%{ opacity:0; transform:translate(-50%,-12px) scale(.97); } } /* v082 Round frame is a true circle */ .room-scene-window-v055[data-frame="round"]{ border-radius:50% !important; overflow:hidden !important; } .room-scene-window-v055[data-frame="round"]::before, .room-scene-window-v055[data-frame="round"]::after{ border-radius:50% !important; } /* v082 tiny cow-print gremlin */ .room-space-cow-v078{width:66px!important;height:72px!important} .gremlin-space-cow-v082{width:100%;height:100%;display:block;filter:drop-shadow(0 0 7px rgba(166,215,248,.32)) drop-shadow(0 4px 5px rgba(0,0,0,.28))} .room-space-cow-v078.show .gremlin-space-cow-v082{animation:ggTinyCowGremlinV082 2s ease-in-out infinite alternate} @keyframes ggTinyCowGremlinV082{from{transform:rotate(-5deg) translateY(-2px)}to{transform:rotate(6deg) translateY(4px)}} /* Chinese lantern redesign */ .v082-chinese-lantern{position:relative;width:92px;height:136px;display:block} .v082-chinese-lantern .top{position:absolute;left:50%;top:2px;width:48px;height:8px;transform:translateX(-50%);border-radius:50%;background:#2c211d} .v082-chinese-lantern .body{position:absolute;left:50%;top:10px;width:62px;height:72px;transform:translateX(-50%);border-radius:42% 42% 46% 46%;background:repeating-linear-gradient(90deg,rgba(105,20,18,.18) 0 3px,transparent 3px 12px),linear-gradient(#dd3d32,#a91f23);border:4px solid #5b1d1a;box-shadow:inset 0 0 14px rgba(255,213,105,.32),0 0 18px rgba(255,104,63,.22)} .v082-chinese-lantern .body::after{content:"福";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#f1c15d;font-weight:900;font-size:1.15rem} .v082-chinese-lantern .fringe{position:absolute;left:50%;top:79px;width:44px;height:20px;transform:translateX(-50%);background:repeating-linear-gradient(90deg,#d5a649 0 3px,transparent 3px 7px)} .v082-chinese-lantern .stand{position:absolute;left:50%;top:95px;width:7px;height:31px;transform:translateX(-50%);background:#2f2925} .v082-chinese-lantern .base{position:absolute;left:50%;bottom:0;width:50px;height:10px;transform:translateX(-50%);border-radius:50%;background:#2f2925} /* movement remains interactive regardless of visual depth */ #roomFloorDecorV061,#roomPotLayerV055,#roomWallDecorV061{pointer-events:auto!important;touch-action:none!important;will-change:left,top,transform!important}body.room-page-v054 .room-avatar.room-avatar-exact{z-index:20!important} /* underwater/star reward message */ .gg-combo-unlock-v082{position:fixed;left:50%;top:max(20px,env(safe-area-inset-top));transform:translate(-50%,-16px) scale(.95);z-index:2147483647;width:min(calc(100% - 28px),420px);padding:12px 15px;border-radius:17px;background:rgba(8,17,25,.97);border:1px solid rgba(117,219,232,.72);color:#eefcff;text-align:center;opacity:0;visibility:hidden;pointer-events:none;box-shadow:0 12px 32px rgba(0,0,0,.42),0 0 26px rgba(96,210,230,.2)} .gg-combo-unlock-v082 b,.gg-combo-unlock-v082 span{display:block} .gg-combo-unlock-v082 span{margin-top:4px;font-size:.73rem;color:#bfe9ef;font-weight:800} .gg-combo-unlock-v082.show{visibility:visible;animation:ggComboUnlockV082 3.4s ease forwards} @keyframes ggComboUnlockV082{0%{opacity:0;transform:translate(-50%,-16px) scale(.95)}9%,82%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-10px) scale(.97)}} /* v083 Night scene */ .room-scene-window-v055[data-scene="night"] .room-scene-visual-v055{ background: radial-gradient(circle at 77% 21%,#f5efc8 0 9%,rgba(245,239,200,.18) 10%,transparent 24%), radial-gradient(circle,#e7efff 0 1px,transparent 2px) 0 0/28px 28px, linear-gradient(#080d1e,#171f38 70%,#090d15); } .room-scene-window-v055[data-scene="night"] .room-scene-visual-v055::before{ content:""; position:absolute; left:0;right:0;bottom:0;height:27%; background:linear-gradient(transparent,#05070b),repeating-linear-gradient(90deg,#090b10 0 16px,#11141a 16px 27px); opacity:.9; } /* Underwater gremlin scuba swimmer */ .room-scuba-swimmer-v083{ position:absolute; left:22%; bottom:-40%; width:88px; height:56px; z-index:6; opacity:0; pointer-events:none; transform:translate(-50%,0) rotate(-8deg) scale(.68); } .room-scuba-swimmer-v083 svg{width:100%;height:100%;overflow:visible} .room-scuba-swimmer-v083.swim{ animation:ggScubaSwimV083 8.5s ease-in-out forwards; } @keyframes ggScubaSwimV083{ 0%{left:18%;bottom:-35%;opacity:0;transform:rotate(-14deg) scale(.62)} 12%{opacity:1} 35%{left:38%;bottom:25%;transform:rotate(-4deg) scale(.82)} 62%{left:67%;bottom:53%;transform:rotate(6deg) scale(.78)} 86%{opacity:1} 100%{left:112%;bottom:70%;opacity:0;transform:rotate(10deg) scale(.62)} } /* Space helmet + Space + Disco random lasers */ .room-disco-lasers-v083{ position:absolute; inset:0; z-index:43; pointer-events:none; overflow:hidden; display:none; } .room-disco-lasers-v083.show{display:block} .room-disco-lasers-v083 i{ position:absolute; left:var(--lx); top:12%; width:5px; height:120%; transform-origin:50% 0; transform:rotate(var(--rot)); background:linear-gradient(to bottom,var(--beam),color-mix(in srgb,var(--beam) 55%,transparent),transparent 78%); box-shadow:0 0 9px var(--beam),0 0 17px var(--beam); opacity:0; animation:ggLaserPopV083 .95s ease-in-out var(--delay) infinite alternate; } @keyframes ggLaserPopV083{ 0%{opacity:.08;filter:brightness(.8)} 45%{opacity:.72;filter:brightness(1.35)} 100%{opacity:.18;filter:brightness(1)} } /* Cat suit + whiskers behavior */ .room-cat-text-v083{ position:absolute; left:50%; top:35%; z-index:94; transform:translate(-50%,-50%); padding:8px 12px; border-radius:999px; background:rgba(15,12,18,.9); border:1px solid rgba(180,126,200,.45); color:#f7eafc; font-weight:900; opacity:0; pointer-events:none; } .room-cat-text-v083.show{animation:ggCatTextV083 2.2s ease forwards} @keyframes ggCatTextV083{ 0%{opacity:0;transform:translate(-50%,5px) scale(.9)} 15%,75%{opacity:1;transform:translate(-50%,-5px) scale(1)} 100%{opacity:0;transform:translate(-50%,-22px) scale(.95)} } .gg-cat-twitch-v083{animation:ggCatTwitchV083 .16s ease-in-out 5 alternate!important} @keyframes ggCatTwitchV083{from{margin-left:-3px;rotate:-1deg}to{margin-left:3px;rotate:1deg}} /* Secret unlock toast */ .gg-combo-unlock-v083{ position:fixed; left:50%; top:max(20px,env(safe-area-inset-top)); transform:translate(-50%,-16px) scale(.95); z-index:2147483647; width:min(calc(100% - 28px),420px); padding:12px 16px; border-radius:17px; background:rgba(10,11,17,.97); border:1px solid rgba(214,180,95,.68); color:#fff5d3; text-align:center; opacity:0; visibility:hidden; pointer-events:none; box-shadow:0 12px 34px rgba(0,0,0,.44),0 0 25px rgba(215,176,91,.18); } .gg-combo-unlock-v083 b,.gg-combo-unlock-v083 span{display:block} .gg-combo-unlock-v083 span{margin-top:4px;font-size:.73rem;color:#d8d3c4;font-weight:800} .gg-combo-unlock-v083.show{visibility:visible;animation:ggComboUnlockV083 3.4s ease forwards} @keyframes ggComboUnlockV083{ 0%{opacity:0;transform:translate(-50%,-16px) scale(.95)} 9%,82%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-10px) scale(.97)} } /* v084 improved Night scene with visible moon */ .room-scene-window-v055[data-scene="night"] .room-scene-visual-v055{ background: radial-gradient(circle at 77% 22%,#fff8cf 0 10%,#e7e1b4 11% 13%,rgba(255,248,207,.18) 14% 25%,transparent 26%), radial-gradient(circle,#eef3ff 0 1px,transparent 2px) 0 0/27px 27px, linear-gradient(#070b19 0 58%,#11172a 59% 74%,#070a12 75%); } .room-scene-window-v055[data-scene="night"] .room-scene-visual-v055::before{ content:""; position:absolute; left:0;right:0;bottom:0;height:31%; background: linear-gradient(90deg,transparent 0 7%,#080a0f 7% 17%,transparent 17% 25%,#0d1016 25% 40%,transparent 40% 49%,#090b10 49% 64%,transparent 64% 73%,#0b0d13 73% 91%,transparent 91%), linear-gradient(transparent,rgba(0,0,0,.7)); opacity:.96; } .room-scene-window-v055[data-scene="night"] .room-scene-visual-v055::after{ content:""; position:absolute; right:15%; top:12%; width:42px;height:42px; border-radius:50%; box-shadow:-11px 5px 0 0 rgba(20,25,40,.42); pointer-events:none; } /* v084 animated flies */ .avatar-flies-v084 circle{ transform-box:fill-box; transform-origin:center; animation:ggFlyBuzzV084 1.25s ease-in-out infinite alternate; } .avatar-flies-v084 circle:nth-child(2n){animation-delay:.24s;animation-duration:.9s} .avatar-flies-v084 circle:nth-child(3n){animation-delay:.48s;animation-duration:1.45s} @keyframes ggFlyBuzzV084{ from{transform:translate(-5px,-2px)} to{transform:translate(7px,5px)} } /* Dracula wallpaper */ .room-wall-backdrop-v068[data-wall="dracula"], #avatarRoom[data-wall="dracula"] .room-wall-backdrop-v068{ background: radial-gradient(circle at 50% 18%,rgba(129,20,32,.32),transparent 23%), repeating-linear-gradient(90deg,#1e0d17 0 42px,#2e1322 42px 84px); } .room-wall-backdrop-v068[data-wall="dracula"]::before{ content:""; position:absolute;inset:0; background: radial-gradient(ellipse at 18% 25%,transparent 0 34%,rgba(0,0,0,.22) 35% 38%,transparent 39%), radial-gradient(ellipse at 82% 25%,transparent 0 34%,rgba(0,0,0,.22) 35% 38%,transparent 39%); opacity:.65; } /* Red splatter wallpaper */ .room-wall-backdrop-v068[data-wall="bloodSplatter"], #avatarRoom[data-wall="bloodSplatter"] .room-wall-backdrop-v068{ background: radial-gradient(circle at 18% 22%,#8f1018 0 3%,transparent 4%), radial-gradient(circle at 25% 28%,#a0151e 0 5%,transparent 6%), radial-gradient(circle at 62% 18%,#7e0d15 0 4%,transparent 5%), radial-gradient(circle at 78% 33%,#a41620 0 6%,transparent 7%), radial-gradient(circle at 44% 48%,#7b0b13 0 3%,transparent 4%), linear-gradient(#d8d4cf,#aaa7a3); background-size:180px 150px,210px 180px,170px 140px,220px 170px,190px 160px,auto; } /* Graveyard scene */ .room-scene-window-v055[data-scene="graveyard"] .room-scene-visual-v055{ background: radial-gradient(circle at 72% 18%,#e9e7c4 0 9%,rgba(233,231,196,.15) 10% 20%,transparent 21%), linear-gradient(#10131f 0 58%,#202326 59% 73%,#111316 74%); } .room-scene-window-v055[data-scene="graveyard"] .room-scene-visual-v055::before{ content:""; position:absolute;left:0;right:0;bottom:0;height:43%; background: radial-gradient(ellipse at 15% 100%,#25292b 0 18%,transparent 19%), radial-gradient(ellipse at 42% 100%,#1f2224 0 21%,transparent 22%), radial-gradient(ellipse at 76% 100%,#242729 0 20%,transparent 21%); } .room-scene-window-v055[data-scene="graveyard"] .room-scene-visual-v055::after{ content:"✝ ▰ ✝ ▰"; position:absolute;left:8%;right:8%;bottom:12%; color:#73777a; font-size:22px; letter-spacing:18px; opacity:.8; } /* Stone Curse scene */ .room-scene-window-v055[data-scene="stoneGarden"] .room-scene-visual-v055{ background: linear-gradient(rgba(85,87,90,.08),rgba(25,27,30,.18)), linear-gradient(#6f7276 0 58%,#4e5154 59% 100%); } .stone-avatar-v084{ position:absolute; left:8%; bottom:8%; width:42px; height:52px; opacity:0; z-index:6; filter:grayscale(1) contrast(1.1) drop-shadow(0 4px 4px rgba(0,0,0,.35)); } .stone-avatar-v084.show{ animation:ggStoneAvatarV084 5.5s ease forwards; } @keyframes ggStoneAvatarV084{ 0%{opacity:0;transform:translateX(-20px) scale(.8)} 18%,78%{opacity:.88;transform:translateX(28px) scale(1)} 100%{opacity:0;transform:translateX(75px) scale(.9)} } /* Secret unlock notification */ .gg-dark-unlock-v084{ position:fixed; left:50%; top:max(20px,env(safe-area-inset-top)); transform:translate(-50%,-16px) scale(.95); z-index:2147483647; width:min(calc(100% - 28px),430px); padding:12px 16px; border-radius:17px; background:rgba(17,8,15,.97); border:1px solid rgba(162,63,91,.72); color:#fff0f4; text-align:center; opacity:0; visibility:hidden; pointer-events:none; box-shadow:0 12px 34px rgba(0,0,0,.45),0 0 26px rgba(149,34,67,.2); } .gg-dark-unlock-v084 b,.gg-dark-unlock-v084 span{display:block} .gg-dark-unlock-v084 span{margin-top:4px;font-size:.73rem;color:#d7c7ce;font-weight:800} .gg-dark-unlock-v084.show{visibility:visible;animation:ggDarkUnlockV084 3.4s ease forwards} @keyframes ggDarkUnlockV084{ 0%{opacity:0;transform:translate(-50%,-16px) scale(.95)} 9%,82%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-10px) scale(.97)} }/* v085 vampire juice burst */ .vampire-juice-v085{ position:absolute; inset:0; z-index:120; pointer-events:none; overflow:visible; } .vampire-juice-v085 i{ position:absolute; left:var(--x); top:var(--y); width:10px; height:15px; border-radius:55% 55% 68% 68%; background:linear-gradient(#f03a48,#8d0711); box-shadow:0 0 5px rgba(195,17,31,.45); opacity:0; } .vampire-juice-v085.show i{ animation:ggVampireJuiceV085 1.05s cubic-bezier(.15,.75,.25,1) var(--delay) forwards; } @keyframes ggVampireJuiceV085{ 0%{opacity:0;transform:translate(0,0) scale(.4) rotate(0)} 13%{opacity:1} 100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.85) rotate(240deg)} } .room-avatar-care-effect-v065.vampire>span{ color:#ffd9de; border-color:rgba(185,27,41,.75); box-shadow:0 0 16px rgba(185,27,41,.22); } /* v086 single-owner room placement */ #roomFloorDecorV061, #roomWallDecorV061, #roomPotLayerV055{ pointer-events:auto !important; touch-action:none !important; will-change:left,top,transform !important; } #roomFloorDecorV061, #roomWallDecorV061{ /* Inline left/top from v086 are authoritative instead of old CSS custom-property positions. */ transform:translate(-50%,-50%) !important; } #roomPotLayerV055{ transform:translate(-50%,-50%) !important; bottom:auto !important; } #roomFloorDecorV061.dragging-v086, #roomWallDecorV061.dragging-v086, #roomPotLayerV055.dragging-v086{ transition:none !important; pointer-events:auto !important; cursor:grabbing !important; } /* Child visuals never steal the pointer from their draggable parent. */ #roomFloorDecorV061 *, #roomWallDecorV061 *, #roomPotLayerV055 *{ pointer-events:none !important; } /* Keep the plant visibly seated in its pot while the whole layer moves. */ body.room-page-v054 .room-pot-plant-v055{ z-index:1 !important; } body.room-page-v054 .room-pot-v055{ z-index:2 !important; } /* v087 reward notification */ .gg-reward-toast-v087{ position:fixed; left:50%; top:max(20px,env(safe-area-inset-top)); z-index:2147483646; width:min(calc(100% - 28px),420px); transform:translate(-50%,-15px) scale(.95); padding:12px 16px; border-radius:18px; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%); border:1px solid rgba(215,176,91,.62); color:#181818; text-align:center; opacity:0; visibility:hidden; pointer-events:none; box-shadow:0 12px 34px rgba(0,0,0,.44),0 0 26px rgba(215,176,91,.16); } .gg-reward-toast-v087 b, .gg-reward-toast-v087 span{ display:block; } .gg-reward-toast-v087 span{ margin-top:4px; font-size:.75rem; color:#d8d1dc; font-weight:800; } .gg-reward-toast-v087.show{ visibility:visible; animation:ggRewardToastV087 3.2s ease forwards; } @keyframes ggRewardToastV087{ 0%{opacity:0;transform:translate(-50%,-15px) scale(.95)} 9%,82%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-10px) scale(.97)} } /* v089 real door icon for Avatar Home / Avatar Room */ .gg-door-home-v089{ display:inline-grid !important; place-items:center; } .gg-door-icon-v089{ position:relative; display:inline-block; width:24px; height:30px; border:2px solid #d7b05b; border-radius:3px 3px 1px 1px; background:linear-gradient(90deg,#3d281d,#6a4430 52%,#4a2e21); box-shadow: inset 3px 0 0 rgba(255,255,255,.06), 0 0 10px rgba(215,176,91,.16); } .gg-door-icon-v089::before{ content:""; position:absolute; left:4px; right:4px; top:5px; height:8px; border:1px solid rgba(215,176,91,.42); border-radius:2px; } .gg-door-icon-v089::after{ content:""; position:absolute; left:4px; right:4px; bottom:5px; height:8px; border:1px solid rgba(215,176,91,.3); border-radius:2px; } .gg-door-icon-v089 i{ position:absolute; right:3px; top:14px; width:4px; height:4px; border-radius:50%; background:#f4d272; box-shadow:0 0 4px rgba(244,210,114,.7); } .gg-tutorial-door-v089{ display:block; margin:8px auto 12px; width:max-content; } .gg-tutorial-door-v089 .gg-door-icon-v089{ width:34px; height:43px; } /* v089 guaranteed Bone Necklace unlock notification */ .gg-bone-unlock-v089{ position:fixed; left:50%; top:max(20px,env(safe-area-inset-top)); z-index:2147483647; width:min(calc(100% - 28px),420px); transform:translate(-50%,-15px) scale(.95); padding:12px 16px; border-radius:18px; background:rgba(17,14,11,.98); border:1px solid rgba(226,216,191,.68); color:#fff8e7; text-align:center; opacity:0; visibility:hidden; pointer-events:none; box-shadow:0 12px 34px rgba(0,0,0,.44),0 0 24px rgba(220,205,172,.18); } .gg-bone-unlock-v089 b, .gg-bone-unlock-v089 span{ display:block; } .gg-bone-unlock-v089 span{ margin-top:4px; color:#d8d0c0; font-size:.75rem; font-weight:800; } .gg-bone-unlock-v089.show{ visibility:visible; animation:ggBoneUnlockV089 3.2s ease forwards; } @keyframes ggBoneUnlockV089{ 0%{opacity:0;transform:translate(-50%,-15px) scale(.95)} 9%,82%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-10px) scale(.97)} } /* v090: wardrobe entries with shirt icon behave as replacement outfits, not stackable accessories. */ /* v091 avatar stands at the front/bottom of the room */ body.room-page-v054 .room-avatar.room-avatar-exact{ bottom:2px !important; z-index:80 !important; } @media(max-width:760px){ body.room-page-v054 .room-avatar.room-avatar-exact{ bottom:0 !important; } } /* All user-positioned room decor stays behind the avatar, even while dragging. */ #roomFloorDecorV061, #roomWallDecorV061, #roomPotLayerV055, #roomFloorDecorV061.dragging-v086, #roomWallDecorV061.dragging-v086, #roomPotLayerV055.dragging-v086{ z-index:18 !important; } /* Saturn replaces the ordinary bulb with a planet + ring. */ .room-ceiling-light-v072[data-lighting="saturn"] .room-ceiling-fixture-v072, .room-ceiling-light-v072[data-lighting="saturn"] .room-star-fixture-v072, .room-ceiling-light-v072[data-lighting="saturn"] .room-disco-ball-v072{ display:none !important; } .room-saturn-fixture-v091{ display:none; } .room-ceiling-light-v072[data-lighting="saturn"] .room-saturn-fixture-v091{ display:block; position:absolute; left:50%; top:22px; width:62px; height:62px; transform:translateX(-50%); } .room-saturn-fixture-v091::before{ content:""; position:absolute; left:12px; top:12px; width:38px; height:38px; border-radius:50%; background: repeating-linear-gradient(7deg,rgba(255,255,255,.12) 0 3px,transparent 3px 8px), radial-gradient(circle at 34% 28%,#f7d891,#c18f58 54%,#73516d 100%); border:3px solid #403047; box-shadow: 0 0 12px rgba(199,154,255,.5), 0 0 28px rgba(92,143,255,.28); animation:ggSaturnPulseV091 2.4s ease-in-out infinite alternate; } .room-saturn-fixture-v091::after{ content:""; position:absolute; left:2px; top:24px; width:58px; height:18px; border:5px solid #e0c18b; border-left-color:#ad87c7; border-right-color:#8fc5e8; border-radius:50%; transform:rotate(-14deg); box-shadow:0 0 8px rgba(212,190,255,.55); } @keyframes ggSaturnPulseV091{ from{filter:brightness(.92);transform:scale(.96)} to{filter:brightness(1.16);transform:scale(1.04)} } /* Galaxy projector effect */ .room-saturn-galaxy-v091{ position:absolute; inset:0; z-index:36; overflow:hidden; pointer-events:none; display:none; opacity:.9; background: radial-gradient(ellipse at 18% 30%,rgba(112,75,186,.22),transparent 28%), radial-gradient(ellipse at 74% 42%,rgba(61,133,209,.2),transparent 31%), radial-gradient(ellipse at 50% 70%,rgba(180,73,155,.16),transparent 34%); } .room-saturn-galaxy-v091.show{ display:block; animation:ggGalaxyDriftV091 8s ease-in-out infinite alternate; } .room-saturn-galaxy-v091::before{ content:""; position:absolute; inset:-25%; background: conic-gradient(from 20deg at 50% 50%, transparent 0 12%, rgba(103,69,184,.12) 18%, transparent 31%, rgba(62,130,206,.14) 41%, transparent 56%, rgba(197,82,169,.12) 68%, transparent 82%); animation:ggGalaxyRotateV091 18s linear infinite; } .room-saturn-galaxy-v091 i{ position:absolute; width:5px; height:5px; border-radius:50%; background:#f3e9ff; box-shadow:0 0 8px #d9c4ff,0 0 15px rgba(128,188,255,.7); animation:ggGalaxyTwinkleV091 1.5s ease-in-out infinite alternate; } .room-saturn-galaxy-v091 i:nth-child(1){left:9%;top:22%;animation-delay:.1s} .room-saturn-galaxy-v091 i:nth-child(2){left:21%;top:48%;animation-delay:.6s} .room-saturn-galaxy-v091 i:nth-child(3){left:34%;top:16%;animation-delay:.3s} .room-saturn-galaxy-v091 i:nth-child(4){left:48%;top:35%;animation-delay:.9s} .room-saturn-galaxy-v091 i:nth-child(5){left:62%;top:19%;animation-delay:.45s} .room-saturn-galaxy-v091 i:nth-child(6){left:76%;top:51%;animation-delay:.7s} .room-saturn-galaxy-v091 i:nth-child(7){left:88%;top:27%;animation-delay:1.05s} .room-saturn-galaxy-v091 i:nth-child(8){left:16%;top:72%;animation-delay:.85s} .room-saturn-galaxy-v091 i:nth-child(9){left:56%;top:66%;animation-delay:.22s} .room-saturn-galaxy-v091 i:nth-child(10){left:82%;top:78%;animation-delay:.52s} .room-light-overlay-v071[data-lighting="saturn"]{ opacity:.24; background: radial-gradient(circle at 50% 8%,rgba(178,142,255,.48),rgba(68,108,190,.12) 44%,transparent 78%); } @keyframes ggGalaxyTwinkleV091{ from{opacity:.25;transform:scale(.55)} to{opacity:1;transform:scale(1.45)} } @keyframes ggGalaxyRotateV091{ to{transform:rotate(360deg)} } @keyframes ggGalaxyDriftV091{ from{filter:hue-rotate(0deg) brightness(.95)} to{filter:hue-rotate(28deg) brightness(1.08)} } /* v092 avatar sits at the very front/bottom edge of its room */ body.room-page-v054 .room-avatar.room-avatar-exact{ bottom:-42px !important; } @media(max-width:760px){ body.room-page-v054 .room-avatar.room-avatar-exact{ bottom:-30px !important; } } /* v092 tutorial Home icon uses the same drawn door as Avatar Home. */ .gg-tutorial-door-icon-v092{ width:38px !important; height:48px !important; vertical-align:middle; } /* v092 asteroid belt lives only inside the Space Scene window */ .room-asteroid-belt-v092{ position:absolute; inset:0; z-index:5; display:none; overflow:hidden; pointer-events:none; } .room-asteroid-belt-v092.show{ display:block; } .room-asteroid-belt-v092::before{ content:""; position:absolute; left:-18%; top:48%; width:138%; height:30%; border-top:2px solid rgba(178,158,132,.18); border-bottom:2px solid rgba(178,158,132,.12); border-radius:50%; transform:rotate(-12deg); filter:drop-shadow(0 0 5px rgba(165,145,126,.15)); } .room-asteroid-belt-v092 i{ position:absolute; width:10px; height:8px; border-radius:48% 58% 44% 54%; background:linear-gradient(145deg,#9c8b79,#514943); box-shadow: inset 2px 1px 2px rgba(255,255,255,.15), 0 2px 4px rgba(0,0,0,.35); animation:ggAsteroidOrbitV092 8s linear infinite; } .room-asteroid-belt-v092 i:nth-child(1){left:4%;top:55%;transform:scale(.65);animation-delay:-1s} .room-asteroid-belt-v092 i:nth-child(2){left:12%;top:48%;transform:scale(1.1);animation-delay:-4s} .room-asteroid-belt-v092 i:nth-child(3){left:22%;top:60%;transform:scale(.8);animation-delay:-2.2s} .room-asteroid-belt-v092 i:nth-child(4){left:31%;top:51%;transform:scale(.55);animation-delay:-6s} .room-asteroid-belt-v092 i:nth-child(5){left:40%;top:64%;transform:scale(1.25);animation-delay:-3.5s} .room-asteroid-belt-v092 i:nth-child(6){left:49%;top:52%;transform:scale(.7);animation-delay:-7s} .room-asteroid-belt-v092 i:nth-child(7){left:58%;top:59%;transform:scale(1);animation-delay:-.8s} .room-asteroid-belt-v092 i:nth-child(8){left:67%;top:47%;transform:scale(.5);animation-delay:-5.3s} .room-asteroid-belt-v092 i:nth-child(9){left:75%;top:62%;transform:scale(1.2);animation-delay:-2.7s} .room-asteroid-belt-v092 i:nth-child(10){left:83%;top:53%;transform:scale(.72);animation-delay:-6.8s} .room-asteroid-belt-v092 i:nth-child(11){left:91%;top:60%;transform:scale(.9);animation-delay:-4.5s} .room-asteroid-belt-v092 i:nth-child(12){left:97%;top:49%;transform:scale(.58);animation-delay:-1.7s} @keyframes ggAsteroidOrbitV092{ 0%{translate:-8px 4px;rotate:0deg} 50%{translate:8px -4px;rotate:180deg} 100%{translate:-8px 4px;rotate:360deg} } /* Occasional low-gravity rock crossing the Space window */ .room-space-rock-v092{ position:absolute; left:-22%; top:var(--rock-y,35%); z-index:7; width:var(--rock-size,28px); aspect-ratio:1.15; border-radius:46% 59% 42% 55%; background: radial-gradient(circle at 33% 30%,rgba(255,255,255,.15) 0 7%,transparent 8%), radial-gradient(circle at 68% 58%,rgba(25,20,18,.24) 0 12%,transparent 13%), linear-gradient(145deg,#877666,#4c4541); box-shadow: inset 3px 2px 4px rgba(255,255,255,.1), 0 4px 8px rgba(0,0,0,.35); opacity:0; pointer-events:none; } .room-space-rock-v092.float{ animation:ggSpaceRockFloatV092 7.2s linear forwards; } @keyframes ggSpaceRockFloatV092{ 0%{ left:-22%; opacity:0; transform:translateY(0) rotate(var(--rock-rot)) scale(.75); } 10%{opacity:.85} 50%{ transform:translateY(var(--rock-drift)) rotate(calc(var(--rock-rot) + 150deg)) scale(1); } 90%{opacity:.85} 100%{ left:112%; opacity:0; transform:translateY(calc(var(--rock-drift) * -0.5)) rotate(calc(var(--rock-rot) + 320deg)) scale(.82); } } /* v093 — avatar sits slightly lower at the bottom edge */ body.room-page-v054 .room-avatar.room-avatar-exact{ bottom:-54px !important; } @media(max-width:760px){ body.room-page-v054 .room-avatar.room-avatar-exact{ bottom:-40px !important; } } /* v093 unlocked Space Rock Extra — deliberately above avatar */ #roomExtrasLayerV059{ z-index:95 !important; pointer-events:none; } #roomBeachBallV059, #roomSpaceRockExtraV093{ pointer-events:auto; } .room-space-rock-extra-v093{ position:absolute; left:72%; top:64%; z-index:100 !important; width:54px; height:46px; border:0; border-radius:48% 57% 43% 54%; cursor:pointer; touch-action:manipulation; background: radial-gradient(circle at 30% 28%,rgba(255,255,255,.18) 0 7%,transparent 8%), radial-gradient(circle at 68% 60%,rgba(28,22,20,.28) 0 12%,transparent 13%), radial-gradient(circle at 44% 74%,rgba(25,20,18,.2) 0 8%,transparent 9%), linear-gradient(145deg,#9b8874,#62574e 55%,#403a38); box-shadow: inset 4px 3px 5px rgba(255,255,255,.11), inset -5px -4px 7px rgba(0,0,0,.18), 0 7px 12px rgba(0,0,0,.3); } .room-space-rock-extra-v093[hidden]{ display:none !important; } .room-space-rock-extra-v093.float-v093{ animation:ggSpaceRockExtraFloatV093 1.8s cubic-bezier(.2,.7,.3,1) forwards; } @keyframes ggSpaceRockExtraFloatV093{ 0%{transform:translate(0,0) rotate(var(--rock-extra-r1)) scale(1)} 48%{transform:translate(calc(var(--rock-extra-dx)*.55),calc(var(--rock-extra-dy)*.55 - 14px)) rotate(calc(var(--rock-extra-r2)*.55)) scale(1.06)} 100%{transform:translate(var(--rock-extra-dx),var(--rock-extra-dy)) rotate(var(--rock-extra-r2)) scale(.96)} } /* Space Rock unlock notification */ .gg-space-rock-unlock-v093{ position:fixed; left:50%; top:max(22px,env(safe-area-inset-top)); z-index:2147483647; width:min(calc(100% - 28px),420px); transform:translate(-50%,-14px) scale(.96); padding:12px 16px; border-radius:18px; background:rgba(15,13,20,.97); border:1px solid rgba(179,151,225,.72); color:#f7f0ff; text-align:center; opacity:0; transition:.3s ease; pointer-events:none; box-shadow:0 12px 34px rgba(0,0,0,.45),0 0 26px rgba(127,93,195,.25); } .gg-space-rock-unlock-v093 b, .gg-space-rock-unlock-v093 span{display:block} .gg-space-rock-unlock-v093 span{ margin-top:3px; color:#cabce1; font-size:.76rem; font-weight:800; } .gg-space-rock-unlock-v093.show{ opacity:1; transform:translate(-50%,0) scale(1); } /* v095 avatar slightly lower in Avatar Room */ body.room-page-v054 .room-avatar.room-avatar-exact{ bottom:-64px !important; } @media(max-width:760px){ body.room-page-v054 .room-avatar.room-avatar-exact{ bottom:-48px !important; } } /* Candle Light redesigned as a hanging chandelier */ .room-chandelier-v095{ display:none; } .room-ceiling-light-v072[data-lighting="candle"] .room-ceiling-fixture-v072, .room-ceiling-light-v072[data-lighting="candle"] .room-star-fixture-v072, .room-ceiling-light-v072[data-lighting="candle"] .room-disco-ball-v072, .room-ceiling-light-v072[data-lighting="candle"] .room-saturn-fixture-v091{ display:none !important; } .room-ceiling-light-v072[data-lighting="candle"] .room-chandelier-v095{ display:block; position:absolute; left:50%; top:0; width:132px; height:110px; transform:translateX(-50%); } .room-chandelier-v095 .chain{ position:absolute; left:50%; top:-2px; width:4px; height:38px; background:repeating-linear-gradient(#332822 0 5px,#6f5647 5px 9px); transform:translateX(-50%); } .room-chandelier-v095 .hub{ position:absolute; left:50%; top:38px; width:22px; height:18px; border-radius:50%; background:#4d372c; border:2px solid #1d1714; transform:translateX(-50%); } .room-chandelier-v095 .arm{ position:absolute; left:50%; top:47px; width:54px; height:29px; border-bottom:5px solid #4b352b; border-radius:0 0 70% 70%; transform-origin:0 0; } .room-chandelier-v095 .arm.a1{transform:rotate(-69deg)} .room-chandelier-v095 .arm.a2{transform:rotate(-34deg)} .room-chandelier-v095 .arm.a3{transform:rotate(0deg)} .room-chandelier-v095 .arm.a4{transform:rotate(34deg)} .room-chandelier-v095 .arm.a5{transform:rotate(69deg)} .room-chandelier-v095 .arm i{ position:absolute; right:-3px; bottom:-8px; width:10px; height:25px; border-radius:3px 3px 1px 1px; background:linear-gradient(90deg,#e7d2ae,#fff1cf,#cdb894); border:1px solid #69584c; } .room-chandelier-v095 .arm i::before{ content:""; position:absolute; left:50%; top:-15px; width:10px; height:17px; border-radius:50% 50% 45% 45%; background:radial-gradient(circle at 50% 70%,#fff5a5 0 17%,#ffad38 42%,#f26624 70%,transparent 72%); transform:translateX(-50%); filter:drop-shadow(0 0 5px #ffb44e) drop-shadow(0 0 10px rgba(255,147,42,.6)); animation:ggChandelierFlameV095 .42s ease-in-out infinite alternate; } .room-chandelier-v095 .arm:nth-of-type(even) i::before{animation-delay:.16s} @keyframes ggChandelierFlameV095{ from{transform:translateX(-50%) scale(.88) rotate(-3deg);opacity:.85} to{transform:translateX(-50%) scale(1.08) rotate(4deg);opacity:1} } .room-light-overlay-v071[data-lighting="candle"]{ opacity:.25; background: radial-gradient(circle at 50% 13%,rgba(255,177,72,.48),rgba(106,53,21,.13) 48%,transparent 80%); } /* Wolf howl reaction */ .room-wolf-howl-v095{ position:absolute; left:50%; top:26%; z-index:98; transform:translate(-50%,-50%); padding:9px 14px; border-radius:999px; background:rgba(9,11,17,.92); border:1px solid rgba(195,210,235,.52); color:#f0f5ff; font-weight:900; opacity:0; pointer-events:none; white-space:nowrap; } .room-wolf-howl-v095.show{ animation:ggWolfHowlTextV095 2.6s ease forwards; } @keyframes ggWolfHowlTextV095{ 0%{opacity:0;transform:translate(-50%,5px) scale(.9)} 12%,76%{opacity:1;transform:translate(-50%,-8px) scale(1)} 100%{opacity:0;transform:translate(-50%,-30px) scale(.95)} } .gg-wolf-howl-v095{ animation:ggWolfHowlBodyV095 .3s ease-in-out 5 alternate !important; transform-origin:50% 75%; } @keyframes ggWolfHowlBodyV095{ from{rotate:-2deg;translate:0 1px} to{rotate:2deg;translate:0 -5px} } /* Werewolf unlock toast */ .gg-werewolf-unlock-v095{ position:fixed; left:50%; top:max(22px,env(safe-area-inset-top)); z-index:2147483647; width:min(calc(100% - 28px),430px); transform:translate(-50%,-14px) scale(.96); padding:12px 16px; border-radius:18px; background:rgba(11,13,18,.98); border:1px solid rgba(159,178,202,.72); color:#f3f7ff; text-align:center; opacity:0; visibility:hidden; pointer-events:none; box-shadow:0 12px 34px rgba(0,0,0,.46),0 0 25px rgba(119,144,174,.2); } .gg-werewolf-unlock-v095 b, .gg-werewolf-unlock-v095 span{display:block} .gg-werewolf-unlock-v095 span{ margin-top:4px; color:#c9d1dc; font-size:.75rem; font-weight:800; } .gg-werewolf-unlock-v095.show{ visibility:visible; animation:ggWerewolfUnlockV095 3.4s ease forwards; } @keyframes ggWerewolfUnlockV095{ 0%{opacity:0;transform:translate(-50%,-14px) scale(.96)} 9%,82%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-10px) scale(.97)} } /* v096 — avatar slightly lower again */ body.room-page-v054 .room-avatar.room-avatar-exact{ bottom:-74px !important; } @media(max-width:760px){ body.room-page-v054 .room-avatar.room-avatar-exact{ bottom:-58px !important; } } /* v096 — stone-beam candle chandelier */ .room-ceiling-light-v072[data-lighting="candle"] .room-stone-chandelier-v096{ display:block !important; position:absolute; left:50%; top:-2px; width:176px; height:118px; transform:translateX(-50%); } .room-stone-chandelier-v096 .chain, .room-stone-chandelier-v096 .arm, .room-stone-chandelier-v096 .hub{ display:none !important; } .room-stone-chandelier-v096 .hang-chain{ position:absolute; top:0; width:5px; height:53px; background:repeating-linear-gradient( to bottom, #241e1b 0 5px, #77675d 5px 8px, #302723 8px 13px ); border-radius:3px; filter:drop-shadow(1px 2px 1px rgba(0,0,0,.45)); } .room-stone-chandelier-v096 .hang-chain.left{left:38px} .room-stone-chandelier-v096 .hang-chain.right{right:38px} .room-stone-chandelier-v096 .stone-beam{ position:absolute; left:8px; top:48px; width:160px; height:24px; border-radius:6px 8px 5px 7px; background: linear-gradient(165deg,transparent 0 8%,rgba(255,255,255,.08) 9% 12%,transparent 13%), linear-gradient(12deg,transparent 0 58%,rgba(29,27,28,.22) 59% 62%,transparent 63%), linear-gradient(#777370,#514f4f 60%,#393838); border:3px solid #292929; box-shadow: inset 0 3px 3px rgba(255,255,255,.12), inset 0 -4px 5px rgba(0,0,0,.28), 0 6px 9px rgba(0,0,0,.3); } .room-stone-chandelier-v096 .stone-beam::before, .room-stone-chandelier-v096 .stone-beam::after{ content:""; position:absolute; width:24px; height:3px; background:rgba(31,29,30,.45); transform:rotate(-17deg); } .room-stone-chandelier-v096 .stone-beam::before{left:28px;top:8px} .room-stone-chandelier-v096 .stone-beam::after{right:24px;top:12px;transform:rotate(13deg)} .room-stone-chandelier-v096 .stone-candle{ position:absolute; top:29px; width:13px; height:27px; border-radius:3px 3px 1px 1px; background:linear-gradient(90deg,#c9b897,#f4e2b9 48%,#b7a586); border:1px solid #625a4e; z-index:2; transform:none !important; } .room-stone-chandelier-v096 .stone-candle.c1{left:24px} .room-stone-chandelier-v096 .stone-candle.c2{left:55px} .room-stone-chandelier-v096 .stone-candle.c3{left:82px} .room-stone-chandelier-v096 .stone-candle.c4{left:109px} .room-stone-chandelier-v096 .stone-candle.c5{left:140px} .room-stone-chandelier-v096 .stone-candle i{ position:absolute; left:50%; top:-17px; width:11px; height:18px; transform:translateX(-50%); border-radius:52% 52% 48% 48%; background:radial-gradient(circle at 50% 72%,#fff6ae 0 18%,#ffb43f 43%,#f06a22 69%,transparent 72%); filter:drop-shadow(0 0 5px #ffb34d) drop-shadow(0 0 10px rgba(255,144,38,.62)); animation:ggStoneCandleFlameV096 .48s ease-in-out infinite alternate; } .room-stone-chandelier-v096 .stone-candle:nth-of-type(even) i{animation-delay:.16s} .room-stone-chandelier-v096 .stone-candle i::after{ content:""; position:absolute; left:50%; bottom:-4px; width:2px; height:6px; background:#27201b; transform:translateX(-50%); } @keyframes ggStoneCandleFlameV096{ from{scale:.9 1;rotate:-2deg;opacity:.88} to{scale:1.06 1.12;rotate:2deg;opacity:1} } /* v097 Bookshelf floor decor */ .v097-bookshelf{ position:relative; display:block; width:104px; height:132px; border:5px solid #322118; border-radius:5px 5px 3px 3px; background: linear-gradient(90deg,rgba(255,255,255,.05),transparent 16% 84%,rgba(0,0,0,.16)), #5a3927; box-shadow: inset 0 0 0 4px #765039, 0 8px 12px rgba(0,0,0,.32); } .v097-bookshelf::before, .v097-bookshelf::after, .v097-bookshelf .shelf{ content:""; position:absolute; left:6px; right:6px; height:7px; border-radius:2px; background:#2e1e17; box-shadow:0 2px 0 #80543a; } .v097-bookshelf::before{top:39px} .v097-bookshelf::after{top:81px} .v097-bookshelf .s1{top:119px} .v097-bookshelf .s2{top:2px} .v097-bookshelf .book{ position:absolute; bottom:12px; width:10px; border-radius:2px 2px 0 0; border:1px solid rgba(28,17,15,.55); box-shadow:inset 2px 0 rgba(255,255,255,.08); } .v097-bookshelf .b1{left:12px;height:31px;background:#7f2539} .v097-bookshelf .b2{left:23px;height:26px;background:#263f72} .v097-bookshelf .b3{left:35px;height:35px;background:#9d742d} .v097-bookshelf .b4{left:49px;height:28px;background:#3e6948} .v097-bookshelf .b5{left:63px;height:34px;background:#59356f} .v097-bookshelf .b6{left:76px;height:25px;background:#a14b32} .v097-bookshelf .b7{left:19px;bottom:54px;height:26px;background:#365d63} .v097-bookshelf .b8{left:70px;bottom:54px;height:25px;background:#7f672c} /* Game portal prompt */ body.gg-game-modal-open-v097, body.gg-mini-game-open-v097{ overflow:hidden !important; } .gg-game-prompt-v097{ position:fixed; inset:0; z-index:2147483647; display:none; place-items:center; padding:20px; background:rgba(5,4,7,.76); backdrop-filter:blur(8px); } .gg-game-prompt-v097.show{display:grid} .gg-game-prompt-card-v097{ width:min(100%,430px); padding:25px 22px 21px; border-radius:24px; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%); border:1px solid rgba(215,176,91,.62); color:#181818; text-align:center; box-shadow:none; } .gg-game-prompt-icon-v097{ font-size:2.2rem; margin-bottom:5px; } .gg-game-prompt-card-v097 h2{margin:0 0 9px} .gg-game-prompt-card-v097 p{ margin:7px 0 12px; color:#d9cfdd; } .gg-game-prompt-card-v097 strong{ display:block; color:#e2bd66; margin-bottom:15px; } .gg-game-prompt-actions-v097{ display:flex; justify-content:center; gap:10px; } .gg-game-prompt-actions-v097 button, .gg-mini-game-message-v097 button{ min-width:116px; padding:11px 17px; border-radius:999px; font:inherit; font-weight:900; cursor:pointer; } .gg-game-prompt-actions-v097 .play, .gg-mini-game-message-v097 button{ border:1px solid #d7b05b; background:#d7b05b; color:#111; } .gg-game-prompt-actions-v097 .cancel{ border:1px solid rgba(255,255,255,.24); background:#242129; color:#eee8f0; } /* Full-screen mini game */ .gg-mini-game-v097{ position:fixed; inset:0; z-index:2147483647; display:none; padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom)); background: radial-gradient(circle at 50% 15%,rgba(96,49,123,.34),transparent 36%), linear-gradient(#09070d,#121019); } .gg-mini-game-v097.show{display:block} .gg-mini-game-shell-v097{ position:relative; width:min(100%,720px); height:100%; margin:auto; display:flex; flex-direction:column; overflow:hidden; border-radius:24px; border:1px solid rgba(215,176,91,.42); background:#100d14; box-shadow:0 0 55px rgba(0,0,0,.5); } .gg-mini-game-head-v097{ display:flex; align-items:center; justify-content:space-between; padding:14px 16px 10px; } .gg-mini-game-head-v097 small{ color:#d7b05b; font-weight:900; text-transform:uppercase; letter-spacing:.08em; } .gg-mini-game-head-v097 h2{ margin:2px 0 0; color:#f4eef5; } .gg-mini-game-head-v097>button{ width:42px; height:42px; border-radius:50%; border:1px solid rgba(255,255,255,.18); background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%); color:#181818; font-size:1.15rem; cursor:pointer; } .gg-mini-game-stats-v097{ display:flex; gap:8px; padding:0 14px 10px; } .gg-mini-game-stats-v097 span{ flex:1; padding:8px 10px; border-radius:12px; background:#1b1720; border:1px solid rgba(255,255,255,.08); color:#cfc5d2; text-align:center; font-size:.82rem; } .gg-mini-game-stats-v097 b{ color:#f4d477; font-size:1rem; } .gg-book-hunt-stage-v097{ position:relative; flex:1; overflow:hidden; margin:0 12px 12px; min-height:320px; border-radius:18px; border:2px solid #2c1e24; background: linear-gradient(90deg,rgba(255,255,255,.025),transparent 16% 84%,rgba(0,0,0,.13)), repeating-linear-gradient(to bottom,#563825 0 90px,#2d1d17 90px 98px); box-shadow:inset 0 0 40px rgba(0,0,0,.38); } /* falling books */ .gg-book-target-v097{ position:absolute; left:var(--book-x); top:-70px; width:42px; height:58px; z-index:2; border:0; background:none; padding:0; cursor:pointer; touch-action:manipulation; animation:ggBookFallV097 var(--book-duration) linear forwards; } .gg-book-target-v097.cursed{ border-radius:3px 7px 7px 3px; background:linear-gradient(90deg,#39244b 0 14%,#7b4c91 15% 100%); border:2px solid #26182f; box-shadow: inset 5px 0 rgba(0,0,0,.2), 0 0 12px rgba(190,91,239,.42); } .gg-book-target-v097.cursed::before{ content:"✦"; position:absolute; inset:9px 6px auto 11px; color:#f5d779; font-size:1.2rem; } .gg-book-target-v097.cursed i, .gg-book-target-v097.cursed span{ position:absolute; left:9px; right:6px; height:2px; background:rgba(239,220,174,.45); } .gg-book-target-v097.cursed i{bottom:13px} .gg-book-target-v097.cursed span{bottom:8px} .gg-book-target-v097.trap{ display:grid; place-items:center; border-radius:10px; border:2px solid #40272b; background:#262128; box-shadow:0 0 10px rgba(204,54,70,.22); } .gg-book-target-v097.trap b{ font-size:1.7rem; } .gg-book-target-v097.hit{ animation:none !important; } .gg-book-target-v097.good-hit{ transform:scale(1.35) rotate(12deg); opacity:0; transition:.25s ease; } .gg-book-target-v097.bad-hit{ transform:scale(.75) rotate(-15deg); filter:brightness(1.5); opacity:0; transition:.25s ease; } @keyframes ggBookFallV097{ 0%{top:-70px;transform:translateX(0) rotate(-5deg)} 35%{transform:translateX(var(--book-wobble)) rotate(7deg)} 70%{transform:translateX(calc(var(--book-wobble) * -.6)) rotate(-7deg)} 100%{top:105%;transform:translateX(0) rotate(6deg)} } .gg-mini-game-message-v097{ position:absolute; left:50%; top:54%; z-index:10; display:none; width:min(calc(100% - 42px),380px); transform:translate(-50%,-50%); padding:20px; border-radius:20px; background:rgba(18,14,21,.96); border:1px solid rgba(215,176,91,.56); color:#f7f2f8; text-align:center; box-shadow:0 18px 55px rgba(0,0,0,.48); } .gg-mini-game-message-v097.show{display:block} .gg-mini-game-message-v097 b, .gg-mini-game-message-v097 span{ display:block; } .gg-mini-game-message-v097 b{ font-size:1.25rem; margin-bottom:6px; } .gg-mini-game-message-v097 span{ color:#d6cdd9; line-height:1.4; margin-bottom:14px; } @media(max-width:600px){ .gg-mini-game-v097{padding:0} .gg-mini-game-shell-v097{ border-radius:0; border-left:0; border-right:0; } .gg-book-hunt-stage-v097{ margin-left:8px; margin-right:8px; } } /* v098 Space Rock keeps its final position after every tap */ .room-space-rock-extra-v093{ transform:translate(-50%,-50%) !important; will-change:transform,left,top; } /* v093 keyframe class is no longer used by the interactive rock in v098. Web Animations commits the final left/top position instead of snapping to origin. */ /* v099 room objects stay behind avatar visually but remain movable through stage-level geometric hit testing. */ #roomFloorDecorV061, #roomWallDecorV061, #roomPotLayerV055{ z-index:18 !important; touch-action:none !important; will-change:left,top,transform; } #roomFloorDecorV061.dragging-v099, #roomWallDecorV061.dragging-v099, #roomPotLayerV055.dragging-v099{ z-index:18 !important; transition:none !important; cursor:grabbing !important; } /* Beach Ball is a foreground Extra, but its physics always settles it on floor. */ #roomBeachBallV059{ z-index:96 !important; touch-action:manipulation; } .gg-game-prompt-card-v097 strong{ line-height:1.35; } /* v100 — Pot layer visibility is explicit; selected pots cannot vanish. */ body.room-page-v054 #roomPotLayerV055:not([hidden]){ display:block !important; opacity:1 !important; visibility:visible !important; } body.room-page-v054 #roomPotLayerV055[hidden]{ display:none !important; } /* Stronger pot silhouette and rim. */ body.room-page-v054 .room-pot-v055{ width:76px !important; height:64px !important; clip-path:polygon(7% 0,93% 0,80% 100%,20% 100%) !important; border:3px solid #171313 !important; border-radius:5px 5px 11px 11px; box-shadow: inset 7px 0 10px rgba(255,255,255,.08), inset -8px -6px 11px rgba(0,0,0,.22), 0 7px 10px rgba(0,0,0,.28); } .gg-pot-rim-v100{ position:absolute; left:50%; top:-6px; width:82px; height:15px; transform:translateX(-50%); border-radius:50%; background:inherit; border:3px solid #171313; box-shadow:inset 0 3px 3px rgba(255,255,255,.1); } .gg-pot-shine-v100{ position:absolute; left:17px; top:16px; width:8px; height:28px; border-radius:50%; background:rgba(255,255,255,.12); transform:rotate(8deg); } .room-pot-layer-v055[data-pot="black"] .room-pot-v055{background:linear-gradient(90deg,#15151a,#2a2930,#111116)} .room-pot-layer-v055[data-pot="gold"] .room-pot-v055{background:linear-gradient(90deg,#8d6726,#d8ae53,#7a571f)} .room-pot-layer-v055[data-pot="terracotta"] .room-pot-v055{background:linear-gradient(90deg,#85452f,#c56d49,#763a29)} .room-pot-layer-v055[data-pot="white"] .room-pot-v055{background:linear-gradient(90deg,#bcb7ad,#f4efe4,#aaa59d)} /* Replace the single flower emoji with a small hand-built bouquet. */ .room-pot-layer-v055[data-plant="flowers"] .room-pot-plant-v055::before{ content:none !important; } .room-pot-plant-v055.gg-custom-flowers-v100{ width:106px !important; height:126px !important; left:50% !important; bottom:28px !important; transform:translateX(-50%) !important; overflow:visible; } .gg-flower-stem-v100{ position:absolute; left:50%; bottom:0; width:5px; height:82px; border-radius:5px; background:linear-gradient(90deg,#315c34,#5f9151,#284b2d); transform-origin:50% 100%; } .gg-flower-stem-v100.s1{transform:translateX(-50%) rotate(-20deg);height:72px} .gg-flower-stem-v100.s2{transform:translateX(-50%) rotate(-10deg);height:89px} .gg-flower-stem-v100.s3{transform:translateX(-50%) rotate(0deg);height:99px} .gg-flower-stem-v100.s4{transform:translateX(-50%) rotate(11deg);height:86px} .gg-flower-stem-v100.s5{transform:translateX(-50%) rotate(21deg);height:70px} .gg-flower-stem-v100 .leaf{ position:absolute; width:26px; height:12px; border-radius:80% 10% 80% 10%; background:linear-gradient(135deg,#4d884a,#2f6336); box-shadow:inset 2px 1px rgba(255,255,255,.1); } .gg-flower-stem-v100 .l1{left:-22px;top:38px;transform:rotate(-24deg)} .gg-flower-stem-v100 .l2{left:1px;top:48px;transform:rotate(25deg)} .gg-flower-stem-v100 .l3{left:-23px;top:57px;transform:rotate(-19deg)} .gg-flower-stem-v100 .l4{left:1px;top:41px;transform:rotate(27deg)} .gg-flower-stem-v100 .l5{left:-21px;top:35px;transform:rotate(-28deg)} .gg-flower-stem-v100 .bloom{ position:absolute; left:50%; top:-13px; width:31px; height:31px; transform:translateX(-50%); border-radius:50%; background: radial-gradient(circle at 50% 8%,#db7aa8 0 20%,transparent 21%), radial-gradient(circle at 88% 35%,#e98fba 0 20%,transparent 21%), radial-gradient(circle at 77% 82%,#c85a91 0 20%,transparent 21%), radial-gradient(circle at 24% 82%,#ef9dc0 0 20%,transparent 21%), radial-gradient(circle at 12% 35%,#d86ca0 0 20%,transparent 21%); filter:drop-shadow(0 2px 2px rgba(0,0,0,.18)); } .gg-flower-stem-v100 .bloom em{ position:absolute; left:50%; top:50%; width:9px; height:9px; border-radius:50%; background:#e6bc52; transform:translate(-50%,-50%); box-shadow:0 0 4px rgba(230,188,82,.5); } .gg-flower-stem-v100 .b2{filter:hue-rotate(24deg) drop-shadow(0 2px 2px rgba(0,0,0,.18))} .gg-flower-stem-v100 .b3{filter:hue-rotate(-25deg) drop-shadow(0 2px 2px rgba(0,0,0,.18))} .gg-flower-stem-v100 .b4{filter:hue-rotate(42deg) drop-shadow(0 2px 2px rgba(0,0,0,.18))} .gg-flower-stem-v100 .b5{filter:hue-rotate(-10deg) drop-shadow(0 2px 2px rgba(0,0,0,.18))} /* Keep new flower stems tucked behind pot. */ body.room-page-v054 .room-pot-plant-v055.gg-custom-flowers-v100{ z-index:1 !important; } body.room-page-v054 .room-pot-v055{ z-index:3 !important; } /* Game overlay must win over room UI when Play is pressed. */ .gg-mini-game-v097.show{ display:block !important; visibility:visible !important; opacity:1 !important; } /* v101 Y-based room-object depth. The lower an object is on-screen, the higher its room depth. */ #roomFloorDecorV061, #roomWallDecorV061, #roomPotLayerV055, #roomFloorDecorV061.dragging-v099, #roomWallDecorV061.dragging-v099, #roomPotLayerV055.dragging-v099{ z-index:var(--room-depth-z,18) !important; } /* Library wallpaper — first 100-point Book Hunt reward */ body.room-page-v054 #avatarRoom[data-wall="library"]{ background: linear-gradient(rgba(16,10,8,.08),rgba(8,5,4,.22)), repeating-linear-gradient( to bottom, #56351f 0 9px, #2b1a12 9px 13px, #725033 13px 17px, #21130e 17px 21px ), linear-gradient(#3c2418,#26160f) !important; } body.room-page-v054 #avatarRoom[data-wall="library"] .room-wall-backdrop-v068{ background: repeating-linear-gradient( 90deg, rgba(92,42,45,.94) 0 13px, rgba(37,57,84,.94) 13px 27px, rgba(112,84,37,.95) 27px 39px, rgba(52,83,58,.94) 39px 54px, rgba(72,42,84,.94) 54px 68px ) 0 16%/100% 18% repeat-y, repeating-linear-gradient( to bottom, #4d2e1d 0 3px, #24160f 3px 6px, transparent 6px 23% ), linear-gradient(#301b13,#1d100c) !important; } body.room-page-v054 #avatarRoom[data-wall="library"] .room-wall-backdrop-v068::after{ content:""; position:absolute; inset:0; background: linear-gradient(90deg,transparent 0 9%,rgba(20,11,8,.55) 9% 11%,transparent 11% 89%,rgba(20,11,8,.55) 89% 91%,transparent 91%), repeating-linear-gradient(to bottom,transparent 0 22%,rgba(17,10,7,.78) 22% 24%,transparent 24% 46%); pointer-events:none; } /* Book Hunt 100-point unlock */ .gg-book-100-unlock-v101{ position:fixed; left:50%; top:max(22px,env(safe-area-inset-top)); z-index:2147483647; width:min(calc(100% - 28px),440px); transform:translate(-50%,-14px) scale(.96); padding:13px 16px; border-radius:18px; background:rgba(18,12,9,.98); border:1px solid rgba(215,176,91,.72); color:#fff4d1; text-align:center; opacity:0; visibility:hidden; pointer-events:none; box-shadow:0 13px 36px rgba(0,0,0,.48); } .gg-book-100-unlock-v101 b, .gg-book-100-unlock-v101 span{display:block} .gg-book-100-unlock-v101 span{ margin-top:4px; color:#dccba7; font-size:.78rem; font-weight:800; } .gg-book-100-unlock-v101.show{ visibility:visible; animation:ggBook100UnlockV101 3.5s ease forwards; } @keyframes ggBook100UnlockV101{ 0%{opacity:0;transform:translate(-50%,-14px) scale(.96)} 9%,82%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-9px) scale(.97)} } /* v102 — richer Library wallpaper: carved wood shelves, books, arches, ladder and lamps */ body.room-page-v054 #avatarRoom[data-wall="library"]{ background: linear-gradient(90deg,rgba(10,6,4,.38),transparent 10% 90%,rgba(10,6,4,.38)), linear-gradient(#5a3822 0 9%,#2b190f 9% 11%,#6a4429 11% 14%,#2a170f 14% 100%) !important; } body.room-page-v054 #avatarRoom[data-wall="library"] .room-wall-backdrop-v068{ overflow:hidden; background: /* gold title plaques */ linear-gradient(90deg,transparent 0 20%,#b68a3f 20% 31%,transparent 31% 69%,#b68a3f 69% 80%,transparent 80%) 0 7%/100% 4% no-repeat, /* rows of colorful books */ repeating-linear-gradient(90deg, #632c36 0 11px,#3d5579 11px 23px,#886c31 23px 34px,#3c6847 34px 46px,#704a78 46px 58px,#a15b36 58px 70px ) 7% 19%/86% 14% repeat-y, /* shelf boards */ repeating-linear-gradient(to bottom, transparent 0 18%,#22130d 18% 20%,#774b2d 20% 22%,transparent 22% 36% ), linear-gradient(90deg,#25150e 0 6%,#55331f 6% 8%,transparent 8% 92%,#55331f 92% 94%,#25150e 94%), linear-gradient(#432719,#24130d) !important; box-shadow:inset 0 0 60px rgba(0,0,0,.45); } body.room-page-v054 #avatarRoom[data-wall="library"] .room-wall-backdrop-v068::before{ content:""; position:absolute; inset:4% 5% 2%; pointer-events:none; background: /* center arched alcove */ radial-gradient(ellipse at 50% 28%,transparent 0 17%,#2a180f 17.5% 19%,transparent 19.5%), /* brass sconces */ radial-gradient(circle at 13% 15%,#ffe39a 0 1.2%,#c68b3d 1.3% 2%,transparent 2.1%), radial-gradient(circle at 87% 15%,#ffe39a 0 1.2%,#c68b3d 1.3% 2%,transparent 2.1%), /* vertical carved posts */ linear-gradient(90deg, #2b190f 0 2%,transparent 2% 24%,#2b190f 24% 26%,transparent 26% 49%,#2b190f 49% 51%,transparent 51% 74%,#2b190f 74% 76%,transparent 76% 98%,#2b190f 98% ); border:4px solid rgba(35,20,13,.8); border-radius:8px; box-shadow:inset 0 0 0 3px rgba(133,88,47,.35); } body.room-page-v054 #avatarRoom[data-wall="library"] .room-wall-backdrop-v068::after{ content:""; position:absolute; right:12%; top:20%; width:8%; height:70%; pointer-events:none; border-left:5px solid #9a7650; border-right:5px solid #9a7650; background: repeating-linear-gradient(to bottom,transparent 0 11%,#8a6847 11% 13%,transparent 13% 22%); transform:skewY(-6deg); filter:drop-shadow(3px 4px 2px rgba(0,0,0,.35)); } /* v102 snake heads animate subtly instead of looking like plain green hair tubes */ .snake-heads-v102>g{ transform-box:fill-box; transform-origin:center bottom; animation:ggSnakeHeadBobV102 1.9s ease-in-out infinite alternate; } .snake-heads-v102>g:nth-child(2n){animation-delay:.45s} .snake-heads-v102>g:nth-child(3n){animation-delay:.8s} @keyframes ggSnakeHeadBobV102{ from{translate:0 1px;rotate:-2deg} to{translate:0 -3px;rotate:3deg} } /* Palm Panic */ .gg-palm-dodge-stage-v102{ position:relative; flex:1; overflow:hidden; margin:0 12px 12px; min-height:320px; border-radius:18px; border:2px solid #294525; background: radial-gradient(circle at 50% 8%,rgba(255,235,154,.45),transparent 24%), linear-gradient(#77bad0 0 58%,#d8bd77 58% 100%); } .gg-palm-dodge-stage-v102[hidden]{display:none !important} .gg-palm-tree-v102{ position:absolute; left:50%; top:-4%; width:260px; height:82%; transform:translateX(-50%); pointer-events:none; } .gg-palm-tree-v102 .trunk{ position:absolute; left:50%; top:17%; width:40px; height:83%; transform:translateX(-50%); border-radius:45% 45% 15% 15%; background: repeating-linear-gradient(165deg,#7a4f27 0 12px,#a36b32 12px 23px,#68431f 23px 28px); box-shadow:inset 7px 0 rgba(255,255,255,.08),inset -7px 0 rgba(0,0,0,.16); } .gg-palm-tree-v102 .leaf{ position:absolute; left:50%; top:10%; width:145px; height:36px; border-radius:100% 6% 100% 8%; background:linear-gradient(180deg,#4c9b4d,#23672f); transform-origin:0 50%; box-shadow:inset 0 -5px rgba(0,0,0,.09); } .gg-palm-tree-v102 .l1{transform:rotate(-155deg)} .gg-palm-tree-v102 .l2{transform:rotate(-120deg)} .gg-palm-tree-v102 .l3{transform:rotate(-80deg)} .gg-palm-tree-v102 .l4{transform:rotate(-25deg)} .gg-palm-tree-v102 .l5{transform:rotate(18deg)} .gg-palm-tree-v102 .l6{transform:rotate(58deg)} .gg-palm-avatar-v102{ position:absolute; left:50%; bottom:5%; width:86px; height:130px; transform:translateX(-50%); z-index:4; transition:left .08s linear; overflow:visible; } .gg-palm-avatar-v102 svg{ width:100% !important; height:100% !important; display:block; } .gg-palm-fallback-gremlin-v102{ position:absolute;inset:18% 14% 0; border-radius:48% 48% 32% 32%; background:#7d8e63; border:3px solid #283326; } .gg-palm-fallback-gremlin-v102::before, .gg-palm-fallback-gremlin-v102::after{ content:"";position:absolute;top:7%;width:28px;height:52px;background:#7d8e63;border:3px solid #283326; } .gg-palm-fallback-gremlin-v102::before{left:-19px;transform:rotate(-28deg);clip-path:polygon(100% 0,0 50%,100% 100%)} .gg-palm-fallback-gremlin-v102::after{right:-19px;transform:rotate(28deg);clip-path:polygon(0 0,100% 50%,0 100%)} .gg-palm-avatar-v102.bonked-v102{animation:ggPalmBonkV102 .28s ease} @keyframes ggPalmBonkV102{50%{transform:translateX(-50%) rotate(12deg) scale(.9)}} .gg-coconut-v102{ position:absolute; top:-42px; width:34px; height:39px; border-radius:48% 52% 57% 43%; background: radial-gradient(circle at 35% 24%,#3b2415 0 5%,transparent 6%), radial-gradient(circle at 52% 20%,#3b2415 0 5%,transparent 6%), linear-gradient(145deg,#8b5428,#4d2c18); box-shadow:inset 4px 3px rgba(255,255,255,.08),0 4px 7px rgba(0,0,0,.25); z-index:5; animation:ggCoconutFallV102 var(--coco-duration) linear forwards; } @keyframes ggCoconutFallV102{ from{top:-44px;rotate:0deg} to{top:103%;rotate:540deg} } .gg-palm-controls-v102{ position:absolute; left:50%; bottom:3%; z-index:8; width:min(92%,420px); display:flex; justify-content:space-between; transform:translateX(-50%); pointer-events:none; } .gg-palm-controls-v102 button{ pointer-events:auto; width:72px;height:58px; border-radius:18px; border:1px solid rgba(255,255,255,.38); background:rgba(15,20,18,.66); color:#fff; font-size:1.5rem; font-weight:900; backdrop-filter:blur(4px); } .gg-palm-win-toast-v102{ position:fixed; left:50%; top:max(22px,env(safe-area-inset-top)); z-index:2147483647; width:min(calc(100% - 28px),430px); transform:translate(-50%,-14px) scale(.96); padding:12px 16px; border-radius:18px; background:rgba(14,24,13,.98); border:1px solid rgba(128,190,91,.72); color:#efffe6; text-align:center; opacity:0;visibility:hidden; pointer-events:none; } .gg-palm-win-toast-v102 b,.gg-palm-win-toast-v102 span{display:block} .gg-palm-win-toast-v102 span{margin-top:4px;color:#cfe5c0;font-size:.78rem;font-weight:800} .gg-palm-win-toast-v102.show{ visibility:visible; animation:ggPalmToastV102 3.4s ease forwards; } @keyframes ggPalmToastV102{ 0%{opacity:0;transform:translate(-50%,-14px) scale(.96)} 10%,82%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-8px) scale(.98)} } /* v103 Snake Hair movement; paint now comes from active hair color/pattern. */ .snake-heads-v103>g{ transform-box:fill-box; transform-origin:center bottom; animation:ggSnakeHeadV103 1.9s ease-in-out infinite alternate; } .snake-heads-v103>g:nth-child(2n){animation-delay:.35s} .snake-heads-v103>g:nth-child(3n){animation-delay:.72s} @keyframes ggSnakeHeadV103{ from{translate:0 1px;rotate:-2deg} to{translate:0 -3px;rotate:3deg} } /* Restored Avatar Room idle life */ .room-avatar.room-avatar-exact{ overflow:visible !important; } .gg-room-idle-fx-v103{ position:absolute; inset:0; z-index:145; pointer-events:none; overflow:visible; } .gg-zzz-v103{ position:absolute; left:68%; top:12%; width:80px; height:105px; } .gg-zzz-v103 i{ position:absolute; color:#d7d8ff; font-style:normal; font-weight:1000; text-shadow:0 0 8px rgba(137,143,255,.65); opacity:0; animation:ggZzzFloatV103 2.5s ease-in-out infinite; } .gg-zzz-v103 i:nth-child(1){left:0;bottom:0;font-size:18px} .gg-zzz-v103 i:nth-child(2){left:24px;bottom:29px;font-size:25px;animation-delay:.45s} .gg-zzz-v103 i:nth-child(3){left:49px;bottom:63px;font-size:34px;animation-delay:.9s} @keyframes ggZzzFloatV103{ 0%{opacity:0;transform:translateY(10px) scale(.8)} 25%,70%{opacity:1} 100%{opacity:0;transform:translateY(-12px) scale(1.08)} } .gg-idle-sleep-v103{ animation:ggSleepSwayV103 1.8s ease-in-out infinite alternate; transform-origin:50% 88%; } @keyframes ggSleepSwayV103{ from{rotate:-1.4deg} to{rotate:1.4deg} } .gg-butterflies-v103 i{ position:absolute; font-style:normal; font-size:24px; animation:ggButterflyOrbitV103 4.4s ease-in-out infinite; } .gg-butterflies-v103 i:nth-child(1){left:8%;top:28%} .gg-butterflies-v103 i:nth-child(2){left:78%;top:18%;animation-delay:.8s} .gg-butterflies-v103 i:nth-child(3){left:72%;top:57%;animation-delay:1.6s} @keyframes ggButterflyOrbitV103{ 0%{transform:translate(0,15px) rotate(-12deg);opacity:0} 18%{opacity:1} 50%{transform:translate(28px,-23px) rotate(12deg)} 82%{opacity:1} 100%{transform:translate(-12px,-52px) rotate(-8deg);opacity:0} } .gg-idle-old-v103{ filter:grayscale(.62) sepia(.18); animation:ggOldShuffleV103 .7s ease-in-out infinite alternate; } @keyframes ggOldShuffleV103{ from{translate:-1px 0;rotate:-.8deg} to{translate:1px 1px;rotate:.8deg} } .gg-old-fx-v103 span{ position:absolute; left:50%; top:24%; transform:translateX(-50%); font-size:42px; opacity:.9; } .gg-old-fx-v103 b, .gg-idle-caption-v103{ position:absolute; left:50%; top:4%; transform:translateX(-50%); width:max-content; max-width:210px; padding:7px 11px; border-radius:14px; background:rgba(15,13,18,.9); border:1px solid rgba(255,255,255,.18); color:#f4eff5; text-align:center; font-size:12px; font-weight:900; box-shadow:0 5px 16px rgba(0,0,0,.28); } .gg-idle-stretch-v103{ animation:ggStretchV103 1.5s ease-in-out 2; transform-origin:50% 92%; } @keyframes ggStretchV103{ 0%,100%{scale:1 1} 45%{scale:.96 1.08;translate:0 -8px} } .gg-idle-giggle-v103{ animation:ggGiggleV103 .16s ease-in-out 10 alternate; } @keyframes ggGiggleV103{ from{translate:-2px 0;rotate:-1deg} to{translate:2px 0;rotate:1deg} } /* Every-three-minute funny secret bubble */ .gg-gremlin-secret-v103{ position:absolute; left:50%; top:-7%; z-index:180; width:min(245px,85vw); transform:translate(-50%,10px) scale(.94); padding:10px 13px; border-radius:17px 17px 17px 5px; background:rgba(16,13,19,.96); border:1px solid rgba(215,176,91,.7); color:#fff4d8; font-size:12px; font-weight:900; line-height:1.35; text-align:center; opacity:0; visibility:hidden; pointer-events:none; box-shadow:0 10px 26px rgba(0,0,0,.35); } .gg-gremlin-secret-v103::after{ content:""; position:absolute; left:22%; bottom:-8px; border:8px solid transparent; border-top-color:rgba(16,13,19,.96); border-left-width:2px; } .gg-gremlin-secret-v103.show{ visibility:visible; animation:ggSecretBubbleV103 8.5s ease forwards; } @keyframes ggSecretBubbleV103{ 0%{opacity:0;transform:translate(-50%,10px) scale(.94)} 8%,86%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-12px) scale(.97)} } /* v104 — remodeled Snake Plant */ .room-pot-layer-v055[data-plant="snake"] .room-pot-plant-v055::before{ content:none !important; } .gg-custom-snakeplant-v104{ width:112px !important; height:142px !important; left:50% !important; bottom:27px !important; transform:translateX(-50%) !important; overflow:visible; } .gg-snakeplant-leaf-v104{ position:absolute; bottom:0; left:50%; width:25px; height:112px; border-radius:70% 22% 56% 28%; transform-origin:50% 100%; background: repeating-linear-gradient(78deg,transparent 0 13px,rgba(22,66,33,.24) 13px 18px), linear-gradient(90deg,#244e31,#70a85e 45%,#3f7547 74%,#1e452b); border:2px solid #244b2f; box-shadow:inset 4px 0 rgba(255,255,255,.09),inset -4px 0 rgba(0,0,0,.1); } .gg-snakeplant-leaf-v104::after{ content:""; position:absolute; inset:3px 5px 2px auto; width:3px; border-radius:4px; background:rgba(210,202,81,.55); } .gg-snakeplant-leaf-v104.a{height:104px;transform:translateX(-50%) rotate(-31deg)} .gg-snakeplant-leaf-v104.b{height:127px;transform:translateX(-50%) translateX(-22px) rotate(-14deg)} .gg-snakeplant-leaf-v104.c{height:137px;transform:translateX(-50%) rotate(-2deg)} .gg-snakeplant-leaf-v104.d{height:119px;transform:translateX(-50%) translateX(22px) rotate(14deg)} .gg-snakeplant-leaf-v104.e{height:99px;transform:translateX(-50%) translateX(35px) rotate(29deg)} .gg-snakeplant-leaf-v104.f{height:91px;transform:translateX(-50%) translateX(-37px) rotate(-38deg)} /* New animated room plant */ .gg-custom-danceplant-v104{ width:112px !important; height:138px !important; left:50% !important; bottom:28px !important; transform:translateX(-50%) !important; overflow:visible; animation:ggDancePlantSwayV104 2.2s ease-in-out infinite alternate; transform-origin:50% 100%; } .gg-danceplant-stem-v104{ position:absolute; left:50%;bottom:0; width:8px;height:103px; transform:translateX(-50%); border-radius:8px; background:linear-gradient(90deg,#315936,#6a9b54,#2c5232); } .gg-danceplant-leaf-v104{ position:absolute; left:50%; width:44px;height:21px; border-radius:80% 15% 80% 15%; background:linear-gradient(145deg,#5f9b51,#2f6a39); transform-origin:0 50%; box-shadow:inset 3px 2px rgba(255,255,255,.1); } .gg-danceplant-leaf-v104.l1{top:61px;transform:rotate(154deg)} .gg-danceplant-leaf-v104.l2{top:48px;transform:rotate(22deg)} .gg-danceplant-leaf-v104.l3{top:80px;transform:rotate(166deg) scale(.82)} .gg-danceplant-leaf-v104.l4{top:72px;transform:rotate(12deg) scale(.85)} .gg-danceplant-bloom-v104{ position:absolute; left:50%;top:7px; width:48px;height:48px; transform:translateX(-50%); border-radius:50%; background: radial-gradient(circle at 50% 8%,#c978d4 0 19%,transparent 20%), radial-gradient(circle at 89% 39%,#dd8ae1 0 19%,transparent 20%), radial-gradient(circle at 74% 83%,#a954ba 0 19%,transparent 20%), radial-gradient(circle at 25% 83%,#d778d4 0 19%,transparent 20%), radial-gradient(circle at 10% 38%,#a85bbb 0 19%,transparent 20%); filter:drop-shadow(0 0 5px rgba(194,105,213,.3)); } .gg-danceplant-bloom-v104 i{ position:absolute;left:50%;top:50%; width:14px;height:14px;border-radius:50%; transform:translate(-50%,-50%); background:#e8c457; box-shadow:0 0 8px rgba(232,196,87,.7); animation:ggDancePlantGlowV104 1.3s ease-in-out infinite alternate; } @keyframes ggDancePlantSwayV104{ from{transform:translateX(-50%) rotate(-4deg)} to{transform:translateX(-50%) rotate(4deg)} } @keyframes ggDancePlantGlowV104{ from{scale:.8;filter:brightness(.9)} to{scale:1.15;filter:brightness(1.25)} } /* v104 Palm Panic: rebuilt palm, no arrow controls, direct horizontal drag */ .gg-palm-dodge-stage-v102{ touch-action:none !important; cursor:grab; } .gg-palm-dodge-stage-v102:active{cursor:grabbing} .gg-palm-controls-v102{display:none !important} .gg-palm-tree-v102{ left:50% !important; top:-1% !important; width:310px !important; height:86% !important; } .gg-palm-tree-v102 .trunk{ top:13% !important; width:48px !important; height:89% !important; border-radius:55% 55% 22% 22% !important; background: repeating-linear-gradient(168deg, #70431f 0 12px, #a46b34 12px 25px, #5b351a 25px 30px ) !important; transform:translateX(-50%) rotate(1deg) !important; } .gg-palm-tree-v102 .trunk::after{ content:""; position:absolute; left:50%;top:1%; width:72px;height:43px; transform:translateX(-50%); border-radius:50%; background: radial-gradient(circle at 25% 52%,#6b3d1f 0 19%,transparent 20%), radial-gradient(circle at 50% 30%,#81502a 0 19%,transparent 20%), radial-gradient(circle at 72% 55%,#5b321b 0 19%,transparent 20%); } .gg-palm-tree-v102 .leaf{ top:8% !important; width:165px !important; height:42px !important; border-radius:100% 10% 100% 10% !important; background: repeating-linear-gradient(0deg,transparent 0 8px,rgba(20,79,37,.12) 8px 11px), linear-gradient(180deg,#5aac59,#23753a) !important; } .gg-palm-tree-v102 .l1{transform:rotate(-165deg) !important} .gg-palm-tree-v102 .l2{transform:rotate(-132deg) !important} .gg-palm-tree-v102 .l3{transform:rotate(-96deg) !important} .gg-palm-tree-v102 .l4{transform:rotate(-18deg) !important} .gg-palm-tree-v102 .l5{transform:rotate(20deg) !important} .gg-palm-tree-v102 .l6{transform:rotate(58deg) !important} /* Remove avatar-editor background circle/backdrop from Palm Panic snapshot. */ .gg-palm-avatar-v102 #avatarBg, .gg-palm-avatar-v102 [id="avatarBg"], .gg-palm-avatar-v102 .avatar-bg, .gg-palm-avatar-v102 svg > circle:first-child{ display:none !important; fill:transparent !important; opacity:0 !important; } .gg-palm-avatar-v102{ background:transparent !important; border:0 !important; box-shadow:none !important; pointer-events:none; } /* Coconuts are a little slower and easier to read. */ .gg-coconut-v102{ width:36px !important; height:41px !important; } /* Book Hunt: larger forgiving touch target + immediate pointer hit. */ .gg-book-target-v097{ width:58px !important; height:74px !important; margin-left:-8px; padding:7px 8px !important; box-sizing:border-box; touch-action:none !important; z-index:6 !important; } .gg-book-target-v097.cursed, .gg-book-target-v097.trap{ background-clip:content-box; } /* v105 Palm Panic avatar is larger */ .gg-palm-avatar-v102{ width:118px !important; height:178px !important; bottom:2.5% !important; } /* v105 animated snake plant — living snakes rising from pot */ .room-pot-layer-v055[data-plant="snake"] .room-pot-plant-v055::before{ content:none !important; } .gg-custom-snakeplant-v105{ width:126px !important; height:150px !important; left:50% !important; bottom:28px !important; transform:translateX(-50%) !important; overflow:visible; } .gg-snakeplant-v105{ position:absolute; left:50%; bottom:0; width:16px; height:110px; border-radius:999px; transform-origin:50% 100%; background: repeating-linear-gradient(to bottom,rgba(28,69,36,.1) 0 11px,rgba(187,202,83,.14) 11px 17px), linear-gradient(90deg,#255236,#75a85c 48%,#315f3b); border:2px solid #234a2e; box-shadow:inset 3px 0 rgba(255,255,255,.08),inset -3px 0 rgba(0,0,0,.1); animation:ggSnakePlantSwayV105 2.6s ease-in-out infinite alternate; } .gg-snakeplant-v105.s1{height:100px;transform:translateX(-50%) translateX(-38px) rotate(-18deg);animation-delay:.15s} .gg-snakeplant-v105.s2{height:126px;transform:translateX(-50%) translateX(-18px) rotate(-8deg);animation-delay:.5s} .gg-snakeplant-v105.s3{height:138px;transform:translateX(-50%) rotate(1deg);animation-delay:.85s} .gg-snakeplant-v105.s4{height:120px;transform:translateX(-50%) translateX(20px) rotate(10deg);animation-delay:.35s} .gg-snakeplant-v105.s5{height:96px;transform:translateX(-50%) translateX(40px) rotate(19deg);animation-delay:.7s} .gg-snakeplant-v105 .head{ position:absolute; left:50%; top:-19px; width:30px; height:26px; transform:translateX(-50%); border-radius:60% 60% 48% 48%; background:linear-gradient(145deg,#7dae64,#446c43); border:2px solid #25442d; box-shadow:inset 3px 2px rgba(255,255,255,.08); } .gg-snakeplant-v105 .head::before, .gg-snakeplant-v105 .head::after{ content:""; position:absolute; top:7px; width:4px;height:4px; border-radius:50%; background:#f0d26c; box-shadow:0 0 3px rgba(240,210,108,.45); } .gg-snakeplant-v105 .head::before{left:7px} .gg-snakeplant-v105 .head::after{right:7px} .gg-snakeplant-v105 .head b{ position:absolute; left:50%; bottom:4px; width:9px;height:2px; transform:translateX(-50%); background:#22351f; } .gg-snakeplant-v105 .head em{ position:absolute; left:50%; bottom:-9px; width:2px;height:10px; background:#c54d61; transform:translateX(-50%); } .gg-snakeplant-v105 .head em::before, .gg-snakeplant-v105 .head em::after{ content:""; position:absolute; bottom:-3px; width:5px;height:2px; background:#c54d61; } .gg-snakeplant-v105 .head em::before{right:0;transform:rotate(30deg)} .gg-snakeplant-v105 .head em::after{left:0;transform:rotate(-30deg)} @keyframes ggSnakePlantSwayV105{ from{margin-left:-2px;rotate:-3deg} to{margin-left:2px;rotate:3deg} } /* v105 redesigned Dancing Plant */ .gg-custom-danceplant-v105{ width:132px !important; height:150px !important; left:50% !important; bottom:27px !important; transform:translateX(-50%) !important; overflow:visible; animation:ggWhimsyWholeV105 3s ease-in-out infinite alternate; transform-origin:50% 100%; } .gg-whimsy-plant-v105.stem{ position:absolute; left:50%; bottom:0; width:10px; height:105px; transform:translateX(-50%); border-radius:10px; background:linear-gradient(90deg,#2f5736,#73a55a 50%,#2e5735); } .gg-whimsy-plant-v105.leaf{ position:absolute; left:50%; width:50px; height:23px; border-radius:85% 12% 85% 12%; background: linear-gradient(145deg,rgba(255,255,255,.08),transparent 45%), linear-gradient(145deg,#6ba95c,#2f6b3a); box-shadow:inset 3px 2px rgba(255,255,255,.08); transform-origin:0 50%; } .gg-whimsy-plant-v105.l1{top:64px;transform:rotate(160deg)} .gg-whimsy-plant-v105.l2{top:49px;transform:rotate(18deg)} .gg-whimsy-plant-v105.l3{top:82px;transform:rotate(169deg) scale(.84)} .gg-whimsy-plant-v105.l4{top:74px;transform:rotate(8deg) scale(.9)} .gg-whimsy-plant-v105.l5{top:36px;transform:rotate(145deg) scale(.7)} .gg-whimsy-plant-v105.bloom{ position:absolute; left:50%; top:2px; width:64px; height:64px; transform:translateX(-50%); animation:ggWhimsyBloomV105 1.8s ease-in-out infinite alternate; } .gg-whimsy-plant-v105.bloom i{ position:absolute; left:50%; top:50%; width:27px;height:38px; border-radius:65% 65% 45% 45%; background:linear-gradient(#d689e2,#9c58b5); transform-origin:50% 95%; box-shadow:0 0 6px rgba(191,100,214,.2); } .gg-whimsy-plant-v105.bloom .p1{transform:translate(-50%,-100%) rotate(0deg)} .gg-whimsy-plant-v105.bloom .p2{transform:translate(-50%,-100%) rotate(72deg)} .gg-whimsy-plant-v105.bloom .p3{transform:translate(-50%,-100%) rotate(144deg)} .gg-whimsy-plant-v105.bloom .p4{transform:translate(-50%,-100%) rotate(216deg)} .gg-whimsy-plant-v105.bloom .p5{transform:translate(-50%,-100%) rotate(288deg)} .gg-whimsy-plant-v105.bloom b{ position:absolute; left:50%;top:50%; width:20px;height:20px; transform:translate(-50%,-50%); border-radius:50%; background:#f0ca5e; box-shadow:0 0 12px rgba(240,202,94,.7); } .gg-whimsy-spark-v105{ position:absolute; color:#f4d879; text-shadow:0 0 8px rgba(244,216,121,.75); animation:ggWhimsySparkV105 2.2s ease-in-out infinite; } .gg-whimsy-spark-v105.k1{left:11px;top:28px} .gg-whimsy-spark-v105.k2{right:8px;top:47px;animation-delay:.8s} @keyframes ggWhimsyWholeV105{ from{transform:translateX(-50%) rotate(-3deg)} to{transform:translateX(-50%) rotate(3deg)} } @keyframes ggWhimsyBloomV105{ from{scale:.94;rotate:-2deg} to{scale:1.04;rotate:2deg} } @keyframes ggWhimsySparkV105{ 0%{opacity:0;transform:translateY(8px) scale(.6)} 35%,70%{opacity:1} 100%{opacity:0;transform:translateY(-15px) scale(1.15)} } /* v105 Arcade Machine floor decor */ .v105-arcade-machine{ position:relative; display:block; width:96px; height:144px; border:5px solid #19131c; border-radius:8px 8px 5px 5px; background:linear-gradient(90deg,#24172e,#4d2d62 52%,#23172b); box-shadow: inset 5px 0 rgba(255,255,255,.04), inset -5px 0 rgba(0,0,0,.18), 0 9px 13px rgba(0,0,0,.33); } .v105-arcade-machine .marquee{ position:absolute; left:8px;right:8px;top:7px; height:25px; display:grid;place-items:center; border-radius:4px; background:linear-gradient(90deg,#d7b05b,#f1d47f,#d7b05b); color:#1b1520; font-style:normal; font-weight:1000; letter-spacing:.08em; border:2px solid #17121b; } .v105-arcade-machine .screen{ position:absolute; left:14px;right:14px;top:39px; height:54px; border-radius:4px; background: radial-gradient(circle at 50% 45%,#6bc3d3 0 9%,transparent 10%), radial-gradient(circle at 36% 56%,#e0779b 0 7%,transparent 8%), radial-gradient(circle at 63% 58%,#f0c65e 0 7%,transparent 8%), linear-gradient(#121a29,#080b11); border:4px solid #151117; box-shadow:inset 0 0 13px rgba(72,181,224,.25); overflow:hidden; } .v105-arcade-machine .screen b{ position:absolute; inset:0; background:repeating-linear-gradient(to bottom,transparent 0 4px,rgba(255,255,255,.035) 4px 5px); animation:ggArcadeScreenV105 1.6s linear infinite; } .v105-arcade-machine .panel{ position:absolute; left:12px;right:12px;top:98px; height:23px; border-radius:4px; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%); border:2px solid #0f0c12; color:#181818;} .v105-arcade-machine .panel em{ position:absolute; left:19px;top:4px; width:8px;height:12px; border-radius:3px 3px 0 0; background:#d84960; } .v105-arcade-machine .panel em::after{ content:""; position:absolute; left:-4px;bottom:-4px; width:16px;height:5px; border-radius:50%; background:#31242d; } .v105-arcade-machine .panel strong{ position:absolute; right:20px;top:7px; width:8px;height:8px; border-radius:50%; background:#d7b05b; box-shadow:14px 0 0 #6bc3d3; } .v105-arcade-machine .base{ position:absolute; left:18px;right:18px;bottom:-5px; height:21px; background:#211723; clip-path:polygon(7% 0,93% 0,100% 100%,0 100%); border-bottom:5px solid #110d13; } @keyframes ggArcadeScreenV105{ from{translate:0 -4px} to{translate:0 4px} } /* v106 connected game world */ .gg-toast-v106{ position:fixed;left:50%;top:max(20px,env(safe-area-inset-top));z-index:2147483647; width:min(430px,calc(100% - 28px));padding:12px 15px;border-radius:17px; transform:translate(-50%,-12px);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid rgba(216,177,90,.72); color:#181818;text-align:center;opacity:0;visibility:hidden;pointer-events:none;box-shadow:0 12px 30px rgba(0,0,0,.4) ;} .gg-toast-v106 b,.gg-toast-v106 span{display:block}.gg-toast-v106 span{font-size:.78rem;margin-top:4px;color:#dacba9} .gg-toast-v106.show{visibility:visible;animation:ggToast106 3.6s ease forwards} @keyframes ggToast106{0%{opacity:0;transform:translate(-50%,-12px)}10%,82%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,-8px)}} .gg-progression-v106{margin-top:16px;padding:16px;border-radius:22px;background:rgba(17,14,20,.78);border:1px solid rgba(255,255,255,.09)} .gg-progression-head-v106{display:flex;align-items:center;justify-content:space-between;gap:12px}.gg-progression-head-v106 h2{margin:.15rem 0} .gg-progression-head-v106 button{border:1px solid rgba(215,176,91,.5);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:12px;padding:8px 12px;font-weight:900;} .gg-achievement-strip-v106{display:grid;grid-template-columns:repeat(auto-fit,minmax(125px,1fr));gap:8px;margin-top:12px} .gg-achievement-v106{min-height:105px;padding:10px;border-radius:15px;background:#17131b;border:1px solid rgba(255,255,255,.08);text-align:center} .gg-achievement-v106 i,.gg-achievement-v106 b,.gg-achievement-v106 span{display:block}.gg-achievement-v106 i{font-size:26px;font-style:normal}.gg-achievement-v106 b{font-size:.8rem;margin:4px 0}.gg-achievement-v106 span{font-size:.66rem;color:#aaa} .gg-achievement-v106.locked{filter:grayscale(1);opacity:.45}.gg-achievement-v106.earned{border-color:rgba(215,176,91,.55);box-shadow:inset 0 0 18px rgba(215,176,91,.08)} .gg-room-save-v106{margin-top:14px;padding-top:13px;border-top:1px solid rgba(255,255,255,.08)}.gg-room-save-v106>strong,.gg-room-save-v106>span{display:block}.gg-room-save-v106>span{font-size:.72rem;color:#aaa;margin:3px 0 9px} .gg-room-save-slots-v106{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.gg-room-slot-v106{padding:8px;border-radius:12px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);text-align:center;color:#181818;}.gg-room-slot-v106 b{display:block;font-size:.72rem;margin-bottom:5px}.gg-room-slot-v106 button{margin:2px;padding:5px 7px;border:0;border-radius:8px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;font-size:.65rem;font-weight:800;} .gg-arcade-hub-v106{position:fixed;inset:0;z-index:2147483000;display:none;place-items:center;padding:18px;background:rgba(5,4,7,.78);backdrop-filter:blur(8px)} .gg-arcade-hub-v106.show{display:grid}.gg-arcade-hub-card-v106{width:min(500px,100%);padding:18px;border-radius:22px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid rgba(215,176,91,.5);box-shadow:0 24px 70px rgba(0,0,0,.6);color:#181818;} .gg-arcade-hub-card-v106 header{display:flex;justify-content:space-between;align-items:start}.gg-arcade-hub-card-v106 small{color:#d8b35f;font-weight:1000;letter-spacing:.13em}.gg-arcade-hub-card-v106 h2{margin:3px 0}.gg-arcade-hub-card-v106 header button{border:0;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;width:34px;height:34px;border-radius:50%;} .gg-arcade-games-v106{display:grid;gap:9px;margin-top:12px}.gg-arcade-games-v106 button{display:grid;grid-template-columns:45px 1fr;text-align:left;padding:12px;border-radius:15px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;}.gg-arcade-games-v106 i{grid-row:1/3;font-size:28px;font-style:normal}.gg-arcade-games-v106 b{font-size:.88rem}.gg-arcade-games-v106 span{font-size:.7rem;color:#aaa} .v106-trophy{position:relative;display:block;width:66px;height:92px;border-radius:50% 50% 12px 12px;background:linear-gradient(145deg,#f0d77d,#9d7130);border:3px solid #4c351c;box-shadow:0 8px 12px rgba(0,0,0,.28),inset 3px 3px rgba(255,255,255,.22)} .v106-trophy::after{content:"";position:absolute;left:13px;right:13px;bottom:-13px;height:16px;border-radius:4px;background:#5b3a22;border:2px solid #2c1a12}.v106-trophy i{position:absolute;left:50%;top:17px;transform:translateX(-50%);font-size:29px;font-style:normal}.v106-trophy b{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);font-size:9px;color:#24160e;white-space:nowrap} #roomFloorDecorV061,#roomPotLayerV055{filter:drop-shadow(0 9px var(--depth-shadow-blur,10px) rgba(0,0,0,var(--depth-shadow-alpha,.25)))} #roomFloorDecorV061 .room-floor-item-v061,#roomPotLayerV055>*{transform-origin:50% 100%} .gg-walking-v106 #roomExactAvatar{animation:ggWalk106 .22s ease-in-out infinite alternate;transform-origin:50% 100%} @keyframes ggWalk106{from{transform:translateY(0) rotate(-1.3deg)}to{transform:translateY(-4px) rotate(1.3deg)}} .gg-rare-idle-v106{position:absolute;inset:0;z-index:190;pointer-events:none;opacity:0}.gg-rare-idle-v106.show{opacity:1}.gg-rare-idle-v106 i{position:absolute;left:68%;top:28%;font-size:34px;font-style:normal;animation:ggRareIcon106 1s ease-in-out infinite alternate}.gg-rare-idle-v106 b{position:absolute;left:50%;top:-5%;transform:translateX(-50%);width:max-content;max-width:220px;padding:7px 10px;border-radius:13px;background:rgba(14,11,17,.93);color:#fff;font-size:11px;text-align:center} @keyframes ggRareIcon106{to{transform:translateY(-6px) rotate(5deg)}}.gg-rare-trip-v106{animation:ggTrip106 .7s ease}.gg-rare-tongue-v106{animation:ggTongue106 .25s ease 3}.gg-rare-steal-v106{animation:ggSteal106 .45s ease 3 alternate} @keyframes ggTrip106{45%{transform:rotate(9deg) translateY(5px)}}@keyframes ggTongue106{50%{transform:scaleX(1.03)}}@keyframes ggSteal106{to{transform:translateX(5px)}} .gg-scene-event-v106{position:absolute;inset:0;z-index:8;pointer-events:none;opacity:0;overflow:hidden}.gg-scene-event-v106.show{animation:ggSceneEvent106 5s ease forwards}.gg-scene-event-v106 i{position:absolute;left:-12%;top:36%;font-size:34px;font-style:normal;animation:ggSceneCross106 4.4s linear forwards}.gg-scene-event-v106 span{position:absolute;left:50%;bottom:5%;transform:translateX(-50%);width:max-content;max-width:90%;padding:4px 7px;border-radius:8px;background:rgba(0,0,0,.55);color:#fff;font-size:9px} @keyframes ggSceneEvent106{0%,100%{opacity:0}12%,82%{opacity:1}}@keyframes ggSceneCross106{to{left:108%;transform:rotate(8deg)}} .gg-snake-strike-v106 .gg-snakeplant-v105{animation:ggSnakeStrike106 .22s ease-in-out 5 alternate!important}@keyframes ggSnakeStrike106{to{transform:translateX(-50%) scaleY(1.08) rotate(8deg)}} .gg-dance-party-v106 .gg-custom-danceplant-v105{animation:ggPlantParty106 .28s ease-in-out 12 alternate!important}.gg-dance-party-v106 .gg-whimsy-spark-v105{font-size:22px!important}@keyframes ggPlantParty106{to{transform:translateX(-50%) rotate(10deg) scale(1.05)}} .gg-daily-chest-v106{font-weight:1000!important;box-shadow:0 0 0 1px rgba(215,176,91,.25),0 8px 20px rgba(0,0,0,.22)} .gg-haunted-arcade-v106 .v105-arcade-machine{filter:hue-rotate(65deg) saturate(1.4);box-shadow:0 0 18px rgba(102,255,141,.4),0 9px 13px rgba(0,0,0,.33)} .gg-haunted-arcade-v106 .v105-arcade-machine .screen::after{content:"👁";position:absolute;inset:0;display:grid;place-items:center;font-size:22px;animation:ggHauntBlink106 2.5s infinite}@keyframes ggHauntBlink106{0%,45%,55%,100%{opacity:1}50%{opacity:0}} body.room-page-v054 #avatarRoom[data-wall="royalBrick"] .room-wall-backdrop-v068{ background: linear-gradient(90deg,transparent 0 48%,rgba(215,176,91,.18) 48% 52%,transparent 52%), repeating-linear-gradient(0deg,transparent 0 31px,rgba(18,10,11,.75) 31px 35px), repeating-linear-gradient(90deg,#5d2730 0 56px,#702f38 56px 112px,#4c2028 112px 168px); box-shadow:inset 0 0 55px rgba(0,0,0,.35); } .v106-rare-display,.v106-royal-relic{position:relative;display:block;width:74px;height:108px;border-radius:40px 40px 12px 12px;background:linear-gradient(#31213c,#16121a);border:2px solid #b18c4a;box-shadow:0 8px 14px rgba(0,0,0,.3)} .v106-rare-display i,.v106-royal-relic i{position:absolute;left:50%;top:20px;transform:translateX(-50%);font-size:38px;font-style:normal}.v106-rare-display b,.v106-royal-relic b{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);font-size:9px;color:#e8cf8d} .v106-royal-relic{animation:ggRoyalRelic106 2s ease-in-out infinite alternate}.v106-royal-relic i{color:#f1d274;text-shadow:0 0 12px #d3a846}.v106-royal-relic b{font-size:22px;animation:ggRoyalSpark106 1.2s infinite alternate} @keyframes ggRoyalRelic106{to{transform:translateY(-5px);box-shadow:0 13px 18px rgba(0,0,0,.32),0 0 15px rgba(211,168,70,.28)}}@keyframes ggRoyalSpark106{to{opacity:.35;transform:translateX(-50%) rotate(30deg)}} /* v107 light mini games */ .gg-light-game-v107{position:fixed;inset:0;z-index:2147483500;display:none;place-items:center;padding:14px;background:rgba(4,3,7,.84);backdrop-filter:blur(9px)} .gg-light-game-v107.show{display:grid}.gg-light-game-shell-v107{width:min(560px,100%);border-radius:23px;padding:15px;background:linear-gradient(160deg,#211827,#0f0d13);border:1px solid rgba(217,178,88,.5);box-shadow:0 25px 80px rgba(0,0,0,.65)} .gg-light-game-shell-v107 header{display:flex;justify-content:space-between;align-items:start}.gg-light-game-shell-v107 small{color:#d9b45d;font-weight:1000;letter-spacing:.09em}.gg-light-game-shell-v107 h2{margin:3px 0 8px}.gg-light-game-shell-v107 header button{width:34px;height:34px;border:0;border-radius:50%;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;} .gg-light-game-hud-v107{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:9px}.gg-light-game-hud-v107 span{padding:7px;border-radius:10px;background:#17131c;text-align:center;font-size:11px}.gg-light-game-hud-v107 b{color:#f2d47c} .gg-light-game-stage-v107{position:relative;height:min(55vh,390px);min-height:300px;overflow:hidden;border-radius:17px;background:radial-gradient(circle at 50% 40%,#29202f,#0d0b11 70%);border:1px solid rgba(255,255,255,.08);touch-action:none} .gg-light-game-message-v107{display:none;text-align:center;padding:11px}.gg-light-game-message-v107.show{display:grid;gap:7px}.gg-light-game-message-v107 b,.gg-light-game-message-v107 span{display:block}.gg-light-game-message-v107 span{font-size:12px;color:#b8afb9}.gg-light-game-message-v107 button{justify-self:center;padding:9px 16px;border:0;border-radius:11px;background:#d2ad56;color:#1b1310;font-weight:1000} .gg-lg-target-v107{position:absolute;transform:translate(-50%,-50%);width:54px;height:54px;border:0;border-radius:50%;font-size:27px;font-weight:1000;touch-action:manipulation} .gg-lg-target-label-v107{position:absolute;left:50%;top:8px;transform:translateX(-50%);z-index:10;padding:6px 11px;border-radius:12px;background:#0e0c11;color:#fff;font-weight:1000} .gg-lg-target-v107.shadow{background:#d8d4d8;color:#211c24;box-shadow:0 7px 15px #0008}.gg-lg-target-v107.firefly{background:#fff3a2;color:#ffc930;box-shadow:0 0 22px #ffe55d;animation:ggFirefly107 .55s infinite alternate}.gg-lg-target-v107.sunbeam{background:#ffd84e;color:#4a3100;box-shadow:0 0 20px #ffdf55}.gg-lg-target-v107.sunbeam.hit{opacity:.18;pointer-events:none} .gg-lg-target-v107.bat{background:#21162b}.gg-lg-target-v107.moonbad{background:#fff3b0;box-shadow:0 0 22px #fff0a0}.gg-lg-target-v107.goldstar{background:transparent;filter:drop-shadow(0 0 8px #ffd95d)}.gg-lg-target-v107.darkstar{background:#211d27;color:#51485d} .gg-lg-target-v107.potiongood,.gg-lg-target-v107.potionbad{background:#25172e}.gg-lg-target-v107.slime{background:#7be45d;color:#1d5b19;box-shadow:0 0 12px #6cff4b}.gg-lg-target-v107.slime.small{width:38px;height:38px} @keyframes ggFirefly107{to{transform:translate(-50%,-55%) scale(1.12)}} .gg-lg-ship-v107{position:absolute;left:9%;top:49%;transform:translateY(-50%);z-index:5;border:0;background:none;font-size:30px;transition:top .18s}.gg-lg-ring-v107{position:absolute;right:-20%;top:0;width:120%;height:100%;animation:ggRingPass107 1.5s linear}.gg-lg-ring-v107 i{position:absolute;right:0;width:25px;height:26%;border:4px solid #e4bc64;border-radius:50%}.gg-lg-ring-v107 i:nth-child(1){top:5%}.gg-lg-ring-v107 i:nth-child(2){top:37%}.gg-lg-ring-v107 i:nth-child(3){top:69%}.gg-lg-ring-v107 i:nth-child(n){opacity:.25}.gg-lg-ring-v107[data-safe="0"] i:nth-child(1),.gg-lg-ring-v107[data-safe="1"] i:nth-child(2),.gg-lg-ring-v107[data-safe="2"] i:nth-child(3){opacity:1;border-color:#72e4ff} @keyframes ggRingPass107{to{right:100%}} .gg-lg-disco-v107{position:absolute;inset:18%;display:grid;grid-template-columns:1fr 1fr;gap:9px}.gg-lg-disco-v107 button{border:0;border-radius:18px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;font-size:31px;}.gg-lg-disco-v107 button.flash{background:#f5d35d;box-shadow:0 0 28px #fff;transform:scale(1.05)} .gg-lg-runner-v107{position:absolute;bottom:9%;left:50%;transform:translateX(-50%);z-index:5;border:0;background:none;font-size:38px;transition:left .16s}.gg-lg-laser-v107{position:absolute;top:-20%;width:33.333%;height:120%;background:linear-gradient(90deg,transparent,#ff273c66,#ff273c, #ff273c66,transparent);animation:ggLaser107 1.2s linear} @keyframes ggLaser107{from{transform:translateY(-90%)}to{transform:translateY(90%)}} .gg-lg-candle-v107{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);font-size:74px}.gg-lg-candle-v107 i{position:absolute;left:50%;top:-18px;width:24px;height:35px;transform:translateX(-50%);border-radius:50% 50% 45% 45%;background:#ffd34c;filter:drop-shadow(0 0 13px #ffb72c);animation:ggFlame107 .25s infinite alternate}.gg-lg-candle-v107 b{font-weight:400}.gg-lg-shield-v107{position:absolute;left:50%;bottom:8%;transform:translateX(-50%);padding:14px 28px;border-radius:18px;border:2px solid #80cfff;background:#172130;color:#bde8ff;font-weight:1000}.gg-lg-shield-v107.on{background:#73c9ff;color:#102235;box-shadow:0 0 28px #72caff}.gg-lg-gust-v107{position:absolute;left:-20%;top:36%;font-size:48px;color:#c9efff;animation:ggGust107 .9s linear}.flame-hit .gg-lg-candle-v107 i{opacity:.25} @keyframes ggFlame107{to{transform:translateX(-50%) rotate(8deg) scale(.9,1.08)}}@keyframes ggGust107{to{left:110%}} #roomCeilingLightV072{cursor:pointer} /* v108 — reliable Light mini-game launcher */ body.room-page-v054 #roomCeilingLightV072, body.room-page-v054 .room-ceiling-light-v072{ pointer-events:auto !important; touch-action:manipulation !important; cursor:pointer !important; z-index:120 !important; } /* Visual pieces allow their parent to own the tap consistently. */ body.room-page-v054 #roomCeilingLightV072 > *, body.room-page-v054 .room-ceiling-light-v072 > *{ pointer-events:none !important; } /* Larger invisible hit halo around the ceiling fixture. */ body.room-page-v054 #roomCeilingLightV072::after{ content:""; position:absolute; left:50%; top:18px; width:126px; height:92px; transform:translateX(-50%); border-radius:50%; background:transparent; pointer-events:auto; } /* Give a tiny feedback pulse so the user knows the light was tapped. */ body.room-page-v054 #roomCeilingLightV072:active{ filter:brightness(1.18); } /* v109 Avatar Room tutorial */ .gg-room-tutorial-v109{position:fixed;inset:0;z-index:2147483600;display:none;place-items:center;padding:18px;background:rgba(5,4,7,.82);backdrop-filter:blur(9px)} .gg-room-tutorial-v109.show{display:grid} .gg-room-tutorial-card-v109{position:relative;width:min(470px,100%);padding:25px 20px 19px;border-radius:25px;text-align:center;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid rgba(216,177,90,.55);box-shadow:0 25px 80px rgba(0,0,0,.68);color:#181818;} .gg-room-tutorial-close-v109{position:absolute;right:13px;top:13px;width:34px;height:34px;border:0;border-radius:50%;background:#33283a;color:#fff;font-size:16px} .gg-room-tutorial-icon-v109{display:grid;place-items:center;width:78px;height:78px;margin:12px auto 11px;border-radius:23px;background:radial-gradient(circle at 35% 30%,#44354d,#1c1621);border:1px solid rgba(216,177,90,.4);font-size:42px;box-shadow:0 0 25px rgba(215,176,91,.12)} .gg-room-tutorial-card-v109 .kicker{color:#d8b35f;font-size:10px;font-weight:1000;letter-spacing:.14em}.gg-room-tutorial-card-v109 h2{margin:5px 0 8px;color:#fff4d7}.gg-room-tutorial-card-v109 p{min-height:74px;margin:0 auto 15px;max-width:390px;color:#c9c0ca;font-size:14px;line-height:1.48} .gg-room-tutorial-actions-v109{display:grid;grid-template-columns:1fr 1fr;gap:9px}.gg-room-tutorial-actions-v109 button{padding:11px;border-radius:13px;border:1px solid rgba(255,255,255,.1);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;font-weight:900;}.gg-room-tutorial-actions-v109 button.primary{background:#d4af58;color:#21160d;border-color:#f1d17d} .gg-room-tutorial-progress-v109{display:flex;justify-content:center;gap:5px;padding-right:34px;padding-left:34px}.gg-room-tutorial-progress-v109 i{display:block;width:7px;height:7px;border-radius:50%;background:#4a414d}.gg-room-tutorial-progress-v109 i.active{width:21px;border-radius:7px;background:#e1bd65}.gg-room-tutorial-progress-v109 i.done{background:#8b7240} .gg-room-help-v109{position:fixed;right:14px;bottom:max(82px,calc(env(safe-area-inset-bottom) + 72px));z-index:1000;width:42px;height:42px;border-radius:50%;border:2px solid rgba(215,176,91,.7);background:rgba(25,19,29,.94);color:#f0d176;font-size:20px;font-weight:1000;box-shadow:0 8px 20px rgba(0,0,0,.35)} /* v110 progression/social/world UI */ .gg-collection-v110,.gg-share-v110,.gg-secret-room-v110,.gg-mystery-v110{position:fixed;inset:0;z-index:2147483650;display:none;place-items:center;padding:16px;background:rgba(5,4,7,.82);backdrop-filter:blur(9px)} .gg-collection-v110.show,.gg-share-v110.show,.gg-secret-room-v110.show,.gg-mystery-v110.show{display:grid} .gg-collection-card-v110,.gg-share-card-v110,.gg-secret-room-shell-v110,.gg-mystery-card-v110{width:min(620px,100%);max-height:88vh;overflow:auto;padding:18px;border-radius:24px;background:linear-gradient(160deg,#251a2d,#100e14);border:1px solid rgba(215,176,91,.52);box-shadow:0 25px 80px rgba(0,0,0,.65)}.gg-collection-card-v110,.gg-share-card-v110,.gg-mystery-card-v110{width:min(620px,100%);max-height:88vh;overflow:auto;padding:18px;border-radius:24px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid rgba(215,176,91,.52);box-shadow:0 25px 80px rgba(0,0,0,.65);color:#181818;} .gg-collection-card-v110 header,.gg-share-card-v110 header,.gg-secret-room-shell-v110 header{display:flex;justify-content:space-between;align-items:start}.gg-collection-card-v110 header small,.gg-secret-room-shell-v110 small{color:#d7b05b;font-weight:1000;letter-spacing:.12em}.gg-collection-card-v110 header h2,.gg-share-card-v110 h2,.gg-secret-room-shell-v110 h2{margin:3px 0}.gg-collection-card-v110 header button,.gg-share-card-v110 header button,.gg-secret-room-shell-v110 header button{width:35px;height:35px;border:0;border-radius:50%;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;} #ggCollectionTabsV110{display:flex;gap:6px;margin:12px 0}#ggCollectionTabsV110 button{flex:1;padding:8px;border:0;border-radius:10px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;text-transform:capitalize;font-weight:900;}#ggCollectionTabsV110 button.active{background:#d2ad56;color:#21150c} .gg-collection-grid-v110{display:grid;grid-template-columns:repeat(auto-fill,minmax(115px,1fr));gap:8px}.gg-collectible-v110{padding:12px 8px;border-radius:15px;text-align:center;background:#17131b;border:1px solid rgba(255,255,255,.08)}.gg-collectible-v110 i,.gg-collectible-v110 b,.gg-collectible-v110 span{display:block}.gg-collectible-v110 i{font-style:normal;font-size:27px}.gg-collectible-v110 b{font-size:.75rem;margin:3px 0}.gg-collectible-v110 span{font-size:.62rem;color:#aaa}.gg-collectible-v110.unknown{filter:grayscale(1);opacity:.45}.rarity-rare{box-shadow:inset 0 0 15px #4d7ac522}.rarity-legendary{border-color:#d1a84d88!important;box-shadow:inset 0 0 20px #d1a84d22}.rarity-secret{border-color:#9d6dca!important;animation:ggSecretBorder110 2s infinite alternate}@keyframes ggSecretBorder110{to{box-shadow:0 0 18px #9d6dca66}} .gg-secret-map-v110{margin-top:15px;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}.gg-secret-map-v110 h3{margin:0 0 8px}.gg-chain-v110{padding:10px;margin:6px 0;border-radius:12px;background:#151119}.gg-chain-v110 b,.gg-chain-v110 span,.gg-chain-v110 em{display:block}.gg-chain-v110 span{font-size:.68rem;color:#bbb;line-height:1.5;margin:4px 0}.gg-chain-v110 em{font-size:.67rem;color:#d4b86e} .gg-share-preview-v110{text-align:center;padding:17px;border-radius:17px;background:#151119;margin:10px 0}.gg-share-preview-v110 b,.gg-share-preview-v110 strong,.gg-share-preview-v110 span{display:block}.gg-share-preview-v110 strong{font-size:44px;color:#f0cc70}.gg-share-preview-v110 span{font-size:.75rem;color:#aaa}.gg-share-buttons-v110{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.gg-share-buttons-v110 button,.gg-share-score-v110{padding:9px;border:0;border-radius:10px;background:#33263b;color:#fff;font-weight:900}.gg-share-buttons-v110 button{padding:9px;border:0;border-radius:10px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;font-weight:900;}.gg-share-card-v110>small{display:block;margin-top:10px;color:#968e99;line-height:1.4} .gg-share-score-v110{margin-top:9px;background:#d2ad56!important;color:#21150c!important} .gg-secret-room-scene-v110{position:relative;height:320px;border-radius:18px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle,#392b44,#0d0b11)}.gg-secret-room-scene-v110 i{font-size:96px;font-style:normal;filter:drop-shadow(0 0 22px #fff4)}.gg-secret-room-scene-v110.cosmic{background:radial-gradient(circle at 30% 20%,#6f5bad,#11152b 45%,#06070d)}.gg-secret-room-scene-v110.witch{background:radial-gradient(circle,#4a6d37,#20152b 55%,#0e0912)}.gg-secret-room-scene-v110.arcade{background:repeating-linear-gradient(90deg,#13101a 0 45px,#271532 45px 90px)}.gg-secret-room-scene-v110.haunted{background:radial-gradient(circle,#3e362e,#100c0b)}.gg-secret-room-scene-v110.dream{background:radial-gradient(circle,#f3d8ff,#6e4a83)}.gg-secret-room-shell-v110>button{width:100%;padding:10px;border:0;border-radius:11px;background:#d2ad56;font-weight:1000} .gg-mystery-card-v110{text-align:center;max-width:390px}.gg-mystery-card-v110 .box{font-size:78px;animation:ggBoxShake110 .6s infinite alternate}@keyframes ggBoxShake110{to{transform:rotate(5deg) translateY(-3px)}}.gg-mystery-card-v110 button{margin:5px;padding:9px 16px;border:0;border-radius:11px;background:#d2ad56;font-weight:900} .gg-world-dock-v110{position:fixed;left:50%;bottom:max(8px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:990;display:flex;gap:5px;padding:6px;border-radius:17px;background:rgba(18,14,21,.92);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(8px)}.gg-world-dock-v110 button{display:grid;place-items:center;min-width:51px;padding:5px;border:0;background:transparent;color:#fff;font-size:18px}.gg-world-dock-v110 span{font-size:7px;color:#aaa;margin-top:2px} .gg-gotd-v110{position:fixed;left:50%;bottom:max(70px,calc(env(safe-area-inset-bottom) + 62px));transform:translateX(-50%);z-index:970;padding:5px 9px;border-radius:999px;background:rgba(15,12,18,.88);border:1px solid rgba(215,176,91,.25);color:#bbb;font-size:8px;pointer-events:none}.gg-gotd-v110 b{color:#e4c46e} .gg-photo-mode-v110{position:fixed;inset:0;z-index:2147483600;display:none;pointer-events:none}.gg-photo-mode-v110.show{display:block}.gg-photo-toolbar-v110{position:absolute;left:50%;top:max(10px,env(safe-area-inset-top));transform:translateX(-50%);display:flex;gap:7px;align-items:center;padding:7px;border-radius:14px;background:#151219ee;pointer-events:auto}.gg-photo-toolbar-v110 button,.gg-photo-toolbar-v110 select{padding:7px;border:0;border-radius:9px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;} body.gg-photo-mode-active-v110 .room-editor,body.gg-photo-mode-active-v110 .room-friends,body.gg-photo-mode-active-v110 .room-inventory,body.gg-photo-mode-active-v110 .gg-progression-v106,body.gg-photo-mode-active-v110 .gg-world-dock-v110,body.gg-photo-mode-active-v110 .gg-gotd-v110,body.gg-photo-mode-active-v110 .gg-room-help-v109{opacity:0!important;pointer-events:none!important} .room-avatar[data-pose-v110="arms"] #roomExactAvatar{transform:rotate(-2deg) scale(.98)}.room-avatar[data-pose-v110="mischief"] #roomExactAvatar{transform:rotate(4deg) translateY(-3px)}.room-avatar[data-pose-v110="sleepy"] #roomExactAvatar{transform:rotate(-4deg) translateY(4px)}.room-avatar[data-pose-v110="scared"] #roomExactAvatar{animation:ggScared110 .17s infinite alternate}.room-avatar[data-pose-v110="dance"] #roomExactAvatar{animation:ggDancePose110 .35s infinite alternate}@keyframes ggScared110{to{transform:translateX(3px)}}@keyframes ggDancePose110{to{transform:translateY(-7px) rotate(5deg)}} .room-avatar[data-evolution-v110="1"]{filter:drop-shadow(0 0 6px #9d8cff55)}.room-avatar[data-evolution-v110="2"]{filter:drop-shadow(0 0 10px #d8b35f77)}.room-avatar[data-evolution-v110="3"]{filter:drop-shadow(0 0 14px #8ef1ff88)}.room-avatar[data-evolution-v110="4"]{filter:drop-shadow(0 0 18px #e2b95faa)} #avatarRoom[data-ambience-v110="storm"] .room-wall-backdrop-v068{animation:ggStormAmb110 4s infinite}#avatarRoom[data-ambience-v110="night"] .room-scene-window-v055{filter:brightness(.82) contrast(1.05)}#avatarRoom[data-ambience-v110="underwater"] .room-scene-window-v055{animation:ggWaterAmb110 5s ease-in-out infinite alternate}#avatarRoom[data-ambience-v110="graveyard"] .room-scene-window-v055{filter:contrast(1.05) saturate(.75)}@keyframes ggStormAmb110{0%,92%,100%{filter:none}94%{filter:brightness(1.5)}}@keyframes ggWaterAmb110{to{filter:hue-rotate(8deg) brightness(1.06)}} body[data-season-v110="halloween"] #avatarRoom::after{content:"🎃";position:absolute;right:4%;bottom:5%;font-size:32px;z-index:14;pointer-events:none}body[data-season-v110="winter"] #avatarRoom::after{content:"❄️ ❄️";position:absolute;left:10%;top:12%;font-size:22px;z-index:14;pointer-events:none;animation:ggSnow110 4s linear infinite}@keyframes ggSnow110{to{transform:translateY(220px) rotate(90deg)}}body[data-season-v110="valentine"] #avatarRoom::after{content:"♥";position:absolute;right:8%;top:18%;font-size:28px;color:#d9708d;z-index:14} body.gg-birthday-v110::before{content:"🎉 🎊 ✨ 🎉 🎊";position:fixed;inset:0;z-index:2147483646;font-size:30px;letter-spacing:30px;pointer-events:none;animation:ggBirthday110 5s linear forwards}@keyframes ggBirthday110{from{transform:translateY(-10vh)}to{transform:translateY(110vh)}} body.gg-ultimate-v110 .room-avatar.room-avatar-exact{filter:drop-shadow(0 0 22px #f3ce66)!important}body.gg-ultimate-v110 .room-avatar.room-avatar-exact::before{content:"♛";position:absolute;left:50%;top:-18%;transform:translateX(-50%);font-size:42px;color:#f2d373;text-shadow:0 0 14px #f2d373;z-index:200} @media(max-width:600px){.gg-share-buttons-v110{grid-template-columns:repeat(2,1fr)}.gg-world-dock-v110{max-width:96vw}.gg-world-dock-v110 button{min-width:45px}.gg-gotd-v110{max-width:88vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}} /* v111 world expansion */ .gg-v111-modal{position:fixed;inset:0;z-index:2147483660;display:none;place-items:center;padding:15px;background:#050407d9;backdrop-filter:blur(9px)}.gg-v111-modal.show{display:grid}.gg-v111-card{width:min(570px,100%);max-height:88vh;overflow:auto;padding:17px;border-radius:23px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid #d7b05b77;box-shadow:0 24px 75px #000b;color:#181818;}.gg-v111-card header{display:flex;justify-content:space-between;align-items:center}.gg-v111-card header h2{margin:0 0 10px}.gg-v111-card header button{width:34px;height:34px;border:0;border-radius:50%;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;}.gg-v111-card button{padding:9px 12px;border:0;border-radius:10px;background:#d2ad56;color:#21150c;font-weight:900}.gg-v111-card input,.gg-v111-card textarea{box-sizing:border-box;width:100%;margin:6px 0;padding:10px;border-radius:10px;border:1px solid #ffffff22;background:#151119;color:#fff}.gg-v111-card input{box-sizing:border-box;width:100%;margin:6px 0;padding:10px;border-radius:10px;border:1px solid #ffffff22;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;}.gg-v111-card textarea{height:100px} .gg-profile-hero-v111{display:flex;align-items:center;gap:13px;padding:14px;border-radius:16px;background:#17131b}.gg-profile-hero-v111 .portrait{display:grid;place-items:center;width:74px;height:74px;border-radius:50%;background:#30233a;font-size:42px}.gg-profile-hero-v111 h3{margin:0}.gg-profile-hero-v111 b,.gg-profile-hero-v111 span{display:block;color:#d8b45e}.gg-profile-stats-v111{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin:9px 0}.gg-profile-stats-v111 span{padding:10px;border-radius:12px;background:#17131b;text-align:center;font-size:18px;font-weight:900}.gg-profile-stats-v111 small{display:block;color:#aaa;font-size:8px} .gg-streak-v111{padding:13px;border-radius:14px;background:#3b2118;color:#ffd078;font-size:20px;font-weight:1000;text-align:center}.gg-quest-v111,.gg-weekly-v111,.gg-score-row-v111,.gg-recipe-v111{display:flex;justify-content:space-between;gap:8px;margin:7px 0;padding:11px;border-radius:12px;background:#17131b}.gg-recipe-v111{display:flex;justify-content:space-between;gap:8px;margin:7px 0;padding:11px;border-radius:12px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;}.gg-quest-v111.done{opacity:.55}.gg-quest-v111 span,.gg-weekly-v111 span,.gg-recipe-v111 span{color:#aaa;font-size:10px}.gg-note-v111{color:#aaa;font-size:11px}.gg-recipe-v111{display:grid}.gg-recipe-v111.known{border:1px solid #d1aa5355} .gg-world-map-v111{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.gg-world-map-v111 button{display:grid;grid-template-columns:48px 1fr;text-align:left;align-items:center;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border:1px solid #ffffff10;}.gg-world-map-v111 button i{grid-row:1/3;font-size:30px;font-style:normal}.gg-world-map-v111 button b{font-size:12px}.gg-world-map-v111 button span{font-size:8px;color:#aaa} .gg-side-door-v111{position:absolute;right:-2px;bottom:9%;z-index:24;width:24px;height:112px;padding:0;border:0;border-radius:4px 0 0 4px;background:linear-gradient(90deg,#2b1b18,#55372b 58%,#1c1211);box-shadow:-4px 4px 10px #0007;opacity:.72;cursor:pointer;transform:perspective(120px) rotateY(-16deg);transform-origin:right center}.gg-side-door-v111 i{position:absolute;left:5px;top:50%;width:4px;height:4px;border-radius:50%;background:#d6ad52;box-shadow:0 0 5px #f0cf79}.gg-side-door-v111 span{position:absolute;left:-14px;top:42px;transform:rotate(-90deg);font-size:6px;letter-spacing:.12em;color:#c7ad79;opacity:.7}.gg-side-door-v111:hover,.gg-side-door-v111:active{opacity:1} .gg-v111-collection-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}.gg-v111-collection-actions button{padding:9px;border:0;border-radius:10px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;font-weight:900;} .gg-reactions-v111{margin-top:12px;padding:10px;border-radius:11px;background:#17131b;text-align:center;font-size:18px}.gg-reactions-v111 small{display:block;color:#888;font-size:8px} .gg-diff-v111{margin-top:8px;font-size:10px;color:#aaa}.gg-diff-v111 select{margin-left:5px;padding:5px;border-radius:8px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border:1px solid #ffffff20;} body.gg-has-egg-v111 #avatarRoom::before{content:"🥚";position:absolute;left:9%;bottom:7%;z-index:25;font-size:29px;pointer-events:none}.gg-egg-v111{position:absolute;left:8%;bottom:6%;z-index:27;border:0;background:transparent;font-size:31px;filter:drop-shadow(0 5px 4px #0007)}body.gg-has-companion-v111 .gg-egg-v111{animation:ggCompanion111 5s ease-in-out infinite alternate}@keyframes ggCompanion111{to{transform:translateX(90px) translateY(-12px)}} #avatarRoom[data-plant-growth-v111="2"] .room-plant-v055{transform:scale(1.06);transform-origin:bottom center}#avatarRoom[data-plant-growth-v111="3"] .room-plant-v055{transform:scale(1.13);transform-origin:bottom center;filter:drop-shadow(0 0 7px #74c56a55)}#avatarRoom[data-plant-growth-v111="4"] .room-plant-v055{transform:scale(1.2);transform-origin:bottom center;filter:drop-shadow(0 0 10px #b56ae077)} @media(max-width:600px){.gg-world-map-v111{grid-template-columns:1fr}.gg-world-dock-v110{max-width:98vw;overflow-x:auto;justify-content:flex-start}.gg-side-door-v111{height:96px;bottom:11%}} /* v112 one animated Snake Plant */ .room-pot-layer-v055[data-plant="snake"] .room-pot-plant-v055::before{content:none!important} .gg-custom-snakeplant-v112{width:105px!important;height:148px!important;left:50%!important;bottom:28px!important;transform:translateX(-50%)!important;overflow:visible} .gg-snakeplant-v112{position:absolute;left:50%;bottom:0;width:25px;height:122px;transform:translateX(-50%);transform-origin:50% 100%;border-radius:999px;background:repeating-linear-gradient(to bottom,#6c9956 0 13px,#345d3c 13px 18px);border:2px solid #25452e;animation:ggOneSnake112 2.2s ease-in-out infinite alternate} .gg-snakeplant-v112 .body-seg{position:absolute;width:28px;height:28px;border-radius:50%;background:#5f9051;border:2px solid #26492f;opacity:.95}.gg-snakeplant-v112 .s1{left:-17px;top:38px}.gg-snakeplant-v112 .s2{right:-17px;top:65px}.gg-snakeplant-v112 .s3{left:-12px;top:91px} .gg-snakeplant-v112 .head{position:absolute;left:50%;top:-28px;width:43px;height:37px;transform:translateX(-50%);border-radius:58% 58% 45% 45%;background:linear-gradient(#80aa65,#4e7e49);border:3px solid #26472d}.gg-snakeplant-v112 .eye{position:absolute;top:10px;width:6px;height:7px;border-radius:50%;background:#f1d463;box-shadow:inset 2px 0 #222}.gg-snakeplant-v112 .e1{left:9px}.gg-snakeplant-v112 .e2{right:9px}.gg-snakeplant-v112 .tongue{position:absolute;left:50%;bottom:-15px;width:2px;height:17px;background:#cb4f66;transform:translateX(-50%)}.gg-snakeplant-v112 .tongue::before,.gg-snakeplant-v112 .tongue::after{content:"";position:absolute;bottom:-2px;width:8px;height:2px;background:#cb4f66}.gg-snakeplant-v112 .tongue::before{right:0;transform:rotate(28deg)}.gg-snakeplant-v112 .tongue::after{left:0;transform:rotate(-28deg)} @keyframes ggOneSnake112{from{transform:translateX(-50%) rotate(-6deg)}to{transform:translateX(-50%) rotate(7deg)}} /* Palm Panic: force transparent avatar, smaller collision is handled in JS */ .gg-palm-avatar-v102,.gg-palm-avatar-v102 svg,.gg-palm-avatar-v102 svg>*{background:transparent!important} .gg-palm-avatar-v102 svg>circle:first-child,.gg-palm-avatar-v102 svg>ellipse:first-child,.gg-palm-avatar-v102 svg>rect:first-child{display:none!important;opacity:0!important} /* Beach Net Wall reward */ body.room-page-v054 #avatarRoom[data-wall="beachWall"] .room-wall-backdrop-v068{ background: radial-gradient(circle at 14% 68%,transparent 0 18px,#e85757 19px 25px,#f7f0da 26px 33px,transparent 34px), repeating-linear-gradient(35deg,transparent 0 26px,rgba(123,94,66,.32) 26px 29px,transparent 29px 54px), repeating-linear-gradient(-35deg,transparent 0 26px,rgba(123,94,66,.32) 26px 29px,transparent 29px 54px), repeating-linear-gradient(90deg,#eff8fb 0 46px,#6ba9c8 46px 92px)!important; box-shadow:inset 0 0 45px rgba(20,66,88,.2) } body.room-page-v054 #avatarRoom[data-wall="beachWall"] .room-wall-backdrop-v068::before{ content:"⭐ ⭐";position:absolute;left:12%;top:20%;font-size:31px;letter-spacing:150px;color:#dc8c52;filter:drop-shadow(0 3px 2px #0003);transform:rotate(-8deg);pointer-events:none } body.room-page-v054 #avatarRoom[data-wall="beachWall"] .room-wall-backdrop-v068::after{ content:"🦀";position:absolute;right:16%;top:38%;font-size:34px;filter:drop-shadow(0 3px 2px #0004);animation:ggCrabNet112 1.1s ease-in-out infinite alternate;pointer-events:none } @keyframes ggCrabNet112{from{transform:rotate(-10deg) translateX(-3px)}to{transform:rotate(12deg) translateX(4px)}} /* Collection hint affordance */ .gg-collectible-v110.unknown{cursor:pointer}.gg-collectible-v110.unknown:active{transform:scale(.97)} /* Shared 2X power-up */ .gg-double-power-v112,.gg-lg-target-v107.doublebubble{position:absolute;z-index:40;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;border:3px solid #fff1a1;background:radial-gradient(circle,#fff7b7,#f0b92c 70%,#7e5011);color:#3b2500;font-weight:1000;font-size:16px;box-shadow:0 0 22px #ffd343;animation:ggDouble112 .7s ease-in-out infinite alternate} @keyframes ggDouble112{to{transform:translate(-50%,-50%) scale(1.12);box-shadow:0 0 32px #fff08b}} /* Saturn Ring Runner */ .gg-v112-spacefield{position:absolute;inset:0;background:radial-gradient(circle at 25% 25%,#554684 0 1px,transparent 2px),radial-gradient(circle at 70% 65%,#fff 0 1px,transparent 2px),linear-gradient(#080a18,#141126);background-size:45px 45px,70px 70px,auto} .gg-v112-player{position:absolute;width:92px;height:128px;transform:translate(-50%,-50%);z-index:12;pointer-events:none;transition:left .04s linear,top .04s linear}.gg-v112-player svg{width:100%!important;height:100%!important;display:block;background:transparent!important}.gg-v112-player.hit{animation:ggV112Hit .18s 2 alternate}@keyframes ggV112Hit{to{filter:brightness(2);transform:translate(-50%,-50%) rotate(8deg)}} .gg-v112-space-ring{position:absolute;right:-80px;width:76px;height:108px;border:8px solid #d9b660;border-radius:50%;transform:translateY(-50%);box-shadow:0 0 18px #d6af4c66;animation:ggFlyLeft112 var(--travel) linear forwards}.gg-v112-space-ring.collected{border-color:#77e9ff;opacity:.3}.gg-v112-asteroid{position:absolute;right:-65px;width:48px;height:43px;border-radius:45% 55% 50% 42%;transform:translateY(-50%);background:radial-gradient(circle at 30% 30%,#988578 0 10%,#5c514b 11% 55%,#302b2b);box-shadow:inset -6px -5px 8px #0004;animation:ggFlyLeft112 var(--travel) linear forwards}@keyframes ggFlyLeft112{to{right:110%}} /* 9-pad Disco */ .gg-lg-disco-v112{position:absolute;inset:12%;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.gg-lg-disco-v112 button{border:1px solid #ffffff22;border-radius:14px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;font-size:17px;font-weight:1000;box-shadow:inset 0 0 12px #0006;}.gg-lg-disco-v112 button.flash{background:#fff17c;color:#291c0a;box-shadow:0 0 30px #ffec72;transform:scale(1.05)} /* Red Orb Dodge */ .gg-v112-red-orb{position:absolute;z-index:7;width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff9e9e,#fa273a 42%,#780411 75%);box-shadow:0 0 16px #ff263b;animation:ggOrbTravel112 var(--orbtime) linear forwards;transform:translate(-50%,-50%)}@keyframes ggOrbTravel112{to{transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty)))}} .gg-lg-target-v107.nuke{background:#1d2420;color:#d8ff74;border:2px solid #9edc4b;box-shadow:0 0 18px #9edc4b} /* Slime fail clarity */ .gg-lg-target-v107.slime{z-index:9} /* v113 */ .gg-v112-player.saturn-player,.gg-v112-player.saturn-player svg{background:transparent!important;box-shadow:none!important} .gg-v112-player.saturn-player svg>circle:first-child,.gg-v112-player.saturn-player svg>ellipse:first-child,.gg-v112-player.saturn-player svg>rect:first-child{display:none!important;opacity:0!important} .gg-touch-double-v113{pointer-events:none} .gg-lost-moon-v113{position:absolute;inset:8%;display:flex;flex-direction:column;justify-content:center;gap:28px} .gg-lost-status-v113{text-align:center;color:#f5e9b8;font-size:17px;text-shadow:0 2px 7px #000} .gg-lost-cups-v113{display:flex;justify-content:space-around;align-items:flex-end} .gg-lost-cup-v113{position:relative;width:29%;height:145px;border:0;background:transparent;color:#8f6544} .gg-lost-cup-v113 span{position:absolute;left:50%;bottom:0;transform:translateX(-50%) scaleX(1.45);font-size:95px;color:#805735;filter:drop-shadow(0 5px 3px #0005)} .gg-lost-cup-v113 i{position:absolute;left:50%;bottom:82px;transform:translateX(-50%);font-size:38px;font-style:normal;z-index:2} .gg-lost-cup-v113.shuffle{animation:ggCup113 .22s ease-in-out alternate}@keyframes ggCup113{to{transform:translateY(-17px)}} .gg-lg-disco-v113{position:absolute;inset:17%;display:grid;grid-template-columns:repeat(2,1fr);gap:12px} .gg-lg-disco-v113 button{border:2px solid #ffffff25;border-radius:18px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;font-size:28px;font-weight:1000;box-shadow:inset 0 0 16px #0007;} .gg-lg-disco-v113 button.flash{background:#fff17c;color:#2b2106;box-shadow:0 0 32px #ffed72;transform:scale(1.04)} .gg-lg-disco-v113 button.player-lit{background:#ff851c!important;color:#fff!important;box-shadow:0 0 30px #ff7811!important;transform:scale(.97)} /* v114 Potion Pop */ .gg-lg-target-v107.doublebubble{ z-index:45!important; } /* v114 Flame Ball Dodge */ .gg-v114-flame-floor{ position:absolute;left:4%;right:4%;bottom:8%;height:6px;border-radius:50%; background:linear-gradient(90deg,transparent,#d49b54,#f0c36b,#d49b54,transparent); box-shadow:0 4px 12px #0008 } .gg-v112-player.flame-player-v114{ position:absolute!important; width:112px!important;height:150px!important; left:50%!important;bottom:9%!important;top:auto!important; transform:translate(-50%,0); transform-origin:50% 100%; z-index:12; transition:none!important; will-change:transform } .gg-v112-player.flame-player-v114 svg{ width:100%!important;height:100%!important;background:transparent!important } .gg-v112-player.flame-player-v114 svg>circle:first-child, .gg-v112-player.flame-player-v114 svg>ellipse:first-child, .gg-v112-player.flame-player-v114 svg>rect:first-child{ display:none!important;opacity:0!important } .gg-v114-flame-ball{ position:absolute;left:8%;bottom:10.5%; width:42px;height:42px;border-radius:50%; transform:translate(-50%,50%); background:radial-gradient(circle at 35% 28%,#fff8a3 0 10%,#ffbd3e 20%,#ff5d21 58%,#b81812 82%); box-shadow:0 0 12px #ffb52e,0 0 26px #f34b22aa; z-index:15; animation:ggFlamePulse114 .38s ease-in-out infinite alternate } .gg-v114-flame-ball::before,.gg-v114-flame-ball::after{ content:"";position:absolute;left:50%;top:-16px;width:19px;height:26px; transform:translateX(-50%) rotate(45deg);border-radius:65% 10% 65% 45%; background:linear-gradient(135deg,#fff37b,#ff7b20 55%,#e12a1a) } .gg-v114-flame-ball::after{left:29%;top:-9px;width:12px;height:19px;opacity:.8} .gg-v114-flame-ball.blue{ background:radial-gradient(circle at 35% 28%,#eaffff,#65dfff 28%,#198ee8 62%,#2440a8); box-shadow:0 0 14px #56d9ff,0 0 28px #288ce8aa } .gg-v114-flame-ball.blue::before,.gg-v114-flame-ball.blue::after{background:linear-gradient(135deg,#efffff,#5edcff,#2467ef)} .gg-v114-flame-ball.pink{ background:radial-gradient(circle at 35% 28%,#fff1fa,#ff8bd1 30%,#e83993 63%,#9c1762); box-shadow:0 0 14px #ff89d0,0 0 28px #ea3c9aaa } .gg-v114-flame-ball.pink::before,.gg-v114-flame-ball.pink::after{background:linear-gradient(135deg,#fff4fb,#ff81cc,#dc2f89)} .gg-v114-flame-ball.purple{ background:radial-gradient(circle at 35% 28%,#faf0ff,#bd82ff 30%,#7a36dc 63%,#40118e); box-shadow:0 0 14px #bd83ff,0 0 28px #783bddaa } .gg-v114-flame-ball.purple::before,.gg-v114-flame-ball.purple::after{background:linear-gradient(135deg,#f7edff,#ba7cff,#7030dc)} .gg-v114-flame-ball.green{ background:radial-gradient(circle at 35% 28%,#efffdc,#a9f35a 30%,#48bf36 63%,#176b24); box-shadow:0 0 14px #a5f35b,0 0 28px #45bd38aa } .gg-v114-flame-ball.green::before,.gg-v114-flame-ball.green::after{background:linear-gradient(135deg,#f2ffdc,#9aed55,#38b43c)} @keyframes ggFlamePulse114{ to{filter:brightness(1.18);scale:1.06} } /* v115 Phantom Opera Mask */ .phantom-mask-v115{ filter:drop-shadow(0 3px 3px rgba(0,0,0,.28)); } /* v115 avatar speech bubble */ .gg-avatar-speech-v115{ position:absolute; left:50%; top:-11%; z-index:230; width:min(270px,82vw); transform:translate(-50%,10px) scale(.96); padding:10px 13px; border-radius:17px 17px 17px 5px; background:rgba(15,12,18,.97); border:1px solid rgba(215,176,91,.66); color:#fff4d9; text-align:center; font-size:12px; line-height:1.4; font-weight:900; opacity:0; visibility:hidden; pointer-events:none; box-shadow:0 10px 27px rgba(0,0,0,.4); } .gg-avatar-speech-v115[data-kind="crown"]{ border-color:#e4c45f; box-shadow:0 10px 27px rgba(0,0,0,.4),0 0 14px rgba(228,196,95,.18); } .gg-avatar-speech-v115[data-kind="phantom"]{ border-color:#d65b64; color:#ffe9e9; } .gg-avatar-speech-v115::after{ content:""; position:absolute; left:24%; bottom:-8px; border:8px solid transparent; border-top-color:rgba(15,12,18,.97); border-left-width:2px; } .gg-avatar-speech-v115.show{ visibility:visible; animation:ggSpeechV115 5.8s ease forwards; } @keyframes ggSpeechV115{ 0%{opacity:0;transform:translate(-50%,10px) scale(.96)} 8%,86%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-10px) scale(.97)} } /* v115 City + Phantom Mask rose encore */ .gg-phantom-roses-v115{ position:absolute; inset:0; z-index:175; overflow:hidden; pointer-events:none; } .gg-phantom-roses-v115 span{ position:absolute; right:-12%; top:var(--rose-y); font-size:28px; opacity:0; transform:scale(var(--rose-scale)) rotate(var(--rose-rot)); } .gg-phantom-roses-v115.play span{ animation:ggRoseThrowV115 3.3s cubic-bezier(.18,.7,.35,1) var(--rose-delay) forwards; } @keyframes ggRoseThrowV115{ 0%{right:-12%;opacity:0;translate:0 0;rotate:0deg} 12%{opacity:1} 55%{translate:-46vw -45px;rotate:210deg} 100%{right:92%;translate:-16vw 145px;rotate:520deg;opacity:0} } /* v119 Ring Runner rare fire meteor */ .gg-fire-meteor-v119{ position:absolute; z-index:24; width:54px; height:54px; transform:translate(-50%,-50%); border-radius:48% 52% 42% 58%; background: radial-gradient(circle at 36% 34%,#fff3a5 0 10%,#ffb327 18%,#ff5b1f 45%,#9e170f 72%,#44120e 100%); box-shadow: 0 0 12px #ffce50, 0 0 26px #ff5a23cc, -18px 8px 18px #ff7a2455; animation:ggFireMeteorTravelV119 var(--meteor-time-v119) linear forwards; pointer-events:none; } .gg-fire-meteor-v119::before{ content:""; position:absolute; right:30px; top:50%; width:88px; height:30px; transform:translateY(-50%) skewX(-18deg); border-radius:999px 0 0 999px; background: linear-gradient(90deg,transparent 0%,#ff4a1f55 30%,#ff8a25aa 58%,#ffd55bbb 82%,transparent 100%); filter:blur(2px); z-index:-1; } .gg-fire-meteor-v119::after{ content:""; position:absolute; inset:8px; border-radius:50%; background: radial-gradient(circle at 32% 30%,#4f2c24 0 14%,transparent 15%), radial-gradient(circle at 68% 64%,#5e3025 0 12%,transparent 13%); opacity:.5; } .gg-fire-meteor-v119.impact-v119{ animation:none!important; transform:translate(-50%,-50%) scale(1.45); filter:brightness(1.8); } .gg-v112-player.saturn-player.meteor-hit-v119{ animation:ggMeteorHitPlayerV119 .12s ease-in-out 2 alternate!important; filter:brightness(2) drop-shadow(0 0 18px #ff5a23)!important; } @keyframes ggFireMeteorTravelV119{ to{ transform: translate( calc(-50% + var(--meteor-dx-v119)), calc(-50% + var(--meteor-dy-v119)) ) rotate(540deg); } } @keyframes ggMeteorHitPlayerV119{ to{transform:translate(-50%,-50%) scale(.92) rotate(8deg)} } /* v120 Flame Ball Dodge avatar lower to the ground */ .gg-v112-player.flame-player-v114{ bottom:-16%!important; } /* v121 Flame Ball avatar raised half an avatar from v120 */ .gg-v112-player.flame-player-v114{ bottom:-2%!important; } /* v121 Lost Moon modes */ .gg-lost-moon-v121{ position:absolute;inset:6%; display:flex;flex-direction:column;justify-content:center;gap:12px } .gg-lost-mode-v121{ display:flex;justify-content:center;gap:7px } .gg-lost-mode-v121 button{ padding:7px 11px;border-radius:10px;border:1px solid #ffffff22; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;font-size:10px;font-weight:900 ;} .gg-lost-mode-v121 button.active{ background:#d2ad56;color:#21150c;border-color:#f1d17d } .gg-lost-status-v121{ text-align:center;color:#f5e9b8;font-size:17px;text-shadow:0 2px 7px #000 } .gg-lost-round-v121{ text-align:center;color:#a79dac;font-size:10px;font-weight:900 } .gg-lost-table-v121{ position:relative;height:180px } .gg-lost-cups-v121{ position:absolute;inset:0 } .gg-lost-cup-v121{ position:absolute;left:0;bottom:0;width:33.333%;height:165px;border:0;background:transparent; transition:left .62s cubic-bezier(.45,.02,.2,1);will-change:left;overflow:visible } .gg-lost-cup-v121.moving-v121{ filter:drop-shadow(0 8px 7px rgba(0,0,0,.28)) } .gg-lost-cup-v121 .cup-v121{ position:absolute;left:50%;bottom:4px;width:82px;height:108px;transform:translateX(-50%); border-radius:16px 16px 34px 34px; background:linear-gradient(90deg,#4d2d23 0 8%,#8a5a43 16% 50%,#5b3528 86% 100%); border:3px solid #2b1814;box-shadow:inset 8px 0 rgba(255,255,255,.06),0 8px 10px rgba(0,0,0,.35);z-index:3 } .gg-lost-cup-v121 .cup-v121::before{ content:"";position:absolute;left:50%;top:-8px;width:89px;height:18px;transform:translateX(-50%); border-radius:50%;background:#2d1916;border:3px solid #1c1010 } .gg-lost-cup-v121 .moon-v121{ position:absolute;left:50%;bottom:84px;transform:translateX(-50%); font-size:38px;font-style:normal;z-index:2; transition:bottom .34s ease,opacity .22s ease,transform .34s ease; filter:drop-shadow(0 0 7px #fff2a6) } .gg-lost-cup-v121.covering-v121 .moon-v121{ bottom:34px;opacity:.12;transform:translateX(-50%) scale(.5) } .gg-lost-cup-v121.reveal-v121 .moon-v121{ bottom:121px;opacity:1;transform:translateX(-50%) scale(1.08) } .gg-lost-cup-v121.wrong-v121 .cup-v121{ animation:ggWrongCup121 .18s ease-in-out 3 alternate } @keyframes ggWrongCup121{to{transform:translateX(-50%) rotate(6deg)}} /* v122 Lost Moon launch screen */ .gg-lost-launch-v122{ position:absolute;inset:8%; display:flex;flex-direction:column;justify-content:center;gap:12px; text-align:center } .gg-lost-launch-title-v122{font-size:27px;font-weight:1000;color:#f6e7a9;text-shadow:0 0 18px #e9cf6755} .gg-lost-launch-sub-v122{font-size:12px;font-weight:900;color:#aaa0af} .gg-lost-launch-modes-v122{display:grid;grid-template-columns:1fr 1fr;gap:9px} .gg-lost-launch-modes-v122 button{ min-height:92px;padding:11px 8px;border-radius:15px;border:2px solid #ffffff18; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;display:flex;flex-direction:column;justify-content:center;gap:5px ;} .gg-lost-launch-modes-v122 button b{font-size:14px;color:#eee} .gg-lost-launch-modes-v122 button span{font-size:9px;line-height:1.3} .gg-lost-launch-modes-v122 button.active{ border-color:#e1bd63;background:#302519;box-shadow:0 0 17px #d7ae4c33 } .gg-lost-launch-modes-v122 button.active b{color:#f6d77d} .gg-lost-play-v122{ align-self:center;min-width:145px;margin-top:5px;padding:12px 22px;border:0;border-radius:999px; background:#d5ad52;color:#1c130a;font-weight:1000;font-size:14px;box-shadow:0 6px 18px #0005 } .gg-lost-play-v122:active{transform:scale(.96)} /* v123 Mood Gauge must stay above every room object, avatar, effect and movable item. */ body.room-page-v054 #roomMoodGaugeV065, body.room-page-v054 .room-mood-gauge-v065{ z-index:2147481000!important; position:absolute!important; isolation:isolate; pointer-events:none!important; filter:drop-shadow(0 5px 10px rgba(0,0,0,.48)); } /* Rare idle props were positioned for the older, higher avatar. Keep them around the current lower-body/avatar area instead. */ .gg-rare-idle-v106 i{ top:52%!important; left:69%!important; } .gg-rare-idle-v106 b{ top:22%!important; } .gg-rare-idle-v106.phone i{ top:48%!important; left:72%!important; } .gg-rare-idle-v106.steal i{ top:58%!important; } /* v123 capes + sabers */ .gg-cape-v123{ transform-origin:210px 305px; animation:ggCapeSwayV123 2.8s ease-in-out infinite alternate; } .gg-cape-v123.light{ filter:drop-shadow(0 4px 3px rgba(255,246,216,.2)); } .gg-cape-v123.dark{ filter:drop-shadow(0 5px 4px rgba(0,0,0,.4)); } .gg-saber-v123.light-side{ filter:drop-shadow(0 0 4px rgba(73,202,255,.55)); } .gg-saber-v123.dark-side{ filter:drop-shadow(0 0 4px rgba(255,48,65,.6)); } @keyframes ggCapeSwayV123{ from{transform:skewX(-1.5deg)} to{transform:skewX(1.8deg)} } .gg-side-unlock-v123{ position:fixed; left:50%; top:max(22px,env(safe-area-inset-top)); z-index:2147483647; width:min(430px,calc(100% - 28px)); transform:translate(-50%,-12px); padding:12px 16px; border-radius:18px; background:rgba(14,12,18,.98); border:1px solid rgba(129,175,255,.7); color:#fff; text-align:center; opacity:0; visibility:hidden; pointer-events:none; box-shadow:0 12px 30px rgba(0,0,0,.45); } .gg-side-unlock-v123 b,.gg-side-unlock-v123 span{display:block} .gg-side-unlock-v123 span{margin-top:4px;color:#c5c0cc;font-size:.76rem} .gg-side-unlock-v123.show{ visibility:visible; animation:ggSideUnlockV123 3.6s ease forwards; } @keyframes ggSideUnlockV123{ 0%{opacity:0;transform:translate(-50%,-12px)} 10%,82%{opacity:1;transform:translate(-50%,0)} 100%{opacity:0;transform:translate(-50%,-8px)} } .gg-avatar-speech-v115[data-kind="saber"]{ border-color:#8fcfff; color:#f3fbff; box-shadow:0 10px 27px rgba(0,0,0,.4),0 0 16px rgba(82,194,255,.2); } /* v124 Make Up interaction: spray passes over the avatar, nose is the top avatar layer. */ .room-avatar.room-avatar-exact .gg-makeup-spray-v124{ --gg-spray-v124:#ef3340; position:absolute; left:50%; top:39%; width:min(72%,310px); height:46%; transform:translate(-50%,-50%); z-index:2147481500!important; pointer-events:none; overflow:visible; opacity:0; } .room-avatar.room-avatar-exact .gg-makeup-spray-v124.burst{opacity:1} .gg-makeup-spray-v124 i{ position:absolute; left:50%; top:54%; width:26px; height:26px; border-radius:50%; background:var(--gg-spray-v124); opacity:0; filter:blur(5px) drop-shadow(0 0 8px var(--gg-spray-v124)); animation:ggMakeupCloudV124 1.65s ease-out forwards; } .gg-makeup-spray-v124 i:nth-child(2){--dx:-82px;--dy:-60px;width:38px;height:38px;animation-delay:.04s} .gg-makeup-spray-v124 i:nth-child(3){--dx:78px;--dy:-48px;width:31px;height:31px;animation-delay:.08s} .gg-makeup-spray-v124 i:nth-child(4){--dx:-60px;--dy:18px;width:44px;height:44px;animation-delay:.12s} .gg-makeup-spray-v124 i:nth-child(5){--dx:66px;--dy:25px;width:36px;height:36px;animation-delay:.16s} .gg-makeup-spray-v124 i:nth-child(6){--dx:-28px;--dy:-90px;width:30px;height:30px;animation-delay:.20s} .gg-makeup-spray-v124 i:nth-child(7){--dx:30px;--dy:-88px;width:48px;height:48px;animation-delay:.24s} .gg-makeup-spray-v124 i:nth-child(8){--dx:-100px;--dy:-15px;width:25px;height:25px;animation-delay:.28s} .gg-makeup-spray-v124 i:nth-child(9){--dx:102px;--dy:-8px;width:28px;height:28px;animation-delay:.32s} .gg-makeup-spray-v124 i:nth-child(10){--dx:-10px;--dy:45px;width:39px;height:39px;animation-delay:.36s} .gg-makeup-spray-v124 i:nth-child(11){--dx:-48px;--dy:-38px;width:53px;height:53px;animation-delay:.18s} .gg-makeup-spray-v124 i:nth-child(12){--dx:48px;--dy:-28px;width:52px;height:52px;animation-delay:.22s} @keyframes ggMakeupCloudV124{ 0%{opacity:0;transform:translate(-50%,-50%) scale(.15)} 18%{opacity:.78} 62%{opacity:.5} 100%{opacity:0;transform:translate(calc(-50% + var(--dx,0px)),calc(-50% + var(--dy,-55px))) scale(2.15)} } .room-avatar.room-avatar-exact .gg-makeup-nose-v124{ --gg-nose-v124:#e52e3d; position:absolute; left:50%; top:34.8%; width:clamp(18px,5.3%,28px); aspect-ratio:1; transform:translate(-50%,-50%) scale(.3); z-index:2147482000!important; pointer-events:none; border-radius:50%; background: radial-gradient(circle at 34% 28%,rgba(255,255,255,.72) 0 9%,transparent 11%), radial-gradient(circle at 50% 55%,var(--gg-nose-v124) 0 64%,color-mix(in srgb,var(--gg-nose-v124),#000 28%) 66% 100%); border:2px solid rgba(25,15,18,.55); box-shadow:0 3px 7px rgba(0,0,0,.42),0 0 7px color-mix(in srgb,var(--gg-nose-v124),transparent 42%); opacity:0; } .room-avatar.room-avatar-exact .gg-makeup-nose-v124.show{ opacity:1; animation:ggMakeupNosePopV124 .42s cubic-bezier(.2,1.55,.4,1) forwards; } @keyframes ggMakeupNosePopV124{ 0%{opacity:0;transform:translate(-50%,-50%) scale(.2)} 70%{opacity:1;transform:translate(-50%,-50%) scale(1.2)} 100%{opacity:1;transform:translate(-50%,-50%) scale(1)} } /* v127 canonical temporary makeup-nose placement (replaces v125/v126 overrides). */ .room-avatar.room-avatar-exact .gg-makeup-nose-v124{ top:51.5%!important; } /* v128 — old-age Avatar Room idle event has text only, never glasses. */ .gg-old-fx-v103.no-glasses-v128{ display:flex; align-items:center; justify-content:center; } .gg-old-fx-v103.no-glasses-v128 > span{ display:none!important; } /* v129 — Snake plant personality: sombrero + moustache */ .gg-snakeplant-v112 .head{overflow:visible!important} .gg-snake-sombrero-v129{ position:absolute;left:50%;top:-16px;width:32px;height:9px; transform:translateX(-50%) rotate(-3deg);z-index:8; border-radius:50%;background:#d9a73a; box-shadow:inset 0 -2px 0 rgba(92,47,14,.35),0 2px 2px rgba(0,0,0,.22); } .gg-snake-sombrero-v129::before{ content:"";position:absolute;left:8px;bottom:3px;width:16px;height:13px; border-radius:50% 50% 34% 34%;background:#e6b94c; box-shadow:inset 0 -3px 0 #b66a2c; } .gg-snake-sombrero-v129::after{ content:"";position:absolute;left:3px;right:3px;bottom:1px;height:2px; border-radius:99px;background:#9b3b31; } .gg-snake-mustache-v129{ position:absolute;left:50%;top:19px;width:7px;height:4px; transform:translateX(-50%);z-index:9;background:#241713;border-radius:70% 15% 70% 20%; } .gg-snake-mustache-v129::before{ content:"";position:absolute;right:5px;top:0;width:7px;height:4px; background:#241713;border-radius:15% 70% 20% 70%;transform:rotate(8deg); } .gg-snake-mustache-v129::after{ content:"";position:absolute;left:5px;top:0;width:7px;height:4px; background:#241713;border-radius:70% 15% 70% 20%;transform:rotate(-8deg); } /* v129 — replace Dancing Plant with a clean windmill flower */ .gg-custom-windmill-v129{overflow:visible!important} .gg-windmill-flower-v129{ position:absolute;left:50%;bottom:0;width:78px;height:108px; transform:translateX(-50%);display:block; } .gg-windmill-flower-v129>.stem{ position:absolute;left:37px;bottom:0;width:6px;height:70px; border-radius:8px;background:linear-gradient(90deg,#397844,#69a958,#397844); } .gg-windmill-flower-v129>.leaf{ position:absolute;bottom:31px;width:27px;height:13px;background:#57944e; border-radius:100% 0 100% 0; } .gg-windmill-flower-v129>.leaf.left{left:14px;transform:rotate(24deg)} .gg-windmill-flower-v129>.leaf.right{right:12px;transform:scaleX(-1) rotate(24deg)} .gg-windmill-flower-v129 .wheel{ position:absolute;left:39px;top:26px;width:54px;height:54px; transform:translate(-50%,-50%); animation:ggWindmillFlowerSpinV129 2.4s linear infinite; } .gg-windmill-flower-v129 .blade{ position:absolute;left:24px;top:1px;width:16px;height:26px; transform-origin:4px 26px;border-radius:80% 18% 70% 20%; background:linear-gradient(135deg,#f2c94c,#f28d35); box-shadow:inset -2px -2px 0 rgba(133,68,17,.18); } .gg-windmill-flower-v129 .blade.b2{transform:rotate(90deg)} .gg-windmill-flower-v129 .blade.b3{transform:rotate(180deg)} .gg-windmill-flower-v129 .blade.b4{transform:rotate(270deg)} .gg-windmill-flower-v129 .hub{ position:absolute;left:22px;top:22px;width:12px;height:12px;border-radius:50%; background:#7b4b25;box-shadow:0 0 0 3px #e6b94c; } @keyframes ggWindmillFlowerSpinV129{to{transform:translate(-50%,-50%) rotate(360deg)}} /* v130 — Avatar Room door is permanent top-layer navigation and always clickable. */ body.room-page-v054 #roomDoorV114, body.room-page-v054 .gg-room-door-v114, body.room-page-v054 [data-room-door], body.room-page-v054 .room-door, body.room-page-v054 .avatar-room-door{ position:absolute!important; z-index:2147483000!important; pointer-events:auto!important; touch-action:manipulation!important; isolation:isolate; } body.room-page-v054 #roomDoorV114 *, body.room-page-v054 .gg-room-door-v114 *, body.room-page-v054 [data-room-door] *{ pointer-events:none!important; } /* v131 — NO DOUBLE POINTS anywhere */ .gg-double-power-v112, .gg-lg-target-v107.doublebubble, .doublebubble, [class*="doublebubble"]{ display:none!important; pointer-events:none!important; } /* v131 game tutorial HUD icon beside the existing ? */ .gg-game-help-v131{ position:fixed; right:62px; top:max(12px,env(safe-area-inset-top)); z-index:2147483640; width:42px;height:42px;border-radius:50%; border:1px solid rgba(215,176,91,.6); background:rgba(20,16,24,.96); color:#fff;font-size:19px; display:grid;place-items:center; box-shadow:0 8px 22px rgba(0,0,0,.35); } .gg-game-tutorial-v131{ position:fixed;inset:0;z-index:2147483647; display:none;place-items:center;padding:16px; background:rgba(5,4,7,.84);backdrop-filter:blur(9px) } .gg-game-tutorial-v131.show{display:grid} .gg-game-tutorial-card-v131{ width:min(520px,100%);padding:18px;border-radius:23px; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%); border:1px solid rgba(215,176,91,.55); box-shadow:0 25px 80px rgba(0,0,0,.65) ;color:#181818;} .gg-game-tutorial-card-v131 header{display:flex;justify-content:space-between;align-items:start} .gg-game-tutorial-card-v131 header small{color:#d7b05b;font-weight:1000;letter-spacing:.12em} .gg-game-tutorial-card-v131 header h2{margin:3px 0} .gg-game-tutorial-card-v131 header button{width:35px;height:35px;border:0;border-radius:50%;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;} .gg-game-tutorial-page-v131{text-align:center;padding:20px 8px;min-height:220px} .gg-game-tutorial-page-v131 .hero{display:block;font-style:normal;font-size:54px} .gg-game-tutorial-page-v131 h3{margin:9px 0 6px} .gg-game-tutorial-page-v131 p{margin:0 auto;max-width:420px;color:#bbb;line-height:1.55;font-size:13px} .gg-game-tutorial-card-v131 footer{display:grid;grid-template-columns:88px 1fr 88px;gap:8px;align-items:center} .gg-game-tutorial-card-v131 footer button{padding:9px;border:0;border-radius:10px;background:#d2ad56;color:#20160b;font-weight:1000} .gg-game-tutorial-card-v131 footer button:disabled{opacity:.35} #ggGameTutorialDotsV131{display:flex;justify-content:center;gap:5px} #ggGameTutorialDotsV131 b{width:7px;height:7px;border-radius:50%;background:#534b57} #ggGameTutorialDotsV131 b.active{background:#e2bf64} /* v131 Friends is a compact manual dropdown */ .room-friends .room-friends-head{padding:0!important} .gg-friends-toggle-v131{ width:100%;display:flex;justify-content:space-between;align-items:center; padding:11px 13px;border:0;background:transparent;color:inherit;text-align:left } .gg-friends-toggle-v131>div{display:grid;gap:2px} .gg-friends-toggle-v131 small{color:#999} .gg-friends-meta-v131{display:flex;align-items:center;gap:9px} .gg-friends-meta-v131 b{font-size:11px;font-weight:800} .gg-friends-meta-v131 i{font-style:normal;transition:transform .2s ease} .room-friends:not(.is-collapsed-v131) .gg-friends-meta-v131 i{transform:rotate(180deg)} .gg-friends-body-v131{padding:0 10px 10px} .room-friends.is-collapsed-v131{margin-bottom:8px!important} .room-friends.is-collapsed-v131 .room-friends-head{border-bottom:0!important} /* v131 Actual room world door: above EVERYTHING and always tappable */ body.room-page-v054 #ggSideDoorV111{ z-index:2147483646!important; pointer-events:auto!important; touch-action:manipulation!important; isolation:isolate!important; } body.room-page-v054 #ggSideDoorV111 *{pointer-events:none!important} /* v131 Claw Machine floor decor */ .v131-claw-machine{ position:relative;display:block;width:116px;height:154px; border:5px solid #291f32;border-radius:13px 13px 8px 8px; background:#684b78;box-shadow:0 8px 10px rgba(0,0,0,.4),inset 0 0 0 3px #9d7aaa } .v131-claw-machine .sign{ position:absolute;left:7px;right:7px;top:5px;height:23px; display:grid;place-items:center;border-radius:7px; background:#241a2b;color:#f0c96a;font-style:normal;font-size:8px;font-weight:1000;letter-spacing:.08em } .v131-claw-machine .glass{ position:absolute;left:9px;right:9px;top:35px;height:82px; overflow:hidden;border:3px solid #31233a;border-radius:5px; background:linear-gradient(135deg,rgba(164,226,255,.28),rgba(255,255,255,.08)) } .v131-claw-machine .toy{position:absolute;font-size:24px;font-style:normal} .v131-claw-machine .t1{left:4px;bottom:4px}.v131-claw-machine .t2{left:31px;bottom:10px} .v131-claw-machine .t3{right:6px;bottom:3px}.v131-claw-machine .t4{right:24px;bottom:29px} .v131-claw-machine .claw{position:absolute;left:50%;top:4px;transform:translateX(-50%);font-style:normal;color:#e5e1dc;font-size:26px} .v131-claw-machine .controls{position:absolute;left:8px;right:8px;bottom:11px;height:26px;border-radius:4px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;} .v131-claw-machine .controls::before{content:"";position:absolute;left:14px;top:8px;width:9px;height:9px;border-radius:50%;background:#d84c59} .v131-claw-machine .controls b{position:absolute;right:14px;top:4px;width:5px;height:15px;background:#d7b05b} .v131-claw-machine>.base{position:absolute;left:0;right:0;bottom:-10px;height:13px;border-radius:0 0 8px 8px;background:#281e30} /* v131 Claw mini-game */ .gg-claw-game-v131{ position:fixed;inset:0;z-index:2147483647;display:none;place-items:center; padding:15px;background:rgba(5,4,7,.86);backdrop-filter:blur(9px) } .gg-claw-game-v131.show{display:grid} .gg-claw-card-v131{ width:min(560px,100%);padding:16px;border-radius:23px; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid rgba(215,176,91,.55); box-shadow:0 25px 80px rgba(0,0,0,.65) ;color:#181818;} .gg-claw-card-v131 header{display:flex;justify-content:space-between;align-items:start} .gg-claw-card-v131 header small{color:#d7b05b;font-weight:1000;letter-spacing:.1em} .gg-claw-card-v131 header h2{margin:2px 0 10px} .gg-claw-card-v131 header button{width:34px;height:34px;border:0;border-radius:50%;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;} .gg-claw-hud-v131{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:8px} .gg-claw-hud-v131 span{padding:7px;border-radius:10px;background:#18131c;text-align:center;font-size:9px;color:#999} .gg-claw-hud-v131 b{display:block;color:#fff;font-size:16px} .gg-claw-stage-v131{ position:relative;height:330px;overflow:hidden;border-radius:17px; border:4px solid #382b43;background:linear-gradient(#28364a 0 68%,#4a314b 68% 100%);touch-action:none } .gg-claw-rail-v131{position:absolute;left:5%;right:5%;top:20px;height:8px;border-radius:99px;background:#a9a6a7;box-shadow:0 4px 0 #4f4d50} .gg-claw-hook-v131{position:absolute;left:50%;top:19px;width:40px;height:118px;transform:translateX(-50%);transition:left .04s linear;z-index:5} .gg-claw-hook-v131 i{position:absolute;left:18px;top:0;width:4px;height:78px;background:#dad9d5} .gg-claw-hook-v131 b{position:absolute;left:50%;top:65px;transform:translateX(-50%);font-size:42px;color:#e3e0db} .gg-claw-hook-v131.drop{animation:ggClawDrop131 .95s ease-in-out} @keyframes ggClawDrop131{45%{transform:translate(-50%,130px)}100%{transform:translate(-50%,0)}} .gg-claw-prizes-v131{position:absolute;left:4%;right:4%;bottom:12px;height:125px} .gg-claw-prize-v131{position:absolute;transform:translateX(-50%);border:0;background:transparent;font-size:38px;filter:drop-shadow(0 4px 3px #0005)} .gg-claw-prize-v131.caught{animation:ggCaught131 .45s ease forwards}@keyframes ggCaught131{to{transform:translate(-50%,-100px) scale(.5);opacity:0}} .gg-claw-help-v131{text-align:center;color:#bbb;font-size:11px;min-height:17px} .gg-claw-drop-v131,.gg-claw-start-v131{ width:100%;padding:11px;border:0;border-radius:11px;background:#d2ad56;color:#20160b;font-weight:1000 } .gg-claw-drop-v131[hidden]{display:none}.gg-claw-start-v131[hidden]{display:none} /* v131 Cursed Book Hunt — larger tap targets */ .gg-book-target-v097{ width:66px!important; height:82px!important; margin-left:-12px; padding:10px!important; background-clip:content-box!important; } .gg-book-target-v097.cursed, .gg-book-target-v097.trap{ border-width:0!important; } .gg-book-target-v097.cursed::after, .gg-book-target-v097.trap::after{ content:"";position:absolute;inset:10px;border-radius:5px; border:2px solid #26182f;pointer-events:none } .gg-book-target-v097.trap::after{border-color:#40272b;border-radius:10px} /* v132 — compact Friends tab by default */ .room-friends.is-collapsed-v131{ width:max-content!important; max-width:165px!important; min-width:0!important; margin:4px 0 7px!important; border-radius:13px!important; overflow:hidden!important; } .room-friends.is-collapsed-v131 .gg-friends-toggle-v131{ width:auto!important; min-width:145px!important; padding:7px 9px!important; gap:8px!important; } .room-friends.is-collapsed-v131 .gg-friends-toggle-v131 small{ display:none!important; } .room-friends.is-collapsed-v131 .gg-friends-toggle-v131 strong{ font-size:12px!important; } .room-friends.is-collapsed-v131 .gg-friends-meta-v131{ gap:5px!important; } .room-friends.is-collapsed-v131 .gg-friends-meta-v131 b{ font-size:9px!important; } .room-friends.is-collapsed-v131 .gg-friends-meta-v131 i{ font-size:11px!important; } /* v132 — Game guide and ? are an intentional side-by-side HUD pair */ body.room-page-v054 #ggRoomHelpV109{ top:max(12px,env(safe-area-inset-top))!important; right:12px!important; width:42px!important; height:42px!important; z-index:2147483640!important; } body.room-page-v054 #ggGameHelpV131{ top:max(12px,env(safe-area-inset-top))!important; right:60px!important; width:42px!important; height:42px!important; z-index:2147483640!important; } /* v133 — Mini-game guide layout fix */ .gg-game-tutorial-v131{ align-items:center!important; justify-items:center!important; overflow:auto!important; padding: max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))!important; } .gg-game-tutorial-card-v131{ width:min(460px,calc(100vw - 24px))!important; max-width:460px!important; max-height:min(82vh,680px)!important; overflow:hidden!important; padding:14px!important; border-radius:20px!important; box-sizing:border-box!important; display:flex!important; flex-direction:column!important; } .gg-game-tutorial-card-v131 header{ flex:0 0 auto!important; gap:10px!important; } .gg-game-tutorial-card-v131 header h2{ font-size:20px!important; line-height:1.1!important; } .gg-game-tutorial-page-v131{ flex:1 1 auto!important; min-height:0!important; max-height:52vh!important; overflow-y:auto!important; overscroll-behavior:contain!important; padding:12px 6px!important; box-sizing:border-box!important; } .gg-game-tutorial-page-v131 .hero{ font-size:42px!important; line-height:1!important; margin-bottom:6px!important; } .gg-game-tutorial-page-v131 h3{ font-size:18px!important; line-height:1.2!important; margin:6px 0 7px!important; overflow-wrap:anywhere!important; } .gg-game-tutorial-page-v131 p{ width:100%!important; max-width:100%!important; margin:0!important; padding:0 2px 4px!important; box-sizing:border-box!important; font-size:12px!important; line-height:1.45!important; color:#c9c2cc!important; overflow-wrap:anywhere!important; word-break:normal!important; white-space:normal!important; } .gg-game-tutorial-card-v131 footer{ flex:0 0 auto!important; grid-template-columns:78px 1fr 78px!important; gap:7px!important; margin-top:8px!important; } .gg-game-tutorial-card-v131 footer button{ padding:8px 7px!important; font-size:11px!important; } @media(max-width:430px){ .gg-game-tutorial-card-v131{ width:calc(100vw - 18px)!important; max-height:78vh!important; padding:12px!important; } .gg-game-tutorial-page-v131{ max-height:48vh!important; padding:10px 3px!important; } .gg-game-tutorial-page-v131 .hero{ font-size:36px!important; } .gg-game-tutorial-page-v131 h3{ font-size:16px!important; } .gg-game-tutorial-page-v131 p{ font-size:11px!important; line-height:1.4!important; } .gg-game-tutorial-card-v131 footer{ grid-template-columns:68px 1fr 68px!important; } } /* v135 — readable compact 4-page game guide */ .gg-game-tutorial-page-v131{display:block!important;color:#fff!important} .gg-game-tutorial-page-v131 h3{display:block!important;color:#fff!important;opacity:1!important} .gg-game-tutorial-page-v131 p{ display:block!important;visibility:visible!important;opacity:1!important; color:#e0dbe3!important;font-size:13px!important;line-height:1.5!important; min-height:72px!important; } /* Standalone HUD buttons remain above Scores, not inside the dock/menu. */ body.room-page-v054 #ggRoomHelpV109, body.room-page-v054 #ggGameHelpV131{z-index:2147483641!important} /* v135 rear short-dread mass is behind face; front dread strands remain in hair layer */ #hairBack{transition:none} /* v136 — force actual guide words to render, independent of inherited p/h3 rules */ .gg-game-tutorial-page-v131 .gg-guide-title-v136{ display:block!important;visibility:visible!important;opacity:1!important; position:relative!important;width:100%!important;height:auto!important; color:#fff!important;font-size:18px!important;font-weight:900!important; line-height:1.25!important;text-align:center!important;margin:8px 0!important; transform:none!important;clip:auto!important;overflow:visible!important; } .gg-game-tutorial-page-v131 .gg-guide-words-v136{ display:block!important;visibility:visible!important;opacity:1!important; position:relative!important;width:100%!important;height:auto!important;min-height:70px!important; color:#eee8f0!important;background:rgba(255,255,255,.055)!important; border:1px solid rgba(255,255,255,.09)!important;border-radius:12px!important; padding:11px!important;box-sizing:border-box!important; font-size:13px!important;font-weight:600!important;line-height:1.5!important; text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important; transform:none!important;clip:auto!important;overflow:visible!important; } .gg-game-tutorial-page-v131 .hero{ display:block!important;visibility:visible!important;opacity:1!important; position:relative!important;height:auto!important; } /* v136 rear short dreads are real strands in the back-hair layer */ #shortDreadsBack,#shortDreadsBackOutline{pointer-events:none} /* v137 — Short Dreads top/scalp coverage */ #shortDreadsCap, #shortDreadsCapTexture{ pointer-events:none; } /* v137 — Mini-game guide rebuilt as a simple guaranteed-visible text card */ .gg-guide-shell-v137{ height:auto!important; min-height:0!important; max-height:82vh!important; overflow:hidden!important; } .gg-guide-page-v137{ display:block!important; position:relative!important; width:100%!important; height:auto!important; min-height:230px!important; max-height:52vh!important; padding:10px 2px!important; overflow-y:auto!important; overflow-x:hidden!important; box-sizing:border-box!important; opacity:1!important; visibility:visible!important; color:#fff!important; } .gg-guide-content-v137{ display:flex!important; flex-direction:column!important; align-items:center!important; width:100%!important; height:auto!important; min-height:205px!important; padding:12px!important; box-sizing:border-box!important; border-radius:16px!important; background:#17131c!important; border:1px solid rgba(215,176,91,.32)!important; color:#fff!important; opacity:1!important; visibility:visible!important; transform:none!important; } .gg-guide-icon-v137{ display:block!important; position:relative!important; flex:0 0 auto!important; height:auto!important; margin:0 0 7px!important; color:#fff!important; font-size:42px!important; line-height:1!important; opacity:1!important; visibility:visible!important; } .gg-guide-title-v137{ display:block!important; position:relative!important; width:100%!important; height:auto!important; margin:0 0 9px!important; padding:0!important; color:#fff!important; background:transparent!important; font-size:18px!important; font-weight:1000!important; line-height:1.25!important; text-align:center!important; opacity:1!important; visibility:visible!important; overflow:visible!important; white-space:normal!important; } .gg-guide-text-v137{ display:block!important; position:relative!important; width:100%!important; height:auto!important; min-height:90px!important; margin:0!important; padding:12px!important; box-sizing:border-box!important; border-radius:12px!important; background:#29222f!important; border:1px solid rgba(255,255,255,.10)!important; color:#f7f3f8!important; -webkit-text-fill-color:#f7f3f8!important; font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; font-size:13px!important; font-weight:700!important; line-height:1.55!important; letter-spacing:0!important; text-align:left!important; text-indent:0!important; text-transform:none!important; text-shadow:none!important; opacity:1!important; visibility:visible!important; overflow:visible!important; white-space:normal!important; overflow-wrap:anywhere!important; word-break:normal!important; transform:none!important; clip:auto!important; clip-path:none!important; } @media(max-width:430px){ .gg-guide-page-v137{min-height:215px!important;max-height:48vh!important} .gg-guide-content-v137{min-height:195px!important;padding:10px!important} .gg-guide-icon-v137{font-size:36px!important} .gg-guide-title-v137{font-size:16px!important} .gg-guide-text-v137{font-size:12px!important;line-height:1.48!important;min-height:96px!important} } /* v138 capes — dedicated visible cape layer */ #capeLayerV138{pointer-events:none} .gg-cape-v138{transform-origin:210px 304px;animation:ggCapeSway138 2.8s ease-in-out infinite alternate} .gg-cape-v138.light{filter:drop-shadow(0 5px 4px rgba(255,244,210,.24))} .gg-cape-v138.dark{filter:drop-shadow(0 7px 5px rgba(0,0,0,.42))} @keyframes ggCapeSway138{from{transform:skewX(-1.2deg)}to{transform:skewX(1.4deg)}} .gg-cape-collar-v138{pointer-events:none} /* v138 Wizard unlock accessories */ .gg-wizard-wand-v138,.gg-wizard-scarf-v138,.gg-wizard-pipe-v138{pointer-events:none} .gg-wizard-wand-v138{filter:drop-shadow(0 0 6px rgba(245,216,114,.6))} .gg-wizard-pipe-v138{filter:drop-shadow(0 3px 2px rgba(0,0,0,.35))} /* v138 Owl in Cage floor decor */ .v138-owl-cage{ position:relative;display:block;width:92px;height:132px; border:5px solid #2c2420;border-radius:46px 46px 12px 12px; background:linear-gradient(90deg,rgba(255,255,255,.03),rgba(213,176,91,.06)); box-shadow:0 8px 10px rgba(0,0,0,.38) } .v138-owl-cage .cage-top{ position:absolute;left:50%;top:-15px;width:34px;height:18px; transform:translateX(-50%);border:5px solid #2c2420;border-bottom:0;border-radius:18px 18px 0 0 } .v138-owl-cage .bars{ position:absolute;inset:4px 6px 15px; background:repeating-linear-gradient(90deg,transparent 0 13px,#4b3e32 13px 17px,transparent 17px 26px); border-radius:36px 36px 5px 5px;z-index:3;pointer-events:none } .v138-owl-cage .owl{position:absolute;left:50%;top:43px;transform:translateX(-50%);font-size:43px;z-index:2} .v138-owl-cage .perch{position:absolute;left:12px;right:12px;bottom:27px;height:5px;border-radius:99px;background:#6b472b;z-index:2} .v138-owl-cage>.base{position:absolute;left:-6px;right:-6px;bottom:-9px;height:16px;border-radius:8px;background:#2c2420} /* v138 Giant Eye scene — fills most of the window */ .room-scene-window-v055[data-scene="giantEye"] .room-scene-visual-v055{ overflow:hidden!important; background: radial-gradient(ellipse at center, #09090b 0 10%, #d5ad52 11% 20%, #5a3925 21% 28%, #e8d7ba 29% 55%, #c68f83 56% 64%, #2a1519 65% 100%)!important; animation:ggEyeWatchV138 5.5s ease-in-out infinite alternate!important; } .room-scene-window-v055[data-scene="giantEye"] .room-scene-visual-v055::before{ content:"";position:absolute;inset:-18%; border-radius:50%; border-top:42px solid #241319;border-bottom:42px solid #241319; box-shadow:inset 0 0 25px rgba(0,0,0,.55); pointer-events:none } .room-scene-window-v055[data-scene="giantEye"] .room-scene-visual-v055::after{ content:"";position:absolute;left:48%;top:48%;width:24%;aspect-ratio:1; transform:translate(-50%,-50%);border-radius:50%; background:radial-gradient(circle,#fff 0 5%,#0a090a 7% 52%,transparent 54%); box-shadow:0 0 18px rgba(0,0,0,.6) } @keyframes ggEyeWatchV138{ 0%{background-position:-10px 0} 55%{background-position:12px 4px} 100%{background-position:-4px -3px} } /* v138 Stained Glass window */ .room-scene-window-v055[data-frame="stainedGlass"]{ border-radius:22px!important; } .room-scene-window-v055[data-frame="stainedGlass"] .room-window-frame-v055{ border:10px solid #25212b!important; box-shadow: inset 0 0 0 4px #d5ad52, inset 0 0 0 9px #342d3b, 0 0 13px rgba(215,176,91,.24)!important; } .room-scene-window-v055[data-frame="stainedGlass"] .room-window-frame-v055::before{ content:"";position:absolute;inset:5px;z-index:8;pointer-events:none;opacity:.52; background: linear-gradient(45deg,transparent 46%,#211b29 47% 52%,transparent 53%), linear-gradient(-45deg,transparent 46%,#211b29 47% 52%,transparent 53%), linear-gradient(90deg,transparent 47%,#211b29 48% 52%,transparent 53%), linear-gradient(0deg,transparent 47%,#211b29 48% 52%,transparent 53%); background-size:54px 54px; } .room-scene-window-v055[data-frame="stainedGlass"] .room-window-frame-v055::after{ content:"✦";position:absolute;left:50%;top:50%;z-index:9; transform:translate(-50%,-50%);color:#d5ad52;font-size:34px;text-shadow:0 0 8px #d5ad52; pointer-events:none } /* v139 — Smooth Window (same saved frame id, redesigned/renamed) */ .room-scene-window-v055[data-frame="stainedGlass"]{ border-radius:18px!important; } .room-scene-window-v055[data-frame="stainedGlass"] .room-window-frame-v055{ border:7px solid #3b3331!important; background:transparent!important; box-shadow: inset 0 0 0 3px #a69178, inset 0 0 18px rgba(255,255,255,.10), 0 5px 13px rgba(0,0,0,.28)!important; } .room-scene-window-v055[data-frame="stainedGlass"] .room-window-frame-v055::before, .room-scene-window-v055[data-frame="stainedGlass"] .room-window-frame-v055::after{ content:none!important;display:none!important; } /* v139 — Giant Eye pupil actively looks around */ .room-scene-window-v055[data-scene="giantEye"] .room-scene-visual-v055{ animation:ggEyeSurfaceV139 7s ease-in-out infinite!important; } .room-scene-window-v055[data-scene="giantEye"] .room-scene-visual-v055::after{ left:50%;top:50%; animation:ggEyePupilLookV139 6.8s cubic-bezier(.45,.05,.55,.95) infinite!important; } @keyframes ggEyeSurfaceV139{ 0%,100%{filter:brightness(.95)} 42%{filter:brightness(1.06)} 46%{filter:brightness(.55)} 50%{filter:brightness(1)} } @keyframes ggEyePupilLookV139{ 0%,10%{left:50%;top:50%} 20%{left:37%;top:44%} 31%{left:37%;top:44%} 42%{left:64%;top:46%} 53%{left:64%;top:46%} 64%{left:55%;top:62%} 74%{left:55%;top:62%} 84%{left:43%;top:37%} 94%,100%{left:50%;top:50%} } /* v139 — Stained Glass is now a SCENE */ .room-scene-window-v055[data-scene="stainedGlassScene"] .room-scene-visual-v055{ background: linear-gradient(45deg,transparent 47%,#251d2b 48% 52%,transparent 53%), linear-gradient(-45deg,transparent 47%,#251d2b 48% 52%,transparent 53%), radial-gradient(circle at 50% 48%,#f2c75e 0 7%,#ad355d 8% 19%,#593a9d 20% 32%,transparent 33%), conic-gradient(from 45deg,#3d83a8,#b33d5d,#d19b3b,#4b8f67,#7050a2,#3d83a8)!important; background-size:58px 58px,58px 58px,100% 100%,100% 100%!important; animation:ggStainedGlowV139 5s ease-in-out infinite alternate!important; } .room-scene-window-v055[data-scene="stainedGlassScene"] .room-scene-visual-v055::before{ content:"✦";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%); font-size:58px;color:#f6d978;text-shadow:0 0 15px rgba(255,220,120,.75);opacity:.8 } .room-scene-window-v055[data-scene="stainedGlassScene"] .room-scene-visual-v055::after{ content:"";position:absolute;inset:0; background:linear-gradient(115deg,transparent 15%,rgba(255,239,182,.34) 44%,transparent 66%); animation:ggGlassShimmerV139 4.5s ease-in-out infinite } @keyframes ggStainedGlowV139{to{filter:saturate(1.2) brightness(1.12)}} @keyframes ggGlassShimmerV139{0%,100%{transform:translateX(-45%)}50%{transform:translateX(45%)}} /* v139 — El Cactus */ .gg-custom-el-cactus-v139{overflow:visible!important} .gg-el-cactus-v139{ position:absolute;left:50%;bottom:1px;width:92px;height:132px; transform:translateX(-50%);display:block } .gg-el-cactus-v139 .cactus-main{ position:absolute;left:32px;bottom:0;width:31px;height:101px;border-radius:48% 48% 18px 18px; background:linear-gradient(90deg,#257244,#52a85f 48%,#247043); border:4px solid #174c32;box-shadow:inset 5px 0 rgba(255,255,255,.08) } .gg-el-cactus-v139 .cactus-arm{ position:absolute;bottom:38px;width:26px;height:49px;border:4px solid #174c32; background:#3a9554 } .gg-el-cactus-v139 .cactus-arm.left{ left:13px;border-radius:17px 4px 14px 15px;transform:rotate(-8deg) } .gg-el-cactus-v139 .cactus-arm.right{ right:10px;border-radius:4px 17px 15px 14px;transform:rotate(8deg) } .gg-el-cactus-v139 .cactus-arm.left::before, .gg-el-cactus-v139 .cactus-arm.right::before{ content:"";position:absolute;top:-10px;width:18px;height:25px;background:#3a9554;border:4px solid #174c32;border-radius:50% } .gg-el-cactus-v139 .cactus-arm.left::before{left:-4px} .gg-el-cactus-v139 .cactus-arm.right::before{right:-4px} .gg-el-cactus-v139 .sombrero{ position:absolute;left:50%;top:13px;width:74px;height:18px;transform:translateX(-50%) rotate(-3deg); border-radius:50%;background:#d9a73a;border:3px solid #875522;z-index:5 } .gg-el-cactus-v139 .sombrero i{ position:absolute;left:50%;bottom:7px;width:40px;height:26px;transform:translateX(-50%); border-radius:50% 50% 24% 24%;background:#e1b347;border:3px solid #875522;border-bottom-width:5px } .gg-el-cactus-v139 .sombrero::after{ content:"";position:absolute;left:8px;right:8px;bottom:3px;height:3px;background:#a52f36;border-radius:99px } .gg-el-cactus-v139 .face{position:absolute;left:31px;top:48px;width:33px;height:31px;z-index:6} .gg-el-cactus-v139 .eye{ position:absolute;top:2px;width:6px;height:8px;border-radius:50%;background:#151217 } .gg-el-cactus-v139 .eye.left{left:5px}.gg-el-cactus-v139 .eye.right{right:5px} .gg-el-cactus-v139 .mustache{ position:absolute;left:50%;top:16px;width:15px;height:7px;transform:translateX(-50%); background:#251713;border-radius:75% 12% 70% 20% } .gg-el-cactus-v139 .mustache::before{ content:"";position:absolute;right:11px;width:15px;height:7px;background:#251713;border-radius:12% 75% 20% 70%;transform:rotate(8deg) } .gg-el-cactus-v139 .mustache::after{ content:"";position:absolute;left:11px;width:15px;height:7px;background:#251713;border-radius:75% 12% 70% 20%;transform:rotate(-8deg) } .gg-el-cactus-v139 .spines{ position:absolute;width:3px;height:3px;border-radius:50%;background:#d6d0ab;box-shadow: 8px 9px #d6d0ab,-6px 18px #d6d0ab,11px 28px #d6d0ab,-7px 39px #d6d0ab,5px 51px #d6d0ab } .gg-el-cactus-v139 .spines.s1{left:43px;top:52px}.gg-el-cactus-v139 .spines.s2{left:22px;top:72px}.gg-el-cactus-v139 .spines.s3{right:20px;top:75px} /* v139 — Magic Wand avatar-room tool */ .gg-magic-unlock-v139{z-index:2147483647!important} .room-avatar.room-avatar-exact.gg-magic-invisible-v139 > svg{ opacity:0!important; transition:opacity .28s ease!important; } .gg-magic-sparkles-v139{ position:absolute;inset:-8%;z-index:2147482500!important;pointer-events:none;overflow:visible } .gg-magic-sparkles-v139 i{ position:absolute;left:var(--x);top:var(--y);font-style:normal;color:#f8da6c; font-size:clamp(14px,4vw,28px);opacity:0;text-shadow:0 0 8px #fff1a7; } .gg-magic-sparkles-v139.play i{ animation:ggMagicSparkV139 1.5s ease-out var(--d) forwards } @keyframes ggMagicSparkV139{ 0%{opacity:0;transform:scale(.2) rotate(0)} 25%{opacity:1} 100%{opacity:0;transform:translateY(-42px) scale(1.5) rotate(180deg)} } /* v140 — rare Blood Eclipse in Night scene */ .room-scene-window-v055[data-scene="night"].gg-red-eclipse-v140 .room-scene-visual-v055::after{ content:""!important; display:block!important; position:absolute!important; left:68%!important; top:25%!important; width:72px!important; height:72px!important; border-radius:50%!important; background: radial-gradient(circle at 39% 34%,#ff7b69 0 5%,#d62f2f 17%,#8e1119 54%,#43070d 78%,#160306 100%)!important; box-shadow: 0 0 8px #ff3b32, 0 0 22px rgba(220,30,32,.85), 0 0 48px rgba(155,8,18,.58)!important; transform:translate(-50%,-50%)!important; animation:ggBloodMoonPulseV140 2.4s ease-in-out infinite alternate!important; z-index:7!important; opacity:1!important; } .room-scene-window-v055[data-scene="night"].gg-red-eclipse-v140 .room-scene-visual-v055{ filter:sepia(.12) saturate(1.18) brightness(.88)!important; } @keyframes ggBloodMoonPulseV140{ from{filter:brightness(.88);box-shadow:0 0 8px #ff3b32,0 0 22px rgba(220,30,32,.72),0 0 42px rgba(155,8,18,.45)} to{filter:brightness(1.15);box-shadow:0 0 12px #ff554c,0 0 31px rgba(230,35,37,.92),0 0 60px rgba(175,8,20,.68)} } /* v141 — definitive visible cape layers */ #capeBackLayerV141, #capeFrontLayerV141{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #capeBackLayerV141 .gg-cape-back-v141, #capeFrontLayerV141 .gg-cape-front-v141{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #capeBackLayerV141 .gg-cape-back-v141 path, #capeFrontLayerV141 .gg-cape-front-v141 path, #capeFrontLayerV141 .gg-cape-front-v141 circle{ visibility:visible!important; opacity:1!important; } /* v142 — Friends sits above the Avatar Room box, compact and separate. */ #roomFriendsV131{ position:relative!important; z-index:40!important; margin:8px 0 10px!important; } #roomFriendsV131.is-collapsed-v131{ width:max-content!important; max-width:165px!important; } /* v142 — self-sweeping animated magic broom */ .v142-magic-broom{ position:relative; display:block; width:112px; height:126px; transform-origin:50% 88%; animation:ggMagicBroomSweepV142 3.4s ease-in-out infinite; filter:drop-shadow(0 7px 5px rgba(0,0,0,.32)); } .v142-magic-broom .handle{ position:absolute; left:56px; top:0; width:10px; height:94px; border-radius:8px; background:linear-gradient(90deg,#69401f,#a66a31 48%,#5e381d); border:2px solid #3b2417; transform:rotate(23deg); transform-origin:50% 100%; } .v142-magic-broom .binding{ position:absolute; left:42px; bottom:29px; width:34px; height:13px; border-radius:8px; background:#7d2831; border:3px solid #35171a; transform:rotate(6deg); z-index:3; } .v142-magic-broom .bristles{ position:absolute; left:25px; bottom:0; width:70px; height:43px; border-radius:12px 12px 33px 33px; background: repeating-linear-gradient(95deg,#9b6b32 0 5px,#c18a42 6px 10px,#805426 11px 14px); border:3px solid #5a3b20; transform:skewX(-8deg); } .v142-magic-broom .spark{ position:absolute; font-style:normal; color:#f6d86f; text-shadow:0 0 7px #fff0a8; animation:ggBroomSparkV142 1.6s ease-in-out infinite; } .v142-magic-broom .spark.s1{left:10px;top:42px} .v142-magic-broom .spark.s2{right:7px;top:64px;animation-delay:.7s} .v142-magic-broom .dust{ position:absolute; bottom:7px; width:10px;height:7px;border-radius:50%; background:rgba(197,177,143,.5); filter:blur(2px); animation:ggBroomDustV142 1.15s ease-out infinite; } .v142-magic-broom .dust.d1{left:12px} .v142-magic-broom .dust.d2{left:2px;animation-delay:.3s} .v142-magic-broom .dust.d3{right:3px;animation-delay:.6s} @keyframes ggMagicBroomSweepV142{ 0%,100%{transform:translateX(-15px) rotate(-4deg)} 48%{transform:translateX(18px) rotate(5deg)} 54%{transform:translateX(14px) rotate(2deg)} } @keyframes ggBroomSparkV142{ 0%,100%{opacity:.2;transform:scale(.6) rotate(0)} 50%{opacity:1;transform:translateY(-10px) scale(1.25) rotate(90deg)} } @keyframes ggBroomDustV142{ 0%{opacity:.65;transform:translate(0,0) scale(.6)} 100%{opacity:0;transform:translate(-22px,-6px) scale(1.7)} } .gg-broom-unlock-v142{z-index:2147483647!important} /* v143 — page is Home; compact level lives inside room bottom-right */ .room-level-card, .room-level-bar, .room-progress-card, #roomLevelGaugeV054{ /* leave legacy pieces alone unless specifically duplicated elsewhere */ } #avatarRoom .gg-room-level-v143{ position:absolute; right:10px; bottom:10px; z-index:2147481500; width:112px; padding:6px 8px; border-radius:11px; background:rgba(18,14,21,.84); border:1px solid rgba(215,176,91,.42); color:#fff; box-shadow:0 5px 14px rgba(0,0,0,.28); pointer-events:none; font-size:9px; } #avatarRoom .gg-room-level-v143 span, #avatarRoom .gg-room-level-v143 b{display:block} #avatarRoom .gg-room-level-v143 span{font-weight:900;font-size:10px} #avatarRoom .gg-room-level-v143 b{margin-top:3px;color:#c9c1cc;font-size:8px} #avatarRoom .gg-room-level-v143>div{ height:5px;margin-top:4px;border-radius:999px;background:#322b36;overflow:hidden } #avatarRoom .gg-room-level-v143>div i{ display:block;height:100%;width:0;border-radius:inherit;background:#d7b05b } /* v143 — sound/reset are icon buttons INSIDE Home top-right */ #avatarRoom .gg-room-corner-tools-v143{ position:absolute; top:8px; right:8px; z-index:2147483500; display:flex; gap:5px; pointer-events:auto } #avatarRoom .gg-room-corner-tools-v143 button{ width:34px;height:34px; padding:0;border-radius:50%; border:1px solid rgba(255,255,255,.16); background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%); color:#181818; display:grid;place-items:center; font-size:16px; line-height:1; box-shadow:0 5px 12px rgba(0,0,0,.25) ;} /* Old status bar now only communicates save state, no large controls */ #roomStatusBarV060{ min-height:0!important; } #roomStatusBarV060 .room-save-state-v060{ font-size:10px!important; } /* v143 guaranteed cape visibility */ #wardrobeExtraLayer .gg-cape-visible-v143{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #wardrobeExtraLayer .gg-cape-visible-v143 path, #wardrobeExtraLayer .gg-cape-visible-v143 circle{ opacity:1!important; visibility:visible!important; } /* v144 — center Home heading and remove header level card */ #roomReferenceHeadV054{ display:flex!important; justify-content:center!important; align-items:center!important; text-align:center!important; } #roomReferenceHeadV054 h1{ width:100%!important; text-align:center!important; margin-inline:auto!important; } #roomReferenceHeadV054 .room-level-gauge-v054{display:none!important} /* v144 — compact Home top-right tool row */ #avatarRoom .gg-room-tools-v144{ display:flex!important; flex-wrap:nowrap!important; gap:4px!important; right:7px!important; top:7px!important; } #avatarRoom .gg-room-tools-v144 button{ width:31px!important;height:31px!important;font-size:14px!important; } #avatarRoom.gg-room-locked-v144{ outline:2px solid rgba(215,176,91,.35); outline-offset:-3px; } /* hide old lock/random UI if legacy markup survives */ .room-random-tools-v057,#roomLockPanelV057,#roomLocksToggleV057{display:none!important} /* shared search UI */ .gg-avatar-search-v144, .gg-room-search-v144{ position:absolute; z-index:2147483550; left:10px;right:10px;top:56px; max-height:min(68vh,520px); padding:12px; border-radius:16px; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%); border:1px solid rgba(215,176,91,.5); box-shadow:0 18px 45px rgba(0,0,0,.52); overflow:hidden; color:#181818;} .gg-avatar-search-v144[hidden], .gg-room-search-v144[hidden]{display:none!important} .gg-search-head-v144{display:flex;align-items:center;justify-content:space-between;gap:10px} .gg-search-head-v144 strong{color:#f5e7bd;font-size:13px} .gg-search-head-v144 button{width:30px;height:30px;border:0;border-radius:50%;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;} .gg-search-input-v144{ margin-top:8px;display:flex;align-items:center;gap:7px; padding:8px 10px;border-radius:11px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid #3c3242 ;color:#181818;} .gg-search-input-v144 input{ flex:1;min-width:0;border:0;outline:0;background:transparent;color:#fff;font-size:13px } .gg-search-results-v144{ margin-top:9px;display:grid;gap:6px;max-height:380px;overflow:auto } .gg-search-results-v144 button{ display:flex;align-items:center;justify-content:space-between;gap:12px; width:100%;padding:9px 10px;border:1px solid #3b303f;border-radius:10px; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;text-align:left ;} .gg-search-results-v144 button b{font-size:12px} .gg-search-results-v144 button span{font-size:9px;color:#bcb2c1} .gg-search-empty-v144{color:#bbb1bf;font-size:11px;line-height:1.45;padding:8px 2px} /* Avatar search panel lives in the preview card. */ .avatar-preview-card{position:relative} .gg-avatar-search-btn-v144{font-size:18px!important} /* v144 — Open Curtains window frame */ .room-scene-window-v055[data-frame="openCurtains"]{ overflow:visible!important; } .room-scene-window-v055[data-frame="openCurtains"] .room-window-frame-v055{ border:7px solid #31231f!important; box-shadow:inset 0 0 0 3px #8d6946,0 6px 13px rgba(0,0,0,.35)!important; } .room-scene-window-v055[data-frame="openCurtains"]::before, .room-scene-window-v055[data-frame="openCurtains"]::after{ content:""!important; position:absolute!important; top:-10px!important;bottom:-18px!important; width:32%!important; z-index:12!important; pointer-events:none!important; background: linear-gradient(90deg,#3a1620,#7d273a 34%,#4c1929 60%,#8c3045 82%,#35131d)!important; box-shadow:inset 0 0 0 3px rgba(26,10,15,.28),0 6px 12px rgba(0,0,0,.32)!important; } .room-scene-window-v055[data-frame="openCurtains"]::before{ left:-24%!important; clip-path:polygon(0 0,100% 5%,82% 48%,100% 100%,0 96%)!important; } .room-scene-window-v055[data-frame="openCurtains"]::after{ right:-24%!important; clip-path:polygon(0 5%,100% 0,100% 96%,0 100%,18% 48%)!important; } /* v144 — El Cactus: chunkier, rounder, more cartoon-like */ .gg-el-cactus-v139{ width:104px!important;height:136px!important; filter:drop-shadow(0 7px 4px rgba(0,0,0,.28)); } .gg-el-cactus-v139 .cactus-main{ left:33px!important;width:39px!important;height:99px!important; border-radius:48% 48% 28px 28px!important; background:linear-gradient(90deg,#237448,#58b76d 48%,#287d4d)!important; border-width:5px!important; } .gg-el-cactus-v139 .cactus-arm{ width:30px!important;height:51px!important;border-width:5px!important;background:#48a861!important } .gg-el-cactus-v139 .cactus-arm.left{left:8px!important;bottom:35px!important;transform:rotate(-13deg)!important} .gg-el-cactus-v139 .cactus-arm.right{right:7px!important;bottom:42px!important;transform:rotate(12deg)!important} .gg-el-cactus-v139 .sombrero{ top:7px!important;width:90px!important;height:21px!important;border-width:4px!important; background:#efbd48!important } .gg-el-cactus-v139 .sombrero i{ width:47px!important;height:31px!important;background:#f5c852!important } .gg-el-cactus-v139 .face{ left:34px!important;top:44px!important;width:38px!important;height:37px!important } .gg-el-cactus-v139 .eye{ width:8px!important;height:11px!important;background:#111!important; box-shadow:inset 2px 2px #fff!important } .gg-el-cactus-v139 .mustache{ top:19px!important;width:18px!important;height:8px!important } .gg-el-cactus-v139::after{ content:"";position:absolute;left:50%;bottom:16px;width:12px;height:8px; transform:translateX(-50%);border-bottom:4px solid #174c32;border-radius:50% } /* v144 Pixel Censor outfit */ .gg-pixel-censor-v144{filter:drop-shadow(0 4px 3px rgba(0,0,0,.32))} .gg-avatar-speech-v115[data-kind="censor"]{ font-family:monospace!important; border-color:#d7b05b!important; background:#171319!important; letter-spacing:.04em!important; } /* v144 cape is forced visible inside the proven Shirt layer */ #shirtLayer .gg-cape-v144, #shirtLayer .gg-cape-v144 *{ display:inline!important;visibility:visible!important;opacity:1!important;pointer-events:none!important } /* v145 — right-side vertical Home HUD */ #avatarRoom .gg-room-tools-v145{ position:absolute!important; right:7px!important; top:8px!important; left:auto!important; bottom:auto!important; display:flex!important; flex-direction:column!important; align-items:center!important; gap:5px!important; z-index:2147483500!important; } #avatarRoom .gg-room-tools-v145 button{ width:32px!important; height:32px!important; min-width:32px!important; padding:0!important; border-radius:50%!important; } #avatarRoom #ggRoomEyeV145.active{ color:#f7d873!important; border-color:#d7b05b!important; background:#312619!important; box-shadow:0 0 12px rgba(215,176,91,.55)!important; } /* Eye clean-view hides Home HUD elements but never the eye button. */ #avatarRoom.gg-clean-view-v145 #ggRoomLevelV143, #avatarRoom.gg-clean-view-v145 #roomMoodGaugeV065, #avatarRoom.gg-clean-view-v145 #ggSideDoorV111, #avatarRoom.gg-clean-view-v145 #ggRoomHelpV109, #avatarRoom.gg-clean-view-v145 #ggGameHelpV131, #avatarRoom.gg-clean-view-v145 .gg-room-tools-v145 button:not(#ggRoomEyeV145){ display:none!important; } #avatarRoom.gg-clean-view-v145 .gg-room-tools-v145{ display:flex!important; } /* v145 Fire Hydrant persistent foam */ .room-avatar.room-avatar-exact .gg-hydrant-foam-v145{ position:absolute; inset:3% -5% 0; z-index:2147482800!important; pointer-events:none; opacity:0; transition:opacity .25s ease; } .room-avatar.room-avatar-exact .gg-hydrant-foam-v145.covered{ opacity:1; } .gg-hydrant-foam-v145 i{ position:absolute; left:var(--x);top:var(--y); width:var(--s);height:var(--s); transform:translate(-50%,-50%); border-radius:50%; background:radial-gradient(circle at 35% 30%,#fff 0 25%,#f2f2f2 48%,#dcdcdc 72%,#bcbcbc 100%); border:1px solid rgba(175,175,175,.55); box-shadow:0 2px 4px rgba(0,0,0,.16),inset -2px -2px 4px rgba(0,0,0,.08); } .gg-hydrant-foam-v145.spraying i{ animation:ggFoamPulseV145 .38s ease-in-out infinite alternate; animation-delay:calc(var(--i) * -0.025s); } .gg-hydrant-foam-v145 b{ position:absolute; color:#fff; font-size:48px; line-height:.2; text-shadow:0 0 7px #fff; opacity:.8; animation:ggFoamBlastV145 .85s ease-out forwards; } .gg-hydrant-foam-v145.dusting{ animation:ggFoamDustOffV145 .7s ease-in forwards; } @keyframes ggFoamPulseV145{ from{transform:translate(-50%,-50%) scale(.92)} to{transform:translate(-50%,-50%) scale(1.09)} } @keyframes ggFoamBlastV145{ from{opacity:.9;transform:translate(-70px,20px) scale(.3)} to{opacity:0;transform:translate(30px,-15px) scale(1.7)} } @keyframes ggFoamDustOffV145{ to{opacity:0;filter:blur(5px);transform:translateX(40px)} } /* v145 authoritative visible cape artwork */ #wardrobeExtraLayer{ overflow:visible!important; } #wardrobeExtraLayer .gg-cape-v145, #wardrobeExtraLayer .gg-cape-v145 *{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } /* Search is now a normal main Avatar Studio icon next to Wardrobe. */ #categoryLoop [data-category="search"] svg{ fill:none!important; stroke:currentColor!important; stroke-width:3!important; stroke-linecap:round!important; } /* v146 — Search belongs in main Home category row, not right HUD */ #avatarRoom #ggRoomSearchBtnV144{display:none!important} [data-room-category="search"] b{font-size:18px!important} /* Full lock includes the scene/window itself. */ #avatarRoom.gg-room-full-lock-v146 #roomSceneWindowV055, #avatarRoom.gg-room-full-lock-v146 #roomPotLayerV055, #avatarRoom.gg-room-full-lock-v146 #roomFloorDecorV061, #avatarRoom.gg-room-full-lock-v146 #roomWallDecorV061, #avatarRoom.gg-room-full-lock-v146 #roomDecorLayerV059{ pointer-events:none!important; } /* Fire Hydrant foam remains strictly clipped to avatar silhouette/container. */ .room-avatar.room-avatar-exact .gg-hydrant-foam-v145{ inset:4% 4% 2%!important; overflow:hidden!important; border-radius:42% 42% 28% 28%!important; contain:paint!important; } .gg-hydrant-foam-v145.gg-foam-active-v146 i{ animation:ggFoamBoilV146 .52s ease-in-out infinite alternate!important; } .gg-hydrant-foam-v145.gg-foam-active-v146::before, .gg-hydrant-foam-v145.gg-foam-active-v146::after{ content:""; position:absolute; left:8%;right:8%; height:38%; border-radius:50%; background: radial-gradient(circle at 15% 35%,#fff 0 6px,transparent 7px), radial-gradient(circle at 38% 65%,#fff 0 10px,transparent 11px), radial-gradient(circle at 62% 30%,#f7f7f7 0 8px,transparent 9px), radial-gradient(circle at 82% 68%,#fff 0 12px,transparent 13px), rgba(245,245,245,.78); filter:blur(.3px); opacity:.9; animation:ggFoamCloudV146 .65s ease-in-out infinite alternate; } .gg-hydrant-foam-v145.gg-foam-active-v146::before{top:14%} .gg-hydrant-foam-v145.gg-foam-active-v146::after{bottom:10%;animation-delay:.22s} @keyframes ggFoamBoilV146{ from{transform:translate(-50%,-50%) scale(.93)} to{transform:translate(-50%,-52%) scale(1.12)} } @keyframes ggFoamCloudV146{ from{transform:translateY(3px) scale(.96)} to{transform:translateY(-5px) scale(1.04)} } /* Definitive top-level cape and pipe visibility */ #ggTopCapeLayerV146, #ggTopCapeLayerV146 *, #headAccessory .gg-wizard-pipe-v146, #headAccessory .gg-wizard-pipe-v146 *{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } /* v147 — Underwater fish face the direction they swim (left -> right). */ .room-scene-window-v055[data-scene="underwater"] .room-scene-visual-v055::before{ transform:scaleX(-1); transform-origin:center; animation:ggFishSwimV147 7s linear infinite!important; } @keyframes ggFishSwimV147{ from{transform:translateX(0) scaleX(-1)} to{transform:translateX(220%) scaleX(-1)} } /* v147 — Giant Eye pupil movement uses transform offsets so movement is unmistakable. */ .room-scene-window-v055[data-scene="giantEye"] .room-scene-visual-v055::after{ left:50%!important; top:50%!important; animation:ggEyePupilMoveV147 7.2s ease-in-out infinite!important; will-change:transform; } @keyframes ggEyePupilMoveV147{ 0%,8%,100%{transform:translate(-50%,-50%) translate(0,0) scale(1)} 18%,28%{transform:translate(-50%,-50%) translate(-32px,-12px) scale(1.03)} 38%,48%{transform:translate(-50%,-50%) translate(34px,-7px) scale(.98)} 58%,68%{transform:translate(-50%,-50%) translate(18px,27px) scale(1.02)} 78%,88%{transform:translate(-50%,-50%) translate(-20px,22px) scale(1)} } /* v147 — El Cactus proportions: smaller arms and sombrero seated on head. */ .gg-el-cactus-v139 .cactus-arm{ width:21px!important; height:37px!important; border-width:4px!important; } .gg-el-cactus-v139 .cactus-arm.left{ left:14px!important; bottom:37px!important; transform:rotate(-8deg)!important; } .gg-el-cactus-v139 .cactus-arm.right{ right:13px!important; bottom:42px!important; transform:rotate(8deg)!important; } .gg-el-cactus-v139 .cactus-arm.left::before, .gg-el-cactus-v139 .cactus-arm.right::before{ width:13px!important; height:18px!important; top:-7px!important; border-width:4px!important; } .gg-el-cactus-v139 .sombrero{ top:25px!important; width:78px!important; height:18px!important; } .gg-el-cactus-v139 .sombrero i{ width:42px!important; height:24px!important; bottom:6px!important; } .gg-el-cactus-v139 .face{ top:51px!important; } /* v147 — Make Up adds soft blush on both cheeks. */ .room-avatar.room-avatar-exact .gg-makeup-blush-v147{ position:absolute; left:50%; top:42.5%; width:46%; height:18%; transform:translate(-50%,-50%); z-index:2147481900!important; pointer-events:none; opacity:0; } .gg-makeup-blush-v147.show{opacity:1;animation:ggMakeupBlushInV147 .4s ease-out} .gg-makeup-blush-v147 i{ position:absolute; top:50%; width:31px; height:16px; border-radius:50%; background:radial-gradient(ellipse,rgba(245,91,126,.62) 0 35%,rgba(245,91,126,.28) 55%,transparent 75%); filter:blur(1.5px); } .gg-makeup-blush-v147 .left{left:7%} .gg-makeup-blush-v147 .right{right:7%} @keyframes ggMakeupBlushInV147{ from{opacity:0;transform:translate(-50%,-50%) scale(.75)} to{opacity:1;transform:translate(-50%,-50%) scale(1)} } /* v147 — dramatic long temporary eyelashes. */ .room-avatar.room-avatar-exact .gg-makeup-lashes-v147{ position:absolute; left:50%; top:37.5%; width:43%; height:13%; transform:translate(-50%,-50%); z-index:2147482100!important; pointer-events:none; opacity:0; } .gg-makeup-lashes-v147.show{opacity:1;animation:ggMakeupLashPopV147 .36s ease-out} .gg-makeup-lashes-v147 i{ position:absolute; top:42%; width:42%; height:15px; border-top:4px solid #181116; border-radius:50% 50% 0 0; } .gg-makeup-lashes-v147 .left{left:0;transform:rotate(-4deg)} .gg-makeup-lashes-v147 .right{right:0;transform:scaleX(-1) rotate(-4deg)} .gg-makeup-lashes-v147 i::before, .gg-makeup-lashes-v147 i::after{ content:""; position:absolute; top:-12px; width:3px; height:17px; border-radius:99px; background:#181116; transform-origin:bottom; } .gg-makeup-lashes-v147 i::before{ left:22%; transform:rotate(-24deg); box-shadow:12px 1px 0 #181116,24px 3px 0 #181116; } .gg-makeup-lashes-v147 i::after{ right:5%; height:21px; transform:rotate(32deg); } @keyframes ggMakeupLashPopV147{ from{opacity:0;transform:translate(-50%,-50%) scale(.7)} to{opacity:1;transform:translate(-50%,-50%) scale(1)} } /* v148 — ensure cape option buttons visibly respond */ #optionLoop [data-option="wear:lightCape"].selected, #optionLoop [data-option="wear:darkCape"].selected{ box-shadow:0 0 0 2px #d7b05b,0 0 16px rgba(215,176,91,.48)!important; border-color:#d7b05b!important; } /* latest cape art always visible */ #ggTopCapeLayerV146, #ggTopCapeLayerV146 .gg-cape-v146, #ggTopCapeLayerV146 .gg-cape-v146 *{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } /* v149 — Wizard Pipe always top-level and visible */ #ggWizardPipeLayerV149, #ggWizardPipeLayerV149 *, .gg-wizard-pipe-v149, .gg-wizard-pipe-v149 *{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } /* v149 — Giant Eye: disable pseudo pupil; real pupil moves as an element. */ .room-scene-window-v055[data-scene="giantEye"] .room-scene-visual-v055::after{ content:none!important; display:none!important; } .room-scene-window-v055 .gg-eye-pupil-v149{ position:absolute; left:50%; top:50%; width:72px; height:72px; transform:translate(-50%,-50%); border-radius:50%; z-index:14; pointer-events:none; background: radial-gradient(circle at 43% 38%, #fff 0 5%, #0a090a 7% 51%, #3b2214 53% 67%, #0c0807 69% 100%); box-shadow:0 0 16px rgba(0,0,0,.72); animation:ggEyeTrackV149 7.4s ease-in-out infinite; will-change:transform; } @keyframes ggEyeTrackV149{ 0%,8%,100%{transform:translate(-50%,-50%) translate(0,0)} 16%,26%{transform:translate(-50%,-50%) translate(-34px,-16px)} 34%,44%{transform:translate(-50%,-50%) translate(37px,-9px)} 52%,62%{transform:translate(-50%,-50%) translate(25px,27px)} 70%,80%{transform:translate(-50%,-50%) translate(-27px,24px)} 88%,94%{transform:translate(-50%,-50%) translate(0,-21px)} } /* v149 — Open Curtains are part of the window frame and never draggable/movable. */ .room-scene-window-v055[data-frame="openCurtains"], .room-scene-window-v055.gg-open-curtains-static-v149{ position:absolute!important; transform:none!important; } .room-scene-window-v055[data-frame="openCurtains"]::before, .room-scene-window-v055[data-frame="openCurtains"]::after{ animation:none!important; transition:none!important; transform:none!important; } .room-scene-window-v055[data-frame="openCurtains"]::before{ left:-24%!important; } .room-scene-window-v055[data-frame="openCurtains"]::after{ right:-24%!important; } /* v149 — Search panels/results forced visible and readable */ .gg-avatar-search-v144:not([hidden]), .gg-room-search-v144:not([hidden]){ display:block!important; visibility:visible!important; opacity:1!important; } .gg-search-results-v144{ display:grid!important; visibility:visible!important; opacity:1!important; } .gg-search-results-v144 button{ display:flex!important; visibility:visible!important; opacity:1!important; } /* v151 — clear visual state for whole-room lock */ #avatarRoom #ggRoomLockAllV144.active{ color:#f5d56d!important; border-color:#d7b05b!important; background:#332716!important; box-shadow:0 0 12px rgba(215,176,91,.5)!important; } #avatarRoom.gg-room-full-lock-v151 #roomSceneWindowV055, #avatarRoom.gg-room-full-lock-v151 #roomPotLayerV055, #avatarRoom.gg-room-full-lock-v151 #roomFloorDecorV061, #avatarRoom.gg-room-full-lock-v151 #roomWallDecorV061, #avatarRoom.gg-room-full-lock-v151 #roomDecorLayerV059{ cursor:not-allowed!important; } /* v151 — immediate Avatar Studio cosmetic unlock notification */ .gg-wizard-studio-notice-v151{ position:fixed; left:50%; top:max(18px,env(safe-area-inset-top)); transform:translate(-50%,-18px) scale(.96); z-index:2147483647; width:min(calc(100% - 28px),430px); padding:13px 15px; border-radius:17px; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%); border:1px solid rgba(215,176,91,.75); box-shadow:0 16px 42px rgba(0,0,0,.5),0 0 28px rgba(215,176,91,.18); color:#181818; text-align:center; opacity:0; visibility:hidden; pointer-events:none; } .gg-wizard-studio-notice-v151 b, .gg-wizard-studio-notice-v151 span{ display:block; } .gg-wizard-studio-notice-v151 b{ font-size:14px; color:#f3d16f; } .gg-wizard-studio-notice-v151 span{ margin-top:5px; font-size:11px; line-height:1.4; color:#eee4cf; } .gg-wizard-studio-notice-v151.show{ visibility:visible; animation:ggWizardStudioNoticeV151 4.2s ease forwards; } @keyframes ggWizardStudioNoticeV151{ 0%{opacity:0;transform:translate(-50%,-18px) scale(.96)} 8%,82%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-12px) scale(.98)} } /* v152 — true censor pixels */ .gg-pixel-censor-v152, .gg-pixel-censor-v152 rect{ shape-rendering:crispEdges!important; } /* v152 — makeup lowered onto eyes/cheeks */ .room-avatar.room-avatar-exact .gg-makeup-blush-v147{top:49.5%!important} .room-avatar.room-avatar-exact .gg-makeup-lashes-v147{top:43.8%!important} /* v152 — guaranteed visible Wizard themed accessories */ #ggWizardAccessoryLayerV152, #ggWizardAccessoryLayerV152 *, .gg-wizard-wand-v152, .gg-wizard-scarf-v152, .gg-wizard-pipe-v152{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } .gg-wizard-wand-v152{filter:drop-shadow(0 0 7px rgba(244,220,121,.7))} /* v153 — makeup placement correction */ .room-avatar.room-avatar-exact .gg-makeup-lashes-v147{ top:46.5%!important; } .room-avatar.room-avatar-exact .gg-makeup-blush-v147{ top:56.5%!important; } /* v153 — final guaranteed Wizard accessory visibility */ #ggWizardLayerV153, #ggWizardLayerV153 *, .gg-wizard-item-v153{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } .gg-wizard-item-v153.wand{ filter:drop-shadow(0 0 8px rgba(247,223,121,.75)); } /* v155 — final Wizard accessories guaranteed top visibility */ #ggWizardTopLayerV155, #ggWizardTopLayerV155 *, .gg-wizard-v155{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } .gg-wizard-v155.wand{ filter:drop-shadow(0 0 9px rgba(255,226,118,.8)); } /* v155 — Long Tongue always above facial hair */ #ggLongTongueTopV155, #ggLongTongueTopV155 *{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } /* v155 — random-color magic dust invisibility effect */ .room-avatar.room-avatar-exact.gg-magic-invisible-v155 > svg{ opacity:0!important; transition:opacity .25s ease!important; } .gg-magic-dust-v155{ position:absolute; inset:-8%; z-index:2147483000!important; pointer-events:none; } .gg-magic-dust-v155 i{ position:absolute; left:var(--x); top:var(--y); color:var(--c); font-style:normal; font-size:var(--s); opacity:0; text-shadow:0 0 8px var(--c),0 0 16px var(--c); } .gg-magic-dust-v155.play i{ animation:ggMagicDustBurstV155 1.45s ease-out var(--d) forwards; } @keyframes ggMagicDustBurstV155{ 0%{opacity:0;transform:scale(.25) rotate(0)} 22%{opacity:1} 100%{opacity:0;transform:translateY(-46px) translateX(14px) scale(1.65) rotate(200deg)} } /* ================= v156 Living Home UI ================= */ .gg-living-hud-v156{ position:absolute;left:10px;top:72px;z-index:2147482000; display:flex;flex-direction:column;gap:6px; } .gg-living-hud-v156 button{ width:36px;height:36px;border-radius:11px;border:1px solid rgba(215,176,91,.55); background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);font-size:18px;box-shadow:0 5px 14px rgba(0,0,0,.28); color:#181818;} .gg-panel-v156{ position:fixed;inset:0;z-index:2147483600;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%); display:none;align-items:center;justify-content:center;padding:18px; color:#181818;} .gg-panel-v156.show{display:flex} .gg-panel-card-v156{ width:min(94vw,560px);max-height:82vh;overflow:auto;position:relative; border:1px solid rgba(215,176,91,.7);border-radius:22px;padding:20px; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818; box-shadow:0 24px 80px rgba(0,0,0,.65); } .gg-panel-card-v156 h2{text-align:center;margin:0 36px 16px;color:#efd477} .gg-panel-close-v156{position:absolute;right:12px;top:10px;border:0;background:none;color:#fff;font-size:28px} .gg-panel-intro-v156{text-align:center;font-size:13px;opacity:.8} .gg-inventory-grid-v156,.gg-collection-grid-v156{display:grid;grid-template-columns:repeat(2,1fr);gap:10px} .gg-inventory-item-v156,.gg-collection-entry-v156,.gg-personality-grid-v156 button{ min-height:94px;border:1px solid #4a3e50;border-radius:15px;background:#17131c;color:#f8f0df;padding:10px; }.gg-personality-grid-v156 button{ min-height:94px;border:1px solid #4a3e50;border-radius:15px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;padding:10px; } .gg-inventory-item-v156 span,.gg-collection-entry-v156 span,.gg-personality-grid-v156 span{display:block;font-size:28px} .gg-inventory-item-v156 b,.gg-inventory-item-v156 small,.gg-collection-entry-v156 b,.gg-collection-entry-v156 small{display:block} .gg-inventory-item-v156 small,.gg-collection-entry-v156 small{opacity:.7;margin-top:5px} .gg-personality-grid-v156{display:grid;grid-template-columns:repeat(2,1fr);gap:10px} .gg-personality-grid-v156 button.selected{border-color:#e0b95d;box-shadow:0 0 15px rgba(224,185,93,.25)} .gg-trophy-shelf-v156{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:8px} .gg-trophy-v156{min-height:130px;text-align:center;padding:13px;border-radius:12px;border-bottom:8px solid #513d2b;background:#18141c} .gg-trophy-v156 span{font-size:34px;display:block}.gg-trophy-v156 b,.gg-trophy-v156 small{display:block;margin-top:5px} .gg-trophy-v156.locked{filter:grayscale(1);opacity:.5} .gg-collection-tabs-v156{display:flex;gap:6px;overflow:auto;padding-bottom:10px;margin-bottom:10px} .gg-collection-tabs-v156 button{white-space:nowrap;border:1px solid #4b3d50;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:20px;padding:7px 10px;} .gg-collection-tabs-v156 button.selected{border-color:#dfba5f;color:#f4d978} .gg-empty-v156{text-align:center;padding:35px 12px;opacity:.75} /* Discovery reveal */ .gg-discovery-v156{position:fixed;inset:0;z-index:2147483646;pointer-events:none;display:none;background:rgba(0,0,0,.36)} .gg-discovery-v156.play{display:block;animation:ggDiscoverBgV156 4.2s ease forwards} .gg-discovery-card-v156{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%) scale(.4);opacity:0; min-width:250px;text-align:center;padding:22px;border-radius:20px;border:2px solid #e0bb61;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818; box-shadow:0 0 55px rgba(224,187,97,.45);animation:ggDiscoverCardV156 4.2s ease forwards;} .gg-discovery-card-v156 small,.gg-discovery-card-v156 b,.gg-discovery-card-v156 span,.gg-discovery-card-v156 strong{display:block} .gg-discovery-card-v156 small{letter-spacing:3px;color:#e7c76e}.gg-discovery-card-v156 strong{font-size:54px;margin:8px} .gg-discovery-card-v156 span{font-size:12px;opacity:.75;margin-top:6px} .gg-discovery-stars-v156 i{position:absolute;left:50%;top:45%;color:#f3d36d;font-style:normal;opacity:0} .gg-discovery-v156.play .gg-discovery-stars-v156 i{animation:ggStarBurstV156 1.5s ease-out calc(var(--i)*.035s)} @keyframes ggDiscoverBgV156{0%,100%{background:rgba(0,0,0,0)}15%,78%{background:rgba(0,0,0,.58)}} @keyframes ggDiscoverCardV156{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}15%,78%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(.9)}} @keyframes ggStarBurstV156{0%{opacity:1;transform:translate(-50%,-50%) rotate(calc(var(--i)*20deg)) translateY(0)}100%{opacity:0;transform:translate(-50%,-50%) rotate(calc(var(--i)*20deg)) translateY(-190px) scale(1.8)}} /* Night-only secret effects */ .gg-night-secret-v156{position:absolute;inset:0;z-index:1900;pointer-events:none;overflow:hidden} .gg-red-eclipse-v156{position:absolute;width:100px;height:100px;border-radius:50%;right:16%;top:12%;background:#8f1018;box-shadow:0 0 35px #d3252f;opacity:0} .gg-night-secret-v156.play .gg-red-eclipse-v156{animation:ggNightFadeV156 6s ease} .gg-night-eye-v156{position:absolute;right:22%;top:28%;font-size:70px;opacity:0} .gg-night-secret-v156.play .gg-night-eye-v156{animation:ggEyeSecretV156 5s ease} .gg-night-secret-v156.hauntedBooks i{position:absolute;bottom:28%;left:30%;font-size:28px;opacity:0} .gg-night-secret-v156.hauntedBooks i:nth-child(2){left:40%}.gg-night-secret-v156.hauntedBooks i:nth-child(3){left:50%} .gg-night-secret-v156.play.hauntedBooks i{animation:ggBooksSecretV156 4s ease infinite} .gg-ghost-v156{position:absolute;bottom:24%;left:16%;font-size:58px;opacity:0} .gg-night-secret-v156.play .gg-ghost-v156{animation:ggGhostSecretV156 6s ease} .gg-bat-v156{position:absolute;left:-15%;top:20%;font-size:45px} .gg-night-secret-v156.play .gg-bat-v156{animation:ggBatSecretV156 4s ease-in-out forwards} @keyframes ggNightFadeV156{0%,100%{opacity:0}18%,80%{opacity:1}} @keyframes ggEyeSecretV156{0%,100%{opacity:0;transform:scaleY(.05)}20%,45%,70%{opacity:1;transform:scaleY(1)}52%{transform:scaleY(.05)}} @keyframes ggBooksSecretV156{0%,100%{opacity:0;transform:translateY(0) rotate(0)}25%,75%{opacity:1}50%{transform:translateY(-55px) rotate(12deg)}} @keyframes ggGhostSecretV156{0%,100%{opacity:0;transform:translateY(20px)}20%,75%{opacity:.85}55%{transform:translateY(-45px)}} @keyframes ggBatSecretV156{0%{left:-15%;top:30%;transform:rotate(-15deg)}45%{left:45%;top:12%;transform:rotate(15deg)}100%{left:110%;top:27%;transform:rotate(-10deg)}} /* v157 Wizard hard render */ .gg-wizard-hard-v157{ display:inline!important;visibility:visible!important;opacity:1!important;pointer-events:none!important; } .gg-wand-hard-v157{filter:drop-shadow(0 0 10px rgba(255,229,113,.85))} /* v157 Magic Wand invisibility */ .room-avatar.room-avatar-exact.gg-wizard-invisible-v157 > svg{ opacity:0!important; transition:opacity .22s ease!important; } .gg-magic-burst-v157{ position:absolute;inset:-15%;z-index:2147483500;pointer-events:none;overflow:visible; } .gg-magic-burst-v157 i{ position:absolute;left:var(--x);top:var(--y);color:var(--c);font-style:normal;font-size:16px; opacity:0;text-shadow:0 0 8px var(--c),0 0 16px var(--c); } .gg-magic-burst-v157.play i{animation:ggMagicBurstV157 1.25s ease-out var(--d) forwards} @keyframes ggMagicBurstV157{ 0%{opacity:0;transform:translate(0,0) scale(.25) rotate(0)} 18%{opacity:1} 100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.7) rotate(190deg)} } /* v158 — disable stale Wizard layers from older builds */ #ggWizardTopLayerV155, #ggWizardLayerV153, #ggWizardAccessoryLayerV152, #ggWizardPipeLayerV149, #ggTopCapeLayerV146 .gg-wizard-pipe-v146{ display:none!important; } /* v158 — canonical Wizard accessories on first accessory layer */ #wizardAccessoryLayerV158{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; overflow:visible!important; } #wizardAccessoryLayerV158 .gg-wizard-v158, #wizardAccessoryLayerV158 .gg-wizard-v158 *{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #wizardAccessoryLayerV158 .wand{ filter:drop-shadow(0 0 7px rgba(246,223,119,.65)); } /* v159 — Backpack/Trophy/Personality/Collection icons rest at 25% opacity */ .gg-living-hud-v156{ opacity:1!important; } .gg-living-hud-v156 button{ opacity:.25!important; transition:opacity .18s ease,transform .18s ease!important; } .gg-living-hud-v156 button:hover, .gg-living-hud-v156 button:focus-visible, .gg-living-hud-v156 button:active{ opacity:1!important; transform:scale(1.04); } /* v159 — canonical Wizard layers */ #wizardBodyLayerV159, #wizardFrontLayerV159{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; overflow:visible!important; } #wizardBodyLayerV159 .gg-wizard-v159, #wizardFrontLayerV159 .gg-wizard-v159, #wizardBodyLayerV159 .gg-wizard-v159 *, #wizardFrontLayerV159 .gg-wizard-v159 *{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #wizardFrontLayerV159 .wand{ filter:drop-shadow(0 0 7px rgba(246,223,122,.7)); } /* v159 — true see-through Magic Wand vanish */ .room-avatar.room-avatar-exact.gg-wizard-see-through-v159{ opacity:.28!important; filter:saturate(.8) brightness(1.15); transition:opacity .65s ease,filter .65s ease!important; } .room-avatar.room-avatar-exact.gg-wizard-gone-v159{ opacity:0!important; transition:opacity .28s ease!important; } /* v160 — Eye / clean-view also hides Living Home HUD icons */ #avatarRoom.gg-clean-view-v145 #ggLivingHudV156{ display:none!important; } /* v161 — Wizard art is intentionally the absolute top avatar layer */ #wizardTopLayerV161, #wizardTopLayerV161 *, .gg-wizard-v161{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #wizardTopLayerV161 .wand{filter:drop-shadow(0 0 10px rgba(255,226,113,.85))} /* v161 — room utility icons rest at 25% alpha */ #ggRoomLockV135, #ggRoomRandomV135, #ggRoomUndoV135, #ggRoomSoundV135, #ggRoomEyeV145, #ggRoomLockV141, #ggRoomDiceV141, #ggRoomUndoV141, #ggRoomSoundV142{ opacity:.25!important; transition:opacity .18s ease,transform .18s ease!important; } #ggRoomLockV135:hover,#ggRoomRandomV135:hover,#ggRoomUndoV135:hover,#ggRoomSoundV135:hover,#ggRoomEyeV145:hover, #ggRoomLockV141:hover,#ggRoomDiceV141:hover,#ggRoomUndoV141:hover,#ggRoomSoundV142:hover, #ggRoomLockV135:active,#ggRoomRandomV135:active,#ggRoomUndoV135:active,#ggRoomSoundV135:active,#ggRoomEyeV145:active, #ggRoomLockV141:active,#ggRoomDiceV141:active,#ggRoomUndoV141:active,#ggRoomSoundV142:active{ opacity:1!important; } /* v162 — Wizard HTML overlay; independent from SVG layer cleanup */ .avatar-preview-card{position:relative!important} .gg-wizard-html-overlay-v162{ position:absolute;inset:0;z-index:2147482500;pointer-events:none;display:none; } .gg-wizard-html-overlay-v162.show{display:block} /* Wand sits beside right side of body */ .gg-v162-wand{position:absolute;right:15%;top:50%;width:48px;height:145px;transform:rotate(9deg)} .gg-v162-wand .stick{position:absolute;left:19px;bottom:0;width:11px;height:120px;border-radius:8px;background:linear-gradient(90deg,#4b2b17,#8b542a,#3b2315);border:2px solid #23140d} .gg-v162-wand .gem{position:absolute;left:13px;top:8px;width:24px;height:24px;border-radius:50%;background:#ffe88d;border:3px solid #8e6925;box-shadow:0 0 14px #ffe88d} .gg-v162-wand b{position:absolute;left:2px;top:-7px;font-size:45px;color:#fff0a3;text-shadow:0 0 12px #ffd95f;animation:ggWandSparkV162 1.4s ease-in-out infinite} /* Pipe at mouth */ .gg-v162-pipe{position:absolute;left:53%;top:46%;width:105px;height:65px} .gg-v162-pipe .stem{position:absolute;left:0;top:25px;width:63px;height:10px;border-radius:8px;background:#7a4727;transform:rotate(10deg);border:2px solid #352014} .gg-v162-pipe .bowl{position:absolute;right:7px;top:17px;width:34px;height:30px;border-radius:8px 8px 15px 15px;background:#8e5231;border:3px solid #2d1b15} .gg-v162-pipe .smoke{position:absolute;right:0;top:-6px;color:#eee;font-size:29px;font-weight:400;opacity:.7;animation:ggPipeSmokeV162 2s ease-in-out infinite} .gg-v162-pipe .s2{right:16px;top:-16px;animation-delay:.7s} /* Scarf around neck/chest */ .gg-v162-scarf{position:absolute;left:50%;top:57%;width:150px;height:135px;transform:translateX(-50%)} .gg-v162-scarf .neck{position:absolute;left:19px;top:0;width:112px;height:34px;border-radius:48% 48% 18px 18px;background:repeating-linear-gradient(90deg,#a61f37 0 24px,#171318 24px 43px);border:3px solid #120e11} .gg-v162-scarf .tail{position:absolute;top:26px;width:36px;height:96px;background:repeating-linear-gradient(0deg,#a61f37 0 22px,#171318 22px 39px);border:3px solid #120e11} .gg-v162-scarf .t1{left:28px;transform:rotate(7deg)} .gg-v162-scarf .t2{right:28px;transform:rotate(-7deg)} /* New unique extras */ .gg-v162-orbit{position:absolute;left:50%;top:19%;width:150px;height:90px;transform:translateX(-50%);border:3px solid rgba(98,226,255,.85);border-radius:50%;animation:ggOrbitV162 3s linear infinite} .gg-v162-orbit i{position:absolute;inset:14px;border:2px solid rgba(190,107,255,.7);border-radius:50%} .gg-v162-orbit b{position:absolute;color:#ffe46e;font-size:18px}.gg-v162-orbit b:nth-of-type(1){left:4px;top:30px}.gg-v162-orbit b:nth-of-type(2){right:10px;top:15px}.gg-v162-orbit b:nth-of-type(3){left:63px;bottom:-8px} .gg-v162-runes i{position:absolute;color:#8ef7ff;font-size:25px;text-shadow:0 0 9px #5bf3ff;animation:ggRuneFloatV162 2.4s ease-in-out infinite} .gg-v162-runes i:nth-child(1){left:26%;top:25%}.gg-v162-runes i:nth-child(2){right:23%;top:32%;animation-delay:.4s}.gg-v162-runes i:nth-child(3){left:20%;top:60%;animation-delay:.8s}.gg-v162-runes i:nth-child(4){right:20%;top:66%;animation-delay:1.2s} .gg-v162-batwings i{position:absolute;top:42%;width:120px;height:105px;background:linear-gradient(135deg,#1a0922,#8f24c7);clip-path:polygon(100% 15%,62% 22%,48% 0,34% 29%,0 24%,22% 57%,3% 83%,43% 76%,52% 100%,71% 68%,100% 74%);filter:drop-shadow(0 0 8px #ad37ff);animation:ggWingPulseV162 1.8s ease-in-out infinite} .gg-v162-batwings .l{left:7%;transform:scaleX(-1)} .gg-v162-batwings .r{right:7%} /* animated outfits */ .gg-outfit-v162.starRobe .stars{fill:#f6e57b;animation:ggStarsTwinkleV162 1.6s ease-in-out infinite alternate} .gg-outfit-v162.emberJacket .ember-line{filter:drop-shadow(0 0 5px #ff6e31);animation:ggEmberPulseV162 1.1s ease-in-out infinite alternate} .gg-outfit-v162.glitchSuit .glitch-bars{fill:#61eaff;animation:ggGlitchV162 .9s steps(2,end) infinite} @keyframes ggWandSparkV162{50%{transform:scale(1.22) rotate(45deg);opacity:.65}} @keyframes ggPipeSmokeV162{0%{opacity:0;transform:translateY(10px) scale(.7)}50%{opacity:.8}100%{opacity:0;transform:translateY(-22px) translateX(8px) scale(1.2)}} @keyframes ggOrbitV162{to{transform:translateX(-50%) rotate(360deg)}} @keyframes ggRuneFloatV162{50%{transform:translateY(-12px) rotate(8deg);opacity:.55}} @keyframes ggWingPulseV162{50%{filter:drop-shadow(0 0 16px #cb58ff);opacity:.85}} @keyframes ggStarsTwinkleV162{to{opacity:.35;filter:drop-shadow(0 0 4px #fff4ac)}} @keyframes ggEmberPulseV162{to{stroke:#ffd05a;filter:drop-shadow(0 0 9px #ff8a32)}} @keyframes ggGlitchV162{0%{transform:translateX(-4px)}50%{transform:translateX(7px)}100%{transform:translateX(-2px)}} /* v162 — exact room utility icon fade to 25% */ #avatarRoom #ggRoomLockAllV144, #avatarRoom #roomRandomizeBtnV055, #avatarRoom #ggUndoRoomV144, #avatarRoom #roomSoundToggleV060, #avatarRoom #ggRoomEyeV145{ opacity:.25!important; transition:opacity .18s ease,transform .18s ease!important; } #avatarRoom #ggRoomLockAllV144:hover, #avatarRoom #roomRandomizeBtnV055:hover, #avatarRoom #ggUndoRoomV144:hover, #avatarRoom #roomSoundToggleV060:hover, #avatarRoom #ggRoomEyeV145:hover, #avatarRoom #ggRoomLockAllV144:active, #avatarRoom #roomRandomizeBtnV055:active, #avatarRoom #ggUndoRoomV144:active, #avatarRoom #roomSoundToggleV060:active, #avatarRoom #ggRoomEyeV145:active{ opacity:1!important; } /* v162 — side door twice as tall */ #ggSideDoorV111{ height:clamp(150px,34vh,300px)!important; min-height:150px!important; } /* v163 stable recent cosmetics overlay */ .avatar-stage{position:relative!important} .gg-recent-cosmetic-overlay-v163, .gg-wizard-html-overlay-v162{ position:absolute!important; inset:0!important; pointer-events:none!important; z-index:2147483000!important; display:none; } .gg-recent-cosmetic-overlay-v163.show, .gg-wizard-html-overlay-v162.show{display:block!important} /* Wizard */ .gg-v163-wand{position:absolute;right:13%;top:47%;width:58px;height:155px;transform:rotate(8deg)} .gg-v163-wand .stick{position:absolute;left:24px;bottom:0;width:12px;height:125px;border-radius:8px;background:linear-gradient(90deg,#452814,#8a532a,#3c2415);border:2px solid #21130c} .gg-v163-wand .gem{position:absolute;left:16px;top:8px;width:28px;height:28px;border-radius:50%;background:#ffe88c;border:3px solid #856220;box-shadow:0 0 14px #ffe88c} .gg-v163-wand b{position:absolute;left:2px;top:-10px;color:#fff1a2;font-size:50px;text-shadow:0 0 14px #ffd75f;animation:ggV163Spark 1.2s ease-in-out infinite} .gg-v163-pipe{position:absolute;left:53%;top:43%;width:115px;height:80px} .gg-v163-pipe .stem{position:absolute;left:0;top:38px;width:70px;height:11px;border-radius:8px;background:#814c29;border:2px solid #341f14;transform:rotate(8deg)} .gg-v163-pipe .bowl{position:absolute;right:4px;top:27px;width:38px;height:34px;border-radius:9px 9px 16px 16px;background:#915432;border:3px solid #2a1913} .gg-v163-pipe b{position:absolute;right:5px;top:-4px;color:#eee;font-size:30px;animation:ggV163Smoke 1.8s ease-in-out infinite} .gg-v163-pipe b:last-child{right:24px;top:5px;animation-delay:.7s} .gg-v163-scarf{position:absolute;left:50%;top:53%;width:170px;height:155px;transform:translateX(-50%)} .gg-v163-scarf .neck{position:absolute;left:20px;top:0;width:130px;height:38px;border-radius:50% 50% 18px 18px;background:repeating-linear-gradient(90deg,#ad2039 0 27px,#151216 27px 48px);border:3px solid #100d10} .gg-v163-scarf .tail{position:absolute;top:31px;width:40px;height:110px;background:repeating-linear-gradient(0deg,#ad2039 0 24px,#151216 24px 43px);border:3px solid #100d10} .gg-v163-scarf .t1{left:30px;transform:rotate(6deg)}.gg-v163-scarf .t2{right:30px;transform:rotate(-6deg)} /* New extras */ .gg-v163-wings i{position:absolute;top:39%;width:128px;height:112px;background:linear-gradient(135deg,#17071f,#a52ee2);clip-path:polygon(100% 10%,63% 22%,50% 0,34% 31%,0 23%,22% 58%,3% 85%,43% 77%,52% 100%,72% 67%,100% 75%);filter:drop-shadow(0 0 9px #bd44ff);animation:ggV163Wing 1.7s ease-in-out infinite} .gg-v163-wings .l{left:5%;transform:scaleX(-1)}.gg-v163-wings .r{right:5%} .gg-v163-orbit{position:absolute;left:50%;top:17%;width:165px;height:95px;transform:translateX(-50%);border:3px solid #67e8ff;border-radius:50%;animation:ggV163Orbit 3s linear infinite} .gg-v163-orbit i{position:absolute;inset:15px;border:2px solid #ba72ff;border-radius:50%} .gg-v163-orbit b{position:absolute;color:#ffe66d;font-size:20px}.gg-v163-orbit b:nth-of-type(1){left:2px;top:33px}.gg-v163-orbit b:nth-of-type(2){right:8px;top:16px}.gg-v163-orbit b:nth-of-type(3){left:72px;bottom:-10px} .gg-v163-runes i{position:absolute;color:#8df6ff;font-size:27px;text-shadow:0 0 10px #53efff;animation:ggV163Rune 2.2s ease-in-out infinite} .gg-v163-runes i:nth-child(1){left:24%;top:24%}.gg-v163-runes i:nth-child(2){right:22%;top:30%;animation-delay:.4s}.gg-v163-runes i:nth-child(3){left:18%;top:62%;animation-delay:.8s}.gg-v163-runes i:nth-child(4){right:18%;top:66%;animation-delay:1.2s} /* Stable outfits */ .gg-v163-outfit.starRobe .stars{animation:ggV163Stars 1.4s ease-in-out infinite alternate} .gg-v163-outfit.emberJacket .ember{filter:drop-shadow(0 0 5px #ff6f31);animation:ggV163Ember 1s ease-in-out infinite alternate} .gg-v163-outfit.glitchSuit .glitch{animation:ggV163Glitch .8s steps(2,end) infinite} .gg-v163-outfit.pixel rect{shape-rendering:crispEdges!important} @keyframes ggV163Spark{50%{transform:scale(1.2) rotate(45deg);opacity:.65}} @keyframes ggV163Smoke{0%{opacity:0;transform:translateY(8px)}50%{opacity:.8}100%{opacity:0;transform:translateY(-25px) translateX(8px)}} @keyframes ggV163Wing{50%{opacity:.82;filter:drop-shadow(0 0 17px #cf63ff)}} @keyframes ggV163Orbit{to{transform:translateX(-50%) rotate(360deg)}} @keyframes ggV163Rune{50%{transform:translateY(-13px) rotate(8deg);opacity:.55}} @keyframes ggV163Stars{to{opacity:.38;filter:drop-shadow(0 0 5px #fff2a2)}} @keyframes ggV163Ember{to{stroke:#ffd05b;filter:drop-shadow(0 0 10px #ff8a32)}} @keyframes ggV163Glitch{0%{transform:translateX(-5px)}50%{transform:translateX(7px)}100%{transform:translateX(-2px)}} /* v164 — isolated recent cosmetics: independent of SVG cleanup */ .avatar-stage{position:relative!important} .gg-isolated-cosmetics-v164{ position:absolute!important; inset:0!important; z-index:2147483400!important; pointer-events:none!important; display:none; } .gg-isolated-cosmetics-v164.show{display:block!important} /* Recent outfits occupy lower torso only */ .gg-v164-outfit{position:absolute;left:50%;top:61%;width:44%;height:38%;transform:translateX(-50%);pointer-events:none} .gg-v164-outfit.pixel .mosaic{ position:absolute;left:5%;right:5%;top:2%;height:72%; display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(5,1fr); border:4px solid #161216;background:#161216;gap:1px; } .gg-v164-outfit.pixel .mosaic i{display:block;opacity:var(--o);image-rendering:pixelated} .gg-v164-outfit.star .robe, .gg-v164-outfit.ember .jacket, .gg-v164-outfit.glitch .suit{ position:absolute;inset:0 3% 0; clip-path:polygon(19% 0,81% 0,100% 100%,0 100%); border-radius:10% 10% 4% 4%; } .gg-v164-outfit.star .robe{background:linear-gradient(180deg,#171426,#262046 55%,#11101f)} .gg-v164-outfit.star .stars i{ position:absolute;color:#ffe97a;font-style:normal;font-size:calc(9px + (var(--i) % 4)*2px); left:calc(11% + (var(--i) * 17)%78%);top:calc(6% + (var(--i) * 23)%80%); text-shadow:0 0 7px #fff0a3;animation:ggV164Stars 1.5s ease-in-out infinite alternate; animation-delay:calc(var(--i)*.08s); } .gg-v164-outfit.ember .jacket{background:#251816;border:4px solid #0b0909} .gg-v164-outfit.ember .e{ position:absolute;height:6px;border-radius:9px;background:#ff7438;box-shadow:0 0 7px #ff7438; animation:ggV164Ember 1s ease-in-out infinite alternate; } .gg-v164-outfit.ember .e1{left:20%;top:25%;width:58%}.gg-v164-outfit.ember .e2{left:14%;top:49%;width:72%;animation-delay:.25s}.gg-v164-outfit.ember .e3{left:25%;top:69%;width:51%;animation-delay:.5s} .gg-v164-outfit.glitch .suit{background:#12141a;border:4px solid #08090c} .gg-v164-outfit.glitch i{position:absolute;height:8px;animation:ggV164Glitch .75s steps(2,end) infinite} .gg-v164-outfit.glitch i:nth-child(2){left:13%;top:25%;width:65%;background:#5defff} .gg-v164-outfit.glitch i:nth-child(3){left:37%;top:47%;width:54%;background:#ff50aa} .gg-v164-outfit.glitch i:nth-child(4){left:9%;top:68%;width:72%;background:#8e67ff} /* Wizard */ .gg-v164-wizard.wand{position:absolute;right:12%;top:48%;width:60px;height:160px;transform:rotate(8deg)} .gg-v164-wizard.wand .stick{position:absolute;left:24px;bottom:0;width:12px;height:130px;border-radius:8px;background:linear-gradient(90deg,#442713,#8c552b,#382114);border:2px solid #20120b} .gg-v164-wizard.wand .gem{position:absolute;left:15px;top:8px;width:30px;height:30px;border-radius:50%;background:#ffe989;border:3px solid #80601f;box-shadow:0 0 15px #ffe989} .gg-v164-wizard.wand b{position:absolute;left:0;top:-12px;font-size:52px;color:#fff1a4;text-shadow:0 0 15px #ffd75e;animation:ggV164Spark 1.2s ease-in-out infinite} .gg-v164-wizard.pipe{position:absolute;left:53%;top:43%;width:120px;height:80px} .gg-v164-wizard.pipe .stem{position:absolute;left:0;top:39px;width:72px;height:11px;border-radius:8px;background:#814c29;border:2px solid #341f14;transform:rotate(8deg)} .gg-v164-wizard.pipe .bowl{position:absolute;right:5px;top:27px;width:40px;height:35px;border-radius:9px 9px 17px 17px;background:#925432;border:3px solid #291813} .gg-v164-wizard.pipe b{position:absolute;right:5px;top:-5px;color:#eee;font-size:30px;animation:ggV164Smoke 1.8s ease-in-out infinite} .gg-v164-wizard.pipe b:last-child{right:25px;top:5px;animation-delay:.7s} .gg-v164-wizard.scarf{position:absolute;left:50%;top:53%;width:175px;height:160px;transform:translateX(-50%)} .gg-v164-wizard.scarf .neck{position:absolute;left:20px;top:0;width:135px;height:39px;border-radius:50% 50% 18px 18px;background:repeating-linear-gradient(90deg,#ae2039 0 28px,#151216 28px 49px);border:3px solid #100d10} .gg-v164-wizard.scarf .tail{position:absolute;top:31px;width:41px;height:113px;background:repeating-linear-gradient(0deg,#ae2039 0 25px,#151216 25px 44px);border:3px solid #100d10} .gg-v164-wizard.scarf .t1{left:30px;transform:rotate(6deg)}.gg-v164-wizard.scarf .t2{right:30px;transform:rotate(-6deg)} /* Unique recent accessories */ .gg-v164-wings i{position:absolute;top:39%;width:130px;height:113px;background:linear-gradient(135deg,#18071f,#a82ee2);clip-path:polygon(100% 10%,63% 22%,50% 0,34% 31%,0 23%,22% 58%,3% 85%,43% 77%,52% 100%,72% 67%,100% 75%);filter:drop-shadow(0 0 10px #bd44ff);animation:ggV164Wing 1.7s ease-in-out infinite} .gg-v164-wings .l{left:4%;transform:scaleX(-1)}.gg-v164-wings .r{right:4%} .gg-v164-orbit{position:absolute;left:50%;top:17%;width:170px;height:98px;transform:translateX(-50%);border:3px solid #67e8ff;border-radius:50%;animation:ggV164Orbit 3s linear infinite} .gg-v164-orbit i{position:absolute;inset:15px;border:2px solid #bb73ff;border-radius:50%} .gg-v164-orbit b{position:absolute;color:#ffe76c;font-size:21px}.gg-v164-orbit b:nth-of-type(1){left:2px;top:34px}.gg-v164-orbit b:nth-of-type(2){right:8px;top:16px}.gg-v164-orbit b:nth-of-type(3){left:75px;bottom:-10px} .gg-v164-runes i{position:absolute;color:#8df6ff;font-size:28px;text-shadow:0 0 10px #53efff;animation:ggV164Rune 2.2s ease-in-out infinite} .gg-v164-runes i:nth-child(1){left:23%;top:24%}.gg-v164-runes i:nth-child(2){right:21%;top:30%;animation-delay:.4s}.gg-v164-runes i:nth-child(3){left:17%;top:62%;animation-delay:.8s}.gg-v164-runes i:nth-child(4){right:17%;top:66%;animation-delay:1.2s} @keyframes ggV164Stars{to{opacity:.35;transform:scale(.7)}} @keyframes ggV164Ember{to{background:#ffd05a;box-shadow:0 0 12px #ff8a32}} @keyframes ggV164Glitch{0%{transform:translateX(-6px)}50%{transform:translateX(8px)}100%{transform:translateX(-2px)}} @keyframes ggV164Spark{50%{transform:scale(1.22) rotate(45deg);opacity:.62}} @keyframes ggV164Smoke{0%{opacity:0;transform:translateY(8px)}50%{opacity:.8}100%{opacity:0;transform:translateY(-26px) translateX(9px)}} @keyframes ggV164Wing{50%{opacity:.82;filter:drop-shadow(0 0 18px #d066ff)}} @keyframes ggV164Orbit{to{transform:translateX(-50%) rotate(360deg)}} @keyframes ggV164Rune{50%{transform:translateY(-13px) rotate(8deg);opacity:.55}} /* v165 — recent cosmetics are embedded in avatarSvg; external overlay retired */ #ggIsolatedCosmeticsV164, #ggRecentCosmeticOverlayV163, #ggWizardHtmlOverlayV162{ display:none!important; } /* v165 permanent embedded recent-cosmetic layer */ #ggRecentSvgLayerV165, #ggRecentSvgLayerV165 *{ display:inline!important; visibility:visible!important; opacity:1; pointer-events:none!important; } #ggRecentSvgLayerV165 .gg-v165-outfit.star .stars{ animation:ggV165Stars 1.5s ease-in-out infinite alternate; } #ggRecentSvgLayerV165 .gg-v165-outfit.ember .ember-lines{ animation:ggV165Ember 1.05s ease-in-out infinite alternate; filter:drop-shadow(0 0 5px #ff7133); } #ggRecentSvgLayerV165 .gg-v165-outfit.glitch .glitch-bars{ animation:ggV165Glitch .8s steps(2,end) infinite; } #ggRecentSvgLayerV165 .gg-v165-wizard.wand .wand-star{ animation:ggV165Wand 1.25s ease-in-out infinite; transform-origin:319px 248px; filter:drop-shadow(0 0 7px #ffe377); } #ggRecentSvgLayerV165 .gg-v165-wizard.pipe .smoke{ animation:ggV165Smoke 1.8s ease-in-out infinite alternate; } #ggRecentSvgLayerV165 .gg-v165-extra.wings{ animation:ggV165Wings 1.7s ease-in-out infinite alternate; transform-origin:210px 350px; filter:drop-shadow(0 0 7px #b940f2); } #ggRecentSvgLayerV165 .gg-v165-extra.orbit{ animation:ggV165Orbit 3s linear infinite; transform-origin:210px 126px; } #ggRecentSvgLayerV165 .gg-v165-extra.runes text{ font-size:25px; font-weight:800; filter:drop-shadow(0 0 6px #53efff); animation:ggV165Rune 2s ease-in-out infinite alternate; } @keyframes ggV165Stars{to{opacity:.35}} @keyframes ggV165Ember{to{stroke:#ffd05b;filter:drop-shadow(0 0 10px #ff8a32)}} @keyframes ggV165Glitch{0%{transform:translateX(-5px)}50%{transform:translateX(7px)}100%{transform:translateX(-2px)}} @keyframes ggV165Wand{50%{transform:scale(1.15) rotate(18deg);opacity:.68}} @keyframes ggV165Smoke{to{transform:translateY(-8px);opacity:.35}} @keyframes ggV165Wings{to{transform:scaleX(1.035);opacity:.82}} @keyframes ggV165Orbit{to{transform:rotate(360deg)}} @keyframes ggV165Rune{to{opacity:.45}} /* v166 — native recent outfit animations */ #shirtLayer .gg-native-v166.starRobe .stars{ animation:ggNativeStarsV166 1.5s ease-in-out infinite alternate; } #shirtLayer .gg-native-v166.emberJacket .ember-lines{ animation:ggNativeEmberV166 1.05s ease-in-out infinite alternate; filter:drop-shadow(0 0 5px #ff7133); } #shirtLayer .gg-native-v166.glitchSuit .glitch-bars{ animation:ggNativeGlitchV166 .8s steps(2,end) infinite; } @keyframes ggNativeStarsV166{to{opacity:.35}} @keyframes ggNativeEmberV166{to{stroke:#ffd05b;filter:drop-shadow(0 0 10px #ff8a32)}} @keyframes ggNativeGlitchV166{0%{transform:translateX(-5px)}50%{transform:translateX(7px)}100%{transform:translateX(-2px)}} /* v167 — rarity backgrounds for Avatar Studio + Home */ /* Common */ #optionLoop [data-rarity="common"], [data-room-option][data-rarity="common"]{ background:linear-gradient(180deg,#242129,#19171d)!important; border-color:#4b4650!important; } /* Uncommon */ #optionLoop [data-rarity="uncommon"], [data-room-option][data-rarity="uncommon"]{ background:linear-gradient(180deg,#173824,#10281b)!important; border-color:#4f9d69!important; } /* Rare */ #optionLoop [data-rarity="rare"], [data-room-option][data-rarity="rare"]{ background:linear-gradient(180deg,#173247,#102435)!important; border-color:#4f93c4!important; } /* Epic */ #optionLoop [data-rarity="epic"], [data-room-option][data-rarity="epic"]{ background:linear-gradient(180deg,#3a1c4d,#271336)!important; border-color:#9b63c4!important; } /* Legendary */ #optionLoop [data-rarity="legendary"], [data-room-option][data-rarity="legendary"]{ background:linear-gradient(180deg,#5a3510,#382107)!important; border-color:#d79f3c!important; box-shadow:inset 0 0 12px rgba(215,159,60,.12)!important; } /* Selected always remains obvious */ #optionLoop [data-option].selected, [data-room-option].selected, [data-room-option].active{ outline:2px solid #d7b05b!important; outline-offset:1px!important; box-shadow:0 0 14px rgba(215,176,91,.42)!important; } /* Small rarity dot */ #optionLoop [data-rarity]::after, [data-room-option][data-rarity]::after{ content:""; position:absolute; right:5px; top:5px; width:7px; height:7px; border-radius:50%; background:#777; box-shadow:0 0 5px currentColor; } #optionLoop [data-rarity="common"]::after,[data-room-option][data-rarity="common"]::after{background:#8a858d} #optionLoop [data-rarity="uncommon"]::after,[data-room-option][data-rarity="uncommon"]::after{background:#55b878} #optionLoop [data-rarity="rare"]::after,[data-room-option][data-rarity="rare"]::after{background:#56a7df} #optionLoop [data-rarity="epic"]::after,[data-room-option][data-rarity="epic"]::after{background:#b078dc} #optionLoop [data-rarity="legendary"]::after,[data-room-option][data-rarity="legendary"]::after{background:#e0ad4d} #optionLoop [data-option], [data-room-option]{ position:relative!important; } /* v168 — native Wizard visuals */ #wardrobeExtraLayer .gg-native-wizard-v168, #wardrobeExtraLayer .gg-native-wizard-v168 *{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #wardrobeExtraLayer .gg-native-wizard-v168.wand .wand-star{ transform-origin:315px 246px; animation:ggWizardStarV168 1.25s ease-in-out infinite; filter:drop-shadow(0 0 8px #ffe377); } #wardrobeExtraLayer .gg-native-wizard-v168.pipe .smoke{ animation:ggWizardSmokeV168 1.8s ease-in-out infinite alternate; } @keyframes ggWizardStarV168{ 50%{transform:scale(1.16) rotate(18deg);opacity:.7} } @keyframes ggWizardSmokeV168{ to{transform:translateY(-8px);opacity:.35} } /* v168 — Avatar Studio rarity cards, explicitly targeting actual option buttons */ #optionLoop button.gg-rarity-card-v168, #optionLoop .gg-rarity-card-v168{ position:relative!important; overflow:visible!important; border-width:2px!important; } #optionLoop .gg-rarity-card-v168[data-rarity="common"]{ background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; border-color:#57515d!important; color:#181818;} #optionLoop .gg-rarity-card-v168[data-rarity="uncommon"]{ background:linear-gradient(180deg,#1c452b,#10281b)!important; border-color:#58b878!important; box-shadow:inset 0 0 14px rgba(88,184,120,.12)!important; } #optionLoop .gg-rarity-card-v168[data-rarity="rare"]{ background:linear-gradient(180deg,#1b4260,#102435)!important; border-color:#5aa8df!important; box-shadow:inset 0 0 14px rgba(90,168,223,.14)!important; } #optionLoop .gg-rarity-card-v168[data-rarity="epic"]{ background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; border-color:#b174db!important; box-shadow:none!important; color:#181818;} #optionLoop .gg-rarity-card-v168[data-rarity="legendary"]{ background:linear-gradient(180deg,#694012,#382107)!important; border-color:#e0ad4d!important; box-shadow:inset 0 0 16px rgba(224,173,77,.18)!important; } /* rarity badge label for Studio */ #optionLoop .gg-rarity-card-v168::before{ position:absolute; left:5px; top:5px; z-index:8; padding:2px 5px; border-radius:7px; font-size:7px; font-weight:900; letter-spacing:.04em; text-transform:uppercase; color:#fff; background:rgba(0,0,0,.38); } #optionLoop .gg-rarity-card-v168[data-rarity="common"]::before{content:"Common"} #optionLoop .gg-rarity-card-v168[data-rarity="uncommon"]::before{content:"Uncommon";color:#8ce4a8} #optionLoop .gg-rarity-card-v168[data-rarity="rare"]::before{content:"Rare";color:#87cfff} #optionLoop .gg-rarity-card-v168[data-rarity="epic"]::before{content:"Epic";color:#d6a0ff} #optionLoop .gg-rarity-card-v168[data-rarity="legendary"]::before{content:"Legendary";color:#ffd678} /* selected item still overrides rarity clearly */ #optionLoop .gg-rarity-card-v168.selected{ outline:3px solid #d7b05b!important; outline-offset:1px!important; box-shadow:0 0 16px rgba(215,176,91,.55)!important; } /* v169 — native cape visibility */ #wardrobeExtraLayer .gg-native-cape-v169, #wardrobeExtraLayer .gg-native-cape-v169 *{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } /* v169 — Wizard Pipe absolute top layer */ #wizardPipeTopLayerV169, #wizardPipeTopLayerV169 *, .gg-pipe-top-v169{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #wizardPipeTopLayerV169 .smoke{ animation:ggPipeSmokeTopV169 1.8s ease-in-out infinite alternate; } @keyframes ggPipeSmokeTopV169{ to{transform:translateY(-8px);opacity:.35} } /* Selected cape button remains gold */ #optionLoop [data-option="wear:lightCape"].selected, #optionLoop [data-option="wear:darkCape"].selected{ outline:3px solid #d7b05b!important; outline-offset:1px!important; box-shadow:0 0 16px rgba(215,176,91,.55)!important; } /* ========================================================= v170 — Avatar Studio rarity colors + rarity dots Targets the REAL dynamic .option-chip buttons. ========================================================= */ #optionLoop .option-chip.gg-rarity-v170, #optionLoop [data-option].gg-rarity-v170{ position:relative!important; overflow:visible!important; border-width:2px!important; transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease, background .15s ease!important; } /* COMMON — gray */ #optionLoop .gg-rarity-v170[data-rarity="common"]{ background:linear-gradient(180deg,#2b2930 0%,#19181d 100%)!important; border-color:#625d67!important; box-shadow:inset 0 0 12px rgba(150,145,155,.08)!important; } /* UNCOMMON — green */ #optionLoop .gg-rarity-v170[data-rarity="uncommon"]{ background:linear-gradient(180deg,#214e31 0%,#10291b 100%)!important; border-color:#62c47f!important; box-shadow:inset 0 0 15px rgba(98,196,127,.14)!important; } /* RARE — blue */ #optionLoop .gg-rarity-v170[data-rarity="rare"]{ background:linear-gradient(180deg,#214c6b 0%,#102638 100%)!important; border-color:#63b5ee!important; box-shadow:inset 0 0 16px rgba(99,181,238,.16)!important; } /* EPIC — purple */ #optionLoop .gg-rarity-v170[data-rarity="epic"]{ background:linear-gradient(180deg,#54286e 0%,#2c153c 100%)!important; border-color:#c07cec!important; box-shadow:inset 0 0 17px rgba(192,124,236,.18)!important; } /* LEGENDARY — gold */ #optionLoop .gg-rarity-v170[data-rarity="legendary"]{ background:linear-gradient(180deg,#79501a 0%,#3e2709 100%)!important; border-color:#efbd55!important; box-shadow: inset 0 0 18px rgba(239,189,85,.20), 0 0 8px rgba(239,189,85,.10)!important; } /* Rarity dot — always visible in upper-right */ #optionLoop .gg-rarity-v170::after{ content:""!important; position:absolute!important; right:6px!important; top:6px!important; width:9px!important; height:9px!important; border-radius:50%!important; z-index:50!important; border:1px solid rgba(255,255,255,.7)!important; box-shadow:0 0 7px currentColor!important; pointer-events:none!important; } #optionLoop .gg-rarity-v170[data-rarity="common"]::after{ background:#a7a2ac!important; color:#a7a2ac!important; } #optionLoop .gg-rarity-v170[data-rarity="uncommon"]::after{ background:#68d58b!important; color:#68d58b!important; } #optionLoop .gg-rarity-v170[data-rarity="rare"]::after{ background:#69bdff!important; color:#69bdff!important; } #optionLoop .gg-rarity-v170[data-rarity="epic"]::after{ background:#ca8cff!important; color:#ca8cff!important; } #optionLoop .gg-rarity-v170[data-rarity="legendary"]::after{ background:#ffd064!important; color:#ffd064!important; } /* Small rarity label along bottom of every Avatar Studio card */ #optionLoop .gg-rarity-v170::before{ content:attr(data-rarity-label)!important; position:absolute!important; left:50%!important; bottom:3px!important; transform:translateX(-50%)!important; z-index:49!important; padding:1px 5px!important; border-radius:6px!important; background:rgba(0,0,0,.48)!important; color:#ddd!important; font-size:6.5px!important; line-height:1.25!important; font-weight:900!important; letter-spacing:.04em!important; text-transform:uppercase!important; pointer-events:none!important; } #optionLoop .gg-rarity-v170[data-rarity="uncommon"]::before{color:#9aefb0!important} #optionLoop .gg-rarity-v170[data-rarity="rare"]::before{color:#9dd7ff!important} #optionLoop .gg-rarity-v170[data-rarity="epic"]::before{color:#ddb2ff!important} #optionLoop .gg-rarity-v170[data-rarity="legendary"]::before{color:#ffdc82!important} /* Selected state remains unmistakably gold, regardless of rarity */ #optionLoop .gg-rarity-v170.selected{ outline:3px solid #f0c85f!important; outline-offset:2px!important; box-shadow: 0 0 0 1px rgba(255,236,170,.65), 0 0 18px rgba(240,200,95,.62)!important; transform:translateY(-1px)!important; } /* Keep actual item icon/name readable over rarity background */ #optionLoop .gg-rarity-v170 svg, #optionLoop .gg-rarity-v170 > span{ position:relative!important; z-index:5!important; } /* v171 — Flower Extra always above hair, masks, facial hair and normal accessories */ #flowerFrontLayerV171, #flowerFrontLayerV171 *, .gg-flower-front-v171{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #flowerFrontLayerV171{ filter:drop-shadow(0 2px 3px rgba(0,0,0,.35)); } /* v172 — Wizard Pipe absolutely above every avatar face layer */ #wizardPipeFrontLayerV172, #wizardPipeFrontLayerV172 *, .gg-pipe-front-v172{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #wizardPipeFrontLayerV172 .smoke{ animation:ggPipeFrontSmokeV172 1.8s ease-in-out infinite alternate; } @keyframes ggPipeFrontSmokeV172{ to{transform:translateY(-9px);opacity:.35} } /* ========================================================= v172 — Avatar Studio rarity, matching Home/Room visual style ========================================================= */ #optionLoop .option-chip.gg-studio-rarity-v172{ position:relative!important; border-width:2px!important; overflow:visible!important; } /* Common */ #optionLoop .gg-studio-rarity-v172[data-rarity="common"]{ background:linear-gradient(180deg,#242129,#19171d)!important; border-color:#4b4650!important; } /* Uncommon */ #optionLoop .gg-studio-rarity-v172[data-rarity="uncommon"]{ background:linear-gradient(180deg,#173824,#10281b)!important; border-color:#4f9d69!important; } /* Rare */ #optionLoop .gg-studio-rarity-v172[data-rarity="rare"]{ background:linear-gradient(180deg,#173247,#102435)!important; border-color:#4f93c4!important; } /* Epic */ #optionLoop .gg-studio-rarity-v172[data-rarity="epic"]{ background:linear-gradient(180deg,#3a1c4d,#271336)!important; border-color:#9b63c4!important; } /* Legendary */ #optionLoop .gg-studio-rarity-v172[data-rarity="legendary"]{ background:linear-gradient(180deg,#5a3510,#382107)!important; border-color:#d79f3c!important; box-shadow:inset 0 0 12px rgba(215,159,60,.12)!important; } /* Rarity dot, same idea as Home */ #optionLoop .gg-studio-rarity-v172::after{ content:""!important; position:absolute!important; right:6px!important; top:6px!important; width:8px!important; height:8px!important; border-radius:50%!important; z-index:30!important; border:1px solid rgba(255,255,255,.55)!important; pointer-events:none!important; } #optionLoop .gg-studio-rarity-v172[data-rarity="common"]::after{ background:#8a858d!important; box-shadow:0 0 5px #8a858d!important; } #optionLoop .gg-studio-rarity-v172[data-rarity="uncommon"]::after{ background:#55b878!important; box-shadow:0 0 6px #55b878!important; } #optionLoop .gg-studio-rarity-v172[data-rarity="rare"]::after{ background:#56a7df!important; box-shadow:0 0 6px #56a7df!important; } #optionLoop .gg-studio-rarity-v172[data-rarity="epic"]::after{ background:#b078dc!important; box-shadow:0 0 6px #b078dc!important; } #optionLoop .gg-studio-rarity-v172[data-rarity="legendary"]::after{ background:#e0ad4d!important; box-shadow:0 0 7px #e0ad4d!important; } /* Selected item remains gold and obvious */ #optionLoop .gg-studio-rarity-v172.selected{ outline:3px solid #d7b05b!important; outline-offset:1px!important; box-shadow:0 0 15px rgba(215,176,91,.5)!important; } /* v173 new cosmetic visuals */ #shirtLayer .gg-night-armor-v173, #wardrobeExtraLayer .gg-cross-necklace-v173, #ggFaceCosmeticLayerV173, #ggFaceCosmeticLayerV173 *{ display:inline!important; visibility:visible!important; opacity:1; pointer-events:none!important; } #shirtLayer .gg-night-armor-v173{ filter:drop-shadow(0 3px 4px rgba(0,0,0,.42)); } /* Actual DOM rarity dot, not pseudo-element */ .gg-rarity-dot-v173{ position:absolute!important; right:6px!important; top:6px!important; width:10px!important; height:10px!important; border-radius:50%!important; z-index:9999!important; border:1px solid rgba(255,255,255,.75)!important; pointer-events:none!important; } /* Gold selected state remains above rarity background */ #optionLoop .option-chip.selected{ outline:3px solid #d7b05b!important; outline-offset:1px!important; box-shadow:0 0 16px rgba(215,176,91,.58)!important; } /* v174 — Flower and Wizard Pipe absolute front layers */ #flowerAbsoluteFrontV174, #flowerAbsoluteFrontV174 *, #wizardPipeAbsoluteFrontV174, #wizardPipeAbsoluteFrontV174 *{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #flowerAbsoluteFrontV174{ filter:drop-shadow(0 2px 3px rgba(0,0,0,.35)); } #wizardPipeAbsoluteFrontV174 .smoke{ animation:ggPipeSmokeV174 1.8s ease-in-out infinite alternate; } @keyframes ggPipeSmokeV174{ to{transform:translateY(-9px);opacity:.35} } /* ========================================================= v175 — BAKED Avatar Studio rarity The colors are inline on the actual option buttons. ========================================================= */ #optionLoop .gg-rarity-baked-v175{ position:relative!important; overflow:visible!important; box-sizing:border-box!important; } /* Rarity dot is a real DOM child */ #optionLoop .gg-rarity-dot-v175{ position:absolute!important; right:6px!important; top:6px!important; width:10px!important; height:10px!important; border-radius:50%!important; z-index:100!important; border:1px solid rgba(255,255,255,.82)!important; pointer-events:none!important; } /* NEW unlock exclamation */ #optionLoop .gg-new-unlock-v175{ position:absolute!important; left:3px!important; top:-9px!important; z-index:120!important; width:25px!important; height:25px!important; display:grid!important; place-items:center!important; font-style:normal!important; font-size:21px!important; line-height:1!important; filter:drop-shadow(0 2px 3px rgba(0,0,0,.7)) drop-shadow(0 0 5px rgba(255,214,73,.6))!important; animation:ggNewUnlockBounceV175 1.25s ease-in-out infinite!important; pointer-events:none!important; } @keyframes ggNewUnlockBounceV175{ 0%,100%{transform:translateY(0) rotate(-5deg)} 50%{transform:translateY(-5px) rotate(5deg) scale(1.08)} } /* Strongly differentiate each baked rarity even if older Studio CSS remains. */ #optionLoop .gg-rarity-baked-v175[data-rarity="common"]{ color:#ded9e0!important; } #optionLoop .gg-rarity-baked-v175[data-rarity="uncommon"]{ color:#c8f5d4!important; } #optionLoop .gg-rarity-baked-v175[data-rarity="rare"]{ color:#d0ebff!important; } #optionLoop .gg-rarity-baked-v175[data-rarity="epic"]{ color:#ead6ff!important; } #optionLoop .gg-rarity-baked-v175[data-rarity="legendary"]{ color:#ffe6a0!important; } /* Selection still wins with unmistakable gold */ #optionLoop .gg-rarity-baked-v175.selected{ outline:3px solid #f1ca61!important; outline-offset:2px!important; box-shadow:0 0 0 1px rgba(255,243,190,.75),0 0 18px rgba(241,202,97,.68)!important; } /* v175 absolute front layers */ #flowerAbsoluteFrontV174, #flowerAbsoluteFrontV174 *, #wizardPipeAbsoluteFrontV174, #wizardPipeAbsoluteFrontV174 *{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } /* ========================================================== v176 — guaranteed front Wizard Pipe (Studio) ========================================================== */ #ggPipeHtmlFrontV176{ position:absolute!important; inset:0!important; z-index:2147483640!important; pointer-events:none!important; display:none; } #ggPipeHtmlFrontV176.show{display:block!important} .gg-pipe-html-art-v176{ position:absolute; left:53%; top:45%; width:118px; height:86px; transform:translate(-2%,0); } .gg-pipe-html-art-v176 .stem{ position:absolute; left:0; top:39px; width:76px; height:12px; border-radius:9px; background:linear-gradient(180deg,#9a5b31,#694022); border:3px solid #2a1811; transform:rotate(8deg); transform-origin:left center; } .gg-pipe-html-art-v176 .bowl{ position:absolute; left:70px; top:26px; width:42px; height:36px; border-radius:9px 9px 18px 18px; background:linear-gradient(180deg,#a46238,#754326); border:3px solid #25150f; box-shadow:inset 0 -6px 0 rgba(0,0,0,.12); } .gg-pipe-html-art-v176 .smoke{ position:absolute; color:#f2eee9; font-style:normal; font-size:31px; opacity:.8; text-shadow:0 0 5px rgba(255,255,255,.25); animation:ggPipeHtmlSmokeV176 1.8s ease-in-out infinite; } .gg-pipe-html-art-v176 .s1{left:83px;top:-3px} .gg-pipe-html-art-v176 .s2{left:99px;top:-15px;animation-delay:.65s} @keyframes ggPipeHtmlSmokeV176{ 0%{opacity:0;transform:translateY(9px)} 45%{opacity:.85} 100%{opacity:0;transform:translateY(-25px) translateX(8px)} } /* Room avatar top pipe overlay */ .room-avatar.room-avatar-exact{position:absolute!important} .gg-room-pipe-front-v176{ position:absolute!important; inset:0!important; z-index:2147483600!important; pointer-events:none!important; } .gg-room-pipe-front-v176 .stem{ position:absolute;left:54%;top:49%;width:26%;height:3.2%; border-radius:8px;background:#7f4b29;border:2px solid #2b1912;transform:rotate(8deg); } .gg-room-pipe-front-v176 .bowl{ position:absolute;left:77%;top:47%;width:15%;height:13%; border-radius:8px 8px 15px 15px;background:#915432;border:2px solid #281711; } .gg-room-pipe-front-v176 b{ position:absolute;left:82%;top:36%;color:#eee;font-size:22px;font-weight:400; animation:ggPipeHtmlSmokeV176 1.8s ease-in-out infinite; } .gg-room-pipe-front-v176 b:last-child{left:88%;top:31%;animation-delay:.65s} /* ========================================================== v176 — shared rarity visuals for Studio + Home A real inner backplate means old backgrounds cannot hide rarity. ========================================================== */ .gg-rarity-shared-v176{ position:relative!important; overflow:visible!important; isolation:isolate!important; } .gg-rarity-plate-v176{ position:absolute!important; inset:2px!important; z-index:-1!important; border:2px solid!important; border-radius:14px!important; pointer-events:none!important; box-sizing:border-box!important; } #optionLoop .gg-rarity-shared-v176 > svg, #optionLoop .gg-rarity-shared-v176 > span, .room-option-chip.gg-rarity-shared-v176 > b, .room-option-chip.gg-rarity-shared-v176 > span{ position:relative!important; z-index:3!important; } .gg-rarity-dot-shared-v176{ position:absolute!important; right:6px!important; top:6px!important; width:10px!important; height:10px!important; border-radius:50%!important; z-index:20!important; border:1px solid rgba(255,255,255,.8)!important; pointer-events:none!important; } .gg-rarity-shared-v176.selected{ outline:3px solid #f1ca61!important; outline-offset:2px!important; box-shadow:0 0 0 1px rgba(255,243,190,.75),0 0 18px rgba(241,202,97,.68)!important; } /* NEW unlock marker, intentionally above the option card */ .gg-new-item-v176{ position:absolute!important; left:2px!important; top:-11px!important; z-index:40!important; font-style:normal!important; font-size:23px!important; line-height:1!important; pointer-events:none!important; filter:drop-shadow(0 2px 3px rgba(0,0,0,.7)) drop-shadow(0 0 5px rgba(255,210,55,.75))!important; animation:ggNewV176 1.15s ease-in-out infinite!important; } @keyframes ggNewV176{ 0%,100%{transform:translateY(0) rotate(-5deg)} 50%{transform:translateY(-5px) rotate(5deg) scale(1.1)} } /* v177 — Wizard Pipe ONLY: viewport-level absolute front plane */ #ggPipeViewportFrontV177{ position:fixed!important; width:0!important; height:0!important; z-index:2147483647!important; pointer-events:none!important; display:none!important; overflow:visible!important; isolation:isolate!important; } #ggPipeViewportFrontV177.show{ display:block!important; } #ggPipeViewportFrontV177 .gg-pipe-v177-art{ position:absolute!important; left:0!important; top:0!important; width:112px!important; height:84px!important; transform:translate(-2px,-7px) scale(var(--gg-pipe-scale-v177,1))!important; transform-origin:0 0!important; z-index:2147483647!important; overflow:visible!important; } #ggPipeViewportFrontV177 .stem{ position:absolute!important; left:0!important; top:7px!important; width:68px!important; height:12px!important; border-radius:9px!important; background:linear-gradient(180deg,#9a5b31,#694022)!important; border:3px solid #2a1811!important; transform:rotate(8deg)!important; transform-origin:left center!important; } #ggPipeViewportFrontV177 .bowl{ position:absolute!important; left:63px!important; top:3px!important; width:40px!important; height:35px!important; border-radius:9px 9px 18px 18px!important; background:linear-gradient(180deg,#a46238,#754326)!important; border:3px solid #25150f!important; box-shadow:inset 0 -6px 0 rgba(0,0,0,.12)!important; } #ggPipeViewportFrontV177 .smoke{ position:absolute!important; color:#f2eee9!important; font-style:normal!important; font-size:30px!important; font-weight:400!important; opacity:.82!important; text-shadow:0 0 5px rgba(255,255,255,.25)!important; animation:ggPipeSmokeV177 1.8s ease-in-out infinite!important; } #ggPipeViewportFrontV177 .s1{left:74px!important;top:-27px!important} #ggPipeViewportFrontV177 .s2{left:91px!important;top:-39px!important;animation-delay:.65s!important} @keyframes ggPipeSmokeV177{ 0%{opacity:0;transform:translateY(9px)} 45%{opacity:.85} 100%{opacity:0;transform:translateY(-25px) translateX(8px)} } /* v178 original anime-inspired cosmetics */ .gg-sunburst-v178,.gg-orange-fighter-v178{filter:drop-shadow(0 3px 3px rgba(0,0,0,.32))} /* v179 native working cosmetics */ .gg-orange-fighter-native-v179,.gg-sunburst-native-v179{ display:inline!important;visibility:visible!important;opacity:1!important; filter:drop-shadow(0 3px 3px rgba(0,0,0,.3)); } /* v180 — Legendary Solar Ascendant Mane */ /* v180 — Goldie's Salon vertical two-level room */ body.gg-salon-page-v180{ min-height:200vh!important; overflow-y:auto!important; scroll-behavior:smooth; background:#09090c; } body.gg-salon-page-v180 #avatarRoom{ position:fixed!important; left:50%!important; top:50%!important; transform:translate(-50%,-50%)!important; width:min(100vw,760px)!important; transition:transform .65s ease,filter .4s ease!important; } /* At lower/start view, wall is intentionally out of sight. */ body.gg-salon-lower-v180 #wallLayer, body.gg-salon-lower-v180 .room-wall, body.gg-salon-lower-v180 [class*="wall-layer"]{ opacity:0!important; pointer-events:none!important; } body.gg-salon-upper-v180 #wallLayer, body.gg-salon-upper-v180 .room-wall, body.gg-salon-upper-v180 [class*="wall-layer"]{ opacity:1!important; } /* Avatar remains back at the lower portion while room view moves upward. */ body.gg-salon-upper-v180 .room-avatar.room-avatar-exact{ transform:translateY(34vh)!important; opacity:.38!important; transition:transform .65s ease,opacity .45s ease!important; } body.gg-salon-lower-v180 .room-avatar.room-avatar-exact{ transition:transform .65s ease,opacity .45s ease!important; } .gg-salon-scroll-edge-v180{ position:fixed!important; left:50%!important; width:min(82vw,620px)!important; height:22px!important; transform:translateX(-50%)!important; z-index:2147483500!important; cursor:pointer!important; border:0!important; border-radius:999px!important; background:linear-gradient(90deg,transparent,rgba(0,0,0,.82),transparent)!important; box-shadow:0 0 16px rgba(0,0,0,.65)!important; } .gg-salon-scroll-edge-v180::after{ content:""!important; position:absolute!important; left:50%!important; top:50%!important; width:46px!important; height:3px!important; transform:translate(-50%,-50%)!important; border-radius:99px!important; background:rgba(215,176,91,.65)!important; } .gg-salon-scroll-edge-v180.top-edge{top:12px!important} .gg-salon-scroll-edge-v180.bottom-edge{bottom:12px!important} body.gg-salon-lower-v180 .bottom-edge{opacity:0!important;pointer-events:none!important} body.gg-salon-upper-v180 .top-edge{opacity:0!important;pointer-events:none!important} /* ========================================================== v181 — Goldie's Salon controlled two-level room. Manual page scrolling is disabled. ========================================================== */ html:has(body.gg-salon-page-v181), body.gg-salon-page-v181{ width:100%!important; height:100%!important; min-height:100%!important; overflow:hidden!important; overscroll-behavior:none!important; touch-action:none!important; background:#09090c!important; } body.gg-salon-page-v181 #avatarRoom{ position:fixed!important; left:50%!important; top:50%!important; width:min(100vw,760px)!important; height:min(100vh,820px)!important; transform:translate(-50%,-50%) translateY(0)!important; transition:transform .72s cubic-bezier(.22,.8,.2,1)!important; overflow:hidden!important; } /* LOWER START VIEW: everything behind the avatar is hidden; only floor remains. */ body.gg-salon-lower-v181 #avatarRoom{ transform:translate(-50%,-50%) translateY(-20vh)!important; } body.gg-salon-lower-v181 #roomSceneWindowV055, body.gg-salon-lower-v181 #wallLayer, body.gg-salon-lower-v181 .room-wall, body.gg-salon-lower-v181 [class*="wall-layer"], body.gg-salon-lower-v181 #roomDecorLayerV059, body.gg-salon-lower-v181 #roomWallItemV061, body.gg-salon-lower-v181 #roomSceneWindowV055, body.gg-salon-lower-v181 .room-scene-window-v055, body.gg-salon-lower-v181 .room-window-frame-v057{ opacity:0!important; visibility:hidden!important; pointer-events:none!important; } /* Make the floor visually fill the starting screen. */ body.gg-salon-lower-v181 #floorLayer, body.gg-salon-lower-v181 .room-floor, body.gg-salon-lower-v181 [class*="floor-layer"]{ transform:scaleY(2.2)!important; transform-origin:center bottom!important; opacity:1!important; } /* UPPER VIEW: reveal normal wall/back room after line is tapped. */ body.gg-salon-upper-v181 #avatarRoom{ transform:translate(-50%,-50%) translateY(22vh)!important; } body.gg-salon-upper-v181 #roomSceneWindowV055, body.gg-salon-upper-v181 #wallLayer, body.gg-salon-upper-v181 .room-wall, body.gg-salon-upper-v181 [class*="wall-layer"], body.gg-salon-upper-v181 #roomDecorLayerV059, body.gg-salon-upper-v181 #roomWallItemV061, body.gg-salon-upper-v181 .room-scene-window-v055, body.gg-salon-upper-v181 .room-window-frame-v057{ opacity:1!important; visibility:visible!important; pointer-events:auto!important; transition:opacity .38s ease .18s!important; } /* Avatar stays visually back/lower while upper room is being inspected. */ body.gg-salon-upper-v181 .room-avatar.room-avatar-exact{ transform:translateY(23vh) scale(.94)!important; opacity:.42!important; transition:transform .72s cubic-bezier(.22,.8,.2,1),opacity .4s ease!important; } body.gg-salon-lower-v181 .room-avatar.room-avatar-exact{ opacity:1!important; transition:transform .72s cubic-bezier(.22,.8,.2,1),opacity .4s ease!important; } /* Navigation lines are the ONLY level controls. */ body.gg-salon-page-v181 .gg-salon-scroll-edge-v180{ position:fixed!important; left:50%!important; width:min(84vw,640px)!important; height:28px!important; transform:translateX(-50%)!important; z-index:2147483500!important; cursor:pointer!important; border:0!important; border-radius:999px!important; background:linear-gradient(90deg,transparent,rgba(0,0,0,.9),transparent)!important; box-shadow:0 0 20px rgba(0,0,0,.75)!important; touch-action:manipulation!important; } body.gg-salon-page-v181 .gg-salon-scroll-edge-v180::after{ content:""!important; position:absolute!important; left:50%!important; top:50%!important; width:58px!important; height:4px!important; transform:translate(-50%,-50%)!important; border-radius:999px!important; background:rgba(215,176,91,.68)!important; } body.gg-salon-page-v181 .top-edge{top:10px!important} body.gg-salon-page-v181 .bottom-edge{bottom:10px!important} body.gg-salon-lower-v181 .bottom-edge{display:none!important} body.gg-salon-upper-v181 .top-edge{display:none!important} /* v181 stronger Solar Mane */ /* ========================================================== v182 — Goldie's Salon editor controls stay beneath room. ========================================================== */ body.gg-salon-page-v181 #avatarRoom{ z-index:120!important; } body.gg-salon-page-v181 #roomControls, body.gg-salon-page-v181 #roomToolbar, body.gg-salon-page-v181 #roomCategoryBar, body.gg-salon-page-v181 #roomOptionLoop, body.gg-salon-page-v181 .room-controls, body.gg-salon-page-v181 .room-toolbar, body.gg-salon-page-v181 .room-category-bar, body.gg-salon-page-v181 .room-options, body.gg-salon-page-v181 .room-editor, body.gg-salon-page-v181 .room-panel{ z-index:40!important; } body.gg-salon-page-v181 .gg-salon-scroll-edge-v180{ z-index:2147483500!important; } /* Both custom spike styles are deliberately much wider/taller than Long Sleek. */ .gg-legendary-hair-v182{ display:inline!important; visibility:visible!important; opacity:1!important; filter:drop-shadow(0 5px 7px rgba(255,190,25,.38)); } /* v183 — Solar hair: raised cap + glow */ .gg-sunburst-v183{ filter: drop-shadow(0 0 3px rgba(255,239,120,.75)) drop-shadow(0 0 10px rgba(255,185,24,.45))!important; } /* ========================================================== v183 — Goldie's Salon independent editor tray Room itself remains non-scrollable. ========================================================== */ body.gg-salon-page-v181 .gg-salon-editor-toggle-v183{ position:fixed!important; left:50%!important; bottom:14px!important; transform:translateX(-50%)!important; z-index:2147483600!important; border:1px solid rgba(215,176,91,.75)!important; border-radius:999px!important; background:rgba(12,12,16,.92)!important; color:#f0cf74!important; padding:10px 18px!important; font-weight:900!important; box-shadow:0 8px 24px rgba(0,0,0,.45)!important; } body.gg-salon-page-v181 .gg-salon-editor-tray-v183{ position:fixed!important; left:50%!important; bottom:0!important; width:min(100vw,760px)!important; max-height:48vh!important; overflow-y:auto!important; overscroll-behavior:contain!important; touch-action:pan-y!important; z-index:2147483550!important; transform:translate(-50%,110%)!important; transition:transform .38s cubic-bezier(.22,.8,.2,1)!important; padding:18px 12px 72px!important; border-radius:22px 22px 0 0!important; background:rgba(13,13,17,.97)!important; box-shadow:0 -12px 30px rgba(0,0,0,.55)!important; } body.gg-salon-page-v181.gg-salon-editor-open-v183 .gg-salon-editor-tray-v183{ transform:translate(-50%,0)!important; } body.gg-salon-page-v181.gg-salon-editor-open-v183 .gg-salon-editor-toggle-v183{ bottom:calc(48vh + 10px)!important; } /* Keep room behind editor tray only when editing, not the other way around. */ body.gg-salon-page-v181.gg-salon-editor-open-v183 #avatarRoom{ z-index:100!important; } body.gg-salon-page-v181 .gg-salon-editor-tray-v183, body.gg-salon-page-v181 .gg-salon-editor-toggle-v183{ pointer-events:auto!important; } /* ========================================================== v184 — native legendary hairs ========================================================== */ .gg-native-sunburst-v184{ display:inline!important; visibility:visible!important; opacity:1!important; filter: drop-shadow(0 0 4px rgba(255,239,120,.78)) drop-shadow(0 0 12px rgba(255,180,20,.42))!important; } /* ========================================================== v184 — Goldie's Salon edit controls popup, not scroll tray ========================================================== */ body.gg-salon-page-v181 .gg-salon-editor-toggle-v183{ position:fixed!important; left:50%!important; bottom:14px!important; transform:translateX(-50%)!important; z-index:2147483600!important; } .gg-salon-editor-popup-v184{ position:fixed!important; inset:0!important; z-index:2147483640!important; display:none!important; place-items:center!important; padding:18px!important; background:rgba(0,0,0,.62)!important; backdrop-filter:blur(5px)!important; touch-action:none!important; } .gg-salon-editor-popup-v184.show{ display:grid!important; } .gg-salon-editor-shell-v184{ width:min(94vw,760px)!important; max-height:86vh!important; overflow:hidden!important; border:1px solid rgba(215,176,91,.5)!important; border-radius:22px!important; background:#111116!important; box-shadow:0 20px 60px rgba(0,0,0,.65)!important; padding:14px!important; } .gg-salon-editor-shell-v184 > header{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; margin-bottom:10px!important; } .gg-salon-editor-shell-v184 > header strong{ color:#f0cf74!important; font-size:16px!important; } #ggSalonEditorCloseV184{ border:0!important; background:#242229!important; color:#fff!important; border-radius:50%!important; width:34px!important; height:34px!important; } #ggSalonEditorBodyV184{ overflow:visible!important; } /* Normal room-edit controls are shown as popup content, not a scrolling page/tray. */ #ggSalonEditorBodyV184 .room-category-wrap-v061, #ggSalonEditorBodyV184 #roomOptionDrawer, #ggSalonEditorBodyV184 #roomEditorActiveLabelV061, #ggSalonEditorBodyV184 #roomSaveNote{ position:relative!important; z-index:1!important; transform:none!important; max-height:none!important; overflow:visible!important; } /* ========================================================== v185 — easier upper return bar ========================================================== */ body.gg-salon-page-v181.gg-salon-upper-v181 .gg-salon-scroll-edge-v180.bottom-edge{ bottom:56px!important; height:88px!important; width:min(90vw,680px)!important; z-index:2147483646!important; pointer-events:auto!important; } body.gg-salon-page-v181.gg-salon-upper-v181 .gg-salon-scroll-edge-v180.bottom-edge::after{ height:8px!important; width:100px!important; } body.gg-salon-page-v181.gg-salon-upper-v181 #ggSalonEditorToggleV183{ bottom:8px!important; z-index:2147483500!important; } /* ========================================================== v185 — working Salon edit popup ========================================================== */ .gg-salon-editor-popup-v185{ position:fixed!important; inset:0!important; z-index:2147483647!important; display:none!important; place-items:center!important; padding:16px!important; background:rgba(0,0,0,.68)!important; backdrop-filter:blur(6px)!important; } .gg-salon-editor-popup-v185.show{ display:grid!important; } .gg-salon-editor-shell-v185{ width:min(94vw,760px)!important; max-height:88vh!important; overflow:hidden!important; border:1px solid rgba(215,176,91,.55)!important; border-radius:22px!important; background:#111116!important; box-shadow:0 24px 70px rgba(0,0,0,.7)!important; padding:14px!important; } .gg-salon-editor-shell-v185 > header{ display:flex!important; justify-content:space-between!important; align-items:center!important; margin-bottom:12px!important; } .gg-salon-editor-shell-v185 > header strong{ color:#f0cf74!important; } #ggSalonEditorCloseV185{ width:36px!important; height:36px!important; border-radius:50%!important; border:0!important; background:#27252d!important; color:#fff!important; } .gg-salon-cat-grid-v185{ display:grid!important; grid-template-columns:repeat(5,1fr)!important; gap:8px!important; margin-bottom:12px!important; } .gg-salon-cat-grid-v185 button, .gg-salon-option-grid-v185 button{ min-height:62px!important; border:1px solid #4c4752!important; border-radius:12px!important; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; color:#181818!important; display:grid!important; place-items:center!important; gap:4px!important; } .gg-salon-cat-grid-v185 button.active{ border-color:#d7b05b!important; box-shadow:0 0 12px rgba(215,176,91,.4)!important; } .gg-salon-option-grid-v185{ display:grid!important; grid-template-columns:repeat(4,1fr)!important; gap:8px!important; max-height:48vh!important; overflow-y:auto!important; padding:4px!important; } .gg-salon-option-grid-v185 button i, .gg-salon-cat-grid-v185 button i{ font-style:normal!important; font-size:20px!important; } .gg-salon-option-grid-v185 button span, .gg-salon-cat-grid-v185 button span{ font-size:11px!important; text-align:center!important; } /* ========================================================== v200 Stable Foundation shared UI ========================================================== */ .gg-v200-rarity{ position:relative!important; isolation:isolate!important; overflow:visible!important; } .gg-v200-rarity-plate{ position:absolute!important; inset:2px!important; border:2px solid!important; border-radius:12px!important; z-index:-1!important; pointer-events:none!important; } .gg-v200-rarity-dot{ position:absolute!important; right:6px!important; top:6px!important; width:9px!important; height:9px!important; border-radius:50%!important; border:1px solid rgba(255,255,255,.78)!important; z-index:50!important; pointer-events:none!important; } .gg-v200-rarity.selected{ outline:3px solid #f1ca61!important; outline-offset:2px!important; box-shadow:0 0 16px rgba(241,202,97,.58)!important; } /* Hidden diagnostics only appears with ?debug in the URL. */ .gg-v200-debug{ position:fixed!important; right:8px!important; bottom:8px!important; z-index:2147483647!important; width:min(92vw,420px)!important; max-height:62vh!important; overflow:auto!important; background:rgba(8,8,12,.97)!important; color:#fff!important; border:1px solid #d7b05b!important; border-radius:12px!important; padding:10px!important; box-shadow:0 8px 30px rgba(0,0,0,.6)!important; } .gg-v200-debug summary{cursor:pointer;color:#f0cf74;font-weight:900} .gg-v200-debug pre{white-space:pre-wrap;font-size:11px} .gg-v200-debug button{ border:1px solid #d7b05b;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:8px;padding:7px 10px ;} /* ========================================================== v202 — Goldie's Salon upper camera: mostly floor, only upper half shows wall. ========================================================== */ html:has(body.gg-salon-page-v202), body.gg-salon-page-v202{ height:100%!important; overflow:hidden!important; overscroll-behavior:none!important; touch-action:none!important; } body.gg-salon-page-v202 #avatarRoom{ position:fixed!important; left:50%!important; top:50%!important; transform:translate(-50%,-50%)!important; width:min(100vw,760px)!important; height:min(100vh,820px)!important; overflow:hidden!important; } /* START: floor only */ body.gg-salon-lower-v202 #roomSceneWindowV055, body.gg-salon-lower-v202 #wallLayer, body.gg-salon-lower-v202 .room-wall, body.gg-salon-lower-v202 [class*="wall-layer"], body.gg-salon-lower-v202 #roomDecorLayerV059, body.gg-salon-lower-v202 #roomWallItemV061, body.gg-salon-lower-v202 .room-scene-window-v055, body.gg-salon-lower-v202 .room-window-frame-v057{ opacity:0!important; visibility:hidden!important; pointer-events:none!important; } /* UPPER: reveal wall, but crop it to the top half of the room. */ body.gg-salon-upper-v202 #roomSceneWindowV055, body.gg-salon-upper-v202 #wallLayer, body.gg-salon-upper-v202 .room-wall, body.gg-salon-upper-v202 [class*="wall-layer"], body.gg-salon-upper-v202 #roomDecorLayerV059, body.gg-salon-upper-v202 #roomWallItemV061, body.gg-salon-upper-v202 .room-scene-window-v055, body.gg-salon-upper-v202 .room-window-frame-v057{ opacity:1!important; visibility:visible!important; pointer-events:auto!important; } /* Push wall/back-room content high so only the top ~45% is visible. */ body.gg-salon-upper-v202 #wallLayer, body.gg-salon-upper-v202 .room-wall, body.gg-salon-upper-v202 [class*="wall-layer"], body.gg-salon-upper-v202 #roomSceneWindowV055, body.gg-salon-upper-v202 .room-scene-window-v055, body.gg-salon-upper-v202 .room-window-frame-v057, body.gg-salon-upper-v202 #roomDecorLayerV059, body.gg-salon-upper-v202 #roomWallItemV061{ transform:translateY(-26%)!important; clip-path:inset(0 0 55% 0)!important; transform-origin:center top!important; } /* Floor dominates both lower and upper Salon states. */ body.gg-salon-page-v202 #floorLayer, body.gg-salon-page-v202 .room-floor, body.gg-salon-page-v202 [class*="floor-layer"]{ transform:scaleY(1.65)!important; transform-origin:center bottom!important; opacity:1!important; } /* Keep avatar low/back in upper view. */ body.gg-salon-upper-v202 .room-avatar.room-avatar-exact{ transform:translateY(20vh) scale(.94)!important; opacity:.44!important; } /* Upper return line stays easy to hit and above menus. */ body.gg-salon-page-v202.gg-salon-upper-v202 .gg-salon-scroll-edge-v180.bottom-edge{ bottom:72px!important; height:96px!important; width:min(92vw,700px)!important; z-index:2147483646!important; pointer-events:auto!important; } body.gg-salon-page-v202.gg-salon-upper-v202 .gg-salon-scroll-edge-v180.bottom-edge::after{ height:8px!important; width:120px!important; } /* ========================================================== v202 — working Edit Salon popup based on REAL room controls. ========================================================== */ .gg-salon-editor-popup-v202{ position:fixed!important; inset:0!important; z-index:2147483647!important; display:none!important; place-items:center!important; padding:16px!important; background:rgba(0,0,0,.7)!important; backdrop-filter:blur(6px)!important; } .gg-salon-editor-popup-v202.show{ display:grid!important; } .gg-salon-editor-shell-v202{ width:min(95vw,760px)!important; max-height:88vh!important; overflow:hidden!important; border:1px solid rgba(215,176,91,.55)!important; border-radius:22px!important; background:#111116!important; box-shadow:0 24px 70px rgba(0,0,0,.72)!important; padding:14px!important; } .gg-salon-editor-shell-v202 > header{ display:flex!important; justify-content:space-between!important; align-items:center!important; margin-bottom:12px!important; } .gg-salon-editor-shell-v202 > header strong{ color:#f0cf74!important; } #ggSalonEditorCloseV202{ width:36px!important; height:36px!important; border-radius:50%!important; border:0!important; background:#27252d!important; color:#fff!important; } .gg-salon-editor-content-v202{ display:grid!important; gap:12px!important; } .gg-salon-cat-wrap-v202{ display:grid!important; grid-template-columns:repeat(5,minmax(0,1fr))!important; gap:8px!important; } .gg-salon-cat-v202, .gg-salon-option-v202{ position:relative!important; min-height:62px!important; border:1px solid #4c4752!important; border-radius:12px!important; background:#1a181f!important; color:#fff!important; padding:8px!important; }.gg-salon-option-v202{ position:relative!important; min-height:62px!important; border:1px solid #4c4752!important; border-radius:12px!important; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; color:#181818!important; padding:8px!important; } .gg-salon-cat-v202.active{ border-color:#d7b05b!important; box-shadow:0 0 12px rgba(215,176,91,.42)!important; } .gg-salon-options-wrap-v202{ display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:8px!important; max-height:48vh!important; overflow-y:auto!important; padding:4px!important; touch-action:pan-y!important; overscroll-behavior:contain!important; } .gg-salon-option-v202.selected{ outline:3px solid #d7b05b!important; outline-offset:1px!important; } /* v203 — no mini-game controls/functions in Goldie's Salon */ body.gg-salon-page-v202 #ggRoomGameGuideV120, body.gg-salon-page-v202 #ggRoomGameBtnV120, body.gg-salon-page-v202 .room-game-icon, body.gg-salon-page-v202 [data-minigame], body.gg-salon-page-v202 [data-game], body.gg-salon-page-v202 [data-game-id], body.gg-salon-page-v202 [class*="mini-game"], body.gg-salon-page-v202 [class*="minigame"]{ display:none!important; pointer-events:none!important; } /* v203 — lift Goldie's Salon room so Daily Reward is visible below */ body.gg-salon-page-v202 #avatarRoom{ top:43%!important; transform:translate(-50%,-50%)!important; max-height:72vh!important; } body.gg-salon-page-v202 .room-main{ padding-top:0!important; padding-bottom:22vh!important; } body.gg-salon-page-v202 .daily-card{ position:fixed!important; left:50%!important; bottom:10px!important; transform:translateX(-50%)!important; width:min(94vw,760px)!important; max-height:16vh!important; overflow:auto!important; z-index:70!important; margin:0!important; background:rgba(14,14,18,.96)!important; backdrop-filter:blur(4px)!important; } /* v203 — Salon items/options menu sits closer to bottom of room */ body.gg-salon-page-v202 #ggSalonEditorToggleV183{ bottom:18vh!important; z-index:2147483500!important; } .gg-salon-editor-popup-v202{ align-items:end!important; padding:0 12px 18vh!important; } .gg-salon-editor-shell-v202{ width:min(95vw,760px)!important; max-height:52vh!important; border-radius:18px 18px 12px 12px!important; } .gg-salon-options-wrap-v202{ max-height:30vh!important; } body.gg-salon-page-v202.gg-salon-upper-v202 .gg-salon-scroll-edge-v180.bottom-edge{ bottom:18vh!important; z-index:2147483646!important; } /* ========================================================== v204 — Goldie's Salon compact collapsible items arrow ========================================================== */ body.gg-salon-page-v202 #ggSalonEditorToggleV183.gg-salon-items-arrow-v204{ position:fixed!important; left:18px!important; right:auto!important; bottom:13vh!important; transform:none!important; width:46px!important; height:30px!important; min-width:0!important; padding:0!important; display:grid!important; place-items:center!important; border:1px solid rgba(215,176,91,.62)!important; border-radius:0 0 12px 12px!important; background:rgba(13,13,17,.90)!important; color:#e9c96f!important; font-size:22px!important; line-height:1!important; opacity:.82!important; z-index:2147483500!important; box-shadow:0 5px 14px rgba(0,0,0,.35)!important; } body.gg-salon-page-v202 #ggSalonEditorToggleV183.gg-salon-items-arrow-v204.open{ border-radius:12px 12px 0 0!important; opacity:1!important; } /* Put the item drawer low, directly above its arrow and below the mood/level area. */ body.gg-salon-page-v202 .gg-salon-editor-popup-v202{ align-items:end!important; justify-items:start!important; padding:0 12px calc(13vh + 30px)!important; background:transparent!important; backdrop-filter:none!important; pointer-events:none!important; } body.gg-salon-page-v202 .gg-salon-editor-popup-v202.show{ display:grid!important; } body.gg-salon-page-v202 .gg-salon-editor-shell-v202{ width:min(94vw,720px)!important; max-height:43vh!important; margin-left:0!important; border-radius:16px 16px 16px 0!important; pointer-events:auto!important; box-shadow:0 10px 35px rgba(0,0,0,.62)!important; } body.gg-salon-page-v202 .gg-salon-options-wrap-v202{ max-height:24vh!important; } /* The arrow itself is the open/close control, so hide the duplicate X. */ body.gg-salon-page-v202 #ggSalonEditorCloseV202{ display:none!important; } /* Preserve visibility of mood/level HUD above the drawer trigger. */ body.gg-salon-page-v202 .room-mood, body.gg-salon-page-v202 [class*="mood-gauge"], body.gg-salon-page-v202 [class*="level-gauge"], body.gg-salon-page-v202 [id*="Mood"], body.gg-salon-page-v202 [id*="Level"]{ z-index:2147483550!important; } /* ========================================================== v205 GOLDIE SALON — authoritative layout ========================================================== */ body.gg-salon-page-v205{ overflow:hidden!important; overscroll-behavior:none!important; } /* Lift the room enough to expose Daily Rewards underneath. */ body.gg-salon-page-v205 #avatarRoom{ position:fixed!important; left:50%!important; top:39%!important; transform:translate(-50%,-50%)!important; width:min(96vw,760px)!important; height:min(69vh,700px)!important; z-index:100!important; } /* Daily reward stays visibly below room. */ body.gg-salon-page-v205 .daily-card{ position:fixed!important; left:50%!important; bottom:8px!important; transform:translateX(-50%)!important; width:min(94vw,760px)!important; max-height:17vh!important; overflow:auto!important; z-index:80!important; margin:0!important; } /* Actual compact arrow below Mood / Level gauge. */ body.gg-salon-page-v205 #ggSalonEditorToggleV183.gg-salon-items-arrow-v205{ display:grid!important; position:fixed!important; left:16px!important; bottom:18vh!important; width:48px!important; height:30px!important; min-width:48px!important; padding:0!important; place-items:center!important; transform:none!important; border:1px solid #b99042!important; border-radius:0 0 12px 12px!important; background:rgba(14,13,17,.96)!important; color:#f0cf74!important; font-size:23px!important; line-height:1!important; z-index:2147483600!important; } /* Drawer opens upward from arrow, directly under the room HUD. */ body.gg-salon-page-v205 #ggSalonDrawerV205.gg-salon-drawer-v205{ display:block!important; position:fixed!important; left:12px!important; bottom:calc(18vh + 30px)!important; width:min(94vw,720px)!important; max-height:39vh!important; overflow:hidden!important; padding:10px!important; border:1px solid rgba(215,176,91,.6)!important; border-radius:16px 16px 16px 0!important; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; box-shadow:0 12px 35px rgba(0,0,0,.62)!important; z-index:2147483590!important; color:#181818;} body.gg-salon-page-v205 #ggSalonDrawerV205[hidden]{ display:none!important; } .gg-salon-drawer-head-v205{ color:#f0cf74!important; padding:2px 4px 8px!important; } .gg-salon-cats-v205{ display:grid!important; grid-template-columns:repeat(5,minmax(0,1fr))!important; gap:6px!important; margin-bottom:8px!important; } .gg-salon-cats-v205 button, .gg-salon-opts-v205 button{ min-height:54px!important; border:1px solid #4b4650!important; border-radius:10px!important; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; color:#181818!important; padding:6px!important; } .gg-salon-cats-v205 button.active{ border-color:#e2bb5d!important; box-shadow:0 0 10px rgba(226,187,93,.38)!important; } .gg-salon-opts-v205{ display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:6px!important; max-height:23vh!important; overflow-y:auto!important; overscroll-behavior:contain!important; touch-action:pan-y!important; } /* No game controls in Salon. */ body.gg-salon-page-v205 [data-minigame], body.gg-salon-page-v205 [data-game], body.gg-salon-page-v205 [data-game-id], body.gg-salon-page-v205 .room-game-icon, body.gg-salon-page-v205 .minigame-trigger{ display:none!important; } /* Upper camera: mostly floor, half-ish wall at top. */ body.gg-salon-page-v205.gg-salon-lower-v205 #roomSceneWindowV055, body.gg-salon-page-v205.gg-salon-lower-v205 #wallLayer, body.gg-salon-page-v205.gg-salon-lower-v205 .room-wall{ opacity:0!important; visibility:hidden!important; } body.gg-salon-page-v205.gg-salon-upper-v205 #roomSceneWindowV055, body.gg-salon-page-v205.gg-salon-upper-v205 #wallLayer, body.gg-salon-page-v205.gg-salon-upper-v205 .room-wall{ opacity:1!important; visibility:visible!important; clip-path:inset(0 0 50% 0)!important; transform:translateY(-20%)!important; } /* ========================================================== v206 — Goldie's Salon rebuilt as a clean second Avatar Room ========================================================== */ body.gg-salon-room-v206{ overflow:auto!important; min-height:100%!important; height:auto!important; touch-action:auto!important; overscroll-behavior:auto!important; } body.gg-salon-room-v206 #avatarRoom{ position:relative!important; left:auto!important; top:auto!important; transform:none!important; width:auto!important; height:auto!important; max-height:none!important; margin:0 auto!important; z-index:auto!important; } body.gg-salon-room-v206 .daily-card{ position:relative!important; left:auto!important; bottom:auto!important; transform:none!important; width:auto!important; max-height:none!important; overflow:visible!important; z-index:auto!important; } /* Hide all previous Salon-only UI systems. */ body.gg-salon-room-v206 .gg-salon-scroll-edge-v180, body.gg-salon-room-v206 #ggSalonEditorToggleV183, body.gg-salon-room-v206 [id^="ggSalonEditorPopup"], body.gg-salon-room-v206 [id^="ggSalonDrawer"], body.gg-salon-room-v206 [class*="gg-salon-editor"], body.gg-salon-room-v206 [class*="gg-salon-drawer"]{ display:none!important; } /* Restore normal Home room layers. */ body.gg-salon-room-v206 #roomSceneWindowV055, body.gg-salon-room-v206 #wallLayer, body.gg-salon-room-v206 .room-wall, body.gg-salon-room-v206 [class*="wall-layer"], body.gg-salon-room-v206 #floorLayer, body.gg-salon-room-v206 .room-floor, body.gg-salon-room-v206 [class*="floor-layer"], body.gg-salon-room-v206 #roomDecorLayerV059, body.gg-salon-room-v206 #roomWallItemV061{ opacity:1!important; visibility:visible!important; transform:none!important; clip-path:none!important; } /* v207 Goldie's Salon open-front shop */ body.gg-salon-room-v206.gg-salon-shop-v207 #avatarRoom{position:relative!important;width:min(96vw,820px)!important;height:min(72vh,650px)!important;min-height:560px!important;overflow:hidden!important;isolation:isolate!important;touch-action:none!important;overscroll-behavior:contain!important;background:linear-gradient(#8bc4e8 0 44%,#c8b28b 44% 100%)!important} body.gg-salon-shop-v207 #roomSceneWindowV055,body.gg-salon-shop-v207 .room-scene-window-v055{position:absolute!important;inset:0 0 44% 0!important;width:100%!important;height:56%!important;transform:none!important;clip-path:none!important;border:0!important;z-index:1!important;opacity:1!important} body.gg-salon-shop-v207 #wallLayer,body.gg-salon-shop-v207 .room-wall,body.gg-salon-shop-v207 [class*="wall-layer"]{opacity:0!important;pointer-events:none!important} .gg-salon-shop-shell-v207{position:absolute;left:7%;right:7%;top:19%;bottom:7%;z-index:20;pointer-events:none} .gg-salon-roof-v207{position:absolute;left:-3%;right:-3%;top:0;height:13%;background:linear-gradient(#302a32,#171419);border:3px solid #d3ad55;border-radius:16px 16px 4px 4px;display:flex;align-items:center;justify-content:center;color:#f2d57d;font-weight:1000;letter-spacing:2px;font-size:clamp(12px,2.5vw,21px)} .gg-salon-back-v207{position:absolute;left:0;right:0;top:12%;height:38%;background:linear-gradient(#4b404d,#28222b);border:3px solid #302830} .gg-salon-floor-v207{position:absolute;left:0;right:0;top:48%;bottom:0;background:repeating-linear-gradient(90deg,#6b5660 0 12%,#5a4851 12% 24%);border:3px solid #30272e} .gg-salon-counter-v207{position:absolute;right:7%;top:39%;width:25%;height:13%;z-index:8;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:3px solid #d3ad55;border-radius:6px;color:#181818;} .gg-salon-chair-v207{position:absolute;top:54%;width:14%;height:23%;z-index:10;background:linear-gradient(#c59a4b 0 58%,transparent 58%);border:3px solid #33272e;border-radius:12px}.gg-salon-chair-v207.a{left:25%}.gg-salon-chair-v207.b{left:56%} .gg-salon-client-v207{display:none;position:absolute;top:47%;width:10%;height:23%;z-index:11}.gg-salon-client-v207.a{left:27%}.gg-salon-client-v207.b{left:58%} body.gg-salon-shop-v207 .room-avatar,body.gg-salon-shop-v207 .room-avatar.room-avatar-exact,body.gg-salon-shop-v207 #roomAvatar,body.gg-salon-shop-v207 #avatarSvg{position:relative!important;z-index:9000!important;transform-origin:center bottom!important} body.gg-salon-shop-v207 .room-avatar.room-avatar-exact{transform:scaleX(.9) scaleY(1.14)!important} body.gg-salon-shop-v207 .room-mood,body.gg-salon-shop-v207 [class*="mood"],body.gg-salon-shop-v207 [class*="level"],body.gg-salon-shop-v207 [id*="Mood"],body.gg-salon-shop-v207 [id*="Level"]{position:relative!important;z-index:8500!important} body.gg-salon-shop-v207 .room-hud,body.gg-salon-shop-v207 #roomCategoryLoop,body.gg-salon-shop-v207 #roomOptionLoop{position:relative!important;z-index:8000!important} body.gg-salon-shop-v207 [data-room-option].gg-light-armed-v207{outline:3px solid #f0cf74!important;outline-offset:2px!important;filter:brightness(1.22)!important} /* ========================================================== v208 — Goldie's Salon wider horizontal composition ========================================================== */ /* Wider room viewport, same salon building footprint inside it. */ body.gg-salon-room-v206.gg-salon-shop-v207 #avatarRoom{ width:min(99vw,940px)!important; height:min(70vh,650px)!important; min-height:560px!important; } /* Keep the physical salon building dimensions visually about the same by narrowing its relative width inside the now-wider room. */ body.gg-salon-shop-v207 .gg-salon-shop-shell-v207{ left:12%!important; right:12%!important; top:19%!important; bottom:0!important; } /* Extend the salon's interior/back walls to the very bottom of the room. */ body.gg-salon-shop-v207 .gg-salon-back-v207{ top:12%!important; height:auto!important; bottom:0!important; border-bottom:0!important; } /* Extend side boundaries/posts all the way down. */ body.gg-salon-shop-v207 .gg-salon-shop-shell-v207::before, body.gg-salon-shop-v207 .gg-salon-shop-shell-v207::after{ content:""!important; position:absolute!important; top:10%!important; bottom:0!important; width:3%!important; background:#272129!important; border:2px solid #d3ad55!important; z-index:6!important; pointer-events:none!important; } body.gg-salon-shop-v207 .gg-salon-shop-shell-v207::before{left:0!important} body.gg-salon-shop-v207 .gg-salon-shop-shell-v207::after{right:0!important} /* Salon floor now continues to bottom edge with no exposed outside strip. */ body.gg-salon-shop-v207 .gg-salon-floor-v207{ top:48%!important; bottom:0!important; } /* ========================================================== v208 — smaller avatar, bottom-center, absolute top layer ========================================================== */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact{ position:absolute!important; left:50%!important; right:auto!important; top:auto!important; bottom:2.5%!important; transform:translateX(-50%) scale(.58)!important; transform-origin:center bottom!important; z-index:9000!important; margin:0!important; } body.gg-salon-shop-v207 .room-avatar, body.gg-salon-shop-v207 #roomAvatar, body.gg-salon-shop-v207 #avatarSvg{ z-index:9000!important; } /* ========================================================== v208 — Mood bottom-left, Level bottom-right ========================================================== */ /* Mood */ body.gg-salon-shop-v207 #roomMoodGauge, body.gg-salon-shop-v207 #moodGauge, body.gg-salon-shop-v207 [id*="MoodGauge"], body.gg-salon-shop-v207 [class*="mood-gauge"], body.gg-salon-shop-v207 .room-mood{ position:absolute!important; left:10px!important; right:auto!important; top:auto!important; bottom:10px!important; transform:none!important; z-index:8500!important; margin:0!important; } /* Level */ body.gg-salon-shop-v207 #roomLevelGauge, body.gg-salon-shop-v207 #levelGauge, body.gg-salon-shop-v207 [id*="LevelGauge"], body.gg-salon-shop-v207 [class*="level-gauge"], body.gg-salon-shop-v207 [class*="level-display"]{ position:absolute!important; right:10px!important; left:auto!important; top:auto!important; bottom:10px!important; transform:none!important; z-index:8500!important; margin:0!important; } /* Avoid broad old mood/level selectors repositioning unrelated widgets. */ body.gg-salon-shop-v207 [class*="mood"]:not([class*="mood-gauge"]):not(.room-mood), body.gg-salon-shop-v207 [class*="level"]:not([class*="level-gauge"]):not([class*="level-display"]){ z-index:8400!important; } /* ========================================================== v208 — true two-tap/double-click light activation ========================================================== */ body.gg-salon-shop-v207 [data-room-option].gg-light-armed-v208{ outline:3px solid #f0cf74!important; outline-offset:2px!important; filter:brightness(1.28)!important; animation:ggLightArmV208 .7s ease!important; } @keyframes ggLightArmV208{ 0%{transform:scale(1)} 45%{transform:scale(1.06)} 100%{transform:scale(1)} } /* ========================================================== v209 — Goldie's Salon editor controls tightened to room bottom ========================================================== */ /* Main avatar/customization category row closer to bottom frame. */ body.gg-salon-shop-v207 #roomCategoryLoop{ position:absolute!important; left:50%!important; bottom:4px!important; transform:translateX(-50%)!important; width:min(76%,680px)!important; margin:0!important; z-index:8000!important; } /* Dropdown/item selection stays immediately above the avatar option row. */ body.gg-salon-shop-v207 #roomOptionLoop{ position:absolute!important; left:50%!important; bottom:58px!important; transform:translateX(-50%)!important; width:min(82%,720px)!important; max-height:180px!important; overflow-y:auto!important; margin:0!important; z-index:8050!important; } /* Catch the containing option drawer if present so old spacing can't push it away. */ body.gg-salon-shop-v207 #roomOptionDrawer{ position:absolute!important; left:50%!important; bottom:54px!important; transform:translateX(-50%)!important; width:min(84%,730px)!important; margin:0!important; z-index:8040!important; } /* Keep Mood and Level above/aside from the bottom editor strip. */ body.gg-salon-shop-v207 #roomMoodGaugeV065{ position:absolute!important; left:8px!important; bottom:8px!important; z-index:8500!important; } body.gg-salon-shop-v207 #ggRoomLevelV143{ position:absolute!important; right:8px!important; left:auto!important; bottom:8px!important; z-index:8500!important; } /* ========================================================== v210 — Goldie's Salon wider / no windows / lower avatar ========================================================== */ /* Intentionally extend salon a little beyond the horizontal viewport. */ body.gg-salon-room-v206.gg-salon-shop-v207 #avatarRoom{ width:min(108vw,1040px)!important; max-width:none!important; margin-left:50%!important; transform:translateX(-50%)!important; } /* Remove windows from Goldie's Salon entirely. Scene remains as sky/background. */ body.gg-salon-shop-v207 #roomSceneWindowV055, body.gg-salon-shop-v207 .room-scene-window-v055, body.gg-salon-shop-v207 .room-window-frame-v057, body.gg-salon-shop-v207 #roomWindowFrameV057, body.gg-salon-shop-v207 [class*="window-frame"], body.gg-salon-shop-v207 [id*="WindowFrame"]{ border:0!important; box-shadow:none!important; border-radius:0!important; } /* Hide only visual window/frame chrome, not the sky scene itself. */ body.gg-salon-shop-v207 .room-window-frame-v057, body.gg-salon-shop-v207 #roomWindowFrameV057, body.gg-salon-shop-v207 [class*="window-frame"], body.gg-salon-shop-v207 [id*="WindowFrame"]{ display:none!important; } /* Lower Salon avatar slightly more while keeping it center-bottom and topmost. */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact{ bottom:-1.5%!important; } /* ========================================================== v210 — Salon control layout: category/avatar item menu first, dropdown UNDER it ========================================================== */ body.gg-salon-shop-v207 #roomCategoryLoop{ position:absolute!important; left:50%!important; bottom:34px!important; transform:translateX(-50%)!important; width:min(78%,700px)!important; margin:0!important; z-index:8000!important; } body.gg-salon-shop-v207 #roomOptionLoop{ position:absolute!important; left:50%!important; top:calc(100% - 28px)!important; bottom:auto!important; transform:translateX(-50%)!important; width:min(84%,740px)!important; max-height:180px!important; overflow-y:auto!important; margin:0!important; z-index:8050!important; } body.gg-salon-shop-v207 #roomOptionDrawer{ position:absolute!important; left:50%!important; top:calc(100% - 32px)!important; bottom:auto!important; transform:translateX(-50%)!important; width:min(86%,750px)!important; margin:0!important; z-index:8040!important; } /* ========================================================== v210 — Normal Avatar Room uses the same bottom-menu layout as Goldie's Salon. ========================================================== */ body:not(.gg-salon-shop-v207) #avatarRoom #roomCategoryLoop{ position:absolute!important; left:50%!important; bottom:34px!important; transform:translateX(-50%)!important; width:min(78%,700px)!important; margin:0!important; z-index:8000!important; } body:not(.gg-salon-shop-v207) #avatarRoom #roomOptionLoop{ position:absolute!important; left:50%!important; top:calc(100% - 28px)!important; bottom:auto!important; transform:translateX(-50%)!important; width:min(84%,740px)!important; max-height:180px!important; overflow-y:auto!important; margin:0!important; z-index:8050!important; } body:not(.gg-salon-shop-v207) #avatarRoom #roomOptionDrawer{ position:absolute!important; left:50%!important; top:calc(100% - 32px)!important; bottom:auto!important; transform:translateX(-50%)!important; width:min(86%,750px)!important; margin:0!important; z-index:8040!important; } /* ========================================================== v210 — site top nav + title follow while scrolling ========================================================== */ .site-header, .topbar, .top-bar, .main-header, header.site-header, header.topbar, body > header, .site-nav, .main-nav, nav.site-nav, nav.main-nav{ position:sticky!important; top:0!important; z-index:2147483000!important; } /* Title bar sits directly beneath the sticky nav when separate. */ .page-title, .title-bar, .page-header, .room-title, .section-title{ position:sticky!important; top:48px!important; z-index:2147482900!important; backdrop-filter:blur(6px); } /* Avoid sticky elements becoming transparent/unreadable over content. */ .site-header, .topbar, .top-bar, .main-header, body > header, .site-nav, .main-nav, .page-title, .title-bar, .page-header{ background-color:rgba(12,12,16,.94)!important; } /* ========================================================== v211 — REAL DOM layout fix roomCategoryLoop + roomOptionDrawer are physically mounted inside #avatarRoom by room-layout-v211.js. ========================================================== */ body{ overflow-x:hidden; } #avatarRoom{ position:relative!important; } /* Shared Home + Salon bottom controls host */ #ggRoomBottomControlsV211{ position:absolute!important; left:0!important; right:0!important; bottom:0!important; height:132px!important; z-index:8100!important; pointer-events:none!important; } /* Category/avatar items menu sits ABOVE the dropdown. */ #ggRoomBottomControlsV211 .room-category-wrap-v061{ position:absolute!important; left:50%!important; bottom:64px!important; width:min(82%,760px)!important; transform:translateX(-50%)!important; margin:0!important; z-index:8120!important; pointer-events:auto!important; } /* Real category loop itself */ #ggRoomBottomControlsV211 #roomCategoryLoop{ position:relative!important; left:auto!important; top:auto!important; bottom:auto!important; transform:none!important; width:100%!important; margin:0!important; } /* Dropdown is UNDER the item/category menu, close to it. */ #ggRoomBottomControlsV211 #roomOptionDrawer{ position:absolute!important; left:50%!important; bottom:4px!important; width:min(86%,780px)!important; transform:translateX(-50%)!important; margin:0!important; z-index:8110!important; pointer-events:auto!important; max-height:58px!important; overflow:hidden!important; } /* Keep options compact/horizontal instead of far away. */ #ggRoomBottomControlsV211 #roomOptionLoop{ position:relative!important; left:auto!important; top:auto!important; bottom:auto!important; transform:none!important; width:100%!important; max-height:54px!important; overflow-x:auto!important; overflow-y:hidden!important; white-space:nowrap!important; margin:0!important; } /* Drawer title is compact so item choices stay close to category row. */ #ggRoomBottomControlsV211 .room-drawer-head{ min-height:16px!important; padding:1px 6px!important; font-size:9px!important; } #ggRoomBottomControlsV211 .room-drawer-head small{ display:none!important; } #ggRoomBottomControlsV211 #roomEditorActiveLabelV061{ position:absolute!important; left:50%!important; bottom:116px!important; transform:translateX(-50%)!important; margin:0!important; z-index:8130!important; pointer-events:none!important; font-size:10px!important; } /* ========================================================== v211 — Goldie's Salon actual wider/off-screen layout ========================================================== */ body.gg-salon-room-v206.gg-salon-shop-v207 #avatarRoom{ width:112vw!important; max-width:none!important; left:50%!important; margin-left:0!important; transform:translateX(-50%)!important; } /* Building remains visually similar in size inside wider viewport. */ body.gg-salon-shop-v207 .gg-salon-shop-shell-v207{ left:15%!important; right:15%!important; } /* Remove Salon frame/window chrome while preserving scene as sky. */ body.gg-salon-shop-v207 [data-room-category="frame"]{ display:none!important; } body.gg-salon-shop-v207 #roomSceneWindowV055{ border:0!important; border-radius:0!important; box-shadow:none!important; outline:0!important; clip-path:none!important; } body.gg-salon-shop-v207 #roomSceneWindowV055::before, body.gg-salon-shop-v207 #roomSceneWindowV055::after{ display:none!important; content:none!important; } /* Lower avatar a little more. */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact{ bottom:-4%!important; } /* Mood/Level exact real IDs */ body.gg-salon-shop-v207 #roomMoodGaugeV065{ position:absolute!important; left:8px!important; right:auto!important; bottom:8px!important; top:auto!important; transform:none!important; z-index:8500!important; } body.gg-salon-shop-v207 #ggRoomLevelV143{ position:absolute!important; right:8px!important; left:auto!important; bottom:8px!important; top:auto!important; transform:none!important; z-index:8500!important; } /* ========================================================== v211 — exact sticky site header and exact room title ========================================================== */ body > header{ position:sticky!important; top:0!important; z-index:2147483000!important; background:rgba(12,12,16,.96)!important; backdrop-filter:blur(8px)!important; } #roomReferenceHeadV054{ position:sticky!important; top:52px!important; z-index:2147482900!important; background:rgba(12,12,16,.92)!important; backdrop-filter:blur(8px)!important; } /* Make sticky title compact so it doesn't cover room. */ #roomReferenceHeadV054 h1{ margin:0!important; padding:6px 0!important; } /* v212 — real edit menu BELOW both room screens */ #ggRoomEditBelowV212{position:relative!important;display:flex!important;flex-direction:column!important;gap:4px!important;width:100%!important;margin:6px 0 0!important;padding:0!important;z-index:500!important} #ggRoomEditBelowV212 #roomEditorActiveLabelV061{position:relative!important;inset:auto!important;transform:none!important;margin:0 0 2px!important;padding:0 4px!important;font-size:10px!important;line-height:1.2!important;text-align:left!important} #ggRoomEditBelowV212 .room-category-wrap-v061{position:relative!important;inset:auto!important;transform:none!important;width:100%!important;margin:0!important;padding:0!important;z-index:510!important} #ggRoomEditBelowV212 #roomCategoryLoop{position:relative!important;inset:auto!important;transform:none!important;width:100%!important;margin:0!important} #ggRoomEditBelowV212 #roomOptionDrawer{position:relative!important;inset:auto!important;transform:none!important;width:100%!important;margin:2px 0 0!important;z-index:505!important;max-height:none!important;overflow:visible!important} #ggRoomEditBelowV212 #roomOptionLoop{position:relative!important;inset:auto!important;transform:none!important;width:100%!important;margin:0!important;max-height:150px!important;overflow:auto!important} #ggRoomEditBelowV212 .room-drawer-head{padding:3px 6px!important;min-height:0!important} #ggRoomEditBelowV212 .room-drawer-head small{font-size:8px!important} /* v212 — fixed top title/menu/quick links on every page */ html body{padding-top:74px!important} html body>header{position:fixed!important;left:0!important;right:0!important;top:0!important;width:100%!important;z-index:2147483000!important;background:rgba(11,11,13,.96)!important;backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;border-bottom:1px solid rgba(215,176,91,.22)!important;transform:translateZ(0)!important} html body>header nav,html body>header .brand,html body>header .navlinks,html body>header .home-avatar-pair{position:relative!important;z-index:2147483001!important} #roomReferenceHeadV054{position:sticky!important;top:74px!important;z-index:2147482800!important;background:rgba(12,12,16,.94)!important;backdrop-filter:blur(8px)!important} /* v212 — Goldie's Salon actually wider and windowless */ body.gg-salon-room-v206.gg-salon-shop-v207 .rich-avatar-shell, body.gg-salon-room-v206.gg-salon-shop-v207 .room-studio-card, body.gg-salon-room-v206.gg-salon-shop-v207 .avatar-preview-card{max-width:none!important;width:100%!important;overflow:visible!important} body.gg-salon-room-v206.gg-salon-shop-v207 #avatarRoom{position:relative!important;width:116vw!important;max-width:none!important;left:50%!important;margin-left:0!important;transform:translateX(-50%)!important;overflow:hidden!important} body.gg-salon-shop-v207 .gg-salon-shop-shell-v207{left:17%!important;right:17%!important} body.gg-salon-shop-v207 [data-room-category="frame"]{display:none!important} body.gg-salon-shop-v207 #roomSceneWindowV055{border:0!important;outline:0!important;box-shadow:none!important;border-radius:0!important;clip-path:none!important} body.gg-salon-shop-v207 #roomSceneWindowV055::before, body.gg-salon-shop-v207 #roomSceneWindowV055::after, body.gg-salon-shop-v207 .room-scene-window-v055::before, body.gg-salon-shop-v207 .room-scene-window-v055::after{content:none!important;display:none!important;border:0!important;box-shadow:none!important;background:none!important} body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="frame"], body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="curtain"], body.gg-salon-shop-v207 [data-frame-choice]{display:none!important} body.gg-salon-shop-v207 #roomSceneVisualV055{display:block!important;visibility:visible!important;opacity:1!important} body.gg-salon-shop-v207 .room-avatar.room-avatar-exact{bottom:-5%!important} body.gg-salon-shop-v207 #roomMoodGaugeV065{position:absolute!important;left:8px!important;right:auto!important;bottom:8px!important;top:auto!important;transform:none!important;z-index:8500!important} body.gg-salon-shop-v207 #ggRoomLevelV143{position:absolute!important;right:8px!important;left:auto!important;bottom:8px!important;top:auto!important;transform:none!important;z-index:8500!important} body.gg-salon-shop-v207 #ggRoomEditBelowV212{width:min(100%,760px)!important;margin:7px auto 0!important} /* ========================================================== v213 — Goldie's Salon TRUE full-width viewport layout ========================================================== */ /* Break Salon out of every normal site width limiter. */ body.gg-salon-room-v206.gg-salon-shop-v207 .room-main{ width:100vw!important; max-width:none!important; overflow:visible!important; } body.gg-salon-room-v206.gg-salon-shop-v207 .room-main > .wrap, body.gg-salon-room-v206.gg-salon-shop-v207 .wrap.rich-avatar-shell, body.gg-salon-room-v206.gg-salon-shop-v207 .rich-avatar-shell{ width:100vw!important; max-width:none!important; margin:0!important; padding-left:0!important; padding-right:0!important; overflow:visible!important; } body.gg-salon-room-v206.gg-salon-shop-v207 .avatar-preview-card, body.gg-salon-room-v206.gg-salon-shop-v207 .rich-avatar-card, body.gg-salon-room-v206.gg-salon-shop-v207 .room-studio-card{ width:100vw!important; max-width:none!important; margin:0!important; padding-left:0!important; padding-right:0!important; border-left:0!important; border-right:0!important; border-radius:0!important; overflow:visible!important; } /* The actual Salon room now spans the entire horizontal viewport. */ body.gg-salon-room-v206.gg-salon-shop-v207 #avatarRoom{ width:100vw!important; max-width:none!important; min-width:100vw!important; left:auto!important; right:auto!important; margin:0!important; transform:none!important; border-left:0!important; border-right:0!important; border-radius:0!important; } /* ========================================================== v213 — NO WINDOW in Salon. Scene becomes a plain full-width sky backdrop. ========================================================== */ /* Remove the Frame category and all frame choices. */ body.gg-salon-shop-v207 [data-room-category="frame"], body.gg-salon-shop-v207 [data-frame-choice]{ display:none!important; } /* Scene container behaves as a sky/background, not a window. */ body.gg-salon-shop-v207 #roomSceneWindowV055, body.gg-salon-shop-v207 .room-scene-window-v055{ position:absolute!important; left:0!important; right:0!important; top:0!important; width:100%!important; height:46%!important; inset:auto 0 auto 0!important; border:0!important; outline:0!important; box-shadow:none!important; border-radius:0!important; clip-path:none!important; overflow:hidden!important; background:transparent!important; z-index:1!important; } /* Kill every pseudo-frame / curtain / decorative window edge. */ body.gg-salon-shop-v207 #roomSceneWindowV055::before, body.gg-salon-shop-v207 #roomSceneWindowV055::after, body.gg-salon-shop-v207 .room-scene-window-v055::before, body.gg-salon-shop-v207 .room-scene-window-v055::after{ content:none!important; display:none!important; border:0!important; outline:0!important; box-shadow:none!important; background:none!important; } /* Hide any old frame/curtain/window-chrome children created by older code. */ body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="frame"], body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="curtain"], body.gg-salon-shop-v207 [class*="window-frame"], body.gg-salon-shop-v207 [id*="WindowFrame"]{ display:none!important; } /* Lightning remains an effect in the sky, not window chrome. */ body.gg-salon-shop-v207 #roomWindowLightningV076{ position:absolute!important; inset:0!important; border:0!important; box-shadow:none!important; } /* Scene visual fills the sky region. */ body.gg-salon-shop-v207 #roomSceneVisualV055{ position:absolute!important; inset:0!important; width:100%!important; height:100%!important; display:block!important; visibility:visible!important; opacity:1!important; border:0!important; border-radius:0!important; } /* Keep shop building centered inside the full-width canvas. */ body.gg-salon-shop-v207 .gg-salon-shop-shell-v207{ left:9%!important; right:9%!important; width:auto!important; } /* Edit menu stays readable under full-width room instead of stretching edge-to-edge. */ body.gg-salon-shop-v207 #ggRoomEditBelowV212{ width:min(94vw,820px)!important; max-width:820px!important; margin:7px auto 0!important; } /* ========================================================== v214 — Goldie's Salon visibly wide/horizontal The actual shop building, not just the canvas, is widened. ========================================================== */ body.gg-salon-room-v206.gg-salon-shop-v207 .room-main, body.gg-salon-room-v206.gg-salon-shop-v207 .room-main>.wrap, body.gg-salon-room-v206.gg-salon-shop-v207 .rich-avatar-shell, body.gg-salon-room-v206.gg-salon-shop-v207 .room-studio-card{ width:100vw!important; max-width:100vw!important; margin-left:0!important; margin-right:0!important; padding-left:0!important; padding-right:0!important; } /* Force a landscape-like room shape even on portrait phones. */ body.gg-salon-room-v206.gg-salon-shop-v207 #avatarRoom{ width:100vw!important; min-width:100vw!important; max-width:100vw!important; height:clamp(390px,62vw,520px)!important; min-height:390px!important; max-height:520px!important; margin:0!important; left:0!important; right:0!important; transform:none!important; border-radius:0!important; } /* Shop itself goes almost edge-to-edge. */ body.gg-salon-shop-v207 .gg-salon-shop-shell-v207{ left:1.5%!important; right:1.5%!important; top:15%!important; bottom:0!important; width:auto!important; } /* Wider roof/sign and interior to make change visually obvious. */ body.gg-salon-shop-v207 .gg-salon-roof-v207{ left:-1%!important; right:-1%!important; height:12%!important; } body.gg-salon-shop-v207 .gg-salon-back-v207{ left:0!important; right:0!important; top:11%!important; bottom:0!important; height:auto!important; } body.gg-salon-shop-v207 .gg-salon-floor-v207{ left:0!important; right:0!important; top:46%!important; bottom:0!important; } /* Spread two salon chairs across the wider shop. */ body.gg-salon-shop-v207 .gg-salon-chair-v207.a{left:24%!important} body.gg-salon-shop-v207 .gg-salon-chair-v207.b{left:63%!important} body.gg-salon-shop-v207 .gg-salon-counter-v207{ right:4%!important; width:21%!important; } /* Scene is only sky, with absolutely no window shape. */ body.gg-salon-shop-v207 #roomSceneWindowV055{ position:absolute!important; left:0!important; right:0!important; top:0!important; width:100%!important; height:47%!important; inset:0 0 auto 0!important; border:0!important; border-radius:0!important; outline:0!important; box-shadow:none!important; clip-path:none!important; background:none!important; } body.gg-salon-shop-v207 #roomSceneWindowV055::before, body.gg-salon-shop-v207 #roomSceneWindowV055::after{ content:none!important; display:none!important; } body.gg-salon-shop-v207 [data-room-category="frame"], body.gg-salon-shop-v207 [data-frame-choice], body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="frame"], body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="curtain"]{ display:none!important; } /* Room avatar SVG is kept above clothing/objects at the room level too. */ .room-exact-avatar>svg{ overflow:visible!important; } /* ========================================================== v215 — Goldie's Salon cleanup / avatar scale normalization ========================================================== */ /* Raise avatar slightly from v214, but make it a little smaller. */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact{ bottom:1.5%!important; transform:translateX(-50%) scale(.52)!important; transform-origin:center bottom!important; } /* Remove ceiling/light fixture entirely from Goldie's Salon. */ body.gg-salon-shop-v207 #roomCeilingLightV072, body.gg-salon-shop-v207 [class*="ceiling-light"], body.gg-salon-shop-v207 [id*="CeilingLight"], body.gg-salon-shop-v207 .room-light-fixture, body.gg-salon-shop-v207 [data-room-category="lighting"], body.gg-salon-shop-v207 [data-room-category="light"]{ display:none!important; visibility:hidden!important; pointer-events:none!important; } /* Keep scene as plain sky only — no window/frame/opening chrome. */ body.gg-salon-shop-v207 #roomSceneWindowV055{ border:0!important; border-radius:0!important; outline:0!important; box-shadow:none!important; clip-path:none!important; background:transparent!important; } body.gg-salon-shop-v207 #roomSceneWindowV055::before, body.gg-salon-shop-v207 #roomSceneWindowV055::after, body.gg-salon-shop-v207 .room-scene-window-v055::before, body.gg-salon-shop-v207 .room-scene-window-v055::after{ content:none!important; display:none!important; } body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="frame"], body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="curtain"], body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="window"], body.gg-salon-shop-v207 [data-room-category="frame"], body.gg-salon-shop-v207 [data-frame-choice]{ display:none!important; } /* Remove floor holes/openings/transparent gaps from Salon. The shop floor becomes one continuous solid plane. */ body.gg-salon-shop-v207 .gg-salon-floor-v207{ left:0!important; right:0!important; top:45%!important; bottom:0!important; background: repeating-linear-gradient( 90deg, #6b5660 0 10%, #5a4851 10% 20% )!important; border:0!important; box-shadow:none!important; clip-path:none!important; overflow:hidden!important; } body.gg-salon-shop-v207 .gg-salon-floor-v207::before, body.gg-salon-shop-v207 .gg-salon-floor-v207::after, body.gg-salon-shop-v207 [class*="floor-hole"], body.gg-salon-shop-v207 [class*="floor-opening"], body.gg-salon-shop-v207 [id*="FloorHole"], body.gg-salon-shop-v207 [id*="FloorOpening"]{ content:none!important; display:none!important; } /* Hide the old generic room floor graphic so it cannot create visual gaps through the custom Salon floor. */ body.gg-salon-shop-v207 #floorLayer, body.gg-salon-shop-v207 .room-floor, body.gg-salon-shop-v207 [class*="floor-layer"]{ opacity:0!important; visibility:hidden!important; pointer-events:none!important; } /* ========================================================== v215 — Salon avatar animations respect the smaller .52 scale ========================================================== */ /* Care/interaction animations */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-v072-food, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-care-food-v065{ animation:ggSalonFoodV215 .7s ease-in-out 2!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-v072-feather, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-care-feather-v065{ animation:ggSalonTickleV215 .14s ease-in-out 10!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-v072-soap, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-care-soap-v065{ animation:ggSalonSoapV215 .65s ease-in-out 2!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-v072-tazer, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-care-tazer-v066{ animation:ggSalonZapV215 .09s linear 12!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-v072-makeup{ animation:ggSalonMakeupV215 .45s ease!important; } /* Idle reactions */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.idle-bounce-v057{ animation:ggSalonIdleBounceV215 .8s ease!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.idle-tilt-v057{ animation:ggSalonIdleTiltV215 .8s ease!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.idle-look-v057, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.idle-blink-v057, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.idle-yawn-v057, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.idle-sneeze-v057{ transform-origin:center bottom!important; } /* Every keyframe includes the Salon's base translate + .52 scale. */ @keyframes ggSalonFoodV215{ 0%,100%{transform:translateX(-50%) scale(.52)} 35%{transform:translateX(-50%) scale(.54) rotate(-2deg)} 70%{transform:translateX(-50%) scale(.54) rotate(2deg)} } @keyframes ggSalonTickleV215{ 0%,100%{transform:translateX(-50%) scale(.52) rotate(0)} 50%{transform:translateX(calc(-50% + 3px)) scale(.52) rotate(1.5deg)} } @keyframes ggSalonSoapV215{ 0%,100%{transform:translateX(-50%) scale(.52)} 50%{transform:translateX(-50%) scale(.535) rotate(1deg)} } @keyframes ggSalonZapV215{ 0%,100%{transform:translateX(-50%) scale(.52)} 25%{transform:translateX(calc(-50% - 3px)) scale(.52) rotate(-1.5deg)} 75%{transform:translateX(calc(-50% + 3px)) scale(.52) rotate(1.5deg)} } @keyframes ggSalonMakeupV215{ 0%,100%{transform:translateX(-50%) scale(.52)} 50%{transform:translateX(-50%) scale(.53)} } @keyframes ggSalonIdleBounceV215{ 0%,100%{transform:translateX(-50%) translateY(0) scale(.52)} 50%{transform:translateX(-50%) translateY(-8px) scale(.52)} } @keyframes ggSalonIdleTiltV215{ 0%,100%{transform:translateX(-50%) scale(.52) rotate(0)} 50%{transform:translateX(-50%) scale(.52) rotate(4deg)} } /* ========================================================== v216 — Goldie's Salon flat 2D side-view storefront ========================================================== */ /* The whole Salon is now roughly half the previous vertical size. Keep full-width horizontal presentation for future second-floor expansion. */ body.gg-salon-room-v206.gg-salon-shop-v207 #avatarRoom{ width:100vw!important; min-width:100vw!important; max-width:100vw!important; height:clamp(260px,34vw,330px)!important; min-height:260px!important; max-height:330px!important; overflow:hidden!important; perspective:none!important; } /* Flatten building into a straight 2D side elevation. */ body.gg-salon-shop-v207 .gg-salon-shop-shell-v207{ position:absolute!important; left:1%!important; right:1%!important; top:9%!important; bottom:0!important; transform:none!important; perspective:none!important; } /* Lower roof significantly so building reads as a one-story storefront. */ body.gg-salon-shop-v207 .gg-salon-roof-v207{ position:absolute!important; left:0!important; right:0!important; top:0!important; height:15%!important; transform:none!important; border-radius:4px 4px 0 0!important; box-shadow:none!important; z-index:30!important; } /* Remove visible back wall entirely. The sky/background remains visible behind the open-front 2D shop. */ body.gg-salon-shop-v207 .gg-salon-back-v207{ display:none!important; visibility:hidden!important; opacity:0!important; } /* One solid wall/floor slab from below roof to bottom. This replaces every previous floor layer and closes the two holes. */ body.gg-salon-shop-v207 .gg-salon-floor-v207{ position:absolute!important; left:0!important; right:0!important; top:15%!important; bottom:0!important; width:100%!important; height:auto!important; transform:none!important; perspective:none!important; clip-path:none!important; border:0!important; border-radius:0!important; box-shadow:none!important; overflow:hidden!important; background: linear-gradient( to bottom, #4a3b43 0%, #4a3b43 56%, #66515c 56%, #66515c 100% )!important; } /* Hard-cover any holes/gaps from older floor renderers. */ body.gg-salon-shop-v207 .gg-salon-floor-v207::before{ content:""!important; display:block!important; position:absolute!important; inset:0!important; background: linear-gradient( to bottom, transparent 0 56%, #66515c 56% 100% )!important; z-index:1!important; pointer-events:none!important; } body.gg-salon-shop-v207 .gg-salon-floor-v207::after{ content:none!important; display:none!important; } /* Suppress every legacy room floor/opening/hole layer underneath. */ body.gg-salon-shop-v207 #floorLayer, body.gg-salon-shop-v207 .room-floor, body.gg-salon-shop-v207 [class*="floor-layer"], body.gg-salon-shop-v207 [class*="floor-hole"], body.gg-salon-shop-v207 [class*="floor-opening"], body.gg-salon-shop-v207 [id*="FloorHole"], body.gg-salon-shop-v207 [id*="FloorOpening"]{ display:none!important; visibility:hidden!important; } /* Chairs/counter flattened — no perspective/3D depth. */ body.gg-salon-shop-v207 .gg-salon-chair-v207, body.gg-salon-shop-v207 .gg-salon-counter-v207{ transform:none!important; perspective:none!important; box-shadow:none!important; } /* Shorter door in Salon only. Catch known and generic room-door selectors. */ body.gg-salon-shop-v207 #roomDoor, body.gg-salon-shop-v207 #roomDoorV055, body.gg-salon-shop-v207 #roomDoorV061, body.gg-salon-shop-v207 [id*="roomDoor"], body.gg-salon-shop-v207 [class*="room-door"], body.gg-salon-shop-v207 [class*="salon-door"]{ height:34%!important; max-height:105px!important; min-height:0!important; bottom:0!important; top:auto!important; transform-origin:center bottom!important; } /* If the door is SVG/decor rather than a DOM door wrapper, constrain matching decor. */ body.gg-salon-shop-v207 [data-room-decor*="door" i], body.gg-salon-shop-v207 [data-room-option*="door" i]{ --gg-salon-door-scale-v216:.68; } /* Scene remains a flat sky strip behind roof/storefront. */ body.gg-salon-shop-v207 #roomSceneWindowV055{ position:absolute!important; left:0!important; right:0!important; top:0!important; width:100%!important; height:46%!important; border:0!important; border-radius:0!important; box-shadow:none!important; background:transparent!important; z-index:1!important; } body.gg-salon-shop-v207 #roomSceneVisualV055{ width:100%!important; height:100%!important; object-fit:cover!important; } /* Keep avatar small and visible in the shorter 2D building. */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact{ bottom:1%!important; transform:translateX(-50%) scale(.44)!important; transform-origin:center bottom!important; } /* Scale Salon-specific interactions to the new .44 avatar size. */ @keyframes ggSalonFoodV216{ 0%,100%{transform:translateX(-50%) scale(.44)} 35%{transform:translateX(-50%) scale(.455) rotate(-2deg)} 70%{transform:translateX(-50%) scale(.455) rotate(2deg)} } @keyframes ggSalonTickleV216{ 0%,100%{transform:translateX(-50%) scale(.44) rotate(0)} 50%{transform:translateX(calc(-50% + 3px)) scale(.44) rotate(1.5deg)} } @keyframes ggSalonSoapV216{ 0%,100%{transform:translateX(-50%) scale(.44)} 50%{transform:translateX(-50%) scale(.452)} } @keyframes ggSalonZapV216{ 0%,100%{transform:translateX(-50%) scale(.44)} 25%{transform:translateX(calc(-50% - 3px)) scale(.44) rotate(-1.5deg)} 75%{transform:translateX(calc(-50% + 3px)) scale(.44) rotate(1.5deg)} } @keyframes ggSalonIdleBounceV216{ 0%,100%{transform:translateX(-50%) translateY(0) scale(.44)} 50%{transform:translateX(-50%) translateY(-6px) scale(.44)} } @keyframes ggSalonIdleTiltV216{ 0%,100%{transform:translateX(-50%) scale(.44) rotate(0)} 50%{transform:translateX(-50%) scale(.44) rotate(4deg)} } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-v072-food, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-care-food-v065{ animation:ggSalonFoodV216 .7s ease-in-out 2!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-v072-feather, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-care-feather-v065{ animation:ggSalonTickleV216 .14s ease-in-out 10!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-v072-soap, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-care-soap-v065{ animation:ggSalonSoapV216 .65s ease-in-out 2!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-v072-tazer, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.gg-care-tazer-v066{ animation:ggSalonZapV216 .09s linear 12!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.idle-bounce-v057{ animation:ggSalonIdleBounceV216 .8s ease!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact.idle-tilt-v057{ animation:ggSalonIdleTiltV216 .8s ease!important; } /* Leave vertical space reservation clean for a future second floor. Future floor can occupy top:0..50% without replacing the lower shop engine. */ body.gg-salon-shop-v207 #avatarRoom{ --gg-salon-floor-count:1; --gg-salon-future-second-floor-ready:1; } /* ========================================================== v217 — Goldie's Salon avatar point-to-move control ========================================================== */ /* Wrapper preserves Avatar category slot and puts ↑ directly underneath. */ body.gg-salon-shop-v207 .gg-salon-avatar-move-holder-v217{ position:relative!important; display:inline-flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; gap:2px!important; flex:0 0 auto!important; overflow:visible!important; } body.gg-salon-shop-v207 .gg-salon-avatar-move-holder-v217 > [data-room-category="care"], body.gg-salon-shop-v207 .gg-salon-avatar-move-holder-v217 > [data-room-category="avatar"]{ margin:0!important; } /* Small arrow immediately under Avatar icon. */ body.gg-salon-shop-v207 #ggSalonMoveAvatarV217{ width:28px!important; height:22px!important; min-width:28px!important; min-height:22px!important; padding:0!important; margin:0!important; display:grid!important; place-items:center!important; border:1px solid rgba(215,176,91,.52)!important; border-radius:8px!important; background:rgba(17,15,20,.94)!important; color:#eacb72!important; font-size:17px!important; font-weight:1000!important; line-height:1!important; cursor:pointer!important; opacity:.78!important; z-index:9000!important; } body.gg-salon-shop-v207 #ggSalonMoveAvatarV217.active{ opacity:1!important; color:#111!important; background:#e2bd61!important; box-shadow:0 0 11px rgba(226,189,97,.5)!important; } /* Move mode gives clear feedback. */ body.gg-salon-shop-v207 #avatarRoom.gg-salon-move-mode-v217{ cursor:crosshair!important; } body.gg-salon-shop-v207 #avatarRoom.gg-salon-move-mode-v217 .room-avatar.room-avatar-exact{ cursor:pointer!important; } body.gg-salon-shop-v207 #avatarRoom.gg-salon-avatar-selected-v217 .room-avatar.room-avatar-exact{ filter: drop-shadow(0 0 5px rgba(255,232,128,.95)) drop-shadow(0 0 13px rgba(215,176,91,.75))!important; } /* Once manually moved, preserve its selected position instead of old center rules. */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact[data-salon-moved-v217="1"]{ position:absolute!important; transform:translateX(-50%) scale(.44)!important; transform-origin:center bottom!important; } /* Existing Salon animations continue at .44 scale even after avatar was moved. */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact[data-salon-moved-v217="1"].gg-v072-food, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact[data-salon-moved-v217="1"].gg-care-food-v065{ animation:ggSalonFoodV216 .7s ease-in-out 2!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact[data-salon-moved-v217="1"].gg-v072-feather, body.gg-salon-shop-v207 .room-avatar.room-avatar-exact[data-salon-moved-v217="1"].gg-care-feather-v065{ animation:ggSalonTickleV216 .14s ease-in-out 10!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact[data-salon-moved-v217="1"].idle-bounce-v057{ animation:ggSalonIdleBounceV216 .8s ease!important; } body.gg-salon-shop-v207 .room-avatar.room-avatar-exact[data-salon-moved-v217="1"].idle-tilt-v057{ animation:ggSalonIdleTiltV216 .8s ease!important; } /* ========================================================== v218 — Move ↑ lives UNDER Avatar icon INSIDE selection row ========================================================== */ body.gg-salon-shop-v207 .gg-salon-avatar-move-holder-v217{ position:relative!important; display:inline-flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; gap:0!important; flex:0 0 auto!important; min-height:58px!important; padding-bottom:0!important; overflow:visible!important; } /* Keep the normal Avatar selection icon at the top of its own slot. */ body.gg-salon-shop-v207 .gg-salon-avatar-move-holder-v217 > [data-room-category="care"], body.gg-salon-shop-v207 .gg-salon-avatar-move-holder-v217 > [data-room-category="avatar"]{ position:relative!important; margin:0!important; z-index:2!important; } /* ↑ is now part of the Avatar selection slot, tucked immediately below it. */ body.gg-salon-shop-v207 .gg-salon-avatar-move-holder-v217 #ggSalonMoveAvatarV217{ position:relative!important; left:auto!important; right:auto!important; top:auto!important; bottom:auto!important; transform:none!important; width:24px!important; height:18px!important; min-width:24px!important; min-height:18px!important; margin:-2px 0 0!important; padding:0!important; border-radius:0 0 7px 7px!important; font-size:15px!important; line-height:16px!important; z-index:1!important; } /* Give the category row enough height so the arrow stays inside the selection menu. */ body.gg-salon-shop-v207 #roomCategoryLoop{ align-items:flex-start!important; min-height:60px!important; overflow-y:visible!important; } body.gg-salon-shop-v207 #ggRoomEditBelowV212 .room-category-wrap-v061{ overflow:visible!important; } /* ========================================================== v219 — room gesture capture + Skull face semantic layer ========================================================== */ body.room-page-v054 #avatarRoom{ touch-action:none!important; overscroll-behavior:contain!important; } /* Skull/Skeleton head is treated as the base head surface. Facial cosmetics remain normal interactive/rendered layers above it. */ #avatarSvg #headAccessory{ pointer-events:none!important; } /* ========================================================== v220 — Face Tats + rap reactions ========================================================== */ .gg-face-tats-v220{ pointer-events:none!important; } /* Avatar Studio rap motion */ .gg-rapping-v220 #avatarSvg, #avatarSvg.gg-rapping-v220{ transform-origin:center bottom!important; animation:ggAvatarRapV220 .42s ease-in-out 6!important; } @keyframes ggAvatarRapV220{ 0%,100%{transform:translateY(0) rotate(0deg)} 25%{transform:translateY(-3px) rotate(-1.5deg)} 50%{transform:translateY(1px) rotate(1deg)} 75%{transform:translateY(-2px) rotate(1.5deg)} } .gg-rap-bubble-v220{ position:absolute!important; left:50%!important; top:8%!important; transform:translate(-50%,-8px) scale(.94)!important; opacity:0!important; pointer-events:none!important; z-index:2147483000!important; padding:7px 11px!important; border-radius:999px!important; background:rgba(13,12,17,.94)!important; border:1px solid rgba(215,176,91,.6)!important; color:#f3d77f!important; font-size:11px!important; font-weight:900!important; white-space:nowrap!important; transition:.18s ease!important; } .gg-rap-bubble-v220.show{ opacity:1!important; transform:translate(-50%,0) scale(1)!important; } /* Room rap motion preserves room placement/scale better by animating inner SVG. */ .gg-room-rapping-v220 .room-exact-avatar>svg{ transform-origin:center bottom!important; animation:ggRoomRapV220 .38s ease-in-out 6!important; } @keyframes ggRoomRapV220{ 0%,100%{transform:translateY(0) rotate(0deg)} 25%{transform:translateY(-3px) rotate(-1.5deg)} 50%{transform:translateY(1px) rotate(1deg)} 75%{transform:translateY(-2px) rotate(1.5deg)} } .gg-room-rap-bubble-v220{ position:absolute!important; left:50%!important; bottom:38%!important; transform:translate(-50%,8px)!important; opacity:0!important; pointer-events:none!important; z-index:9500!important; padding:6px 10px!important; border-radius:999px!important; background:rgba(13,12,17,.94)!important; border:1px solid rgba(215,176,91,.6)!important; color:#f3d77f!important; font-size:10px!important; font-weight:900!important; white-space:nowrap!important; transition:.18s ease!important; } .gg-room-rap-bubble-v220.show{ opacity:1!important; transform:translate(-50%,0)!important; } /* Keep Face Tats below glasses/lashes/masks/hair by DOM order; semantic safety */ #avatarSvg #ggFaceTatsLayerV220{ pointer-events:none!important; } /* Small performance wins */ #avatarRoom, #avatarSvg, .room-exact-avatar>svg{ contain:layout style; } @media (prefers-reduced-motion:reduce){ .gg-rapping-v220 #avatarSvg, .gg-room-rapping-v220 .room-exact-avatar>svg{ animation:none!important; } } /* ========================================================== v221 — Goldie's Salon avatar placement ========================================================== */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact{ bottom:8%!important; transform:translateX(-50%) scale(.41)!important; transform-origin:center bottom!important; } /* Moved avatars in Salon preserve Salon scale */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact[data-moved-v221="1"], body.gg-salon-shop-v207 .room-avatar.room-avatar-exact[data-salon-moved-v217="1"]{ transform:translateX(-50%) scale(.41)!important; } /* ========================================================== v221 — move tool belongs INSIDE Avatar tools/options ========================================================== */ #ggRoomMoveAvatarToolV221{ border-color:rgba(215,176,91,.55)!important; } #ggRoomMoveAvatarToolV221 i{ font-style:normal!important; font-size:20px!important; } #ggRoomMoveAvatarToolV221.selected{ border-color:#e0ba5c!important; color:#f4d678!important; box-shadow:0 0 10px rgba(224,186,92,.4)!important; } #avatarRoom.gg-room-move-mode-v221{ cursor:crosshair!important; } #avatarRoom.gg-room-avatar-selected-v221 .room-avatar.room-avatar-exact{ filter: drop-shadow(0 0 5px rgba(255,232,128,.95)) drop-shadow(0 0 13px rgba(215,176,91,.75))!important; } /* Hide the superseded standalone Salon arrow if any legacy code rebuilds it. */ body.gg-salon-shop-v207 #ggSalonMoveAvatarV217{ display:none!important; } /* ========================================================== v221 — double-tap light feedback ========================================================== */ #roomOptionLoop [data-room-option].gg-light-armed-v221{ outline:3px solid #f0cf74!important; outline-offset:2px!important; filter:brightness(1.25)!important; animation:ggLightArmV221 .75s ease!important; } @keyframes ggLightArmV221{ 0%,100%{transform:scale(1)} 50%{transform:scale(1.06)} } /* ========================================================== v221 — doors more visible in BOTH rooms ========================================================== */ body.room-page-v054 #roomDoorV114, body.room-page-v054 .gg-room-door-v114, body.room-page-v054 [data-room-door], body.room-page-v054 .room-door, body.room-page-v054 .avatar-room-door, body.room-page-v054 .gg-side-door-v111{ opacity:1!important; filter: brightness(1.18) drop-shadow(0 0 5px rgba(215,176,91,.55)) drop-shadow(0 3px 8px rgba(0,0,0,.55))!important; border-color:#d7b05b!important; } /* Salon Home door icon next to Avatar category */ body.gg-salon-shop-v207 #ggSalonHomeDoorV221{ display:inline-flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; min-width:54px!important; min-height:54px!important; border:1px solid rgba(215,176,91,.6)!important; background:#17151a!important; color:#f0cf74!important; border-radius:12px!important; opacity:1!important; } body.gg-salon-shop-v207 #ggSalonHomeDoorV221 i{ font-style:normal!important; font-size:22px!important; } body.gg-salon-shop-v207 #ggSalonHomeDoorV221 span{ font-size:8px!important; font-weight:900!important; } /* ========================================================== v221 — Face Tats guaranteed visible ========================================================== */ #avatarSvg #ggFaceTatsLayerV221{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } #avatarSvg .gg-face-tats-v221{ display:inline!important; visibility:visible!important; opacity:1!important; } /* Serialized Room version stays visible too */ .room-exact-avatar svg #ggFaceTatsLayerV221{ display:inline!important; visibility:visible!important; opacity:1!important; } /* ========================================================== v221 — room depth sorting ========================================================== */ #avatarRoom .room-avatar.room-avatar-exact{ z-index:9000!important; } /* ========================================================== v222 — Goldie's Salon structural cleanup ========================================================== */ /* Raise avatar fully above floor */ body.gg-salon-shop-v207 .room-avatar.room-avatar-exact{ bottom:17%!important; transform:translateX(-50%) scale(.41)!important; } /* Flat solid salon body: no holes, no windows, no back-wall cutouts */ body.gg-salon-shop-v207 .gg-salon-shop-shell-v207{ background:#4a3b43!important; overflow:hidden!important; } body.gg-salon-shop-v207 .gg-salon-back-v207{ display:block!important; position:absolute!important; left:0!important; right:0!important; top:15%!important; bottom:0!important; width:100%!important; height:auto!important; background:#4a3b43!important; border:0!important; box-shadow:none!important; clip-path:none!important; z-index:2!important; } /* cover any old square/window-like holes */ body.gg-salon-shop-v207 .gg-salon-back-v207::before, body.gg-salon-shop-v207 .gg-salon-back-v207::after{ content:""!important; position:absolute!important; inset:0!important; background:#4a3b43!important; display:block!important; border:0!important; box-shadow:none!important; } /* solid floor slab, no cutouts */ body.gg-salon-shop-v207 .gg-salon-floor-v207{ background:#66515c!important; border:0!important; box-shadow:none!important; clip-path:none!important; } body.gg-salon-shop-v207 .gg-salon-floor-v207::before, body.gg-salon-shop-v207 .gg-salon-floor-v207::after{ content:none!important; display:none!important; } /* remove the random right-side rectangle/counter */ body.gg-salon-shop-v207 .gg-salon-counter-v207{ display:none!important; } /* ========================================================== v222 — larger Salon speech bubble ========================================================== */ body.gg-salon-shop-v207 .gg-salon-talk-bubble-v222{ position:absolute!important; left:50%!important; top:8%!important; transform:translate(-50%,-8px) scale(.96)!important; width:min(78%,520px)!important; min-height:48px!important; padding:12px 16px!important; border-radius:18px!important; background:rgba(13,12,17,.95)!important; border:1px solid rgba(215,176,91,.65)!important; color:#f4de9a!important; font-size:14px!important; line-height:1.35!important; font-weight:850!important; text-align:center!important; white-space:normal!important; opacity:0!important; pointer-events:none!important; z-index:9600!important; box-shadow:0 10px 28px rgba(0,0,0,.42)!important; transition:.2s ease!important; } body.gg-salon-shop-v207 .gg-salon-talk-bubble-v222.show{ opacity:1!important; transform:translate(-50%,0) scale(1)!important; } /* Existing rap/talk bubble larger in Salon too */ body.gg-salon-shop-v207 .gg-room-rap-bubble-v220{ width:min(74%,480px)!important; padding:10px 14px!important; font-size:13px!important; line-height:1.3!important; white-space:normal!important; text-align:center!important; } /* ========================================================== v222 — top-right Home Studio door icon ========================================================== */ body.gg-salon-shop-v207 #ggSalonHomeHudV222{ position:fixed!important; right:12px!important; top:118px!important; width:42px!important; height:42px!important; border-radius:50%!important; border:1px solid rgba(215,176,91,.68)!important; background:rgba(19,16,22,.95)!important; color:#f2d37c!important; display:grid!important; place-items:center!important; font-size:21px!important; z-index:2147483600!important; box-shadow:0 6px 18px rgba(0,0,0,.38)!important; } /* ========================================================== v222 — in-room doors shorter, farther right, more visible ========================================================== */ body.room-page-v054 #roomDoorV114, body.room-page-v054 .gg-room-door-v114, body.room-page-v054 [data-room-door], body.room-page-v054 .room-door, body.room-page-v054 .avatar-room-door, body.room-page-v054 .gg-side-door-v111{ right:2px!important; left:auto!important; height:78px!important; max-height:78px!important; bottom:7%!important; opacity:.95!important; z-index:8200!important; } /* Salon door specifically even shorter and further right */ body.gg-salon-shop-v207 #roomDoorV114, body.gg-salon-shop-v207 .gg-room-door-v114, body.gg-salon-shop-v207 [data-room-door], body.gg-salon-shop-v207 .room-door, body.gg-salon-shop-v207 .avatar-room-door, body.gg-salon-shop-v207 .gg-side-door-v111{ right:-2px!important; left:auto!important; height:68px!important; max-height:68px!important; bottom:8%!important; opacity:1!important; } /* Keep door clear of sound/random/undo vertical HUD */ body.gg-salon-shop-v207 .room-hud-right, body.gg-salon-shop-v207 [class*="room-hud"]{ z-index:9000!important; } /* ========================================================== v222 — Face Tats visibility ========================================================== */ #avatarSvg #ggFaceTatsLayerV222, #avatarSvg .gg-face-tats-v222, .room-exact-avatar svg #ggFaceTatsLayerV222{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } /* Old v220/v221 Face Tats layers hidden to prevent collisions */ #avatarSvg #ggFaceTatsLayerV220, #avatarSvg #ggFaceTatsLayerV221{ display:none!important; } /* ========================================================== v223 — Face Tats now use the proven v173 face-cosmetics layer ========================================================== */ #avatarSvg .gg-face-tats-v223, .room-exact-avatar svg .gg-face-tats-v223{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } /* Retire the experimental v220-v222 dedicated tattoo layers. */ #ggFaceTatsLayerV220, #ggFaceTatsLayerV221, #ggFaceTatsLayerV222{ display:none!important; } /* ========================================================== v224 — Move Avatar is floor-only ========================================================== */ /* Move mode still selects the room, but valid movement is the lower floor zone only. */ #avatarRoom.gg-room-move-mode-v221::after{ content:""!important; position:absolute!important; left:0!important; right:0!important; bottom:0!important; height:42%!important; border-top:1px dashed rgba(215,176,91,.28)!important; background:linear-gradient(to top,rgba(215,176,91,.045),transparent)!important; pointer-events:none!important; z-index:2!important; } /* Salon's usable floor starts slightly higher in its flat 2D layout. */ body.gg-salon-shop-v207 #avatarRoom.gg-room-move-mode-v221::after{ height:52%!important; } /* Avatar remains above the floor guide. */ #avatarRoom.gg-room-move-mode-v221 .room-avatar.room-avatar-exact{ z-index:9000!important; } /* ========================================================== Horizontal-only avatar movement — Home + Goldie's Salon ========================================================== */ /* Position changes animate as a smooth left/right slide. */ #avatarRoom .room-avatar.room-avatar-exact{ transition:left .48s cubic-bezier(.22,.7,.2,1), bottom .15s ease!important; } #avatarRoom .room-avatar.room-avatar-exact.gg-avatar-sliding-horizontal{ transition:left .48s cubic-bezier(.22,.7,.2,1)!important; } /* Move mode now communicates horizontal movement rather than a floor area. */ #avatarRoom.gg-room-move-mode-v221::after{ content:"↔"!important; position:absolute!important; left:50%!important; right:auto!important; bottom:10px!important; top:auto!important; width:auto!important; height:auto!important; transform:translateX(-50%)!important; border:0!important; background:none!important; color:rgba(240,207,116,.45)!important; font-size:28px!important; font-weight:900!important; line-height:1!important; pointer-events:none!important; z-index:2!important; } /* Salon uses the same horizontal guide. */ body.gg-salon-shop-v207 #avatarRoom.gg-room-move-mode-v221::after{ height:auto!important; } /* Stable Face Tats */ #avatarSvg #ggFaceTatsStable, #avatarSvg .gg-face-tats-stable, .room-exact-avatar svg #ggFaceTatsStable, .room-exact-avatar svg .gg-face-tats-stable{ display:inline!important; visibility:visible!important; opacity:1!important; pointer-events:none!important; } /* ========================================================== Goldie's Salon — one-piece solid wall, zero cut-outs ========================================================== */ body.gg-salon-shop-v207 #ggSalonSolidWall{ position:absolute!important; left:0!important; right:0!important; top:14%!important; bottom:0!important; display:block!important; background:#4a3b43!important; border:0!important; border-radius:0!important; box-shadow:none!important; clip-path:none!important; overflow:hidden!important; z-index:5!important; pointer-events:none!important; } body.gg-salon-shop-v207 #ggSalonSolidWall::before, body.gg-salon-shop-v207 #ggSalonSolidWall::after{ content:none!important; display:none!important; } /* Retire all older back-wall/window hole geometry. */ body.gg-salon-shop-v207 .gg-salon-back-v207, body.gg-salon-shop-v207 #wallLayer, body.gg-salon-shop-v207 .room-wall, body.gg-salon-shop-v207 [class*="wall-layer"], body.gg-salon-shop-v207 #roomSceneWindowV055{ background:transparent!important; border:0!important; box-shadow:none!important; clip-path:none!important; } /* Scene remains sky only ABOVE the roof/wall. */ body.gg-salon-shop-v207 #roomSceneWindowV055{ top:0!important; bottom:auto!important; height:14%!important; z-index:1!important; } /* Ensure no frame/window children can punch square openings through the solid wall. */ body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="frame"], body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="window"], body.gg-salon-shop-v207 #roomSceneWindowV055 [class*="curtain"], body.gg-salon-shop-v207 [data-frame-choice]{ display:none!important; } /* Furnishings remain above the wall panel. */ body.gg-salon-shop-v207 .gg-salon-floor-v207, body.gg-salon-shop-v207 .gg-salon-chair-v207, body.gg-salon-shop-v207 [data-room-object], body.gg-salon-shop-v207 [data-room-decor]{ position:relative; z-index:20!important; } /* ========================================================== Avatar care/reaction bubbles — centered ABOVE avatar and front-most ========================================================== */ /* Speech bubbles */ .room-avatar.room-avatar-exact .gg-avatar-speech-v115, .room-avatar.room-avatar-exact [class*="speech"], .room-avatar.room-avatar-exact [class*="bubble"], .room-avatar.room-avatar-exact [class*="heart"], .room-avatar.room-avatar-exact [class*="foam"]{ position:absolute!important; left:50%!important; right:auto!important; top:-18px!important; bottom:auto!important; transform:translate(-50%,-100%)!important; transform-origin:center bottom!important; z-index:12000!important; pointer-events:none!important; } /* Standalone room care effects and bubbles */ #avatarRoom .gg-care-hearts-v065, #avatarRoom .gg-care-bubbles-v065, #avatarRoom .gg-v072-bubbles, #avatarRoom .gg-v072-hearts, #avatarRoom [class*="care-bubble"], #avatarRoom [class*="care-heart"], #avatarRoom [class*="room-bubble"], #avatarRoom [class*="avatar-bubble"]{ z-index:12000!important; pointer-events:none!important; } /* Any bubble visually attached to the avatar cannot be buried by avatar/object depth sorting. */ #avatarRoom .room-avatar.room-avatar-exact{ isolation:isolate!important; } #avatarRoom .room-avatar.room-avatar-exact > [class*="bubble"], #avatarRoom .room-avatar.room-avatar-exact > [class*="speech"], #avatarRoom .room-avatar.room-avatar-exact > [class*="heart"], #avatarRoom .room-avatar.room-avatar-exact > [class*="foam"]{ z-index:12000!important; } body.gg-salon-shop-v207 #ggSalonHomeHudV222{ position:fixed!important; top:auto!important; left:auto!important; right:auto!important; margin:0!important; } /* Salon box removal — remove the two built-in rectangle/chair shapes */ body.gg-salon-shop-v207 .gg-salon-chair-v207, body.gg-salon-shop-v207 .gg-salon-chair-v207.a, body.gg-salon-shop-v207 .gg-salon-chair-v207.b{ display:none!important; visibility:hidden!important; opacity:0!important; pointer-events:none!important; } /* Goldie Dreadlocks carousel */ .gg-dreadlocks-section{margin:14px 0 22px!important} .gg-dreadlocks-head{width:min(100%,760px)!important;margin:0 auto 10px!important;padding:0 16px!important} .gg-dreadlocks-head h2{margin:0!important;color:#e7c66c!important;font-size:clamp(22px,6vw,34px)!important;letter-spacing:.04em!important} .gg-dread-carousel-shell{width:100%!important;overflow:hidden!important} .gg-dread-carousel{ display:flex!important;gap:12px!important;overflow-x:auto!important;overflow-y:hidden!important; scroll-snap-type:x mandatory!important;scroll-behavior:smooth!important;-webkit-overflow-scrolling:touch!important; scrollbar-width:none!important;overscroll-behavior-x:contain!important; padding:4px max(14px,calc((100vw - min(82vw,360px))/2)) 12px!important } .gg-dread-carousel::-webkit-scrollbar{display:none!important} .gg-dread-card{ flex:0 0 min(82vw,360px)!important;width:min(82vw,360px)!important;aspect-ratio:1/1!important; position:relative!important;overflow:hidden!important;border-radius:18px!important; border:1px solid rgba(215,176,91,.48)!important;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; scroll-snap-align:center!important;box-shadow:0 10px 30px rgba(0,0,0,.28)!important;color:#181818;} .gg-dread-card img{width:100%!important;height:100%!important;display:block!important;object-fit:cover!important} .gg-dread-card-copy{ position:absolute!important;left:0!important;right:0!important;bottom:0!important; display:flex!important;flex-direction:column!important;gap:2px!important;padding:34px 13px 12px!important; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important;color:#181818!important;} .gg-dread-card-copy b{font-size:15px!important;color:#f1d477!important} .gg-dread-card-copy span{font-size:12px!important;opacity:.88!important} @media (min-width:700px){.gg-dread-card{flex-basis:320px!important;width:320px!important}} /* Dreadlocks carousel stability fix */ #ggDreadCarousel{ scroll-snap-type:x proximity!important; touch-action:pan-x!important; overscroll-behavior-x:contain!important; } #ggDreadCarousel .gg-dread-card{ scroll-snap-stop:normal!important; } #ggDreadCarousel img{ user-select:none!important; -webkit-user-drag:none!important; pointer-events:none!important; } .gg-custom-cuts-section{margin-top:24px!important} /* Goldie carousel: allow normal vertical page scrolling on touch */ #ggDreadCarousel, #ggCustomCutsCarousel, .gg-dread-carousel-shell{ touch-action:pan-y pinch-zoom!important; overscroll-behavior-y:auto!important; } #ggDreadCarousel, #ggCustomCutsCarousel{ overscroll-behavior-x:contain!important; } /* Goldie carousel dual-axis gesture fix: vertical swipe = page scroll; horizontal swipe = carousel */ #ggDreadCarousel, #ggCustomCutsCarousel, .gg-dread-carousel-shell{ touch-action:pan-y pinch-zoom!important; } #ggDreadCarousel, #ggCustomCutsCarousel{ overflow-x:auto!important; overflow-y:hidden!important; -webkit-overflow-scrolling:touch!important; scroll-snap-type:x mandatory!important; overscroll-behavior-x:contain!important; overscroll-behavior-y:auto!important; } #ggDreadCarousel .gg-dread-card, #ggCustomCutsCarousel .gg-dread-card{ scroll-snap-align:center!important; } /* ========================================================== Goldie carousel — native mobile touch scrolling Browser decides gesture axis: horizontal drag -> carousel vertical drag -> page ========================================================== */ #ggDreadCarousel, #ggCustomCutsCarousel{ display:flex!important; overflow-x:scroll!important; overflow-y:hidden!important; -webkit-overflow-scrolling:touch!important; /* 'auto' allows the browser to arbitrate horizontal vs vertical gestures. */ touch-action:auto!important; scroll-snap-type:x mandatory!important; scroll-behavior:smooth!important; overscroll-behavior-x:contain!important; overscroll-behavior-y:auto!important; } #ggDreadCarousel .gg-dread-card, #ggCustomCutsCarousel .gg-dread-card{ flex-shrink:0!important; scroll-snap-align:center!important; scroll-snap-stop:normal!important; } /* Images themselves must never capture the drag. */ #ggDreadCarousel img, #ggCustomCutsCarousel img{ pointer-events:none!important; user-select:none!important; -webkit-user-select:none!important; -webkit-user-drag:none!important; } /* Wrapper does not impose gesture restrictions. */ .gg-dread-carousel-shell{ touch-action:auto!important; overflow:hidden!important; } .gg-home-book-wrap-v230{position:sticky!important;top:68px!important;z-index:2147482500!important;display:flex!important;justify-content:center!important;padding-top:6px!important;pointer-events:none!important} .gg-home-book-v230{pointer-events:auto!important;min-width:132px!important;text-align:center!important} .gg-menu-toggle-v230{width:36px!important;height:36px!important;padding:7px!important;border-radius:10px!important;display:inline-flex!important;flex-direction:column!important;justify-content:center!important;gap:4px!important} .gg-menu-toggle-v230 span{display:block!important;width:100%!important;height:2px!important;background:currentColor!important} .gg-main-menu-panel-v230{position:fixed!important;top:64px!important;right:10px!important;width:min(220px,72vw)!important;padding:8px!important;border-radius:14px!important;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important;z-index:2147483600!important;color:#181818;} .gg-main-menu-panel-v230 a{display:block!important;padding:10px 12px!important;color:#f3e9cf!important;text-decoration:none!important} body.sun-theme p,body.sun-theme li,body.sun-theme small,body.theme-sun p,body.theme-sun li,body.theme-sun small,body[data-theme="sun"] p,body[data-theme="sun"] li,body[data-theme="sun"] small{color:#211b18!important} body.sun-theme h1,body.sun-theme h2,body.sun-theme h3,body.theme-sun h1,body.theme-sun h2,body.theme-sun h3,body[data-theme="sun"] h1,body[data-theme="sun"] h2,body[data-theme="sun"] h3{color:#17120f!important} /* ========================================================== v230 — Goldie's Salon economy/customer/chair UI ========================================================== */ body.gg-salon-shop-v207 #roomMoodGaugeV065{display:none!important} .gg-salon-money-v230{ position:absolute!important;left:8px!important;bottom:8px!important;z-index:9800!important; display:flex!important;align-items:center!important;gap:5px!important;padding:6px 9px!important; border-radius:12px!important;background:rgba(15,13,18,.9)!important;border:1px solid rgba(215,176,91,.5)!important; color:#f3d274!important;font-weight:900!important;font-size:12px!important } body.gg-salon-shop-v207 #ggSalonUpgradeBtnV230{opacity:.3!important;font-weight:1000!important} @keyframes ggUpgradeShakeV230{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}} #ggSalonUpgradeBtnV230.shake{animation:ggUpgradeShakeV230 .4s linear!important} .gg-salon-chair-side-v230{ position:absolute!important;left:20%!important;bottom:12%!important;width:74px!important;height:102px!important; z-index:7200!important;pointer-events:none!important } .gg-salon-chair-side-v230 .chair-back{position:absolute;left:12px;top:2px;width:35px;height:50px;background:#6f5c52;border:4px solid #2b2427;border-radius:10px 7px 4px 4px} .gg-salon-chair-side-v230 .chair-seat{position:absolute;left:17px;top:48px;width:45px;height:17px;background:#6b574d;border:4px solid #2b2427;border-radius:5px} .gg-salon-chair-side-v230 .chair-post{position:absolute;left:38px;top:65px;width:8px;height:26px;background:#4a4343} .gg-salon-chair-side-v230 .chair-base{position:absolute;left:21px;bottom:2px;width:44px;height:8px;background:#373233;border-radius:50%} .gg-salon-chair-side-v230.upgraded .chair-back,.gg-salon-chair-side-v230.upgraded .chair-seat{background:#9a7138!important;border-color:#d3ad55!important} .gg-salon-chair-slot-v230{position:absolute!important;right:20%!important;bottom:12%!important;width:74px!important;height:102px!important;display:none!important} .gg-salon-client-v230{ position:absolute!important;width:54px!important;height:82px!important;transform:translateX(-50%)!important; z-index:9050!important;transition:left 2.2s linear,bottom 2.2s linear!important;cursor:pointer!important } .gg-salon-client-v230 svg{width:100%!important;height:100%!important;overflow:visible!important} .gg-salon-client-v230.walking-to-chair{left:27%!important;bottom:15%!important;animation:ggSalonClientHopV230 .42s ease-in-out infinite!important} .gg-salon-client-v230.seated{width:58px!important;height:88px!important;z-index:7300!important;animation:none!important} .gg-salon-client-v230.leaving{animation:ggSalonClientHopV230 .42s ease-in-out infinite!important} @keyframes ggSalonClientHopV230{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-7px)}} .gg-salon-client-menu-v230{ position:absolute!important;left:27%!important;bottom:49%!important;transform:translateX(-50%)!important; z-index:10000!important;display:flex!important;gap:6px!important;padding:7px!important;border-radius:12px!important; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important;border:1px solid rgba(215,176,91,.55)!important;color:#181818;} .gg-salon-client-menu-v230[hidden]{display:none!important} .gg-salon-client-menu-v230 button{padding:7px 10px!important;border-radius:8px!important;font-size:10px!important;font-weight:900!important} .gg-salon-cut-progress-v230{ position:absolute!important;left:27%!important;bottom:47%!important;width:150px!important;transform:translateX(-50%)!important; z-index:10000!important;padding:7px!important;border-radius:12px!important;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; border:1px solid rgba(215,176,91,.5)!important;color:#181818!important;font-size:10px!important;text-align:center!important;} .gg-salon-cut-progress-v230[hidden]{display:none!important} .gg-salon-cut-progress-v230>div{height:7px!important;margin-top:5px!important;overflow:hidden!important;border-radius:99px!important;background:#2b252c!important} .gg-salon-cut-progress-v230 i{display:block!important;width:0;height:100%;background:#d7b05b!important;transition:width 5s linear!important} .gg-salon-cut-progress-v230.complete i{background:#7cc67a!important} /* Salon window/scene + 2x wide frame option */ body.gg-salon-shop-v207 #roomSceneWindowV055{ left:34%!important;right:auto!important;top:19%!important;width:32%!important;height:26%!important; border:5px solid #30272d!important;border-radius:8px!important;background:#111!important;z-index:7!important; overflow:hidden!important;box-shadow:0 2px 0 rgba(255,255,255,.08) inset!important } body.gg-salon-shop-v207 #avatarRoom.gg-salon-wide-window-v230 #roomSceneWindowV055{left:18%!important;width:64%!important} body.gg-salon-shop-v207 #roomSceneVisualV055{width:100%!important;height:100%!important;object-fit:cover!important} /* ========================================================== v231 — true double-tap light feedback ========================================================== */ #roomCeilingLightV072.gg-doubletap-armed-v231{ filter:brightness(1.35) drop-shadow(0 0 9px rgba(245,210,112,.8))!important; animation:ggLightDoubleArmV231 .65s ease!important; } @keyframes ggLightDoubleArmV231{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.08)}} /* Fern itself gives a subtle first-tap hint. */ #roomPotPlantV055.gg-fern-armed-v231{ filter:drop-shadow(0 0 10px rgba(113,220,131,.9)) brightness(1.2)!important; } /* ========================================================== v231 — Fern Climb ========================================================== */ .gg-fern-game-v231{ position:fixed!important;inset:0!important;z-index:2147483640!important; display:none!important;place-items:center!important;padding:10px!important; background:rgba(5,6,10,.88)!important;backdrop-filter:blur(8px)!important; } .gg-fern-game-v231.show{display:grid!important} .gg-fern-card-v231{ width:min(96vw,620px)!important;height:min(88vh,760px)!important;position:relative!important; display:flex!important;flex-direction:column!important;overflow:hidden!important; border-radius:22px!important;border:1px solid rgba(195,225,154,.45)!important;background:#11161a!important; box-shadow:0 24px 70px rgba(0,0,0,.55)!important } .gg-fern-top-v231{ height:58px!important;display:grid!important;grid-template-columns:42px 1fr auto!important;align-items:center!important; gap:8px!important;padding:8px 10px!important;background:rgba(11,15,15,.96)!important;border-bottom:1px solid rgba(195,225,154,.2)!important; z-index:20!important } .gg-fern-top-v231 button{width:34px!important;height:34px!important;border-radius:50%!important} .gg-fern-top-v231 div{display:flex!important;flex-direction:column!important} .gg-fern-top-v231 div b{color:#d9efad!important;font-size:15px!important} .gg-fern-top-v231 div span{font-size:9px!important;opacity:.72!important} .gg-fern-top-v231 strong{font-size:10px!important;color:#d9efad!important;text-align:right!important} .gg-fern-stage-v231{ position:relative!important;flex:1!important;overflow:hidden!important;touch-action:none!important; background:linear-gradient(#81c7ea 0 55%,#b9d98e 55% 72%,#6d8f4b 72% 100%)!important; transition:background .5s ease!important } .gg-fern-stage-v231[data-zone="sky"]{background:linear-gradient(#5fb9ea 0 76%,#b6dbe9 76% 100%)!important} .gg-fern-stage-v231[data-zone="clouds"]{background:linear-gradient(#438bc4,#a8c9d8)!important} .gg-fern-stage-v231[data-zone="stars"]{background:linear-gradient(#08142d,#182d58)!important} .gg-fern-stage-v231[data-zone="planets"]{background:radial-gradient(circle at 50% 40%,#182650,#050916 65%)!important} .gg-fern-mist-v231{ position:absolute!important;inset:0!important;pointer-events:none!important;opacity:0!important; background:radial-gradient(ellipse at 20% 40%,rgba(255,255,255,.45),transparent 28%),radial-gradient(ellipse at 80% 60%,rgba(255,255,255,.4),transparent 30%)!important; transition:opacity .5s!important } .gg-fern-stage-v231[data-zone="clouds"] .gg-fern-mist-v231, .gg-fern-stage-v231[data-zone="stars"] .gg-fern-mist-v231{opacity:.55!important} .gg-fern-stage-v231[data-zone="planets"] .gg-fern-mist-v231{opacity:.18!important} .gg-fern-stars-v231{position:absolute!important;inset:0!important;opacity:0!important;pointer-events:none!important;background-image:radial-gradient(#fff 1px,transparent 1px),radial-gradient(#e8e0a6 1px,transparent 1px)!important;background-size:34px 34px,57px 57px!important;background-position:0 0,14px 17px!important} .gg-fern-stage-v231[data-zone="stars"] .gg-fern-stars-v231, .gg-fern-stage-v231[data-zone="planets"] .gg-fern-stars-v231{opacity:.9!important} .gg-fern-planets-v231{position:absolute!important;inset:0!important;pointer-events:none!important} .gg-fern-planets-v231 i{position:absolute!important;left:var(--x)!important;top:var(--y)!important;font-style:normal!important;font-size:var(--s)!important;animation:ggFernPlanetFloatV231 var(--d) ease-in-out infinite alternate!important} @keyframes ggFernPlanetFloatV231{from{transform:translateY(-8px) rotate(-5deg)}to{transform:translateY(10px) rotate(5deg)}} .gg-fern-world-v231{position:absolute!important;inset:0!important;pointer-events:none!important} .gg-fern-stem-v231{ position:absolute!important;left:50%!important;bottom:0!important;width:8px!important;height:16%!important; transform:translateX(-50%)!important;border-radius:8px 8px 0 0!important; background:linear-gradient(90deg,#365c2d,#77a94e,#294d28)!important;transition:height var(--fern-speed) ease!important } .gg-fern-leaf-v231{ position:absolute!important;bottom:18%!important;width:82px!important;height:24px!important; background:linear-gradient(160deg,#4f8c41,#80bd59)!important;border:2px solid #2f5b2d!important; border-radius:90% 10% 90% 10%!important;transition:bottom var(--fern-speed) ease!important } .gg-fern-leaf-v231[data-side="left"]{right:50%!important;transform-origin:right center!important;transform:rotate(-8deg)!important} .gg-fern-leaf-v231[data-side="right"]{left:50%!important;transform-origin:left center!important;transform:scaleX(-1) rotate(-8deg)!important} .gg-fern-leaf-v231.pop{animation:ggFernLeafPopV231 .32s ease!important} @keyframes ggFernLeafPopV231{50%{filter:brightness(1.45);scale:1.12}} .gg-fern-player-v231{ position:absolute!important;left:50%!important;bottom:8%!important;width:58px!important;height:82px!important; transform:translateX(-50%)!important;transform-origin:center bottom!important;transition:left var(--fern-speed) ease,bottom var(--fern-speed) ease!important;z-index:8!important } .gg-fern-player-v231 svg{width:100%!important;height:100%!important;overflow:visible!important} .gg-fern-player-v231[data-side="left"]{left:33%!important} .gg-fern-player-v231[data-side="right"]{left:67%!important} .gg-fern-player-v231.jump-up{animation:ggFernJumpUpV231 var(--fern-speed) ease!important} .gg-fern-player-v231.jump-cross{animation:ggFernJumpCrossV231 var(--fern-speed) ease!important} .gg-fern-player-v231.miss{animation:ggFernMissV231 .4s ease!important} .gg-fern-player-v231.landed{filter:drop-shadow(0 0 7px rgba(208,255,125,.8))!important} @keyframes ggFernJumpUpV231{0%{translate:0 0}45%{translate:0 -72px}100%{translate:0 0}} @keyframes ggFernJumpCrossV231{0%{translate:0 0}45%{translate:0 -72px}100%{translate:0 0}} @keyframes ggFernMissV231{0%,100%{rotate:0deg}35%{rotate:-9deg;translate:0 10px}70%{rotate:9deg;translate:0 14px}} .gg-fern-tap-v231{ position:absolute!important;top:0!important;bottom:0!important;width:50%!important;border:0!important;border-radius:0!important; background:transparent!important;color:transparent!important;z-index:12!important } .gg-fern-tap-v231.left{left:0!important} .gg-fern-tap-v231.right{right:0!important} .gg-fern-tap-v231:active{background:rgba(255,255,255,.035)!important} .gg-fern-countdown-v231{ position:absolute!important;top:12px!important;left:50%!important;transform:translateX(-50%)!important; padding:5px 10px!important;border-radius:999px!important;background:rgba(5,8,12,.6)!important;color:#fff!important; font-size:12px!important;font-weight:900!important;z-index:16!important } .gg-fern-mode-v231{ position:absolute!important;z-index:30!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important; width:min(86%,430px)!important;padding:18px!important;border-radius:18px!important;background:rgba(11,15,16,.96)!important; border:1px solid rgba(195,225,154,.42)!important;text-align:center!important;color:#edf5df!important } .gg-fern-mode-v231[hidden]{display:none!important} .gg-fern-mode-v231 h3{margin:0 0 7px!important;color:#d9efad!important} .gg-fern-mode-v231 p{font-size:11px!important;line-height:1.45!important;opacity:.84!important} .gg-fern-mode-v231>div{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:12px!important} .gg-fern-mode-v231 button{padding:12px 8px!important;border-radius:12px!important;font-weight:900!important} .gg-fern-mode-v231 small{font-size:8px!important;opacity:.7!important} /* ========================================================== v232 — blackout / flashlight ========================================================== */ #avatarRoom.gg-blackout-v232{isolation:isolate!important} .gg-room-darkness-v232{ position:absolute!important;inset:0!important;z-index:9400!important;pointer-events:none!important; opacity:0!important; background:rgba(0,0,0,.995)!important; transition:opacity .14s ease!important; } .gg-room-darkness-v232.show{opacity:1!important} #avatarRoom.gg-flashlight-on-v232 .gg-room-darkness-v232{ background:radial-gradient(circle 76px at var(--fx) var(--fy), rgba(0,0,0,0) 0 64px, rgba(0,0,0,.45) 69px, rgba(0,0,0,.995) 80px)!important; pointer-events:auto!important; } .gg-flash-secret-v232{ position:absolute!important;z-index:9350!important;opacity:.08!important;pointer-events:none!important; color:#e4d47f!important;font-size:18px!important;text-shadow:0 0 9px currentColor!important; } .gg-flash-secret-v232.found{opacity:1!important;animation:ggSecretPulseV232 .8s ease 2!important} @keyframes ggSecretPulseV232{50%{transform:scale(1.35);filter:brightness(1.6)}} .gg-flash-ghost-v232{ position:absolute!important;left:-12%!important;top:var(--gy)!important;z-index:9360!important; font-size:36px!important;filter:drop-shadow(0 0 8px rgba(210,235,255,.7))!important; animation:ggGhostFlyV232 7s linear forwards!important;pointer-events:none!important } @keyframes ggGhostFlyV232{ 0%{left:-12%;transform:translateY(0) rotate(-8deg)} 25%{transform:translateY(-28px) rotate(5deg)} 50%{transform:translateY(18px) rotate(-4deg)} 75%{transform:translateY(-16px) rotate(7deg)} 100%{left:108%;transform:translateY(12px) rotate(0)} } .gg-flash-ghost-v232.caught{animation:ggGhostCaughtV232 .35s ease forwards!important} @keyframes ggGhostCaughtV232{to{opacity:0;transform:scale(.2) rotate(25deg)}} /* ========================================================== v232 — soap/care bubbles always ABOVE avatar, slightly lower ========================================================== */ .room-avatar.room-avatar-exact .room-avatar-care-effect-v065, .room-avatar-care-effect-v065{ left:50%!important; top:61%!important; transform:translate(-50%,-50%)!important; z-index:2147483200!important; isolation:isolate!important; overflow:visible!important; } .room-avatar-care-effect-v065.bubbles i{ top:62%!important; z-index:2147483201!important; } /* Fire Hydrant visible foam */ .gg-hydrant-foam-v232{ position:absolute!important;inset:0!important;z-index:2147483150!important; pointer-events:none!important;opacity:0!important;overflow:visible!important } .gg-hydrant-foam-v232.show{opacity:1!important} .gg-hydrant-foam-v232 i{ position:absolute!important;left:var(--x)!important;top:var(--y)!important;width:var(--s)!important;height:var(--s)!important; border-radius:50%!important;background:rgba(248,252,255,.94)!important;border:2px solid rgba(205,232,245,.88)!important; box-shadow:0 0 8px rgba(255,255,255,.75)!important; animation:ggHydrantFoamPopV232 1.4s ease var(--d) both!important } @keyframes ggHydrantFoamPopV232{ 0%{opacity:0;transform:scale(.1) translateY(18px)} 25%,80%{opacity:1;transform:scale(1)} 100%{opacity:.88;transform:translateY(-8px) scale(1.05)} } /* ========================================================== v232 — 6-second random makeup aligned to face Coordinates are percentages of the room avatar box. ========================================================== */ .gg-random-makeup-v232{ position:absolute!important;inset:0!important;z-index:2147483250!important;pointer-events:none!important; opacity:0!important;transition:opacity .38s ease!important } .gg-random-makeup-v232.show{opacity:1!important} .gg-random-makeup-v232.fade{opacity:0!important} .gg-random-makeup-v232 .blush{ position:absolute!important;top:48.5%!important;width:14%!important;height:7.5%!important;border-radius:50%!important; background:radial-gradient(ellipse,rgba(245,91,126,.68),rgba(245,91,126,.26) 58%,transparent 75%)!important; filter:blur(1px)!important } .gg-random-makeup-v232 .blush.l{left:27%!important} .gg-random-makeup-v232 .blush.r{right:27%!important} .gg-random-makeup-v232 .blush.peach{background:radial-gradient(ellipse,rgba(255,145,105,.72),rgba(255,145,105,.24) 58%,transparent 76%)!important} .gg-random-makeup-v232 .shadow{ position:absolute!important;top:40.3%!important;width:18%!important;height:6%!important;border-radius:50% 50% 45% 45%!important;opacity:.72!important } .gg-random-makeup-v232 .shadow.l{left:25%!important} .gg-random-makeup-v232 .shadow.r{right:25%!important} .gg-random-makeup-v232 .shadow.purple{background:#8f6bc9!important} .gg-random-makeup-v232 .shadow.gold{background:#d8aa42!important} .gg-random-makeup-v232 .shadow.blue{background:#5d9ed3!important} .gg-random-makeup-v232 .liner{ position:absolute!important;top:41.2%!important;width:19%!important;height:9%!important;border-top:3px solid #171217!important;border-radius:50%!important } .gg-random-makeup-v232 .liner.l{left:24%!important;transform:rotate(-3deg)!important} .gg-random-makeup-v232 .liner.r{right:24%!important;transform:scaleX(-1) rotate(-3deg)!important} .gg-random-makeup-v232 .liner.wing::after{ content:""!important;position:absolute!important;right:-7px!important;top:-3px!important;width:11px!important;height:3px!important; background:#171217!important;transform:rotate(-22deg)!important } .gg-random-makeup-v232 .lip{ position:absolute!important;left:50%!important;top:55.4%!important;width:17%!important;height:7%!important; transform:translateX(-50%)!important;border-radius:50% 50% 45% 45%!important;box-shadow:inset 0 -2px 0 rgba(0,0,0,.2)!important } .gg-random-makeup-v232 .lip.berry{background:#7e294e!important} .gg-random-makeup-v232 .lip.red{background:#b82e38!important} .gg-random-makeup-v232 .lip.pink{background:#dc6b8b!important} .gg-random-makeup-v232 .star{ position:absolute!important;left:31%!important;top:47%!important;width:13px!important;height:13px!important; background:#e9c45f!important;clip-path:polygon(50% 0,61% 36%,100% 38%,69% 59%,79% 100%,50% 74%,21% 100%,31% 59%,0 38%,39% 36%)!important } .gg-random-makeup-v232 .beauty{ position:absolute!important;right:32%!important;top:52%!important;width:5px!important;height:5px!important;border-radius:50%!important;background:#2a1718!important } /* ========================================================== v233 — persistent ceiling-light highlight while room is black ========================================================== */ #roomCeilingLightV072.gg-blackout-highlight-v233{ filter: brightness(1.45) drop-shadow(0 0 7px rgba(247,214,116,.95)) drop-shadow(0 0 15px rgba(247,214,116,.62))!important; opacity:1!important; } /* Don't keep pulsing forever; persistent state is a steady glow. */ #roomCeilingLightV072.gg-blackout-highlight-v233.gg-doubletap-armed-v231{ animation:none!important; } /* ========================================================== v234 — architecture tokens (migration-safe; no visual change) ========================================================== */ :root{ --gg-layer-background:0; --gg-layer-scene:100; --gg-layer-wall:200; --gg-layer-rear-decor:300; --gg-layer-furniture-rear:400; --gg-layer-avatar-rear:500; --gg-layer-avatar:600; --gg-layer-avatar-face:650; --gg-layer-avatar-hair:675; --gg-layer-avatar-front:700; --gg-layer-furniture-front:750; --gg-layer-effects:800; --gg-layer-hud:900; --gg-layer-menus:1000; --gg-layer-modal:1100; } #roomCeilingLightV072.gg-light-visible-v235{display:flex!important;align-items:center!important;justify-content:center!important;min-width:38px!important;min-height:38px!important;overflow:visible!important} #roomCeilingLightV072 .gg-light-bulb-v235{display:block!important;font-size:24px!important;line-height:1!important;pointer-events:none!important} #roomCeilingLightV072.gg-blackout-highlight-v235{outline:3px solid rgba(245,205,86,.98)!important;outline-offset:4px!important;border-radius:50%!important;filter:brightness(1.45) drop-shadow(0 0 9px rgba(255,216,95,.98)) drop-shadow(0 0 18px rgba(255,216,95,.72))!important;opacity:1!important} .gg-global-nav-v235{display:inline-flex!important;align-items:center!important;gap:5px!important;margin-left:auto!important;order:999!important}.gg-global-shop-v235{display:inline-flex!important;align-items:center!important;height:36px!important;padding:0 5px!important}.gg-global-menu-btn-v235{width:36px!important;height:36px!important;padding:7px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:4px!important;border-radius:10px!important}.gg-global-menu-btn-v235 i{display:block!important;width:100%!important;height:2px!important;background:currentColor!important} .gg-global-menu-v235{position:fixed!important;top:64px!important;right:8px!important;width:min(230px,76vw)!important;z-index:2147483600!important;padding:8px!important;border-radius:14px!important;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important;border:1px solid rgba(215,176,91,.28)!important;color:#181818;}.gg-global-menu-v235[hidden]{display:none!important}.gg-global-menu-v235 a{display:block!important;padding:10px 12px!important;color:#f3e9cf!important;text-decoration:none!important} .gg-book-under-header-v235{position:fixed!important;top:50px!important;left:50%!important;right:auto!important;width:auto!important;height:auto!important;margin:0!important;padding:0!important;transform:translateX(-50%)!important;display:block!important;overflow:visible!important;z-index:2147482500!important;pointer-events:none!important}.gg-book-under-header-v235 .btn{pointer-events:auto!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:128px!important;height:auto!important;margin:0!important;padding:9px 17px!important;border-radius:999px!important;text-align:center!important;white-space:nowrap!important;box-shadow:0 8px 22px rgba(0,0,0,.26)!important} body.gg-salon-shop-v207 .gg-salon-chair-side-v230{bottom:0!important}body.gg-salon-shop-v207 .gg-salon-client-v230{bottom:11%!important;animation:none!important}body.gg-salon-shop-v207 .gg-salon-client-v230.walking-to-chair,body.gg-salon-shop-v207 .gg-salon-client-v230.leaving{animation:none!important;bottom:11%!important}body.gg-salon-shop-v207 .gg-salon-client-v230.seated{bottom:13%!important;animation:none!important}.gg-salon-random-avatar-v235{width:100%!important;height:100%!important;overflow:visible!important} /* v236 — persistent Sun theme: light gray site + black text */ html[data-gg-site-theme="sun"]{color-scheme:light;--bg:#e6e6e8!important;--panel:#f2f2f3!important;--cream:#111!important;--text:#111!important;--muted:#3d3d42!important} html[data-gg-site-theme="sun"] body{background:#e6e6e8!important;color:#111!important} html[data-gg-site-theme="sun"] header{background:rgba(230,230,232,.98)!important;border-bottom-color:rgba(0,0,0,.15)!important} html[data-gg-site-theme="sun"] main, html[data-gg-site-theme="sun"] .page-hero, html[data-gg-site-theme="sun"] section:not(#avatarRoom):not(.avatar-room){color:#111!important} html[data-gg-site-theme="sun"] h1, html[data-gg-site-theme="sun"] h2, html[data-gg-site-theme="sun"] h3, html[data-gg-site-theme="sun"] h4, html[data-gg-site-theme="sun"] p, html[data-gg-site-theme="sun"] label, html[data-gg-site-theme="sun"] small, html[data-gg-site-theme="sun"] strong, html[data-gg-site-theme="sun"] b, html[data-gg-site-theme="sun"] .kicker, html[data-gg-site-theme="sun"] .section-title, html[data-gg-site-theme="sun"] .brand, html[data-gg-site-theme="sun"] .brand span, html[data-gg-site-theme="sun"] header a, html[data-gg-site-theme="sun"] .navlinks a, html[data-gg-site-theme="sun"] .gg-global-shop-v235{color:#111!important} html[data-gg-site-theme="sun"] .gg-global-menu-btn-v235{color:#111!important;background:#f4f4f5!important;border-color:rgba(0,0,0,.22)!important} html[data-gg-site-theme="sun"] .gg-global-menu-v235{background:rgba(243,243,244,.99)!important;border-color:rgba(0,0,0,.18)!important;box-shadow:0 14px 38px rgba(0,0,0,.18)!important} html[data-gg-site-theme="sun"] .gg-global-menu-v235 a{color:#111!important} html[data-gg-site-theme="sun"] .card, html[data-gg-site-theme="sun"] .shop-card, html[data-gg-site-theme="sun"] .avatar-preview-card, html[data-gg-site-theme="sun"] .rich-avatar-card, html[data-gg-site-theme="sun"] .gg-dread-card{background:#f3f3f4!important;color:#111!important;border-color:rgba(0,0,0,.14)!important} html[data-gg-site-theme="sun"] .btn{color:#111!important} @media (max-width:640px){ .gg-book-under-header-v235{top:48px!important} .gg-book-under-header-v235 .btn{min-width:122px!important;padding:8px 15px!important} } /* ========================================================== v238 — cleaner top bar ========================================================== */ header .brand.gg-brand-text-v238{ display:block!important; flex:0 1 auto!important; min-width:0!important; padding:0!important; margin:0!important; font-weight:900!important; letter-spacing:.045em!important; white-space:nowrap!important; } header nav{ width:100%!important; max-width:none!important; } header .wrap{ width:100%!important; max-width:none!important; padding-left:12px!important; padding-right:6px!important; } header .navlinks{ margin-left:auto!important; justify-content:flex-end!important; flex:1 1 auto!important; min-width:0!important; } header .gg-global-nav-v235{ margin-left:auto!important; margin-right:0!important; padding-right:0!important; flex:0 0 auto!important; } header .gg-global-menu-btn-v235{ margin-right:0!important; } @media (max-width:640px){ header .brand.gg-brand-text-v238{ font-size:clamp(11px,3.2vw,14px)!important; max-width:44vw!important; overflow:hidden!important; text-overflow:ellipsis!important; } header .wrap{padding-left:8px!important;padding-right:3px!important} header .navlinks{gap:3px!important} } /* Salon client uses actual player-avatar proportions and lower floor baseline. */ body.gg-salon-shop-v207 .gg-salon-client-v230{ width:54px!important; height:92px!important; bottom:4%!important; animation:none!important; } body.gg-salon-shop-v207 .gg-salon-client-v230.walking-to-chair, body.gg-salon-shop-v207 .gg-salon-client-v230.leaving{ bottom:4%!important; animation:none!important; } body.gg-salon-shop-v207 .gg-salon-client-v230.seated{ bottom:6%!important; } body.gg-salon-shop-v207 .gg-salon-random-avatar-v238, body.gg-salon-shop-v207 .gg-salon-client-v230 .room-exact-avatar, body.gg-salon-shop-v207 .gg-salon-client-v230 svg{ width:100%!important; height:100%!important; overflow:visible!important; } /* Ceiling fixture remains clearly highlighted while light is OFF. */ #roomCeilingLightV072.gg-blackout-highlight-v238{ outline:3px solid #f2cc58!important; outline-offset:4px!important; border-radius:50%!important; filter:brightness(1.6) drop-shadow(0 0 9px rgba(255,216,92,.98)) drop-shadow(0 0 18px rgba(255,216,92,.82))!important; opacity:1!important; } /* Selected light effect centered over the player avatar. */ .gg-avatar-light-circle-v238{ position:absolute!important; width:128px!important; height:128px!important; border-radius:50%!important; transform:translate(-50%,-50%) scale(.75)!important; z-index:9300!important; pointer-events:none!important; opacity:0!important; background:radial-gradient(circle,rgba(255,248,197,.62) 0 32%,rgba(255,232,120,.27) 48%,rgba(255,220,92,.08) 65%,transparent 72%)!important; box-shadow:0 0 24px rgba(255,228,105,.35)!important; transition:opacity .2s ease,transform .2s ease!important; } .gg-avatar-light-circle-v238.show{ opacity:1!important; transform:translate(-50%,-50%) scale(1)!important; } /* ========================================================== v239 — Fern Climb movement + environment overhaul ========================================================== */ /* Larger avatar with no dark/black backdrop. */ .gg-fern-player-v231{ width:92px!important; height:132px!important; background:none!important; border:0!important; box-shadow:none!important; filter:none!important; z-index:15!important; } .gg-fern-player-v231::before, .gg-fern-player-v231::after, .gg-fern-player-v231 .room-exact-avatar::before, .gg-fern-player-v231 .room-exact-avatar::after{ content:none!important; display:none!important; } .gg-fern-player-v231 .room-exact-avatar, .gg-fern-player-v231 svg{ background:transparent!important; border:0!important; box-shadow:none!important; filter:none!important; width:100%!important; height:100%!important; } /* Platform leaves actually support the avatar. */ .gg-fern-leaf-stack-v239{ position:absolute!important; inset:0!important; z-index:6!important; pointer-events:none!important; } .gg-fern-platform-v239{ position:absolute!important; width:112px!important; height:34px!important; transition:bottom var(--fern-speed) ease!important; } .gg-fern-platform-v239[data-side="left"]{ left:8%!important; } .gg-fern-platform-v239[data-side="right"]{ right:8%!important; } .gg-fern-platform-v239[data-side="center"]{ left:50%!important; transform:translateX(-50%)!important; } .gg-fern-platform-v239 i{ position:absolute!important; inset:0!important; border-radius:95% 10% 95% 10%!important; background: linear-gradient(160deg,rgba(255,255,255,.18),transparent 38%), linear-gradient(145deg,#9fd875,#4f9749 55%,#2c6737)!important; border:2px solid #285d35!important; box-shadow:0 5px 8px rgba(0,0,0,.18),inset 0 2px 0 rgba(255,255,255,.24)!important; } .gg-fern-platform-v239[data-side="right"] i{ transform:scaleX(-1)!important; } .gg-fern-platform-v239 b{ position:absolute!important; top:50%!important; width:72px!important; height:5px!important; background:#326c3c!important; border-radius:99px!important; } .gg-fern-platform-v239[data-side="left"] b{ right:-62px!important; } .gg-fern-platform-v239[data-side="right"] b{ left:-62px!important; } .gg-fern-platform-v239[data-side="center"] b{ left:50%!important; transform:translateX(-50%) rotate(90deg)!important; } /* Fern stem looks like a growing organic trunk rather than a flat bar. */ .gg-fern-stem-v231{ width:13px!important; height:100%!important; border-radius:50% 50% 0 0!important; background: linear-gradient(90deg,#214a2d 0 16%,#4d8a4a 28%,#79b766 48%,#3f7d42 68%,#1c4528 100%)!important; box-shadow:inset 2px 0 2px rgba(255,255,255,.12),0 0 4px rgba(0,0,0,.2)!important; } /* Correct movement directions. */ .gg-fern-player-v231.jump-up-v239{ animation:ggFernStraightJumpV239 var(--fern-speed) cubic-bezier(.28,.68,.3,1)!important; } .gg-fern-player-v231.jump-diagonal-v239[data-jump="left"]{ animation:ggFernDiagLeftV239 var(--fern-speed) cubic-bezier(.28,.68,.3,1)!important; } .gg-fern-player-v231.jump-diagonal-v239[data-jump="right"]{ animation:ggFernDiagRightV239 var(--fern-speed) cubic-bezier(.28,.68,.3,1)!important; } .gg-fern-player-v231.falling-v239{ animation:ggFernFallV239 .46s cubic-bezier(.5,0,.8,.3)!important; } @keyframes ggFernStraightJumpV239{ 0%{transform:translateX(-50%) translateY(0)} 48%{transform:translateX(-50%) translateY(-105px)} 100%{transform:translateX(-50%) translateY(0)} } @keyframes ggFernDiagLeftV239{ 0%{transform:translateX(-50%) translate(0,0)} 48%{transform:translateX(-50%) translate(-105px,-100px)} 100%{transform:translateX(-50%) translate(-145px,0)} } @keyframes ggFernDiagRightV239{ 0%{transform:translateX(-50%) translate(0,0)} 48%{transform:translateX(-50%) translate(105px,-100px)} 100%{transform:translateX(-50%) translate(145px,0)} } @keyframes ggFernFallV239{ 0%{transform:translateX(-50%) translateY(-35px);opacity:.85} 100%{transform:translateX(-50%) translateY(0);opacity:1} } /* Richer level environments */ .gg-fern-stage-v231{ background: linear-gradient(to top,#315628 0 9%,#5b8242 9% 17%,#9dc778 17% 30%,#77c6ed 30% 100%)!important; } .gg-fern-stage-v231[data-zone="ground"]::before{ content:""!important; position:absolute!important; left:0!important;right:0!important;bottom:0!important;height:17%!important; background: radial-gradient(ellipse at 12% 80%,#516d35 0 10%,transparent 11%), radial-gradient(ellipse at 80% 92%,#425e2f 0 12%,transparent 13%), linear-gradient(#698c4a,#3e602f)!important; } .gg-fern-sun-v239{ position:absolute!important; right:9%!important; top:8%!important; width:62px!important;height:62px!important; border-radius:50%!important; background:radial-gradient(circle,#fff7b5 0 28%,#f4d86f 45%,rgba(245,204,87,.12) 70%,transparent 72%)!important; box-shadow:0 0 24px rgba(255,227,126,.45)!important; z-index:1!important; } .gg-fern-stage-v231[data-zone="stars"] .gg-fern-sun-v239, .gg-fern-stage-v231[data-zone="planets"] .gg-fern-sun-v239{ opacity:0!important; } .gg-fern-cloud-layer-v239{ position:absolute!important; inset:0!important; pointer-events:none!important; opacity:0!important; background: radial-gradient(ellipse at 15% 38%,rgba(255,255,255,.72) 0 8%,transparent 9%), radial-gradient(ellipse at 27% 42%,rgba(255,255,255,.68) 0 10%,transparent 11%), radial-gradient(ellipse at 70% 23%,rgba(255,255,255,.72) 0 9%,transparent 10%), radial-gradient(ellipse at 82% 28%,rgba(255,255,255,.64) 0 11%,transparent 12%)!important; } .gg-fern-cloud-layer-v239.near{ animation:ggFernCloudDriftV239 18s linear infinite!important; } .gg-fern-cloud-layer-v239.far{ opacity:.35!important; transform:scale(.78)!important; animation:ggFernCloudDriftV239 27s linear infinite reverse!important; } .gg-fern-stage-v231[data-zone="sky"] .gg-fern-cloud-layer-v239, .gg-fern-stage-v231[data-zone="clouds"] .gg-fern-cloud-layer-v239{ opacity:.8!important; } .gg-fern-stage-v231[data-zone="clouds"] .gg-fern-cloud-layer-v239.near{ opacity:1!important; } @keyframes ggFernCloudDriftV239{ from{translate:-7% 0} to{translate:7% 0} } .gg-fern-stage-v231[data-zone="sky"]{ background:linear-gradient(#4caee9,#9bd9f1)!important; } .gg-fern-stage-v231[data-zone="clouds"]{ background: linear-gradient(rgba(232,244,250,.18),rgba(181,215,231,.5)), linear-gradient(#4f9fcf,#bbd7e5)!important; } .gg-fern-stage-v231[data-zone="stars"]{ background: radial-gradient(circle at 50% 120%,rgba(41,79,130,.55),transparent 42%), linear-gradient(#0d2147,#050b1a)!important; } .gg-fern-stage-v231[data-zone="planets"]{ background: radial-gradient(circle at 60% 30%,rgba(43,67,132,.32),transparent 26%), radial-gradient(circle at 30% 70%,rgba(80,39,101,.22),transparent 30%), #030713!important; } .gg-fern-stage-v231[data-zone="clouds"] .gg-fern-mist-v231{ opacity:.74!important; backdrop-filter:blur(1.5px)!important; } .gg-fern-stage-v231[data-zone="stars"] .gg-fern-stars-v231, .gg-fern-stage-v231[data-zone="planets"] .gg-fern-stars-v231{ opacity:1!important; animation:ggFernStarTwinkleV239 2.5s ease-in-out infinite alternate!important; } @keyframes ggFernStarTwinkleV239{ from{filter:brightness(.8)} to{filter:brightness(1.35)} } /* Better stage framing */ .gg-fern-card-v231{ border:1px solid rgba(175,218,135,.6)!important; box-shadow:0 28px 90px rgba(0,0,0,.62),inset 0 0 0 1px rgba(255,255,255,.04)!important; } .gg-fern-top-v231{ background:linear-gradient(180deg,#17221b,#101813)!important; } /* ========================================================== v240 — care effect front layer ========================================================== */ .room-avatar.room-avatar-exact.gg-care-front-parent-v240, .room-exact-avatar.gg-care-front-parent-v240{ overflow:visible!important; isolation:isolate!important; } .gg-care-front-v240{ position:absolute!important; inset:0!important; z-index:2147483600!important; overflow:visible!important; pointer-events:none!important; transform:none!important; } /* SOAP — lower than previous version, in front of avatar */ .gg-soap-front-v240{ position:absolute!important; inset:0!important; z-index:2147483601!important; opacity:0!important; pointer-events:none!important; transition:opacity .22s ease!important; } .gg-soap-front-v240.show{opacity:1!important} .gg-soap-front-v240.fade{opacity:0!important} .gg-soap-front-v240 i{ position:absolute!important; left:var(--x)!important; top:var(--y)!important; width:var(--s)!important; height:var(--s)!important; border-radius:50%!important; border:2px solid rgba(220,247,255,.95)!important; background: radial-gradient(circle at 32% 28%,rgba(255,255,255,.7) 0 8%,transparent 10%), radial-gradient(circle,rgba(225,249,255,.17),rgba(185,229,247,.08))!important; box-shadow: inset 0 0 5px rgba(255,255,255,.45), 0 0 6px rgba(180,230,255,.35)!important; animation:ggSoapFrontRiseV240 2.6s ease var(--d) both!important; } @keyframes ggSoapFrontRiseV240{ 0%{opacity:0;transform:translate(0,12px) scale(.55)} 18%{opacity:1} 78%{opacity:.95} 100%{opacity:0;transform:translate(var(--dx),-72px) scale(1.12)} } /* HYDRANT — obvious thick foam covering avatar */ .gg-hydrant-front-v240{ position:absolute!important; inset:-5% -8% -3% -8%!important; z-index:2147483602!important; opacity:0!important; pointer-events:none!important; transition:opacity .25s ease!important; } .gg-hydrant-front-v240.show{opacity:1!important} .gg-hydrant-front-v240.fade{opacity:0!important} .gg-hydrant-front-v240 i{ position:absolute!important; left:var(--x)!important; top:var(--y)!important; width:var(--s)!important; height:var(--s)!important; border-radius:50%!important; background: radial-gradient(circle at 30% 25%,#fff 0 12%,#f8fcff 18%,#e4f2f8 58%,#cfe5ef 100%)!important; border:2px solid rgba(255,255,255,.96)!important; box-shadow: 0 0 8px rgba(255,255,255,.82), inset -3px -4px 6px rgba(162,201,219,.24)!important; animation:ggHydrantFrontPopV240 1.15s cubic-bezier(.22,.8,.24,1) var(--d) both!important; } @keyframes ggHydrantFrontPopV240{ 0%{opacity:0;transform:scale(.12) translateY(18px)} 45%{opacity:1;transform:scale(1.08)} 100%{opacity:1;transform:scale(1)} } /* MAKEUP — exact 420x420 avatar coordinate overlay */ .gg-makeup-face-v240{ position:absolute!important; inset:0!important; width:100%!important; height:100%!important; z-index:2147483603!important; overflow:visible!important; pointer-events:none!important; opacity:0!important; transform:scale(.96)!important; transform-origin:center center!important; transition:opacity .38s ease,transform .38s ease!important; } .gg-makeup-face-v240.show{ opacity:1!important; transform:scale(1)!important; } .gg-makeup-face-v240.fade{ opacity:0!important; transform:scale(1.02)!important; } /* Retire older visual care layers when the new front layer is active */ .gg-care-front-parent-v240 > .gg-hydrant-foam-v232, .gg-care-front-parent-v240 > .gg-random-makeup-v232, .gg-care-front-parent-v240 > .gg-makeup-blush-v147, .gg-care-front-parent-v240 > .gg-makeup-lashes-v147, .gg-care-front-parent-v240 > .gg-makeup-nose-v124{ display:none!important; } /* Old room-level soap bubble host should not compete with v240 overlay. */ #avatarRoom .room-avatar-care-effect-v065.bubbles{ z-index:2147483500!important; opacity:0!important; } /* ========================================================== v241 — HUD always over EVERYTHING in rooms ========================================================== */ #roomMoodGaugeV065, #ggRoomLevelV143, #ggSalonMoneyGaugeV230, .room-mood-gauge-v065, .gg-room-level-v143, .gg-salon-money-v230{ z-index:2147483640!important; isolation:isolate!important; pointer-events:auto!important; } /* Level celebration above avatar, objects and effects */ .gg-level-celebrate-v241{ position:absolute!important; inset:0!important; z-index:2147483635!important; overflow:hidden!important; pointer-events:none!important; opacity:0!important; transition:opacity .18s ease!important; } .gg-level-celebrate-v241.show{opacity:1!important} .gg-level-celebrate-v241 i{ position:absolute!important; left:var(--x)!important; top:-12%!important; font-style:normal!important; font-size:18px!important; animation:ggLevelFallV241 3.4s cubic-bezier(.18,.72,.25,1) var(--d) forwards!important; } @keyframes ggLevelFallV241{ 0%{transform:translateY(0) rotate(0deg);opacity:0} 12%{opacity:1} 100%{transform:translateY(125vh) rotate(var(--r));opacity:.25} } .gg-level-dialog-v241{ position:absolute!important; left:50%!important; top:18%!important; transform:translateX(-50%) scale(.8)!important; padding:10px 16px!important; border-radius:999px!important; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; border:1px solid rgba(235,195,92,.7)!important; color:#181818!important; font-weight:1000!important; white-space:nowrap!important; animation:ggLevelDialogV241 3.7s ease forwards!important; } @keyframes ggLevelDialogV241{ 0%{opacity:0;transform:translateX(-50%) scale(.75)} 12%,75%{opacity:1;transform:translateX(-50%) scale(1)} 100%{opacity:0;transform:translateX(-50%) translateY(-20px) scale(.95)} } /* Book Now lower than v237, still fixed directly under top bar */ .gg-book-under-header-v235{ top:58px!important; } @media(max-width:640px){ .gg-book-under-header-v235{top:56px!important} } /* Shop is icon-only at top */ .gg-global-shop-v235{ width:34px!important; padding:0!important; justify-content:center!important; font-size:21px!important; } /* Tighter Soap — concentrated over avatar instead of spreading wide */ .gg-soap-front-v240 i{ margin-left:-7%!important; } .gg-soap-front-v240{ left:12%!important; right:12%!important; top:5%!important; bottom:4%!important; } /* Hydrant foam concentrated closer to avatar silhouette */ .gg-hydrant-front-v240{ inset:4% 6% 1% 6%!important; } /* OFF light always clearly selected/highlighted */ #roomCeilingLightV072.gg-blackout-highlight-v241{ outline:4px solid #ffd55f!important; outline-offset:4px!important; border-radius:50%!important; background:rgba(255,211,78,.17)!important; filter:brightness(1.7) drop-shadow(0 0 10px rgba(255,218,95,1)) drop-shadow(0 0 22px rgba(255,218,95,.88))!important; opacity:1!important; } /* Real visible flashlight beam, in addition to the reveal hole in darkness */ .gg-flash-beam-v241{ position:absolute!important; width:150px!important; height:150px!important; border-radius:50%!important; transform:translate(-50%,-50%)!important; z-index:2147483520!important; pointer-events:none!important; opacity:0!important; background:radial-gradient(circle, rgba(255,255,225,.84) 0 18%, rgba(255,247,186,.55) 34%, rgba(255,228,111,.24) 53%, rgba(255,220,95,.08) 67%, transparent 72%)!important; box-shadow:0 0 32px rgba(255,235,146,.36)!important; mix-blend-mode:screen!important; transition:opacity .16s ease!important; } .gg-flash-beam-v241.show{opacity:1!important} /* One frame visual only */ .gg-room-single-frame-v241{ position:absolute!important; inset:0!important; z-index:25!important; pointer-events:none!important; border:8px solid #5b412d!important; border-radius:4px!important; box-sizing:border-box!important; } .gg-room-single-frame-v241[data-frame="round"]{ border-radius:50%!important; border-color:#4c392b!important; } .gg-room-single-frame-v241[data-frame="classic"]{ border:10px ridge #704c2c!important; } .gg-room-single-frame-v241[data-frame="stainedGlass"]{ border:8px solid #c89f55!important; box-shadow:inset 0 0 0 3px rgba(116,62,125,.55)!important; } .gg-room-single-frame-v241[data-frame="openCurtains"]{ border-width:6px 18px!important; border-color:#6d2949!important; border-style:solid!important; } /* Fern close = black circle, red X, immediately right of Height/Best */ #ggFernExitV231{ position:absolute!important; right:8px!important; top:10px!important; width:34px!important; height:34px!important; border-radius:50%!important; border:2px solid #8d242b!important; background:#050507!important; color:#ff4b55!important; font-size:23px!important; font-weight:1000!important; line-height:28px!important; padding:0!important; z-index:40!important; } .gg-fern-top-v231 strong{ margin-right:40px!important; } /* Fern avatar: absolutely no Studio backdrop/shadow. */ #ggFernPlayerV231, #ggFernPlayerV231 svg{ background:transparent!important; box-shadow:none!important; border:0!important; } #ggFernPlayerV231 svg #avatarBg, #ggFernPlayerV231 svg circle[fill="url(#stageGlow)"], #ggFernPlayerV231 svg ellipse[fill="#111116"]{ display:none!important; } /* Salon clients use actual avatar-system SVG and stay at player-like scale */ body.gg-salon-shop-v207 #ggSalonClientV230{ width:62px!important; height:92px!important; } body.gg-salon-shop-v207 #ggSalonClientV230 svg.gg-salon-random-avatar-v241{ width:100%!important; height:100%!important; overflow:visible!important; background:transparent!important; } /* ========================================================== v242 — Giant Eye scene rework black background + white eye + moving pupil ========================================================== */ .room-scene-window-v055[data-scene="giantEye"] .room-scene-visual-v055{ background:#000!important; overflow:hidden!important; } .room-scene-window-v055[data-scene="giantEye"] .room-scene-visual-v055::before{ content:""!important; position:absolute!important; left:50%!important; top:50%!important; width:72%!important; height:72%!important; transform:translate(-50%,-50%)!important; border-radius:50%!important; background:#fff!important; box-shadow:0 0 18px rgba(255,255,255,.22)!important; } .room-scene-window-v055[data-scene="giantEye"] .room-scene-visual-v055::after{ content:""!important; position:absolute!important; left:50%!important; top:50%!important; width:23%!important; aspect-ratio:1!important; transform:translate(-50%,-50%)!important; border-radius:50%!important; background:#070707!important; box-shadow:inset 0 0 0 5px #151515,0 0 8px rgba(0,0,0,.6)!important; animation:ggGiantEyePupilV242 4.8s ease-in-out infinite!important; } @keyframes ggGiantEyePupilV242{ 0%,100%{translate:-18% 0} 22%{translate:15% -10%} 48%{translate:24% 9%} 72%{translate:-7% 14%} } /* Home Book Now a little farther below the top bar */ body:not(.room-page-v054) .gg-book-under-header-v235{ top:64px!important; } @media(max-width:640px){ body:not(.room-page-v054) .gg-book-under-header-v235{top:62px!important} } /* Remove duplicate/legacy top Shop diamonds entirely */ .top-shop-icon{display:none!important} /* OFF light highlight is derived from room blackout state, so it cannot be lost even if JS removes a helper class. */ #avatarRoom.gg-blackout-v232 #roomCeilingLightV072{ outline:4px solid #ffd65f!important; outline-offset:5px!important; border-radius:50%!important; background:rgba(255,212,75,.2)!important; filter:brightness(1.8) drop-shadow(0 0 10px rgba(255,220,99,1)) drop-shadow(0 0 24px rgba(255,220,99,.92))!important; opacity:1!important; } /* Larger flashlight */ .gg-flash-beam-v241{ width:190px!important; height:190px!important; } #avatarRoom.gg-flashlight-on-v232 .gg-room-darkness-v232{ background:radial-gradient(circle 96px at var(--fx) var(--fy), rgba(0,0,0,0) 0 82px, rgba(0,0,0,.36) 88px, rgba(0,0,0,.995) 102px)!important; } /* Green gremlin ghost instead of plain white ghost */ .gg-flash-ghost-v232{ width:58px!important; height:68px!important; font-size:0!important; filter:drop-shadow(0 0 10px rgba(93,255,115,.75))!important; } .gg-green-gremlin-ghost-v242{ position:absolute!important; inset:0!important; display:block!important; border-radius:48% 52% 42% 58%!important; background:radial-gradient(circle at 42% 30%,#a5ff96 0 7%,transparent 8%), linear-gradient(145deg,#64dd65,#1e7f38)!important; border:2px solid #164f25!important; box-shadow:inset 0 -8px 10px rgba(8,55,20,.35)!important; } .gg-green-gremlin-ghost-v242::before, .gg-green-gremlin-ghost-v242::after{ content:""!important; position:absolute!important; top:17%!important; width:23px!important; height:16px!important; background:#55c857!important; border:2px solid #164f25!important; } .gg-green-gremlin-ghost-v242::before{left:-17px!important;clip-path:polygon(100% 10%,0 0,72% 100%)!important} .gg-green-gremlin-ghost-v242::after{right:-17px!important;clip-path:polygon(0 10%,100% 0,28% 100%)!important} .gg-green-gremlin-ghost-v242 b{ position:absolute!important; top:25%!important; width:13px!important; height:16px!important; border-radius:50%!important; background:#efffe9!important; color:#102914!important; font-size:8px!important; line-height:15px!important; text-align:center!important; } .gg-green-gremlin-ghost-v242 b:first-child{left:20%!important} .gg-green-gremlin-ghost-v242 b:nth-child(2){right:20%!important} .gg-green-gremlin-ghost-v242 i{ position:absolute!important; left:50%!important; bottom:18%!important; width:25px!important; height:10px!important; transform:translateX(-50%)!important; border-radius:4px 4px 12px 12px!important; background:#12351b!important; } /* Slime trail remains around the room for a while */ .gg-ghost-slime-v242{ position:absolute!important; width:38px!important; height:18px!important; z-index:9355!important; pointer-events:none!important; opacity:0!important; transform:translate(-50%,-50%) rotate(var(--slime-rot)) scale(.6)!important; transition:opacity .3s ease,transform .3s ease!important; } .gg-ghost-slime-v242.show{ opacity:.92!important; transform:translate(-50%,-50%) rotate(var(--slime-rot)) scale(1)!important; } .gg-ghost-slime-v242.fade{opacity:0!important} .gg-ghost-slime-v242 i{ position:absolute!important; inset:3px 0 0!important; border-radius:50% 58% 42% 55%!important; background:#52df56!important; border:2px solid #167a2c!important; box-shadow:0 0 7px rgba(79,255,92,.42)!important; } .gg-ghost-slime-v242 b{ position:absolute!important; left:8px!important; top:-6px!important; width:9px!important; height:12px!important; border-radius:50%!important; background:#75ef72!important; } /* Better Goldie's Salon starter chair */ body.gg-salon-room-v206 .gg-salon-chair-side-v230{ width:88px!important; height:116px!important; bottom:0!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230 .chair-back{ left:14px!important;top:2px!important;width:48px!important;height:61px!important; border:3px solid #282429!important; border-radius:13px 13px 6px 6px!important; background:linear-gradient(100deg,#66554f,#877169 52%,#594a46)!important; box-shadow:inset 5px 0 8px rgba(255,255,255,.08),inset -5px 0 8px rgba(0,0,0,.18)!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230 .chair-back::after{ content:""!important; position:absolute!important; right:-15px!important; top:35px!important; width:22px!important; height:8px!important; border-radius:7px!important; background:#3b3435!important; border:2px solid #272325!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230 .chair-seat{ left:18px!important;top:59px!important;width:55px!important;height:19px!important; background:linear-gradient(#806a62,#5b4c48)!important; border:3px solid #282429!important; border-radius:6px 12px 9px 6px!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230 .chair-post{ left:43px!important;top:78px!important;width:9px!important;height:25px!important; background:linear-gradient(90deg,#56575b,#a6a7aa,#4b4c50)!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230 .chair-base{ left:20px!important;bottom:2px!important;width:58px!important;height:9px!important; background:linear-gradient(#77797d,#35363a)!important; border-radius:50%!important; box-shadow:0 3px 3px rgba(0,0,0,.25)!important; } /* Salon customization upgrade category between Frame and Avatar */ body.gg-salon-room-v206 #ggSalonUpgradeCategoryV242{ border-color:rgba(215,176,91,.55)!important; } body.gg-salon-room-v206 #ggSalonUpgradeCategoryV242 i{ font-size:18px!important; font-weight:1000!important; } /* Salon top-right cluster: Shop, Avatar, Door, Menu */ body.gg-salon-room-v206 .gg-salon-top-icons-v242{ margin-left:auto!important; display:flex!important; justify-content:flex-end!important; align-items:center!important; gap:5px!important; flex:1 1 auto!important; } body.gg-salon-room-v206 .gg-salon-top-icons-v242 > a, body.gg-salon-room-v206 .gg-salon-top-icons-v242 .gg-global-menu-btn-v235{ flex:0 0 36px!important; width:36px!important; height:36px!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; } body.gg-salon-room-v206 .gg-salon-top-icons-v242 .gg-global-nav-v235{ margin-left:0!important; } /* Client dimensions are supplied from the user's actual Salon avatar by JS. */ body.gg-salon-room-v206 #ggSalonClientV230{ max-width:none!important; max-height:none!important; } /* ========================================================== v243 — makeup eye/lash placement is higher on the face ========================================================== */ .gg-makeup-face-v240{ overflow:visible!important; } /* ========================================================== v243 — front avatar dialogue ========================================================== */ .gg-avatar-dialog-v243{ position:absolute!important; z-index:2147483638!important; transform:translate(-50%,-100%) scale(.92)!important; max-width:min(230px,72vw)!important; padding:8px 11px!important; border-radius:14px!important; background:rgba(9,9,12,.94)!important; border:1px solid rgba(232,199,107,.55)!important; color:#f8f1dc!important; font-size:11px!important; font-weight:800!important; line-height:1.25!important; text-align:center!important; pointer-events:none!important; opacity:0!important; box-shadow:0 8px 20px rgba(0,0,0,.3)!important; transition:opacity .18s ease,transform .18s ease!important; } .gg-avatar-dialog-v243::after{ content:""!important; position:absolute!important; left:50%!important; bottom:-6px!important; width:11px!important; height:11px!important; transform:translateX(-50%) rotate(45deg)!important; background:rgba(9,9,12,.94)!important; border-right:1px solid rgba(232,199,107,.55)!important; border-bottom:1px solid rgba(232,199,107,.55)!important; } .gg-avatar-dialog-v243.show{ opacity:1!important; transform:translate(-50%,-100%) scale(1)!important; } /* ========================================================== v243 — avatar ground shadow in rooms ========================================================== */ .gg-room-avatar-shadow-v243{ position:absolute!important; z-index:8995!important; transform:translate(-50%,-50%)!important; border-radius:50%!important; background:radial-gradient(ellipse,rgba(0,0,0,.38) 0 42%,rgba(0,0,0,.17) 62%,transparent 76%)!important; filter:blur(1px)!important; pointer-events:none!important; } /* ========================================================== v243 — Salon customer in front while walking ========================================================== */ body.gg-salon-room-v206 #ggSalonClientV230.gg-salon-client-front-v243{ z-index:2147483350!important; } body.gg-salon-room-v206 #ggSalonClientV230.seated{ z-index:7300!important; } /* ========================================================== v243 — Fern player: no black circle, stronger physical jump ========================================================== */ #ggFernPlayerV231{ background:transparent!important; border:0!important; box-shadow:none!important; filter:none!important; will-change:transform,left,bottom!important; } #ggFernPlayerV231::before, #ggFernPlayerV231::after{ content:none!important; display:none!important; } #ggFernPlayerV231 svg #avatarBg, #ggFernPlayerV231 svg circle[fill="url(#stageGlow)"], #ggFernPlayerV231 svg ellipse[fill="#111116"], #ggFernPlayerV231 svg ellipse[fill="#111"]{ display:none!important; } #ggFernPlayerV231.gg-fern-jumping-v243{ filter:drop-shadow(0 8px 7px rgba(0,0,0,.24))!important; } /* Leaves become thicker, dimensional platforms */ .gg-fern-platform-v239{ width:128px!important; height:40px!important; filter:drop-shadow(0 6px 4px rgba(0,0,0,.2))!important; } .gg-fern-platform-v239 i{ background: linear-gradient(165deg,rgba(255,255,255,.3),transparent 25%), repeating-linear-gradient(12deg,transparent 0 8px,rgba(23,80,39,.18) 9px 11px), linear-gradient(145deg,#a8df7d 0,#64aa52 48%,#2e713e 100%)!important; border:3px solid #245c34!important; box-shadow: inset 0 3px 0 rgba(255,255,255,.2), inset 0 -5px 7px rgba(25,82,38,.2), 0 4px 6px rgba(0,0,0,.18)!important; } .gg-fern-platform-v239 b{ height:7px!important; background:linear-gradient(#4c914c,#255f35)!important; box-shadow:0 2px 2px rgba(0,0,0,.18)!important; } /* Rich fern stem with texture */ .gg-fern-stem-v231{ width:16px!important; background: repeating-linear-gradient(18deg,transparent 0 11px,rgba(15,60,29,.28) 12px 15px), linear-gradient(90deg,#183f25 0,#4d9950 28%,#8bc96c 50%,#438846 70%,#143a22 100%)!important; box-shadow: inset 3px 0 3px rgba(255,255,255,.12), inset -3px 0 3px rgba(0,0,0,.18), 0 0 5px rgba(0,0,0,.2)!important; } /* ========================================================== v243 — HEAVY Fern environment art ========================================================== */ .gg-fern-scenery-v243{ position:absolute!important; inset:0!important; z-index:0!important; overflow:hidden!important; pointer-events:none!important; } .gg-fern-depth-v243, .gg-fern-orb-v243{ position:absolute!important; pointer-events:none!important; transition:opacity .55s ease!important; } /* Ground mountains */ .gg-fern-depth-v243.mountains{ left:-10%!important; right:-10%!important; bottom:10%!important; height:38%!important; opacity:.9!important; background: linear-gradient(145deg,transparent 0 23%,#557a57 24% 38%,transparent 39%) 0 100%/42% 100% no-repeat, linear-gradient(215deg,transparent 0 27%,#466c4d 28% 44%,transparent 45%) 48% 100%/52% 100% no-repeat, linear-gradient(155deg,transparent 0 28%,#3c6045 29% 45%,transparent 46%) 92% 100%/45% 100% no-repeat!important; filter:drop-shadow(0 10px 8px rgba(0,0,0,.16))!important; } .gg-fern-depth-v243.treeline{ left:0!important; right:0!important; bottom:0!important; height:20%!important; background: repeating-linear-gradient(75deg,#244b31 0 10px,#35633b 11px 18px,#1f432d 19px 27px)!important; clip-path:polygon(0 55%,4% 36%,7% 55%,11% 24%,15% 55%,20% 31%,25% 55%,30% 18%,35% 55%,41% 28%,47% 55%,53% 22%,59% 55%,65% 34%,71% 55%,77% 20%,83% 55%,89% 30%,95% 55%,100% 40%,100% 100%,0 100%)!important; opacity:.82!important; } /* Cloud banks */ .gg-fern-depth-v243.cloudbank{ width:80%!important; height:24%!important; border-radius:50%!important; background: radial-gradient(ellipse at 15% 55%,rgba(255,255,255,.9) 0 18%,transparent 19%), radial-gradient(ellipse at 34% 42%,rgba(255,255,255,.94) 0 22%,transparent 23%), radial-gradient(ellipse at 55% 55%,rgba(255,255,255,.88) 0 21%,transparent 22%), radial-gradient(ellipse at 74% 42%,rgba(255,255,255,.9) 0 20%,transparent 21%)!important; opacity:0!important; filter:drop-shadow(0 7px 12px rgba(58,98,122,.14))!important; } .gg-fern-depth-v243.cloudbank.one{ left:-22%!important; top:18%!important; animation:ggFernCloudBankV243 19s ease-in-out infinite alternate!important; } .gg-fern-depth-v243.cloudbank.two{ right:-28%!important; top:54%!important; transform:scale(.72)!important; animation:ggFernCloudBankV243 24s ease-in-out infinite alternate-reverse!important; } @keyframes ggFernCloudBankV243{ from{translate:-4% 0} to{translate:9% -8px} } /* Nebula and galaxy */ .gg-fern-depth-v243.nebula{ inset:-15%!important; opacity:0!important; background: radial-gradient(ellipse at 22% 35%,rgba(118,74,178,.4),transparent 30%), radial-gradient(ellipse at 72% 54%,rgba(42,116,179,.35),transparent 33%), radial-gradient(ellipse at 48% 76%,rgba(177,63,126,.22),transparent 28%)!important; filter:blur(12px)!important; } .gg-fern-depth-v243.galaxy{ left:56%!important; top:15%!important; width:220px!important; height:96px!important; opacity:0!important; border-radius:50%!important; background: radial-gradient(ellipse,#fff 0 2%,#9ebaff 4%,rgba(115,77,190,.48) 18%,rgba(49,28,106,.15) 42%,transparent 62%)!important; transform:rotate(-22deg)!important; box-shadow:0 0 34px rgba(118,93,207,.22)!important; } /* Planet bodies */ .gg-fern-orb-v243{ width:66px!important; height:66px!important; border-radius:50%!important; opacity:0!important; box-shadow:inset -15px -12px 18px rgba(0,0,0,.32),0 0 18px rgba(255,255,255,.1)!important; } .gg-fern-orb-v243.orb-a{ right:9%!important;top:21%!important; background:linear-gradient(145deg,#e29c6c,#87404b)!important; } .gg-fern-orb-v243.orb-b{ left:8%!important;top:61%!important;width:45px!important;height:45px!important; background:linear-gradient(145deg,#70b2d8,#43589c)!important; } .gg-fern-orb-v243.orb-c{ right:32%!important;top:72%!important;width:30px!important;height:30px!important; background:linear-gradient(145deg,#c6b570,#776431)!important; } /* Zone-dependent scenery */ .gg-fern-stage-v231[data-zone="ground"] .gg-fern-depth-v243.mountains, .gg-fern-stage-v231[data-zone="ground"] .gg-fern-depth-v243.treeline{ opacity:.9!important; } .gg-fern-stage-v231[data-zone="sky"] .gg-fern-depth-v243.mountains{ opacity:.25!important; } .gg-fern-stage-v231[data-zone="sky"] .gg-fern-depth-v243.treeline{ opacity:.12!important; } .gg-fern-stage-v231[data-zone="sky"] .gg-fern-depth-v243.cloudbank, .gg-fern-stage-v231[data-zone="clouds"] .gg-fern-depth-v243.cloudbank{ opacity:.9!important; } .gg-fern-stage-v231[data-zone="clouds"] .gg-fern-depth-v243.cloudbank.one{ opacity:1!important; transform:scale(1.18)!important; } .gg-fern-stage-v231[data-zone="stars"] .gg-fern-depth-v243.nebula, .gg-fern-stage-v231[data-zone="planets"] .gg-fern-depth-v243.nebula{ opacity:1!important; } .gg-fern-stage-v231[data-zone="stars"] .gg-fern-depth-v243.galaxy, .gg-fern-stage-v231[data-zone="planets"] .gg-fern-depth-v243.galaxy{ opacity:.85!important; } .gg-fern-stage-v231[data-zone="planets"] .gg-fern-orb-v243{ opacity:1!important; } /* Keep actual game objects above scenery */ .gg-fern-world-v231{z-index:5!important} .gg-fern-stars-v231, .gg-fern-mist-v231, .gg-fern-planets-v231{z-index:2!important} /* No non-game popups bleed into games */ body.gg-mini-game-open-v097 > .gg-toast-v106, .gg-fern-game-v231.show ~ .gg-toast-v106, .gg-light-game-v107.show ~ .gg-toast-v106{ visibility:hidden!important; } /* ========================================================== v244 — Avatar head-top + new outfit support ========================================================== */ #flowerAbsoluteFrontV174, #extraAccessory.gg-head-top-v244, #extraAccessory2.gg-head-top-v244{ pointer-events:none!important; } /* Generic patrol cap and outfit styling stay SVG-native. */ .gg-patrol-cap-v244, .gg-patrol-uniform-v244, .gg-swamp-ogre-v244{ pointer-events:none!important; } /* Goldie's Salon clients remain behind the user avatar at all times. */ body.gg-salon-room-v206 #ggSalonClientV230.gg-salon-client-behind-v244, body.gg-salon-room-v206 #ggSalonClientV230.gg-salon-client-front-v243{ z-index:8200!important; } body.gg-salon-room-v206 #ggSalonClientV230.seated{ z-index:7200!important; } body.gg-salon-room-v206 #avatarRoom .room-avatar.room-avatar-exact{ z-index:9000!important; } /* ========================================================== v245 — Home right-side quick icons ========================================================== */ .gg-home-nav-v245{ display:flex!important; align-items:center!important; width:100%!important; } .gg-home-right-icons-v245{ margin-left:auto!important; display:inline-flex!important; align-items:center!important; justify-content:flex-end!important; gap:5px!important; } .gg-home-right-icons-v245 > a, .gg-home-right-icons-v245 > button{ width:36px!important; height:36px!important; flex:0 0 36px!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; } .gg-shop-bag-v245{ font-size:19px!important; text-decoration:none!important; line-height:1!important; } /* ========================================================== v245 — OFF ceiling light must remain visible ABOVE blackout. ========================================================== */ #avatarRoom.gg-blackout-v232 #roomCeilingLightV072, #roomCeilingLightV072.gg-light-off-visible-v245{ position:absolute!important; z-index:2147483610!important; outline:4px solid #ffd75f!important; outline-offset:5px!important; border-radius:50%!important; background:rgba(255,214,83,.32)!important; filter:brightness(1.9) drop-shadow(0 0 10px rgba(255,223,103,1)) drop-shadow(0 0 25px rgba(255,223,103,.98))!important; opacity:1!important; pointer-events:auto!important; } #avatarRoom.gg-blackout-v232 #roomCeilingLightV072 .gg-light-bulb-v235{ opacity:1!important; visibility:visible!important; filter:brightness(1.4)!important; } /* ========================================================== v245 — Gauge peek mode ========================================================== */ #avatarRoom.gg-avatar-peek-v245 .room-avatar.room-avatar-exact{ opacity:.48!important; transition:opacity .22s ease!important; } #roomMoodGaugeV065, #ggRoomLevelV143{ cursor:pointer!important; } #roomMoodGaugeV065[aria-pressed="true"], #ggRoomLevelV143[aria-pressed="true"]{ box-shadow:0 0 0 2px rgba(241,204,95,.78),0 0 15px rgba(241,204,95,.3)!important; } /* ========================================================== v245 — Fern realism + stronger leaf contact ========================================================== */ .gg-fern-organic-v245{ position:absolute!important; inset:0!important; z-index:4!important; pointer-events:none!important; overflow:hidden!important; } .gg-fern-organic-v245 .frond{ position:absolute!important; left:50%!important; bottom:7%!important; width:12px!important; height:58%!important; transform-origin:bottom center!important; border-radius:100% 0 100% 0!important; background: repeating-linear-gradient(to top,transparent 0 15px,rgba(113,183,93,.95) 16px 26px,transparent 27px 34px), linear-gradient(90deg,#214f31,#61a45a 55%,#183f28)!important; clip-path:polygon(46% 100%,34% 84%,2% 78%,34% 72%,5% 63%,37% 59%,7% 49%,39% 46%,11% 36%,42% 34%,19% 23%,45% 22%,38% 8%,50% 0,62% 8%,55% 22%,81% 23%,58% 34%,89% 36%,61% 46%,93% 49%,63% 59%,95% 63%,66% 72%,98% 78%,66% 84%,54% 100%)!important; opacity:.72!important; filter:drop-shadow(0 4px 3px rgba(0,0,0,.18))!important; } .gg-fern-organic-v245 .f1{transform:translateX(-50%) rotate(-24deg) scale(.76)!important} .gg-fern-organic-v245 .f2{transform:translateX(-50%) rotate(24deg) scale(.76)!important} .gg-fern-organic-v245 .f3{transform:translateX(-50%) rotate(-10deg) scale(.9)!important} .gg-fern-organic-v245 .f4{transform:translateX(-50%) rotate(11deg) scale(.88)!important} .gg-fern-organic-v245 .fiddlehead{ position:absolute!important; left:50%!important; bottom:61%!important; width:34px!important; height:34px!important; border-radius:50%!important; border:8px solid #5e9f55!important; border-left-color:transparent!important; border-bottom-color:transparent!important; box-shadow:0 0 0 2px rgba(38,92,45,.18)!important; } .gg-fern-organic-v245 .h1{transform:translateX(-44px) rotate(-22deg)!important} .gg-fern-organic-v245 .h2{transform:translateX(12px) rotate(28deg) scale(.82)!important} /* More realistic leaf platforms */ .gg-fern-platform-v239{ width:142px!important; height:46px!important; } .gg-fern-platform-v239 i{ border-radius:90% 8% 88% 12%!important; background: linear-gradient(167deg,rgba(255,255,255,.28),transparent 24%), repeating-linear-gradient(23deg,transparent 0 9px,rgba(22,75,35,.18) 10px 12px), linear-gradient(150deg,#9dd477 0,#5da255 42%,#387c45 72%,#205c36 100%)!important; border:2px solid #245d37!important; box-shadow: inset 0 2px 0 rgba(255,255,255,.18), inset 0 -7px 8px rgba(16,68,31,.2), 0 7px 8px rgba(0,0,0,.18)!important; } .gg-fern-platform-v239 i::after{ content:""!important; position:absolute!important; left:8%!important; right:8%!important; top:50%!important; height:3px!important; background:#2f7240!important; border-radius:99px!important; transform:rotate(-2deg)!important; box-shadow: 20px -9px 0 -1px rgba(48,116,63,.55), 38px -15px 0 -1px rgba(48,116,63,.42), 20px 9px 0 -1px rgba(48,116,63,.5), 40px 15px 0 -1px rgba(48,116,63,.35)!important; } #ggFernPlayerV231{ margin-bottom:0!important; transform-origin:center bottom!important; } #ggFernPlayerV231.gg-fern-jump-active-v245{ filter:drop-shadow(0 12px 8px rgba(0,0,0,.26))!important; } /* ========================================================== v245 — Salon client exact sizing and improved chair ========================================================== */ body.gg-salon-room-v206 #ggSalonClientV230{ max-width:none!important; max-height:none!important; transform-origin:center bottom!important; } body.gg-salon-room-v206 #ggSalonClientV230 svg{ width:100%!important; height:100%!important; } /* Heavier professional starter salon chair */ body.gg-salon-room-v206 .gg-salon-chair-side-v230{ width:102px!important; height:128px!important; left:18%!important; bottom:0!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230 .chair-back{ left:16px!important; top:3px!important; width:57px!important; height:68px!important; border:3px solid #1f2227!important; border-radius:17px 17px 8px 8px!important; background: linear-gradient(105deg,rgba(255,255,255,.09),transparent 30%), linear-gradient(#564c4d,#3e373a)!important; box-shadow: inset 0 0 0 3px rgba(120,103,102,.18), inset -7px 0 10px rgba(0,0,0,.15), 0 4px 5px rgba(0,0,0,.2)!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230 .chair-back::before{ content:""!important; position:absolute!important; left:8px!important; right:8px!important; top:13px!important; height:2px!important; background:rgba(205,190,180,.18)!important; box-shadow:0 16px 0 rgba(205,190,180,.14),0 32px 0 rgba(205,190,180,.1)!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230 .chair-back::after{ right:-21px!important; top:39px!important; width:31px!important; height:10px!important; border-radius:8px!important; background:linear-gradient(#66666c,#2f3034)!important; border:2px solid #202126!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230 .chair-seat{ left:18px!important; top:67px!important; width:68px!important; height:23px!important; border:3px solid #1f2227!important; border-radius:8px 16px 11px 8px!important; background:linear-gradient(#5a4d50,#393236)!important; box-shadow:inset 0 3px 4px rgba(255,255,255,.06)!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230 .chair-post{ left:49px!important; top:89px!important; width:10px!important; height:27px!important; background:linear-gradient(90deg,#33363a,#afb2b5 48%,#383a3e)!important; border-radius:2px!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230 .chair-base{ left:20px!important; bottom:1px!important; width:74px!important; height:11px!important; border-radius:50%!important; background:linear-gradient(#777a7f,#2d3034)!important; border:2px solid #24262a!important; box-shadow:0 4px 5px rgba(0,0,0,.25)!important; } /* ========================================================== v246 — one Salon door + icon-only storefront Shop button ========================================================== */ body.gg-salon-room-v206 #ggSalonHomeHudV222, body.gg-salon-room-v206 #ggSalonHomeDoorV221{ display:none!important; } .gg-storefront-icon-v246{ position:relative!important; display:inline-block!important; width:20px!important; height:13px!important; margin-top:5px!important; border:2px solid currentColor!important; border-radius:1px 1px 3px 3px!important; font-size:0!important; box-sizing:border-box!important; } .gg-storefront-icon-v246::before{ content:""!important; position:absolute!important; left:-4px!important; top:-8px!important; width:24px!important; height:8px!important; border:2px solid currentColor!important; border-bottom-width:3px!important; border-radius:4px 4px 2px 2px!important; background: repeating-linear-gradient(90deg,currentColor 0 3px,transparent 3px 6px)!important; box-sizing:border-box!important; } .gg-storefront-icon-v246::after{ content:""!important; position:absolute!important; right:2px!important; bottom:0!important; width:5px!important; height:7px!important; border-left:2px solid currentColor!important; } /* Patrol cap is a true front headpiece like crown/flower. */ .gg-patrol-cap-v244{ pointer-events:none!important; } /* ========================================================== v250 — canonical layer map ========================================================== */ #avatarRoom .room-avatar-shadow-v243{z-index:var(--gg-z-avatar-shadow)!important} #avatarRoom .room-avatar.room-avatar-exact{z-index:var(--gg-z-avatar-body)!important} #avatarRoom #roomMoodGaugeV065, #avatarRoom #ggRoomLevelV143, #avatarRoom #ggSalonMoneyGaugeV230{z-index:var(--gg-z-gauges)!important} #avatarRoom .gg-avatar-dialog-v243{z-index:var(--gg-z-dialogue)!important} #avatarRoom .gg-level-celebrate-v241{z-index:var(--gg-z-effects)!important} #avatarRoom .gg-flash-beam-v241{z-index:var(--gg-z-effects)!important} /* Headpieces are explicitly above hair/horns. */ #flowerAbsoluteFrontV174, #extraAccessory:has(.gg-patrol-cap-v244), #extraAccessory2:has(.gg-patrol-cap-v244){ z-index:var(--gg-z-avatar-headtop)!important; } /* ========================================================== v250 — shared top navigation ========================================================== */ .gg-shared-nav-icons-v250{ margin-left:auto!important; display:inline-flex!important; align-items:center!important; justify-content:flex-end!important; gap:5px!important; } .gg-shared-nav-icons-v250 > a, .gg-shared-nav-icons-v250 > button{ width:36px!important; height:36px!important; flex:0 0 36px!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; } .gg-storefront-link-v250{text-decoration:none!important} /* ========================================================== v250 — Salon progression visuals ========================================================== */ .gg-salon-upgrade-panel-v250{ position:fixed!important; left:50%!important; top:50%!important; transform:translate(-50%,-50%) scale(.96)!important; width:min(92vw,460px)!important; max-height:76vh!important; overflow:auto!important; padding:18px!important; z-index:var(--gg-z-modal)!important; border-radius:20px!important; background:#111116!important; border:1px solid rgba(215,176,91,.42)!important; box-shadow:0 28px 90px rgba(0,0,0,.62)!important; } .gg-salon-upgrade-panel-v250 .close{ float:right!important; width:34px!important;height:34px!important;border-radius:50%!important; } .gg-salon-upgrade-panel-v250 .grid{ display:grid!important; grid-template-columns:repeat(2,1fr)!important; gap:8px!important; margin-top:12px!important; } .gg-salon-upgrade-panel-v250 .grid button{ padding:13px 10px!important; border-radius:12px!important; display:flex!important; flex-direction:column!important; gap:4px!important; } .gg-client-request-v250{ grid-column:1/-1!important; padding:7px 9px!important; border-radius:9px!important; background:rgba(215,176,91,.09)!important; color:#f0dfb8!important; font-size:10px!important; } #avatarRoom[data-salon-chair-level="1"] .gg-salon-chair-side-v230 .chair-back, #avatarRoom[data-salon-chair-level="1"] .gg-salon-chair-side-v230 .chair-seat{ background:linear-gradient(#655b63,#433c42)!important; } #avatarRoom[data-salon-chair-level="2"] .gg-salon-chair-side-v230 .chair-back, #avatarRoom[data-salon-chair-level="2"] .gg-salon-chair-side-v230 .chair-seat{ background:linear-gradient(#6b5942,#3d3026)!important; border-color:#b88d45!important; } #avatarRoom.gg-salon-second-floor-v250::after{ content:"SECOND FLOOR UNLOCKED"!important; position:absolute!important; right:10px!important; top:8px!important; padding:4px 7px!important; font-size:8px!important; border-radius:999px!important; background:rgba(12,12,16,.78)!important; color:#e7c96d!important; } /* ========================================================== v250 — client renderer ========================================================== */ .gg-client-avatar-v250{ width:100%!important; height:100%!important; overflow:visible!important; } /* ========================================================== v250 — debug ========================================================== */ .gg-debug-v250{ position:fixed!important; right:8px!important; bottom:8px!important; width:min(360px,90vw)!important; max-height:55vh!important; z-index:2147483647!important; padding:10px!important; border-radius:12px!important; background:rgba(0,0,0,.94)!important; color:#9fffa4!important; border:1px solid #315d35!important; overflow:auto!important; font:11px/1.4 monospace!important; } .gg-debug-v250[hidden]{display:none!important} .gg-debug-v250 button{ float:right!important; width:28px!important;height:28px!important;border-radius:50%!important; } .gg-debug-v250 pre{white-space:pre-wrap!important} /* ========================================================== v250 — performance ========================================================== */ .gg-page-hidden-v250 *{ animation-play-state:paused!important; } /* Fern platforms get more natural serrated structure. */ .gg-fern-platform-v239 i{ clip-path:polygon( 0 54%,8% 42%,14% 47%,20% 34%,27% 42%,34% 27%,42% 38%,50% 20%, 58% 38%,66% 27%,73% 42%,80% 34%,86% 47%,92% 42%,100% 54%, 92% 62%,86% 58%,80% 70%,73% 61%,66% 76%,58% 64%,50% 82%, 42% 64%,34% 76%,27% 61%,20% 70%,14% 58%,8% 62% )!important; } /* ========================================================== v251 — Fern combo + landing contact ========================================================== */ .gg-fern-combo-v251{ position:absolute!important; right:12px!important; top:12px!important; z-index:18!important; padding:6px 9px!important; border-radius:999px!important; background:rgba(9,12,10,.72)!important; border:1px solid rgba(173,224,126,.5)!important; color:#e7f8c8!important; font-size:11px!important; font-weight:1000!important; letter-spacing:.04em!important; } .gg-fern-combo-v251.hit{ animation:ggFernComboHitV251 .22s ease!important; } @keyframes ggFernComboHitV251{ 50%{transform:scale(1.16);filter:brightness(1.35)} } #ggFernPlayerV231.gg-fern-land-shake-v251{ animation:ggFernLandShakeV251 .22s linear!important; } @keyframes ggFernLandShakeV251{ 0%,100%{translate:0 0} 25%{translate:-2px 1px} 50%{translate:3px 0} 75%{translate:-1px -1px} } /* Slightly deeper feet contact with fern leaf. */ #ggFernPlayerV231{ transform-origin:center bottom!important; } /* ========================================================== v251 — Gremlin ghost found mark ========================================================== */ .gg-flash-ghost-v232.gg-ghost-pop-v251{ animation:ggGhostPopV251 .32s cubic-bezier(.2,.8,.2,1) forwards!important; } @keyframes ggGhostPopV251{ 0%{transform:scale(1);opacity:1} 50%{transform:scale(1.35);opacity:1;filter:brightness(1.8)} 100%{transform:scale(.1);opacity:0} } .gg-ghost-found-mark-v251{ position:absolute!important; width:48px!important; height:24px!important; transform:translate(-50%,-50%) scale(.75)!important; z-index:9354!important; pointer-events:none!important; opacity:0!important; transition:opacity 4s linear,transform .22s ease!important; } .gg-ghost-found-mark-v251.show{ opacity:.95!important; transform:translate(-50%,-50%) scale(1)!important; } .gg-ghost-found-mark-v251.fade{ opacity:0!important; } .gg-ghost-found-mark-v251 i{ position:absolute!important; inset:4px 0 0!important; border-radius:50% 58% 42% 55%!important; background:#5de45e!important; border:2px solid #1d7c30!important; box-shadow:0 0 8px rgba(86,255,103,.42)!important; } .gg-ghost-found-mark-v251 b{ position:absolute!important; left:9px!important; top:-4px!important; width:10px!important; height:14px!important; border-radius:50%!important; background:#8ff58a!important; } /* ========================================================== v251 — Salon client exact sizing / seat hop ========================================================== */ body.gg-salon-room-v206 #ggSalonClientV230{ max-width:none!important; max-height:none!important; transform-origin:center bottom!important; } body.gg-salon-room-v206 #ggSalonClientV230 svg{ width:100%!important; height:100%!important; } /* ========================================================== v252 — Hidden Gremlin object hunt ========================================================== */ #avatarRoom .gg-gremlin-hidden-v252{ isolation:isolate!important; overflow:visible!important; } .gg-gremlin-slime-shell-v252{ position:absolute!important; inset:-5%!important; z-index:2147483400!important; pointer-events:none!important; border-radius:18px!important; background: radial-gradient(circle at 13% 22%,rgba(154,255,137,.95) 0 8%,transparent 9%), radial-gradient(circle at 78% 16%,rgba(117,241,103,.9) 0 10%,transparent 11%), radial-gradient(circle at 42% 74%,rgba(85,214,82,.92) 0 13%,transparent 14%), radial-gradient(circle at 83% 72%,rgba(106,234,96,.9) 0 9%,transparent 10%), linear-gradient(145deg,rgba(90,225,84,.86),rgba(22,130,51,.9))!important; border:2px solid rgba(27,105,43,.95)!important; box-shadow: inset 0 0 18px rgba(198,255,176,.32), 0 0 13px rgba(83,255,98,.38)!important; opacity:.94!important; } .gg-gremlin-slime-shell-v252 i{ position:absolute!important; width:20px!important;height:20px!important; border-radius:50%!important; background:#7bef74!important; box-shadow:inset -4px -4px 5px rgba(18,108,39,.18)!important; } .gg-gremlin-slime-shell-v252 i:nth-child(1){left:6%;top:14%!important} .gg-gremlin-slime-shell-v252 i:nth-child(2){right:8%;top:7%!important;width:28px!important;height:28px!important} .gg-gremlin-slime-shell-v252 i:nth-child(3){left:32%;bottom:4%!important;width:31px!important;height:31px!important} .gg-gremlin-slime-shell-v252 i:nth-child(4){right:19%;bottom:13%!important} .gg-gremlin-slime-shell-v252 i:nth-child(5){left:51%;top:34%!important;width:15px!important;height:15px!important} .gg-gremlin-eyes-v252{ position:absolute!important; left:50%!important;top:36%!important; width:62px!important;height:28px!important; transform:translate(-50%,-50%)!important; z-index:2147483410!important; display:flex!important; justify-content:space-between!important; pointer-events:none!important; } .gg-gremlin-eyes-v252 b{ width:24px!important;height:28px!important; border-radius:52% 48% 55% 45%!important; background:#f3ffe9!important; border:2px solid #164725!important; box-shadow:0 0 6px rgba(255,255,255,.55)!important; position:relative!important; animation:ggGremlinBlinkV252 3.1s infinite!important; } .gg-gremlin-eyes-v252 b::after{ content:""!important; position:absolute!important; width:8px!important;height:11px!important; left:8px!important;top:8px!important; border-radius:50%!important; background:#123d20!important; } .gg-gremlin-eyes-v252 b:nth-child(2){animation-delay:.08s!important} @keyframes ggGremlinBlinkV252{ 0%,42%,48%,100%{transform:scaleY(1)} 45%,46%{transform:scaleY(.08)} } .gg-gremlin-catch-meter-v252{ position:absolute!important; left:50%!important; top:14px!important; transform:translateX(-50%) translateY(-8px)!important; width:min(220px,66%)!important; z-index:2147483625!important; opacity:0!important; pointer-events:none!important; transition:opacity .16s ease,transform .16s ease!important; } .gg-gremlin-catch-meter-v252.show{ opacity:1!important; transform:translateX(-50%) translateY(0)!important; } .gg-gremlin-catch-meter-v252>span{ display:block!important; text-align:center!important; font-size:9px!important; font-weight:1000!important; color:#b8ffad!important; margin-bottom:4px!important; text-shadow:0 1px 3px #000!important; } .gg-gremlin-catch-meter-v252>div{ height:10px!important; overflow:hidden!important; border-radius:99px!important; background:rgba(7,22,10,.9)!important; border:1px solid #56c75a!important; } .gg-gremlin-catch-meter-v252 i{ display:block!important; width:0;height:100%!important; background:linear-gradient(90deg,#35b94a,#a0f78c)!important; box-shadow:0 0 9px rgba(92,255,107,.65)!important; transition:width .07s linear!important; } .gg-hidden-gremlin-reveal-v252{ position:absolute!important; width:76px!important;height:82px!important; transform:translate(-50%,-50%)!important; z-index:2147483550!important; pointer-events:none!important; transition:opacity .7s ease,transform .7s ease!important; } .gg-hidden-gremlin-reveal-v252 span{ position:absolute!important;inset:0!important; border-radius:48% 52% 42% 58%!important; background:linear-gradient(145deg,#81f16f,#20863c)!important; border:3px solid #174d27!important; filter:drop-shadow(0 0 10px rgba(92,255,106,.7))!important; } .gg-hidden-gremlin-reveal-v252 b{ position:absolute!important; top:24%!important; color:#f4ffed!important; font-size:21px!important; text-shadow:0 0 2px #173d20!important; } .gg-hidden-gremlin-reveal-v252 b:first-child{left:18%!important} .gg-hidden-gremlin-reveal-v252 b:nth-child(2){right:18%!important} .gg-hidden-gremlin-reveal-v252 i{ position:absolute!important;left:50%!important;bottom:18%!important; width:28px!important;height:10px!important;transform:translateX(-50%)!important; background:#153c20!important;border-radius:3px 3px 12px 12px!important; } .gg-hidden-gremlin-reveal-v252.pop{ opacity:0!important; transform:translate(-50%,-70%) scale(.28) rotate(12deg)!important; } .gg-gremlin-slime-fade-v252{ transition:opacity 4s linear!important; opacity:0!important; } /* ========================================================== v252 — Salon upgrade row is continuous Frame -> Upgrade -> Avatar ========================================================== */ body.gg-salon-room-v206 #roomCategoryLoop{ gap:4px!important; } body.gg-salon-room-v206 #ggSalonUpgradeCategoryV242{ display:inline-flex!important; align-items:center!important; justify-content:center!important; flex-direction:column!important; min-width:58px!important; min-height:54px!important; margin:0!important; padding:5px 7px!important; border:1px solid rgba(215,176,91,.5)!important; border-radius:10px!important; background:rgba(18,16,20,.8)!important; box-sizing:border-box!important; } body.gg-salon-room-v206 #ggSalonUpgradeCategoryV242 + [data-room-category="care"]{ margin-left:0!important; } /* Client visible scale comes from JS; do not cap it. */ body.gg-salon-room-v206 #ggSalonClientV230{ max-width:none!important; max-height:none!important; overflow:visible!important; } body.gg-salon-room-v206 #ggSalonClientV230.seated{ animation:none!important; } /* ========================================================== v252 — Goldie's Salon Scene Window also sets room background ========================================================== */ body.gg-salon-room-v206 #roomSceneWindowV055{ display:block!important; opacity:1!important; visibility:visible!important; z-index:80!important; } body.gg-salon-room-v206 #avatarRoom[data-salon-scene="storm"]{ background:linear-gradient(#313d55 0 34%,#5a6678 34% 55%,#6e625a 55% 100%)!important; } body.gg-salon-room-v206 #avatarRoom[data-salon-scene="city"]{ background:linear-gradient(#202c45 0 40%,#3a4456 40% 54%,#655d5a 54% 100%)!important; } body.gg-salon-room-v206 #avatarRoom[data-salon-scene="night"]{ background:linear-gradient(#080d20 0 48%,#202742 48% 56%,#5b5453 56% 100%)!important; } body.gg-salon-room-v206 #avatarRoom[data-salon-scene="sunny"]{ background:linear-gradient(#8ad0f2 0 46%,#d9e6db 46% 56%,#736960 56% 100%)!important; } body.gg-salon-room-v206 #avatarRoom[data-salon-scene="beach"]{ background:linear-gradient(#79c8ee 0 35%,#5cc5d3 35% 47%,#d8bc7c 47% 60%,#786b5d 60% 100%)!important; } body.gg-salon-room-v206 #avatarRoom[data-salon-scene="space"]{ background: radial-gradient(circle at 20% 17%,#fff 0 1px,transparent 2px), radial-gradient(circle at 70% 26%,#fff 0 1px,transparent 2px), linear-gradient(#060a19 0 56%,#2c2a35 56% 100%)!important; } body.gg-salon-room-v206 #avatarRoom[data-salon-scene="underwater"]{ background:linear-gradient(#125d82 0 40%,#247c96 40% 55%,#4d6264 55% 100%)!important; } body.gg-salon-room-v206 #avatarRoom[data-salon-scene="snow"]{ background:linear-gradient(#b9d9e8 0 44%,#e8eff1 44% 58%,#8d8580 58% 100%)!important; } body.gg-salon-room-v206 #avatarRoom[data-salon-scene="giantEye"]{ background:linear-gradient(#050505 0 52%,#332f31 52% 100%)!important; } /* ========================================================== v252 — Gold center-scroll focus, non-avatar pages only ========================================================== */ .gg-scroll-gold-v252{ color:#f4dea0!important; text-shadow: 0 0 5px rgba(236,192,83,.34), 0 0 12px rgba(236,192,83,.2)!important; transition:color .28s ease,text-shadow .28s ease!important; } .gg-scroll-gold-box-v252{ outline:1px solid rgba(225,182,76,.68)!important; outline-offset:4px!important; box-shadow: 0 0 0 1px rgba(255,222,130,.12), 0 0 18px rgba(220,173,61,.18)!important; transition:outline-color .3s ease,box-shadow .3s ease!important; } /* ========================================================== v252 — Sun theme whimsical scrolling background ========================================================== */ .gg-sun-whimsy-v252{ position:fixed!important; inset:0!important; z-index:-1!important; overflow:hidden!important; pointer-events:none!important; opacity:0!important; transition:opacity .4s ease!important; background: radial-gradient(circle at 20% 18%,rgba(255,241,181,.42),transparent 28%), radial-gradient(circle at 78% 48%,rgba(255,218,178,.3),transparent 32%), linear-gradient(#eee9dc,#e5e3df)!important; } .gg-sun-whimsy-v252.show{opacity:1!important} .gg-sun-whimsy-v252 i{ position:absolute!important; left:var(--x)!important; bottom:-10%!important; font-style:normal!important; font-size:var(--s)!important; color:rgba(193,146,42,.62)!important; text-shadow:0 0 7px rgba(255,225,145,.55)!important; animation:ggSunWhimsyFloatV252 var(--t) linear var(--d) infinite!important; } @keyframes ggSunWhimsyFloatV252{ 0%{transform:translateY(0) translateX(0) rotate(0);opacity:0} 10%{opacity:.65} 50%{transform:translateY(-55vh) translateX(18px) rotate(110deg);opacity:.7} 100%{transform:translateY(-120vh) translateX(-10px) rotate(230deg);opacity:0} } /* In Sun mode, dark text panels become warm gold instead of black/dark. */ html[data-gg-site-theme="sun"] .card, html[data-gg-site-theme="sun"] .shop-card, html[data-gg-site-theme="sun"] .portfolio-card, html[data-gg-site-theme="sun"] .panel, html[data-gg-site-theme="sun"] [class*="text-card"], html[data-gg-site-theme="sun"] [class*="info-card"]{ background:linear-gradient(145deg,#e1c36f,#f0db9a)!important; color:#17130d!important; border-color:rgba(126,91,19,.28)!important; } html[data-gg-site-theme="sun"] .card *, html[data-gg-site-theme="sun"] .shop-card *, html[data-gg-site-theme="sun"] .portfolio-card *, html[data-gg-site-theme="sun"] .panel *{ color:#17130d!important; } /* ========================================================== v260 — footer ========================================================== */ .gg-site-footer-v260{ margin-top:70px!important;padding:24px 16px!important; border-top:1px solid rgba(215,176,91,.25)!important; display:grid!important;gap:12px!important;text-align:center!important; } .gg-site-footer-v260>div{display:flex!important;justify-content:center!important;gap:10px!important;flex-wrap:wrap!important} .gg-site-footer-v260 nav{display:flex!important;justify-content:center!important;gap:14px!important;flex-wrap:wrap!important} .gg-site-footer-v260 a{text-decoration:none!important} /* public mini controls */ .gg-public-tools-v260{ position:fixed!important;right:8px!important;bottom:8px!important;z-index:1800!important; display:flex!important;gap:5px!important; } .gg-public-tools-v260 button{font-size:10px!important;padding:7px 9px!important;border-radius:999px!important} /* ========================================================== v260 — settings ========================================================== */ .gg-settings-v260{ position:fixed!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important; width:min(92vw,420px)!important;max-height:82vh!important;overflow:auto!important;z-index:2147483646!important; padding:18px!important;border-radius:18px!important;background:#111116!important;color:#eee!important;border:1px solid rgba(215,176,91,.4)!important; } .gg-settings-v260 .close{float:right!important;width:32px!important;height:32px!important;border-radius:50%!important} .gg-settings-v260 section{display:grid!important;gap:7px!important;padding:12px 0!important;border-top:1px solid rgba(255,255,255,.08)!important} .gg-settings-v260 label{display:flex!important;gap:8px!important;align-items:center!important} .gg-settings-v260 select{padding:8px!important} /* Accessibility */ .gg-reduce-motion-v260 *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important} .gg-large-ui-v260 body{font-size:112%!important} .gg-large-ui-v260 button,.gg-large-ui-v260 a{min-height:42px!important} .gg-high-contrast-v260 body{filter:contrast(1.18)!important} .gg-disable-effects-v260 .gg-sun-whimsy-v252, .gg-disable-effects-v260 .gg-level-celebrate-v241, .gg-disable-effects-v260 .gg-flash-ghost-v232, .gg-disable-effects-v260 .gg-ghost-slime-v242{display:none!important} .gg-low-performance-v260 .gg-sun-whimsy-v252 i:nth-child(n/**/+10), .gg-low-performance-v260 .gg-ghost-slime-v242:nth-child(n/**/+4), .gg-low-performance-v260 .gg-level-celebrate-v241 i:nth-child(n/**/+14){display:none!important} /* ========================================================== v260 — What's New ========================================================== */ .gg-whats-new-v260{ position:fixed!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important; width:min(90vw,420px)!important;z-index:2147483645!important;padding:18px!important;border-radius:18px!important; background:#111116!important;color:#f1ead7!important;border:1px solid rgba(215,176,91,.45)!important; } .gg-whats-new-v260 .close{float:right!important;width:32px!important;height:32px!important;border-radius:50%!important} /* ========================================================== v260 — achievements ========================================================== */ .gg-achievement-v260{ position:fixed!important;left:50%!important;top:74px!important;transform:translate(-50%,-18px) scale(.92)!important; z-index:2147483644!important;display:flex!important;align-items:center!important;gap:10px!important; padding:10px 15px!important;border-radius:14px!important;background:#111116!important;opacity:0!important; transition:.3s ease!important;box-shadow:0 12px 30px rgba(0,0,0,.35)!important; } .gg-achievement-v260.show{opacity:1!important;transform:translate(-50%,0) scale(1)!important} .gg-achievement-v260.out{opacity:0!important;transform:translate(-50%,-12px) scale(.96)!important} .gg-achievement-v260>i{font-size:25px!important;font-style:normal!important} .gg-achievement-v260 small{display:block!important;font-size:7px!important;letter-spacing:.15em!important} .gg-achievement-v260.rarity-uncommon{border:1px solid #6daf6a!important} .gg-achievement-v260.rarity-rare{border:1px solid #4e8dd6!important;box-shadow:0 0 20px rgba(78,141,214,.24)!important} .gg-achievement-v260.rarity-epic{border:1px solid #a76bd0!important;box-shadow:0 0 20px rgba(167,107,208,.28)!important} /* ========================================================== v260 — discoveries page ========================================================== */ .gg-discoveries-v260{width:min(1000px,92vw)!important;margin:80px auto 0!important} .gg-discovery-grid-v260{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(135px,1fr))!important;gap:10px!important} .gg-discovery-grid-v260 article{padding:18px 12px!important;border-radius:14px!important;text-align:center!important;border:1px solid rgba(215,176,91,.2)!important} .gg-discovery-grid-v260 article b{display:block!important;font-size:28px!important;margin-bottom:8px!important} .gg-discovery-grid-v260 .locked{opacity:.45!important;filter:grayscale(1)!important} .gg-discovery-grid-v260 .found{box-shadow:0 0 18px rgba(215,176,91,.12)!important} /* ========================================================== v260 — VIP salon clients ========================================================== */ .gg-vip-client-v260::after{ content:"VIP"!important;position:absolute!important;left:50%!important;top:-14px!important;transform:translateX(-50%)!important; padding:2px 5px!important;border-radius:999px!important;background:#d4aa49!important;color:#17120b!important;font-size:7px!important;font-weight:1000!important; } .gg-vip-client-v260.vip-vampire{filter:drop-shadow(0 0 8px rgba(170,30,55,.35))!important} .gg-vip-client-v260.vip-alien{filter:drop-shadow(0 0 8px rgba(80,220,130,.38))!important} .gg-vip-client-v260.vip-royal{filter:drop-shadow(0 0 8px rgba(220,185,70,.45))!important} .gg-vip-client-v260.vip-goth{filter:drop-shadow(0 0 8px rgba(145,85,175,.4))!important} /* ========================================================== v260 — visible salon upgrade milestones ========================================================== */ body.gg-salon-room-v206 #avatarRoom[data-wall-upgrade="1"]{box-shadow:inset 0 0 0 4px rgba(173,148,112,.15)!important} body.gg-salon-room-v206 #avatarRoom[data-wall-upgrade="2"]{box-shadow:inset 0 0 0 5px rgba(211,173,83,.23)!important} body.gg-salon-room-v206 #avatarRoom[data-floor-upgrade="1"]::before{ content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:12%!important; background:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 28px,rgba(0,0,0,.06) 29px 31px)!important;pointer-events:none!important; } body.gg-salon-room-v206 #avatarRoom[data-mirror-upgrade="1"] #roomSceneWindowV055{box-shadow:0 0 0 3px rgba(210,205,190,.28),0 0 18px rgba(255,255,255,.12)!important} body.gg-salon-room-v206 #avatarRoom[data-decor-upgrade="1"]::after{ content:"✦ ✦ ✦"!important;position:absolute!important;left:50%!important;top:7%!important;transform:translateX(-50%)!important;color:#c8a95d!important;opacity:.6!important; } /* ========================================================== v260 — menu settings button style ========================================================== */ .gg-global-menu-v235 button[data-open-settings-v260]{ display:block!important;width:100%!important;text-align:left!important;padding:10px 12px!important;color:#f3e9cf!important;background:transparent!important;border:0!important; } /* ========================================================== v261 — Sun theme cleanup No black/dark public content panels while Sun mode is active. ========================================================== */ html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .half.grim, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .half.goldie, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) section.contact, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .contact-grid, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .contact-box, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .shop-promo-shell, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .shop-promo-slide, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .hero-card, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .portfolio-card, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .work-card, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .feature-card{ background:linear-gradient(145deg,#e0c06a 0%,#ecd58f 48%,#f3e2ae 100%)!important; color:#17130d!important; border-color:rgba(115,82,17,.28)!important; box-shadow:0 10px 28px rgba(115,82,17,.10)!important; } html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .half.grim *, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .half.goldie *, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) section.contact *, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .contact-box *, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .shop-promo-shell *, html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) .shop-promo-slide *{ color:#17130d!important; } /* Inline dark button styles on older Home markup must also respect Sun mode. */ html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) a.btn[style*="background:#111"], html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) a.btn[style*="background: #111"]{ background:#c59b36!important; color:#17130d!important; border-color:#9d7926!important; } /* Older inline muted light text should become readable dark text in Sun mode. */ html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) [style*="color:#c7c1b6"], html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) [style*="color: #c7c1b6"]{ color:#3b2d15!important; } /* Catch remaining major public-page dark backgrounds without changing images/media. */ html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) main section:not(.hero):not(.portfolio-media):not(.gallery), html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) main .wrap{ border-color:rgba(117,84,19,.12)!important; } /* Contact / CTA wording stays black and readable over the warm-gold background. */ html[data-gg-site-theme="sun"] section.contact h1, html[data-gg-site-theme="sun"] section.contact h2, html[data-gg-site-theme="sun"] section.contact h3, html[data-gg-site-theme="sun"] section.contact p, html[data-gg-site-theme="sun"] section.contact a{ color:#17130d!important; } /* ========================================================== v262 — Sun mode: gold UI + black text/icons across public pages ========================================================== */ html[data-gg-site-theme="sun"] body{color:#17130d!important} html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) :is(.card,.panel,.box,.hero-card,.portfolio-card,.work-card,.feature-card,.contact-box,.shop-promo-shell,.shop-promo-slide,.half,.goldie-hero,.grim-hero,.portfolio-intro,.page-hero,.content-card,.info-card,.service-card,.gallery-card,.selected-work,.selected-work-card,.goldie-card,.grim-card,[class*="card"],[class*="panel"],[class*="box"]){ background:linear-gradient(145deg,#d8b45b 0%,#e6c976 52%,#f0d992 100%)!important; color:#17130d!important; border-color:rgba(111,78,13,.32)!important; box-shadow:0 8px 22px rgba(111,78,13,.12)!important; } html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) :is(.card,.panel,.box,.hero-card,.portfolio-card,.work-card,.feature-card,.contact-box,.shop-promo-shell,.shop-promo-slide,.half,.goldie-hero,.grim-hero,.portfolio-intro,.page-hero,.content-card,.info-card,.service-card,.gallery-card,.selected-work,.selected-work-card,.goldie-card,.grim-card,[class*="card"],[class*="panel"],[class*="box"]) *{ color:#17130d!important; } html[data-gg-site-theme="sun"] body:not(.room-page-v054):not(.avatar-page):not(.gg-salon-room-v206) :is(h1,h2,h3,h4,h5,h6,p,span,strong,b,small,label,a,.kicker,.quote){ color:#17130d!important; } /* Header icon boxes = gold; white icons become black. */ html[data-gg-site-theme="sun"] header .gg-shared-nav-icons-v250 > a, html[data-gg-site-theme="sun"] header .gg-shared-nav-icons-v250 > button, html[data-gg-site-theme="sun"] header .avatar-nav-icon, html[data-gg-site-theme="sun"] header .room-nav-icon, html[data-gg-site-theme="sun"] header .gg-storefront-link-v250, html[data-gg-site-theme="sun"] header .gg-global-menu-btn-v235{ background:#d8b45b!important;color:#111!important;border:1px solid rgba(99,69,12,.32)!important;border-radius:10px!important; } html[data-gg-site-theme="sun"] .gg-global-menu-btn-v235 i{background:#111!important} html[data-gg-site-theme="sun"] .gg-storefront-icon-v246, html[data-gg-site-theme="sun"] .gg-storefront-icon-v246::before, html[data-gg-site-theme="sun"] .gg-storefront-icon-v246::after{color:#111!important;border-color:#111!important} html[data-gg-site-theme="sun"] .gg-global-menu-v235{background:linear-gradient(145deg,#d8b45b,#eed68e)!important} html[data-gg-site-theme="sun"] .gg-global-menu-v235 a, html[data-gg-site-theme="sun"] .gg-global-menu-v235 button{color:#111!important} html[data-gg-site-theme="sun"] .gg-public-tools-v260 button{background:#d8b45b!important;color:#111!important;border-color:#8e681c!important} /* Goldie intro and similar large descriptive areas. */ html[data-gg-site-theme="sun"] .goldie-hero, html[data-gg-site-theme="sun"] .goldie-portfolio-hero, html[data-gg-site-theme="sun"] .portfolio-intro, html[data-gg-site-theme="sun"] .page-hero{ background:linear-gradient(145deg,#d8b45b,#efd992)!important; color:#17130d!important; } /* Legacy inline black backgrounds become gold. */ html[data-gg-site-theme="sun"] [style*="background:#111"], html[data-gg-site-theme="sun"] [style*="background: #111"], html[data-gg-site-theme="sun"] [style*="background:#000"], html[data-gg-site-theme="sun"] [style*="background: #000"]{ background:#d8b45b!important;color:#111!important;border-color:#8d671b!important; } /* Sun scroll focus becomes a light-red highlight. */ html[data-gg-site-theme="sun"] .gg-scroll-gold-v252{ color:#6f2523!important; text-shadow:0 0 4px rgba(255,126,120,.25),0 0 9px rgba(236,94,89,.16)!important; background:rgba(255,151,144,.18)!important; border-radius:5px!important; } html[data-gg-site-theme="sun"] .gg-scroll-gold-box-v252{ outline:2px solid rgba(224,100,94,.48)!important; box-shadow:0 0 16px rgba(224,100,94,.14)!important; } /* Horizontal-looking whimsical clouds. */ html[data-gg-site-theme="sun"] .gg-sun-whimsy-v252 i:nth-child(5n/**/+1){ white-space:nowrap!important; display:inline-block!important; letter-spacing:-.18em!important; transform:scaleX(1.55) scaleY(.68)!important; } /* ========================================================== v262 — Goldie's Salon spacing + scene window + client seating ========================================================== */ body.gg-salon-room-v206 #roomCategoryLoop{gap:4px!important} body.gg-salon-room-v206 #ggSalonUpgradeCategoryV242{order:40!important;margin:0!important} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="care"]{order:41!important;margin-left:-4px!important} body.gg-salon-room-v206 #roomCategoryLoop > :empty:not(#ggSalonUpgradeCategoryV242){ display:none!important;width:0!important;min-width:0!important;margin:0!important;padding:0!important; } body.gg-salon-room-v206 #roomSceneWindowV055{ top:26%!important; height:24%!important; } body.gg-salon-room-v206 #ggSalonClientV230{max-width:none!important;max-height:none!important;overflow:visible!important} body.gg-salon-room-v206 #ggSalonClientV230.gg-salon-seated-lock-v262{animation:none!important;transition:none!important} /* ========================================================== v263 — Sun scroll focus: red glow outline, no red fill ========================================================== */ html[data-gg-site-theme="sun"] .gg-scroll-gold-v252{ color:inherit!important; background:transparent!important; border-radius:5px!important; text-shadow: 0 0 3px rgba(255,92,86,.82), 0 0 7px rgba(235,48,44,.62), 0 0 13px rgba(220,30,28,.34)!important; outline:1px solid rgba(235,55,50,.62)!important; outline-offset:3px!important; box-shadow: 0 0 5px rgba(255,90,84,.40), 0 0 12px rgba(230,45,42,.28)!important; } html[data-gg-site-theme="sun"] .gg-scroll-gold-box-v252{ background:inherit!important; outline:2px solid rgba(235,55,50,.78)!important; outline-offset:2px!important; box-shadow: 0 0 5px rgba(255,100,94,.55), 0 0 12px rgba(235,50,46,.38), 0 0 22px rgba(215,35,32,.20)!important; } /* ========================================================== v264 — Sun scroll focus: purple glow, no text outline box ========================================================== */ html[data-gg-site-theme="sun"] .gg-scroll-gold-v252{ color:inherit!important; background:transparent!important; outline:none!important; box-shadow:none!important; border:none!important; text-shadow: 0 0 3px rgba(196,128,255,.92), 0 0 7px rgba(160,76,235,.72), 0 0 14px rgba(126,45,205,.42)!important; } /* If the focused text belongs to a card/box, only the surrounding box glows. */ html[data-gg-site-theme="sun"] .gg-scroll-gold-box-v252{ outline:2px solid rgba(169,83,235,.76)!important; outline-offset:3px!important; box-shadow: 0 0 6px rgba(205,132,255,.54), 0 0 14px rgba(164,74,231,.38), 0 0 24px rgba(121,40,190,.22)!important; } /* Daily + What's New now live with the Home hero action bubbles. */ .hero .actions > .gg-hero-daily-v264, .hero .actions > .gg-hero-whats-new-v264{ font:inherit!important; cursor:pointer!important; appearance:none!important; -webkit-appearance:none!important; } /* Retire the old fixed Daily / What's New placement. */ .gg-public-tools-v260{ display:none!important; } /* ========================================================== v265 — randomized Purple/Pink center-scroll glow ========================================================== */ html[data-gg-site-theme="sun"] .gg-scroll-gold-v252{ color:inherit!important; background:transparent!important; outline:none!important; border:none!important; box-shadow:none!important; text-shadow: 0 0 3px rgba(var(--gg-focus-core),.94), 0 0 7px rgba(var(--gg-focus-mid),.72), 0 0 14px rgba(var(--gg-focus-deep),.42)!important; } html[data-gg-site-theme="sun"] .gg-scroll-gold-box-v252{ outline:2px solid rgba(var(--gg-focus-mid),.78)!important; outline-offset:3px!important; box-shadow: 0 0 6px rgba(var(--gg-focus-core),.54), 0 0 14px rgba(var(--gg-focus-mid),.40), 0 0 24px rgba(var(--gg-focus-deep),.23)!important; } /* ========================================================== v265 — Sun theme on Avatar Studio + Avatar Room + Salon Gold UI boxes with WHITE icons/labels, as requested. ========================================================== */ html[data-gg-site-theme="sun"] body.avatar-page, html[data-gg-site-theme="sun"] body.avatar-room-page, html[data-gg-site-theme="sun"] body.gg-salon-room-v206{ --gg-avatar-sun-gold:#d7b24f; --gg-avatar-sun-gold-light:#e8ce7c; --gg-avatar-sun-border:#9c7422; } /* Main editor / room controls */ html[data-gg-site-theme="sun"] body.avatar-page :is(button,.category-chip,.option-chip,.tool-chip,.avatar-tool,.avatar-option,[class*="category-chip"],[class*="option-chip"]), html[data-gg-site-theme="sun"] body.avatar-room-page :is(.room-category-chip,.room-option-chip,.room-avatar-chip,.room-tool-chip,#roomCategoryLoop button,#roomOptionLoop button), html[data-gg-site-theme="sun"] body.gg-salon-room-v206 :is(.room-category-chip,.room-option-chip,#roomCategoryLoop button,#roomOptionLoop button){ background:linear-gradient(145deg,var(--gg-avatar-sun-gold),var(--gg-avatar-sun-gold-light))!important; color:#fff!important; border-color:var(--gg-avatar-sun-border)!important; box-shadow:0 3px 8px rgba(99,68,10,.16)!important; } /* Force text, glyphs and common SVG icon strokes/fills white INSIDE gold controls. */ html[data-gg-site-theme="sun"] body.avatar-page button :is(span,b,i,strong,small), html[data-gg-site-theme="sun"] body.avatar-room-page :is(.room-category-chip,.room-option-chip,#roomCategoryLoop button,#roomOptionLoop button) :is(span,b,i,strong,small), html[data-gg-site-theme="sun"] body.gg-salon-room-v206 :is(.room-category-chip,.room-option-chip,#roomCategoryLoop button,#roomOptionLoop button) :is(span,b,i,strong,small){ color:#fff!important; } html[data-gg-site-theme="sun"] body.avatar-page button svg, html[data-gg-site-theme="sun"] body.avatar-room-page :is(.room-category-chip,.room-option-chip,#roomCategoryLoop button,#roomOptionLoop button) svg{ color:#fff!important; fill:#fff!important; stroke:#fff!important; } /* Image-based icons inside editor controls become white silhouettes. */ html[data-gg-site-theme="sun"] body.avatar-page button img, html[data-gg-site-theme="sun"] body.avatar-room-page :is(.room-category-chip,.room-option-chip,#roomCategoryLoop button,#roomOptionLoop button) img{ filter:brightness(0) invert(1)!important; } /* Avatar-related page headers also use gold icon boxes with white icons. */ html[data-gg-site-theme="sun"] body:is(.avatar-page,.avatar-room-page,.gg-salon-room-v206) header .gg-shared-nav-icons-v250 > a, html[data-gg-site-theme="sun"] body:is(.avatar-page,.avatar-room-page,.gg-salon-room-v206) header .gg-shared-nav-icons-v250 > button{ background:linear-gradient(145deg,var(--gg-avatar-sun-gold,#d7b24f),var(--gg-avatar-sun-gold-light,#e8ce7c))!important; color:#fff!important; border-color:var(--gg-avatar-sun-border,#9c7422)!important; } html[data-gg-site-theme="sun"] body:is(.avatar-page,.avatar-room-page,.gg-salon-room-v206) header .gg-global-menu-btn-v235 i{ background:#fff!important; } html[data-gg-site-theme="sun"] body:is(.avatar-page,.avatar-room-page,.gg-salon-room-v206) header .gg-storefront-icon-v246, html[data-gg-site-theme="sun"] body:is(.avatar-page,.avatar-room-page,.gg-salon-room-v206) header .gg-storefront-icon-v246::before, html[data-gg-site-theme="sun"] body:is(.avatar-page,.avatar-room-page,.gg-salon-room-v206) header .gg-storefront-icon-v246::after{ color:#fff!important; border-color:#fff!important; } /* ========================================================== v265 — Mood / Level / Money HUD ALWAYS over plants, avatar, foreground objects, effects and room furniture. ========================================================== */ #avatarRoom #roomMoodGaugeV065, #avatarRoom #ggRoomLevelV143, #avatarRoom #ggSalonMoneyGaugeV230, #roomMoodGaugeV065, #ggRoomLevelV143, #ggSalonMoneyGaugeV230{ position:absolute!important; z-index:2147483644!important; isolation:isolate!important; pointer-events:auto!important; opacity:1!important; visibility:visible!important; } /* Pot/plants and ordinary room objects can never cross HUD layer. */ #roomPotLayerV055, #roomDecorLayerV059, #roomExtrasLayerV059, #roomFloorDecorV061, #roomWallDecorV061{ z-index:min(var(--gg-z-foreground,920),2147483000)!important; } /* Double-tap peek state is exactly half-transparent. */ #avatarRoom.gg-avatar-peek-v245 .room-avatar.room-avatar-exact{ opacity:.50!important; } /* ========================================================== v265 — Avatar shadow contacts the feet ========================================================== */ #ggRoomAvatarShadowV243, .gg-room-avatar-shadow-v243{ z-index:var(--gg-z-avatar-shadow,590)!important; transform:translate(-50%,-50%)!important; pointer-events:none!important; opacity:.82!important; } /* Gauges visually acknowledge peek mode without changing opacity. */ #roomMoodGaugeV065[aria-pressed="true"], #ggRoomLevelV143[aria-pressed="true"]{ outline:2px solid rgba(225,191,91,.92)!important; outline-offset:2px!important; } /* ========================================================== v266 — Avatar Studio Sun-mode readability Dark information panels become gold with high-contrast text. ========================================================== */ html[data-gg-site-theme="sun"] body.avatar-page :is( .random-lock-panel, .gg-character-panel, .gg-game-panel, .gg-share-panel, .gg-unlock-preview-panel, .gg-photo-booth, .avatar-launch-settings, .gg-room-controls-panel ){ background:linear-gradient(145deg,#d6af48 0%,#e5c66e 52%,#f0d992 100%)!important; color:#17130d!important; border-color:#98701d!important; box-shadow:0 8px 22px rgba(95,65,10,.14)!important; } html[data-gg-site-theme="sun"] body.avatar-page :is( .random-lock-panel, .gg-character-panel, .gg-game-panel, .gg-share-panel, .gg-unlock-preview-panel, .gg-photo-booth, .avatar-launch-settings, .gg-room-controls-panel ) :is(h1,h2,h3,h4,p,small,strong,b,label,span){ color:#17130d!important; } /* Nested controls stay visually distinct while remaining readable. */ html[data-gg-site-theme="sun"] body.avatar-page :is(.random-lock-panel,.gg-character-panel,.gg-game-panel,.gg-share-panel,.gg-unlock-preview-panel) :is(select,input){ background:#f5e4aa!important; color:#17130d!important; border-color:#98701d!important; } html[data-gg-site-theme="sun"] body.avatar-page .random-lock-row button, html[data-gg-site-theme="sun"] body.avatar-page .gg-character-controls button, html[data-gg-site-theme="sun"] body.avatar-page .gg-share-actions button, html[data-gg-site-theme="sun"] body.avatar-page .gg-mini-btn{ background:#b98d2d!important; color:#fff!important; border-color:#805d17!important; } /* Explicitly protect the four user-called-out sections. */ html[data-gg-site-theme="sun"] body.avatar-page #characterPanel, html[data-gg-site-theme="sun"] body.avatar-page #collectionPanel, html[data-gg-site-theme="sun"] body.avatar-page #shareAvatarPanel{ background:linear-gradient(145deg,#d6af48,#efd88e)!important; } /* ========================================================== v267 — clean shared header icon bounds ========================================================== */ header nav{ min-width:0!important; display:flex!important; align-items:center!important; gap:8px!important; } header .brand{ min-width:0!important; flex:1 1 auto!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; } header .navlinks{ min-width:0!important; display:flex!important; align-items:center!important; gap:7px!important; margin-left:auto!important; } header .gg-shared-nav-icons-v250{ flex:0 0 auto!important; gap:4px!important; } header .gg-shared-nav-icons-v250 > a, header .gg-shared-nav-icons-v250 > button{ width:34px!important; height:34px!important; min-width:34px!important; max-width:34px!important; flex:0 0 34px!important; padding:0!important; margin:0!important; box-sizing:border-box!important; overflow:hidden!important; line-height:1!important; font-size:17px!important; } header .gg-shared-nav-icons-v250 .avatar-nav-live{ max-width:26px!important; max-height:26px!important; transform:scale(.82)!important; transform-origin:center!important; } @media(max-width:560px){ header .navlinks>a:not(.avatar-nav-icon):not(.room-nav-icon):not(.gg-storefront-link-v250){ display:none!important; } header .gg-shared-nav-icons-v250{gap:3px!important} } /* ========================================================== v267 — Salon stable object slots ========================================================== */ body.gg-salon-room-v206 #roomPotLayerV055{ left:18%!important;top:auto!important;bottom:3%!important;transform:translateX(-50%)!important; } body.gg-salon-room-v206 #roomFloorDecorV061{ left:77%!important;top:auto!important;bottom:4%!important;transform:translateX(-50%)!important; } body.gg-salon-room-v206 #roomWallDecorV061{ left:74%!important;top:42%!important;bottom:auto!important;transform:translate(-50%,-50%)!important; } body.gg-salon-room-v206 #roomDecorLayerV059{ left:70%!important;top:auto!important;bottom:4%!important; } body.gg-salon-room-v206 #roomExtrasLayerV059{ left:82%!important;top:auto!important;bottom:5%!important; } /* Upgrade must always exist in the category strip. */ body.gg-salon-room-v206 #ggSalonUpgradeCategoryV242{ display:inline-flex!important; visibility:visible!important; opacity:1!important; width:auto!important; min-width:58px!important; margin:0!important; } /* ========================================================== v267 — Sun mode: stronger whimsical background density ========================================================== */ html[data-gg-site-theme="sun"] .gg-sun-whimsy-v252{ opacity:1!important; } html[data-gg-site-theme="sun"] .gg-sun-whimsy-v252 i{ opacity:.82!important; text-shadow: 0 0 6px rgba(255,231,155,.62), 0 0 12px rgba(219,174,69,.26)!important; } html[data-gg-site-theme="sun"] .gg-sun-whimsy-v252 i:nth-child(4n/**/+1){font-size:22px!important} html[data-gg-site-theme="sun"] .gg-sun-whimsy-v252 i:nth-child(6n/**/+2){opacity:.95!important} /* ========================================================== v267 — ALL transient UI becomes gold in Sun mode. Includes notifications, achievements, tutorials, games, gremlin dialogue/meters and salon upgrade popups. ========================================================== */ html[data-gg-site-theme="sun"] :is( .gg-toast-v106,.gg-kind-toast,.gg-achievement-v260,.gg-level-dialog-v241, .gg-avatar-dialog-v243,.gg-whats-new-v260,.gg-settings-v260, .gg-salon-upgrade-panel-v250,.gg-gremlin-catch-meter-v252, .room-cat-text-v083,.gg-mini-game-card-v097,.gg-game-prompt-card-v097, .gg-light-game-card-v107,.gg-fern-card-v231,.gg-room-tools-tutorial-v267, .gg-room-tutorial-card-v109,.gg-salon-client-menu-v230 ){ background:linear-gradient(145deg,#d5ae47,#efd78b)!important; color:#17130d!important; border-color:#8f681a!important; box-shadow:0 12px 32px rgba(103,72,15,.24)!important; } html[data-gg-site-theme="sun"] :is( .gg-toast-v106,.gg-kind-toast,.gg-achievement-v260,.gg-level-dialog-v241, .gg-avatar-dialog-v243,.gg-whats-new-v260,.gg-settings-v260, .gg-salon-upgrade-panel-v250,.gg-gremlin-catch-meter-v252, .room-cat-text-v083,.gg-mini-game-card-v097,.gg-game-prompt-card-v097, .gg-light-game-card-v107,.gg-fern-card-v231,.gg-room-tools-tutorial-v267, .gg-room-tutorial-card-v109,.gg-salon-client-menu-v230 ) *{ color:#17130d!important; } html[data-gg-site-theme="sun"] .gg-gremlin-catch-meter-v252>div{ background:#a67d27!important; border-color:#5f4512!important; } html[data-gg-site-theme="sun"] .gg-gremlin-catch-meter-v252 i{ background:linear-gradient(90deg,#8c671d,#f4e0a5)!important; } /* ========================================================== v267 — Avatar Home title + Friends box gold in Sun mode ========================================================== */ html[data-gg-site-theme="sun"] body.avatar-room-page:not(.gg-salon-room-v206) :is(.room-reference-head-v054,#roomFriendsV131,.room-friends-head,.gg-friends-body-v131){ background:linear-gradient(145deg,#d6af48,#efd88e)!important; color:#17130d!important; border-color:#96701e!important; } html[data-gg-site-theme="sun"] body.avatar-room-page:not(.gg-salon-room-v206) :is(.room-reference-head-v054,#roomFriendsV131,.room-friends-head,.gg-friends-body-v131) *{ color:#17130d!important; } /* ========================================================== v267 — Level 3 room toolbar gate Gauges remain available regardless of level. ========================================================== */ body.avatar-room-page:not(.gg-salon-room-v206) #avatarRoom.gg-room-tools-locked-v267 #ggRoomCornerToolsV143, body.avatar-room-page:not(.gg-salon-room-v206) #avatarRoom.gg-room-tools-locked-v267 ~ #ggRoomHelpV109, body.avatar-room-page:not(.gg-salon-room-v206) #avatarRoom.gg-room-tools-locked-v267 #ggRoomHelpV109{ opacity:0!important; visibility:hidden!important; pointer-events:none!important; transform:translateY(-6px) scale(.92)!important; } body.avatar-room-page:not(.gg-salon-room-v206) #avatarRoom.gg-room-tools-unlocked-v267 #ggRoomCornerToolsV143{ opacity:1!important; visibility:visible!important; pointer-events:auto!important; } /* Existing global help button lives outside #avatarRoom. Gate via body class set below. */ body.gg-room-tools-body-locked-v267 #ggRoomHelpV109{ opacity:0!important;visibility:hidden!important;pointer-events:none!important; } /* Level 3 tutorial */ .gg-room-tools-tutorial-v267{ position:fixed!important; left:50%!important; top:92px!important; transform:translateX(-50%)!important; width:min(92vw,390px)!important; z-index:2147483646!important; padding:16px!important; border-radius:18px!important; background:#111116!important; color:#f1ead8!important; border:1px solid rgba(215,176,91,.44)!important; box-shadow:0 18px 48px rgba(0,0,0,.42)!important; text-align:center!important; } .gg-room-tools-tutorial-v267 .close{ position:absolute!important;right:9px!important;top:8px!important; width:30px!important;height:30px!important;border-radius:50%!important; } .gg-room-tools-tutorial-v267 .icon{font-size:30px!important;margin:3px 0 6px!important} .gg-room-tools-tutorial-v267 small{font-size:8px!important;letter-spacing:.12em!important} .gg-room-tools-tutorial-v267 h3{margin:6px 0!important} .gg-room-tools-tutorial-v267 p{margin:0 auto 12px!important;line-height:1.4!important} .gg-room-tools-tutorial-v267 .actions{display:flex!important;justify-content:center!important;gap:8px!important} .gg-room-tools-tutorial-v267 .actions button{min-width:82px!important;padding:8px 12px!important;border-radius:999px!important} .gg-room-tool-highlight-v267{ position:relative!important; z-index:2147483645!important; outline:3px solid #e7bd53!important; outline-offset:3px!important; box-shadow:0 0 16px rgba(231,189,83,.7)!important; } html[data-gg-site-theme="sun"] .gg-room-tools-tutorial-v267{ background:linear-gradient(145deg,#d6af48,#efd88e)!important; color:#17130d!important; border-color:#8f681a!important; } html[data-gg-site-theme="sun"] .gg-room-tools-tutorial-v267 *{color:#17130d!important} /* ========================================================== v268 — Before Level 5, keep only Dice / Undo / Sound visible. ========================================================== */ /* Do not hide the whole corner toolbar anymore. */ body.avatar-room-page:not(.gg-salon-room-v206) #avatarRoom.gg-room-tools-locked-v267 #ggRoomCornerToolsV143{ opacity:1!important; visibility:visible!important; pointer-events:auto!important; transform:none!important; } /* Individual Level-5-only controls are hidden cleanly. */ body.avatar-room-page:not(.gg-salon-room-v206) .gg-room-tool-level5-hidden-v268{ display:none!important; visibility:hidden!important; opacity:0!important; pointer-events:none!important; } /* Dice, Undo, Sound always stay available. */ body.avatar-room-page:not(.gg-salon-room-v206) :is(#roomRandomizeBtnV055,#ggUndoRoomV144,#roomSoundToggleV060){ display:inline-flex!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; } /* Help stays hidden externally until Level 5. */ body.avatar-room-page:not(.gg-salon-room-v206):not(.gg-room-level5-tools-unlocked-v268) #ggRoomHelpV109{ display:none!important; } /* Level 5 tutorial wording is authoritative. */ .gg-room-tools-tutorial-v267 small::first-letter{ text-transform:none!important; } /* ========================================================== v269 — tutorial refresh for current layouts ========================================================== */ .gg-room-tutorial-card-v109{ width:min(92vw,430px)!important; max-height:min(78vh,640px)!important; overflow:auto!important; } .gg-room-tutorial-copy-v109, #ggRoomTutorialCopyV109{ line-height:1.45!important; } .gg-room-tutorial-actions-v109{ position:sticky!important; bottom:-1px!important; padding-top:9px!important; } body.gg-salon-room-v206 .gg-room-help-v109{ display:flex!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; } /* Keep tutorial above room editor and top of game UI, without covering full screen. */ .gg-room-tutorial-v109{ z-index:2147483645!important; } /* Level 5 tutorial follows the current compact top-left toolbar. */ .gg-room-tools-tutorial-v267{ top:82px!important; width:min(92vw,400px)!important; } /* Sun theme tutorial remains gold; Moon remains the existing dark style. */ html[data-gg-site-theme="sun"] .gg-room-tutorial-card-v109, html[data-gg-site-theme="sun"] .gg-room-tools-tutorial-v267{ background:linear-gradient(145deg,#d6af48 0%,#efd88e 100%)!important; color:#17130d!important; border-color:#8f681a!important; } html[data-gg-site-theme="sun"] .gg-room-tutorial-card-v109 *, html[data-gg-site-theme="sun"] .gg-room-tools-tutorial-v267 *{ color:#17130d!important; } /* ========================================================== v270 — Avatar Home lock is ALWAYS visible before Level 5 ========================================================== */ body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLockAllV144{ display:inline-flex!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; } /* ========================================================== v270 — Living HUD appears only at Level 5 in Home + Salon ========================================================== */ #ggLivingHudV156.gg-living-level5-locked-v270{ display:none!important; visibility:hidden!important; opacity:0!important; pointer-events:none!important; } #ggLivingHudV156.gg-living-level5-unlocked-v270{ display:flex!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; } /* Level 5 living-system tutorial */ .gg-living-tutorial-v270{ position:fixed!important; left:50%!important; top:90px!important; transform:translateX(-50%)!important; width:min(92vw,400px)!important; z-index:2147483646!important; padding:16px!important; border-radius:18px!important; background:#111116!important; color:#f1ead8!important; border:1px solid rgba(215,176,91,.44)!important; box-shadow:0 18px 48px rgba(0,0,0,.42)!important; text-align:center!important; } .gg-living-tutorial-v270 .close{ position:absolute!important;right:9px!important;top:8px!important; width:30px!important;height:30px!important;border-radius:50%!important; } .gg-living-tutorial-v270 .icon{font-size:31px!important;margin:3px 0 6px!important} .gg-living-tutorial-v270 small{font-size:8px!important;letter-spacing:.1em!important} .gg-living-tutorial-v270 h3{margin:6px 0!important} .gg-living-tutorial-v270 p{line-height:1.42!important} .gg-living-tutorial-v270 .actions{display:flex!important;justify-content:center!important;gap:8px!important} .gg-living-tutorial-v270 .actions button{min-width:82px!important;padding:8px 12px!important;border-radius:999px!important} .gg-living-highlight-v270{ position:relative!important; z-index:2147483645!important; outline:3px solid #d6aa43!important; outline-offset:3px!important; box-shadow:0 0 15px rgba(214,170,67,.7)!important; } html[data-gg-site-theme="sun"] .gg-living-tutorial-v270{ background:linear-gradient(145deg,#d6af48,#efd88e)!important; color:#17130d!important; border-color:#8f681a!important; } html[data-gg-site-theme="sun"] .gg-living-tutorial-v270 *{color:#17130d!important} /* ========================================================== v270 — Salon recovery No pointer-event capture layer. Stable defaults only. ========================================================== */ body.gg-salon-room-v206 #avatarRoom{ touch-action:pan-y!important; } body.gg-salon-room-v206 #roomCategoryLoop, body.gg-salon-room-v206 #roomOptionLoop{ touch-action:pan-x pan-y!important; pointer-events:auto!important; } body.gg-salon-room-v206 #ggSalonUpgradeCategoryV242, body.gg-salon-room-v206 #ggSalonUpgradeBtnV230{ pointer-events:auto!important; display:inline-flex!important; visibility:visible!important; opacity:1!important; } /* ========================================================== v280 — Salon reputation / day gameplay ========================================================== */ .gg-salon-rep-v280{ position:absolute!important; right:10px!important; top:10px!important; z-index:1003!important; display:grid!important; grid-template-columns:auto auto!important; gap:1px 8px!important; padding:7px 10px!important; border-radius:12px!important; background:rgba(12,12,16,.82)!important; border:1px solid rgba(215,176,91,.38)!important; pointer-events:none!important; } .gg-salon-rep-v280 span{font-size:8px!important} .gg-salon-rep-v280 b{font-size:13px!important} .gg-salon-rep-v280 small{grid-column:1/-1!important;font-size:7px!important;opacity:.78!important} .gg-salon-day-hud-v280{ position:absolute!important; left:50%!important; top:10px!important; transform:translateX(-50%)!important; z-index:1003!important; display:flex!important; align-items:center!important; gap:7px!important; padding:6px 8px!important; border-radius:12px!important; background:rgba(12,12,16,.82)!important; border:1px solid rgba(215,176,91,.34)!important; } .gg-salon-day-hud-v280 b{font-size:9px!important} .gg-salon-day-hud-v280 span{font-size:8px!important;opacity:.8!important} .gg-salon-day-hud-v280 button{font-size:8px!important;padding:5px 7px!important;border-radius:999px!important} .gg-salon-day-summary-v280{ position:fixed!important; left:50%!important;top:50%!important; transform:translate(-50%,-50%)!important; width:min(90vw,390px)!important; z-index:2147483646!important; padding:18px!important; border-radius:18px!important; background:#111116!important; color:#f1ead8!important; border:1px solid rgba(215,176,91,.44)!important; box-shadow:0 22px 60px rgba(0,0,0,.48)!important; text-align:center!important; } .gg-salon-day-summary-v280 .close{position:absolute!important;right:9px!important;top:8px!important;width:30px!important;height:30px!important;border-radius:50%!important} .gg-salon-day-summary-v280 .stats{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:7px!important;margin:12px 0!important} .gg-salon-day-summary-v280 .stats span{padding:9px 5px!important;border-radius:10px!important;background:rgba(255,255,255,.05)!important;font-size:8px!important} .gg-salon-day-summary-v280 .stats b{display:block!important;font-size:15px!important} .gg-salon-day-summary-v280 .next{padding:8px 13px!important;border-radius:999px!important} .gg-client-request-card-v280{ display:grid!important; gap:3px!important; margin-bottom:8px!important; padding:8px 10px!important; border-radius:10px!important; background:rgba(215,176,91,.12)!important; border:1px solid rgba(215,176,91,.32)!important; } .gg-client-request-card-v280 small{font-size:7px!important;letter-spacing:.1em!important} .gg-client-request-card-v280 b{font-size:11px!important} .gg-client-request-card-v280 span{font-size:9px!important;opacity:.86!important} /* rare client visual identity */ .gg-vip-client-v280::before{ content:"★"!important; position:absolute!important; left:50%!important;top:-18px!important; transform:translateX(-50%)!important; font-size:14px!important; color:#e3bb53!important; text-shadow:0 0 8px rgba(227,187,83,.7)!important; } .gg-vip-client-v280.vip-gremlin{filter:drop-shadow(0 0 9px rgba(82,235,102,.45))!important} /* ========================================================== v280 — Second floor architecture ========================================================== */ .gg-salon-floor2-v280{ position:absolute!important; left:4%!important;right:4%!important; top:-39%!important;height:35%!important; z-index:210!important; display:none!important; border:2px dashed rgba(215,176,91,.28)!important; border-radius:12px 12px 0 0!important; background:rgba(22,20,24,.72)!important; pointer-events:none!important; } .gg-salon-floor2-v280.unlocked{display:block!important} .gg-salon-floor2-v280>span{position:absolute!important;left:10px!important;top:7px!important;font-size:7px!important;letter-spacing:.14em!important} .gg-floor2-placeholder-v280{position:absolute!important;inset:30px 8px 8px!important;display:grid!important;place-items:center!important;font-size:9px!important;opacity:.45!important} /* ========================================================== v280 — Salon horizontal window drag ========================================================== */ body.gg-salon-room-v206 #roomSceneWindowV055{ cursor:grab!important; touch-action:none!important; user-select:none!important; left:var(--salon-window-x,50%)!important; transform:translateX(-50%)!important; } body.gg-salon-room-v206 #roomSceneWindowV055:active{cursor:grabbing!important} /* ========================================================== v280 — canonical layer safety ========================================================== */ body.gg-salon-room-v206 #ggSalonClientV230{z-index:520!important} #avatarRoom .room-avatar.room-avatar-exact{z-index:650!important} #avatarRoom #roomMoodGaugeV065, #avatarRoom #ggRoomLevelV143, #avatarRoom #ggSalonMoneyGaugeV230{z-index:1000!important} /* ========================================================== v280 — dynamic low-performance mode ========================================================== */ .gg-low-performance-v280 .gg-sun-whimsy-v252 i:nth-child(n/**/+14), .gg-low-performance-v280 .gg-ghost-slime-v242:nth-child(n/**/+4), .gg-low-performance-v280 .gg-level-celebrate-v241 i:nth-child(n/**/+12), .gg-low-performance-v280 .gg-fern-orb-v243:nth-child(n/**/+2){ display:none!important; } .gg-low-performance-v280 *{ box-shadow:none; } /* ========================================================== v280 — Sun treatment for new Salon gameplay UI ========================================================== */ html[data-gg-site-theme="sun"] :is(.gg-salon-day-hud-v280,.gg-salon-rep-v280,.gg-salon-day-summary-v280,.gg-client-request-card-v280){ background:linear-gradient(145deg,#d6af48,#efd88e)!important; color:#17130d!important; border-color:#8f681a!important; } html[data-gg-site-theme="sun"] :is(.gg-salon-day-hud-v280,.gg-salon-rep-v280,.gg-salon-day-summary-v280,.gg-client-request-card-v280) *{ color:#17130d!important; } /* ========================================================== v281 — Avatar Room HUD hard layering Plants/pots stay below Mood and Level gauges. ========================================================== */ #avatarRoom{ isolation:isolate!important; } #avatarRoom #roomPotLayerV055{ position:absolute!important; z-index:420!important; isolation:isolate!important; } #avatarRoom #roomPotLayerV055 *, #avatarRoom #roomPlantV055{ z-index:auto!important; } #avatarRoom #roomMoodGaugeV065, #avatarRoom #ggRoomLevelV143, #avatarRoom #ggSalonMoneyGaugeV230{ position:absolute!important; z-index:2147483646!important; isolation:isolate!important; pointer-events:auto!important; } /* ========================================================== v281 — Salon is always open ========================================================== */ #ggSalonDayHudV280, #ggSalonDaySummaryV280, [data-open-salon-day-v280], [data-close-salon-day-v280]{ display:none!important; } /* Stable Salon geometry. */ body.gg-salon-room-v206 #roomPotLayerV055{ left:17%!important;bottom:3%!important;top:auto!important;transform:translateX(-50%)!important; } body.gg-salon-room-v206 #roomFloorDecorV061{ left:76%!important;bottom:4%!important;top:auto!important;transform:translateX(-50%)!important; } body.gg-salon-room-v206 #roomWallDecorV061{ left:74%!important;top:42%!important;bottom:auto!important;transform:translate(-50%,-50%)!important; } body.gg-salon-room-v206 #roomDecorLayerV059{ left:69%!important;bottom:4%!important;top:auto!important; } body.gg-salon-room-v206 #roomExtrasLayerV059{ left:82%!important;bottom:5%!important;top:auto!important; } /* ========================================================== v281 — Avatar Studio visual upgrade ========================================================== */ body.avatar-page{ --gg-studio-gold:#d8b45b; --gg-studio-gold-soft:#e9d087; --gg-studio-edge:rgba(215,176,91,.30); } body.avatar-page :is(.avatar-stage,.avatar-preview,[class*="avatar-stage"],[class*="preview-stage"]){ position:relative!important; border-radius:24px!important; border:1px solid var(--gg-studio-edge)!important; background: radial-gradient(circle at 50% 32%,rgba(215,176,91,.12),transparent 34%), linear-gradient(180deg,rgba(29,28,35,.98),rgba(12,12,17,.99))!important; box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 18px 46px rgba(0,0,0,.28)!important; overflow:hidden!important; } body.avatar-page :is(.gg-character-panel,.gg-game-panel,.gg-share-panel,.random-lock-panel,.gg-unlock-preview-panel,.avatar-launch-settings,.gg-photo-booth){ border-radius:18px!important; border:1px solid var(--gg-studio-edge)!important; background:linear-gradient(160deg,rgba(28,27,34,.96),rgba(14,14,19,.98))!important; box-shadow:0 12px 30px rgba(0,0,0,.22)!important; backdrop-filter:blur(10px)!important; } body.avatar-page :is(button,.option-chip,.category-chip,[class*="option-chip"],[class*="category-chip"]){ border-radius:14px!important; transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease!important; } body.avatar-page :is(button,.option-chip,.category-chip,[class*="option-chip"],[class*="category-chip"]):active{ transform:scale(.96)!important; } body.avatar-page :is(.selected,.active,[aria-pressed="true"]){ border-color:rgba(232,200,110,.86)!important; box-shadow: 0 0 0 2px rgba(215,176,91,.16), 0 0 17px rgba(215,176,91,.20)!important; } body.avatar-page :is(.category-loop,.option-loop,[class*="category-loop"],[class*="option-loop"]){ scrollbar-width:none!important; -webkit-overflow-scrolling:touch!important; scroll-snap-type:x proximity!important; } body.avatar-page .category-loop::-webkit-scrollbar, body.avatar-page .option-loop::-webkit-scrollbar{display:none!important} body.avatar-page :is(.category-chip,.option-chip,[class*="category-chip"],[class*="option-chip"]){ scroll-snap-align:center!important; } /* Studio avatar floor shadow system removed in v583. */ /* Sun mode version of upgraded Studio. */ html[data-gg-site-theme="sun"] body.avatar-page :is(.gg-character-panel,.gg-game-panel,.gg-share-panel,.random-lock-panel,.gg-unlock-preview-panel,.avatar-launch-settings,.gg-photo-booth){ background:linear-gradient(145deg,#d6af48,#efd88e)!important; color:#17130d!important; border-color:#98701d!important; box-shadow:0 12px 26px rgba(112,77,12,.12)!important; } html[data-gg-site-theme="sun"] body.avatar-page :is(.avatar-stage,.avatar-preview,[class*="avatar-stage"],[class*="preview-stage"]){ background: radial-gradient(circle at 50% 31%,rgba(255,255,255,.24),transparent 35%), linear-gradient(180deg,#edd994,#d7b65c)!important; border-color:#98701d!important; } /* ========================================================== v282 — Salon window horizontal drag ========================================================== */ body.gg-salon-room-v206 #roomSceneWindowV055{ pointer-events:auto!important; touch-action:none!important; user-select:none!important; -webkit-user-select:none!important; cursor:grab!important; left:var(--salon-window-x,50%)!important; transform:translateX(-50%)!important; } body.gg-salon-room-v206 #roomSceneWindowV055.gg-salon-window-dragging-v282{ cursor:grabbing!important; z-index:340!important; } /* Salon intentionally has no pots/plants. */ body.gg-salon-room-v206 #roomPotLayerV055, body.gg-salon-room-v206 [data-room-category="pot"], body.gg-salon-room-v206 [data-room-category="plant"], body.gg-salon-room-v206 [data-room-category="plants"]{ display:none!important; } /* Smart headwear is always intended above hair/horns. */ #headAccessory, #flowerAbsoluteFrontV174, #extraAccessory:has(.gg-patrol-cap-v244), #extraAccessory2:has(.gg-patrol-cap-v244){ pointer-events:none!important; } /* ========================================================== v283 — No random screen flashing in Avatar Home / Salon ========================================================== */ body.avatar-room-page #avatarRoom[data-rare-event="flicker"]{ animation:none!important; filter:none!important; } body.avatar-room-page .room-window-lightning-v076, body.avatar-room-page .room-window-lightning-v076.strike, body.avatar-room-page .room-window-lightning-v076.strike i{ animation:none!important; display:none!important; } /* ========================================================== v283 — hard HUD/plant binding ========================================================== */ body.avatar-room-page #avatarRoom #roomPotLayerV055{ z-index:420!important; } body.avatar-room-page #avatarRoom :is(#roomMoodGaugeV065,#ggRoomLevelV143,#ggSalonMoneyGaugeV230){ z-index:2147483646!important; } /* User avatar shadow sits just beneath the feet. */ #ggRoomAvatarShadowV243, .gg-room-avatar-shadow-v243{ transform:translate(-50%,-32%)!important; } /* ========================================================== v283 — Grim current-page button = silver ========================================================== */ body.grim-page-v283 .floating-portfolios .float-choice.grim{ background:linear-gradient(145deg,#f1f1f3,#aeb1b7)!important; color:#15161a!important; border-color:#f5f5f6!important; box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 5px 14px rgba(0,0,0,.24)!important; } /* ========================================================== v283 — Goldie's Salon title + navigation menu ========================================================== */ body.gg-salon-room-v206 #roomReferenceHeadV054{ background:linear-gradient(145deg,#eeeeef,#aeb2b8)!important; color:#16171a!important; border-color:#f5f5f6!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 6px 16px rgba(0,0,0,.14)!important; } body.gg-salon-room-v206 #roomReferenceHeadV054 *{ color:#16171a!important; } /* Gold background for the Salon navigation choices when its menu is open. */ body.gg-salon-room-v206 :is(#ggGlobalMenuV250,#ggGlobalMenuV235,.gg-global-menu-v235){ background:linear-gradient(145deg,#d6af48,#efd88e)!important; color:#17130d!important; border-color:#8f681a!important; } body.gg-salon-room-v206 :is(#ggGlobalMenuV250,#ggGlobalMenuV235,.gg-global-menu-v235) :is(a,button){ background:#e5c76f!important; color:#17130d!important; border-color:#9a7322!important; } body.gg-salon-room-v206 :is(#ggGlobalMenuV250,#ggGlobalMenuV235,.gg-global-menu-v235) :is(a,button):active{ background:#f2dda0!important; } /* v284 — hair visibility safeguard */ body.avatar-page #avatarSvg :is(#hairLayer,#backHairLayer,#hairBack){ filter:none!important; display:inline!important; visibility:visible!important; opacity:1!important; } body.avatar-page #avatarSvg :is(#hairLayer,#backHairLayer,#hairBack) path{ paint-order:stroke fill!important; stroke-linecap:round!important; stroke-linejoin:round!important; } /* ========================================================== v284 — Sun theme silver readability polish Avatar Studio tutorial, share card, progression panels, friend add box, salon request/menu, and level/money gauges become silver as requested. ========================================================== */ html[data-gg-site-theme="sun"] body.avatar-page .gg-tutorial-card, html[data-gg-site-theme="sun"] body.avatar-page .random-lock-panel, html[data-gg-site-theme="sun"] body.avatar-page #ggShareCard, html[data-gg-site-theme="sun"] body.avatar-page .gg-game-panel, html[data-gg-site-theme="sun"] body.avatar-page .gg-character-panel, html[data-gg-site-theme="sun"] body.avatar-page .gg-share-panel, html[data-gg-site-theme="sun"] body.avatar-page .gg-unlock-preview-panel, html[data-gg-site-theme="sun"] body.avatar-page .gg-photo-booth, html[data-gg-site-theme="sun"] body.avatar-page .gg-photo-controls, html[data-gg-site-theme="sun"] body.avatar-page .gg-photo-preview{ background:linear-gradient(145deg,#eff1f4,#b8bec8)!important; color:#15171b!important; border-color:#8d96a3!important; box-shadow:0 14px 32px rgba(73,84,99,.18)!important; } html[data-gg-site-theme="sun"] body.avatar-page .gg-tutorial-card *, html[data-gg-site-theme="sun"] body.avatar-page .random-lock-panel *, html[data-gg-site-theme="sun"] body.avatar-page #ggShareCard *, html[data-gg-site-theme="sun"] body.avatar-page .gg-game-panel *, html[data-gg-site-theme="sun"] body.avatar-page .gg-character-panel *, html[data-gg-site-theme="sun"] body.avatar-page .gg-share-panel *, html[data-gg-site-theme="sun"] body.avatar-page .gg-unlock-preview-panel *, html[data-gg-site-theme="sun"] body.avatar-page .gg-photo-booth *, html[data-gg-site-theme="sun"] body.avatar-page .gg-photo-controls *, html[data-gg-site-theme="sun"] body.avatar-page .gg-photo-preview *{ color:#15171b!important; } html[data-gg-site-theme="sun"] body.avatar-page .gg-tutorial-card .tutorial-actions button, html[data-gg-site-theme="sun"] body.avatar-page .random-lock-row button, html[data-gg-site-theme="sun"] body.avatar-page .avatar-launch-settings button, html[data-gg-site-theme="sun"] body.avatar-page .gg-share-actions button, html[data-gg-site-theme="sun"] body.avatar-page .gg-mini-btn, html[data-gg-site-theme="sun"] body.avatar-page #photoCapture{ background:linear-gradient(145deg,#d7b24f,#e8ce7c)!important; color:#fff!important; border-color:#9c7422!important; } html[data-gg-site-theme="sun"] body.avatar-page .gg-share-qr{ background:rgba(255,255,255,.42)!important; border-radius:12px!important; padding:6px!important; } /* Sun mode: silver Home/Friends inner boxes and gauges */ html[data-gg-site-theme="sun"] body.avatar-room-page #roomFriendsV131, html[data-gg-site-theme="sun"] body.avatar-room-page #ggFriendsBodyV131, html[data-gg-site-theme="sun"] body.avatar-room-page .friend-avatar-strip, html[data-gg-site-theme="sun"] body.avatar-room-page .friend-add-card, html[data-gg-site-theme="sun"] body.avatar-room-page .friend-card, html[data-gg-site-theme="sun"] body.avatar-room-page #ggRoomLevelV143, html[data-gg-site-theme="sun"] body.avatar-room-page #ggSalonMoneyGaugeV230, html[data-gg-site-theme="sun"] body.gg-salon-room-v206 #ggRoomLevelV143, html[data-gg-site-theme="sun"] body.gg-salon-room-v206 #ggSalonMoneyGaugeV230{ background:linear-gradient(145deg,#eff1f4,#b8bec8)!important; color:#15171b!important; border-color:#8d96a3!important; box-shadow:0 8px 20px rgba(69,78,93,.16)!important; } html[data-gg-site-theme="sun"] body.avatar-room-page #roomFriendsV131 *, html[data-gg-site-theme="sun"] body.avatar-room-page #ggFriendsBodyV131 *, html[data-gg-site-theme="sun"] body.avatar-room-page .friend-avatar-strip *, html[data-gg-site-theme="sun"] body.avatar-room-page .friend-add-card *, html[data-gg-site-theme="sun"] body.avatar-room-page .friend-card *, html[data-gg-site-theme="sun"] body.avatar-room-page #ggRoomLevelV143 *, html[data-gg-site-theme="sun"] body.avatar-room-page #ggSalonMoneyGaugeV230 *, html[data-gg-site-theme="sun"] body.gg-salon-room-v206 #ggRoomLevelV143 *, html[data-gg-site-theme="sun"] body.gg-salon-room-v206 #ggSalonMoneyGaugeV230 *{ color:#15171b!important; } /* Goldie's Salon client request/menu fixed on screen and silver in Sun mode */ body.gg-salon-room-v206 #ggSalonClientMenuV230{ left:50%!important; top:14px!important; bottom:auto!important; width:min(calc(100% - 24px),360px)!important; max-width:calc(100% - 24px)!important; transform:translateX(-50%)!important; flex-wrap:wrap!important; justify-content:center!important; overflow:visible!important; } body.gg-salon-room-v206 .gg-client-request-card-v280{ width:100%!important; text-align:center!important; white-space:normal!important; word-break:break-word!important; } html[data-gg-site-theme="sun"] body.gg-salon-room-v206 #ggSalonClientMenuV230, html[data-gg-site-theme="sun"] body.gg-salon-room-v206 .gg-client-request-card-v280{ background:linear-gradient(145deg,#eff1f4,#b8bec8)!important; color:#15171b!important; border-color:#8d96a3!important; box-shadow:0 12px 28px rgba(69,78,93,.18)!important; } html[data-gg-site-theme="sun"] body.gg-salon-room-v206 #ggSalonClientMenuV230 *, html[data-gg-site-theme="sun"] body.gg-salon-room-v206 .gg-client-request-card-v280 *{ color:#15171b!important; } /* Layer order in Salon: chair behind client, client behind user */ body.gg-salon-room-v206 .gg-salon-chair-side-v230{z-index:430!important} body.gg-salon-room-v206 #ggSalonClientV230, body.gg-salon-room-v206 #ggSalonClientV230.gg-salon-client-behind-v244, body.gg-salon-room-v206 #ggSalonClientV230.gg-salon-client-front-v243, body.gg-salon-room-v206 #ggSalonClientV230.seated{z-index:520!important} body.gg-salon-room-v206 #avatarRoom .room-avatar.room-avatar-exact{z-index:650!important} /* ========================================================== v285 — Salon freeze-proof rendering ========================================================== */ body.gg-salon-room-v206 #ggSalonClientV230{ contain:layout paint!important; will-change:left,bottom!important; backface-visibility:hidden!important; transform:translateX(-50%) translateZ(0)!important; } body.gg-salon-room-v206 #ggSalonClientV230 svg{ contain:paint!important; pointer-events:none!important; } body.gg-salon-room-v206 #ggSalonClientV230.walking-to-chair, body.gg-salon-room-v206 #ggSalonClientV230.leaving{ animation:none!important; } body.gg-salon-room-v206 #ggSalonClientV230.seated{ animation:none!important; transition:none!important; } /* Canonical Salon order: chair -> client -> user */ body.gg-salon-room-v206 .gg-salon-chair-side-v230{z-index:430!important} body.gg-salon-room-v206 #ggSalonClientV230{z-index:520!important} body.gg-salon-room-v206 #avatarRoom .room-avatar.room-avatar-exact{z-index:650!important} /* ========================================================== v285 — Avatar Studio smart accessory safety ========================================================== */ body.avatar-page #avatarSvg :is(#hairLayer,#backHairLayer,#hairBack){ display:inline!important; visibility:visible!important; opacity:1!important; } body.avatar-page #avatarSvg :is(#extraAccessory,#extraAccessory2,#headAccessory,#flowerAbsoluteFrontV174){ visibility:visible!important; } /* ========================================================== v286 — floating portfolio/theme dock near bottom edge ========================================================== */ .floating-portfolios{ top:auto!important; bottom:18px!important; right:18px!important; transform:none!important; } @media(max-width:760px){ .floating-portfolios{ top:auto!important; right:10px!important; bottom:max(8px,env(safe-area-inset-bottom))!important; transform:none!important; flex-direction:row!important; align-items:center!important; gap:7px!important; } .floating-portfolios .float-choice{ padding:9px 12px!important; } .floating-portfolios .theme-orb{ width:36px!important; height:36px!important; font-size:19px!important; } } /* v286 — canonical hair visibility, no stacked generated leftovers */ body.avatar-page #avatarSvg #backHairLayer{ visibility:visible!important; } body.avatar-page #avatarSvg #ggGeneratedHairV286{ pointer-events:none!important; } /* ========================================================== v287 — Sun silver polish + salon request priority ========================================================== */ html[data-gg-site-theme="sun"] body.avatar-room-page #roomMoodGaugeV065, html[data-gg-site-theme="sun"] body.avatar-room-page .room-mood-gauge-v065{ background:linear-gradient(145deg,#eff1f4,#b8bec8)!important; color:#15171b!important; border-color:#8d96a3!important; box-shadow:0 10px 22px rgba(69,78,93,.18)!important; } html[data-gg-site-theme="sun"] body.avatar-room-page #roomMoodGaugeV065 *, html[data-gg-site-theme="sun"] body.avatar-room-page .room-mood-gauge-v065 *{ color:#15171b!important; } html[data-gg-site-theme="sun"] body.avatar-room-page .room-mood-track-v065{ background:rgba(76,84,96,.24)!important; } html[data-gg-site-theme="sun"] #ggWorldMapV111 .gg-v111-card.world{ background:linear-gradient(145deg,#eff1f4,#b8bec8)!important; color:#15171b!important; border-color:#8d96a3!important; box-shadow:0 22px 48px rgba(69,78,93,.22)!important; } html[data-gg-site-theme="sun"] #ggWorldMapV111 .gg-v111-card.world *, html[data-gg-site-theme="sun"] #ggWorldMapV111 .gg-world-map-v111 *{ color:#15171b!important; } html[data-gg-site-theme="sun"] #ggWorldMapV111 .gg-v111-card.world header button, html[data-gg-site-theme="sun"] #ggWorldMapV111 .gg-v111-card.world button, html[data-gg-site-theme="sun"] #ggWorldMapV111 .gg-world-map-v111 button, html[data-gg-site-theme="sun"] #ggWorldMapV111 [data-world-place-v111]{ background:linear-gradient(145deg,#d8dde5,#b3bac4)!important; color:#15171b!important; border:1px solid #8d96a3!important; } html[data-gg-site-theme="sun"] #ggWorldMapV111 .gg-world-map-v111, html[data-gg-site-theme="sun"] #ggWorldMapV111 .gg-world-card-v111, html[data-gg-site-theme="sun"] #ggWorldMapV111 .gg-world-place-v111, html[data-gg-site-theme="sun"] #ggWorldMapV111 [data-world-place-v111]{ background:rgba(255,255,255,.28)!important; border-color:#8d96a3!important; } body.gg-salon-room-v206 .gg-salon-rep-v280{ pointer-events:auto!important; gap:6px!important; padding:8px 10px!important; } body.gg-salon-room-v206 .gg-salon-rep-toggle-v287{ width:100%!important; display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; padding:0!important; background:transparent!important; border:0!important; box-shadow:none!important; color:inherit!important; font:inherit!important; } body.gg-salon-room-v206 .gg-salon-rep-toggle-v287 span{ font-size:8px!important; letter-spacing:.08em!important; text-transform:uppercase!important; } body.gg-salon-room-v206 .gg-salon-rep-chevron-v287{ font-style:normal!important; font-size:11px!important; line-height:1!important; } body.gg-salon-room-v206 .gg-salon-rep-body-v287{ display:grid!important; gap:2px!important; } body.gg-salon-room-v206 .gg-salon-rep-body-v287 b{font-size:13px!important} body.gg-salon-room-v206 .gg-salon-rep-body-v287 small{font-size:7px!important;opacity:.82!important} body.gg-salon-room-v206 #ggSalonClientMenuV230, body.gg-salon-room-v206 .gg-client-request-card-v280{ z-index:2147483650!important; } body.gg-salon-room-v206 #ggSalonClientMenuV230{ position:fixed!important; } body.gg-salon-room-v206 #ggSalonCutProgressV230{ z-index:2147483648!important; } .hero-loop-video{display:block;background:#000;object-position:center center} /* ========================================================== v293 — Goldie loop showcase + salon polish ========================================================== */ .goldie-loop-showcase{margin:22px auto 0;max-width:881px} .goldie-loop-showcase .goldie-loop-frame{position:relative;overflow:hidden;border-radius:24px;border:1px solid rgba(215,176,91,.28);background:rgba(12,12,16,.76);box-shadow:0 18px 40px rgba(0,0,0,.24)} .goldie-loop-showcase video{display:block;width:100%;height:auto;max-height:min(72vw,560px);object-fit:cover;background:#0d0d12} .goldie-loop-caption{padding:12px 16px 16px;text-align:center;color:#d8d0c2;font-size:.95rem} body.gg-salon-room-v206 .gg-salon-rep-v280.gg-salon-rep-v293{ left:50%!important;right:auto!important;top:10px!important;transform:translateX(-50%)!important; display:flex!important;align-items:center!important;gap:8px!important;padding:6px 10px!important; pointer-events:auto!important;z-index:2147483490!important;background:rgba(12,12,16,.86)!important; } body.gg-salon-room-v206 .gg-salon-rep-v280.gg-salon-rep-v293 .gg-salon-rep-star-v293{ width:34px!important;height:34px!important;border-radius:999px!important;display:grid!important;place-items:center!important; padding:0!important;font-size:17px!important;font-weight:1000!important;line-height:1!important; } body.gg-salon-room-v206 .gg-salon-rep-v280.gg-salon-rep-v293 .gg-salon-rep-body-v293{display:grid!important;gap:1px!important;min-width:92px!important} body.gg-salon-room-v206 .gg-salon-rep-v280.gg-salon-rep-v293 .gg-salon-rep-body-v293[hidden]{display:none!important} body.gg-salon-room-v206 .gg-salon-rep-v280.gg-salon-rep-v293 .gg-salon-rep-body-v293 span{font-size:8px!important;letter-spacing:.12em!important;text-transform:uppercase!important} body.gg-salon-room-v206 .gg-salon-rep-v280.gg-salon-rep-v293 .gg-salon-rep-body-v293 b{font-size:15px!important} body.gg-salon-room-v206 .gg-salon-rep-v280.gg-salon-rep-v293 .gg-salon-rep-body-v293 small{font-size:8px!important;opacity:.78!important} body.gg-salon-room-v206 #ggSalonClientMenuV230, body.gg-salon-room-v206 #ggSalonCutProgressV230{ z-index:2147483605!important; } body.gg-salon-room-v206 #ggSalonClientMenuV230{top:14px!important;bottom:auto!important} body.gg-salon-room-v206 #ggSalonClientMenuV230 .gg-client-request-card-v280{position:relative!important;z-index:1!important} body.gg-salon-room-v206 #ggSalonClientV230{z-index:2147483000!important} /* ========================================================== v294 — Full-site polish ========================================================== */ /* Cleaner spacing and typography without changing brand identity */ :root{ --gg-section-gap:clamp(54px,7vw,92px); } main>section{ scroll-margin-top:82px; } .section-title{ max-width:820px; } .section-title h2, .page-hero h1, .hero h1{ text-wrap:balance; } .section-title p, .page-hero p, .hero p{ text-wrap:pretty; } /* Goldie portfolio loop gets a more intentional feature-card treatment */ .goldie-loop-showcase{ margin-top:28px!important; } .goldie-loop-showcase .goldie-loop-frame{ max-width:760px!important; margin-inline:auto!important; aspect-ratio:16/10!important; background:#0d0d12!important; } .goldie-loop-showcase video{ width:100%!important; height:100%!important; max-height:none!important; object-fit:cover!important; object-position:center!important; } .goldie-loop-caption{ max-width:760px!important; margin-inline:auto!important; } /* Salon client-request focus: remove competing room UI visually while active */ body.gg-salon-room-v206.gg-salon-request-focus-v294 :is(.gg-room-corner-tools-v143,#ggRoomLevelV143,#ggSalonMoneyGaugeV230,#ggSalonRepV280, .room-friends,.room-reference-head-v054){ opacity:.18!important; pointer-events:none!important; } body.gg-salon-room-v206.gg-salon-request-focus-v294 #ggSalonClientMenuV230, body.gg-salon-room-v206.gg-salon-request-focus-v294 #ggSalonCutProgressV230{ opacity:1!important; pointer-events:auto!important; z-index:2147483646!important; } body.gg-salon-room-v206 #ggSalonClientMenuV230{ width:min(92vw,390px)!important; max-height:calc(100dvh - 28px)!important; overflow:auto!important; overscroll-behavior:contain!important; } /* Salon client remains seated naturally: chair -> client -> user */ body.gg-salon-room-v206 #ggSalonChairLeftV230{z-index:430!important} body.gg-salon-room-v206 #ggSalonClientV230{z-index:520!important} body.gg-salon-room-v206 .room-avatar.room-avatar-exact{z-index:650!important} /* Avatar Studio cosmetics/extras always above front hair */ body.avatar-page #avatarSvg #hairLayer{position:relative} body.avatar-page #avatarSvg :is(#eyeAccessory,#lashAccessory,#earAccessory,#mouthAccessory,#beakAccessory,#facialHair, #extraAccessory,#extraAccessory2,#maskAccessory,#faceMask,#wolfMaskLayer,#headAccessory, #flowerAbsoluteFrontV174,#wizardPipeAbsoluteFrontV174){ visibility:visible!important; } /* Mobile polish */ @media(max-width:760px){ .hero-grid, .split, .contact-grid{ gap:26px!important; } .hero{ padding-top:26px!important; } .hero .actions{ gap:8px!important; } .hero .actions .btn{ min-height:42px!important; } .goldie-loop-showcase{ margin-top:18px!important; } .hero-loop-frame{ margin-top:18px; } .goldie-loop-showcase .goldie-loop-frame{ border-radius:18px!important; aspect-ratio:4/5!important; } body.gg-salon-room-v206 #ggSalonClientMenuV230{ top:max(8px,env(safe-area-inset-top))!important; width:calc(100vw - 20px)!important; max-width:calc(100vw - 20px)!important; } } /* Performance: reduce expensive blur/backdrop on constrained/mobile mode */ .gg-low-performance-v280 :is(.gg-tutorial-card,.gg-v111-card,.gg-salon-client-menu-v230){ backdrop-filter:none!important; } /* v295 — home hero loop lowered so it sits below the action buttons more cleanly */ /* v296 — Home hero loop position: keep media clearly below the action buttons. */ .home-only .logo-stage--loop{ margin-top:52px; } .home-only .logo-stage--loop .hero-loop-frame{ margin-top:0; } @media(max-width:760px){ .home-only .logo-stage--loop{ margin-top:36px; } } /* ========================================================== v298 — Goldie's Salon: no reputation HUD + editor Upgrade slot ========================================================== */ body.gg-salon-room-v206 #ggSalonRepV280, body.gg-salon-room-v206 .gg-salon-rep-v280{ display:none!important; } body.gg-salon-room-v206 #ggSalonUpgradeBtnV230{ display:none!important; } body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="frame"]{order:50!important} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="upgrade"]{ order:51!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; flex-direction:column!important; min-width:58px!important; min-height:54px!important; padding:5px 7px!important; margin:0!important; border:1px solid rgba(215,176,91,.55)!important; border-radius:10px!important; box-sizing:border-box!important; } body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="upgrade"] b{ font-size:19px!important; line-height:1!important; font-weight:1000!important; } body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="floorDecor"]{order:52!important} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="lighting"]{order:53!important} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="care"]{order:54!important} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="wallDecor"]{order:55!important} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="extras"]{order:56!important} /* ========================================================== v299 — Goldie's Studio Cut makeover mini-game ========================================================== */ body.gg-salon-cut-open-v299{overflow:hidden!important} .gg-salon-studio-cut-v299{position:fixed;inset:0;z-index:2147483647;background:rgba(7,5,8,.88);backdrop-filter:blur(10px);display:grid;place-items:center;padding:14px;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#fff} .gg-cut-shell-v299{width:min(1120px,98vw);height:min(790px,96dvh);overflow:hidden;display:flex;flex-direction:column;border:1px solid rgba(230,189,82,.55);border-radius:24px;background:radial-gradient(circle at 80% 0%,rgba(160,113,23,.17),transparent 30%),linear-gradient(160deg,#151015,#08080b);box-shadow:0 26px 90px #000,0 0 60px rgba(214,167,49,.12)} .gg-cut-shell-v299>header{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:16px;padding:18px 20px;border-bottom:1px solid rgba(230,189,82,.22);background:linear-gradient(90deg,rgba(239,199,86,.08),transparent)} .gg-cut-shell-v299 header small{font-weight:1000;letter-spacing:.16em;color:#e9c96e}.gg-cut-shell-v299 header h2{margin:2px 0 1px;font:900 clamp(23px,4vw,38px)/1 Georgia,serif;color:#ffe6a1}.gg-cut-shell-v299 header p{margin:5px 0 0;color:#d9d0d7;font-size:13px}.gg-cut-timer-v299{min-width:62px;text-align:center;border:1px solid rgba(239,199,86,.4);border-radius:15px;padding:7px 11px;background:#0b090d}.gg-cut-timer-v299 b{display:block;font-size:24px;color:#ffe6a1}.gg-cut-timer-v299 span{font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:#b9a978}.gg-cut-x-v299{width:38px;height:38px;border:1px solid rgba(255,255,255,.14);border-radius:50%;background:#18131a;color:#fff;font-size:23px} .gg-cut-game-v299{display:grid;grid-template-columns:minmax(210px,.82fr) minmax(250px,1fr) minmax(330px,1.35fr);gap:12px;padding:12px;min-height:0;flex:1} .gg-cut-reference-v299,.gg-cut-work-v299,.gg-cut-editor-v299{position:relative;min-height:0;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));overflow:hidden} .gg-cut-reference-v299,.gg-cut-work-v299{display:flex;flex-direction:column}.gg-cut-section-title-v299{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.08)}.gg-cut-section-title-v299 span{font-size:11px;font-weight:1000;letter-spacing:.12em;color:#edcf79}.gg-cut-section-title-v299 small{font-size:9px;color:#aaa1aa;text-align:right} .gg-cut-reference-host-v299,.gg-cut-work-host-v299{position:relative;flex:1;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(224,190,90,.09),transparent 48%)} .gg-cut-avatar-stack-v299{position:relative;width:min(98%,330px);aspect-ratio:1/1;display:grid;place-items:center}.gg-cut-avatar-stack-v299>.gg-cut-avatar-svg-v299,.gg-cut-avatar-stack-v299>.gg-cut-overlay-v299{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.gg-cut-avatar-svg-v299{transform:scale(1.38) translateY(8%);transform-origin:center 45%}.gg-cut-overlay-v299{pointer-events:none;z-index:5}.gg-cut-work-v299 .gg-cut-overlay-v299{pointer-events:auto;touch-action:none}.gg-cut-braid-v299,.gg-cut-lock-v299{fill:none!important}.gg-cut-extra-v299{fill:#f3b9d6;stroke:#f8d3e7;stroke-width:2}.gg-cut-extra-gold-v299{fill:#e7bd42;stroke:#fff0a3;stroke-width:2}.gg-cut-cap-v299{fill:#24232a;stroke:#d1af53;stroke-width:2} .gg-cut-ref-cover-v299{position:absolute;inset:43px 0 0;z-index:10;display:none;place-items:center;align-content:center;gap:7px;text-align:center;background:radial-gradient(circle,rgba(31,22,30,.95),rgba(7,6,9,.99));padding:20px}.hidden-ref .gg-cut-ref-cover-v299{display:grid}.gg-cut-ref-cover-v299 b{font-size:20px;color:#ffe6a1}.gg-cut-ref-cover-v299 span{font-size:11px;color:#bfb4bf}.gg-cut-ref-cover-v299 button{margin-top:8px;border:1px solid rgba(239,199,86,.42);border-radius:10px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;padding:8px 12px;font-weight:900;} .gg-cut-editor-v299{padding:11px;overflow:auto}.gg-cut-tabs-v299{display:flex;align-items:baseline;gap:8px;margin:7px 2px 5px}.gg-cut-tabs-v299 b{font-size:10px;letter-spacing:.12em;color:#f2d77f}.gg-cut-tabs-v299 span{font-size:9px;color:#91878f}.gg-cut-row-v299{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.gg-cut-row-v299.styles button,.gg-cut-row-v299.tools button{border:1px solid rgba(255,255,255,.11);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:9px;padding:7px 9px;font-size:10px;font-weight:800;}.gg-cut-row-v299 button.selected{border-color:#f1ca63!important;background:rgba(230,185,69,.16)!important;color:#ffe49b!important;box-shadow:0 0 0 1px rgba(241,202,99,.18) inset}.gg-cut-swatch-v299{width:27px;height:27px;border-radius:50%;border:2px solid rgba(255,255,255,.18);background:var(--sw)!important;box-shadow:0 1px 8px #0007}.gg-cut-swatch-v299.eye{border-radius:55% 55% 52% 52%;height:22px}.gg-cut-swatch-v299.mini{width:22px;height:22px;padding:0!important}.gg-cut-submit-v299{position:sticky;bottom:0;width:100%;margin-top:5px;border:1px solid #e5bd56;border-radius:12px;background:linear-gradient(180deg,#d5ae44,#9a741c);color:#120c04;padding:11px 14px;font-weight:1000;box-shadow:0 8px 24px #0009}.gg-cut-editor-v299.finished{pointer-events:none;filter:grayscale(.35);opacity:.45} .gg-cut-result-v299{position:absolute;z-index:30;left:50%;top:50%;transform:translate(-50%,-50%);width:min(470px,90vw);display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;padding:22px;border:1px solid rgba(239,199,86,.55);border-radius:20px;background:linear-gradient(145deg,#201521,#0a090d);box-shadow:0 26px 80px #000}.gg-cut-result-v299[hidden]{display:none}.gg-cut-score-ring-v299{width:112px;height:112px;border:7px solid #e5bd56;border-radius:50%;display:grid;place-items:center;align-content:center;background:#0c090d;box-shadow:0 0 35px rgba(229,189,86,.2)}.gg-cut-score-ring-v299 b{font-size:28px;color:#ffe28f}.gg-cut-score-ring-v299 span{font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:#a89a71}.gg-cut-result-v299 h3{margin:0 0 7px;color:#ffe39a;font:900 25px Georgia,serif}.gg-cut-result-v299 p{margin:4px 0;color:#d1c9d0;font-size:12px}.gg-cut-bonus-v299{color:#f4d46f!important;font-weight:900}.gg-cut-result-v299 button{margin-top:10px;border:1px solid #e6bd57;border-radius:10px;background:#c89b2f;color:#120c04;padding:8px 18px;font-weight:1000} @media(max-width:820px){.gg-salon-studio-cut-v299{padding:0}.gg-cut-shell-v299{width:100vw;height:100dvh;border-radius:0;border-left:0;border-right:0}.gg-cut-shell-v299>header{padding:10px 12px;gap:8px}.gg-cut-shell-v299 header p{max-width:58vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gg-cut-game-v299{grid-template-columns:1fr 1fr;grid-template-rows:42% 58%;padding:7px;gap:7px}.gg-cut-editor-v299{grid-column:1/-1;padding:8px}.gg-cut-avatar-stack-v299{width:min(100%,240px)}.gg-cut-section-title-v299{padding:7px 8px}.gg-cut-tabs-v299{margin-top:3px}.gg-cut-row-v299{margin-bottom:7px}.gg-cut-row-v299.styles button,.gg-cut-row-v299.tools button{padding:6px 8px;font-size:9px}.gg-cut-result-v299{grid-template-columns:1fr;text-align:center;justify-items:center}.gg-cut-score-ring-v299{width:90px;height:90px}} /* ========================================================== v300 — requested salon/avatar fixes ========================================================== */ /* Lower the user's room/salon floor shadow farther below the avatar. */ #ggRoomAvatarShadowV243, .gg-room-avatar-shadow-v243{ transform:translate(-50%,18%)!important; } /* Goldie's Salon: Scene IS the background — no wallpaper/window/frame model. */ body.gg-salon-room-v206 #roomWallBackdropV068{ background:#111!important; } body.gg-salon-room-v206 #roomSceneWindowV055{ position:absolute!important; inset:0 0 35% 0!important; left:0!important; top:0!important; width:100%!important; height:auto!important; max-width:none!important; transform:none!important; border:0!important; border-radius:0!important; box-shadow:none!important; overflow:hidden!important; pointer-events:none!important; z-index:2!important; clip-path:none!important; } body.gg-salon-room-v206 #roomSceneWindowV055 .room-window-frame-v055, body.gg-salon-room-v206 #roomSceneWindowV055 .room-window-frame-v057, body.gg-salon-room-v206 #roomSceneWindowV055::before, body.gg-salon-room-v206 #roomSceneWindowV055::after{ display:none!important; content:none!important; } body.gg-salon-room-v206 #roomSceneVisualV055{ position:absolute!important; inset:0!important; width:100%!important; height:100%!important; border-radius:0!important; transform:none!important; } /* Scene effects should fill the backdrop rather than be clipped to a window. */ body.gg-salon-room-v206 #roomSceneWindowV055 > :not(.room-window-frame-v055):not(.room-window-frame-v057){ max-width:100%!important; } /* ========================================================== v301 — Studio Cut split overlay polish + salon shadow removal ========================================================== */ body.gg-salon-room-v206 #ggRoomAvatarShadowV243, body.gg-salon-room-v206 .gg-room-avatar-shadow-v243{display:none !important;opacity:0 !important;pointer-events:none !important;} body.gg-studio-cut-clean-v301 .gg-salon-studio-cut-v299{background:rgba(7,5,8,.54);backdrop-filter:blur(5px);} body.gg-studio-cut-clean-v301 .gg-cut-shell-v299{width:min(1260px,98vw);height:min(850px,96dvh);background:linear-gradient(180deg,rgba(10,10,14,.86),rgba(12,10,14,.82));} body.gg-studio-cut-clean-v301 .gg-cut-shell-v299>header{grid-template-columns:1fr auto;padding:16px 18px;} body.gg-studio-cut-clean-v301 .gg-cut-timer-v299{min-width:auto;padding:9px 14px;border-color:rgba(239,199,86,.28);background:rgba(12,9,14,.72);} body.gg-studio-cut-clean-v301 .gg-cut-timer-v299 b{font-size:16px;letter-spacing:.05em;} body.gg-studio-cut-clean-v301 .gg-cut-timer-v299 span{font-size:10px;} body.gg-studio-cut-clean-v301 .gg-cut-game-v299{grid-template-columns:minmax(0,1.35fr) minmax(320px,.88fr);grid-template-areas:"work reference" "editor reference";align-items:stretch;gap:14px;padding:14px;} body.gg-studio-cut-clean-v301 .gg-cut-work-v299{grid-area:work;min-height:260px;} body.gg-studio-cut-clean-v301 .gg-cut-editor-v299{grid-area:editor;max-height:none;} body.gg-studio-cut-clean-v301 .gg-cut-reference-v299{grid-area:reference;display:flex;flex-direction:column;min-width:0;} body.gg-studio-cut-clean-v301 .gg-cut-reference-v299 .gg-cut-reference-host-v299, body.gg-studio-cut-clean-v301 .gg-cut-work-v299 .gg-cut-work-host-v299{flex:1;display:grid;place-items:center;padding:14px;} body.gg-studio-cut-clean-v301 .gg-cut-avatar-stack-v299{width:min(96%,380px);} body.gg-studio-cut-clean-v301 .gg-cut-reference-v299 .gg-cut-avatar-stack-v299{width:min(96%,410px);} body.gg-studio-cut-clean-v301 .gg-cut-ref-cover-v299, body.gg-studio-cut-clean-v301 .hidden-ref .gg-cut-ref-cover-v299{display:none !important;} body.gg-studio-cut-clean-v301 .gg-cut-hint-v301{margin:0 0 10px;padding:10px 12px;border:1px solid rgba(230,189,82,.25);border-radius:12px;background:rgba(244,199,89,.08);color:#e8dde9;font-size:12px;line-height:1.45;} body.gg-studio-cut-clean-v301 .gg-cut-hint-v301 b{color:#ffe49f;} body.gg-studio-cut-clean-v301 .gg-cut-submit-v299{margin-top:8px;} @media(max-width:920px){ body.gg-studio-cut-clean-v301 .gg-cut-shell-v299{width:100vw;height:100dvh;border-radius:0;} body.gg-studio-cut-clean-v301 .gg-cut-shell-v299>header{grid-template-columns:1fr auto;gap:10px;} body.gg-studio-cut-clean-v301 .gg-cut-game-v299{grid-template-columns:1fr;grid-template-areas:"work" "reference" "editor";padding:8px;gap:8px;} body.gg-studio-cut-clean-v301 .gg-cut-reference-v299 .gg-cut-avatar-stack-v299, body.gg-studio-cut-clean-v301 .gg-cut-work-v299 .gg-cut-avatar-stack-v299{width:min(100%,260px);} } /* v302 — Studio Cut live score + result breakdown */ .gg-cut-live-slot-v302{margin:0 0 10px;} .gg-cut-live-meter-v302{padding:10px 12px;border:1px solid rgba(230,189,82,.22);border-radius:12px;background:rgba(243,200,99,.07);} .gg-cut-live-head-v302{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:8px;} .gg-cut-live-head-v302 b{font-size:12px;letter-spacing:.05em;color:#ffe39a;} .gg-cut-live-head-v302 span{font-size:18px;font-weight:900;color:#fff;} .gg-cut-live-track-v302{height:10px;border-radius:999px;background:rgba(255,255,255,.09);overflow:hidden;} .gg-cut-live-track-v302 i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#9b7420,#f0ca66,#ffe7a6);box-shadow:0 0 14px rgba(239,199,86,.33);} .gg-cut-result-copy-v302{display:grid;gap:8px;} .gg-cut-breakdown-v302{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px;} .gg-cut-breakdown-v302>div{display:flex;justify-content:space-between;gap:10px;padding:9px 10px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.03);font-size:12px;} .gg-cut-breakdown-v302>div span{color:#d5cad6;} .gg-cut-breakdown-v302>div b{color:#fff2b8;} .gg-cut-breakdown-v302>div.overall{grid-column:1/-1;border-color:rgba(230,189,82,.22);background:rgba(230,189,82,.08);} .gg-cut-after-note-v302{color:#ab9faf;font-size:11px;line-height:1.35;} @media(max-width:820px){.gg-cut-breakdown-v302{grid-template-columns:1fr;}} .gg-cut-finished-client-overlay-v302{position:absolute;inset:-2% -10% -8% -10%;pointer-events:none;z-index:6;} .gg-cut-finished-client-overlay-v302 .gg-cut-overlay-v299{width:100%;height:100%;} /* v303 — Studio Cut stars, compare cards, and combo streak */ .gg-cut-stars-v303{display:flex;gap:4px;align-items:center;margin:0 0 2px;} .gg-cut-stars-v303 span{font-size:22px;line-height:1;color:rgba(255,255,255,.18);transform:scale(.6) rotate(-12deg);opacity:.3;animation:ggCutStarPopV303 .55s ease forwards;animation-delay:var(--d,0ms);} .gg-cut-stars-v303 span.on{color:#ffd86f;text-shadow:0 0 16px rgba(255,215,110,.45),0 0 6px rgba(255,215,110,.55);} @keyframes ggCutStarPopV303{0%{transform:scale(.4) rotate(-18deg);opacity:.1;}65%{transform:scale(1.16) rotate(8deg);opacity:1;}100%{transform:scale(1) rotate(0deg);opacity:1;}} .gg-cut-streak-v303{margin:0;color:#f4dfa0;font-size:12px;} .gg-cut-streak-v303.muted{color:#bdb0c2;} .gg-cut-compare-v303{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:2px 0 6px;} .gg-cut-compare-v303 section{border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.025);padding:8px;} .gg-cut-compare-v303 h4{margin:0 0 6px;font-size:12px;letter-spacing:.05em;color:#f2da97;} .gg-cut-compare-host-v303{min-height:150px;display:grid;place-items:center;} .gg-cut-compare-host-v303 .gg-cut-avatar-stack-v299{width:min(100%,170px);} @media(max-width:820px){.gg-cut-compare-v303{grid-template-columns:1fr;}} /* v304 — Special VIPs and Daily Challenge HUD */ .gg-salon-challenge-v304{position:absolute;right:10px;top:10px;z-index:881;max-width:240px;padding:10px 12px;border-radius:14px;border:1px solid rgba(236,197,93,.26);background:linear-gradient(180deg,rgba(18,16,22,.86),rgba(9,8,12,.9));box-shadow:0 10px 28px rgba(0,0,0,.28);color:#f4eef4;backdrop-filter:blur(4px);} .gg-salon-challenge-v304 small{display:block;font-size:9px;letter-spacing:.16em;color:#e8ca71;font-weight:900;margin-bottom:4px;} .gg-salon-challenge-v304 b{display:block;font-size:15px;color:#fff0b0;margin-bottom:3px;} .gg-salon-challenge-v304 span{display:block;font-size:11px;line-height:1.35;color:#d7cbd7;} .gg-salon-challenge-v304 em{display:block;margin-top:7px;font-style:normal;font-size:10px;color:#cfbf86;} .gg-salon-ch-track-v304{height:8px;margin-top:8px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;} .gg-salon-ch-track-v304 i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#93691b,#efcb69,#fff0b2);box-shadow:0 0 14px rgba(239,203,105,.28);} #ggSalonClientV230.gg-special-vip-v304{filter:drop-shadow(0 0 18px rgba(255,215,110,.22));} #ggSalonClientV230.gg-special-vip-v304::after{content:"VIP";position:absolute;left:50%;top:-18px;transform:translateX(-50%);font:900 10px/1 Inter,system-ui,sans-serif;letter-spacing:.16em;color:#1a1203;background:linear-gradient(180deg,#ffe8a6,#d7ad43);padding:5px 7px;border-radius:999px;box-shadow:0 3px 12px rgba(0,0,0,.25);} #ggSalonClientV230.vip-celestial::before,#ggSalonClientV230.vip-midnight::before,#ggSalonClientV230.vip-royale-special::before{content:"";position:absolute;inset:-8px;border-radius:50%;pointer-events:none;opacity:.42;} #ggSalonClientV230.vip-celestial::before{background:radial-gradient(circle,rgba(127,85,217,.35),transparent 65%);} #ggSalonClientV230.vip-midnight::before{background:radial-gradient(circle,rgba(59,112,199,.28),transparent 65%);} #ggSalonClientV230.vip-royale-special::before{background:radial-gradient(circle,rgba(231,189,66,.35),transparent 65%);} @media(max-width:820px){.gg-salon-challenge-v304{right:8px;top:8px;max-width:180px;padding:8px 10px;}.gg-salon-challenge-v304 span{font-size:10px;}} /* v305 — Goldie's Salon floor decor simplified to Kimball Machine */ .v305-kimball-machine{position:relative;display:block;width:92px;height:170px;filter:drop-shadow(0 10px 12px rgba(0,0,0,.22));} .v305-kimball-machine .top{position:absolute;left:22px;top:0;width:48px;height:22px;border-radius:18px 18px 10px 10px;background:linear-gradient(180deg,#f2cf67,#b8861a);box-shadow:inset 0 2px 3px rgba(255,255,255,.4);} .v305-kimball-machine .glass{position:absolute;left:15px;top:16px;width:62px;height:62px;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.9),rgba(255,255,255,.2) 28%,rgba(195,235,255,.32) 60%,rgba(255,255,255,.14) 100%);border:3px solid rgba(250,250,255,.85);box-shadow:inset 0 -10px 18px rgba(52,74,102,.15);overflow:hidden;} .v305-kimball-machine .g{position:absolute;width:13px;height:13px;border-radius:50%;box-shadow:inset -2px -2px 0 rgba(0,0,0,.1);} .v305-kimball-machine .g1{left:10px;top:26px;background:#ea5676;}.v305-kimball-machine .g2{left:24px;top:18px;background:#f5d060;}.v305-kimball-machine .g3{left:38px;top:28px;background:#67c6ef;}.v305-kimball-machine .g4{left:16px;top:40px;background:#85d96b;}.v305-kimball-machine .g5{left:31px;top:41px;background:#b687ff;}.v305-kimball-machine .g6{left:45px;top:44px;background:#ff9b5f;} .v305-kimball-machine .neck{position:absolute;left:33px;top:75px;width:26px;height:10px;border-radius:0 0 10px 10px;background:#e5c15a;} .v305-kimball-machine .body{position:absolute;left:22px;top:84px;width:48px;height:56px;border-radius:12px 12px 10px 10px;background:linear-gradient(180deg,#f75d75,#b42943);box-shadow:inset 0 3px 0 rgba(255,255,255,.25);} .v305-kimball-machine .slot{position:absolute;left:34px;top:104px;width:24px;height:18px;border-radius:9px;background:#6f1627;box-shadow:inset 0 2px 3px rgba(255,255,255,.15);} .v305-kimball-machine .base{position:absolute;left:12px;bottom:4px;width:68px;height:16px;border-radius:12px;background:linear-gradient(180deg,#b8861a,#6f4f0f);} .v305-kimball-machine .label{position:absolute;left:0;right:0;top:142px;text-align:center;font:900 10px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;color:#fff1b2;text-shadow:0 1px 1px rgba(0,0,0,.35);} body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"]{left:78% !important;bottom:4% !important;transform:translateX(-50%) scale(1) !important;} body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .room-floor-item-v061{width:110px;height:180px;display:grid;place-items:end center;} /* v306 — Animated Kimball Machine for Goldie's Salon */ .v305-kimball-machine{animation:ggKimballFloatV306 3.2s ease-in-out infinite;} .v305-kimball-machine .glass{animation:ggKimballGlassGlowV306 2.8s ease-in-out infinite;} .v305-kimball-machine .g{animation:ggKimballBounceV306 2.4s ease-in-out infinite;transform-origin:center bottom;} .v305-kimball-machine .g1{animation-delay:0s;} .v305-kimball-machine .g2{animation-delay:.2s;} .v305-kimball-machine .g3{animation-delay:.4s;} .v305-kimball-machine .g4{animation-delay:.6s;} .v305-kimball-machine .g5{animation-delay:.8s;} .v305-kimball-machine .g6{animation-delay:1s;} .v305-kimball-machine .label{animation:ggKimballLabelGlowV306 2.6s ease-in-out infinite;} @keyframes ggKimballFloatV306{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-2px)} } @keyframes ggKimballGlassGlowV306{ 0%,100%{box-shadow:inset 0 -10px 18px rgba(52,74,102,.15),0 0 0 rgba(255,214,110,0)} 50%{box-shadow:inset 0 -10px 18px rgba(52,74,102,.15),0 0 16px rgba(255,214,110,.18)} } @keyframes ggKimballBounceV306{ 0%,100%{transform:translateY(0) scale(1)} 20%{transform:translateY(-1px) scale(1.03)} 45%{transform:translateY(-3px) scale(.98,1.05)} 65%{transform:translateY(0) scale(1)} } @keyframes ggKimballLabelGlowV306{ 0%,100%{opacity:.92;text-shadow:0 1px 1px rgba(0,0,0,.35),0 0 0 rgba(255,240,178,0)} 50%{opacity:1;text-shadow:0 1px 1px rgba(0,0,0,.35),0 0 10px rgba(255,240,178,.28)} } /* ========================================================== v307 — Avatar Studio canonical hair visibility lock Prevents stale long/rear/special hair from mixing with new styles. ========================================================== */ body.avatar-page #avatarSvg #backHairLayer, body.avatar-page #avatarSvg #hairBack, body.avatar-page #avatarSvg #dreads, body.avatar-page #avatarSvg #dreadsOutline, body.avatar-page #avatarSvg #braids, body.avatar-page #avatarSvg #braidsOutline, body.avatar-page #avatarSvg #shortDreads, body.avatar-page #avatarSvg #shortDreadsOutline, body.avatar-page #avatarSvg #shortDreadsBack, body.avatar-page #avatarSvg #shortDreadsBackOutline, body.avatar-page #avatarSvg #shortDreadsCap, body.avatar-page #avatarSvg #shortDreadsCapTexture, body.avatar-page #avatarSvg #buns, body.avatar-page #avatarSvg #mohawk, body.avatar-page #avatarSvg #lineCut, body.avatar-page #avatarSvg #ggGeneratedHairV286{ display:none !important; } /* Generic rear sheet belongs ONLY to true rear-hair styles. */ body.avatar-page #avatarSvg[data-hair-style="bob"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="shoulder"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="waves"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="extraLong"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="bob"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="shoulder"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="waves"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="extraLong"] #hairBack{ display:inline !important; } /* Short dreads use their own rear cap + strands, never generic rear sheet leakage. */ body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreads, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsOutline, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsBack, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsBackOutline, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsCap, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsCapTexture{ display:inline !important; } body.avatar-page #avatarSvg[data-hair-style="longDreads"] #dreads, body.avatar-page #avatarSvg[data-hair-style="longDreads"] #dreadsOutline, body.avatar-page #avatarSvg[data-hair-style="braids"] #braids, body.avatar-page #avatarSvg[data-hair-style="braids"] #braidsOutline, body.avatar-page #avatarSvg[data-hair-style="buns"] #buns, body.avatar-page #avatarSvg[data-hair-style="mohawk"] #mohawk, body.avatar-page #avatarSvg[data-hair-style="lineCut"] #lineCut{ display:inline !important; } /* No normal front cap for styles that fully own their front visuals. */ body.avatar-page #avatarSvg[data-hair-style="bald"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="none"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="mohawk"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="lineCut"] #hairFront{ display:none !important; } /* Extra 1 + Extra 2 are head/front items, not wardrobe layers. */ body.avatar-page #avatarSvg #extraAccessory, body.avatar-page #avatarSvg #extraAccessory2, body.avatar-page #avatarSvg #headAccessory{ isolation:isolate; } /* ========================================================== v308 — Goldie's Salon cleanup + challenge popup + rebuilt hair visuals ========================================================== */ body.gg-salon-room-v206 #ggSalonChallengeHudV304{display:none !important;} #ggGoldieChallengePopupV308{position:fixed;z-index:2147483005;width:min(260px,72vw);padding:12px 13px;border-radius:14px;border:1px solid rgba(237,196,82,.28);background:linear-gradient(180deg,rgba(15,12,20,.96),rgba(9,8,13,.94));box-shadow:0 12px 32px rgba(0,0,0,.34);color:#f6f1f6;backdrop-filter:blur(5px);} #ggGoldieChallengePopupV308 small{display:block;font-size:9px;letter-spacing:.15em;color:#e2c56b;font-weight:900;margin-bottom:5px;} #ggGoldieChallengePopupV308 b{display:block;font-size:15px;color:#fff0b7;margin-bottom:5px;} #ggGoldieChallengePopupV308 p{margin:0;font-size:11px;line-height:1.4;color:#ddd2df;} #ggGoldieChallengePopupV308 .track{height:8px;margin:9px 0 7px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;} #ggGoldieChallengePopupV308 .track i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#9d7420,#f0cb66,#fff0b2);} #ggGoldieChallengePopupV308 em{display:block;font-style:normal;font-size:10px;color:#d5c58d;} body.gg-salon-room-v206 #roomFloorDecorV061{background:transparent !important;border:none !important;box-shadow:none !important;outline:none !important;z-index:390 !important;} body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"]{top:82% !important;bottom:auto !important;left:72% !important;transform:translate(-50%,-50%) !important;} body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .room-floor-item-v061{display:grid;place-items:end center;width:110px;height:190px;} body.gg-salon-room-v206 .gg-salon-chair-side-v230{z-index:430 !important;} body.gg-salon-room-v206 #ggSalonClientV230{z-index:520 !important;} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="floor"]{display:none !important;} body.gg-salon-room-v206 #roomCategoryLoop > *{flex:0 0 auto;} body.gg-salon-room-v206 #roomFloorDecorV061[hidden]{display:none !important;} /* Rebuilt avatar hair visuals */ body.avatar-page #avatarSvg .gg-generated-hair-v286{display:none;} body.avatar-page #avatarSvg #ggGeneratedHairV286{pointer-events:none;} body.avatar-page #avatarSvg #ggGeneratedHairV286 path, body.avatar-page #avatarSvg #ggGeneratedHairV286 circle{vector-effect:non-scaling-stroke;} /* ========================================================== v309 — Goldie layout tightening + smoother Kimball + hair polish ========================================================== */ body.gg-salon-room-v206 #roomCategoryLoop{ display:flex !important; align-items:center !important; justify-content:center !important; gap:7px !important; padding:7px 8px !important; margin:0 auto !important; width:min(100%,760px) !important; overflow-x:auto !important; scroll-snap-type:x proximity; } body.gg-salon-room-v206 #roomCategoryLoop > [data-room-category]{ margin:0 !important; flex:0 0 auto !important; min-width:68px !important; scroll-snap-align:center; } body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="search"]{order:10 !important;} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="scene"]{order:20 !important;} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="upgrade"]{order:30 !important;} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="floorDecor"]{order:40 !important;} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="lighting"]{order:50 !important;} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="care"]{order:60 !important;margin-left:0 !important;} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="wallDecor"]{order:70 !important;} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="extras"]{order:80 !important;} body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="floor"], body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="frame"], body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="wall"], body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="pot"], body.gg-salon-room-v206 #roomCategoryLoop [data-room-category="plant"]{display:none !important;} /* Do not pin Kimball's X position: inline drag position owns left. */ body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"]{ top:82% !important; bottom:auto !important; transform:translate(-50%,-50%) !important; z-index:390 !important; transition:left .06s linear !important; } body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099{ transition:none !important; cursor:grabbing !important; } body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .v305-kimball-machine{ transform-origin:50% 100%; filter:drop-shadow(0 8px 9px rgba(0,0,0,.18)); } /* Hair polish: richer depth without adding extra competing hair layers. */ body.avatar-page #avatarSvg #ggGeneratedHairV286{ filter:drop-shadow(0 2px 1px rgba(0,0,0,.16)) drop-shadow(0 5px 5px rgba(0,0,0,.10)); } body.avatar-page #avatarSvg #ggGeneratedHairV286 path{ shape-rendering:geometricPrecision; } body.avatar-page #avatarSvg #ggGeneratedHairV286 path[fill="none"]{ opacity:.82; } @media(max-width:820px){ body.gg-salon-room-v206 #roomCategoryLoop{justify-content:flex-start !important;padding-inline:10px !important;} body.gg-salon-room-v206 #roomCategoryLoop > [data-room-category]{min-width:64px !important;} } /* ========================================================== v310 — audited hair ownership and dead-code conflict cleanup ========================================================== */ /* Legacy Avatar Studio hair models are permanently retired. */ body.avatar-page #avatarSvg #hairFront, body.avatar-page #avatarSvg #hairBack, body.avatar-page #avatarSvg #backHairLayer, body.avatar-page #avatarSvg #dreads, body.avatar-page #avatarSvg #dreadsOutline, body.avatar-page #avatarSvg #braids, body.avatar-page #avatarSvg #braidsOutline, body.avatar-page #avatarSvg #shortDreads, body.avatar-page #avatarSvg #shortDreadsOutline, body.avatar-page #avatarSvg #shortDreadsBack, body.avatar-page #avatarSvg #shortDreadsBackOutline, body.avatar-page #avatarSvg #shortDreadsCap, body.avatar-page #avatarSvg #shortDreadsCapTexture, body.avatar-page #avatarSvg #buns, body.avatar-page #avatarSvg #mohawk, body.avatar-page #avatarSvg #lineCut, body.avatar-page #avatarSvg #ggGeneratedHairV286{ display:none !important; } /* v310 is the only visible Avatar Studio hair layer. */ body.avatar-page #avatarSvg #ggHairRebuiltV310{ display:inline !important; pointer-events:none !important; filter:drop-shadow(0 2px 1px rgba(0,0,0,.16)) drop-shadow(0 5px 5px rgba(0,0,0,.10)); } body.avatar-page #avatarSvg[data-hair-style="none"] #ggHairRebuiltV310, body.avatar-page #avatarSvg[data-hair-style="bald"] #ggHairRebuiltV310{ display:none !important; } body.avatar-page #avatarSvg #ggHairRebuiltV310 path, body.avatar-page #avatarSvg #ggHairRebuiltV310 circle{vector-effect:non-scaling-stroke;shape-rendering:geometricPrecision;} /* ========================================================== v311 — restore window-only scene, legacy Avatar Studio hair, resize Kimball ========================================================== */ /* Goldie's scene is a WINDOW again, never a full-wall rectangle. */ body.gg-salon-room-v206 #roomSceneWindowV055{ inset:auto !important; left:var(--salon-window-x,50%) !important; top:14% !important; width:34% !important; height:auto !important; aspect-ratio:.82 !important; transform:translateX(-50%) !important; border-radius:8px !important; overflow:hidden !important; pointer-events:auto !important; z-index:210 !important; background:#18181f !important; box-shadow:0 0 0 3px rgba(33,29,32,.95),0 8px 22px rgba(0,0,0,.25) !important; } body.gg-salon-room-v206 #roomSceneVisualV055{ inset:10px !important; width:auto !important; height:auto !important; border-radius:4px !important; } body.gg-salon-room-v206 #roomSceneWindowV055 .room-window-frame-v055, body.gg-salon-room-v206 #roomSceneWindowV055 .room-window-frame-v057{ display:block !important; } body.gg-salon-room-v206 #roomSceneWindowV055 .room-window-frame-v055{border:7px solid #241f23 !important;box-shadow:inset 0 0 0 3px #7f6349 !important;} /* Avatar Studio: return to the proven native hair renderer. */ body.avatar-page #avatarSvg #ggHairRebuiltV310{display:none !important;} body.avatar-page #avatarSvg #ggGeneratedHairV286{display:none !important;} body.avatar-page #avatarSvg #hairFront{display:inline !important;} body.avatar-page #avatarSvg[data-hair-style="none"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="bald"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="mohawk"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="lineCut"] #hairFront{display:none !important;} body.avatar-page #avatarSvg #backHairLayer, body.avatar-page #avatarSvg #hairBack, body.avatar-page #avatarSvg #dreads, body.avatar-page #avatarSvg #dreadsOutline, body.avatar-page #avatarSvg #braids, body.avatar-page #avatarSvg #braidsOutline, body.avatar-page #avatarSvg #shortDreads, body.avatar-page #avatarSvg #shortDreadsOutline, body.avatar-page #avatarSvg #shortDreadsBack, body.avatar-page #avatarSvg #shortDreadsBackOutline, body.avatar-page #avatarSvg #shortDreadsCap, body.avatar-page #avatarSvg #shortDreadsCapTexture, body.avatar-page #avatarSvg #buns, body.avatar-page #avatarSvg #mohawk, body.avatar-page #avatarSvg #lineCut{display:none !important;} body.avatar-page #avatarSvg[data-hair-style="bob"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="shoulder"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="waves"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="extraLong"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="bob"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="shoulder"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="waves"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="extraLong"] #hairBack{display:inline !important;} body.avatar-page #avatarSvg[data-hair-style="longDreads"] #dreads, body.avatar-page #avatarSvg[data-hair-style="longDreads"] #dreadsOutline, body.avatar-page #avatarSvg[data-hair-style="braids"] #braids, body.avatar-page #avatarSvg[data-hair-style="braids"] #braidsOutline, body.avatar-page #avatarSvg[data-hair-style="buns"] #buns, body.avatar-page #avatarSvg[data-hair-style="mohawk"] #mohawk, body.avatar-page #avatarSvg[data-hair-style="lineCut"] #lineCut{display:inline !important;} body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreads, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsOutline, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsBack, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsBackOutline, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsCap, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsCapTexture{display:inline !important;} /* Kimball: smaller and visibly above the floor line. */ body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"]{ top:72% !important; transform:translate(-50%,-50%) scale(.78) !important; transform-origin:50% 100% !important; z-index:390 !important; } body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .room-floor-item-v061{width:96px !important;height:160px !important;} body.gg-salon-room-v206 .v305-kimball-machine{width:82px !important;height:150px !important;} /* v311 standalone Studio Cut */ .gg-studio-cut-v311{position:fixed;inset:0;z-index:2147483647;background:rgba(7,5,8,.68);backdrop-filter:blur(6px);display:grid;place-items:center;padding:12px;color:#fff;font-family:Inter,system-ui,sans-serif;} .gg-v311-shell{width:min(1120px,98vw);height:min(790px,96dvh);border:1px solid rgba(229,190,82,.48);border-radius:22px;background:linear-gradient(160deg,#151015,#08080b);box-shadow:0 24px 80px #000;overflow:hidden;display:flex;flex-direction:column;} .gg-v311-shell>header{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:14px 17px;border-bottom:1px solid rgba(255,255,255,.08)} .gg-v311-shell header small{color:#e7c76e;letter-spacing:.14em;font-weight:900}.gg-v311-shell header h2{margin:2px 0;font-family:Georgia,serif;color:#ffe6a1}.gg-v311-shell header p{margin:3px 0;color:#cfc5cf;font-size:12px}.gg-v311-shell header button{width:38px;height:38px;border-radius:50%;border:1px solid #ffffff22;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;font-size:23px;} .gg-v311-main{display:grid;grid-template-columns:1.35fr .85fr;gap:12px;padding:12px;min-height:0;flex:1}.gg-v311-left,.gg-v311-right{border:1px solid #ffffff16;border-radius:16px;background:#ffffff06;overflow:hidden;display:flex;flex-direction:column;min-height:0}.gg-v311-title{display:flex;justify-content:space-between;padding:9px 11px;border-bottom:1px solid #ffffff12}.gg-v311-title b{color:#edd17d;font-size:11px;letter-spacing:.1em}.gg-v311-title span{font-size:10px;color:#aaa0aa}.gg-v311-left-host,.gg-v311-right-host{min-height:230px;display:grid;place-items:center;overflow:hidden}.gg-v311-avatar-stack{position:relative;width:min(100%,320px);aspect-ratio:1/1}.gg-v311-avatar-stack>svg{position:absolute;inset:0;width:100%;height:100%}.gg-v311-avatar-stack>svg:not(.gg-v311-hair){transform:scale(1.32) translateY(7%);transform-origin:center 45%}.gg-v311-hair{z-index:5;pointer-events:none}.gg-v311-editor{padding:10px;overflow:auto}.gg-v311-editor>div{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:9px}.gg-v311-editor>div>b{width:100%;color:#e9ca70;font-size:10px;letter-spacing:.1em}.gg-v311-editor button{border:1px solid #ffffff18;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:8px;padding:6px 8px;font-size:10px;font-weight:800;}.gg-v311-editor button.selected{border-color:#e6bf59;background:#d8ad3422;color:#ffe6a1}.gg-v311-editor button.sw{width:25px;height:25px;border-radius:50%;padding:0;background:var(--c)}.gg-v311-score{text-align:center;padding:10px}.gg-v311-score strong{display:block;font-size:25px;color:#ffe29a}.gg-v311-score span{font-size:10px;color:#aaa}.gg-v311-meter{height:9px;border-radius:999px;background:#ffffff12;margin-top:6px;overflow:hidden}.gg-v311-meter i{display:block;height:100%;background:linear-gradient(90deg,#97701f,#f1cb68,#fff0ae)}.gg-v311-finish{margin:auto 12px 12px;border:1px solid #e3bc55;border-radius:11px;padding:11px;background:linear-gradient(#d9b34a,#99721c);font-weight:1000;color:#170e03}.gg-v311-done{margin:auto;text-align:center;padding:25px}.gg-v311-done>b{font-size:34px;color:#ffe09a}.gg-v311-done h3{font-family:Georgia,serif;font-size:28px}.gg-v311-done button{padding:10px 22px;border-radius:10px;border:1px solid #e5bd56;background:#c89b2f;font-weight:900} @media(max-width:820px){.gg-studio-cut-v311{padding:0}.gg-v311-shell{width:100vw;height:100dvh;border-radius:0}.gg-v311-main{grid-template-columns:1fr;overflow:auto}.gg-v311-left-host,.gg-v311-right-host{min-height:190px}.gg-v311-avatar-stack{width:min(100%,230px)}} /* ========================================================== v312 — final Avatar Studio hair visuals repair ========================================================== */ body.avatar-page #avatarSvg #ggHairFinalV312{ display:inline !important; pointer-events:none !important; filter:drop-shadow(0 2px 1px rgba(0,0,0,.16)) drop-shadow(0 5px 5px rgba(0,0,0,.10)); } body.avatar-page #avatarSvg[data-hair-style="none"] #ggHairFinalV312, body.avatar-page #avatarSvg[data-hair-style="bald"] #ggHairFinalV312{ display:none !important; } body.avatar-page #avatarSvg #ggHairFinalV312 path, body.avatar-page #avatarSvg #ggHairFinalV312 circle{ vector-effect:non-scaling-stroke; shape-rendering:geometricPrecision; } body.avatar-page #avatarSvg #hairFront, body.avatar-page #avatarSvg #hairBack, body.avatar-page #avatarSvg #backHairLayer, body.avatar-page #avatarSvg #dreads, body.avatar-page #avatarSvg #dreadsOutline, body.avatar-page #avatarSvg #braids, body.avatar-page #avatarSvg #braidsOutline, body.avatar-page #avatarSvg #shortDreads, body.avatar-page #avatarSvg #shortDreadsOutline, body.avatar-page #avatarSvg #shortDreadsBack, body.avatar-page #avatarSvg #shortDreadsBackOutline, body.avatar-page #avatarSvg #shortDreadsCap, body.avatar-page #avatarSvg #shortDreadsCapTexture, body.avatar-page #avatarSvg #buns, body.avatar-page #avatarSvg #mohawk, body.avatar-page #avatarSvg #lineCut, body.avatar-page #avatarSvg #ggGeneratedHairV286, body.avatar-page #avatarSvg #ggHairRebuiltV310{ display:none !important; } /* ========================================================== v313 — Goldie scene / Studio Cut / Kimball layout refinement ========================================================== */ /* Smaller Goldie's salon window scene, slightly lower on the wall. */ body.gg-salon-room-v206 #roomSceneWindowV055{ top:19% !important; width:27% !important; max-width:270px !important; min-width:150px !important; aspect-ratio:.88 !important; } body.gg-salon-room-v206 #roomSceneVisualV055{inset:8px !important;} /* Kimball: smaller and higher, still behind chair. */ body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"]{ top:64% !important; transform:translate(-50%,-50%) scale(.64) !important; transform-origin:50% 100% !important; z-index:390 !important; } body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .room-floor-item-v061{ width:82px !important; height:138px !important; } body.gg-salon-room-v206 .v305-kimball-machine{ width:72px !important; height:132px !important; } /* Studio Cut — compact, face-focused layout with less dead space. */ .gg-v311-shell{ width:min(980px,96vw) !important; height:min(680px,92dvh) !important; } .gg-v311-shell>header{ padding:10px 14px !important; min-height:58px !important; } .gg-v311-shell header h2{font-size:22px !important;line-height:1.05 !important;} .gg-v311-shell header p{font-size:11px !important;line-height:1.25 !important;max-width:680px !important;} .gg-v311-main{ grid-template-columns:1.08fr .92fr !important; gap:8px !important; padding:8px !important; } .gg-v311-left,.gg-v311-right{border-radius:13px !important;} .gg-v311-title{ padding:6px 9px !important; min-height:34px !important; align-items:center !important; } .gg-v311-title b{font-size:10px !important;} .gg-v311-title span{font-size:9px !important;} .gg-v311-left-host,.gg-v311-right-host{ min-height:168px !important; height:168px !important; padding:0 !important; align-content:start !important; place-items:start center !important; } .gg-v311-avatar-stack{ width:246px !important; height:168px !important; aspect-ratio:auto !important; overflow:hidden !important; } /* Zoom toward head/face so the customer is readable. */ .gg-v311-avatar-stack>svg:not(.gg-v311-hair){ transform:scale(1.72) translateY(13%) !important; transform-origin:center 33% !important; } .gg-v311-avatar-stack>.gg-v311-hair{ transform:scale(1.20) translateY(-2%) !important; transform-origin:center 25% !important; } .gg-v311-editor{ padding:7px 8px !important; overflow:auto !important; } .gg-v311-editor>div{gap:5px !important;margin-bottom:6px !important;} .gg-v311-editor>div>b{font-size:9px !important;} .gg-v311-editor button{padding:5px 7px !important;font-size:9px !important;} .gg-v311-editor button.sw{width:22px !important;height:22px !important;} .gg-v311-score{padding:6px 9px !important;} .gg-v311-score strong{font-size:22px !important;} .gg-v311-finish{margin:6px 10px 10px !important;padding:9px !important;} /* Hide the copied client's original hair so Studio Cut's work/target hair is authoritative. */ .gg-v311-avatar-stack>svg:not(.gg-v311-hair) :is( #hairLayer,#backHairLayer,#hairFront,#hairBack,#dreads,#dreadsOutline, #braids,#braidsOutline,#shortDreads,#shortDreadsOutline,#shortDreadsBack, #shortDreadsBackOutline,#shortDreadsCap,#shortDreadsCapTexture,#buns,#mohawk, #lineCut,#ggGeneratedHairV286,#ggHairRebuiltV310,#ggHairFinalV312 ){display:none !important;} @media(max-width:820px){ .gg-v311-shell{height:100dvh !important;width:100vw !important;} .gg-v311-main{grid-template-columns:1fr 1fr !important;grid-template-rows:auto 1fr !important;overflow:auto !important;} .gg-v311-left,.gg-v311-right{min-width:0 !important;} .gg-v311-left-host,.gg-v311-right-host{height:150px !important;min-height:150px !important;} .gg-v311-avatar-stack{width:210px !important;height:150px !important;} .gg-v311-editor{max-height:250px !important;} } /* ========================================================== v314 — Studio Cut face focus, finishing brushes, stable Kimball ========================================================== */ /* Make both Studio Cut preview boxes much tighter at the top. */ .gg-v311-title{padding:4px 8px !important;min-height:27px !important;} .gg-v311-left-host,.gg-v311-right-host{ height:138px !important; min-height:138px !important; padding:0 !important; overflow:hidden !important; display:grid !important; place-items:start center !important; } .gg-v311-avatar-stack{ width:230px !important; height:144px !important; margin-top:-24px !important; overflow:visible !important; position:relative !important; } .gg-v311-avatar-stack>svg:not(.gg-v311-hair){ transform:translateY(-24px) scale(1.96) !important; transform-origin:center 24% !important; } .gg-v311-avatar-stack>.gg-v311-hair{ transform:translateY(-17px) scale(1.35) !important; transform-origin:center 22% !important; } .gg-v311-editor{padding:5px 7px !important;} .gg-v311-editor>div{margin-bottom:4px !important;} .gg-v314-tools{display:flex !important;align-items:center !important;gap:5px !important;flex-wrap:wrap !important;border-top:1px solid rgba(255,255,255,.08);padding-top:6px !important;margin-top:4px !important;} .gg-v314-tools>b{font-size:9px;color:#f0d57d;letter-spacing:.08em;text-transform:uppercase;} .gg-v314-tools small{flex-basis:100%;font-size:8px;color:#a99daf;} .gg-v314-tools button.selected{border-color:#f1cf6b !important;box-shadow:0 0 0 1px rgba(241,207,107,.32),0 0 12px rgba(241,207,107,.15) !important;color:#fff0ad !important;} .gg-v314-hair-shine>.gg-v311-hair{filter:drop-shadow(0 0 5px rgba(255,245,184,.55)) brightness(1.12) saturate(1.08);} .gg-v314-shine-burst{position:absolute;left:62%;top:24%;font-style:normal;font-size:18px;color:#fff3a8;text-shadow:0 0 10px rgba(255,230,120,.8);animation:ggV314Spark 1.2s ease-in-out infinite;pointer-events:none;z-index:20;} .gg-v314-face-stars{position:absolute;left:35%;top:37%;width:42%;height:28%;pointer-events:none;z-index:21;} .gg-v314-face-stars b{position:absolute;color:#fff2c4;font-size:13px;text-shadow:0 0 9px rgba(255,238,178,.8);animation:ggV314Spark 1.35s ease-in-out infinite;} .gg-v314-face-stars b:nth-child(1){left:4%;top:30%;}.gg-v314-face-stars b:nth-child(2){right:4%;top:8%;animation-delay:.35s}.gg-v314-face-stars b:nth-child(3){right:20%;bottom:0;animation-delay:.7s} @keyframes ggV314Spark{0%,100%{opacity:.35;transform:scale(.72) rotate(-8deg)}50%{opacity:1;transform:scale(1.12) rotate(8deg)}} /* Kimball: preserve current visual size and move only horizontally. Slightly lower than v313. */ body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"], body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v314{ top:68% !important; bottom:auto !important; transform:translate(-50%,-50%) !important; z-index:390 !important; } body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .room-floor-item-v061, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099 .room-floor-item-v061{ width:82px !important;height:138px !important;transform:none !important; } body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .v305-kimball-machine, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099 .v305-kimball-machine{ width:72px !important;height:132px !important;transform:scale(.64) !important;transform-origin:50% 100% !important; } /* Avatar Studio final hair must always be visibly stacked above the face. */ body.avatar-page #avatarSvg #ggHairFinalV312{display:inline !important;visibility:visible !important;opacity:1 !important;} body.avatar-page #avatarSvg[data-hair-style="none"] #ggHairFinalV312, body.avatar-page #avatarSvg[data-hair-style="bald"] #ggHairFinalV312{display:none !important;} /* ========================================================== v315 — Goldie's Salon sizing/readability + native Avatar Studio hair ========================================================== */ /* Salon chair slightly smaller, preserving seat geometry and upgrade styling. */ body.gg-salon-room-v206 .gg-salon-chair-side-v230{ transform:scale(.86) !important; transform-origin:50% 100% !important; z-index:500 !important; } /* User avatar messages: readable size, no giant pop animation. */ body.gg-salon-room-v206 .gg-avatar-dialog-v243{ max-width:min(285px,78vw) !important; padding:10px 14px !important; font-size:14px !important; line-height:1.35 !important; transform:translate(-50%,-100%) scale(1) !important; transition:opacity .16s ease !important; } body.gg-salon-room-v206 .gg-avatar-dialog-v243.show{ transform:translate(-50%,-100%) scale(1) !important; } /* Scene window: roughly half the previous height, a little lower. */ body.gg-salon-room-v206 #roomSceneWindowV055{ top:23% !important; width:24% !important; max-width:235px !important; min-width:140px !important; height:122px !important; aspect-ratio:auto !important; } body.gg-salon-room-v206 #roomSceneVisualV055{ inset:7px !important; } @media(max-width:720px){ body.gg-salon-room-v206 #roomSceneWindowV055{width:31% !important;min-width:125px !important;height:104px !important;top:24% !important;} } /* Studio Cut: almost no dead top space; emphasize face/hair. */ .gg-v311-title{ padding:2px 7px !important; min-height:22px !important; line-height:1 !important; } .gg-v311-title b{line-height:1 !important;margin:0 !important;} .gg-v311-title span{line-height:1 !important;margin:0 !important;} .gg-v311-left-host,.gg-v311-right-host{ height:124px !important; min-height:124px !important; padding:0 !important; overflow:hidden !important; align-content:start !important; place-items:start center !important; } .gg-v311-avatar-stack{ width:236px !important; height:138px !important; margin-top:-48px !important; overflow:visible !important; } .gg-v311-avatar-stack>svg:not(.gg-v311-hair){ transform:translateY(-35px) scale(2.20) !important; transform-origin:center 20% !important; } .gg-v311-avatar-stack>.gg-v311-hair{ transform:translateY(-30px) scale(1.50) !important; transform-origin:center 19% !important; } .gg-v311-editor{padding:4px 6px !important;} .gg-v314-tools{padding-top:5px !important;margin-top:2px !important;} /* Kimball always stays behind salon chair, including while dragging. */ body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"], body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v314{ z-index:380 !important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230{z-index:500 !important;} /* Avatar Studio native hair is the final visible system. */ body.avatar-page #avatarSvg #ggHairFinalV312, body.avatar-page #avatarSvg #ggHairRebuiltV310, body.avatar-page #avatarSvg #ggGeneratedHairV286{display:none !important;visibility:hidden !important;opacity:0 !important;} body.avatar-page #avatarSvg #hairFront{display:inline !important;visibility:visible !important;opacity:1 !important;} body.avatar-page #avatarSvg[data-hair-style="none"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="bald"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="mohawk"] #hairFront, body.avatar-page #avatarSvg[data-hair-style="lineCut"] #hairFront{display:none !important;} body.avatar-page #avatarSvg #backHairLayer, body.avatar-page #avatarSvg #hairBack, body.avatar-page #avatarSvg #dreads, body.avatar-page #avatarSvg #dreadsOutline, body.avatar-page #avatarSvg #braids, body.avatar-page #avatarSvg #braidsOutline, body.avatar-page #avatarSvg #shortDreads, body.avatar-page #avatarSvg #shortDreadsOutline, body.avatar-page #avatarSvg #shortDreadsBack, body.avatar-page #avatarSvg #shortDreadsBackOutline, body.avatar-page #avatarSvg #shortDreadsCap, body.avatar-page #avatarSvg #shortDreadsCapTexture, body.avatar-page #avatarSvg #buns, body.avatar-page #avatarSvg #mohawk, body.avatar-page #avatarSvg #lineCut{display:none !important;visibility:hidden !important;opacity:0 !important;} body.avatar-page #avatarSvg[data-hair-style="bob"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="shoulder"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="waves"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="extraLong"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="bob"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="shoulder"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="waves"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="extraLong"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="longDreads"] #dreads, body.avatar-page #avatarSvg[data-hair-style="longDreads"] #dreadsOutline, body.avatar-page #avatarSvg[data-hair-style="braids"] #braids, body.avatar-page #avatarSvg[data-hair-style="braids"] #braidsOutline, body.avatar-page #avatarSvg[data-hair-style="buns"] #buns, body.avatar-page #avatarSvg[data-hair-style="mohawk"] #mohawk, body.avatar-page #avatarSvg[data-hair-style="lineCut"] #lineCut, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreads, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsOutline, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsBack, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsBackOutline, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsCap, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #shortDreadsCapTexture{ display:inline !important;visibility:visible !important;opacity:1 !important; } /* ========================================================== v316 — Avatar Studio native hair parent-layer correction Long dreads and braids live inside #backHairLayer. Keep that parent visible while hiding only the generic #hairBack sheet. ========================================================== */ body.avatar-page #avatarSvg[data-hair-style="longDreads"] #backHairLayer, body.avatar-page #avatarSvg[data-hair-style="braids"] #backHairLayer{ display:inline !important; visibility:visible !important; opacity:1 !important; } body.avatar-page #avatarSvg[data-hair-style="longDreads"] #hairBack, body.avatar-page #avatarSvg[data-hair-style="braids"] #hairBack{ display:none !important; visibility:hidden !important; opacity:0 !important; } body.avatar-page #avatarSvg[data-hair-style="longDreads"] #dreads, body.avatar-page #avatarSvg[data-hair-style="longDreads"] #dreadsOutline, body.avatar-page #avatarSvg[data-hair-style="braids"] #braids, body.avatar-page #avatarSvg[data-hair-style="braids"] #braidsOutline{ display:inline !important; visibility:visible !important; opacity:1 !important; } /* ========================================================== v317 — Kimball single-axis origin lock One drag owner only: X moves, Y/scale/origin stay identical. ========================================================== */ body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"], body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v314{ top:68% !important; bottom:auto !important; transform:translate(-50%,-50%) !important; transform-origin:50% 50% !important; z-index:380 !important; } body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .room-floor-item-v061, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v314 .room-floor-item-v061{ width:82px !important; height:138px !important; transform:none !important; transform-origin:50% 100% !important; } body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .v305-kimball-machine, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v314 .v305-kimball-machine{ width:72px !important; height:132px !important; transform:scale(.64) !important; transform-origin:50% 100% !important; } /* ========================================================== v318 — Studio Cut screenshot-driven layout + target/tools repair ========================================================== */ /* Global site CSS has section{padding:85px 0}; cancel it inside Studio Cut. */ #ggSalonStudioCutV311 .gg-v311-left, #ggSalonStudioCutV311 .gg-v311-right{ padding:0 !important; margin:0 !important; justify-content:flex-start !important; } #ggSalonStudioCutV311 .gg-v311-title{ margin:0 !important; padding:7px 10px 6px !important; min-height:30px !important; flex:0 0 auto !important; border-bottom:1px solid rgba(255,255,255,.08) !important; } #ggSalonStudioCutV311 .gg-v311-left-host, #ggSalonStudioCutV311 .gg-v311-right-host{ margin:0 !important; height:166px !important; min-height:166px !important; flex:0 0 166px !important; overflow:hidden !important; display:grid !important; place-items:start center !important; } /* Put more of the head/face in-frame while preserving the hairline. */ #ggSalonStudioCutV311 .gg-v311-avatar-stack{ width:250px !important; height:170px !important; margin-top:-24px !important; overflow:visible !important; } #ggSalonStudioCutV311 .gg-v311-avatar-stack>svg:not(.gg-v311-hair){ transform:translateY(-22px) scale(2.32) !important; transform-origin:center 22% !important; } #ggSalonStudioCutV311 .gg-v311-avatar-stack>.gg-v311-hair{ transform:translateY(-15px) scale(1.56) !important; transform-origin:center 21% !important; z-index:8 !important; } #ggSalonStudioCutV311 .gg-v311-editor{ padding:7px 9px 9px !important; } #ggSalonStudioCutV311 .gg-v318-tools{ display:flex !important; flex-wrap:wrap !important; align-items:center !important; gap:6px !important; padding:7px 0 0 !important; margin:5px 0 0 !important; border-top:1px solid rgba(255,255,255,.08) !important; } #ggSalonStudioCutV311 .gg-v318-tools>b{ width:100% !important; color:#e9ca70 !important; font-size:10px !important; letter-spacing:.08em !important; } #ggSalonStudioCutV311 .gg-v318-tools small{ width:100% !important; font-size:8px !important; color:#aaa0aa !important; } #ggSalonStudioCutV311 .gg-v318-tools button{ display:inline-flex !important; align-items:center !important; justify-content:center !important; } @media(max-width:820px){ #ggSalonStudioCutV311 .gg-v311-title{padding:6px 9px 5px !important;min-height:28px !important;} #ggSalonStudioCutV311 .gg-v311-left-host, #ggSalonStudioCutV311 .gg-v311-right-host{height:158px !important;min-height:158px !important;flex-basis:158px !important;} #ggSalonStudioCutV311 .gg-v311-avatar-stack{width:238px !important;height:164px !important;margin-top:-22px !important;} #ggSalonStudioCutV311 .gg-v311-avatar-stack>svg:not(.gg-v311-hair){transform:translateY(-20px) scale(2.28) !important;} #ggSalonStudioCutV311 .gg-v311-avatar-stack>.gg-v311-hair{transform:translateY(-14px) scale(1.52) !important;} } /* ========================================================== v319 — Avatar Studio isolated native-hair snapshot preview ========================================================== */ body.avatar-page #avatarSvg #ggAvatarStudioHairV319{ display:inline !important; visibility:visible !important; opacity:1 !important; pointer-events:none !important; filter:drop-shadow(0 2px 1px rgba(0,0,0,.16)); } body.avatar-page #avatarSvg[data-hair-style="none"] #ggAvatarStudioHairV319, body.avatar-page #avatarSvg[data-hair-style="bald"] #ggAvatarStudioHairV319{display:none !important;} /* Native source layers stay hidden after they have been snapshotted, so only one hairstyle is ever painted in Avatar Studio. */ body.avatar-page #avatarSvg #hairFront, body.avatar-page #avatarSvg #hairBack, body.avatar-page #avatarSvg #backHairLayer, body.avatar-page #avatarSvg #dreads, body.avatar-page #avatarSvg #dreadsOutline, body.avatar-page #avatarSvg #braids, body.avatar-page #avatarSvg #braidsOutline, body.avatar-page #avatarSvg #shortDreads, body.avatar-page #avatarSvg #shortDreadsOutline, body.avatar-page #avatarSvg #shortDreadsBack, body.avatar-page #avatarSvg #shortDreadsBackOutline, body.avatar-page #avatarSvg #shortDreadsCap, body.avatar-page #avatarSvg #shortDreadsCapTexture, body.avatar-page #avatarSvg #buns, body.avatar-page #avatarSvg #mohawk, body.avatar-page #avatarSvg #lineCut, body.avatar-page #avatarSvg #ggGeneratedHairV286, body.avatar-page #avatarSvg #ggHairRebuiltV310, body.avatar-page #avatarSvg #ggHairFinalV312{ display:none !important; } /* ========================================================== v320 — Studio Cut persistent finish brushes + softer face zoom + Kimball permanent behind-chair layer ========================================================== */ /* Zoom out just enough to show more head/face without losing detail. */ #ggSalonStudioCutV311 .gg-v311-avatar-stack>svg:not(.gg-v311-hair){ transform:translateY(-13px) scale(2.02) !important; transform-origin:center 25% !important; } #ggSalonStudioCutV311 .gg-v311-avatar-stack>.gg-v311-hair{ transform:translateY(-10px) scale(1.40) !important; transform-origin:center 23% !important; } @media(max-width:820px){ #ggSalonStudioCutV311 .gg-v311-avatar-stack>svg:not(.gg-v311-hair){transform:translateY(-12px) scale(1.98) !important;} #ggSalonStudioCutV311 .gg-v311-avatar-stack>.gg-v311-hair{transform:translateY(-9px) scale(1.37) !important;} } /* Brush effects are rendered by Studio Cut itself and persist across re-renders. */ #ggSalonStudioCutV311 .gg-v320-hair-shine>.gg-v311-hair{ filter:drop-shadow(0 0 7px rgba(255,245,184,.78)) brightness(1.2) saturate(1.12) !important; } #ggSalonStudioCutV311 .gg-v320-shine-burst{ position:absolute;left:61%;top:18%;z-index:50;pointer-events:none;font-style:normal; color:#fff5ae;font-size:22px;text-shadow:0 0 5px #fff,0 0 13px rgba(255,221,91,.95); animation:ggV320FinishSpark 1.05s ease-in-out infinite; } #ggSalonStudioCutV311 .gg-v320-face-stars{ position:absolute;left:31%;top:34%;width:44%;height:32%;z-index:51;pointer-events:none; } #ggSalonStudioCutV311 .gg-v320-face-stars b{position:absolute;color:#fff4c9;font-size:16px;text-shadow:0 0 5px #fff,0 0 11px rgba(255,226,130,.85);animation:ggV320FinishSpark 1.15s ease-in-out infinite;} #ggSalonStudioCutV311 .gg-v320-face-stars b:nth-child(1){left:3%;top:28%;} #ggSalonStudioCutV311 .gg-v320-face-stars b:nth-child(2){right:2%;top:8%;animation-delay:.3s;} #ggSalonStudioCutV311 .gg-v320-face-stars b:nth-child(3){right:22%;bottom:0;animation-delay:.6s;} @keyframes ggV320FinishSpark{0%,100%{opacity:.45;transform:scale(.75) rotate(-8deg)}50%{opacity:1;transform:scale(1.18) rotate(9deg)}} /* Kimball can NEVER jump in front of the salon chair during/after movement. */ body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"], body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v314{ z-index:180 !important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230{z-index:600 !important;} body.gg-salon-room-v206 #ggSalonClientV230{z-index:700 !important;} /* ========================================================== v321 — Clean Hair System Rebuild ========================================================== */ #ggHairSystemV321Rear, #ggHairSystemV321Front{ display:inline; pointer-events:none; } #ggHairSystemV321Rear path, #ggHairSystemV321Front path, #ggHairSystemV321Rear circle, #ggHairSystemV321Front circle{ vector-effect:non-scaling-stroke; shape-rendering:geometricPrecision; } body.avatar-page #ggHairSystemV321Front{ filter:drop-shadow(0 2px 1px rgba(0,0,0,.12)); } body.avatar-page #ggHairSystemV321Rear{ opacity:1; } body.avatar-page #hairLayer, body.avatar-page #hairFront, body.avatar-page #hairBack, body.avatar-page #backHairLayer, body.avatar-page #dreads, body.avatar-page #dreadsOutline, body.avatar-page #braids, body.avatar-page #braidsOutline, body.avatar-page #shortDreads, body.avatar-page #shortDreadsOutline, body.avatar-page #shortDreadsBack, body.avatar-page #shortDreadsBackOutline, body.avatar-page #shortDreadsCap, body.avatar-page #shortDreadsCapTexture, body.avatar-page #buns, body.avatar-page #mohawk, body.avatar-page #lineCut, body.avatar-page #ggGeneratedHairV286, body.avatar-page #ggHairRebuiltV310, body.avatar-page #ggHairFinalV312{ display:none !important; } /* ========================================================== v322 — Hair Polish Pass ========================================================== */ #ggHairSystemV321Front .gg-hair-main, #ggHairSystemV321Rear .gg-hair-rear, #ggHairSystemV321Rear .gg-dread-fill, #ggHairSystemV321Rear .gg-braid-fill, #ggHairSystemV321Front .gg-dread-fill, #ggHairSystemV321Front .gg-braid-fill{ filter:drop-shadow(0 1px 0 rgba(255,255,255,.06)); } #ggHairSystemV321Front .gg-hair-shine, #ggHairSystemV321Rear .gg-hair-shine, #ggHairSystemV321Rear .gg-dread-shine, #ggHairSystemV321Front .gg-dread-shine, #ggHairSystemV321Rear .gg-braid-shine, #ggHairSystemV321Rear .gg-hair-wave-detail, #ggHairSystemV321Front .gg-hair-wave-detail{ mix-blend-mode:screen; } #ggHairSystemV321Front .gg-hair-shine-fill{ opacity:.38; } body.avatar-page #ggHairSystemV321Front, body.avatar-page #ggHairSystemV321Rear{ transition:opacity .18s ease, filter .18s ease; } body.avatar-page #ggHairSystemV321Front{ filter:drop-shadow(0 2px 1px rgba(0,0,0,.12)) drop-shadow(0 5px 8px rgba(0,0,0,.08)); } body.avatar-page #ggHairSystemV321Rear{ filter:drop-shadow(0 2px 5px rgba(0,0,0,.05)); } body.avatar-page #avatarSvg[data-gg-hair-polish="soft"] #ggHairSystemV321Front{ filter:drop-shadow(0 2px 1px rgba(0,0,0,.11)) drop-shadow(0 4px 6px rgba(0,0,0,.06)); } /* ========================================================== v323 — Extended rebuilt-hair texture + silhouette polish ========================================================== */ #ggHairSystemV321Rear .gg-dread-outline, #ggHairSystemV321Front .gg-dread-outline{ filter:drop-shadow(0 1px 1px rgba(0,0,0,.18)); } #ggHairSystemV321Rear .gg-dread-shine, #ggHairSystemV321Front .gg-dread-shine{ opacity:.34; } #ggHairSystemV321Rear .gg-loc-band-v323{ mix-blend-mode:screen; } #ggHairSystemV321Front .gg-curtain-part-v323{ opacity:.7; } #ggHairSystemV321Front .gg-pony-tie-v323{ filter:drop-shadow(0 2px 2px rgba(0,0,0,.16)); } body.avatar-page #avatarSvg[data-hair-style="taperLocs"] #ggHairSystemV321Rear, body.avatar-page #avatarSvg[data-hair-style="longDreads"] #ggHairSystemV321Rear, body.avatar-page #avatarSvg[data-hair-style="shortDreads"] #ggHairSystemV321Front{ filter:drop-shadow(0 3px 4px rgba(0,0,0,.08)); } body.avatar-page #avatarSvg[data-hair-style="wolfCut"] #ggHairSystemV321Rear, body.avatar-page #avatarSvg[data-hair-style="curtainFlow"] #ggHairSystemV321Rear, body.avatar-page #avatarSvg[data-hair-style="highPony"] #ggHairSystemV321Rear{ filter:drop-shadow(0 4px 7px rgba(0,0,0,.08)); } /* ========================================================== v324 — Single-owner Avatar Studio hair + Kimball layer lock ========================================================== */ body.avatar-page #avatarSvg #ggHairV324Rear, body.avatar-page #avatarSvg #ggHairV324Front{ display:inline; visibility:visible; opacity:1; pointer-events:none; } body.avatar-page #avatarSvg #ggHairV324Rear path, body.avatar-page #avatarSvg #ggHairV324Front path, body.avatar-page #avatarSvg #ggHairV324Rear circle, body.avatar-page #avatarSvg #ggHairV324Front circle{ vector-effect:non-scaling-stroke; shape-rendering:geometricPrecision; } body.avatar-page #avatarSvg #ggHairV324Front{ filter:drop-shadow(0 2px 1px rgba(0,0,0,.12)) drop-shadow(0 5px 7px rgba(0,0,0,.07)); } body.avatar-page #avatarSvg #hairLayer, body.avatar-page #avatarSvg #hairFront, body.avatar-page #avatarSvg #hairBack, body.avatar-page #avatarSvg #backHairLayer, body.avatar-page #avatarSvg #dreads, body.avatar-page #avatarSvg #dreadsOutline, body.avatar-page #avatarSvg #braids, body.avatar-page #avatarSvg #braidsOutline, body.avatar-page #avatarSvg #shortDreads, body.avatar-page #avatarSvg #shortDreadsOutline, body.avatar-page #avatarSvg #shortDreadsBack, body.avatar-page #avatarSvg #shortDreadsBackOutline, body.avatar-page #avatarSvg #shortDreadsCap, body.avatar-page #avatarSvg #shortDreadsCapTexture, body.avatar-page #avatarSvg #buns, body.avatar-page #avatarSvg #mohawk, body.avatar-page #avatarSvg #lineCut, body.avatar-page #avatarSvg #ggGeneratedHairV286, body.avatar-page #avatarSvg #ggHairRebuiltV310, body.avatar-page #avatarSvg #ggHairFinalV312, body.avatar-page #avatarSvg #ggAvatarStudioHairV319, body.avatar-page #avatarSvg #ggHairSystemV321Rear, body.avatar-page #avatarSvg #ggHairSystemV321Front{ display:none !important; visibility:hidden !important; opacity:0 !important; } /* Kimball never becomes a foreground object, even during/after drag. */ body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"], body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v086, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v314{ z-index:120 !important; isolation:auto !important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230{z-index:500 !important;} body.gg-salon-room-v206 #ggSalonClientV230{z-index:620 !important;} /* v325 — isolated Avatar Studio hair renderer */ body.avatar-page #avatarSvg #ggHairV325Rear, body.avatar-page #avatarSvg #ggHairV325Front{ display:inline !important; visibility:visible !important; opacity:1 !important; pointer-events:none !important; } body.avatar-page #avatarSvg #ggHairV325Rear path, body.avatar-page #avatarSvg #ggHairV325Front path, body.avatar-page #avatarSvg #ggHairV325Rear circle, body.avatar-page #avatarSvg #ggHairV325Front circle{ vector-effect:non-scaling-stroke; shape-rendering:geometricPrecision; } body.avatar-page #avatarSvg[data-hair-style="none"] #ggHairV325Rear, body.avatar-page #avatarSvg[data-hair-style="none"] #ggHairV325Front, body.avatar-page #avatarSvg[data-hair-style="bald"] #ggHairV325Rear, body.avatar-page #avatarSvg[data-hair-style="bald"] #ggHairV325Front{display:none !important;} /* ========================================================== v327 — definitive rear-hair / Studio Cut / Kimball layering ========================================================== */ body.avatar-page #avatarSvg #ggHairV326Rear{display:inline!important;visibility:visible!important;opacity:1!important;} body.avatar-page #avatarSvg #bodyLayer, body.avatar-page #avatarSvg #pantsLayer, body.avatar-page #avatarSvg #shoesLayer, body.avatar-page #avatarSvg #shirtLayer, body.avatar-page #avatarSvg #wizardBodyLayerV159, body.avatar-page #avatarSvg #wizardFrontLayerV159, body.avatar-page #avatarSvg #capeBackLayerV141, body.avatar-page #avatarSvg #capeFrontLayerV141, body.avatar-page #avatarSvg #wardrobeExtraLayer{position:relative;} body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"], body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v086, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v314{z-index:40!important;isolation:auto!important;} body.gg-salon-room-v206 .gg-salon-chair-side-v230{z-index:500!important;} body.gg-salon-room-v206 #ggSalonClientV230{z-index:620!important;} .gg-studio-cut-v327{position:fixed;inset:0;z-index:2147483600;background:rgba(6,6,9,.96);overflow:auto;color:#eee;} .gg-v327-shell{min-height:100%;max-width:900px;margin:auto;border:1px solid rgba(215,176,91,.55);background:#0b0b0f;} .gg-v327-shell>header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:22px 24px 18px;border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;background:rgba(11,11,15,.97);z-index:3;} .gg-v327-shell>header small{font-weight:900;letter-spacing:.18em;color:#e5c66d}.gg-v327-shell>header h2{font:800 34px/1.05 Georgia,serif;color:#ffe398;margin:4px 0}.gg-v327-shell>header p{margin:0;color:#c9c3c8}.gg-v327-shell>header button{width:48px;height:48px;border-radius:50%;font-size:30px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid #443b49;color:#181818;} .gg-v327-main{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:14px;} .gg-v327-main>section{padding:10px!important;margin:0!important;min-width:0;border:1px solid #332e36;border-radius:18px;background:#111015;} .gg-v327-title{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 2px 8px;margin:0!important;min-height:0!important}.gg-v327-title b{font-size:13px;letter-spacing:.13em;color:#efd16e}.gg-v327-title span{font-size:12px;color:#aaa2aa} .gg-v327-preview{height:270px;overflow:hidden;position:relative;border-radius:12px;background:#0c0b10;display:flex;align-items:flex-start;justify-content:center;} .gg-v327-cut-avatar{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:flex-start;overflow:hidden}.gg-v327-cut-avatar>svg{width:128%;height:auto;max-width:none;transform:translateY(-58px);transform-origin:top center;} .gg-v327-editor{padding:10px 2px 4px}.gg-v327-editor>b{display:block;color:#e8c96b;font-size:12px;margin:8px 0 5px}.gg-v327-editor>.row{display:flex;gap:7px;flex-wrap:wrap}.gg-v327-editor button{border:1px solid #3e3743;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:10px;padding:8px 10px;font-weight:800;font-size:12px;}.gg-v327-editor button.selected{border-color:#e5bf55;box-shadow:0 0 0 2px rgba(229,191,85,.18);color:#ffe99d}.gg-v327-editor .colors button{width:34px;height:34px;padding:0;border-radius:50%;background:var(--c)}.gg-v327-editor small{display:block;color:#908a91;font-size:10px;margin-top:6px} .gg-v327-score{display:grid;gap:8px;text-align:center;padding:14px}.gg-v327-score strong{font-size:31px;color:#f4d66f}.gg-v327-score span{font-size:12px;color:#aaa3aa}.gg-v327-meter{height:10px;background:#242129;border-radius:999px;overflow:hidden}.gg-v327-meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,#c99421,#ffe683);transition:width .2s ease} .gg-v327-finish{width:100%;border:1px solid #ffe084;background:linear-gradient(#efcb59,#ae7d13);color:#120e05;font-weight:900;border-radius:15px;padding:14px;margin-top:5px}.gg-v327-done{grid-column:1/-1;text-align:center;padding:70px 20px}.gg-v327-done>b{font-size:38px;color:#f4d66f}.gg-v327-done button{padding:12px 24px;border-radius:12px;background:#e7bf50;border:0;font-weight:900} .gg-v327-hair-shine{position:absolute;left:62%;top:15%;font-style:normal;color:#fff7ba;font-size:30px;filter:drop-shadow(0 0 8px #fff1a5);animation:ggV327Shine 1.2s ease-in-out infinite alternate}.gg-v327-face-stars{position:absolute;inset:24% 20% auto;display:flex;justify-content:space-between;color:#fff3c0;filter:drop-shadow(0 0 6px #fff4b3);pointer-events:none}.gg-v327-face-stars b:nth-child(2){transform:translateY(50px)} @keyframes ggV327Shine{from{opacity:.45;transform:scale(.85) rotate(-10deg)}to{opacity:1;transform:scale(1.15) rotate(8deg)}} @media(max-width:680px){.gg-v327-main{grid-template-columns:1fr 1fr;gap:8px;padding:8px}.gg-v327-main>section{padding:7px!important}.gg-v327-preview{height:230px}.gg-v327-cut-avatar>svg{width:140%;transform:translateY(-55px)}.gg-v327-editor button{font-size:11px;padding:7px 8px}.gg-v327-shell>header{padding:16px}.gg-v327-shell>header h2{font-size:28px}} /* ========================================================== v328 — Rebuilt hair visibility/layer polish ========================================================== */ #ggHairV326Rear,#ggHairV326Front{pointer-events:none!important;} #ggHairV326Front .gg-fire-hair-v328{transform-box:fill-box;transform-origin:50% 100%;animation:ggFireHairPulseV328 1.15s ease-in-out infinite alternate;} #ggHairV326Front .gg-fire-flicker-v328{transform-box:fill-box;transform-origin:50% 100%;animation:ggFireFlickerV328 .82s ease-in-out infinite alternate;} #ggHairV326Front .gg-fire-flicker-v328.f2{animation-delay:-.27s;animation-duration:.68s;} #ggHairV326Front .gg-fire-flicker-v328.f3{animation-delay:-.46s;animation-duration:.95s;} @keyframes ggFireHairPulseV328{0%{transform:translateY(1px) scaleY(.985)}100%{transform:translateY(-2px) scaleY(1.025)}} @keyframes ggFireFlickerV328{0%{transform:translateY(2px) scale(.92,1);opacity:.48}100%{transform:translateY(-4px) scale(1.08,1.14);opacity:.9}} /* ========================================================== v331 — Avatar hair polish / Rat's Nest / stronger studio brush FX / final Kimball lock ========================================================== */ #ggHairV324Front .gg-v331-bald-glow,#ggHairV326Front .gg-v331-bald-glow{transform-box:fill-box;transform-origin:50% 50%;animation:ggV331BaldGlow 1.8s ease-in-out infinite alternate;pointer-events:none} @keyframes ggV331BaldGlow{0%{opacity:.38;transform:translateY(1px) scale(.96)}100%{opacity:.98;transform:translateY(-2px) scale(1.04)}} #ggHairV324Front .gg-v331-fire-hair,#ggHairV326Front .gg-v331-fire-hair{transform-box:fill-box;transform-origin:50% 100%;animation:ggV331FireHair 1s ease-in-out infinite alternate} #ggHairV324Front .gg-v331-fire-flicker,#ggHairV326Front .gg-v331-fire-flicker{transform-box:fill-box;transform-origin:50% 100%;animation:ggV331FireFlicker .8s ease-in-out infinite alternate} #ggHairV324Front .gg-v331-fire-flicker.f2,#ggHairV326Front .gg-v331-fire-flicker.f2{animation-delay:-.28s} #ggHairV324Front .gg-v331-fire-flicker.f3,#ggHairV326Front .gg-v331-fire-flicker.f3{animation-delay:-.5s;animation-duration:.95s} @keyframes ggV331FireHair{0%{transform:translateY(1px) scaleY(.985)}100%{transform:translateY(-2px) scaleY(1.03)}} @keyframes ggV331FireFlicker{0%{transform:translateY(2px) scale(.92,1);opacity:.48}100%{transform:translateY(-4px) scale(1.08,1.15);opacity:.92}} #ggHairV324Front .gg-v331-ratsnest .gg-v331-rat,#ggHairV326Front .gg-v331-ratsnest .gg-v331-rat{opacity:.08;transform-box:fill-box;transform-origin:center center;animation:ggV331RatPeek 6s ease-in-out infinite} #ggHairV324Front .gg-v331-ratsnest .rat1,#ggHairV326Front .gg-v331-ratsnest .rat1{animation-delay:0s} #ggHairV324Front .gg-v331-ratsnest .rat2,#ggHairV326Front .gg-v331-ratsnest .rat2{animation-delay:2.7s} @keyframes ggV331RatPeek{0%,12%,100%{opacity:.04;transform:translateY(10px) scale(.8)}20%,38%{opacity:1;transform:translateY(0) scale(1)}46%,60%{opacity:.2;transform:translateY(8px) scale(.9)}} .gg-v327-cut-avatar.hair-brushed>svg{filter:drop-shadow(0 0 16px rgba(255,229,138,.48)) saturate(1.08)} .gg-v327-cut-avatar.face-brushed>svg{filter:drop-shadow(0 0 12px rgba(255,239,177,.34)) brightness(1.03)} .gg-v327-hair-shine{left:58%;top:12%;font-size:34px;filter:drop-shadow(0 0 10px #fff5b0) drop-shadow(0 0 22px rgba(255,233,131,.5));animation:ggV331BrushShine 1s ease-in-out infinite alternate} .gg-v327-face-stars{inset:18% 16% auto;filter:drop-shadow(0 0 8px #fff5b0) drop-shadow(0 0 18px rgba(255,240,170,.45))} .gg-v327-face-stars b:nth-child(1){animation:ggV331StarTwinkle .9s ease-in-out infinite alternate} .gg-v327-face-stars b:nth-child(2){transform:translateY(38px);animation:ggV331StarTwinkle 1.15s ease-in-out infinite alternate .18s} .gg-v327-face-stars b:nth-child(3){animation:ggV331StarTwinkle .95s ease-in-out infinite alternate .32s} @keyframes ggV331BrushShine{0%{opacity:.45;transform:scale(.8) rotate(-12deg)}100%{opacity:1;transform:scale(1.18) rotate(10deg)}} @keyframes ggV331StarTwinkle{0%{opacity:.35;transform:scale(.84)}100%{opacity:1;transform:scale(1.15)}} body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"], body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v086, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v314{left:var(--gg-kimball-left,72%)!important;top:68%!important;bottom:auto!important;transform:translate(-50%,-50%)!important;z-index:40!important;isolation:auto!important} body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .room-floor-item-v061{width:92px!important;height:150px!important;display:grid!important;place-items:end center!important} body.gg-salon-room-v206 .v305-kimball-machine{width:78px!important;height:144px!important} body.gg-salon-room-v206 .gg-salon-chair-side-v230{z-index:500!important} /* ========================================================== v332 — Grim / Goldie floating portfolio switcher top-layer lock Keeps the page switch buttons above Goldie portfolio content. ========================================================== */ body .floating-portfolios{ position:fixed!important; right:18px!important; top:50%!important; left:auto!important; bottom:auto!important; transform:translate3d(0,-50%,0)!important; z-index:2147482500!important; isolation:isolate!important; pointer-events:auto!important; visibility:visible!important; opacity:1!important; } body .floating-portfolios .float-choice{ position:relative!important; z-index:1!important; pointer-events:auto!important; visibility:visible!important; opacity:1!important; -webkit-transform:translateZ(0); transform:translateZ(0); } body .floating-portfolios .float-choice:hover{ transform:translate3d(-4px,0,0)!important; } @media(max-width:680px){ body .floating-portfolios{ right:8px!important; max-width:92px!important; } body .floating-portfolios .float-choice{ min-width:78px!important; padding:10px 12px!important; } } /* ========================================================== v333 — bottom-center portfolio switcher + Goldie salon polish ========================================================== */ body .floating-portfolios{ position:fixed!important; left:50%!important; right:auto!important; top:auto!important; bottom:max(14px,env(safe-area-inset-bottom))!important; transform:translateX(-50%)!important; z-index:2147482500!important; display:flex!important; flex-direction:row!important; align-items:center!important; justify-content:center!important; gap:8px!important; max-width:none!important; isolation:isolate!important; pointer-events:auto!important; } body .floating-portfolios .float-choice{ min-width:78px!important; padding:10px 14px!important; position:relative!important; z-index:1!important; } body .floating-portfolios .float-choice:hover{transform:translateY(-2px)!important;} /* Goldie's salon scene window: shorter and lower on the wall. */ body.gg-salon-room-v206 #roomSceneWindowV055{ top:28%!important; height:88px!important; width:24%!important; max-width:230px!important; min-width:132px!important; aspect-ratio:auto!important; } body.gg-salon-room-v206 #roomSceneVisualV055{inset:6px!important;} @media(max-width:720px){ body.gg-salon-room-v206 #roomSceneWindowV055{ top:30%!important; height:74px!important; width:29%!important; min-width:120px!important; } } /* Kimball has one stable size from the first frame through drag. */ body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"], body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v086, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v314, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v333{ top:68%!important; bottom:auto!important; transform:translate(-50%,-50%)!important; transform-origin:50% 50%!important; scale:1!important; z-index:32!important; isolation:auto!important; } body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .room-floor-item-v061{ width:78px!important; height:128px!important; transform:none!important; scale:1!important; display:grid!important; place-items:end center!important; } body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .v305-kimball-machine, body.gg-salon-room-v206 .v305-kimball-machine{ width:66px!important; height:124px!important; transform-origin:center bottom!important; } body.gg-salon-room-v206 .gg-salon-chair-side-v230{z-index:500!important;} /* v333 hair animation/polish */ #ggHairV326Front .gg-v333-bald-shine{transform-box:fill-box;transform-origin:center;animation:ggV333BaldShine 1.9s ease-in-out infinite alternate;} @keyframes ggV333BaldShine{from{opacity:.35;transform:translateY(2px) scale(.94)}to{opacity:1;transform:translateY(-2px) scale(1.06)}} #ggHairV326Front .gg-v333-rat{transform-box:fill-box;transform-origin:center bottom;opacity:.05;animation:ggV333RatPeek 6.8s ease-in-out infinite;} #ggHairV326Front .gg-v333-rat.r2{animation-delay:2.4s}.gg-v333-rat.r3{animation-delay:4.5s} @keyframes ggV333RatPeek{0%,13%,100%{opacity:.04;transform:translateY(16px) scale(.82)}20%,34%{opacity:1;transform:translateY(0) scale(1)}43%,55%{opacity:.12;transform:translateY(13px) scale(.88)}} #ggHairV326Front .gg-v333-bird{transform-box:fill-box;transform-origin:center bottom;animation:ggV333BirdPeek 7.2s ease-in-out infinite;} #ggHairV326Front .gg-v333-bird.b2{animation-delay:2.7s}.gg-v333-bird.b3{animation-delay:4.9s} #ggHairV326Front .gg-v333-wing{transform-box:fill-box;transform-origin:center;animation:ggV333Wing .34s ease-in-out infinite alternate;} @keyframes ggV333BirdPeek{0%,14%,100%{opacity:.08;transform:translateY(12px) rotate(0deg)}21%,38%{opacity:1;transform:translateY(0) rotate(-2deg)}30%{transform:translateY(-2px) rotate(4deg)}48%,58%{opacity:.12;transform:translateY(11px)}} @keyframes ggV333Wing{from{transform:rotate(-10deg)}to{transform:rotate(12deg)}} /* Stronger Studio Cut finish effects. */ .gg-v327-cut-avatar.hair-brushed:after{ content:"";position:absolute;left:17%;right:17%;top:10%;height:40%;pointer-events:none; background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.06) 35%,rgba(255,245,177,.62) 49%,rgba(255,255,255,.08) 61%,transparent 78%); mix-blend-mode:screen;filter:blur(1px);animation:ggV333HairSweep 1.45s ease-in-out infinite; } .gg-v327-cut-avatar.face-brushed:before{ content:"";position:absolute;left:27%;right:27%;top:30%;height:30%;border-radius:50%;pointer-events:none; box-shadow:0 0 26px rgba(255,236,156,.42),inset 0 0 18px rgba(255,255,255,.18); animation:ggV333FaceGlow 1.35s ease-in-out infinite alternate; } @keyframes ggV333HairSweep{0%{transform:translateX(-55%) skewX(-14deg);opacity:0}25%{opacity:.92}70%{opacity:.68}100%{transform:translateX(55%) skewX(-14deg);opacity:0}} @keyframes ggV333FaceGlow{from{opacity:.4;transform:scale(.96)}to{opacity:1;transform:scale(1.04)}} .gg-v327-face-stars{font-size:24px!important;inset:20% 12% auto!important;} .gg-v327-hair-shine{font-size:38px!important;left:60%!important;top:10%!important;} /* ========================================================== v334 — Unified Stability + Claw Machine polish ========================================================== */ /* Portfolio switcher: bottom-center and above every gallery/card layer. */ body .floating-portfolios{position:fixed!important;left:50%!important;right:auto!important;top:auto!important;bottom:max(14px,env(safe-area-inset-bottom))!important;transform:translateX(-50%)!important;z-index:2147483000!important;display:flex!important;flex-direction:row!important;gap:8px!important;isolation:isolate!important;pointer-events:auto!important} body .floating-portfolios .float-choice{position:relative!important;z-index:1!important;min-width:78px!important;padding:10px 14px!important} /* Goldie's salon scene stays compact and visually lower on the wall. */ body.gg-salon-room-v206 #roomSceneWindowV055{top:30%!important;height:82px!important;width:24%!important;max-width:220px!important;min-width:128px!important} /* Canonical Kimball dimensions from first paint onward. */ body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"], body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v099, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].dragging-v086, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v314, body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"].gg-kimball-drag-v333{top:68%!important;bottom:auto!important;transform:translate(-50%,-50%)!important;transform-origin:50% 50%!important;scale:1!important;z-index:24!important;isolation:auto!important} body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .room-floor-item-v061{width:86px!important;height:146px!important;transform:none!important;scale:1!important;display:grid!important;place-items:end center!important} body.gg-salon-room-v206 #roomFloorDecorV061[data-item="kimball"] .v305-kimball-machine{width:74px!important;height:138px!important;transform:none!important;scale:1!important} body.gg-salon-room-v206 .gg-salon-chair-side-v230{z-index:500!important} body.gg-salon-room-v206 #ggSalonClientV230{z-index:620!important} /* Studio Cut: more obvious brush finish and compact face framing. */ .gg-v327-preview{height:250px!important} .gg-v327-cut-avatar>svg{width:122%!important;transform:translateY(-46px)!important} .gg-v327-cut-avatar.hair-brushed::after{content:"";position:absolute;left:20%;right:20%;top:12%;height:34%;border-radius:50%;background:linear-gradient(115deg,transparent 15%,rgba(255,255,255,.12) 34%,rgba(255,246,181,.8) 46%,rgba(255,255,255,.18) 55%,transparent 72%);filter:blur(1px) drop-shadow(0 0 12px rgba(255,232,133,.55));animation:ggV334HairSweep 1.45s ease-in-out infinite;pointer-events:none} .gg-v327-cut-avatar.face-brushed::before{content:"✦ ✧ ✦";position:absolute;left:27%;right:27%;top:35%;z-index:20;color:#fff6bd;font-size:26px;letter-spacing:18px;text-align:center;text-shadow:0 0 8px #fff6bd,0 0 18px rgba(255,216,96,.7);animation:ggV334FaceGlow 1.1s ease-in-out infinite alternate;pointer-events:none} @keyframes ggV334HairSweep{0%{transform:translateX(-28px) rotate(-8deg);opacity:.35}50%{opacity:1}100%{transform:translateX(30px) rotate(8deg);opacity:.42}} @keyframes ggV334FaceGlow{from{opacity:.45;transform:scale(.9)}to{opacity:1;transform:scale(1.12)}} /* Claw machine room decor can visually sit higher without getting clipped. */ #roomFloorDecorV061[data-item="claw"]{overflow:visible!important} #roomFloorDecorV061[data-item="claw"] .room-floor-item-v061{overflow:visible!important} .v131-claw-machine{filter:drop-shadow(0 10px 14px rgba(0,0,0,.3)) drop-shadow(0 0 8px rgba(215,176,91,.15));} /* v334 Character Claw mini-game */ .gg-claw-game-v131.gg-claw-v334{background:radial-gradient(circle at 50% 25%,rgba(96,63,122,.25),rgba(5,4,8,.94) 62%)!important;backdrop-filter:blur(9px)} .gg-claw-card-v334{width:min(94vw,660px)!important;border:1px solid rgba(230,194,96,.35)!important;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important;box-shadow:0 28px 80px rgba(0,0,0,.58),0 0 40px rgba(215,176,91,.08)!important;color:#181818;} .gg-claw-card-v334 header p{margin:3px 0 9px;color:#aaa1af;font-size:11px} .gg-claw-hud-v334{grid-template-columns:repeat(5,1fr)!important} .gg-claw-hud-v334 span{background:linear-gradient(180deg,#1e1825,#120f16)!important;border:1px solid #302736!important} .gg-claw-hud-v334 span:nth-child(3) b{color:#ffe07a}.gg-claw-hud-v334 span:nth-child(4) b{color:#dfb64d} .gg-claw-stage-v334{height:390px!important;border:2px solid #413149!important;background:linear-gradient(180deg,#291c31 0%,#15111a 52%,#0a090d 100%)!important;box-shadow:inset 0 0 40px rgba(0,0,0,.7),inset 0 0 0 7px rgba(255,255,255,.025),0 0 24px rgba(215,176,91,.1)!important;overflow:hidden} .gg-claw-backwall-v334{position:absolute;inset:0 0 auto;height:88px;display:flex;align-items:center;justify-content:center;gap:18px;font:900 13px/1 Inter,sans-serif;letter-spacing:.22em;color:#75657d;opacity:.7}.gg-claw-backwall-v334 i{color:#d7b05b;font-style:normal;font-size:24px}.gg-claw-backwall-v334 strong{color:#b59042} .gg-claw-stage-v334 .gg-claw-rail-v131{top:30px;height:9px;background:linear-gradient(#e5e1dc,#817e83);box-shadow:0 4px 0 #39363b,0 0 9px rgba(255,255,255,.16)} .gg-claw-carriage-v334{position:absolute;left:50%;top:22px;width:54px;height:205px;transform:translateX(-50%);transition:left .045s linear;z-index:12;pointer-events:none} .gg-claw-carriage-v334 .casing{position:absolute;left:50%;top:0;transform:translateX(-50%);width:48px;height:28px;border-radius:8px;background:linear-gradient(180deg,#d7b05b,#8d6924);border:2px solid #f2d67e;color:#17121a;font:1000 10px/24px Inter,sans-serif;text-align:center;box-shadow:0 3px 0 #5e4518} .gg-claw-carriage-v334 .cable{position:absolute;left:50%;top:28px;width:4px;height:88px;transform:translateX(-50%);background:linear-gradient(90deg,#6a676c,#f1efeb,#666269);border-radius:8px;transition:height .24s ease} .gg-claw-carriage-v334 .claw-head{position:absolute;left:50%;top:109px;width:58px;height:55px;transform:translateX(-50%);transition:top .24s ease} .gg-claw-carriage-v334 .claw-head::before{content:"";position:absolute;left:22px;top:0;width:14px;height:13px;border-radius:6px;background:#d7b05b;border:2px solid #69501f} .gg-claw-carriage-v334 .arm{position:absolute;top:8px;width:4px;height:43px;background:#e8e5df;border-radius:9px;transform-origin:top center}.gg-claw-carriage-v334 .arm.a{left:26px;transform:rotate(0deg)}.gg-claw-carriage-v334 .arm.b{left:25px;transform:rotate(35deg)}.gg-claw-carriage-v334 .arm.c{left:29px;transform:rotate(-35deg)} .gg-claw-carriage-v334.drop .cable{height:210px}.gg-claw-carriage-v334.drop .claw-head{top:230px}.gg-claw-carriage-v334.drop .arm.b{transform:rotate(18deg)}.gg-claw-carriage-v334.drop .arm.c{transform:rotate(-18deg)} .gg-claw-carriage-v334.has-prize .claw-head{filter:drop-shadow(0 0 8px #ffe281)} .gg-claw-prizes-v131{height:170px!important;bottom:23px!important;z-index:4} .gg-claw-prize-v334{width:68px;height:84px!important;padding:0!important;display:flex!important;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;transform:translateX(-50%);animation:ggV334PrizeBob 2s ease-in-out infinite;animation-delay:var(--bob-delay);filter:drop-shadow(0 5px 5px rgba(0,0,0,.5))!important;cursor:default!important} .gg-claw-prize-v334 small{display:block;font:900 7px/1 Inter,sans-serif;letter-spacing:.06em;color:#c8becd;background:#141018aa;padding:3px 5px;border-radius:8px;white-space:nowrap} .gg-claw-prize-v334 .face{position:relative;display:block;width:50px;height:52px;border-radius:42% 42% 48% 48%;border:3px solid #242028;box-shadow:inset 0 -7px 0 rgba(0,0,0,.12),0 0 0 2px rgba(255,255,255,.035)} .gg-claw-prize-v334 .face .eye{position:absolute;top:21px;width:7px;height:9px;border-radius:50%;background:#f6f1df}.gg-claw-prize-v334 .face .eye.l{left:12px}.gg-claw-prize-v334 .face .eye.r{right:12px}.gg-claw-prize-v334 .face .eye::after{content:"";position:absolute;left:2px;top:2px;width:3px;height:4px;border-radius:50%;background:#18151a} .gg-claw-prize-v334 .face .ear{position:absolute;top:5px;width:24px;height:30px;background:inherit;border:3px solid #242028;z-index:-1}.gg-claw-prize-v334 .face .ear.l{left:-17px;clip-path:polygon(100% 20%,0 0,42% 100%)}.gg-claw-prize-v334 .face .ear.r{right:-17px;clip-path:polygon(0 20%,100% 0,58% 100%)} .gg-claw-prize-v334 .grim{background:#34323a}.gg-claw-prize-v334 .grim .mouth{position:absolute;left:18px;bottom:9px;width:14px;height:5px;border-bottom:2px solid #d6c9d3;border-radius:50%} .gg-claw-prize-v334 .goldie{background:#d6ad52}.gg-claw-prize-v334 .goldie .hair{position:absolute;left:4px;right:4px;top:-5px;height:24px;border-radius:50% 50% 35% 35%;background:#f0d889;border:2px solid #8e6d25} .gg-claw-prize-v334 .gremlin{background:#788c58}.gg-claw-prize-v334 .gremlin .fang{position:absolute;left:20px;bottom:5px;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:9px solid #f5efe0} .gg-claw-prize-v334 .bat{background:#393143;height:45px!important;margin-bottom:3px}.gg-claw-prize-v334 .bat .wing{position:absolute;top:8px;width:30px;height:28px;background:#574864;z-index:-1}.gg-claw-prize-v334 .bat .wing.l{left:-24px;clip-path:polygon(100% 0,0 25%,35% 55%,8% 100%,100% 75%)}.gg-claw-prize-v334 .bat .wing.r{right:-24px;clip-path:polygon(0 0,100% 25%,65% 55%,92% 100%,0 75%)} .gg-claw-prize-v334 .moon{background:#d8cf9c;overflow:hidden}.gg-claw-prize-v334 .moon i{position:absolute;left:14px;top:-4px;width:43px;height:53px;border-radius:50%;background:#1a1520}.gg-claw-prize-v334 .crown{background:#a8781c;clip-path:polygon(4% 35%,15% 5%,35% 34%,50% 0,66% 34%,86% 5%,96% 35%,88% 100%,12% 100%);border-radius:0!important}.gg-claw-prize-v334 .crown b{position:absolute;left:17px;top:22px;color:#fff0a8;font:1000 19px/1 Georgia,serif}.gg-claw-prize-v334 .golden{display:grid!important;place-items:center;background:radial-gradient(circle,#fff1a7,#d59b24 60%,#6d4910);color:#261708;font:1000 30px/1 Georgia,serif;border-color:#ffe17c;box-shadow:0 0 18px rgba(255,216,91,.6)} .gg-claw-prize-v334.rare .face{box-shadow:0 0 10px rgba(123,184,255,.35),inset 0 -7px 0 rgba(0,0,0,.12)}.gg-claw-prize-v334.epic .face,.gg-claw-prize-v334.jackpot .face{box-shadow:0 0 14px rgba(255,212,80,.65),inset 0 -7px 0 rgba(0,0,0,.12)} .gg-claw-prize-v334.caught{animation:ggV334Caught .6s cubic-bezier(.2,.8,.2,1) forwards!important}.gg-claw-prize-v334.caught.perfect{filter:drop-shadow(0 0 14px #ffe27c)!important} @keyframes ggV334PrizeBob{0%,100%{margin-bottom:0;rotate:-1deg}50%{margin-bottom:5px;rotate:1deg}}@keyframes ggV334Caught{to{transform:translate(-50%,-195px) scale(.42) rotate(10deg);opacity:0}} .gg-claw-chute-v334{position:absolute;right:18px;bottom:0;width:82px;height:54px;border-radius:14px 14px 0 0;background:linear-gradient(#30233a,#17111d);border:2px solid #5b4764;border-bottom:0;z-index:8;box-shadow:inset 0 7px 14px rgba(0,0,0,.45)}.gg-claw-chute-v334 i{position:absolute;left:14px;right:14px;top:9px;height:22px;border-radius:7px;background:#070609}.gg-claw-chute-v334 span{position:absolute;left:0;right:0;bottom:5px;text-align:center;font:900 7px/1 Inter,sans-serif;letter-spacing:.15em;color:#b99a55} .gg-claw-rarity-v334{display:flex;justify-content:center;gap:8px;margin:8px 0 2px}.gg-claw-rarity-v334 span{font-size:8px;color:#918895;border:1px solid #302836;border-radius:999px;padding:3px 6px}.gg-claw-rarity-v334 span:nth-child(2){color:#94c7ff}.gg-claw-rarity-v334 span:nth-child(3),.gg-claw-rarity-v334 span:nth-child(4){color:#ffe17e} .gg-claw-flash-v334{position:absolute;inset:0;pointer-events:none;z-index:30}.gg-claw-flash-v334 i{position:absolute;left:50%;top:52%;color:#ffe585;font-style:normal;font-size:22px;opacity:0;animation:ggV334Spark .75s ease-out forwards;transform:rotate(calc(var(--i)*40deg)) translateY(-28px)}.gg-claw-flash-v334.jackpot{background:radial-gradient(circle at 50% 55%,rgba(255,225,112,.28),transparent 42%)}.gg-claw-flash-v334.miss i{color:#765f7f}@keyframes ggV334Spark{0%{opacity:0;transform:rotate(calc(var(--i)*40deg)) translateY(-8px) scale(.4)}30%{opacity:1}100%{opacity:0;transform:rotate(calc(var(--i)*40deg)) translateY(-80px) scale(1.2)}} .gg-claw-drop-v131,.gg-claw-start-v131{background:linear-gradient(180deg,#e1bd59,#9b6f1f)!important;color:#171008!important;box-shadow:0 6px 16px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.4)} @media(max-width:680px){.gg-claw-card-v334{width:96vw!important;padding:12px!important}.gg-claw-stage-v334{height:350px!important}.gg-claw-hud-v334{grid-template-columns:repeat(5,1fr)!important;gap:4px!important}.gg-claw-hud-v334 span{padding:5px 2px!important}.gg-claw-hud-v334 b{font-size:14px!important}.gg-claw-prize-v334{scale:.88}} /* ========================================================== v335 — Flaming Halo + Gremlin Grab cosmetic rewards ========================================================== */ .gg-fire-halo-v335{transform-box:fill-box;transform-origin:50% 65%;filter:drop-shadow(0 0 7px rgba(255,89,16,.9)) drop-shadow(0 0 18px rgba(255,174,52,.5));animation:ggFireHaloFloatV335 1.7s ease-in-out infinite alternate} .gg-fire-halo-ring-v335{transform-box:fill-box;transform-origin:center;animation:ggFireHaloRingV335 1.05s ease-in-out infinite alternate} .gg-fire-halo-core-v335{transform-box:fill-box;transform-origin:center;animation:ggFireHaloCoreV335 .8s ease-in-out infinite alternate} .gg-fire-halo-glow-v335{transform-box:fill-box;transform-origin:center;animation:ggFireHaloGlowV335 1.25s ease-in-out infinite alternate} .gg-halo-flames-v335 path{transform-box:fill-box;transform-origin:50% 100%;animation:ggHaloFlameV335 .72s ease-in-out infinite alternate;filter:drop-shadow(0 0 4px #ff6a00)} .gg-halo-flames-v335 .f2{animation-duration:.59s;animation-delay:-.19s}.gg-halo-flames-v335 .f3{animation-duration:.83s;animation-delay:-.42s}.gg-halo-flames-v335 .f4{animation-duration:.66s;animation-delay:-.31s}.gg-halo-flames-v335 .f5{animation-duration:.76s;animation-delay:-.51s}.gg-halo-flames-v335 .f6{animation-duration:.62s;animation-delay:-.27s} .gg-halo-sparks-v335 circle{fill:#ffe7a0;filter:drop-shadow(0 0 4px #ff9f2e);animation:ggHaloSparkV335 1.5s ease-out infinite} .gg-halo-sparks-v335 circle:nth-child(2){animation-delay:-.35s}.gg-halo-sparks-v335 circle:nth-child(3){animation-delay:-.8s}.gg-halo-sparks-v335 circle:nth-child(4){animation-delay:-1.1s} @keyframes ggFireHaloFloatV335{from{transform:translateY(1px) rotate(-.8deg)}to{transform:translateY(-3px) rotate(.8deg)}} @keyframes ggFireHaloRingV335{from{opacity:.78;transform:scale(.985)}to{opacity:1;transform:scale(1.025)}} @keyframes ggFireHaloCoreV335{from{opacity:.55}to{opacity:1}} @keyframes ggFireHaloGlowV335{from{opacity:.2;transform:scale(.94)}to{opacity:.58;transform:scale(1.08)}} @keyframes ggHaloFlameV335{0%{transform:translateY(3px) scale(.9,.86) rotate(-2deg);opacity:.62}100%{transform:translateY(-5px) scale(1.08,1.18) rotate(2deg);opacity:1}} @keyframes ggHaloSparkV335{0%{opacity:0;transform:translateY(7px) scale(.55)}30%{opacity:1}100%{opacity:0;transform:translateY(-20px) scale(1.05)}} .gg-button-eyes-v335{filter:drop-shadow(0 2px 1px rgba(0,0,0,.3))} .gg-barcode-earring-v335{filter:drop-shadow(0 3px 3px rgba(0,0,0,.25));transform-box:fill-box;transform-origin:72px 201px;animation:ggBarcodeSwingV335 1.8s ease-in-out infinite alternate} @keyframes ggBarcodeSwingV335{from{transform:rotate(-3deg)}to{transform:rotate(4deg)}} #roomExtrasLayerV059[data-extra="gremlinStuffy"]{pointer-events:none!important} .gg-gremlin-stuffy-v335{position:absolute;left:68%;bottom:1%;width:118px;height:142px;z-index:44;transform:translateX(-50%);filter:drop-shadow(0 10px 7px rgba(0,0,0,.34));pointer-events:none} .gg-gremlin-stuffy-v335[hidden]{display:none!important} .gg-gremlin-stuffy-v335 svg{display:block;width:100%;height:100%;overflow:visible;transform:scale(1.2) translateY(-12px);transform-origin:50% 100%} .gg-stuffy-avatar-svg-v335{filter:saturate(.78) sepia(.08)} .gg-stuffy-buttons-v335{filter:drop-shadow(0 1px 1px rgba(0,0,0,.35))} .gg-stuffy-fallback-v335{filter:saturate(.85)} @media(max-width:680px){.gg-gremlin-stuffy-v335{width:96px;height:120px;left:72%;bottom:1%}} .gg-fire-halo-v335 .halo-flames{animation:none!important;filter:none!important} /* v336 — Familiar assistant, pet builder, and floating pet icon */ .gg-book-under-header-v235{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap} .gg-familiar-trigger-v336{border:1px solid var(--soft-gold,#c9a24f);background:rgba(18,18,22,.92);color:#f7e2a2;border-radius:999px;cursor:pointer;font-weight:800;box-shadow:0 12px 30px rgba(0,0,0,.35);display:inline-flex;align-items:center;justify-content:center;gap:8px} .gg-familiar-inline-v336{padding:12px 16px;min-height:48px} .gg-familiar-inline-v336 span{font-size:1.2rem} .gg-familiar-fixed-v336{position:fixed;left:calc(50% + 120px);bottom:18px;z-index:55;width:58px;height:58px;font-size:1.45rem;padding:0} .gg-familiar-fixed-v336:hover{transform:translateY(-2px)} body.gg-familiar-open-v336{overflow:hidden} .gg-avatar-switcher-v336{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:8px 0 10px;padding:6px 2px} .gg-avatar-switcher-v336 button{flex:1;border:1px solid rgba(215,176,91,.28);background:#131318;color:#e9dfcb;border-radius:999px;padding:10px 14px;font-weight:800;cursor:pointer} .gg-avatar-switcher-v336 button.active{background:linear-gradient(180deg,#201910,#131318);border-color:rgba(215,176,91,.7);color:#ffd783;box-shadow:0 8px 22px rgba(0,0,0,.28)} #avatarStage{position:relative} .gg-stage-dice-wrap-v336{position:absolute;right:14px;top:12px;z-index:5} .gg-stage-dice-btn-v336{box-shadow:0 10px 24px rgba(0,0,0,.32)} .gg-familiar-preview-v336{position:absolute;inset:0;display:grid;place-items:center;padding-top:8px} .gg-familiar-preview-inner-v336{display:flex;flex-direction:column;align-items:center;gap:8px} .gg-familiar-caption-v336{font-weight:800;letter-spacing:.03em;color:#f5e1a6;text-shadow:0 1px 0 #000} .gg-familiar-builder-v336{margin:16px 0 8px;padding:14px;border-radius:18px;background:linear-gradient(180deg,#15151b,#101015);border:1px solid rgba(255,255,255,.08)} .gg-familiar-builder-head-v336{display:flex;justify-content:space-between;gap:12px;align-items:flex-end;margin-bottom:12px} .gg-familiar-builder-head-v336 strong{font-size:1rem} .gg-familiar-builder-head-v336 small{color:#bcb4a8} .gg-familiar-options-v336{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .gg-familiar-options-v336 button{border:1px solid rgba(255,255,255,.08);background:#16161d;color:#f0eadf;border-radius:16px;padding:14px 12px;display:flex;align-items:center;gap:10px;justify-content:flex-start;cursor:pointer;font-weight:700} .gg-familiar-options-v336 button b{font-size:1.45rem} .gg-familiar-options-v336 button.active{border-color:rgba(215,176,91,.72);box-shadow:0 0 0 2px rgba(215,176,91,.22) inset;background:#1c1813} .gg-familiar-avatar-v336,.gg-familiar-room-avatar-v336{position:relative;width:132px;height:132px;display:grid;place-items:center} .gg-familiar-room-avatar-v336{width:70px;height:70px;transform:scale(.96)} .gg-familiar-avatar-v336 .pet-hover,.gg-familiar-room-avatar-v336 .pet-hover{position:relative;width:100px;height:100px;animation:ggPetHoverV336 2.9s ease-in-out infinite} .gg-familiar-room-avatar-v336 .pet-hover{transform:scale(.7);transform-origin:center} @keyframes ggPetHoverV336{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}} .robot-owl .owl-body{position:absolute;left:24px;top:32px;width:52px;height:48px;border-radius:48% 48% 42% 42%;background:#707891;border:4px solid #222633;box-shadow:inset 0 -10px 0 rgba(255,255,255,.08)} .robot-owl .owl-head{position:absolute;left:22px;top:12px;width:56px;height:44px;border-radius:22px;background:#8f98af;border:4px solid #222633;transform-origin:50% 70%} @keyframes ggPetOwlHeadV336{0%,8%,100%{transform:rotate(0)}40%{transform:rotate(360deg)}} .robot-owl .owl-ear{position:absolute;top:6px;width:16px;height:18px;background:#8f98af;border:4px solid #222633;border-bottom:0;border-radius:14px 14px 0 0} .robot-owl .owl-ear.left{left:22px;transform:rotate(-12deg)} .robot-owl .owl-ear.right{right:22px;transform:rotate(12deg)} .robot-owl .owl-eye{position:absolute;top:13px;width:11px;height:11px;border-radius:50%;background:#9df5ff;box-shadow:0 0 10px #55e7ff} .robot-owl .owl-eye.left{left:12px}.robot-owl .owl-eye.right{right:12px} .robot-owl .owl-beak{position:absolute;left:22px;top:20px;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:10px solid #f8c263} .robot-owl .owl-wing{position:absolute;top:42px;width:18px;height:34px;background:#5f6882;border:4px solid #222633;border-radius:15px} .robot-owl .owl-wing.left{left:12px;transform:rotate(12deg)} .robot-owl .owl-wing.right{right:12px;transform:rotate(-12deg)} .robot-owl .owl-thruster{position:absolute;bottom:4px;width:12px;height:18px;background:#2b2f3f;border-radius:0 0 8px 8px} .robot-owl .owl-thruster.left{left:33px}.robot-owl .owl-thruster.right{right:33px} .robot-owl .owl-thruster::after{content:"";position:absolute;left:1px;top:11px;width:10px;height:18px;background:linear-gradient(180deg,#8ff8ff,#54a6ff,transparent);clip-path:polygon(50% 100%,0 0,100% 0);animation:ggThrusterV336 .25s linear infinite alternate} @keyframes ggThrusterV336{from{transform:scaleY(.8);opacity:.7}to{transform:scaleY(1.2);opacity:1}} .dog-head .dog-face{position:absolute;left:16px;top:20px;width:68px;height:62px;background:#bf8c58;border:4px solid #5d3d21;border-radius:48px} .dog-head .dog-ear{position:absolute;top:15px;width:24px;height:38px;background:#8c5f37;border:4px solid #5d3d21;border-radius:18px 18px 10px 10px} .dog-head .dog-ear.left{left:8px;transform:rotate(-18deg)}.dog-head .dog-ear.right{right:8px;transform:rotate(18deg)} .dog-head .dog-eye,.cat-head .cat-eye,.ghost .ghost-eye{position:absolute;width:8px;height:10px;background:#181818;border-radius:50%} .dog-head .dog-eye.left{left:18px;top:22px}.dog-head .dog-eye.right{right:18px;top:22px} .dog-head .dog-muzzle{position:absolute;left:19px;top:31px;width:30px;height:18px;background:#edd6bc;border-radius:18px} .dog-head .dog-nose{position:absolute;left:30px;top:33px;width:10px;height:8px;background:#1f1816;border-radius:50% 50% 60% 60%} .dog-head .dog-tongue{position:absolute;left:32px;top:46px;width:8px;height:14px;background:#eb7990;border-radius:0 0 8px 8px} .cat-head .cat-face{position:absolute;left:18px;top:18px;width:64px;height:60px;background:#d7be98;border:4px solid #5e503f;border-radius:44px} .cat-head .cat-ear{position:absolute;top:7px;width:22px;height:24px;background:#d7be98;border:4px solid #5e503f;clip-path:polygon(50% 0,0 100%,100% 100%)} .cat-head .cat-ear.left{left:18px}.cat-head .cat-ear.right{right:18px} .cat-head .cat-eye.left{left:19px;top:24px}.cat-head .cat-eye.right{right:19px;top:24px} .cat-head .cat-nose{position:absolute;left:30px;top:36px;width:10px;height:8px;background:#d57a8d;clip-path:polygon(50% 100%,0 0,100% 0)} .cat-head .cat-whiskers{position:absolute;top:39px;width:20px;height:1px;background:#5e503f} .cat-head .cat-whiskers.left{left:2px;box-shadow:0 6px 0 #5e503f,-1px -6px 0 #5e503f}.cat-head .cat-whiskers.right{right:2px;box-shadow:0 6px 0 #5e503f,1px -6px 0 #5e503f} .ghost .ghost-body{position:absolute;left:18px;top:16px;width:64px;height:68px;background:linear-gradient(180deg,#fefefe,#dfe7f4);border:4px solid #7d94b0;border-radius:34px 34px 26px 26px;box-shadow:0 0 18px rgba(212,230,255,.35)} .ghost .ghost-eye.left{left:20px;top:24px}.ghost .ghost-eye.right{right:20px;top:24px}.ghost .ghost-mouth{position:absolute;left:29px;top:42px;width:10px;height:12px;background:#181818;border-radius:50%} .ghost .ghost-tail{position:absolute;bottom:-8px;width:18px;height:18px;background:inherit;border-left:4px solid #7d94b0;border-bottom:4px solid #7d94b0;border-radius:0 0 16px 16px} .ghost .ghost-tail.one{left:4px}.ghost .ghost-tail.two{left:23px}.ghost .ghost-tail.three{right:4px} .gg-familiar-room-host-v336{position:absolute;left:22px;bottom:12px;z-index:65;cursor:pointer;filter:drop-shadow(0 10px 16px rgba(0,0,0,.32))} body.gg-salon-room-v206 .gg-familiar-room-host-v336{left:20px;bottom:16px} .gg-familiar-room-host-v336 .gg-familiar-room-label-v336{display:block;text-align:center;margin-top:-4px;font-size:10px;font-weight:800;color:#f5e1a6;text-shadow:0 1px 0 #000} @media (max-width:720px){ .gg-familiar-fixed-v336{left:auto;right:18px;bottom:18px} .gg-familiar-options-v336{grid-template-columns:1fr} .gg-avatar-switcher-v336{gap:10px} } .gg-familiar-corner-v336{position:fixed;right:18px;bottom:18px;z-index:55;width:56px;height:56px;font-size:1.4rem;padding:0} /* v337 claw machine upgrade */ .gg-claw-card-v334 header p{max-width:340px} .gg-claw-stage-v334{background: radial-gradient(circle at 50% 12%,rgba(255,235,161,.08),transparent 24%), linear-gradient(180deg,#2a1b35 0%,#17111c 45%,#0a090d 100%)!important} .gg-claw-stage-v334::before{content:"";position:absolute;inset:92px 14px 18px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 14%,transparent 86%,rgba(255,255,255,.04));pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)} .gg-claw-stage-v334::after{content:"GRAB • WIN • UNLOCK";position:absolute;left:18px;right:18px;bottom:4px;text-align:center;font:900 10px/1 Inter,sans-serif;letter-spacing:.26em;color:rgba(215,176,91,.34);pointer-events:none} .gg-claw-backwall-v334{height:100px!important;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0));box-shadow:inset 0 -1px 0 rgba(255,255,255,.04)} .gg-claw-backwall-v334 b,.gg-claw-backwall-v334 strong{text-shadow:0 0 12px rgba(215,176,91,.18)} .gg-claw-prizes-v131{height:158px!important;bottom:28px!important} .gg-claw-prize-v334{animation:ggV334PrizeBob 1.75s ease-in-out infinite;transition:left .42s ease,bottom .55s cubic-bezier(.22,.8,.2,1),transform .5s ease,opacity .22s ease;will-change:left,bottom,transform} .gg-claw-prize-v334 small{font-size:8px!important;padding:4px 6px!important;border:1px solid rgba(255,255,255,.06)} @keyframes ggV334PrizeBob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-8px)}} .gg-claw-prize-v334.grabbed{animation:none!important;z-index:24;filter:drop-shadow(0 12px 14px rgba(0,0,0,.45)) drop-shadow(0 0 16px rgba(255,226,129,.22))!important} .gg-claw-prize-v334.glitch-drop{filter:drop-shadow(0 0 12px rgba(255,112,153,.42)) drop-shadow(0 10px 14px rgba(0,0,0,.42))!important} .gg-claw-stage-v334.shake-glitch{animation:ggClawGlitchShakeV337 .48s linear} @keyframes ggClawGlitchShakeV337{0%,100%{transform:translateX(0)}12%{transform:translateX(-8px)}24%{transform:translateX(7px)}36%{transform:translateX(-6px)}48%{transform:translateX(5px)}60%{transform:translateX(-4px)}72%{transform:translateX(3px)}84%{transform:translateX(-2px)}} .gg-claw-flash-v334.catch{background:radial-gradient(circle at 50% 60%,rgba(255,223,125,.13),transparent 40%)} .gg-claw-flash-v334.perfect{background:radial-gradient(circle at 50% 58%,rgba(255,241,173,.18),transparent 38%)} .gg-claw-flash-v334.miss{background:radial-gradient(circle at 50% 58%,rgba(198,99,139,.12),transparent 38%)} .gg-claw-drop-v131{letter-spacing:.08em} /* v338 — silver Familiar paw + load/freeze repair */ .gg-silver-paw-v338{position:relative;display:inline-block;width:25px;height:24px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))} .gg-silver-paw-v338 i,.gg-silver-paw-v338 b{position:absolute;display:block;background:linear-gradient(145deg,#f4f5f6 0%,#c4c8cc 44%,#858b91 100%);border:1px solid #6f757a;box-shadow:inset 1px 1px 1px rgba(255,255,255,.8),0 1px 1px rgba(0,0,0,.35)} .gg-silver-paw-v338 i{width:7px;height:9px;border-radius:55% 55% 48% 48%} .gg-silver-paw-v338 i:nth-child(1){left:1px;top:5px;transform:rotate(-25deg)} .gg-silver-paw-v338 i:nth-child(2){left:6px;top:0} .gg-silver-paw-v338 i:nth-child(3){right:6px;top:0} .gg-silver-paw-v338 i:nth-child(4){right:1px;top:5px;transform:rotate(25deg)} .gg-silver-paw-v338 b{left:5px;bottom:0;width:15px;height:13px;border-radius:56% 56% 48% 48%;transform:rotate(0deg)} .gg-familiar-trigger-v336{color:#d9dcdf!important} .gg-familiar-trigger-v336 strong{color:#d9dcdf} /* ========================================================== v339 Familiar Polish + Stability Guard ========================================================== */ .gg-familiar-trigger-v339{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:999px;border:1px solid #8e949d;background:linear-gradient(180deg,#2b2d32,#16171a);color:#c9ced6;box-shadow:0 8px 24px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.12);cursor:pointer;padding:9px} .gg-familiar-trigger-v339 svg{width:25px;height:25px;filter:drop-shadow(0 1px 1px #000)} .gg-familiar-trigger-v339.inline{margin-left:8px}.gg-familiar-trigger-v339.corner{position:fixed;right:18px;bottom:18px;z-index:2147483000} .gg-familiar-assistant-v339[hidden]{display:none!important}.gg-familiar-assistant-v339{position:fixed;inset:0;z-index:2147483500}.gg-familiar-backdrop-v339{position:absolute;inset:0;background:rgba(3,3,7,.78);backdrop-filter:blur(6px)} .gg-familiar-card-v339{position:relative;width:min(94vw,720px);max-height:86vh;margin:7vh auto 0;padding:18px;border-radius:24px;background:linear-gradient(180deg,#19191f,#0e0e12);border:1px solid rgba(215,176,91,.38);box-shadow:0 26px 90px rgba(0,0,0,.62);color:#f4efe5;display:flex;flex-direction:column;gap:12px} .gg-familiar-card-v339 header{display:flex;align-items:center;gap:12px;padding-right:34px}.gg-familiar-card-v339 header>div:first-child{width:70px;height:70px;display:grid;place-items:center}.gg-familiar-card-v339 header strong{display:block}.gg-familiar-card-v339 header small{display:block;color:#aaa1ae}.gg-familiar-close-v339{position:absolute;right:12px;top:10px;border:0;background:transparent;color:#fff;font-size:28px;cursor:pointer}.gg-familiar-clear-v339{margin-left:auto;border:1px solid #39323d;background:#151218;color:#bdb5c2;border-radius:10px;padding:7px 10px;cursor:pointer} .gg-familiar-suggestions-v339{display:flex;gap:8px;overflow:auto}.gg-familiar-suggestions-v339 button{white-space:nowrap;border:1px solid #38303d;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:999px;padding:7px 10px;cursor:pointer;} .gg-familiar-chat-v339{min-height:250px;max-height:48vh;overflow:auto;padding:12px;border-radius:16px;background:#09090d;border:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;gap:9px}.gg-familiar-chat-v339 .msg{display:flex}.gg-familiar-chat-v339 .msg.user{justify-content:flex-end}.gg-familiar-chat-v339 .msg span{max-width:86%;padding:10px 13px;border-radius:15px;background:#1b1b23;line-height:1.42}.gg-familiar-chat-v339 .msg.user span{background:#d7b05b;color:#15120d} .gg-familiar-typing-v339{display:flex;gap:5px;padding:2px 8px}.gg-familiar-typing-v339[hidden]{display:none}.gg-familiar-typing-v339 i{width:7px;height:7px;border-radius:50%;background:#d7b05b;animation:ggFamDot339 .9s ease-in-out infinite}.gg-familiar-typing-v339 i:nth-child(2){animation-delay:.13s}.gg-familiar-typing-v339 i:nth-child(3){animation-delay:.26s}@keyframes ggFamDot339{0%,100%{transform:translateY(0);opacity:.35}50%{transform:translateY(-5px);opacity:1}} #ggFamiliarFormV339{display:flex;gap:9px}#ggFamiliarFormV339 input{flex:1;min-width:0;border:1px solid #36303a;background:#09090d;color:#fff;border-radius:13px;padding:12px 13px}#ggFamiliarFormV339 button{border:0;border-radius:13px;background:#d7b05b;color:#161109;font-weight:900;padding:0 18px;cursor:pointer}body.gg-familiar-open-v339{overflow:hidden} .gg-avatar-switcher-v339{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0 10px}.gg-avatar-switcher-v339 button{border:1px solid #3a343f;background:#131318;color:#cbc3cc;border-radius:14px;padding:10px 14px;font-weight:900;cursor:pointer}.gg-avatar-switcher-v339 button:first-child{text-align:left}.gg-avatar-switcher-v339 button:last-child{text-align:right}.gg-avatar-switcher-v339 button.active{border-color:#d7b05b;color:#ffe4a2;background:#1d1811} #avatarStage{position:relative}.gg-dice-anchor-v339{position:absolute;right:14px;top:12px;z-index:120}.gg-familiar-preview-v339{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px}.gg-familiar-preview-v339>b{color:#efd799;letter-spacing:.04em} .gg-familiar-builder-v339{margin:14px 0;padding:14px;border-radius:18px;background:#111117;border:1px solid rgba(255,255,255,.08)}.gg-familiar-builder-v339 .pet-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.gg-familiar-builder-v339 .pet-grid button{min-height:154px;border:1px solid #322d35;border-radius:16px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;}.gg-familiar-builder-v339 .pet-grid button.active{border-color:#d7b05b;box-shadow:inset 0 0 0 2px rgba(215,176,91,.2)}.gg-familiar-builder-v339 .skin-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:12px}.gg-familiar-builder-v339 .skin-row button{border:1px solid #39323d;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:999px;padding:7px 10px;cursor:pointer;}.gg-familiar-builder-v339 .skin-row button.active{border-color:#d7b05b;color:#ffe3a1}.gg-familiar-builder-v339 .skin-row button:disabled{opacity:.38;cursor:not-allowed}.skin-note{display:block;margin-top:8px;color:#930a94} .gg-familiar-avatar-v339,.gg-familiar-room-avatar-v339{position:relative;width:128px;height:128px;display:grid;place-items:center}.gg-familiar-room-avatar-v339{width:78px;height:78px}.gg-familiar-avatar-v339 .pet-hover,.gg-familiar-room-avatar-v339 .pet-hover{position:relative;width:100px;height:100px;animation:ggFamHover339 2.7s ease-in-out infinite}@keyframes ggFamHover339{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}} .robot-owl .owl-body{position:absolute;left:24px;top:34px;width:52px;height:46px;border-radius:48%;background:#737d96;border:4px solid #252936}.robot-owl .owl-head{position:absolute;left:22px;top:12px;width:56px;height:44px;border-radius:22px;background:#930bad;border:4px solid #252936;transform-origin:50% 70%}@keyframes ggOwlHead339{0%,12%,100%{transform:rotate(0)}50%{transform:rotate(360deg)}}.robot-owl .owl-ear{position:absolute;top:5px;width:16px;height:18px;background:#930bad;border:4px solid #252936;border-bottom:0;border-radius:12px}.robot-owl .owl-ear.left{left:22px}.robot-owl .owl-ear.right{right:22px}.robot-owl .owl-eye{position:absolute;top:14px;width:10px;height:10px;border-radius:50%;background:#9ff6ff;box-shadow:0 0 9px #61e8ff}.robot-owl .owl-eye.left{left:12px}.robot-owl .owl-eye.right{right:12px}.robot-owl .owl-beak{position:absolute;left:22px;top:24px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:9px solid #f2bd59}.robot-owl .scan{position:absolute;left:4px;right:4px;top:19px;height:2px;background:#9ff6ff;box-shadow:0 0 8px #61e8ff;animation:none}@keyframes ggScan339{0%,100%{transform:translateY(-7px);opacity:.2}50%{transform:translateY(10px);opacity:.9}}.robot-owl .owl-wing{position:absolute;top:45px;width:18px;height:31px;border-radius:14px;background:#5e6882;border:4px solid #252936}.robot-owl .owl-wing.left{left:12px}.robot-owl .owl-wing.right{right:12px}.robot-owl .owl-thruster{position:absolute;bottom:4px;width:12px;height:16px;background:#2c3040}.robot-owl .owl-thruster.left{left:33px}.robot-owl .owl-thruster.right{right:33px}.robot-owl .owl-thruster:after{content:"";position:absolute;top:11px;width:11px;height:20px;background:linear-gradient(#a2f9ff,#5ea9ff,transparent);clip-path:polygon(50% 100%,0 0,100% 0);animation:ggThr339 .25s linear infinite alternate}@keyframes ggThr339{to{transform:scaleY(1.25)}} .dog-head .dog-face{position:absolute;left:16px;top:20px;width:68px;height:62px;background:#bf8c58;border:4px solid #5d3d21;border-radius:48px}.dog-head .dog-ear{position:absolute;top:15px;width:24px;height:38px;background:#8c5f37;border:4px solid #5d3d21;border-radius:18px}.dog-head .dog-ear.left{left:8px;transform:rotate(-18deg)}.dog-head .dog-ear.right{right:8px;transform:rotate(18deg)}.dog-head .dog-eye,.cat-head .cat-eye,.ghost .ghost-eye{position:absolute;width:8px;height:10px;background:#181818;border-radius:50%;animation:ggBlink339 5s infinite}@keyframes ggBlink339{0%,45%,49%,100%{transform:scaleY(1)}47%{transform:scaleY(.08)}}.dog-head .dog-eye.left{left:18px;top:22px}.dog-head .dog-eye.right{right:18px;top:22px}.dog-head .dog-muzzle{position:absolute;left:19px;top:31px;width:30px;height:18px;background:#edd6bc;border-radius:18px}.dog-head .dog-nose{position:absolute;left:30px;top:33px;width:10px;height:8px;background:#1f1816;border-radius:50%}.dog-head .dog-tongue{position:absolute;left:32px;top:46px;width:8px;height:14px;background:#eb7990;border-radius:0 0 8px 8px;animation:ggPant339 .7s ease-in-out infinite alternate}@keyframes ggPant339{to{transform:translateY(3px)}} .cat-head .cat-face{position:absolute;left:18px;top:18px;width:64px;height:60px;background:#d7be98;border:4px solid #5e503f;border-radius:44px}.cat-head .cat-ear{position:absolute;top:7px;width:22px;height:24px;background:#d7be98;border:4px solid #5e503f;clip-path:polygon(50% 0,0 100%,100% 100%);animation:ggEar339 4s ease-in-out infinite}.cat-head .cat-ear.left{left:18px}.cat-head .cat-ear.right{right:18px;animation-delay:.7s}@keyframes ggEar339{0%,88%,100%{transform:rotate(0)}93%{transform:rotate(10deg)}}.cat-head .cat-eye.left{left:19px;top:24px}.cat-head .cat-eye.right{right:19px;top:24px}.cat-head .cat-nose{position:absolute;left:30px;top:36px;width:10px;height:8px;background:#d57a8d;clip-path:polygon(50% 100%,0 0,100% 0)}.cat-head .cat-whiskers{position:absolute;top:42px;width:20px;height:1px;background:#5e503f}.cat-head .cat-whiskers.left{left:2px;box-shadow:0 6px 0 #5e503f,-1px -6px 0 #5e503f}.cat-head .cat-whiskers.right{right:2px;box-shadow:0 6px 0 #5e503f,1px -6px 0 #5e503f} .ghost .ghost-body{position:absolute;left:18px;top:16px;width:64px;height:68px;background:linear-gradient(#fff,#dce7f4);border:4px solid #8096b1;border-radius:34px 34px 26px 26px;box-shadow:0 0 18px rgba(210,230,255,.35);animation:ggGhost339 3.1s ease-in-out infinite}@keyframes ggGhost339{0%,100%{opacity:.7;filter:blur(0)}50%{opacity:1;filter:blur(.4px)}}.ghost .ghost-eye.left{left:20px;top:24px}.ghost .ghost-eye.right{right:20px;top:24px}.ghost .ghost-mouth{position:absolute;left:29px;top:42px;width:10px;height:12px;background:#181818;border-radius:50%}.ghost .ghost-tail{position:absolute;bottom:-8px;width:18px;height:18px;background:#dce7f4;border-left:4px solid #8096b1;border-bottom:4px solid #8096b1;border-radius:0 0 16px 16px}.ghost .ghost-tail.one{left:4px}.ghost .ghost-tail.two{left:23px}.ghost .ghost-tail.three{right:4px} .skin-chrome .owl-body,.skin-chrome .owl-head,.skin-chrome .owl-ear{background:linear-gradient(135deg,#f0f3f6,#6e7885 50%,#dce1e6)}.skin-black .cat-face,.skin-black .cat-ear{background:#26242a;border-color:#0c0b0e}.skin-skeleton .dog-face,.skin-skeleton .dog-ear{background:#dedbd2;border-color:#4b4843}.skin-skeleton .dog-muzzle{background:#c9c5bb}.skin-purple .ghost-body,.skin-purple .ghost-tail{background:linear-gradient(#dcb9ff,#8463b2);border-color:#5a397d;box-shadow:0 0 22px rgba(169,112,255,.5)} .gg-familiar-room-host-v339{position:absolute;transform:translate(-50%,-50%);z-index:64;cursor:grab;touch-action:none;user-select:none;filter:drop-shadow(0 8px 13px rgba(0,0,0,.4))}.gg-familiar-room-host-v339:active{cursor:grabbing}.gg-familiar-room-host-v339>span{display:block;text-align:center;margin-top:-8px;font:900 9px/1 Inter,sans-serif;color:#f0d99b;text-shadow:0 1px 2px #000}.gg-familiar-room-host-v339[hidden]{display:none!important} @media(max-width:680px){.gg-familiar-card-v339{margin-top:4vh}.gg-familiar-builder-v339 .pet-grid{grid-template-columns:1fr 1fr}.gg-familiar-trigger-v339.corner{right:14px;bottom:14px}} .gg-familiar-chat-v339 .msg.bot{align-items:flex-end;gap:7px}.gg-familiar-chat-v339 .bot-portrait{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;overflow:hidden;border-radius:50%;background:#17141b;border:1px solid #39313f}.gg-familiar-chat-v339 .bot-portrait .gg-familiar-avatar-v339{transform:scale(.28);transform-origin:center;width:120px;height:120px} .gg-familiar-trigger-v339.alongside-book{position:fixed;left:calc(50% + 128px);bottom:18px;z-index:2147483000}@media(max-width:680px){.gg-familiar-trigger-v339.alongside-book{left:auto;right:18px;bottom:18px}} /* ========================================================== v340 — Familiar button / Avatar Studio visibility repair ========================================================== */ /* Header Book Now pages: keep the silver paw slightly lower and fully clickable. */ .gg-familiar-trigger-v339.alongside-header-book{ position:fixed!important; left:calc(50% + 92px)!important; top:64px!important; z-index:2147483000!important; width:42px!important; height:42px!important; padding:8px!important; pointer-events:auto!important; transform:none!important; } @media(max-width:640px){ .gg-familiar-trigger-v339.alongside-header-book{top:62px!important;left:calc(50% + 88px)!important} } /* Bottom Book Now pages keep pet and Avatar Room door together. */ body.avatar-page .gg-familiar-trigger-v339.alongside-book{ left:auto!important; right:78px!important; bottom:18px!important; width:52px!important; height:52px!important; z-index:2147483000!important; } body.avatar-page .avatar-room-dock{ right:18px!important; bottom:18px!important; width:52px!important; height:52px!important; z-index:2147483000!important; } @media(max-width:680px){ body.avatar-page .gg-familiar-trigger-v339.alongside-book{right:78px!important;bottom:18px!important} body.avatar-page .avatar-room-dock{right:18px!important;bottom:18px!important} } /* Avatar and Familiar are mutually exclusive inside Avatar Studio. */ body.avatar-page[data-gg-builder-mode="avatar"] #ggFamiliarPreviewV339, body.avatar-page[data-gg-builder-mode="avatar"] #ggFamiliarBuilderV339{display:none!important} body.avatar-page[data-gg-builder-mode="avatar"] #avatarSvg{display:block!important;visibility:visible!important} body.avatar-page[data-gg-builder-mode="familiar"] #avatarSvg{display:none!important;visibility:hidden!important} body.avatar-page[data-gg-builder-mode="familiar"] #ggFamiliarPreviewV339{display:flex!important;visibility:visible!important} .gg-familiar-preview-v339[hidden],.gg-familiar-builder-v339[hidden]{display:none!important} .gg-avatar-switcher-v339{position:relative!important;z-index:4!important;margin-bottom:14px!important} /* Smaller Familiar portrait, tucked into upper-left of assistant header. */ .gg-familiar-card-v339 header{ position:relative!important; min-height:46px!important; align-items:flex-start!important; padding-left:54px!important; padding-top:1px!important; } .gg-familiar-card-v339 header>div:first-child{ position:absolute!important; left:0!important; top:-5px!important; width:44px!important; height:44px!important; overflow:hidden!important; border-radius:50%!important; background:#131217!important; border:1px solid #39313f!important; } #ggFamiliarPortraitV339 .gg-familiar-avatar-v339{ width:128px!important; height:128px!important; transform:scale(.34)!important; transform-origin:center center!important; } #ggFamiliarPortraitV339 .pet-hover{animation-duration:3.2s!important} .gg-familiar-clear-v339{align-self:flex-start!important;margin-top:0!important} /* ========================================================== v341 — Familiar assistant portrait, editable name, guide pets, redesign ========================================================== */ .gg-familiar-card-v339{overflow:hidden} .gg-familiar-close-v339{display:grid!important;place-items:center!important;position:absolute!important;right:12px!important;top:10px!important;width:38px!important;height:38px!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.12)!important;background:rgba(255,255,255,.04)!important;color:#fff!important;font-size:22px!important;line-height:1!important;z-index:5!important;box-shadow:0 6px 18px rgba(0,0,0,.22)!important} .gg-familiar-card-v339 header{padding-left:66px!important;min-height:58px!important;padding-right:84px!important;align-items:center!important} .gg-familiar-card-v339 header>div:first-child{left:2px!important;top:0!important;width:58px!important;height:58px!important;border:1px solid #5b4f5f!important;background:radial-gradient(circle at 50% 35%,rgba(215,176,91,.18),#121217 68%)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),0 6px 18px rgba(0,0,0,.24)!important} #ggFamiliarPortraitV339{display:grid;place-items:center;overflow:hidden} #ggFamiliarPortraitV339 .gg-familiar-avatar-v339{width:128px!important;height:128px!important;transform:scale(.52) translate(-6px,-5px)!important;transform-origin:center center!important} #ggFamiliarPortraitV339 .gg-familiar-room-avatar-v339{transform:scale(.84)!important} .gg-familiar-clear-v339{margin-left:auto!important;margin-right:40px!important} .gg-familiar-preview-v339{justify-content:flex-start!important;padding-top:24px!important;gap:4px!important} .gg-familiar-preview-v339 .gg-familiar-avatar-v339{margin-top:4px} .gg-familiar-preview-v339 small{color:#bdb4be;font-weight:700;letter-spacing:.03em} .gg-familiar-name-btn-v341{border:1px solid rgba(215,176,91,.42);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:999px;padding:8px 14px;font-weight:900;cursor:pointer;box-shadow:0 10px 22px rgba(0,0,0,.22);margin-bottom:3px;} .gg-familiar-name-btn-v341:hover{transform:translateY(-1px)} .gg-familiar-builder-head-v341{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;margin-bottom:10px}.gg-familiar-builder-head-v341 strong{font-size:1rem}.gg-familiar-builder-head-v341 small{color:#aaa1ae} .gg-familiar-guide-host-v341{position:relative} .gg-familiar-guide-btn-v341{position:absolute;right:10px;top:8px;width:44px;height:44px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border-radius:14px;display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 20px rgba(0,0,0,.22);padding:0;overflow:hidden;z-index:2;color:#181818;} .gg-familiar-guide-btn-v341 .gg-familiar-avatar-v339{width:94px;height:94px;transform:scale(.36) translate(-4px,-4px);transform-origin:center center} .gg-familiar-guide-toast-v341{position:fixed;right:18px;bottom:92px;z-index:2147483600;width:min(360px,92vw);background:linear-gradient(180deg,#19191f,#0e0e12);border:1px solid rgba(215,176,91,.42);border-radius:20px;box-shadow:0 26px 70px rgba(0,0,0,.5);padding:14px 16px 14px 16px;color:#f5efe5} .gg-familiar-guide-toast-v341[hidden]{display:none!important}.gg-familiar-guide-toast-v341 .guide-close{position:absolute;right:12px;top:10px;width:30px;height:30px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:#fff;cursor:pointer}.gg-familiar-guide-toast-v341 .guide-top{display:flex;gap:12px;align-items:flex-start;padding-right:28px}.gg-familiar-guide-toast-v341 .guide-pet{width:52px;height:52px;border-radius:50%;background:radial-gradient(circle at 50% 35%,rgba(215,176,91,.18),#121217 70%);display:grid;place-items:center;overflow:hidden;border:1px solid rgba(255,255,255,.08)}.gg-familiar-guide-toast-v341 .guide-pet .gg-familiar-avatar-v339{width:120px;height:120px;transform:scale(.46) translate(-6px,-5px);transform-origin:center}.gg-familiar-guide-toast-v341 strong{display:block;margin-bottom:5px}.gg-familiar-guide-toast-v341 p{margin:0;color:#cfc6d0;line-height:1.45} /* Cuter / more polished familiar art */ .gg-familiar-avatar-v339 .pet-hover,.gg-familiar-room-avatar-v339 .pet-hover{filter:drop-shadow(0 10px 16px rgba(0,0,0,.22))} .pet-blush{position:absolute;width:10px;height:7px;border-radius:999px;background:rgba(255,151,171,.4);filter:blur(.4px)}.pet-blush.left{left:14px;top:30px}.pet-blush.right{right:14px;top:30px} .robot-owl .owl-head{left:20px!important;top:10px!important;width:60px!important;height:48px!important;border-radius:26px!important;background:linear-gradient(180deg,#a5b1c5,#79859b)!important;border:4px solid #283041!important;box-shadow:inset 0 3px 0 rgba(255,255,255,.22)} .robot-owl .owl-body{left:23px!important;top:36px!important;width:54px!important;height:48px!important;border-radius:48% 48% 46% 46%!important;background:linear-gradient(180deg,#7f8ba3,#5d687d)!important;border:4px solid #283041!important} .robot-owl .owl-ear{background:linear-gradient(180deg,#aab4c6,#7e8aa0)!important;border-color:#283041!important}.robot-owl .owl-eye{width:12px!important;height:12px!important;background:#f0ffff!important;box-shadow:0 0 0 3px #67f3ff inset,0 0 12px #61e8ff!important}.robot-owl .owl-eye.left{left:10px!important}.robot-owl .owl-eye.right{right:10px!important}.robot-owl .owl-wing{background:linear-gradient(180deg,#73819b,#5b667d)!important;border-color:#283041!important}.robot-owl .scan{opacity:.85} .dog-head .dog-face{left:15px!important;top:18px!important;width:70px!important;height:64px!important;background:linear-gradient(180deg,#d0a06a,#b47d47)!important;border:4px solid #674226!important;border-radius:50px!important;box-shadow:inset 0 3px 0 rgba(255,255,255,.2)} .dog-head .dog-ear{top:10px!important;width:24px!important;height:40px!important;background:linear-gradient(180deg,#8d643d,#744e2d)!important;border-color:#674226!important}.dog-head .dog-eye{width:10px!important;height:11px!important;background:#171717!important;box-shadow:0 -1px 0 2px rgba(255,255,255,.08) inset}.dog-head .dog-eye.left{left:17px!important;top:22px!important}.dog-head .dog-eye.right{right:17px!important;top:22px!important}.dog-head .dog-muzzle{left:17px!important;top:33px!important;width:36px!important;height:20px!important;background:linear-gradient(180deg,#f2dec9,#dfc5a7)!important}.dog-head .dog-nose{left:31px!important;top:34px!important;width:10px!important;height:8px!important}.dog-head .dog-tongue{left:33px!important;top:48px!important;width:9px!important;height:15px!important} .cat-head .cat-face{left:17px!important;top:17px!important;width:66px!important;height:62px!important;background:linear-gradient(180deg,#e6d1b0,#cfb38c)!important;border:4px solid #6a5944!important;border-radius:46px!important;box-shadow:inset 0 3px 0 rgba(255,255,255,.18)} .cat-head .cat-ear{top:5px!important;width:24px!important;height:26px!important;background:linear-gradient(180deg,#e6d1b0,#cfb38c)!important;border:4px solid #6a5944!important}.cat-head .cat-ear:after{content:"";position:absolute;left:4px;right:4px;bottom:2px;top:6px;clip-path:polygon(50% 0,0 100%,100% 100%);background:#f3b6bf;opacity:.75}.cat-head .cat-eye{width:9px!important;height:12px!important;background:#171717!important}.cat-head .cat-eye.left{left:18px!important}.cat-head .cat-eye.right{right:18px!important}.cat-head .cat-whiskers{opacity:.85} .ghost .ghost-body{left:17px!important;top:15px!important;width:66px!important;height:70px!important;background:linear-gradient(180deg,#ffffff,#e7f0fb)!important;border:4px solid #8aa0ba!important;border-radius:36px 36px 28px 28px!important;box-shadow:0 0 24px rgba(210,230,255,.38)!important}.ghost .ghost-eye{width:8px!important;height:10px!important}.ghost .ghost-mouth{left:28px!important;top:42px!important;width:12px!important;height:10px!important;border-radius:10px 10px 14px 14px!important} .skin-chrome .dog-face,.skin-chrome .cat-face,.skin-chrome .ghost-body{filter:saturate(.8) brightness(1.02)} @media(max-width:680px){.gg-familiar-guide-toast-v341{right:12px;left:12px;bottom:86px;width:auto}.gg-familiar-guide-btn-v341{width:40px;height:40px}} /* ========================================================== v342 — more animated familiar helpers + more pet types ========================================================== */ .gg-familiar-guide-btn-v341{overflow:visible!important} .gg-familiar-guide-btn-v341 .gg-familiar-avatar-v339{animation:ggGuideBuddyFloatV342 2.6s ease-in-out infinite} .gg-familiar-guide-btn-v341:nth-child(odd) .gg-familiar-avatar-v339{animation-duration:2.2s} .gg-familiar-guide-btn-v341:hover .gg-familiar-avatar-v339{animation:ggGuideBuddyExcitedV342 .9s ease-in-out infinite} .gg-familiar-guide-toast-v341 .guide-pet .gg-familiar-avatar-v339{animation:ggGuideBuddyFloatV342 2.8s ease-in-out infinite} @keyframes ggGuideBuddyFloatV342{0%,100%{transform:scale(.46) translate(-6px,-5px)}50%{transform:scale(.49) translate(-6px,-10px)}} @keyframes ggGuideBuddyExcitedV342{0%,100%{transform:scale(.46) translate(-6px,-5px) rotate(0deg)}25%{transform:scale(.50) translate(-5px,-11px) rotate(-4deg)}50%{transform:scale(.48) translate(-6px,-7px) rotate(4deg)}75%{transform:scale(.50) translate(-7px,-11px) rotate(-3deg)}} .pet-grid button:hover .gg-familiar-avatar-v339{transform:scale(1.05)} /* Bat */ .bat-pet .pet-hover{position:absolute;inset:0;animation:ggBatBobV342 2.1s ease-in-out infinite} .bat-pet .bat-body{position:absolute;left:26px;top:20px;width:48px;height:44px;border-radius:26px 26px 20px 20px;background:linear-gradient(180deg,#65517d,#3f304f);border:4px solid #21182c;box-shadow:inset 0 3px 0 rgba(255,255,255,.12)} .bat-pet .bat-wing{position:absolute;top:20px;width:34px;height:26px;background:linear-gradient(180deg,#e3a8bf,#bf7b93);border:4px solid #50384e;clip-path:polygon(0 45%,22% 25%,42% 46%,58% 20%,77% 48%,100% 30%,100% 100%,0 100%);transform-origin:center top} .bat-pet .bat-wing.left{left:0;animation:ggBatWingLV342 .95s ease-in-out infinite} .bat-pet .bat-wing.right{right:0;animation:ggBatWingRV342 .95s ease-in-out infinite} .bat-pet .bat-ear{position:absolute;top:-10px;width:14px;height:16px;background:linear-gradient(180deg,#7a6692,#524064);border:3px solid #21182c;clip-path:polygon(50% 0,0 100%,100% 100%)} .bat-pet .bat-ear.left{left:5px}.bat-pet .bat-ear.right{right:5px} .bat-pet .bat-eye{position:absolute;top:13px;width:8px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px #111 inset}.bat-pet .bat-eye.left{left:12px}.bat-pet .bat-eye.right{right:12px} .bat-pet .bat-nose{position:absolute;left:18px;bottom:9px;width:10px;height:7px;border-radius:50% 50% 60% 60%;background:#241621} @keyframes ggBatBobV342{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}} @keyframes ggBatWingLV342{0%,100%{transform:rotate(10deg)}50%{transform:rotate(-18deg)}} @keyframes ggBatWingRV342{0%,100%{transform:scaleX(-1) rotate(10deg)}50%{transform:scaleX(-1) rotate(-18deg)}} /* Bunny */ .bunny-pet .pet-hover{position:absolute;inset:0;animation:ggBunnyBobV342 2.2s ease-in-out infinite} .bunny-pet .bunny-face{position:absolute;left:18px;top:18px;width:64px;height:58px;border-radius:40px;background:linear-gradient(180deg,#f8f2f6,#e4d7df);border:4px solid #8d7a87;box-shadow:inset 0 3px 0 rgba(255,255,255,.2)} .bunny-pet .bunny-ear{position:absolute;top:-3px;width:18px;height:34px;border-radius:16px 16px 8px 8px;background:linear-gradient(180deg,#f8f2f6,#e4d7df);border:4px solid #8d7a87;transform-origin:center bottom} .bunny-pet .bunny-ear:after{content:"";position:absolute;left:3px;right:3px;top:5px;bottom:4px;border-radius:10px;background:#f0c4d4}.bunny-pet .bunny-ear.left{left:25px;animation:ggBunnyEarLV342 2.4s ease-in-out infinite}.bunny-pet .bunny-ear.right{right:25px;animation:ggBunnyEarRV342 2.4s ease-in-out infinite} .bunny-pet .bunny-eye{position:absolute;top:19px;width:8px;height:10px;border-radius:50%;background:#1d1d1d}.bunny-pet .bunny-eye.left{left:17px}.bunny-pet .bunny-eye.right{right:17px} .bunny-pet .bunny-nose{position:absolute;left:28px;top:28px;width:8px;height:6px;border-radius:50% 50% 70% 70%;background:#c57d8f}.bunny-pet .bunny-mouth{position:absolute;left:28px;top:34px;width:8px;height:9px;border-bottom:3px solid #8d7a87;border-radius:0 0 10px 10px} @keyframes ggBunnyBobV342{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}} @keyframes ggBunnyEarLV342{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(7deg)}} @keyframes ggBunnyEarRV342{0%,100%{transform:rotate(6deg)}50%{transform:rotate(-5deg)}} /* Mini dragon */ .mini-dragon .pet-hover{position:absolute;inset:0;animation:ggDragonBobV342 2.4s ease-in-out infinite} .mini-dragon .dragon-body{position:absolute;left:20px;top:19px;width:60px;height:50px;border-radius:28px;background:linear-gradient(180deg,#76a057,#55773f);border:4px solid #29401b;box-shadow:inset 0 3px 0 rgba(255,255,255,.17)} .mini-dragon .dragon-wing{position:absolute;top:20px;width:24px;height:28px;background:linear-gradient(180deg,#d8b4df,#b882c4);border:4px solid #5a3960;clip-path:polygon(50% 0,0 100%,100% 100%);transform-origin:center bottom} .mini-dragon .dragon-wing.left{left:2px;animation:ggDragonWingLV342 1.1s ease-in-out infinite}.mini-dragon .dragon-wing.right{right:2px;animation:ggDragonWingRV342 1.1s ease-in-out infinite} .mini-dragon .dragon-tail{position:absolute;right:8px;bottom:14px;width:26px;height:16px;border:4px solid #29401b;border-left:none;border-top:none;border-radius:0 0 16px 0;transform:rotate(8deg);animation:ggDragonTailV342 1.8s ease-in-out infinite} .mini-dragon .dragon-horn{position:absolute;top:-8px;width:10px;height:12px;background:#e7d79a;border:2px solid #876c26;clip-path:polygon(50% 0,0 100%,100% 100%)}.mini-dragon .dragon-horn.left{left:11px}.mini-dragon .dragon-horn.right{right:11px} .mini-dragon .dragon-eye{position:absolute;top:15px;width:8px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px #213611 inset}.mini-dragon .dragon-eye.left{left:14px}.mini-dragon .dragon-eye.right{right:14px} .mini-dragon .dragon-snout{position:absolute;left:22px;top:25px;width:16px;height:10px;border-radius:10px;background:#8eb86d;border:2px solid #29401b} .mini-dragon .dragon-flame{position:absolute;left:39px;top:33px;width:8px;height:12px;background:linear-gradient(180deg,#ffe9a8,#ff8a3d);clip-path:polygon(50% 0,20% 35%,0 100%,50% 82%,100% 100%,80% 35%);filter:drop-shadow(0 0 6px rgba(255,144,55,.4));animation:ggDragonFlameV342 .85s ease-in-out infinite} @keyframes ggDragonBobV342{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}} @keyframes ggDragonWingLV342{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(12deg)}} @keyframes ggDragonWingRV342{0%,100%{transform:scaleX(-1) rotate(-8deg)}50%{transform:scaleX(-1) rotate(12deg)}} @keyframes ggDragonTailV342{0%,100%{transform:rotate(8deg)}50%{transform:rotate(26deg)}} @keyframes ggDragonFlameV342{0%,100%{transform:scale(1)}50%{transform:scale(1.22)}} /* Extra cute motion for existing pets */ .dog-head .pet-hover{animation:ggDogBobV342 2.2s ease-in-out infinite}.dog-head .dog-ear.left{animation:ggDogEarLV342 2.8s ease-in-out infinite}.dog-head .dog-ear.right{animation:ggDogEarRV342 2.8s ease-in-out infinite}.dog-head .dog-tongue{animation:ggDogTongueV342 1.7s ease-in-out infinite} .cat-head .pet-hover{animation:ggCatBobV342 2.4s ease-in-out infinite}.cat-head .cat-ear.left{animation:ggCatEarLV342 3s ease-in-out infinite}.cat-head .cat-ear.right{animation:ggCatEarRV342 3s ease-in-out infinite} .ghost .pet-hover{animation:ggGhostFloatV342 2.6s ease-in-out infinite}.ghost .ghost-body{animation:ggGhostSwayV342 1.9s ease-in-out infinite} @keyframes ggDogBobV342{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}} @keyframes ggDogEarLV342{0%,100%{transform:rotate(-10deg)}50%{transform:rotate(10deg)}} @keyframes ggDogEarRV342{0%,100%{transform:rotate(10deg)}50%{transform:rotate(-10deg)}} @keyframes ggDogTongueV342{0%,100%{transform:translateY(0)}50%{transform:translateY(2px)}} @keyframes ggCatBobV342{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}} @keyframes ggCatEarLV342{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(7deg)}} @keyframes ggCatEarRV342{0%,100%{transform:rotate(3deg)}50%{transform:rotate(-6deg)}} @keyframes ggGhostFloatV342{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}} @keyframes ggGhostSwayV342{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}} @keyframes ggOwlHoverV342{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}} @keyframes ggOwlHeadV342{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}} /* ========================================================== v343 — Familiar idles, accessories, and room reactions ========================================================== */ .gg-familiar-builder-v339 .accessory-row{margin-top:10px} .gg-familiar-builder-v339 .accessory-row button{min-height:0} .pet-accessory{position:absolute;z-index:25;pointer-events:none} .pet-accessory.bow{top:7px;left:58px;width:28px;height:22px} .pet-accessory.bow .left,.pet-accessory.bow .right{position:absolute;top:4px;width:12px;height:12px;background:linear-gradient(180deg,#f2a8c5,#c86f97);border:3px solid #6b3555;border-radius:3px 9px 3px 9px} .pet-accessory.bow .left{left:0;transform:rotate(-18deg)} .pet-accessory.bow .right{right:0;transform:scaleX(-1) rotate(-18deg)} .pet-accessory.bow .center{position:absolute;left:9px;top:5px;width:10px;height:10px;border-radius:50%;background:#ffd26c;border:3px solid #835b0b} .pet-accessory.bandana{left:27px;top:54px;width:46px;height:20px;background:linear-gradient(180deg,#c63645,#871824);border:3px solid #4e0d17;clip-path:polygon(0 0,100% 0,86% 68%,72% 100%,50% 72%,28% 100%,14% 68%)} .pet-accessory.glasses{left:18px;top:28px;width:62px;height:22px} .pet-accessory.glasses .lens{position:absolute;top:0;width:22px;height:16px;border:3px solid #17181c;border-radius:8px;background:rgba(177,226,255,.16)} .pet-accessory.glasses .lens.left{left:0}.pet-accessory.glasses .lens.right{right:0}.pet-accessory.glasses .bridge{position:absolute;left:24px;top:6px;width:14px;height:3px;background:#17181c;border-radius:999px} .pet-accessory.halo{left:20px;top:-2px;width:60px;height:18px;border-radius:50%;border:4px solid rgba(255,231,155,.98);box-shadow:0 0 10px rgba(255,224,123,.48),inset 0 0 0 2px rgba(255,255,255,.25);transform:rotate(-4deg);animation:ggPetHaloFloatV343 2.6s ease-in-out infinite} .pet-accessory.star-clip{left:71px;top:10px;font-size:22px;line-height:1;color:#ffe49c;text-shadow:0 0 8px rgba(255,214,95,.4);animation:ggPetStarTwinkleV343 1.2s ease-in-out infinite} @keyframes ggPetHaloFloatV343{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-2px) rotate(2deg)}} @keyframes ggPetStarTwinkleV343{0%,100%{transform:scale(.9);opacity:.75}50%{transform:scale(1.16);opacity:1}} .gg-familiar-room-reaction-v343{position:absolute;left:50%;top:-16px;transform:translate(-50%,-100%);max-width:150px;padding:6px 10px;border-radius:14px;background:rgba(19,18,24,.95);border:1px solid rgba(215,176,91,.35);color:#f5efe5;font:800 9px/1.25 Inter,sans-serif;text-align:center;box-shadow:0 10px 24px rgba(0,0,0,.34);z-index:30;animation:ggFamBubblePopV343 .22s ease-out} .gg-familiar-room-reaction-v343[hidden]{display:none!important} .gg-familiar-room-reaction-v343:after{content:"";position:absolute;left:50%;bottom:-5px;width:10px;height:10px;background:inherit;border-right:1px solid rgba(215,176,91,.35);border-bottom:1px solid rgba(215,176,91,.35);transform:translateX(-50%) rotate(45deg)} @keyframes ggFamBubblePopV343{from{opacity:0;transform:translate(-50%,-94%) scale(.92)}to{opacity:1;transform:translate(-50%,-100%) scale(1)}} .gg-familiar-room-host-v339[data-context="home"] .gg-familiar-room-avatar-v339{filter:drop-shadow(0 8px 14px rgba(99,128,255,.22))} .gg-familiar-room-host-v339[data-context="salon"] .gg-familiar-room-avatar-v339{filter:drop-shadow(0 8px 16px rgba(215,176,91,.32))} /* room-specific idle behaviors */ .gg-familiar-room-host-v339[data-pet-type="robotOwl"][data-idle-state^="scan"] .scan{animation:ggOwlScanBurstV343 .85s ease-in-out 2} .gg-familiar-room-host-v339[data-pet-type="robotOwl"][data-idle-state="assist-salon"] .owl-head{animation:ggOwlAssistTurnV343 1.2s ease-in-out 2} .gg-familiar-room-host-v339[data-pet-type="dog"][data-idle-state="sniff-home"] .dog-nose{animation:ggDogSniffV343 .48s ease-in-out 4} .gg-familiar-room-host-v339[data-pet-type="dog"][data-idle-state="perk-home"] .dog-ear.left,.gg-familiar-room-host-v339[data-pet-type="dog"][data-idle-state="perk-home"] .dog-ear.right,.gg-familiar-room-host-v339[data-pet-type="dog"][data-idle-state="perk-salon"] .dog-ear.left,.gg-familiar-room-host-v339[data-pet-type="dog"][data-idle-state="perk-salon"] .dog-ear.right{animation:ggDogPerkV343 .7s ease-in-out 2} .gg-familiar-room-host-v339[data-pet-type="dog"][data-idle-state="spark-salon"] .pet-hover{filter:drop-shadow(0 0 10px rgba(255,225,121,.45))} .gg-familiar-room-host-v339[data-pet-type="cat"][data-idle-state="groom-home"] .cat-face{animation:ggCatGroomV343 .75s ease-in-out 2} .gg-familiar-room-host-v339[data-pet-type="cat"][data-idle-state="pose-salon"] .pet-hover{animation:ggCatPoseV343 1.1s ease-in-out 2} .gg-familiar-room-host-v339[data-pet-type="ghost"][data-idle-state="haunt-home"] .ghost-body{animation:ggGhostHauntV343 1.1s ease-in-out 2} .gg-familiar-room-host-v339[data-pet-type="ghost"][data-idle-state="glam-salon"] .ghost-body{filter:drop-shadow(0 0 8px rgba(255,213,118,.42))} .gg-familiar-room-host-v339[data-pet-type="bat"][data-idle-state^="flutter"] .bat-wing.left,.gg-familiar-room-host-v339[data-pet-type="bat"][data-idle-state^="flutter"] .bat-wing.right{animation-duration:.5s!important} .gg-familiar-room-host-v339[data-pet-type="bat"][data-idle-state="peek-home"] .bat-body,.gg-familiar-room-host-v339[data-pet-type="bat"][data-idle-state="peek-salon"] .bat-body{animation:ggBatPeekV343 .7s ease-in-out 2} .gg-familiar-room-host-v339[data-pet-type="bunny"][data-idle-state^="hop"] .pet-hover{animation:ggBunnyHopV343 .65s ease-in-out 2} .gg-familiar-room-host-v339[data-pet-type="bunny"][data-idle-state="shine-salon"] .bunny-face{filter:drop-shadow(0 0 8px rgba(255,225,121,.42))} .gg-familiar-room-host-v339[data-pet-type="miniDragon"][data-idle-state^="puff"] .dragon-flame{animation:ggDragonPuffV343 .48s ease-in-out 4} .gg-familiar-room-host-v339[data-pet-type="miniDragon"][data-idle-state^="wing"] .dragon-wing.left,.gg-familiar-room-host-v339[data-pet-type="miniDragon"][data-idle-state^="wing"] .dragon-wing.right{animation-duration:.6s!important} .gg-familiar-room-host-v339[data-idle-state="assist-salon"] .gg-familiar-room-avatar-v339:after{content:"✦";position:absolute;right:6px;top:4px;color:#ffe19d;font-size:14px;animation:ggAssistSparkV343 .8s ease-in-out 2} @keyframes ggOwlScanBurstV343{0%,100%{transform:translateX(0);opacity:.75}50%{transform:translateX(8px);opacity:1}} @keyframes ggOwlAssistTurnV343{0%,100%{transform:rotate(0)}50%{transform:rotate(11deg)}} @keyframes ggDogSniffV343{0%,100%{transform:scale(1)}50%{transform:scale(1.34)}} @keyframes ggDogPerkV343{0%,100%{transform:rotate(0)}50%{transform:rotate(18deg)}} @keyframes ggCatGroomV343{0%,100%{transform:translateX(0)}50%{transform:translateX(-4px) translateY(2px)}} @keyframes ggCatPoseV343{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-4px) scale(1.05)}} @keyframes ggGhostHauntV343{0%,100%{transform:translateX(0) rotate(0)}50%{transform:translateX(6px) rotate(5deg)}} @keyframes ggBatPeekV343{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}} @keyframes ggBunnyHopV343{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}} @keyframes ggDragonPuffV343{0%,100%{transform:scale(1)}50%{transform:scale(1.4)}} @keyframes ggAssistSparkV343{0%,100%{transform:scale(.7);opacity:0}50%{transform:scale(1.15);opacity:1}} /* ========================================================== v344 — mobile Familiar assistant + contained section helpers ========================================================== */ .gg-familiar-assistant-v339{ display:grid!important; place-items:center!important; padding:calc(10px + env(safe-area-inset-top,0px)) 12px calc(10px + env(safe-area-inset-bottom,0px))!important; box-sizing:border-box!important; } .gg-familiar-assistant-v339[hidden]{display:none!important} .gg-familiar-card-v339{ width:min(720px,calc(100vw - 24px))!important; max-width:720px!important; height:auto!important; max-height:calc(100dvh - 20px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important; margin:0!important; overflow:hidden!important; box-sizing:border-box!important; position:relative!important; } .gg-familiar-card-v339 header{ position:relative!important; z-index:3!important; padding-left:68px!important; padding-right:118px!important; min-height:60px!important; } .gg-familiar-close-v339{ position:absolute!important; top:12px!important; right:12px!important; z-index:2147483646!important; width:40px!important; height:40px!important; display:grid!important; place-items:center!important; border-radius:999px!important; border:1px solid rgba(255,255,255,.18)!important; background:#211f27!important; color:#fff!important; opacity:1!important; pointer-events:auto!important; transform:none!important; } .gg-familiar-clear-v339{ position:absolute!important; top:6px!important; right:58px!important; z-index:20!important; margin:0!important; } #ggFamiliarPortraitV339{ z-index:4!important; } .gg-familiar-suggestions-v339{ flex:0 0 auto!important; overflow-x:auto!important; overflow-y:hidden!important; scrollbar-width:none!important; } .gg-familiar-suggestions-v339::-webkit-scrollbar{display:none!important} .gg-familiar-chat-v339{ flex:1 1 auto!important; min-height:150px!important; max-height:none!important; overflow:auto!important; } #ggFamiliarFormV339{flex:0 0 auto!important} /* Keep every mini Familiar helper INSIDE its own box. */ .gg-familiar-guide-host-v341{ position:relative!important; overflow:hidden!important; } .gg-familiar-guide-btn-v341{ position:absolute!important; top:8px!important; right:8px!important; width:38px!important; height:38px!important; border-radius:12px!important; overflow:hidden!important; z-index:12!important; padding:0!important; pointer-events:auto!important; } .gg-familiar-guide-btn-v341 .gg-familiar-avatar-v339{ width:92px!important; height:92px!important; transform:scale(.30) translate(-2px,-2px)!important; transform-origin:center center!important; animation:none!important; } .gg-familiar-guide-btn-v341 .pet-hover{ animation:ggV344MiniFamPeek 2.8s ease-in-out infinite!important; } .gg-familiar-guide-btn-v341:hover .gg-familiar-avatar-v339, .gg-familiar-guide-btn-v341:active .gg-familiar-avatar-v339{ transform:scale(.32) translate(-2px,-3px)!important; } @keyframes ggV344MiniFamPeek{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-4px)} } /* Reserve a little space so helper never covers headings/text. */ .avatar-preview-card.rich-avatar-card.gg-familiar-guide-host-v341, #optionDrawer.gg-familiar-guide-host-v341, .avatar-mood-card-v068.gg-familiar-guide-host-v341, .utility-block.gg-familiar-guide-host-v341, #ggFamiliarBuilderV339.gg-familiar-guide-host-v341{ padding-right:max(54px,var(--gg-helper-existing-right,0px))!important; } /* The large preview already has controls on the right; keep helper below them. */ .avatar-preview-card.rich-avatar-card>.gg-familiar-guide-btn-v341{ top:64px!important; right:10px!important; } #ggFamiliarBuilderV339>.gg-familiar-guide-btn-v341{ top:10px!important; right:10px!important; } @media(max-width:680px){ .gg-familiar-assistant-v339{ align-items:center!important; padding:calc(8px + env(safe-area-inset-top,0px)) 10px calc(8px + env(safe-area-inset-bottom,0px))!important; } .gg-familiar-card-v339{ width:calc(100vw - 20px)!important; max-height:calc(100dvh - 16px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important; border-radius:20px!important; padding:14px!important; gap:10px!important; } .gg-familiar-card-v339 header{ padding-left:58px!important; padding-right:100px!important; min-height:54px!important; } .gg-familiar-card-v339 header>div:first-child{ width:50px!important; height:50px!important; left:0!important; top:0!important; } #ggFamiliarPortraitV339 .gg-familiar-avatar-v339{ transform:scale(.44) translate(-5px,-5px)!important; } .gg-familiar-clear-v339{ top:4px!important; right:54px!important; padding:7px 9px!important; } .gg-familiar-close-v339{ top:8px!important; right:8px!important; width:38px!important; height:38px!important; } .gg-familiar-chat-v339{min-height:120px!important} .gg-familiar-guide-btn-v341{width:34px!important;height:34px!important;top:7px!important;right:7px!important} .gg-familiar-guide-btn-v341 .gg-familiar-avatar-v339{transform:scale(.27) translate(-2px,-2px)!important} .avatar-preview-card.rich-avatar-card>.gg-familiar-guide-btn-v341{top:60px!important;right:8px!important} } /* ========================================================== v345 — Familiar model redesign: detailed game-creature look ========================================================== */ .pet-model-v345{width:100%;height:100%;overflow:visible;display:block} .pet-model-v345 *{vector-effect:non-scaling-stroke} .pet-shadow-v345{fill:rgba(0,0,0,.24);filter:blur(1.5px)} .pet-eye-glint-v345{fill:#fff;opacity:.92;pointer-events:none} /* Robot Owl: layered metal, face plate, optics and body plating */ .owl-chest-v345{fill:#58667b;stroke:#202936;stroke-width:3.5}.owl-panel-v345{fill:#77869d;stroke:#2a3442;stroke-width:2}.owl-panel-light-v345{fill:#61edf5;filter:drop-shadow(0 0 4px #61edf5)} .owl-wing-v345{fill:#435268;stroke:#202936;stroke-width:3}.owl-mask-v345{fill:#57677e;stroke:#202936;stroke-width:3.5}.owl-faceplate-v345{fill:#9ba8ba;stroke:#303b4a;stroke-width:2}.owl-ear-v345{fill:#75849a;stroke:#202936;stroke-width:3} .owl-eye-ring-v345 ellipse{fill:#263241;stroke:#10161e;stroke-width:2}.owl-eye-v345{fill:#72f3ff;stroke:#b9fbff;stroke-width:1.5;filter:drop-shadow(0 0 4px #60eaff)}.owl-beak-v345{fill:#d9aa48;stroke:#75581b;stroke-width:1.5}.owl-brow-v345{fill:none;stroke:#27313d;stroke-width:3;stroke-linecap:round}.robot-owl .scan{fill:none;stroke:#7af7ff;stroke-width:1.5;opacity:.36;filter:drop-shadow(0 0 2px #62ecff)} .owl-thruster{fill:#303b4a;stroke:#171f2a;stroke-width:2}.owl-flame-v345{fill:#62d9ff;filter:drop-shadow(0 0 4px #4dbaff)} /* Dog */ .dog-neck-v345{fill:#a86d3d;stroke:#5c3820;stroke-width:3}.dog-chest-v345{fill:#ead2b7;stroke:none;opacity:.82}.dog-ear-v345{fill:#7a4c2e;stroke:#56321d;stroke-width:3}.dog-face-v345{fill:#bc8350;stroke:#5c3820;stroke-width:3.5}.dog-mask-v345{fill:#d8a36d;opacity:.75}.dog-eye-socket-v345{fill:#7a4c2e;opacity:.42}.dog-eye-v345{fill:#241a16;stroke:#0d0908;stroke-width:1.5}.dog-muzzle-v345{fill:#ead4bc;stroke:#b99169;stroke-width:1.3}.dog-nose-v345{fill:#231a17;stroke:#080606;stroke-width:1.5}.dog-mouth-v345{fill:none;stroke:#5d4032;stroke-width:2;stroke-linecap:round}.dog-tongue-v345{fill:#db7687;stroke:#96505e;stroke-width:1.3}.dog-brow-v345{fill:none;stroke:#674326;stroke-width:2.5;stroke-linecap:round} /* Cat */ .cat-neck-v345{fill:#c8ad86;stroke:#66543f;stroke-width:3}.cat-chest-v345{fill:#efe4d1;opacity:.78}.cat-ear-v345{fill:#d7c19c;stroke:#6b5842;stroke-width:3}.cat-ear-inner-v345{fill:#d99ca5}.cat-face-v345{fill:#d7c19c;stroke:#6b5842;stroke-width:3.3}.cat-mask-v345{fill:#b89a73;opacity:.28}.cat-eye-shape-v345{fill:#9fb267;stroke:#5e673b;stroke-width:1.3}.cat-pupil-v345{fill:#10110d}.cat-muzzle-v345{fill:#eee1cc;stroke:#b8a58a;stroke-width:1.1}.cat-nose-v345{fill:#b86f78;stroke:#74464c;stroke-width:1}.cat-mouth-v345,.cat-whisker-v345{fill:none;stroke:#5f5549;stroke-width:1.6;stroke-linecap:round} /* Ghost */ .ghost-aura-v345{fill:rgba(173,206,240,.17);stroke:rgba(178,215,249,.2);stroke-width:2;filter:drop-shadow(0 0 8px rgba(177,214,255,.3))}.ghost-body-v345{fill:rgba(232,243,255,.92);stroke:#7894ad;stroke-width:3}.ghost-highlight-v345{fill:rgba(255,255,255,.54)}.ghost-eye-socket-v345{fill:#788da7;opacity:.16}.ghost-eye-v345{fill:#28394e}.ghost-mouth-v345{fill:#52657b}.ghost-cheek-v345{fill:none;stroke:#aec0d4;stroke-width:2;stroke-linecap:round} /* Bat */ .bat-wing-v345{fill:#805f8d;stroke:#3b2944;stroke-width:3}.bat-body-v345{fill:#554061;stroke:#2d2035;stroke-width:3.3}.bat-ear-v345{fill:#655073;stroke:#2d2035;stroke-width:2.6}.bat-ear-inner-v345{fill:#c5829c}.bat-eye-socket-v345{fill:#291e31;opacity:.45}.bat-eye-v345{fill:#dba8f6;stroke:#1b1121;stroke-width:1.4}.bat-muzzle-v345{fill:#765a7f;opacity:.8}.bat-nose-v345{fill:#2a172a}.bat-fang-v345{fill:#f4f0e9;stroke:#b7b0aa;stroke-width:.8} /* Bunny */ .bunny-neck-v345{fill:#dfd5dc;stroke:#887786;stroke-width:3}.bunny-chest-v345{fill:#f6f0f4;opacity:.86}.bunny-ear-v345{fill:#e8e0e5;stroke:#887786;stroke-width:3}.bunny-ear-inner-v345{fill:#e9b2c4}.bunny-face-v345{fill:#e8e0e5;stroke:#887786;stroke-width:3.3}.bunny-eye-socket-v345{fill:#cfc4cc;opacity:.45}.bunny-eye-v345{fill:#352b31;stroke:#171217;stroke-width:1.4}.bunny-muzzle-v345{fill:#f6eef2;stroke:#c8b8c0;stroke-width:1.2}.bunny-nose-v345{fill:#bf758a}.bunny-mouth-v345,.bunny-whisker-v345{fill:none;stroke:#756670;stroke-width:1.5;stroke-linecap:round} /* Mini Dragon */ .dragon-tail-v345{fill:#4e723c;stroke:#263c1e;stroke-width:3}.dragon-wing-v345{fill:#aa7abc;stroke:#583761;stroke-width:3}.dragon-body-v345{fill:#648d4d;stroke:#2e4923;stroke-width:3.4}.dragon-belly-v345{fill:#9fbd7e;stroke:#52753e;stroke-width:1.4}.dragon-horn-v345{fill:#e8d59b;stroke:#8c6f28;stroke-width:2}.dragon-brow-v345{fill:none;stroke:#324d26;stroke-width:2.6;stroke-linecap:round}.dragon-eye-socket-v345{fill:#38562e;opacity:.45}.dragon-eye-v345{fill:#e4d86f;stroke:#17230f;stroke-width:1.5}.dragon-snout-v345{fill:#739b5d;stroke:#3a592d;stroke-width:1.5}.dragon-nostril-v345{fill:#26391f}.dragon-flame-v345{fill:#ff9b43;stroke:#b64c22;stroke-width:1.2;filter:drop-shadow(0 0 4px rgba(255,126,54,.45))} /* Give every redesigned model soft dimensional separation */ .pet-model-v345 .left{transform-origin:center}.pet-model-v345 .right{transform-origin:center} .gg-familiar-avatar-v339>.pet-hover,.gg-familiar-room-avatar-v339>.pet-hover{width:100%!important;height:100%!important;display:grid!important;place-items:center!important} .gg-familiar-avatar-v339 .pet-model-v345{filter:drop-shadow(0 10px 15px rgba(0,0,0,.22))} .gg-familiar-room-avatar-v339 .pet-model-v345{filter:drop-shadow(0 7px 10px rgba(0,0,0,.25))} /* Skin variants work across the richer SVG models. */ .skin-chrome .pet-model-v345{filter:saturate(.45) brightness(1.15) contrast(1.06) drop-shadow(0 8px 12px rgba(155,190,220,.24))} .skin-black .pet-model-v345{filter:brightness(.62) saturate(.7) drop-shadow(0 8px 12px rgba(0,0,0,.35))} .skin-skeleton .pet-model-v345{filter:grayscale(.88) sepia(.1) brightness(1.08)} .skin-purple .pet-model-v345{filter:hue-rotate(52deg) saturate(1.25) drop-shadow(0 0 8px rgba(170,103,255,.26))} /* Scale helper/assistant portraits around the new SVG cleanly. */ #ggFamiliarPortraitV339 .pet-model-v345,.bot-portrait .pet-model-v345,.gg-familiar-guide-btn-v341 .pet-model-v345,.gg-familiar-guide-toast-v341 .pet-model-v345{overflow:visible} @media(max-width:680px){ .gg-familiar-preview-v339 .gg-familiar-avatar-v339{width:138px!important;height:138px!important} .gg-familiar-builder-v339 .pet-grid button .gg-familiar-avatar-v339{width:108px!important;height:108px!important} } /* ========================================================== v346 — Sitewide Familiar Helper + Progression ========================================================== */ .gg-section-familiar-host-v346{position:relative!important} .gg-section-familiar-v346{position:absolute;right:12px;top:12px;width:46px;height:46px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(25,24,30,.96),rgba(12,12,16,.96));display:grid;place-items:center;padding:0;cursor:pointer;z-index:8;box-shadow:0 8px 20px rgba(0,0,0,.25);overflow:hidden} .gg-section-familiar-v346:hover{transform:translateY(-2px);border-color:rgba(215,176,91,.55)} .gg-section-pet-v346{display:grid;place-items:center;width:46px;height:46px;overflow:hidden;border-radius:13px} .gg-section-pet-v346 .gg-familiar-avatar-v339{width:108px;height:108px;transform:scale(.42) translate(-6px,-5px);transform-origin:center} .gg-section-familiar-v346.scan-hit{animation:ggFamSectionScanV346 1.5s ease-in-out} @keyframes ggFamSectionScanV346{0%,100%{box-shadow:0 8px 20px rgba(0,0,0,.25)}50%{box-shadow:0 0 0 4px rgba(111,233,255,.2),0 0 26px rgba(111,233,255,.5)}} .gg-familiar-context-v346{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border-radius:14px;background:linear-gradient(180deg,rgba(215,176,91,.11),rgba(255,255,255,.025));border:1px solid rgba(215,176,91,.24)} .gg-familiar-context-v346 b{color:#f5dda2}.gg-familiar-context-v346 span{color:#ece6dd;line-height:1.35}.gg-familiar-context-v346 small{color:#aaa1ae} .gg-familiar-progress-v346{border:1px solid rgba(255,255,255,.08);background:#101015;border-radius:16px;padding:10px 12px;display:grid;gap:8px} .gg-familiar-progress-v346 .bond-head{display:flex;justify-content:space-between;gap:10px;font-weight:900}.gg-familiar-progress-v346 .bond-head b{color:#f5d98f} .gg-familiar-progress-v346 .bond-track{height:8px;border-radius:999px;background:#24232a;overflow:hidden}.gg-familiar-progress-v346 .bond-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,#9b7b38,#f2cf76);border-radius:inherit;transition:width .35s ease} .gg-familiar-progress-v346 .bond-actions{display:flex;gap:8px}.gg-familiar-progress-v346 .bond-actions button{flex:1;border:1px solid #39323d;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:10px;padding:8px 10px;font-weight:800;cursor:pointer;}.gg-familiar-progress-v346 .bond-actions button:first-child{border-color:rgba(215,176,91,.45);color:#f5d98f} .gg-fam-quests-v346{display:grid;gap:8px}.gg-fam-quests-v346[hidden]{display:none!important}.gg-fam-quests-v346 .quest-list,.gg-fam-quests-v346 .bond-rewards{display:grid;gap:5px}.gg-fam-quests-v346 span{font-size:12px;color:#aaa1ae}.gg-fam-quests-v346 span.done,.gg-fam-quests-v346 span.unlocked{color:#ded5c5}.gg-fam-quests-v346 span b{float:right;color:#d7b05b}.gg-fam-quests-v346 .bond-rewards strong{font-size:12px;color:#f5d98f;margin-top:3px} .gg-bond-toast-v346{position:fixed;left:50%;bottom:90px;transform:translate(-50%,20px);z-index:2147483640;min-width:220px;max-width:min(88vw,380px);padding:10px 14px;border-radius:14px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid rgba(215,176,91,.38);box-shadow:0 14px 36px rgba(0,0,0,.46);display:flex;flex-direction:column;gap:2px;opacity:0;pointer-events:none;transition:.22s ease;color:#181818;}.gg-bond-toast-v346.show{opacity:1;transform:translate(-50%,0)}.gg-bond-toast-v346 b{color:#f4d68b}.gg-bond-toast-v346 span{font-size:12px;color:#cfc7ba} .gg-familiar-wheel-v346{position:fixed;z-index:2147483635;transform:translate(-50%,-50%);width:170px;height:170px;border-radius:50%;background:rgba(14,13,18,.95);border:1px solid rgba(215,176,91,.4);box-shadow:0 24px 60px rgba(0,0,0,.55);display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:18px}.gg-familiar-wheel-v346[hidden]{display:none!important}.gg-familiar-wheel-v346 button{border:1px solid rgba(255,255,255,.08);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:18px;font-size:11px;font-weight:900;cursor:pointer;}.gg-familiar-wheel-v346 button:hover{border-color:#d7b05b;color:#ffe3a1} .gg-familiar-avatar-v339.bond-50,.gg-familiar-room-avatar-v339.bond-50{filter:drop-shadow(0 0 8px rgba(255,218,119,.18))}.gg-familiar-avatar-v339.bond-100,.gg-familiar-room-avatar-v339.bond-100{filter:drop-shadow(0 0 12px rgba(255,225,133,.42))} .gg-familiar-avatar-v339.bond-100:after,.gg-familiar-room-avatar-v339.bond-100:after{content:"✦";position:absolute;right:9px;top:6px;color:#ffe39b;font-size:14px;animation:ggBondTwinkleV346 1.25s ease-in-out infinite}@keyframes ggBondTwinkleV346{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}} body.gg-bunny-boost-v346:after,body.gg-dragon-spark-v346:after,body.gg-fam-play-v346:after{content:"✦ ✧ ✦";position:fixed;left:50%;top:38%;transform:translate(-50%,-50%);z-index:2147483630;font-size:34px;letter-spacing:14px;pointer-events:none;animation:ggFamMagicV346 1.6s ease-out forwards;color:#f4d788;text-shadow:0 0 14px rgba(244,215,136,.4)}body.gg-dragon-spark-v346:after{content:"✦ 🔥 ✦"}body.gg-fam-play-v346:after{content:"♡ ✦ ♡"}@keyframes ggFamMagicV346{0%{opacity:0;transform:translate(-50%,-30%) scale(.8)}30%{opacity:1}100%{opacity:0;transform:translate(-50%,-70%) scale(1.22)}} @media(max-width:680px){ .gg-section-familiar-v346{width:40px;height:40px;right:8px;top:8px;border-radius:12px}.gg-section-pet-v346{width:40px;height:40px}.gg-section-pet-v346 .gg-familiar-avatar-v339{transform:scale(.36) translate(-7px,-6px)} .gg-familiar-progress-v346{padding:9px 10px}.gg-familiar-progress-v346 .bond-actions button{padding:7px 8px;font-size:11px} .gg-familiar-wheel-v346{width:154px;height:154px;padding:16px} } /* v346 bond reward visuals */ .gg-familiar-avatar-v339.bond-10:before,.gg-familiar-room-avatar-v339.bond-10:before{content:"•";position:absolute;left:13px;top:12px;width:13px;height:13px;border-radius:50%;display:grid;place-items:center;background:#d7b05b;border:2px solid #6c5018;color:#342408;font-size:8px;z-index:32;box-shadow:0 2px 6px rgba(0,0,0,.25)} .gg-familiar-avatar-v339.bond-25 .pet-hover:after,.gg-familiar-room-avatar-v339.bond-25 .pet-hover:after{content:"◆";position:absolute;left:45px;top:72px;color:#d7b05b;font-size:12px;z-index:33;text-shadow:0 0 7px rgba(215,176,91,.35);animation:ggBondCharmV346 2s ease-in-out infinite}@keyframes ggBondCharmV346{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(6deg)}} .gg-familiar-avatar-v339.bond-75 .pet-hover:before,.gg-familiar-room-avatar-v339.bond-75 .pet-hover:before{content:"♛";position:absolute;left:37px;top:-11px;color:#f4d788;font-size:24px;line-height:1;z-index:34;text-shadow:0 0 8px rgba(244,215,136,.35);animation:ggBondCrownV346 2.4s ease-in-out infinite}@keyframes ggBondCrownV346{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-2px) rotate(2deg)}} /* ========================================================== v347 — Living Familiar System ========================================================== */ .gg-living-panel-v347{display:grid;gap:9px;padding:10px 11px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;} .gg-living-panel-v347 .living-head{display:flex;justify-content:space-between;gap:10px;align-items:center}.gg-living-panel-v347 .living-head strong{color:#f5d98f}.gg-living-panel-v347 .living-head small{color:#aaa1ae;text-align:right} .gg-living-panel-v347 .need-row{display:grid;gap:6px}.gg-living-panel-v347 .need-row label{display:grid;grid-template-columns:70px 1fr;gap:8px;align-items:center;font-size:11px;color:#cfc6d0}.gg-living-panel-v347 .need-row i{display:block;height:7px;background:#24232a;border-radius:999px;overflow:hidden}.gg-living-panel-v347 .need-row b{display:block;height:100%;width:50%;background:linear-gradient(90deg,#8f7440,#f0cc72);border-radius:inherit;transition:width .3s ease} .gg-living-panel-v347 .living-meta{display:flex;gap:8px;align-items:center;justify-content:space-between}.gg-living-panel-v347 .living-meta span{font-size:11px;color:#c8beca}.gg-living-panel-v347 .living-meta button{border:1px solid rgba(215,176,91,.38);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:10px;padding:7px 9px;font-weight:800;cursor:pointer;}.gg-living-panel-v347 .living-meta button:disabled{opacity:.42;cursor:not-allowed} .gg-living-panel-v347 .living-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.gg-living-panel-v347 .living-actions button{border:1px solid #39323d;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:9px;padding:7px 6px;font-weight:800;cursor:pointer;} .gg-living-panel-v347 details{border-top:1px solid rgba(255,255,255,.06);padding-top:7px}.gg-living-panel-v347 summary{cursor:pointer;font-size:11px;color:#d6c698;font-weight:800}.gg-living-panel-v347 details div{display:grid;gap:4px;margin-top:6px}.gg-living-panel-v347 details span{font-size:10px;color:#aaa1ae}.gg-living-panel-v347 details span.done{color:#d8d0c5} .gg-living-toast-v347{position:fixed;right:16px;bottom:84px;z-index:2147483645;max-width:min(340px,86vw);padding:10px 13px;border-radius:14px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid rgba(215,176,91,.38);box-shadow:0 14px 34px rgba(0,0,0,.46);display:grid;gap:2px;opacity:0;transform:translateY(14px);pointer-events:none;transition:.2s ease;color:#181818;}.gg-living-toast-v347.show{opacity:1;transform:translateY(0)}.gg-living-toast-v347 b{color:#f2d486}.gg-living-toast-v347 span{font-size:11px;color:#d0c7cc} /* affection / play reactions */ body[data-gg-fam-reaction="pet"] .gg-familiar-avatar-v339 .pet-hover,body[data-gg-fam-reaction="pet"] .gg-familiar-room-avatar-v339 .pet-hover{animation:ggFamPetV347 .75s ease-in-out 2!important} body[data-gg-fam-reaction="play"] .gg-familiar-avatar-v339 .pet-hover,body[data-gg-fam-reaction="play"] .gg-familiar-room-avatar-v339 .pet-hover{animation:ggFamPlayV347 .55s ease-in-out 2!important} body[data-gg-fam-reaction="feed"] .gg-familiar-avatar-v339 .pet-hover,body[data-gg-fam-reaction="feed"] .gg-familiar-room-avatar-v339 .pet-hover{animation:ggFamFeedV347 .7s ease-in-out 2!important} @keyframes ggFamPetV347{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.06)}} @keyframes ggFamPlayV347{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-7px) rotate(-5deg)}75%{transform:translateY(-7px) rotate(5deg)}} @keyframes ggFamFeedV347{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}} /* Sleep states: each pet rests differently. */ .gg-fam-sleeping-v347 .pet-hover{animation:none!important;transform:translateY(4px) scale(.96)!important;filter:saturate(.7) brightness(.86)} .gg-fam-sleeping-v347:after{content:"Zz";position:absolute;right:5px;top:3px;color:#d7c7ef;font:900 12px/1 Inter,sans-serif;text-shadow:0 0 8px rgba(197,175,255,.35);animation:ggFamZV347 2s ease-in-out infinite} .gg-fam-sleeping-v347.robot-owl .owl-thruster{opacity:.12}.gg-fam-sleeping-v347.robot-owl .owl-eye{height:2px!important;top:19px!important;box-shadow:none!important} .gg-fam-sleeping-v347.dog-head .dog-tongue{display:none}.gg-fam-sleeping-v347.dog-head .dog-ear.left{transform:rotate(-25deg)!important}.gg-fam-sleeping-v347.dog-head .dog-ear.right{transform:rotate(25deg)!important} .gg-fam-sleeping-v347.cat-head .cat-eye{transform:scaleY(.08)!important}.gg-fam-sleeping-v347.cat-head .pet-hover{transform:translateY(7px) scale(.91)!important} .gg-fam-sleeping-v347.ghost{opacity:.58}.gg-fam-sleeping-v347.bat-pet .pet-hover{transform:translateY(7px) rotate(180deg) scale(.86)!important}.gg-fam-sleeping-v347.bunny-pet .bunny-ear{transform:rotate(18deg)!important}.gg-fam-sleeping-v347.mini-dragon .dragon-flame{display:none} @keyframes ggFamZV347{0%,100%{opacity:.2;transform:translate(0,5px) scale(.8)}50%{opacity:1;transform:translate(5px,-4px) scale(1.05)}} /* Evolution visual language. */ .gg-fam-evolved-v347{filter:drop-shadow(0 0 10px rgba(194,154,255,.42)) drop-shadow(0 0 18px rgba(255,214,107,.18))!important} .gg-fam-evolved-v347 .pet-hover:before{content:"";position:absolute;left:9px;right:9px;top:3px;bottom:3px;border-radius:50%;border:1px solid rgba(209,177,255,.42);box-shadow:0 0 14px rgba(177,130,255,.24);animation:ggEvoAuraV347 3s ease-in-out infinite;z-index:-1} .gg-fam-evolved-v347.robot-owl .owl-eye{background:#f5e7ff!important;box-shadow:0 0 12px #bf83ff!important}.gg-fam-evolved-v347.dog-head .dog-face{box-shadow:inset 0 3px 0 rgba(255,255,255,.2),0 0 12px rgba(103,176,255,.24)!important}.gg-fam-evolved-v347.cat-head .cat-eye{background:#9de5ff!important}.gg-fam-evolved-v347.ghost .ghost-body{box-shadow:0 0 28px rgba(193,144,255,.45)!important}.gg-fam-evolved-v347.bat-pet .bat-wing{filter:brightness(1.15) saturate(1.2)}.gg-fam-evolved-v347.bunny-pet .bunny-face{box-shadow:inset 0 3px 0 rgba(255,255,255,.2),0 0 14px rgba(204,184,255,.34)!important}.gg-fam-evolved-v347.mini-dragon .dragon-flame{filter:drop-shadow(0 0 8px rgba(181,115,255,.55)) hue-rotate(55deg)} @keyframes ggEvoAuraV347{0%,100%{opacity:.45;transform:scale(.96)}50%{opacity:1;transform:scale(1.05)}} /* Sitewide page reaction nudge. */ .gg-fam-site-nudge-v347{animation:ggFamNudgeV347 .55s ease-in-out 3!important;box-shadow:0 0 0 2px rgba(215,176,91,.22),0 8px 22px rgba(0,0,0,.28)!important} @keyframes ggFamNudgeV347{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}} /* Familiar home objects in Avatar Home. */ .gg-familiar-home-v347{position:absolute;left:9%;bottom:7%;z-index:33;width:92px;min-height:70px;border:0;background:transparent;color:#f0d99b;display:grid;place-items:center;gap:2px;cursor:pointer;filter:drop-shadow(0 7px 10px rgba(0,0,0,.34));touch-action:manipulation}.gg-familiar-home-v347 b{font:900 8px/1.15 Inter,sans-serif;text-shadow:0 1px 2px #000;max-width:90px}.gg-familiar-home-v347 .home-art{position:relative;display:block;width:72px;height:48px}.gg-familiar-home-v347.pulse .home-art{animation:ggHomePulseV347 .45s ease-in-out 2}@keyframes ggHomePulseV347{50%{transform:scale(1.08)}} .pet-home-robotOwl .home-art{width:54px;height:54px;border-radius:50% 50% 16px 16px;background:linear-gradient(#4c5363,#242933);border:3px solid #161a21;box-shadow:inset 0 -10px 0 rgba(0,0,0,.18),0 0 9px rgba(93,222,255,.28)}.pet-home-robotOwl .home-art:after{content:"";position:absolute;left:13px;right:13px;top:18px;height:5px;border-radius:999px;background:#7ef3ff;box-shadow:0 0 8px #63e9ff} .pet-home-dog .home-art{height:35px;margin-top:14px;border-radius:50% 50% 30% 30%;background:linear-gradient(#9b4c56,#6c2f38);border:4px solid #3d1c22}.pet-home-dog .home-art:before{content:"";position:absolute;left:8px;right:8px;top:-9px;height:20px;border-radius:50%;background:#d5b09a;border:3px solid #6f4e42} .pet-home-cat .home-art{width:56px;height:48px;border-radius:8px;background:linear-gradient(90deg,#332d3d,#4a4058);border:3px solid #1d1923}.pet-home-cat .home-art:before{content:"";position:absolute;left:23px;bottom:40px;width:9px;height:30px;background:#3a3145}.pet-home-cat .home-art:after{content:"";position:absolute;left:9px;top:-10px;width:38px;height:13px;border-radius:999px;background:#7e678e;border:3px solid #30263a} .pet-home-ghost .home-art{width:42px;height:54px;border-radius:12px 12px 20px 20px;background:linear-gradient(#2f2940,#1b1725);border:3px solid #6e5d86;box-shadow:0 0 15px rgba(180,143,255,.34)}.pet-home-ghost .home-art:after{content:"✦";position:absolute;inset:8px;display:grid;place-items:center;color:#c8adff;font-size:18px} .pet-home-bat .home-art{width:58px;height:14px;margin-top:5px;border-radius:999px;background:#4a352d;border:3px solid #221812}.pet-home-bat .home-art:after{content:"";position:absolute;left:27px;top:12px;width:4px;height:36px;background:#57433a;border-radius:999px} .pet-home-bunny .home-art{height:34px;margin-top:15px;border-radius:50% 50% 35% 35%;background:linear-gradient(#b6917f,#7c5d52);border:4px solid #4c342d}.pet-home-bunny .home-art:after{content:"";position:absolute;left:15px;right:15px;top:7px;height:16px;border-radius:50%;background:#ead7c7} .pet-home-miniDragon .home-art{height:33px;margin-top:15px;border-radius:50%;background:radial-gradient(circle at 50% 35%,#d9b267,#8b5d2d 70%);border:4px solid #4f341c}.pet-home-miniDragon .home-art:after{content:"◆";position:absolute;left:28px;top:-17px;color:#9b6dbf;font-size:20px;text-shadow:0 0 6px rgba(176,108,255,.4)} /* Extend the existing room wheel cleanly. */ .gg-familiar-wheel-v346{max-width:210px;grid-template-columns:repeat(3,minmax(0,1fr))!important} @media(max-width:680px){.gg-living-panel-v347 .living-actions{grid-template-columns:repeat(2,1fr)}.gg-living-panel-v347 .living-head{align-items:flex-start;flex-direction:column}.gg-living-panel-v347 .living-head small{text-align:left}.gg-living-toast-v347{right:12px;bottom:84px}.gg-familiar-home-v347{width:78px;transform:scale(.88);transform-origin:left bottom}} /* ========================================================== v348 — iPhone layout repair + assistant-first Familiar flow ========================================================== */ html.gg-iphone-layout-fix-v348,body.gg-iphone-layout-fix-v348{width:100%!important;max-width:100%!important;overflow-x:hidden!important} body.gg-iphone-layout-fix-v348 main,body.gg-iphone-layout-fix-v348 main>*,body.gg-iphone-layout-fix-v348 .wrap{max-width:100%!important;box-sizing:border-box!important} /* v346 mobile gutter was shrinking every section by 46px. Helpers overlay inside the section instead. */ @media(max-width:680px){ .gg-section-familiar-v346{right:8px!important;top:8px!important} } /* Legacy v342 CSS targeted SVG paths as if they were HTML divs. Neutralize it for the v345 vector models. */ .pet-model-v345 .bat-wing,.pet-model-v345 .bat-body,.pet-model-v345 .bat-ear,.pet-model-v345 .bat-eye,.pet-model-v345 .bat-nose, .pet-model-v345 .dragon-tail,.pet-model-v345 .dragon-wing,.pet-model-v345 .dragon-body,.pet-model-v345 .dragon-horn,.pet-model-v345 .dragon-eye,.pet-model-v345 .dragon-snout,.pet-model-v345 .dragon-flame{ position:static!important;width:auto!important;height:auto!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important; border-radius:0!important;clip-path:none!important;background:none!important;box-shadow:none!important; } .pet-model-v345 .bat-wing,.pet-model-v345 .dragon-wing,.pet-model-v345 .dragon-tail{transform-box:fill-box!important;transform-origin:center!important} .pet-model-v345 .bat-wing.left{animation:ggBatSvgWingLV348 1.15s ease-in-out infinite!important} .pet-model-v345 .bat-wing.right{animation:ggBatSvgWingRV348 1.15s ease-in-out infinite!important} .pet-model-v345 .dragon-wing.left{animation:ggDragonSvgWingLV348 1.35s ease-in-out infinite!important} .pet-model-v345 .dragon-wing.right{animation:ggDragonSvgWingRV348 1.35s ease-in-out infinite!important} .pet-model-v345 .dragon-tail{animation:ggDragonSvgTailV348 2s ease-in-out infinite!important} .pet-model-v345 .dragon-flame{animation:ggDragonSvgFlameV348 .9s ease-in-out infinite!important} @keyframes ggBatSvgWingLV348{0%,100%{transform:rotate(0deg)}50%{transform:rotate(-7deg)}} @keyframes ggBatSvgWingRV348{0%,100%{transform:rotate(0deg)}50%{transform:rotate(7deg)}} @keyframes ggDragonSvgWingLV348{0%,100%{transform:rotate(0deg)}50%{transform:rotate(-5deg)}} @keyframes ggDragonSvgWingRV348{0%,100%{transform:rotate(0deg)}50%{transform:rotate(5deg)}} @keyframes ggDragonSvgTailV348{0%,100%{transform:rotate(0deg)}50%{transform:rotate(4deg)}} @keyframes ggDragonSvgFlameV348{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}} /* Sleeping/evolved rules must not destroy the SVG structure. */ .gg-fam-sleeping-v347.bat-pet .pet-hover{transform:translateY(5px) scale(.92)!important;rotate:0deg!important} .gg-fam-sleeping-v347.mini-dragon .dragon-flame{opacity:.15!important;display:inline!important} /* Assistant always opens in Chat first. Stats become an internal view. */ .gg-familiar-card-v339{min-height:0!important;max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 18px)!important} .gg-familiar-card-v339 header{display:grid!important;grid-template-columns:58px minmax(0,1fr)!important;gap:12px!important;padding:0 52px 0 0!important;min-height:70px!important;align-items:start!important} .gg-familiar-card-v339 header>div:first-child{position:relative!important;left:auto!important;top:auto!important;width:58px!important;height:58px!important;grid-column:1!important;grid-row:1!important} .gg-familiar-card-v339 header>div:nth-child(2){min-width:0!important;grid-column:2!important;grid-row:1!important;padding-top:2px!important} .gg-familiar-card-v339 header strong{font-size:18px!important;line-height:1.12!important;margin:0 0 4px!important} #ggFamiliarToneV339{font-size:12px!important;line-height:1.35!important;display:block!important;max-width:100%!important;overflow-wrap:anywhere!important} .gg-familiar-close-v339{top:8px!important;right:8px!important;z-index:2147483647!important;isolation:isolate!important;pointer-events:auto!important} .gg-fam-header-actions-v348{display:flex!important;gap:7px!important;align-items:center!important;flex-wrap:wrap!important;margin-top:7px!important} .gg-fam-header-actions-v348 button{position:static!important;margin:0!important;right:auto!important;top:auto!important;z-index:auto!important;border:1px solid #39323d!important;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important;color:#181818!important;border-radius:10px!important;padding:6px 10px!important;font-size:11px!important;font-weight:850!important;line-height:1!important;min-height:30px!important;} .gg-fam-header-actions-v348 .gg-familiar-stats-btn-v348{border-color:rgba(215,176,91,.52)!important;color:#f4d88e!important} .gg-fam-header-actions-v348 .gg-familiar-clear-v339{display:inline-flex!important;align-items:center!important;justify-content:center!important} .gg-familiar-stats-drawer-v348{display:none;flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:2px;gap:10px} .gg-familiar-stats-drawer-v348[hidden]{display:none!important} .gg-familiar-card-v339.gg-stats-open-v348 .gg-familiar-stats-drawer-v348{display:flex!important;flex-direction:column!important} .gg-familiar-card-v339.gg-stats-open-v348 .gg-familiar-context-v346, .gg-familiar-card-v339.gg-stats-open-v348 .gg-familiar-suggestions-v339, .gg-familiar-card-v339.gg-stats-open-v348 .gg-familiar-chat-v339, .gg-familiar-card-v339.gg-stats-open-v348 .gg-familiar-typing-v339, .gg-familiar-card-v339.gg-stats-open-v348 #ggFamiliarFormV339{display:none!important} .gg-familiar-stats-drawer-v348 .gg-familiar-progress-v346,.gg-familiar-stats-drawer-v348 .gg-living-panel-v347{display:grid!important;flex:0 0 auto!important} body:not(.gg-fam-stats-open-v348) #ggFamiliarProgressV346,body:not(.gg-fam-stats-open-v348) #ggLivingPanelV347{display:none!important} .gg-familiar-chat-v339{min-height:180px!important} /* iPhone/Safari compact assistant. */ @media(max-width:680px){ .gg-familiar-assistant-v339{padding:calc(6px + env(safe-area-inset-top,0px)) 8px calc(6px + env(safe-area-inset-bottom,0px))!important;align-items:center!important} .gg-familiar-card-v339{width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important;max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 12px)!important;padding:12px!important;border-radius:18px!important;gap:9px!important} .gg-familiar-card-v339 header{grid-template-columns:52px minmax(0,1fr)!important;gap:10px!important;padding-right:44px!important;min-height:68px!important} .gg-familiar-card-v339 header>div:first-child{width:52px!important;height:52px!important} #ggFamiliarPortraitV339 .gg-familiar-avatar-v339{transform:scale(.45) translate(-5px,-5px)!important} .gg-familiar-card-v339 header strong{font-size:17px!important} #ggFamiliarToneV339{font-size:11px!important;line-height:1.3!important} .gg-familiar-close-v339{width:36px!important;height:36px!important;top:7px!important;right:7px!important;font-size:19px!important} .gg-fam-header-actions-v348{margin-top:5px!important;gap:5px!important} .gg-fam-header-actions-v348 button{min-height:27px!important;padding:5px 8px!important;font-size:10px!important} .gg-familiar-suggestions-v339{min-height:38px!important} .gg-familiar-chat-v339{min-height:160px!important;max-height:none!important} #ggFamiliarFormV339{min-height:48px!important} .gg-familiar-stats-drawer-v348{max-height:none!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important} .gg-familiar-stats-drawer-v348 .gg-living-panel-v347 .living-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important} } /* ========================================================== v349 — Familiar visibility, star menu, halo + helper repair ========================================================== */ /* The assistant/menu control is a gold star, not a text Stats pill. */ .gg-fam-header-actions-v348 .gg-familiar-star-menu-v349{ width:34px!important;height:30px!important;padding:0!important;display:grid!important;place-items:center!important; border-color:rgba(215,176,91,.72)!important;background:linear-gradient(180deg,#2a2417,#17140e)!important; color:#ffd86b!important;font-size:20px!important;line-height:1!important;box-shadow:0 0 0 1px rgba(255,219,112,.08) inset!important; } .gg-fam-header-actions-v348 .gg-familiar-star-menu-v349 span{display:block!important;transform:translateY(-1px)} .gg-familiar-card-v339.gg-stats-open-v348 .gg-familiar-star-menu-v349{background:linear-gradient(180deg,#3a3018,#201a0d)!important;color:#fff0a8!important} /* Force redesigned SVG Familiars to fit their small portrait/helper containers. */ #ggFamiliarPortraitV339,.bot-portrait,.gg-section-pet-v346,.gg-familiar-guide-btn-v341{overflow:hidden!important} #ggFamiliarPortraitV339 .gg-familiar-avatar-v339, .bot-portrait .gg-familiar-avatar-v339, .gg-section-pet-v346 .gg-familiar-avatar-v339, .gg-familiar-guide-btn-v341 .gg-familiar-avatar-v339{ width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;transform:none!important;margin:0!important;padding:2px!important;display:grid!important;place-items:center!important; } #ggFamiliarPortraitV339 .pet-hover,.bot-portrait .pet-hover,.gg-section-pet-v346 .pet-hover,.gg-familiar-guide-btn-v341 .pet-hover{ width:100%!important;height:100%!important;transform:none!important;animation:none!important;display:grid!important;place-items:center!important; } #ggFamiliarPortraitV339 .pet-model-v345,.bot-portrait .pet-model-v345,.gg-section-pet-v346 .pet-model-v345,.gg-familiar-guide-btn-v341 .pet-model-v345{ width:100%!important;height:100%!important;display:block!important;overflow:visible!important;transform:none!important;opacity:1!important;visibility:visible!important; } #ggFamiliarPortraitV339{background:radial-gradient(circle at 50% 42%,rgba(215,176,91,.14),#121217 74%)!important} .gg-section-pet-v346{background:radial-gradient(circle at 50% 42%,rgba(215,176,91,.11),transparent 72%)!important} /* Burning Halo: real orange/yellow fire instead of black inherited SVG fill. */ .gg-fire-halo-v335 .gg-halo-flames-v335 path{fill:#ff6a18!important;stroke:#ffb33d!important;stroke-width:2!important;paint-order:stroke fill!important} .gg-fire-halo-v335 .gg-halo-flames-v335 path:nth-child(2n){fill:#ff982d!important} .gg-fire-halo-v335 .gg-halo-flames-v335 path:nth-child(3n){fill:#ffd15b!important} .gg-fire-halo-v335 .gg-halo-sparks-v335 circle{fill:#ffe596!important} /* Mini Dragon no longer spits the orange side flame artifact. */ .mini-dragon .dragon-flame-v345,.mini-dragon .dragon-flame{display:none!important} /* Avatar-related pages: contained helpers on supporting sections only. */ .gg-v349-contained-helper-host{position:relative!important} .gg-v349-contained-helper-host>.gg-section-familiar-v349{top:10px!important;right:10px!important;left:auto!important;bottom:auto!important;z-index:12!important} .avatar-page .avatar-utility-panel.gg-v349-contained-helper-host, .avatar-page #optionDrawer.gg-v349-contained-helper-host, .avatar-page .avatar-mood-card-v068.gg-v349-contained-helper-host, .avatar-page #ggFamiliarBuilderV339.gg-v349-contained-helper-host, .avatar-room-page .daily-card.gg-v349-contained-helper-host, .avatar-room-page .room-inventory.gg-v349-contained-helper-host, .avatar-room-page .gg-progression-v106.gg-v349-contained-helper-host{padding-right:62px!important} /* Explicitly never show a section helper over the main character/room display. */ .avatar-preview-card.rich-avatar-card>.gg-section-familiar-v346, .room-studio-card>.gg-section-familiar-v346, #avatarRoom .gg-section-familiar-v346{display:none!important} @media(max-width:680px){ .gg-fam-header-actions-v348 .gg-familiar-star-menu-v349{width:32px!important;height:27px!important;font-size:18px!important} #ggFamiliarPortraitV339 .gg-familiar-avatar-v339,.bot-portrait .gg-familiar-avatar-v339,.gg-section-pet-v346 .gg-familiar-avatar-v339{padding:2px!important} .gg-v349-contained-helper-host>.gg-section-familiar-v349{width:40px!important;height:40px!important;top:8px!important;right:8px!important} .avatar-page .avatar-utility-panel.gg-v349-contained-helper-host, .avatar-page #optionDrawer.gg-v349-contained-helper-host, .avatar-page .avatar-mood-card-v068.gg-v349-contained-helper-host, .avatar-page #ggFamiliarBuilderV339.gg-v349-contained-helper-host, .avatar-room-page .daily-card.gg-v349-contained-helper-host, .avatar-room-page .room-inventory.gg-v349-contained-helper-host, .avatar-room-page .gg-progression-v106.gg-v349-contained-helper-host{padding-right:54px!important} } /* ========================================================== v351 — Familiar expressions/reactions + renderer cleanup ========================================================== */ .gg-book-top-v351,.book-now,#bookChoiceBtn{z-index:2147483000!important;isolation:isolate!important} .gg-familiar-assistant-v339{z-index:2147483500!important}.gg-familiar-close-v339{z-index:2147483647!important} .dog-head .dog-neck-v345,.dog-head .dog-chest-v345, .cat-head .cat-neck-v345,.cat-head .cat-chest-v345, .bunny-pet .bunny-neck-v345,.bunny-pet .bunny-chest-v345{display:none!important} .dog-head .pet-head-only-v351,.cat-head .pet-head-only-v351,.bunny-pet .pet-head-only-v351{width:100%!important;height:100%!important;transform:none!important} #ggFamiliarPortraitV339,.gg-section-familiar-v346,.gg-familiar-guide-btn-v341,.gg-familiar-card-v339{animation:ggFamBoxGlowV351 3s ease-in-out infinite!important} @keyframes ggFamBoxGlowV351{0%,100%{box-shadow:0 0 0 1px rgba(215,176,91,.15),0 0 10px rgba(215,176,91,.10),0 10px 26px rgba(0,0,0,.28)}50%{box-shadow:0 0 0 1px rgba(215,176,91,.34),0 0 22px rgba(215,176,91,.22),0 10px 30px rgba(0,0,0,.32)}} .gg-fam-name-inline-v351,.gg-fam-name-colored-v351,.gg-fam-name-neon-v351{color:var(--gg-fam-name-color)!important} .gg-fam-name-neon-v351{color:#67fff4!important;text-shadow:0 0 5px #67fff4,0 0 12px #67fff4,0 0 20px #38bfff!important;animation:ggFamNeonNameV351 1.6s ease-in-out infinite alternate} @keyframes ggFamNeonNameV351{from{filter:brightness(.9)}to{filter:brightness(1.35)}} .gg-fam-heart-layer-v351,.gg-fam-fx-layer-v351{position:fixed;inset:0;z-index:2147483600;overflow:hidden;pointer-events:none} .gg-fam-heart-v351{position:absolute;bottom:-44px;font-style:normal;color:#ff5f9e;text-shadow:0 0 9px rgba(255,70,145,.58);animation:ggFamHeartFlyV351 linear forwards} .gg-fam-heart-v351:nth-child(3n){color:#ff8ec0}.gg-fam-heart-v351:nth-child(4n){color:#ff3f73} @keyframes ggFamHeartFlyV351{0%{transform:translate3d(0,0,0) scale(.72) rotate(0);opacity:0}8%{opacity:1}100%{transform:translate3d(var(--gg-drift),-112vh,0) scale(1.28) rotate(var(--gg-rot));opacity:0}} .gg-fam-spark-v351{position:absolute;font-style:normal;color:#ffe28a;font-size:22px;text-shadow:0 0 10px rgba(255,214,90,.65);animation:ggFamSparkV351 1.35s ease-out both} @keyframes ggFamSparkV351{0%{opacity:0;transform:scale(.3) rotate(-30deg)}35%{opacity:1;transform:scale(1.3) rotate(10deg)}100%{opacity:0;transform:scale(.5) translateY(-24px) rotate(40deg)}} body[data-gg-fam-expression="happy"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-expression="happy"] .gg-familiar-room-avatar-v339 .pet-model-v345{animation:ggFamHappyV351 .52s ease-in-out infinite alternate} body[data-gg-fam-expression="love"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-expression="love"] .gg-familiar-room-avatar-v339 .pet-model-v345{filter:drop-shadow(0 0 10px rgba(255,91,159,.55)) brightness(1.06)!important;animation:ggFamLoveV351 .7s ease-in-out infinite alternate} body[data-gg-fam-expression="concerned"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-expression="concerned"] .gg-familiar-room-avatar-v339 .pet-model-v345{filter:saturate(.72) brightness(.9)!important;transform:rotate(-3deg) translateY(2px)!important} body[data-gg-fam-expression="sleepy"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-expression="sleepy"] .gg-familiar-room-avatar-v339 .pet-model-v345{filter:saturate(.72) brightness(.82)!important;animation:ggFamSleepyV351 1.7s ease-in-out infinite alternate} body[data-gg-fam-expression="excited"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-expression="excited"] .gg-familiar-room-avatar-v339 .pet-model-v345{animation:ggFamExcitedV351 .3s ease-in-out 8 alternate} body[data-gg-fam-expression="curious"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-expression="curious"] .gg-familiar-room-avatar-v339 .pet-model-v345{animation:ggFamCuriousV351 .8s ease-in-out 4 alternate} @keyframes ggFamHappyV351{from{transform:translateY(0) scale(1)}to{transform:translateY(-4px) scale(1.025)}} @keyframes ggFamLoveV351{from{transform:scale(1)}to{transform:scale(1.045)}} @keyframes ggFamSleepyV351{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(3px) rotate(2deg)}} @keyframes ggFamExcitedV351{from{transform:translateY(0) rotate(-2deg)}to{transform:translateY(-5px) rotate(2deg)}} @keyframes ggFamCuriousV351{from{transform:rotate(-4deg)}to{transform:rotate(4deg)}} #ggFamiliarSoundBtnV351{border-color:rgba(120,190,255,.28)!important;color:#d9e8ff!important} /* ========================================================== v352 — Silver helper boxes, stronger bat flaps, richer chat FX ========================================================== */ /* Silver / metallic mini-assistant boxes */ #ggFamiliarPortraitV339, .gg-familiar-chat-v339 .bot-portrait, .gg-familiar-guide-btn-v341, .gg-section-familiar-v346, .gg-section-pet-v346{ background: radial-gradient(circle at 28% 22%, rgba(255,255,255,.50), rgba(255,255,255,0) 34%), linear-gradient(145deg, rgba(224,228,236,.96), rgba(136,146,160,.92) 34%, rgba(70,77,89,.96) 68%, rgba(212,218,228,.94)); border-color: rgba(235,240,248,.62)!important; box-shadow: inset 0 1px 0 rgba(255,255,255,.42), inset 0 -1px 0 rgba(0,0,0,.18), 0 8px 20px rgba(0,0,0,.26)!important; } .gg-familiar-chat-v339 .bot-portrait, .gg-familiar-guide-btn-v341, .gg-section-familiar-v346, #ggFamiliarPortraitV339{ position:relative; } .gg-familiar-chat-v339 .bot-portrait::after, .gg-familiar-guide-btn-v341::after, .gg-section-familiar-v346::after, #ggFamiliarPortraitV339::after{ content:""; position:absolute; inset:1px; border-radius:inherit; background:linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,0) 38%, rgba(0,0,0,.10)); pointer-events:none; } /* Stronger, more visible bat wing flap */ .pet-model-v345 .bat-wing{ transform-box:fill-box!important; } .pet-model-v345 .bat-wing.left{ transform-origin:100% 55%!important; animation:ggBatSvgWingLV352 .62s ease-in-out infinite!important; } .pet-model-v345 .bat-wing.right{ transform-origin:0% 55%!important; animation:ggBatSvgWingRV352 .62s ease-in-out infinite!important; } @keyframes ggBatSvgWingLV352{0%,100%{transform:rotate(10deg) scaleY(1)}50%{transform:rotate(-20deg) scaleY(.96)}} @keyframes ggBatSvgWingRV352{0%,100%{transform:rotate(-10deg) scaleY(1)}50%{transform:rotate(20deg) scaleY(.96)}} /* More chat bubble FX */ .gg-familiar-chat-v339 .msg span{position:relative;overflow:hidden} .gg-familiar-chat-v339 .msg.gg-chatfx-pop span{animation:ggChatPopV352 .34s cubic-bezier(.2,.8,.2,1.1)} .gg-familiar-chat-v339 .msg.gg-chatfx-love span{animation:ggChatHeartPulseV352 1.15s ease-in-out 2} .gg-familiar-chat-v339 .msg.gg-chatfx-spark span{animation:ggChatSparkGlowV352 1.35s ease-in-out 2} .gg-familiar-chat-v339 .msg.gg-chatfx-spooky span{animation:ggChatSpookyV352 1.35s ease-in-out 2} .gg-familiar-chat-v339 .msg.gg-chatfx-warning span{animation:ggChatWarningV352 .18s linear 5} .gg-familiar-chat-v339 .msg.gg-chatfx-sleepy span{animation:ggChatSleepyV352 1.6s ease-in-out 1} .gg-familiar-chat-v339 .msg.gg-chatfx-scan span{animation:ggChatScanShimmerV352 1.3s ease-in-out 1} .gg-familiar-chat-v339 .msg.gg-chatfx-love span::before, .gg-familiar-chat-v339 .msg.gg-chatfx-spark span::before, .gg-familiar-chat-v339 .msg.gg-chatfx-spooky span::before, .gg-familiar-chat-v339 .msg.gg-chatfx-scan span::before{ content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit; } .gg-familiar-chat-v339 .msg.gg-chatfx-love span::before{ background:radial-gradient(circle at 50% 50%, rgba(255,92,152,.18), rgba(255,92,152,0) 66%); } .gg-familiar-chat-v339 .msg.gg-chatfx-spark span::before{ background:linear-gradient(120deg, transparent 0 22%, rgba(255,231,163,.0) 22%, rgba(255,231,163,.40) 50%, rgba(255,231,163,0) 78%, transparent 78%); animation:ggChatSweepV352 1s ease-out 1; } .gg-familiar-chat-v339 .msg.gg-chatfx-spooky span::before{ background:radial-gradient(circle at 30% 70%, rgba(189,123,255,.17), rgba(189,123,255,0) 55%), radial-gradient(circle at 70% 25%, rgba(94,220,255,.14), rgba(94,220,255,0) 45%); } .gg-familiar-chat-v339 .msg.gg-chatfx-scan span::before{ background:linear-gradient(180deg, transparent 0%, rgba(113,243,255,.0) 30%, rgba(113,243,255,.28) 48%, rgba(113,243,255,0) 68%, transparent 100%); animation:ggChatScanLineV352 1.1s ease-in-out 1; } @keyframes ggChatPopV352{0%{transform:scale(.92)}60%{transform:scale(1.03)}100%{transform:scale(1)}} @keyframes ggChatHeartPulseV352{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}50%{box-shadow:0 0 0 rgba(255,92,152,0)}} @keyframes ggChatSparkGlowV352{0%,100%{box-shadow:0 0 0 rgba(255,221,119,0)}50%{box-shadow:0 0 18px rgba(255,221,119,.22)}} @keyframes ggChatSpookyV352{0%,100%{transform:translateX(0)}25%{transform:translateX(-2px)}75%{transform:translateX(2px)}} @keyframes ggChatWarningV352{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}} @keyframes ggChatSleepyV352{0%,100%{opacity:1;transform:translateY(0)}50%{opacity:.76;transform:translateY(2px)}} @keyframes ggChatScanShimmerV352{0%,100%{box-shadow:0 0 0 rgba(106,234,255,0)}50%{box-shadow:0 0 16px rgba(106,234,255,.18)}} @keyframes ggChatSweepV352{0%{transform:translateX(-110%)}100%{transform:translateX(110%)}} @keyframes ggChatScanLineV352{0%{transform:translateY(-100%)}100%{transform:translateY(120%)}} .gg-chat-fx-layer-v352{position:fixed;inset:0;pointer-events:none;z-index:2147483600;overflow:hidden} .gg-chat-fx-particle-v352{position:absolute;font-style:normal;opacity:0;animation:ggChatParticleV352 1.9s ease-out forwards} @keyframes ggChatParticleV352{0%{opacity:0;transform:translate3d(0,0,0) scale(.5) rotate(0)}15%{opacity:1}100%{opacity:0;transform:translate3d(var(--dx),var(--dy),0) scale(1.2) rotate(var(--rot))}} /* ========================================================== v353 — Familiar Personality Chat + Renderer Consolidation ========================================================== */ html.gg-fam-stable-v353,body.gg-fam-stable-v353{max-width:100%!important;overflow-x:hidden!important} body.gg-fam-stable-v353 main,body.gg-fam-stable-v353 section,body.gg-fam-stable-v353 .wrap{min-width:0!important;box-sizing:border-box!important} .gg-book-top-v353,.book-now,#bookChoiceBtn{z-index:2147483000!important;isolation:isolate!important} .gg-familiar-assistant-v339{z-index:2147483500!important}.gg-familiar-close-v339{z-index:2147483647!important} /* One helper renderer: contained, silver, gently alive, never creates a page gutter. */ .gg-fam-helper-host-v353{position:relative!important;padding-right:inherit!important;overflow:visible} .gg-section-familiar-v346.gg-fam-helper-v353,.gg-familiar-guide-btn-v341{ contain:layout paint!important;overflow:hidden!important; animation:ggFamHelperIdleV353 3.4s ease-in-out infinite!important; background:radial-gradient(circle at 25% 20%,rgba(255,255,255,.52),rgba(255,255,255,0) 33%),linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; border-color:rgba(244,247,251,.62)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.42),inset 0 -1px 0 rgba(0,0,0,.18),0 8px 20px rgba(0,0,0,.25)!important; }.gg-familiar-guide-btn-v341{ contain:layout paint!important;overflow:hidden!important; animation:ggFamHelperIdleV353 3.4s ease-in-out infinite!important; background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; border-color:rgba(244,247,251,.62)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.42),inset 0 -1px 0 rgba(0,0,0,.18),0 8px 20px rgba(0,0,0,.25)!important; color:#181818;} .gg-section-familiar-v346.gg-fam-helper-v353::after{content:attr(data-status);position:absolute;left:2px;right:2px;bottom:1px;height:10px;border-radius:0 0 9px 9px;background:rgba(15,17,22,.72);color:#edf0f5;font:700 6px/10px system-ui,sans-serif;letter-spacing:.02em;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none} .gg-section-familiar-v346.gg-fam-helper-active-v353,.gg-familiar-guide-btn-v341.gg-fam-helper-active-v353{animation:ggFamHelperTapV353 .55s cubic-bezier(.2,.8,.2,1)!important} @keyframes ggFamHelperIdleV353{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}} @keyframes ggFamHelperTapV353{0%{transform:scale(1)}35%{transform:scale(1.10) rotate(-3deg)}70%{transform:scale(.97) rotate(2deg)}100%{transform:scale(1)}} /* Assistant portrait / bot portraits remain the same silver system. */ #ggFamiliarPortraitV339,.gg-familiar-chat-v339 .bot-portrait{ background:radial-gradient(circle at 25% 20%,rgba(255,255,255,.52),rgba(255,255,255,0) 33%),linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important; border-color:rgba(244,247,251,.62)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.42),inset 0 -1px 0 rgba(0,0,0,.18),0 0 18px rgba(204,214,230,.18)!important; } /* Name color rules now owned by v353. */ .gg-fam-name-inline-v353,.gg-fam-name-color-v353,.gg-fam-name-neon-v353{color:var(--gg-fam-name-color)!important} .gg-fam-name-neon-v353{color:#67fff4!important;text-shadow:0 0 5px #67fff4,0 0 12px #67fff4,0 0 21px #38bfff!important;animation:ggFamNeon353 1.5s ease-in-out infinite alternate} @keyframes ggFamNeon353{from{filter:brightness(.92)}to{filter:brightness(1.35)}} /* Pet-specific chat personalities. */ .gg-familiar-chat-v339 .msg.bot span{transform-origin:left center;transition:box-shadow .25s ease,filter .25s ease} .gg-familiar-chat-v339 .msg.gg-chat-new-v353.gg-chat-pet-owl-v353 span{animation:ggChatOwlV353 .75s ease-out both;border-color:rgba(99,230,255,.28)!important} .gg-familiar-chat-v339 .msg.gg-chat-new-v353.gg-chat-pet-dog-v353 span{animation:ggChatDogV353 .55s cubic-bezier(.2,.9,.2,1.15) both} .gg-familiar-chat-v339 .msg.gg-chat-new-v353.gg-chat-pet-cat-v353 span{animation:ggChatCatV353 .75s ease-out both} .gg-familiar-chat-v339 .msg.gg-chat-new-v353.gg-chat-pet-ghost-v353 span{animation:ggChatGhostV353 1s ease-out both;box-shadow:0 0 16px rgba(179,126,255,.14)} .gg-familiar-chat-v339 .msg.gg-chat-new-v353.gg-chat-pet-bat-v353 span{animation:ggChatBatV353 .14s linear 4,ggChatBatSettleV353 .5s .56s ease-out both} .gg-familiar-chat-v339 .msg.gg-chat-new-v353.gg-chat-pet-bunny-v353 span{animation:ggChatBunnyV353 .55s cubic-bezier(.22,.86,.23,1.16) both;box-shadow:0 0 14px rgba(255,164,205,.11)} .gg-familiar-chat-v339 .msg.gg-chat-new-v353.gg-chat-pet-dragon-v353 span{animation:ggChatDragonV353 .8s ease-out both;box-shadow:0 0 16px rgba(255,144,71,.12)} @keyframes ggChatOwlV353{0%{opacity:.35;filter:brightness(1.8);transform:translateY(-2px)}45%{opacity:1;filter:brightness(1.12)}100%{filter:none;transform:none}} @keyframes ggChatDogV353{0%{opacity:0;transform:translateY(7px) scale(.94)}65%{opacity:1;transform:translateY(-2px) scale(1.025)}100%{transform:none}} @keyframes ggChatCatV353{0%{opacity:0;transform:translateX(-7px)}45%{opacity:.7}100%{opacity:1;transform:none}} @keyframes ggChatGhostV353{0%{opacity:0;filter:blur(4px);transform:translateY(4px)}100%{opacity:1;filter:blur(0);transform:none}} @keyframes ggChatBatV353{0%,100%{transform:translateX(0)}25%{transform:translateX(-2px)}75%{transform:translateX(2px)}} @keyframes ggChatBatSettleV353{from{opacity:.75}to{opacity:1}} @keyframes ggChatBunnyV353{0%{opacity:0;transform:scale(.9)}65%{opacity:1;transform:scale(1.025)}100%{transform:scale(1)}} @keyframes ggChatDragonV353{0%{opacity:0;filter:brightness(1.5);transform:translateY(3px)}60%{opacity:1;filter:drop-shadow(0 0 5px rgba(255,141,73,.34))}100%{filter:none;transform:none}} /* Content-sensitive chat effects. */ .gg-familiar-chat-v339 .msg[class*="gg-chatfx-"] span{position:relative;overflow:hidden} .gg-familiar-chat-v339 .msg.gg-chatfx-love-v353 span{animation:ggFxLove353 1s ease-in-out 2} .gg-familiar-chat-v339 .msg.gg-chatfx-spark-v353 span{animation:ggFxSpark353 1.1s ease-in-out 2} .gg-familiar-chat-v339 .msg.gg-chatfx-spooky-v353 span{animation:ggFxSpooky353 .85s ease-in-out 2} .gg-familiar-chat-v339 .msg.gg-chatfx-warning-v353 span{animation:ggFxWarn353 .17s linear 5} .gg-familiar-chat-v339 .msg.gg-chatfx-sleepy-v353 span{animation:ggFxSleep353 1.5s ease-in-out} .gg-familiar-chat-v339 .msg.gg-chatfx-scan-v353 span{animation:ggFxScan353 1.2s ease-in-out} @keyframes ggFxLove353{0%,100%{box-shadow:0 0 0 rgba(255,90,155,0)}50%{box-shadow:0 0 18px rgba(255,90,155,.22);transform:scale(1.018)}} @keyframes ggFxSpark353{0%,100%{box-shadow:0 0 0 rgba(255,225,128,0)}50%{box-shadow:0 0 18px rgba(255,225,128,.24)}} @keyframes ggFxSpooky353{0%,100%{filter:none;transform:translateX(0)}50%{filter:hue-rotate(16deg);transform:translateX(2px)}} @keyframes ggFxWarn353{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}} @keyframes ggFxSleep353{0%,100%{opacity:1;transform:translateY(0)}50%{opacity:.72;transform:translateY(2px)}} @keyframes ggFxScan353{0%,100%{box-shadow:0 0 0 rgba(90,236,255,0)}50%{box-shadow:0 0 16px rgba(90,236,255,.20)}} /* Emotion library shared by assistant/helper/room copies. */ body[data-gg-fam-emotion="happy"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-emotion="happy"] .gg-familiar-room-avatar-v339 .pet-model-v345{animation:ggEmotionHappy353 .5s ease-in-out infinite alternate} body[data-gg-fam-emotion="love"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-emotion="love"] .gg-familiar-room-avatar-v339 .pet-model-v345{animation:ggEmotionLove353 .68s ease-in-out infinite alternate;filter:drop-shadow(0 0 9px rgba(255,96,160,.48))} body[data-gg-fam-emotion="proud"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-emotion="proud"] .gg-familiar-room-avatar-v339 .pet-model-v345{animation:ggEmotionProud353 .9s ease-in-out 3 alternate} body[data-gg-fam-emotion="sleepy"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-emotion="sleepy"] .gg-familiar-room-avatar-v339 .pet-model-v345{animation:ggEmotionSleep353 1.5s ease-in-out infinite alternate;filter:saturate(.72) brightness(.85)} body[data-gg-fam-emotion="curious"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-emotion="curious"] .gg-familiar-room-avatar-v339 .pet-model-v345{animation:ggEmotionCurious353 .72s ease-in-out 4 alternate} body[data-gg-fam-emotion="shocked"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-emotion="shocked"] .gg-familiar-room-avatar-v339 .pet-model-v345{animation:ggEmotionShock353 .32s ease-out 3 alternate} body[data-gg-fam-emotion="annoyed"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-emotion="annoyed"] .gg-familiar-room-avatar-v339 .pet-model-v345{animation:ggEmotionAnnoyed353 .22s linear 4} body[data-gg-fam-emotion="scared"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-emotion="scared"] .gg-familiar-room-avatar-v339 .pet-model-v345{animation:ggEmotionScared353 .18s linear 7} body[data-gg-fam-emotion="concerned"] .gg-familiar-avatar-v339 .pet-model-v345,body[data-gg-fam-emotion="concerned"] .gg-familiar-room-avatar-v339 .pet-model-v345{transform:rotate(-3deg) translateY(2px);filter:saturate(.75) brightness(.92)} @keyframes ggEmotionHappy353{from{transform:translateY(0)}to{transform:translateY(-4px) scale(1.025)}} @keyframes ggEmotionLove353{from{transform:scale(1)}to{transform:scale(1.045)}} @keyframes ggEmotionProud353{from{transform:translateY(0) rotate(-2deg)}to{transform:translateY(-3px) rotate(2deg)}} @keyframes ggEmotionSleep353{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(3px) rotate(2deg)}} @keyframes ggEmotionCurious353{from{transform:rotate(-4deg)}to{transform:rotate(4deg)}} @keyframes ggEmotionShock353{from{transform:scale(1)}to{transform:scale(1.07)}} @keyframes ggEmotionAnnoyed353{0%,100%{transform:translateX(0)}25%{transform:translateX(-2px)}75%{transform:translateX(2px)}} @keyframes ggEmotionScared353{0%,100%{transform:translate(0,0)}25%{transform:translate(-2px,1px)}75%{transform:translate(2px,-1px)}} /* Strong bat wing flapping, plus hidden keyword fast mode. */ .pet-model-v345 .bat-wing.left{transform-origin:100% 55%!important;animation:ggBatFlapL353 .62s ease-in-out infinite!important} .pet-model-v345 .bat-wing.right{transform-origin:0% 55%!important;animation:ggBatFlapR353 .62s ease-in-out infinite!important} body.gg-fam-bat-fast-v353 .pet-model-v345 .bat-wing.left,body.gg-fam-bat-fast-v353 .pet-model-v345 .bat-wing.right{animation-duration:.22s!important} @keyframes ggBatFlapL353{0%,100%{transform:rotate(10deg)}50%{transform:rotate(-21deg) scaleY(.96)}} @keyframes ggBatFlapR353{0%,100%{transform:rotate(-10deg)}50%{transform:rotate(21deg) scaleY(.96)}} /* Hidden-keyword/site FX. */ .gg-fam-fx-layer-v353{position:fixed;inset:0;pointer-events:none;z-index:2147483600;overflow:hidden} .gg-fam-particle-v353{position:absolute;font-style:normal;opacity:0;color:#ffe28a;text-shadow:0 0 9px currentColor;animation:ggParticle353 ease-out forwards} .gg-fam-particle-v353[data-kind="love"]{color:#ff69a9}.gg-fam-particle-v353[data-kind="moon"]{color:#e7e0ff}.gg-fam-particle-v353[data-kind="fire"]{color:#ff9c4a}.gg-fam-particle-v353[data-kind="ghost"]{color:#c99bff}.gg-fam-particle-v353[data-kind="scan"]{color:#70edff}.gg-fam-particle-v353[data-kind="sleep"]{color:#d8d2ff} @keyframes ggParticle353{0%{opacity:0;transform:translate3d(0,0,0) scale(.55) rotate(0)}14%{opacity:1}100%{opacity:0;transform:translate3d(var(--dx),var(--dy),0) scale(1.18) rotate(var(--rot))}} body.gg-fam-ghost-flicker-v353 main{animation:ggGhostFlicker353 .12s linear 7} @keyframes ggGhostFlicker353{0%,100%{filter:none}50%{filter:brightness(.72) hue-rotate(22deg)}} /* Favorites shown inside Stats/Menu. */ .gg-fam-favorites-v353{display:grid;gap:8px;padding:10px 11px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:#0f0f14;color:#ececf0} .gg-fam-favorites-v353 .fav-head{display:flex;justify-content:space-between;gap:10px;align-items:center}.gg-fam-favorites-v353 .fav-head strong{color:#e6c879}.gg-fam-favorites-v353 .fav-head small{color:#aeb2ba} .gg-fam-favorites-v353 .fav-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.gg-fam-favorites-v353 .fav-grid span{display:flex;flex-direction:column;gap:2px;padding:7px;border-radius:10px;background:#19191f;color:#d8d9df;text-align:center;font-size:10px}.gg-fam-favorites-v353 .fav-grid b{font-size:9px;color:#9298a2;text-transform:uppercase;letter-spacing:.04em}.gg-fam-favorites-v353 .fav-learned{display:grid;gap:3px;padding-top:5px;border-top:1px solid rgba(255,255,255,.06)}.gg-fam-favorites-v353 .fav-learned strong{font-size:11px}.gg-fam-favorites-v353 .fav-learned small{color:#aeb2ba;line-height:1.35} #ggFamiliarSoundBtnV353{border:1px solid rgba(214,220,232,.28);background:#17181d;color:#dfe5ee;border-radius:999px;padding:6px 9px;font-weight:800;font-size:11px} @media(max-width:680px){ .gg-section-familiar-v346.gg-fam-helper-v353{right:8px!important;top:8px!important;width:40px!important;height:40px!important} .gg-section-familiar-v346.gg-fam-helper-v353::after{font-size:5.5px;height:9px;line-height:9px} .gg-fam-favorites-v353 .fav-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .gg-fam-favorites-v353 .fav-grid span:last-child{grid-column:1/-1} } /* ========================================================== v354 — iPhone Stats navigation + Avatar Studio width repair ========================================================== */ /* Keep the gold star visible in BOTH Chat and Stats modes. */ .gg-fam-header-actions-v348 #ggFamiliarStatsBtnV348.gg-v354-persistent-star{ width:36px!important; min-width:36px!important; max-width:36px!important; height:31px!important; padding:0!important; display:grid!important; place-items:center!important; overflow:visible!important; flex:0 0 36px!important; font-size:20px!important; border-color:rgba(215,176,91,.76)!important; background:linear-gradient(180deg,#302918,#17140d)!important; color:#ffd86b!important; } .gg-fam-header-actions-v348 #ggFamiliarStatsBtnV348.gg-v354-persistent-star span{ display:block!important; line-height:1!important; transform:none!important; } .gg-familiar-card-v339.gg-stats-open-v348 #ggFamiliarStatsBtnV348.gg-v354-persistent-star{ box-shadow:0 0 0 1px rgba(255,216,107,.22) inset,0 0 10px rgba(215,176,91,.16)!important; } .gg-fam-stats-nav-v354{ position:sticky; top:0; z-index:30; display:grid; grid-template-columns:minmax(0,1fr); gap:5px; padding:4px 0 10px; margin:0 0 2px; background:linear-gradient(180deg,#101015 72%,rgba(16,16,21,0)); } #ggFamBackToChatV354{ width:100%; min-height:40px; border:1px solid rgba(215,176,91,.5); border-radius:13px; background:linear-gradient(180deg,#2c2619,#17141a); color:#f4d88e; font:900 13px/1.1 Inter,system-ui,sans-serif; cursor:pointer; } #ggFamBackToChatV354 span{font-size:17px;margin-right:5px} .gg-fam-stats-nav-v354 small{color:#8f8994;text-align:center;font-size:10px;line-height:1.25} /* Keep the assistant wholly inside Safari's SMALL viewport, including browser chrome. */ .gg-familiar-assistant-v339.gg-v354-screen-safe{ position:fixed!important; inset:0!important; width:100%!important; height:100svh!important; max-width:100vw!important; overflow:hidden!important; box-sizing:border-box!important; align-items:flex-start!important; justify-content:center!important; padding: max(8px,env(safe-area-inset-top,0px)) 8px max(10px,env(safe-area-inset-bottom,0px))!important; } .gg-familiar-card-v339.gg-v354-screen-safe-card{ width:min(720px,calc(100vw - 16px))!important; max-width:calc(100vw - 16px)!important; height:auto!important; max-height:calc(100svh - max(8px,env(safe-area-inset-top,0px)) - max(10px,env(safe-area-inset-bottom,0px)) - 8px)!important; margin:0!important; overflow:hidden!important; box-sizing:border-box!important; } .gg-familiar-card-v339.gg-v354-screen-safe-card .gg-familiar-stats-drawer-v348{ min-height:0!important; overflow-y:auto!important; overflow-x:hidden!important; -webkit-overflow-scrolling:touch!important; overscroll-behavior:contain!important; padding-bottom:16px!important; } /* Avatar Studio-only horizontal containment. Do not touch the other pages. */ html.gg-avatar-ios-width-v354, body.avatar-page.gg-avatar-ios-width-v354{ width:100%!important; max-width:100%!important; overflow-x:clip!important; margin-left:0!important; margin-right:0!important; } body.avatar-page.gg-avatar-ios-width-v354 .gg-avatar-width-safe-v354, body.avatar-page.gg-avatar-ios-width-v354 main, body.avatar-page.gg-avatar-ios-width-v354 .wrap, body.avatar-page.gg-avatar-ios-width-v354 .rich-avatar-shell, body.avatar-page.gg-avatar-ios-width-v354 .rich-avatar-card{ box-sizing:border-box!important; max-width:100%!important; margin-left:auto!important; margin-right:auto!important; } body.avatar-page.gg-avatar-ios-width-v354 .rich-avatar-shell{ width:100%!important; } body.avatar-page.gg-avatar-ios-width-v354 .rich-avatar-card{ width:100%!important; } /* Internal carousels may scroll themselves, but must never enlarge the document. */ body.avatar-page.gg-avatar-ios-width-v354 .category-loop-wrap, body.avatar-page.gg-avatar-ios-width-v354 .option-loop-wrap, body.avatar-page.gg-avatar-ios-width-v354 .icon-loop, body.avatar-page.gg-avatar-ios-width-v354 .option-loop{ max-width:100%!important; box-sizing:border-box!important; } /* Keep avatar hero helper pinned INSIDE the hero instead of creating an outer gutter. */ body.avatar-page.gg-avatar-ios-width-v354 .avatar-hero.gg-section-familiar-host-v346{ position:relative!important; padding-right:0!important; overflow:hidden!important; } body.avatar-page.gg-avatar-ios-width-v354 .avatar-hero>.gg-section-familiar-v346{ right:10px!important; left:auto!important; top:10px!important; } @supports not (overflow:clip){ html.gg-avatar-ios-width-v354,body.avatar-page.gg-avatar-ios-width-v354{overflow-x:hidden!important} } @media(max-width:680px){ .gg-familiar-assistant-v339.gg-v354-screen-safe{padding-top:max(6px,env(safe-area-inset-top,0px))!important} .gg-familiar-card-v339.gg-v354-screen-safe-card{ width:calc(100vw - 16px)!important; max-width:calc(100vw - 16px)!important; max-height:calc(100svh - max(6px,env(safe-area-inset-top,0px)) - max(8px,env(safe-area-inset-bottom,0px)) - 6px)!important; } } /* ========================================================== v355 — persistent Chat/Stats switch + iPhone visual viewport + avatar width self-heal ========================================================== */ .gg-fam-header-actions-v348 #ggFamiliarStatsBtnV348.gg-v355-chat-stats-toggle{ width:auto!important;min-width:74px!important;max-width:none!important;height:34px!important; padding:0 11px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important; flex:0 0 auto!important;overflow:visible!important;border-color:rgba(215,176,91,.72)!important; background:linear-gradient(180deg,#302918,#17140d)!important;color:#ffd86b!important;font-size:12px!important;font-weight:900!important; } #ggFamiliarStatsBtnV348.gg-v355-chat-stats-toggle .gg-v355-toggle-star{font-size:18px;line-height:1;display:block!important} #ggFamiliarStatsBtnV348.gg-v355-chat-stats-toggle .gg-v355-toggle-word{display:block!important;line-height:1;white-space:nowrap} .gg-familiar-card-v339.gg-stats-open-v348 #ggFamiliarStatsBtnV348.gg-v355-chat-stats-toggle{background:linear-gradient(180deg,#3b321d,#1b1710)!important} .gg-fam-stats-nav-v355{position:sticky;top:0;z-index:80;padding:0 0 10px;background:linear-gradient(180deg,#101015 78%,rgba(16,16,21,0));} #ggFamBackToChatV355{width:100%;min-height:42px;border:1px solid rgba(215,176,91,.58);border-radius:13px;background:linear-gradient(180deg,#302919,#17141a);color:#f6db90;font:900 14px/1.1 Inter,system-ui,sans-serif;box-shadow:0 5px 14px rgba(0,0,0,.18)} #ggFamBackToChatV355 span{font-size:18px;margin-right:6px} .gg-familiar-assistant-v339.gg-v355-visual-safe{ position:fixed!important; left:var(--gg-v355-vleft,0px)!important;top:var(--gg-v355-vtop,0px)!important; width:var(--gg-v355-vw,100vw)!important;height:var(--gg-v355-vh,100dvh)!important; inset:auto!important;max-width:none!important;max-height:none!important; display:flex!important;align-items:center!important;justify-content:center!important; overflow:hidden!important;box-sizing:border-box!important;padding:8px!important; } .gg-familiar-assistant-v339.gg-v355-visual-safe[hidden]{display:none!important} .gg-familiar-card-v339.gg-v355-visual-safe-card{ width:min(720px,calc(var(--gg-v355-vw,100vw) - 16px))!important; max-width:calc(var(--gg-v355-vw,100vw) - 16px)!important; max-height:calc(var(--gg-v355-vh,100dvh) - 16px)!important; min-height:0!important;margin:0!important;box-sizing:border-box!important;overflow:hidden!important; } .gg-familiar-card-v339.gg-v355-visual-safe-card.gg-stats-open-v348{align-self:center!important} .gg-familiar-card-v339.gg-v355-visual-safe-card .gg-familiar-stats-drawer-v348{min-height:0!important;max-height:none!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior:contain!important;padding-bottom:18px!important} /* Avatar Studio only: fill exactly the iPhone viewport and never create a sideways document. */ html.gg-avatar-width-v355,body.avatar-page.gg-avatar-width-v355{width:100%!important;min-width:0!important;max-width:100%!important;margin:0!important;overflow-x:hidden!important;overscroll-behavior-x:none!important} body.avatar-page.gg-avatar-width-v355{position:relative!important} body.avatar-page.gg-avatar-width-v355>header,body.avatar-page.gg-avatar-width-v355>main,body.avatar-page.gg-avatar-width-v355 main>section{width:100%!important;max-width:100%!important;box-sizing:border-box!important;margin-left:0!important;margin-right:0!important} body.avatar-page.gg-avatar-width-v355 .wrap,body.avatar-page.gg-avatar-width-v355 .rich-avatar-shell,body.avatar-page.gg-avatar-width-v355 .rich-avatar-card,body.avatar-page.gg-avatar-width-v355 .gg-avatar-node-safe-v355{width:auto!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important} body.avatar-page.gg-avatar-width-v355 .rich-avatar-shell{width:100%!important;padding-left:16px!important;padding-right:16px!important} body.avatar-page.gg-avatar-width-v355 .rich-avatar-card{width:100%!important} body.avatar-page.gg-avatar-width-v355 .avatar-hero>.gg-section-familiar-v346,body.avatar-page.gg-avatar-width-v355 .avatar-hero .wrap>.gg-section-familiar-v346{display:none!important} body.avatar-page.gg-avatar-width-v355 .gg-section-familiar-v346{left:auto!important;right:8px!important;max-width:44px!important} body.avatar-page.gg-avatar-width-v355 .gg-avatar-overflow-healed-v355{max-width:100%!important;box-sizing:border-box!important;overflow-x:clip!important} body.avatar-page.gg-avatar-width-v355 .category-loop-wrap,body.avatar-page.gg-avatar-width-v355 .option-loop-wrap,body.avatar-page.gg-avatar-width-v355 .icon-loop,body.avatar-page.gg-avatar-width-v355 .option-loop{min-width:0!important;max-width:100%!important;box-sizing:border-box!important} @supports not (overflow:clip){body.avatar-page.gg-avatar-width-v355 .gg-avatar-overflow-healed-v355{overflow-x:hidden!important}} @media(max-width:680px){ .gg-fam-header-actions-v348 #ggFamiliarStatsBtnV348.gg-v355-chat-stats-toggle{min-width:68px!important;padding:0 9px!important;font-size:11px!important} .gg-familiar-assistant-v339.gg-v355-visual-safe{padding:6px!important} .gg-familiar-card-v339.gg-v355-visual-safe-card{width:calc(var(--gg-v355-vw,100vw) - 12px)!important;max-width:calc(var(--gg-v355-vw,100vw) - 12px)!important;max-height:calc(var(--gg-v355-vh,100dvh) - 12px)!important} body.avatar-page.gg-avatar-width-v355 .rich-avatar-shell{padding-left:10px!important;padding-right:10px!important} } /* ========================================================== v358 — Light & Dark Familiar Theme System ========================================================== */ .gg-theme-fam-fx-v358{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:2147483600} .gg-theme-feather-v358{position:absolute;font-style:normal;font-size:18px;opacity:0;animation:ggThemeFeatherV358 ease-out forwards;filter:drop-shadow(0 0 6px rgba(0,0,0,.18))} .gg-theme-feather-v358.dove{color:#fff8d8;text-shadow:0 0 8px rgba(255,216,110,.65)} .gg-theme-feather-v358.crow{color:#24212d;text-shadow:0 0 8px rgba(150,100,255,.55)} @keyframes ggThemeFeatherV358{0%{opacity:0;transform:translate3d(0,0,0) rotate(0) scale(.7)}15%{opacity:1}100%{opacity:0;transform:translate3d(var(--dx),var(--dy),0) rotate(var(--rot)) scale(1.12)}} .gg-familiar-card-v339.gg-fam-dove-theme-v358{box-shadow:0 20px 70px rgba(0,0,0,.42),0 0 34px rgba(255,214,111,.25)!important;border-color:rgba(232,220,186,.72)!important} .gg-familiar-card-v339.gg-fam-crow-theme-v358{box-shadow:0 20px 70px rgba(0,0,0,.55),0 0 34px rgba(128,91,200,.28)!important;border-color:rgba(178,166,205,.55)!important} .gg-familiar-card-v339.gg-fam-dove-theme-v358 #ggFamiliarPortraitV339{box-shadow:0 0 24px rgba(255,224,145,.38)!important} .gg-familiar-card-v339.gg-fam-crow-theme-v358 #ggFamiliarPortraitV339{box-shadow:0 0 24px rgba(142,106,220,.34)!important} .gg-theme-fam-panel-v358{display:grid;gap:10px;padding:12px;border:1px solid rgba(215,176,91,.24);border-radius:14px;background:rgba(255,255,255,.035)} .gg-theme-fam-row-v358{display:flex;justify-content:space-between;gap:12px;align-items:center} .gg-theme-fam-row-v358>div{display:grid;gap:2px}.gg-theme-fam-row-v358 small{opacity:.72} #ggFollowThemeV358{min-width:54px;border-radius:999px;padding:7px 12px;border:1px solid rgba(255,255,255,.18);background:#25252b;color:#ddd;font-weight:900} #ggFollowThemeV358.on{background:linear-gradient(145deg,#ead690,#b99139);color:#15120c} .gg-theme-fam-details-v358{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.gg-theme-fam-details-v358 small{grid-column:1/-1;opacity:.75} #ggThemeFamAbilityV358{border-radius:10px;padding:8px 10px} #ggFamiliarBuilderV339 .pet-grid[data-gg-grouped358="1"]{display:grid!important;grid-template-columns:1fr!important;gap:10px!important} .gg-fam-group-v358{display:grid;gap:6px;padding:8px;border-radius:12px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.07)} .gg-fam-group-v358>strong{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;opacity:.8} .gg-fam-group-v358>div{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:8px} .dove-pet .pet-hover,.crow-pet .pet-hover{animation:ggBirdIdleV358 2.8s ease-in-out infinite} @keyframes ggBirdIdleV358{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-3px) rotate(1deg)}} html[data-gg-site-theme="sun"] .theme-orb.sun,html[data-gg-site-theme="moon"] .theme-orb.moon{border-color:#d7b05b!important;box-shadow:0 0 0 2px rgba(215,176,91,.22),0 8px 22px rgba(0,0,0,.25)!important;transform:scale(1.04)} /* ========================================================== v359 — Familiar assistant tap repair + avatar gutter/shadow cleanup ========================================================== */ body.avatar-page{overflow-x:hidden!important} body.avatar-page .avatar-stage svg{filter:none!important} body.avatar-page .wrap, body.avatar-page main .wrap{max-width:100%!important;box-sizing:border-box!important} @media(max-width:820px){ body.avatar-page .wrap, body.avatar-page main .wrap{padding-left:10px!important;padding-right:10px!important} body.avatar-page .rich-builder-section{padding-top:12px!important;padding-bottom:72px!important} body.avatar-page .avatar-builder-section>.wrap, body.avatar-page .rich-avatar-shell{max-width:100%!important;width:100%!important;padding-left:0!important;padding-right:0!important} body.avatar-page .rich-avatar-card{width:100%!important;margin-left:0!important;margin-right:0!important;padding-left:8px!important;padding-right:8px!important;box-shadow:none!important} body.avatar-page .rich-avatar-card .avatar-stage{max-width:none!important;width:100%!important} body.avatar-page .option-drawer, body.avatar-page .avatar-mood-card-v068, body.avatar-page .avatar-utility-panel, body.avatar-page .utility-block, body.avatar-page #ggFamiliarBuilderV339{margin-left:0!important;margin-right:0!important;box-shadow:none!important} body.avatar-page .icon-loop, body.avatar-page .option-loop{padding-left:8vw!important;padding-right:8vw!important} } .gg-familiar-trigger-v339, .gg-section-familiar-v346, .gg-familiar-guide-btn-v341{touch-action:manipulation!important} /* ========================================================== v362 — final stability / mobile cleanup ========================================================== */ html,body{max-width:100%;} .gg-familiar-trigger-v339,.gg-section-familiar-v346,.gg-familiar-guide-btn-v341{pointer-events:auto!important;touch-action:manipulation!important;-webkit-tap-highlight-color:transparent!important} /* Home header: keep the right icon cluster safely inside narrow iPhone viewports. */ body.home-only.gg-v362-home-header-safe header nav{display:flex!important;align-items:center!important;gap:6px!important;min-width:0!important} body.home-only.gg-v362-home-header-safe .gg-brand-text-v238{flex:1 1 auto!important;min-width:0!important;max-width:none!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important} body.home-only.gg-v362-home-header-safe .gg-home-nav-v245{flex:0 0 auto!important;min-width:0!important} body.home-only.gg-v362-home-header-safe .gg-home-right-icons-v245{flex:0 0 auto!important;display:flex!important;gap:4px!important;padding-right:max(4px,env(safe-area-inset-right))!important;transform:none!important} /* Avatar Studio: nearly edge-to-edge on mobile, no unwanted card/avatar drop shadow. */ body.avatar-page.gg-v362-avatar-clean{overflow-x:hidden!important} body.avatar-page.gg-v362-avatar-clean .avatar-stage svg{filter:none!important} body.avatar-page.gg-v362-avatar-clean .rich-avatar-card{box-shadow:none!important} body.avatar-page.gg-v362-avatar-clean .option-drawer, body.avatar-page.gg-v362-avatar-clean .avatar-mood-card-v068, body.avatar-page.gg-v362-avatar-clean .avatar-utility-panel, body.avatar-page.gg-v362-avatar-clean .utility-block, body.avatar-page.gg-v362-avatar-clean #ggFamiliarBuilderV339{box-shadow:none!important} @media(max-width:820px){ body.avatar-page.gg-v362-avatar-clean main>.avatar-builder-section>.wrap, body.avatar-page.gg-v362-avatar-clean .avatar-builder-section>.wrap, body.avatar-page.gg-v362-avatar-clean .rich-avatar-shell{width:100%!important;max-width:100%!important;padding-left:4px!important;padding-right:4px!important;margin-left:0!important;margin-right:0!important;box-sizing:border-box!important} body.avatar-page.gg-v362-avatar-clean .rich-avatar-card{width:100%!important;max-width:100%!important;margin:0!important;padding-left:6px!important;padding-right:6px!important;border-radius:18px!important;box-sizing:border-box!important} body.avatar-page.gg-v362-avatar-clean .rich-avatar-card .avatar-stage{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important} body.avatar-page.gg-v362-avatar-clean .category-loop-wrap, body.avatar-page.gg-v362-avatar-clean .option-loop-wrap, body.avatar-page.gg-v362-avatar-clean .icon-loop, body.avatar-page.gg-v362-avatar-clean .option-loop{max-width:100%!important;box-sizing:border-box!important} body.avatar-page.gg-v362-avatar-clean .icon-loop, body.avatar-page.gg-v362-avatar-clean .option-loop{padding-left:7vw!important;padding-right:7vw!important} } /* v363 — stronger sun-mode home hero so first load and hero top never look dark in sun mode */ html[data-gg-site-theme="sun"] .home-only .hero{ background:linear-gradient(180deg,#f6edd8 0%,#edd8a8 62%,#e6e6e8 100%)!important; border-bottom:1px solid rgba(0,0,0,.14)!important; } html[data-gg-site-theme="sun"] .home-only .hero .kicker, html[data-gg-site-theme="sun"] .home-only .hero h1, html[data-gg-site-theme="sun"] .home-only .hero p, html[data-gg-site-theme="sun"] .home-only .hero .amp{ color:#111!important; text-shadow:none!important; } html[data-gg-site-theme="sun"] .home-only .hero .btn.alt{ background:#f3efe5!important; color:#111!important; border-color:rgba(0,0,0,.18)!important; } html[data-gg-site-theme="sun"] .home-only .hero-loop-frame{ background:linear-gradient(180deg,#f5efe0,#d9c18a)!important; border-color:rgba(0,0,0,.14)!important; box-shadow:0 16px 34px rgba(0,0,0,.12)!important; } html[data-gg-site-theme="sun"] .home-only .hero-loop-frame:after{ background:linear-gradient(180deg,transparent,rgba(255,255,255,.18))!important; } /* v363 — familiar trigger hardening */ .gg-familiar-trigger-v339, .gg-section-familiar-v346, .gg-familiar-guide-btn-v341, #ggFamiliarPortraitV339, #ggFamiliarRoomHostV339, [data-open-familiar]{ pointer-events:auto!important; touch-action:manipulation!important; -webkit-tap-highlight-color:transparent!important; } #ggFamiliarRoomHostV339{cursor:pointer!important} /* v363 — Dove redesign looks more like a bird */ .dove-pet .pet-hover{ transform-origin:center center; } .dove-pet .pet-hover svg{ overflow:visible; } /* v364 — remove avatar under-shadow and stage drop shadow */ .avatar-stage svg{filter:none!important} body.avatar-page #avatarSvg ellipse[fill="#111116"], body.avatar-page #avatarSvg ellipse[fill="#111"]{display:none!important} /* v364 — familiar assistant force-open safety */ .gg-familiar-assistant-v339{z-index:2147483646!important} .gg-familiar-assistant-v339:not([hidden]){display:grid!important;visibility:visible!important;opacity:1!important} .gg-familiar-trigger-v339, #ggFamiliarTriggerV339, #ggFamiliarRoomHostV339, .gg-section-familiar-v346, .gg-familiar-guide-btn-v341, #ggFamiliarPortraitV339, [data-open-familiar]{cursor:pointer!important;pointer-events:auto!important} /* v364 — birdier dove and crow presentation */ .dove-pet .pet-model-v345,.crow-pet .pet-model-v345{overflow:visible!important} .dove-pet .pet-hover,.crow-pet .pet-hover{transform-origin:center center} /* v365 — bird remodel emphasis and stronger familiar helper affordance */ .dove-pet .pet-hover,.crow-pet .pet-hover{animation:ggFamBirdBobV365 2.7s ease-in-out infinite} @keyframes ggFamBirdBobV365{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}} .gg-familiar-guide-btn-v341,.gg-section-familiar-v346,.gg-familiar-trigger-v339,#ggFamiliarRoomHostV339,[data-open-familiar]{cursor:pointer!important} .gg-familiar-guide-btn-v341:active,.gg-section-familiar-v346:active,.gg-familiar-trigger-v339:active{transform:scale(.96)!important} /* v366 — full-body Dove/Crow bird remodel */ .dove-pet .pet-model-v345,.crow-pet .pet-model-v345{width:100%!important;height:100%!important;overflow:visible!important} .dove-wing-v366.left,.crow-wing-v366.left{transform-origin:58px 58px;animation:ggBirdWingLV366 .95s cubic-bezier(.42,0,.2,1) infinite} .dove-wing-v366.right,.crow-wing-v366.right{transform-origin:62px 58px;animation:ggBirdWingRV366 .95s cubic-bezier(.42,0,.2,1) infinite} .dove-wing-v366.feather.left,.crow-wing-v366.feather.left{transform-origin:56px 60px;animation:ggBirdWingL2V366 .95s cubic-bezier(.42,0,.2,1) infinite} .dove-wing-v366.feather.right,.crow-wing-v366.feather.right{transform-origin:64px 60px;animation:ggBirdWingR2V366 .95s cubic-bezier(.42,0,.2,1) infinite} @keyframes ggBirdWingLV366{0%,100%{transform:rotate(10deg) translateY(0)}50%{transform:rotate(-26deg) translateY(-4px)}} @keyframes ggBirdWingRV366{0%,100%{transform:rotate(-10deg) translateY(0)}50%{transform:rotate(26deg) translateY(-4px)}} @keyframes ggBirdWingL2V366{0%,100%{transform:rotate(7deg) translateY(0)}50%{transform:rotate(-20deg) translateY(-2px)}} @keyframes ggBirdWingR2V366{0%,100%{transform:rotate(-7deg) translateY(0)}50%{transform:rotate(20deg) translateY(-2px)}} .dove-tail-v366,.crow-tail-v366{transform-origin:60px 92px;animation:ggBirdTailV366 1.45s ease-in-out infinite} @keyframes ggBirdTailV366{0%,100%{transform:rotate(0)}50%{transform:rotate(6deg)}} /* v366 — one canonical assistant overlay */ #ggFamiliarAssistantV339:not([hidden]){display:grid!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;z-index:2147483646!important} #ggFamiliarAssistantV339 .gg-familiar-backdrop-v339{pointer-events:auto!important} #ggFamiliarAssistantV339 .gg-familiar-card-v339{pointer-events:auto!important} .gg-familiar-trigger-v339,.gg-section-familiar-v346,.gg-familiar-guide-btn-v341,#ggFamiliarPortraitV339,#ggFamiliarRoomHostV339,[data-open-familiar]{pointer-events:auto!important;touch-action:manipulation!important;cursor:pointer!important} /* ========================================================== v369 — Familiar top layer + non-pausing assistant + Sun silver UI ========================================================== */ /* Familiar always stays above room scenery, furniture, decor and avatar layers, while HUD controls remain above it. */ #avatarRoom #ggFamiliarRoomHostV339, #avatarRoom .gg-familiar-room-host-v339{ z-index:2147483002!important; isolation:isolate!important; pointer-events:auto!important; } #avatarRoom #ggFamiliarRoomHostV339 .gg-familiar-room-avatar-v339, #avatarRoom #ggFamiliarRoomHostV339 .pet-hover, #avatarRoom #ggFamiliarRoomHostV339 .pet-model-v345{ position:relative!important; z-index:1!important; } /* Opening Familiar Assistant must not freeze avatar, room, pet, light, or effect animations. */ body.gg-familiar-open-v339 #avatarRoom *, body.gg-familiar-open-v339 .gg-claw-game-v131 *, body.gg-familiar-open-v339 #avatarSvg *, body.gg-familiar-open-v339 .avatar-stage *{ animation-play-state:running!important; } /* Sun mode: replace dark UI surfaces behind copy/text with silver surfaces. Gameplay/scenery (#avatarRoom) is intentionally not included. */ html[data-gg-site-theme="sun"] body :is( .page-hero, .card, .contact-box, .portfolio-card, .shop-card, .gg-dread-card, .rich-avatar-card, .avatar-preview-card, .option-drawer, .utility-block, .avatar-mood-card-v068, .avatar-utility-panel, .room-studio-card, .room-studio-drawer, .daily-card, .room-inventory, .friend-add-card, .friend-card, .gg-v111-card, .gg-familiar-card-v339, .gg-familiar-progress-v346, .gg-familiar-living-v347, .gg-familiar-context-v346, .gg-familiar-guide-toast-v341, .gg-global-menu-v235, .gg-search-results-v144 ){ background:linear-gradient(145deg,#f2f4f7 0%,#c9ced6 52%,#aeb5bf 100%)!important; color:#15171b!important; border-color:#8f98a5!important; box-shadow:0 10px 24px rgba(72,82,96,.14)!important; } html[data-gg-site-theme="sun"] body :is( .page-hero, .card, .contact-box, .portfolio-card, .shop-card, .gg-dread-card, .rich-avatar-card, .avatar-preview-card, .option-drawer, .utility-block, .avatar-mood-card-v068, .avatar-utility-panel, .room-studio-card, .room-studio-drawer, .daily-card, .room-inventory, .friend-add-card, .friend-card, .gg-v111-card, .gg-familiar-card-v339, .gg-familiar-progress-v346, .gg-familiar-living-v347, .gg-familiar-context-v346, .gg-familiar-guide-toast-v341, .gg-global-menu-v235, .gg-search-results-v144 ) :is(h1,h2,h3,h4,h5,p,small,span,strong,b,label,em,li){ color:#15171b!important; text-shadow:none!important; } /* Sun-mode text-entry fields inside silver panels. */ html[data-gg-site-theme="sun"] body :is(.gg-familiar-card-v339,.rich-avatar-card,.room-studio-card,.gg-v111-card) :is(input,textarea,select){ background:#f7f8fa!important; color:#15171b!important; border-color:#939ba6!important; } /* Keep action buttons visually separate from silver content surfaces. */ html[data-gg-site-theme="sun"] body :is(.gg-familiar-card-v339,.room-studio-card,.rich-avatar-card,.gg-global-menu-v235) button:not(.gg-familiar-close-v339){ border-color:#9b7a2d!important; } /* ========================================================== v370 — canonical Familiar AI + silver assistant system ========================================================== */ /* Grim floating button is silver. */ .floating-portfolios .float-choice.grim, .float-choice.grim{ background:linear-gradient(145deg,#f3f5f7 0%,#c5cbd3 52%,#9fa7b2 100%)!important; color:#111318!important; border-color:#7e8792!important; box-shadow:0 8px 22px rgba(34,41,50,.24)!important; } /* All AI/Familiar assistance boxes are silver in every theme. */ .gg-ai-card-v370, .gg-ai-context-v370, .gg-ai-helper-v370, .gg-fam-tutorial-card-v370{ background:linear-gradient(145deg,#f5f7f9 0%,#d6dbe1 48%,#aeb6c0 100%)!important; color:#14171c!important; border:1px solid #8d96a2!important; box-shadow:0 16px 48px rgba(36,43,53,.24)!important; } .gg-ai-card-v370 *, .gg-ai-context-v370 *, .gg-fam-tutorial-card-v370 *{color:#14171c} .gg-ai-assistant-v370{position:fixed;inset:0;z-index:2147483647;display:grid;place-items:center;padding:max(8px,env(safe-area-inset-top)) 8px max(8px,env(safe-area-inset-bottom));opacity:0;visibility:hidden;pointer-events:none;transition:opacity .16s ease,visibility .16s ease} .gg-ai-assistant-v370[hidden]{display:none!important} .gg-ai-assistant-v370.open{opacity:1;visibility:visible;pointer-events:auto} .gg-ai-backdrop-v370{position:absolute;inset:0;background:rgba(4,6,10,.72);backdrop-filter:blur(7px)} .gg-ai-card-v370{position:relative;z-index:1;width:min(720px,calc(100vw - 16px));max-height:calc(100dvh - 18px);border-radius:22px;padding:14px;display:flex;flex-direction:column;gap:10px;overflow:hidden;transform:translateY(16px) scale(.96);opacity:0;transition:transform .2s cubic-bezier(.2,.8,.2,1),opacity .18s ease} .gg-ai-assistant-v370.open .gg-ai-card-v370{transform:translateY(0) scale(1);opacity:1} .gg-ai-close-v370{position:absolute;right:10px;top:8px;width:36px;height:36px;border-radius:999px;border:1px solid #8f98a3;background:#eef1f4;color:#17191e;font-size:20px;z-index:3} .gg-ai-head-v370{display:grid;grid-template-columns:58px minmax(0,1fr);gap:10px;align-items:center;padding-right:38px;min-height:60px} .gg-ai-pet-v370{width:58px;height:58px;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:linear-gradient(145deg,#fff,#c6ccd4);border:1px solid #8c95a0} .gg-ai-pet-v370 .gg-familiar-avatar-v339{width:105px!important;height:105px!important;transform:scale(.5)!important;transform-origin:center!important} .gg-ai-title-v370 strong{display:block;font-size:18px}.gg-ai-title-v370 small{display:block;color:#4d5560!important;margin-top:2px} .gg-ai-context-v370{border-radius:14px;padding:9px 11px;display:grid;gap:3px}.gg-ai-context-v370[hidden]{display:none!important}.gg-ai-context-v370 span,.gg-ai-context-v370 small{color:#3b424d!important} .gg-ai-suggestions-v370{display:flex;gap:7px;overflow-x:auto;padding-bottom:2px}.gg-ai-suggestions-v370 button{flex:0 0 auto;border:1px solid #930aa5;background:#f6f7f9;color:#16181d;border-radius:999px;padding:8px 10px;font-weight:700} .gg-ai-chat-v370{min-height:180px;max-height:42vh;overflow:auto;display:flex;flex-direction:column;gap:8px;padding:4px 2px} .gg-ai-msg-v370{display:flex;align-items:flex-start;gap:8px}.gg-ai-msg-v370.user{justify-content:flex-end}.gg-ai-msg-v370 span{display:block;max-width:82%;padding:9px 11px;border-radius:13px;background:#eef1f4;color:#15181d!important;border:1px solid #a3abb5}.gg-ai-msg-v370.user span{background:#272b31;color:#fff!important;border-color:#272b31}.gg-ai-msg-v370 i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:#e2e6eb;border:1px solid #99a2ad}.gg-ai-msg-v370 i .gg-familiar-avatar-v339{width:78px!important;height:78px!important;transform:scale(.36)!important;transform-origin:center!important} .gg-ai-typing-v370{height:16px;display:flex;gap:4px;align-items:center}.gg-ai-typing-v370[hidden]{display:none!important}.gg-ai-typing-v370 i{width:6px;height:6px;border-radius:50%;background:#555d68;animation:ggAiDotV370 .8s ease-in-out infinite}.gg-ai-typing-v370 i:nth-child(2){animation-delay:.12s}.gg-ai-typing-v370 i:nth-child(3){animation-delay:.24s}@keyframes ggAiDotV370{0%,100%{transform:translateY(0);opacity:.45}50%{transform:translateY(-3px);opacity:1}} .gg-ai-form-v370{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.gg-ai-form-v370 input{min-width:0;border-radius:13px;border:1px solid #8e97a2;background:#fff;color:#16181d;padding:12px}.gg-ai-form-v370 button{border:1px solid #927124;background:#d7b05b;color:#161109;border-radius:13px;padding:0 16px;font-weight:900} body.gg-ai-open-v370{overflow:hidden} /* Section helpers: silver mini boxes with the active Familiar visible. */ .gg-ai-helper-host-v370{position:relative!important} .gg-ai-helper-v370{position:absolute;right:10px;top:10px;width:44px;height:44px;border-radius:13px;padding:0;display:grid;place-items:center;overflow:hidden;z-index:50;cursor:pointer;touch-action:manipulation} .gg-ai-helper-v370 .gg-familiar-avatar-v339{width:96px!important;height:96px!important;transform:scale(.36)!important;transform-origin:center!important} /* Pet response before / during assistant opening. */ .gg-pet-react-v370{animation:ggPetReactV370 .48s ease!important}@keyframes ggPetReactV370{0%,100%{transform:translateY(0) scale(1)}30%{transform:translateY(-6px) scale(1.06)}62%{transform:translateY(-2px) scale(.98)}} .gg-pet-reaction-bubble-v370{position:absolute;left:50%;top:-18px;transform:translateX(-50%);padding:4px 7px;border-radius:999px;background:#f0f2f5;color:#16181d;font-size:10px;font-weight:900;border:1px solid #930aa5;white-space:nowrap;z-index:2147483003} .gg-pet-reaction-bubble-v370[hidden]{display:none!important} /* Familiar idle personalities. */ .dog-head .pet-hover{animation:ggIdleDogV370 2.5s ease-in-out infinite!important}@keyframes ggIdleDogV370{0%,86%,100%{transform:translateY(0) rotate(0)}92%{transform:translateY(-3px) rotate(2deg)}} .cat-head .pet-hover{animation:ggIdleCatV370 3.2s ease-in-out infinite!important}@keyframes ggIdleCatV370{0%,100%{transform:rotate(-1deg)}50%{transform:rotate(1.5deg)}} .ghost .pet-hover{animation:ggIdleGhostV370 2.8s ease-in-out infinite!important}@keyframes ggIdleGhostV370{0%,100%{transform:translateY(1px)}50%{transform:translateY(-5px)}} .bat-pet .pet-hover,.bat .pet-hover{animation:ggIdleBatV370 1.15s ease-in-out infinite!important}@keyframes ggIdleBatV370{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-4px) rotate(1deg)}} .bunny-pet .pet-hover,.bunny .pet-hover{animation:ggIdleBunnyV370 2.3s ease-in-out infinite!important}@keyframes ggIdleBunnyV370{0%,85%,100%{transform:translateY(0)}92%{transform:translateY(-6px)}} .mini-dragon .pet-hover,.miniDragon .pet-hover{animation:ggIdleDragonV370 2.2s ease-in-out infinite!important}@keyframes ggIdleDragonV370{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px) scale(1.02)}} /* Room depth: Familiar always foreground, room objects continue y-based sorting. */ #avatarRoom #ggFamiliarRoomHostV339{z-index:2147483002!important;pointer-events:auto!important} #avatarRoom :is([data-room-object],[data-room-decor],#roomFloorDecorV061,#roomWallDecorV061){will-change:transform} /* First-time 3-step tutorial. */ .gg-fam-tutorial-v370{position:fixed;inset:0;z-index:2147483645;display:grid;place-items:center;padding:16px;background:rgba(4,6,10,.52);backdrop-filter:blur(5px)} .gg-fam-tutorial-card-v370{position:relative;width:min(390px,94vw);border-radius:20px;padding:18px;display:grid;gap:10px}.gg-fam-tutorial-card-v370>.x{position:absolute;right:10px;top:8px;border:0;background:transparent;font-size:22px}.gg-fam-tutorial-card-v370>small{font-weight:900;letter-spacing:.08em;color:#5c636e!important}.gg-fam-tutorial-card-v370>strong{font-size:24px}.gg-fam-tutorial-card-v370>p{margin:0;line-height:1.45}.gg-fam-tutorial-card-v370>div{display:flex;justify-content:flex-end;gap:8px}.gg-fam-tutorial-card-v370 button{border:1px solid #89929d;border-radius:12px;padding:8px 12px;background:#f5f6f8;color:#15171b;font-weight:800}.gg-fam-tutorial-card-v370 .next{background:#d7b05b;border-color:#9d7725} /* Sun-mode startup: broader silver treatment for text containers and dark content boxes. */ html[data-gg-site-theme="sun"] body :is(.half,.contact,.selected-work,.portfolio-intro,.shop-promo-shell,.shop-promo-slide,.account-card,.settings-card,.friends-card,.discoveries-card,.room-drawer,.room-panel,[class*="info-box"],[class*="text-box"]){background:linear-gradient(145deg,#f1f3f6,#cbd1d8)!important;color:#15171b!important;border-color:#930ba7!important} html[data-gg-site-theme="sun"] body :is(.half,.contact,.selected-work,.portfolio-intro,.shop-promo-shell,.shop-promo-slide,.account-card,.settings-card,.friends-card,.discoveries-card,.room-drawer,.room-panel,[class*="info-box"],[class*="text-box"]) :is(h1,h2,h3,h4,p,small,span,strong,label){color:#15171b!important;text-shadow:none!important} @media(max-width:680px){ .gg-ai-card-v370{width:calc(100vw - 12px);max-height:calc(100dvh - 12px);padding:11px;border-radius:18px;gap:8px} .gg-ai-chat-v370{max-height:38vh} .gg-ai-helper-v370{right:7px;top:7px;width:38px;height:38px;border-radius:11px} .gg-ai-helper-v370 .gg-familiar-avatar-v339{transform:scale(.31)!important} .gg-ai-suggestions-v370{scrollbar-width:none}.gg-ai-suggestions-v370::-webkit-scrollbar{display:none} } /* v371 — assistant layout polish, gold star return, home services helper */ .gg-ai-card-v370{ background:linear-gradient(180deg,#ead083 0%,#e2c36c 100%)!important; border:1px solid #b59139!important; box-shadow:0 18px 54px rgba(66,50,14,.28)!important; } .gg-ai-head-v370{ grid-template-columns:56px minmax(0,1fr) auto; align-items:center; gap:12px; background:#f3f5f8; border:1px solid #a6afba; border-radius:18px; padding:10px 12px; padding-right:54px; } .gg-ai-pet-v370{width:54px;height:54px;box-shadow:inset 0 1px 0 rgba(255,255,255,.85)} .gg-ai-pet-v370 .gg-familiar-avatar-v339{width:92px!important;height:92px!important;transform:scale(.46)!important} .gg-ai-title-v370 strong{font-size:17px;line-height:1.1} .gg-ai-title-v370 small{font-size:13px} .gg-ai-star-v370{ width:40px;height:40px;border-radius:14px;border:1px solid #a67e21; background:linear-gradient(180deg,#f7e59d 0%,#d7b05b 100%); color:#6d4d00;font-size:24px;line-height:1;display:grid;place-items:center; box-shadow:0 8px 18px rgba(145,111,24,.28), inset 0 1px 0 rgba(255,255,255,.55); } .gg-ai-context-v370{padding:12px 14px;border-radius:18px} .gg-ai-context-v370 strong{font-size:15px;margin-bottom:2px} .gg-ai-suggestions-v370{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .gg-ai-suggestions-v370 button{white-space:normal;text-align:center;line-height:1.2;min-height:44px;padding:10px 12px;border-radius:999px;box-shadow:0 2px 0 rgba(255,255,255,.45) inset} .gg-ai-chat-v370{background:transparent;min-height:150px;max-height:36vh;padding:2px 0 4px} .gg-ai-msg-v370{align-items:flex-start} .gg-ai-msg-v370 i{flex:0 0 44px;width:44px;height:44px} .gg-ai-msg-v370 i .gg-familiar-avatar-v339{width:82px!important;height:82px!important;transform:scale(.38)!important} .gg-ai-msg-v370 span{background:#f3f5f8;border:1px solid #a2abb6;border-radius:18px;padding:14px 16px;max-width:calc(100% - 58px)} .gg-ai-form-v370{grid-template-columns:minmax(0,1fr) 116px;align-items:stretch;margin-top:4px} .gg-ai-form-v370 input{min-height:58px;border-radius:18px;background:#f7f8fa} .gg-ai-form-v370 button{min-height:58px;border-radius:18px;box-shadow:inset 0 1px 0 rgba(255,255,255,.55)} .gg-ai-helper-v370{box-shadow:0 8px 18px rgba(36,43,53,.18)!important} html[data-gg-site-theme="sun"] .gg-ai-helper-v370{background:linear-gradient(145deg,#f5f7f9 0%,#d6dbe1 48%,#aeb6c0 100%)!important;border-color:#8d96a2!important} #services .section-title.gg-ai-helper-host-v370{padding-right:64px} #services .section-title .gg-ai-helper-v370{right:0;top:4px} @media(max-width:680px){ .gg-ai-card-v370{padding:10px;border-radius:20px;width:calc(100vw - 16px)} .gg-ai-head-v370{grid-template-columns:50px minmax(0,1fr) auto;padding:9px 10px;padding-right:46px;gap:10px} .gg-ai-pet-v370{width:50px;height:50px} .gg-ai-pet-v370 .gg-familiar-avatar-v339{width:86px!important;height:86px!important;transform:scale(.44)!important} .gg-ai-title-v370 strong{font-size:16px} .gg-ai-title-v370 small{font-size:12px} .gg-ai-star-v370{width:36px;height:36px;font-size:22px;border-radius:12px} .gg-ai-suggestions-v370{grid-template-columns:1fr 1fr} .gg-ai-suggestions-v370 button{font-size:12px;padding:9px 10px;min-height:42px} .gg-ai-chat-v370{min-height:120px;max-height:30vh} .gg-ai-msg-v370 span{padding:12px 14px;font-size:14px;line-height:1.4;max-width:calc(100% - 54px)} .gg-ai-form-v370{grid-template-columns:minmax(0,1fr) 104px;gap:10px} .gg-ai-form-v370 input,.gg-ai-form-v370 button{min-height:52px} } /* v372 — smoother assistant card, softer palette, centered pet portrait */ .gg-ai-card-v370{ background:linear-gradient(180deg,#f6f1df 0%,#efdca0 46%,#ead18a 100%)!important; border:1px solid #bb9c4f!important; box-shadow:0 20px 58px rgba(56,43,12,.20)!important; } .gg-ai-close-v370{ background:linear-gradient(180deg,#f6f8fa 0%,#d7dde4 100%)!important; border-color:#a2aab5!important; box-shadow:0 4px 10px rgba(28,34,43,.10)!important; } .gg-ai-head-v370,.gg-ai-context-v370,.gg-ai-msg-v370 span,.gg-ai-form-v370 input{ background:linear-gradient(180deg,#f7f8fa 0%,#e6ebf1 100%)!important; border-color:#aab2bc!important; } .gg-ai-head-v370{ border-radius:20px!important; padding:12px 14px!important; gap:14px!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 6px 18px rgba(91,99,110,.08)!important; } .gg-ai-title-v370 strong{font-size:18px!important;letter-spacing:-.01em} .gg-ai-title-v370 small{font-size:13px!important;color:#565f6b!important} .gg-ai-star-v370{ background:linear-gradient(180deg,#f6e39f 0%,#deb65c 100%)!important; box-shadow:0 8px 16px rgba(145,111,24,.22), inset 0 1px 0 rgba(255,255,255,.62)!important; } .gg-ai-context-v370{ border-radius:20px!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.72)!important; } .gg-ai-suggestions-v370 button{ background:linear-gradient(180deg,#f9fafb 0%,#edf1f5 100%)!important; border-color:#a7b0bb!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.78),0 2px 6px rgba(70,78,88,.06)!important; } .gg-ai-chat-v370{gap:10px!important} .gg-ai-msg-v370 i, .gg-ai-pet-v370{ background:radial-gradient(circle at 32% 24%,#ffffff 0%,#f3f6f9 34%,#dce2e8 68%,#c5ccd5 100%)!important; border:1px solid #9ea8b3!important; overflow:hidden!important; position:relative!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 3px 8px rgba(69,76,88,.10)!important; } .gg-ai-pet-v370{width:58px!important;height:58px!important;border-radius:50%!important} .gg-ai-pet-v370 .gg-familiar-avatar-v339{ width:118px!important;height:118px!important; transform:scale(.34) translate(-4px,-7px)!important; transform-origin:center center!important; margin:0 auto!important; } .gg-ai-msg-v370 i{flex:0 0 46px!important;width:46px!important;height:46px!important} .gg-ai-msg-v370 i .gg-familiar-avatar-v339{ width:108px!important;height:108px!important; transform:scale(.31) translate(-4px,-7px)!important; transform-origin:center center!important; } .gg-ai-msg-v370 span{ border-radius:20px!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.72)!important; line-height:1.45!important; } .gg-ai-form-v370{gap:12px!important;margin-top:8px!important} .gg-ai-form-v370 input{box-shadow:inset 0 1px 0 rgba(255,255,255,.75)!important} .gg-ai-form-v370 button{ background:linear-gradient(180deg,#efcf71 0%,#d7b055 100%)!important; border-color:#9f7927!important; box-shadow:0 6px 14px rgba(145,111,24,.18), inset 0 1px 0 rgba(255,255,255,.58)!important; } @media(max-width:680px){ .gg-ai-card-v370{width:calc(100vw - 18px)!important;padding:12px!important;border-radius:22px!important} .gg-ai-head-v370{padding:11px 12px!important;gap:12px!important} .gg-ai-pet-v370{width:56px!important;height:56px!important} .gg-ai-pet-v370 .gg-familiar-avatar-v339{width:116px!important;height:116px!important;transform:scale(.33) translate(-4px,-7px)!important} .gg-ai-msg-v370 i{width:44px!important;height:44px!important;flex-basis:44px!important} .gg-ai-msg-v370 i .gg-familiar-avatar-v339{width:104px!important;height:104px!important;transform:scale(.30) translate(-4px,-7px)!important} .gg-ai-form-v370{grid-template-columns:minmax(0,1fr) 110px!important} } /* ========================================================== v373 — Silver assistant shell + real Familiar info view ========================================================== */ .gg-ai-card-v370{ background:linear-gradient(145deg,#f8f9fb 0%,#e7ebf0 48%,#cfd6de 100%)!important; border:1px solid #a99a6a!important; box-shadow:0 22px 62px rgba(32,38,47,.28),0 0 0 1px rgba(255,255,255,.6) inset!important; padding:12px!important; gap:10px!important; } .gg-ai-card-v370:before{ content:"";position:absolute;left:18px;right:18px;top:0;height:3px;border-radius:0 0 999px 999px; background:linear-gradient(90deg,transparent,#d7b05b 18%,#f1d780 50%,#d7b05b 82%,transparent);opacity:.86;z-index:2; } .gg-ai-head-v370{ grid-template-columns:60px minmax(0,1fr) 42px!important; background:linear-gradient(180deg,#ffffff 0%,#eef2f6 100%)!important; border:1px solid #a9b1bc!important; border-radius:20px!important; min-height:72px!important; padding:10px 58px 10px 12px!important; gap:12px!important; box-shadow:0 6px 18px rgba(54,63,74,.08),inset 0 1px 0 rgba(255,255,255,.92)!important; } .gg-ai-close-v370{ display:grid!important;place-items:center!important;position:absolute!important;right:16px!important;top:18px!important; width:38px!important;height:38px!important;border-radius:50%!important;z-index:100!important; border:1px solid #969faa!important;background:linear-gradient(180deg,#ffffff,#dce2e8)!important;color:#191c21!important; font-size:20px!important;font-weight:900!important;line-height:1!important;box-shadow:0 5px 13px rgba(36,43,52,.12)!important; } .gg-ai-star-v370{ grid-column:3!important;position:relative!important;right:auto!important;top:auto!important; width:40px!important;height:40px!important;border-radius:13px!important;z-index:4!important; border:1px solid #a27b25!important;background:linear-gradient(180deg,#f8e7a1 0%,#d7b05b 100%)!important;color:#221a08!important; font-size:23px!important;box-shadow:0 6px 14px rgba(132,101,28,.22),inset 0 1px 0 rgba(255,255,255,.65)!important; } .gg-ai-card-v370.info-mode .gg-ai-star-v370{background:linear-gradient(180deg,#fff2be,#e3bf68)!important;transform:scale(.96)} .gg-ai-title-v370 strong{font-size:18px!important;line-height:1.12!important}.gg-ai-title-v370 small{font-size:13px!important;color:#555e69!important} .gg-ai-context-v370{background:linear-gradient(180deg,#f8fafc,#e7ecf2)!important;border:1px solid #aab3be!important;border-radius:18px!important;padding:12px 14px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.88)!important} .gg-ai-suggestions-v370{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;overflow:visible!important} .gg-ai-suggestions-v370 button{background:linear-gradient(180deg,#fff,#eef2f6)!important;border:1px solid #a7b0ba!important;color:#15181d!important;border-radius:15px!important;min-height:44px!important;white-space:normal!important;line-height:1.2!important;box-shadow:0 3px 9px rgba(52,61,72,.06),inset 0 1px 0 rgba(255,255,255,.9)!important} .gg-ai-chat-v370{background:transparent!important;min-height:138px!important;max-height:34vh!important;gap:10px!important;padding:2px!important} .gg-ai-msg-v370 span{background:linear-gradient(180deg,#fff,#edf1f5)!important;border:1px solid #a8b1bc!important;color:#171a1f!important;border-radius:18px!important;padding:13px 15px!important;line-height:1.42!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important} .gg-ai-msg-v370.user span{background:#272d35!important;color:#fff!important;border-color:#272d35!important} .gg-ai-form-v370{grid-template-columns:minmax(0,1fr) 112px!important;gap:10px!important;margin-top:4px!important} .gg-ai-form-v370 input{background:#fff!important;border:1px solid #9da7b2!important;color:#171a1f!important;border-radius:16px!important;min-height:52px!important;padding:12px 14px!important} .gg-ai-form-v370 button{background:linear-gradient(180deg,#f3d679,#d7b05b)!important;border:1px solid #9a7627!important;color:#1d1608!important;border-radius:16px!important;min-height:52px!important;font-weight:900!important;box-shadow:0 5px 12px rgba(131,99,26,.16),inset 0 1px 0 rgba(255,255,255,.6)!important} /* Keep Familiar artwork centered in every silver AI circle. */ .gg-ai-pet-v370,.gg-ai-msg-v370 i,.gg-ai-helper-v370{position:relative!important;overflow:hidden!important;display:grid!important;place-items:center!important} .gg-ai-pet-v370{width:58px!important;height:58px!important;border-radius:50%!important;background:radial-gradient(circle at 36% 28%,#fff,#e6ebf0 62%,#c7cfd8)!important;border:1px solid #9da7b2!important} .gg-ai-pet-v370>.gg-familiar-avatar-v339{position:absolute!important;left:50%!important;top:50%!important;margin-left:-64px!important;margin-top:-64px!important;width:128px!important;height:128px!important;transform:scale(.43)!important;transform-origin:center center!important} .gg-ai-msg-v370 i{width:44px!important;height:44px!important;flex:0 0 44px!important;border-radius:50%!important;background:radial-gradient(circle at 36% 28%,#fff,#e4e9ef 65%,#c6ced7)!important;border:1px solid #9da7b2!important} .gg-ai-msg-v370 i>.gg-familiar-avatar-v339{position:absolute!important;left:50%!important;top:50%!important;margin-left:-64px!important;margin-top:-64px!important;width:128px!important;height:128px!important;transform:scale(.34)!important;transform-origin:center center!important} .gg-ai-helper-v370{background:linear-gradient(145deg,#f7f9fb,#d7dde5)!important;border:1px solid #8f99a5!important} .gg-ai-helper-v370>.gg-familiar-avatar-v339{position:absolute!important;left:50%!important;top:50%!important;margin-left:-64px!important;margin-top:-64px!important;width:128px!important;height:128px!important;transform:scale(.31)!important;transform-origin:center center!important} /* Familiar info/stats mode opened by the gold star. */ .gg-ai-info-v373[hidden]{display:none!important} .gg-ai-info-v373{display:flex;flex-direction:column;gap:12px;min-height:0;overflow:auto;padding:2px 1px 4px;color:#171a1f!important} .gg-ai-card-v370.info-mode :is(.gg-ai-context-v370,.gg-ai-suggestions-v370,.gg-ai-chat-v370,.gg-ai-typing-v370,.gg-ai-form-v370){display:none!important} .gg-ai-info-top-v373,.gg-ai-living-v373,.gg-ai-favorites-v373{background:linear-gradient(180deg,#fff,#edf1f5)!important;border:1px solid #a8b1bc!important;border-radius:18px!important;padding:14px!important;box-shadow:0 5px 14px rgba(55,64,75,.07),inset 0 1px 0 rgba(255,255,255,.92)!important} .gg-ai-info-top-v373>div:first-child,.gg-ai-info-title-v373{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px}.gg-ai-info-top-v373 strong,.gg-ai-info-title-v373 strong{font-size:18px}.gg-ai-info-title-v373 small,.gg-ai-info-top-v373 small{color:#5d6570!important} .gg-ai-bond-track-v373,.gg-ai-need-v373 b{height:10px;background:#d6dbe2;border-radius:999px;overflow:hidden;display:block;box-shadow:inset 0 1px 2px rgba(52,60,70,.15)} .gg-ai-bond-track-v373 i,.gg-ai-need-v373 b i{display:block;height:100%;width:0;background:linear-gradient(90deg,#b99743,#efd574);border-radius:999px;transition:width .25s ease} .gg-ai-need-v373{display:grid;grid-template-columns:84px minmax(0,1fr);align-items:center;gap:10px;margin:9px 0}.gg-ai-need-v373>span{font-size:13px;color:#4f5863!important} .gg-ai-personality-v373{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:9px;margin-top:12px}.gg-ai-personality-v373>span{font-weight:800}.gg-ai-personality-v373 button{border:1px solid #b0a375;background:#f5f0de;color:#6a5d32;border-radius:12px;padding:8px 10px;font-weight:800}.gg-ai-personality-v373 button:not(:disabled){background:linear-gradient(180deg,#f4d87f,#d8b35f);color:#1c1609} .gg-ai-action-grid-v373{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:12px 0}.gg-ai-action-grid-v373 button{min-height:42px;border-radius:13px;border:1px solid #9fa8b3;background:linear-gradient(180deg,#fff,#e9edf2);font-weight:900;color:#1b1e23} .gg-ai-living-v373 details{border-top:1px solid #d3d8de;padding:10px 0 2px}.gg-ai-living-v373 summary{font-weight:900;color:#6f5a20;cursor:pointer}.gg-ai-living-v373 details div{display:grid;gap:5px;padding:8px 4px 0}.gg-ai-living-v373 details span{font-size:13px;color:#4e5661!important} .gg-ai-fav-grid-v373{display:grid;grid-template-columns:1fr 1fr;gap:8px}.gg-ai-fav-grid-v373 span{display:grid;gap:3px;background:#e3e8ee;border-radius:12px;padding:10px;text-align:center;font-size:13px}.gg-ai-fav-grid-v373 b{text-transform:uppercase;font-size:10px;letter-spacing:.08em;color:#707985!important} .gg-ai-back-chat-v373{align-self:flex-end;border:1px solid #987329;background:linear-gradient(180deg,#f3d679,#d7b05b);color:#1b1508;border-radius:13px;padding:10px 16px;font-weight:900} /* Avatar Studio should breathe from both screen edges on phones. */ @media(max-width:820px){ body.avatar-page .avatar-builder-section>.wrap, body.avatar-page.gg-v362-avatar-clean .avatar-builder-section>.wrap{padding-left:12px!important;padding-right:12px!important;box-sizing:border-box!important} body.avatar-page .rich-avatar-shell, body.avatar-page.gg-v362-avatar-clean .rich-avatar-shell{width:100%!important;max-width:100%!important;padding-left:0!important;padding-right:0!important;box-sizing:border-box!important} body.avatar-page .rich-avatar-card, body.avatar-page.gg-v362-avatar-clean .rich-avatar-card{width:100%!important;max-width:100%!important;margin-left:auto!important;margin-right:auto!important;box-sizing:border-box!important;border-radius:20px!important} } /* Cross-theme readability safeguard for major content surfaces. */ html[data-gg-site-theme="sun"] body :is(.card,.half,.page-hero,.portfolio-card,.contact-box,.section-title,.shop-card,.discoveries-card,.account-card,.settings-card,.friend-card,.utility-block,.option-drawer,.room-panel,.room-drawer,.room-studio-card,.daily-card,.gg-ai-card-v370,.gg-ai-context-v370,.gg-ai-info-v373,.gg-ai-helper-v370){color:#171a1f!important} html[data-gg-site-theme="sun"] body :is(.card,.half,.page-hero,.portfolio-card,.contact-box,.section-title,.shop-card,.discoveries-card,.account-card,.settings-card,.friend-card,.utility-block,.option-drawer,.room-panel,.room-drawer,.room-studio-card,.daily-card,.gg-ai-card-v370,.gg-ai-context-v370,.gg-ai-info-v373,.gg-ai-helper-v370) :is(h1,h2,h3,h4,h5,h6,p,span,small,strong,b,label,li){color:#171a1f!important;text-shadow:none!important} html[data-gg-site-theme="moon"] body :is(.page-hero,.card,.half,.portfolio-card,.contact-box,.shop-card,.discoveries-card,.account-card,.settings-card,.friend-card,.utility-block,.option-drawer,.room-panel,.room-drawer,.room-studio-card,.daily-card){color:#f3f0e8!important} html[data-gg-site-theme="moon"] body :is(.page-hero,.card,.half,.portfolio-card,.contact-box,.shop-card,.discoveries-card,.account-card,.settings-card,.friend-card,.utility-block,.option-drawer,.room-panel,.room-drawer,.room-studio-card,.daily-card) :is(h1,h2,h3,h4,h5,h6,p,span,small,strong,b,label,li){color:#f3f0e8!important} @media(max-width:680px){ .gg-ai-card-v370{width:calc(100vw - 18px)!important;max-height:calc(100dvh - 18px)!important;border-radius:22px!important;padding:10px!important} .gg-ai-head-v370{grid-template-columns:56px minmax(0,1fr) 38px!important;min-height:68px!important;padding:9px 52px 9px 10px!important;gap:9px!important} .gg-ai-close-v370{width:34px!important;height:34px!important;right:13px!important;top:17px!important;font-size:18px!important} .gg-ai-star-v370{width:36px!important;height:36px!important;font-size:21px!important} .gg-ai-title-v370 strong{font-size:16px!important}.gg-ai-title-v370 small{font-size:12px!important} .gg-ai-suggestions-v370{grid-template-columns:1fr 1fr!important} .gg-ai-suggestions-v370 button{font-size:12px!important;min-height:42px!important;padding:8px!important} .gg-ai-chat-v370{min-height:116px!important;max-height:29vh!important} .gg-ai-form-v370{grid-template-columns:minmax(0,1fr) 104px!important} .gg-ai-info-v373{max-height:calc(100dvh - 108px)!important} .gg-ai-info-top-v373,.gg-ai-living-v373,.gg-ai-favorites-v373{padding:12px!important;border-radius:16px!important} .gg-ai-info-top-v373 strong,.gg-ai-info-title-v373 strong{font-size:16px!important} } /* ========================================================== v374 — Familiar UI consolidation + portrait framing + theme polish ========================================================== */ /* The assistant stays metallic/silver; theme only changes the accent. */ .gg-ai-card-v370{ background:linear-gradient(160deg,#f4f6f8 0%,#dfe4ea 54%,#cbd2da 100%)!important; border:1px solid #930ca8!important; box-shadow:0 20px 58px rgba(39,47,58,.22)!important; } html[data-gg-site-theme="sun"] .gg-ai-card-v370{ border-color:#b49a5a!important; box-shadow:0 20px 58px rgba(51,58,68,.18),0 0 0 2px rgba(214,176,91,.10)!important; } html[data-gg-site-theme="moon"] .gg-ai-card-v370{ border-color:#8877a5!important; box-shadow:0 20px 58px rgba(22,20,31,.30),0 0 0 2px rgba(132,108,176,.10)!important; } html[data-gg-site-theme="moon"] .gg-ai-star-v370{border-color:#77648e!important;box-shadow:0 7px 16px rgba(76,58,101,.18),inset 0 1px 0 rgba(255,255,255,.6)!important} /* Keep every AI surface light enough for the dark text used by the interface. */ .gg-ai-head-v370,.gg-ai-context-v370,.gg-ai-info-top-v373,.gg-ai-living-v373,.gg-ai-favorites-v373, .gg-ai-msg-v370 span,.gg-ai-suggestions-v370 button,.gg-ai-form-v370 input,.gg-ai-action-grid-v373 button, .gg-ai-recent-memory-v374,.gg-ai-fav-grid-v373 span{ background:linear-gradient(180deg,#fafbfd 0%,#e9edf2 100%)!important; color:#171a1f!important; border-color:#a5aeb9!important; } .gg-ai-head-v370 *, .gg-ai-context-v370 *, .gg-ai-info-v373 *, .gg-ai-suggestions-v370 button, .gg-ai-msg-v370 span,.gg-ai-form-v370 input{color:#171a1f!important;text-shadow:none!important} /* One portrait framing rule for header, chat portraits, and helper boxes. */ .gg-ai-pet-v370,.gg-ai-msg-v370 i,.gg-ai-helper-v370{ position:relative!important; overflow:hidden!important; display:grid!important; place-items:center!important; background:radial-gradient(circle at 34% 26%,#fff 0%,#f1f4f7 42%,#d6dce4 74%,#c3cbd4 100%)!important; border:1px solid #99a3af!important; } .gg-ai-pet-v370>.gg-familiar-avatar-v339, .gg-ai-msg-v370 i>.gg-familiar-avatar-v339, .gg-ai-helper-v370>.gg-familiar-avatar-v339{ position:relative!important; left:auto!important;top:auto!important; margin:0!important; width:100%!important;height:100%!important; transform:none!important; transform-origin:center center!important; display:grid!important;place-items:center!important; } .gg-ai-pet-v370 .gg-familiar-avatar-v339>.pet-hover, .gg-ai-msg-v370 i .gg-familiar-avatar-v339>.pet-hover, .gg-ai-helper-v370 .gg-familiar-avatar-v339>.pet-hover{ width:100%!important;height:100%!important; display:grid!important;place-items:center!important; } .gg-ai-pet-v370 .pet-model-v345{width:92%!important;height:92%!important;max-width:none!important} .gg-ai-msg-v370 i .pet-model-v345{width:91%!important;height:91%!important;max-width:none!important} .gg-ai-helper-v370 .pet-model-v345{width:92%!important;height:92%!important;max-width:none!important} .gg-ai-pet-v370 .pet-accessory,.gg-ai-msg-v370 i .pet-accessory,.gg-ai-helper-v370 .pet-accessory{transform:scale(.72);transform-origin:center} /* Compact game-menu icons and an always-visible recent memory. */ .gg-ai-info-icon-v374{display:inline-grid;place-items:center;min-width:22px;height:22px;margin-right:6px;border-radius:8px;background:#e1c777;color:#51400e!important;font-size:12px;vertical-align:middle} .gg-ai-need-v373>span{display:flex;align-items:center;gap:6px;font-weight:800} .gg-ai-need-v373>span>i{font-style:normal;width:20px;height:20px;border-radius:7px;display:grid;place-items:center;background:#dfe4ea;color:#4c5561!important;font-size:11px} .gg-ai-recent-memory-v374{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;align-items:start;border:1px solid #aab2bc;border-radius:13px;padding:9px 10px;margin-top:10px} .gg-ai-recent-memory-v374 b{white-space:nowrap;color:#69561f!important;font-size:12px}.gg-ai-recent-memory-v374 span{font-size:12px;color:#515a66!important;line-height:1.35} .gg-ai-living-v373 summary{display:flex;align-items:center;gap:6px} /* Helper boxes sit beside section titles rather than floating over text. */ .gg-ai-helper-title-host-v374{ display:grid!important; grid-template-columns:minmax(0,1fr) 52px!important; column-gap:14px!important; align-items:center!important; padding-right:0!important; } .gg-ai-helper-title-host-v374>:not(.gg-ai-helper-v370){grid-column:1!important} .gg-ai-helper-title-host-v374>.gg-ai-helper-v370{ position:relative!important;right:auto!important;top:auto!important; grid-column:2!important;grid-row:1 / span 4!important; align-self:center!important;justify-self:end!important; width:48px!important;height:48px!important;border-radius:14px!important; } /* Distinct tap reactions: Dove double-flaps softly; Crow snaps its wings and tilts its head. */ .gg-pet-react-dove-v374{animation:ggDoveLiftV374 .68s ease!important} .gg-pet-react-dove-v374 .dove-wing-v366.left{animation:ggDoveTapLeftV374 .30s ease-in-out 2!important} .gg-pet-react-dove-v374 .dove-wing-v366.right{animation:ggDoveTapRightV374 .30s ease-in-out 2!important} @keyframes ggDoveLiftV374{0%,100%{transform:translateY(0)}45%{transform:translateY(-5px)}} @keyframes ggDoveTapLeftV374{0%,100%{transform:rotate(6deg)}50%{transform:rotate(-30deg) translateY(-3px)}} @keyframes ggDoveTapRightV374{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(30deg) translateY(-3px)}} .gg-pet-react-crow-v374{animation:ggCrowTiltV374 .60s ease!important} .gg-pet-react-crow-v374 .crow-wing-v366.left{animation:ggCrowTapLeftV374 .22s ease-in-out 2!important} .gg-pet-react-crow-v374 .crow-wing-v366.right{animation:ggCrowTapRightV374 .22s ease-in-out 2!important} .gg-pet-react-crow-v374 .crow-head-v366{transform-origin:60px 35px;animation:ggCrowHeadV374 .55s ease!important} @keyframes ggCrowTiltV374{0%,100%{transform:translateY(0) rotate(0)}45%{transform:translateY(-3px) rotate(-2deg)}} @keyframes ggCrowTapLeftV374{0%,100%{transform:rotate(8deg)}50%{transform:rotate(-34deg) translateY(-3px)}} @keyframes ggCrowTapRightV374{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(34deg) translateY(-3px)}} @keyframes ggCrowHeadV374{0%,100%{transform:rotate(0)}55%{transform:rotate(9deg)}} /* Reward UI and AI help are separate systems; legacy reward/help overlays stay gone. */ #ggFamiliarBondToastV346,#ggFamiliarGuideToastV341,#ggFamiliarWheelV346,#ggFamiliarAssistantV336,#ggFamiliarAssistantV339{display:none!important} /* Stable 16px Avatar Studio gutters on phone-sized screens. */ @media(max-width:820px){ body.avatar-page .avatar-builder-section>.wrap, body.avatar-page.gg-v362-avatar-clean .avatar-builder-section>.wrap{ width:100%!important;max-width:100%!important; padding-left:16px!important;padding-right:16px!important; margin-left:auto!important;margin-right:auto!important; box-sizing:border-box!important; } body.avatar-page .rich-avatar-shell,body.avatar-page .rich-avatar-card{width:100%!important;max-width:100%!important;box-sizing:border-box!important} } /* Final contrast guard: Sun uses light/silver surfaces + dark text; Moon uses dark surfaces + light text. */ html[data-gg-site-theme="sun"] body :is(.card,.half,.page-hero,.portfolio-card,.contact-box,.shop-card,.discoveries-card,.account-card,.settings-card,.friend-card,.utility-panel,.utility-block,.option-drawer,.room-panel,.room-drawer,.room-studio-card,.daily-card,.shop-promo-shell,.shop-promo-slide){ color:#171a1f!important; } html[data-gg-site-theme="sun"] body :is(.card,.half,.page-hero,.portfolio-card,.contact-box,.shop-card,.discoveries-card,.account-card,.settings-card,.friend-card,.utility-panel,.utility-block,.option-drawer,.room-panel,.room-drawer,.room-studio-card,.daily-card,.shop-promo-shell,.shop-promo-slide) :is(h1,h2,h3,h4,h5,h6,p,span,small,strong,b,label,li){color:#171a1f!important;text-shadow:none!important} html[data-gg-site-theme="moon"] body :is(.card,.half,.page-hero,.portfolio-card,.contact-box,.shop-card,.discoveries-card,.account-card,.settings-card,.friend-card,.utility-panel,.utility-block,.option-drawer,.room-panel,.room-drawer,.room-studio-card,.daily-card,.shop-promo-shell,.shop-promo-slide){ background-color:#17191f;color:#f2efe8!important; } html[data-gg-site-theme="moon"] body :is(.card,.half,.page-hero,.portfolio-card,.contact-box,.shop-card,.discoveries-card,.account-card,.settings-card,.friend-card,.utility-panel,.utility-block,.option-drawer,.room-panel,.room-drawer,.room-studio-card,.daily-card,.shop-promo-shell,.shop-promo-slide) :is(h1,h2,h3,h4,h5,h6,p,span,small,strong,b,label,li){color:#f2efe8!important} @media(max-width:680px){ .gg-ai-helper-title-host-v374{grid-template-columns:minmax(0,1fr) 46px!important;column-gap:10px!important} .gg-ai-helper-title-host-v374>.gg-ai-helper-v370{width:42px!important;height:42px!important;border-radius:12px!important} .gg-ai-recent-memory-v374{grid-template-columns:1fr!important;gap:4px!important} } /* ========================================================== v375 — Familiar roaming polish + claw controls upgrade ========================================================== */ .gg-familiar-room-host-v339{min-width:74px;min-height:78px} .gg-familiar-room-host-v339[data-context="home"] .gg-familiar-room-avatar-v339{width:66px!important;height:66px!important} .gg-familiar-room-host-v339[data-context="salon"] .gg-familiar-room-avatar-v339{width:58px!important;height:58px!important} #avatarRoom .gg-familiar-room-host-v339 .gg-familiar-room-avatar-v339, #avatarRoom .gg-familiar-room-host-v339 .pet-hover, #avatarRoom .gg-familiar-room-host-v339 .pet-model-v345{position:relative!important;z-index:1!important} .gg-familiar-room-host-v339>span{position:absolute!important;left:50%!important;bottom:-6px!important;transform:translateX(-50%)!important;z-index:8!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:3px 7px!important;border-radius:999px!important;background:rgba(12,10,16,.72)!important;border:1px solid rgba(255,221,141,.32)!important;font:900 9px/1 Inter,sans-serif!important;color:#f8df96!important;white-space:nowrap!important;text-shadow:none!important;box-shadow:0 4px 10px rgba(0,0,0,.26)!important} .gg-familiar-room-host-v339[data-context="salon"]>span{background:rgba(44,24,35,.78)!important} .gg-familiar-room-host-v339[data-roaming="1"][data-roam-mode="fly"] .pet-hover{animation-duration:1.2s!important} .gg-familiar-room-host-v339[data-roaming="1"][data-roam-mode="hop"] .pet-hover{animation:ggFamRoamHopV375 .58s ease-in-out 2!important} @keyframes ggFamRoamHopV375{0%,100%{transform:translateY(0)}45%{transform:translateY(-10px)}70%{transform:translateY(-3px)}} .gg-familiar-room-host-v339[data-roaming="1"] .gg-familiar-room-reaction-v343{z-index:9!important} .gg-claw-perfect-zone-v375{position:absolute;left:50%;top:116px;transform:translateX(-50%);width:78px;height:170px;border:2px dashed rgba(255,226,129,.52);border-top:0;border-bottom-left-radius:18px;border-bottom-right-radius:18px;pointer-events:none;z-index:3;box-shadow:0 0 18px rgba(255,226,129,.08),inset 0 0 18px rgba(255,226,129,.06)} .gg-claw-perfect-zone-v375::before{content:"";position:absolute;left:50%;top:-86px;bottom:0;width:2px;transform:translateX(-50%);background:linear-gradient(180deg,rgba(255,225,120,.85),rgba(255,225,120,0));opacity:.55} .gg-claw-perfect-zone-v375 span{position:absolute;left:50%;top:-26px;transform:translateX(-50%);font:900 9px/1 Inter,sans-serif;letter-spacing:.16em;color:rgba(255,233,156,.75);white-space:nowrap} .gg-claw-control-row-v375{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:8px;margin-top:8px} .gg-claw-step-v375,.gg-claw-control-row-v375 .gg-claw-drop-v131{min-height:46px;border-radius:14px;border:1px solid rgba(255,255,255,.08);font:900 12px/1 Inter,sans-serif;letter-spacing:.06em} .gg-claw-step-v375{background:linear-gradient(180deg,#2a2330,#17121d);color:#f4df9b;box-shadow:0 6px 16px rgba(0,0,0,.24);cursor:pointer} .gg-claw-step-v375:active{transform:translateY(1px)} .gg-claw-control-row-v375 .gg-claw-drop-v131{margin:0!important;width:100%!important} @media(max-width:680px){.gg-claw-control-row-v375{grid-template-columns:1fr 1fr 1fr;gap:6px}.gg-claw-step-v375,.gg-claw-control-row-v375 .gg-claw-drop-v131{min-height:42px;font-size:11px}.gg-claw-perfect-zone-v375{width:66px;height:150px;top:112px}} /* ========================================================== v376 — claw reward polish + salon finish polish ========================================================== */ .gg-claw-reward-track-v376{position:relative;display:flex;align-items:center;justify-content:center;height:24px;margin:8px 0 2px;border-radius:999px;overflow:hidden;border:1px solid rgba(255,227,146,.24);background:linear-gradient(180deg,rgba(32,24,40,.96),rgba(16,12,24,.98));box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 8px 22px rgba(0,0,0,.22)} .gg-claw-reward-track-v376 .fill{position:absolute;left:0;top:0;bottom:0;width:0%;background:linear-gradient(90deg,#ffe794,#f7b24c 55%,#ff7f6f);box-shadow:0 0 20px rgba(255,192,92,.3);transition:width .28s ease} .gg-claw-reward-track-v376 span{position:relative;z-index:1;padding:0 12px;font:900 10px/1 Inter,sans-serif;letter-spacing:.08em;color:#fff7d6;text-transform:uppercase;text-shadow:0 1px 4px rgba(0,0,0,.5)} .gg-claw-burst-v376{position:absolute;transform:translate(-50%,0);z-index:11;font:900 16px/1 Inter,sans-serif;letter-spacing:.05em;color:#fff2b8;text-shadow:0 2px 6px rgba(0,0,0,.45);animation:ggClawBurstFloatV376 1.05s ease forwards;pointer-events:none} .gg-claw-burst-v376.score{color:#fff1b2}.gg-claw-burst-v376.time{color:#9df4ff}.gg-claw-burst-v376.reward{color:#ffd37b;filter:drop-shadow(0 0 10px rgba(255,191,84,.45))} @keyframes ggClawBurstFloatV376{0%{opacity:0;transform:translate(-50%,10px) scale(.82)}15%{opacity:1;transform:translate(-50%,-2px) scale(1)}100%{opacity:0;transform:translate(-50%,-44px) scale(1.08)}} .gg-salon-client-v230 .gg-salon-tip-burst-v376{position:absolute;left:50%;bottom:105%;transform:translateX(-50%);padding:6px 10px;border-radius:999px;background:linear-gradient(180deg,rgba(255,246,226,.98),rgba(255,225,193,.94));border:1px solid rgba(255,190,143,.55);box-shadow:0 12px 24px rgba(0,0,0,.18);font:900 11px/1 Inter,sans-serif;letter-spacing:.04em;color:#7a3b20;white-space:nowrap;pointer-events:none;z-index:7;animation:ggSalonTipBurstFloatV376 1.5s ease forwards} .gg-salon-client-v230 .gg-salon-tip-burst-v376.cash{background:linear-gradient(180deg,rgba(253,255,225,.99),rgba(226,255,193,.95));color:#385f10;border-color:rgba(132,196,72,.55)} .gg-salon-client-v230 .gg-salon-tip-burst-v376.good{background:linear-gradient(180deg,rgba(243,233,255,.98),rgba(230,213,255,.95));color:#57369c;border-color:rgba(146,110,224,.5)} @keyframes ggSalonTipBurstFloatV376{0%{opacity:0;transform:translateX(-50%) translateY(8px) scale(.86)}18%{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}100%{opacity:0;transform:translateX(-50%) translateY(-22px) scale(1.05)}} .gg-cut-result-v299{background:linear-gradient(180deg,rgba(255,251,246,.97),rgba(255,239,224,.97));border:1px solid rgba(224,176,140,.34);box-shadow:0 18px 40px rgba(73,40,26,.18), inset 0 1px 0 rgba(255,255,255,.7)} .gg-cut-result-copy-v302 h3{letter-spacing:.02em} .gg-cut-after-note-v302{display:block;margin-top:6px;color:#7a5640;font-weight:700} /* ========================================================== v377 — cobweb duster cleanup + blackout red-eye glow ========================================================== */ .cobweb-layer{pointer-events:auto!important} .cobweb-layer span[data-cobweb]{position:absolute;top:-8px;font-size:72px;cursor:pointer;user-select:none;pointer-events:auto;--sx:1;transform:scaleX(var(--sx));transform-origin:center top;transition:transform .16s ease,opacity .16s ease,filter .16s ease;filter:drop-shadow(0 6px 8px rgba(0,0,0,.18))} .cobweb-layer span[data-cobweb="left"]{left:-2px} .cobweb-layer span[data-cobweb="right"]{right:-2px;--sx:-1} .cobweb-layer span[data-cobweb].gg-cobweb-pop-v377{opacity:0;transform:scaleX(var(--sx)) scale(.72) rotate(-10deg);filter:drop-shadow(0 3px 4px rgba(0,0,0,.08))} .gg-blackout-v232 .room-avatar .avatar-nav-live svg #eyesWhite > *, .gg-blackout-v232 .room-avatar .avatar-nav-live svg [id="eyesWhite"] > *{fill:rgba(255,94,110,.18)!important;stroke:transparent!important;opacity:.95} .gg-blackout-v232 .room-avatar .avatar-nav-live svg #eyes > *, .gg-blackout-v232 .room-avatar .avatar-nav-live svg [id="eyes"] > *{fill:#ff314d!important;stroke:#ff9bab!important;stroke-width:1.25!important;filter:drop-shadow(0 0 5px rgba(255,41,73,.96)) drop-shadow(0 0 12px rgba(255,41,73,.56))} .gg-blackout-v232 .room-avatar .avatar-nav-live svg #eyeAccessory > *, .gg-blackout-v232 .room-avatar .avatar-nav-live svg [id="eyeAccessory"] > *{filter:drop-shadow(0 0 5px rgba(255,41,73,.72))} /* Also target the full room avatar SVG host directly so the red eyes always show in blackout. */ .gg-blackout-v232 #roomExactAvatar svg #eyesWhite > *, .gg-blackout-v232 #roomExactAvatar svg [id="eyesWhite"] > *, .gg-blackout-v232 .room-exact-avatar svg #eyesWhite > *, .gg-blackout-v232 .room-exact-avatar svg [id="eyesWhite"] > *{fill:rgba(255,94,110,.18)!important;stroke:transparent!important;opacity:.95} .gg-blackout-v232 #roomExactAvatar svg #eyes > *, .gg-blackout-v232 #roomExactAvatar svg [id="eyes"] > *, .gg-blackout-v232 .room-exact-avatar svg #eyes > *, .gg-blackout-v232 .room-exact-avatar svg [id="eyes"] > *{fill:#ff314d!important;stroke:#ff9bab!important;stroke-width:1.25!important;filter:drop-shadow(0 0 5px rgba(255,41,73,.96)) drop-shadow(0 0 12px rgba(255,41,73,.56))!important} .gg-blackout-v232 #roomExactAvatar svg #eyeAccessory > *, .gg-blackout-v232 #roomExactAvatar svg [id="eyeAccessory"] > *, .gg-blackout-v232 .room-exact-avatar svg #eyeAccessory > *, .gg-blackout-v232 .room-exact-avatar svg [id="eyeAccessory"] > *{filter:drop-shadow(0 0 5px rgba(255,41,73,.72))!important} .gg-blackout-v232 .gg-familiar-room-host-v339 .dog-eye-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .cat-pupil-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .ghost-eye-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .bat-eye-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .bunny-eye-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .dragon-eye-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .owl-eye-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .dove-eye-v377, .gg-blackout-v232 .gg-familiar-room-host-v339 .crow-eye-v377{fill:#ff314d!important;background:#ff314d!important;stroke:#ff9bab!important;filter:drop-shadow(0 0 5px rgba(255,41,73,.96)) drop-shadow(0 0 12px rgba(255,41,73,.56));box-shadow:0 0 8px rgba(255,41,73,.85),0 0 16px rgba(255,41,73,.48)} .gg-blackout-v232 .gg-familiar-room-host-v339 .dog-eye-socket-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .cat-eye-shape-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .ghost-eye-socket-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .bat-eye-socket-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .bunny-eye-socket-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .dragon-eye-socket-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .owl-eye-ring-v345, .gg-blackout-v232 .gg-familiar-room-host-v339 .dove-eye-white-v377, .gg-blackout-v232 .gg-familiar-room-host-v339 .crow-eye-white-v377{fill:rgba(255,86,104,.20)!important;stroke:rgba(255,137,155,.36)!important} .gg-blackout-v232 .gg-familiar-room-host-v339 .pet-eye-glint-v345{opacity:.22!important;fill:#ffd0d7!important} /* ========================================================== v378 — Familiar lock/default/owl placement + blackout body hide + door knock ========================================================== */ body.avatar-page .avatar-preview-top > div:first-child.gg-ai-helper-host-v370{ display:flex!important; flex-direction:column!important; align-items:flex-start!important; gap:6px!important; } body.avatar-page .avatar-preview-top > div:first-child .gg-ai-helper-v370{ position:static!important; margin:0!important; align-self:flex-start!important; } #ggFamiliarBuilderV339 .pet-grid button.gg-pet-locked-v378{ position:relative; opacity:.88; border-style:dashed; } #ggFamiliarBuilderV339 .pet-grid button.gg-pet-locked-v378 small{ display:block; margin-top:4px; font-size:10px; line-height:1.2; color:#8e6d23; font-weight:800; } #ggFamiliarBuilderV339 .pet-grid button.gg-pet-locked-v378::after{ content:"LOCKED"; position:absolute; top:8px; right:8px; font-size:10px; font-weight:900; letter-spacing:.08em; padding:2px 6px; border-radius:999px; background:rgba(0,0,0,.72); color:#fff0b8; } /* v623: removed legacy Familiar blackout body/eye overrides; v623-targeted-final.css owns dark-room visibility. */ body.gg-salon-room-v206 #ggSalonMoneyHudV230, body.gg-salon-room-v206 #ggRoomLevelV143, body.gg-salon-room-v206 #roomMoodGaugeV065, body.gg-salon-room-v206 [class*="level-gauge"], body.gg-salon-room-v206 [class*="gg-salon-money"], body.gg-salon-room-v206 [id*="SalonMoney"]{ position:relative!important; z-index:8600!important; } .gg-v327-editor .row{ display:flex!important; flex-wrap:wrap!important; gap:8px!important; overflow:visible!important; max-height:none!important; } .gg-v327-preview svg{ display:block!important; width:100%!important; height:auto!important; overflow:visible!important; } #ggSideDoorV111.gg-knock-knock-v378{ animation:ggDoorKnockV378 .9s ease-in-out 1; box-shadow:-4px 4px 10px #0007,0 0 0 2px rgba(255,228,153,.18),0 0 16px rgba(255,207,102,.35)!important; } #ggSideDoorV111.gg-knock-knock-v378 i{ animation:ggDoorKnobV378 .22s ease-in-out 3; } #ggSideDoorV111.gg-knock-knock-v378::after{ content:"KNOCK"; position:absolute; right:34px; top:10px; padding:3px 7px; border-radius:999px; background:rgba(14,14,18,.92); color:#fff0bf; font-size:10px; font-weight:900; letter-spacing:.08em; box-shadow:0 6px 14px rgba(0,0,0,.26); } @keyframes ggDoorKnockV378{ 0%,100%{transform:perspective(120px) rotateY(-16deg) translateX(0)} 16%{transform:perspective(120px) rotateY(-16deg) translateX(-2px)} 33%{transform:perspective(120px) rotateY(-16deg) translateX(1px)} 50%{transform:perspective(120px) rotateY(-16deg) translateX(-3px)} 66%{transform:perspective(120px) rotateY(-16deg) translateX(2px)} 83%{transform:perspective(120px) rotateY(-16deg) translateX(-1px)} } @keyframes ggDoorKnobV378{ 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-1px) scale(1.2)} } /* ========================================================== v379 — complete Gremlin Grab claw machine rebuild ========================================================== */ .gg-claw-v379{position:fixed!important;inset:0!important;z-index:2147483647!important;display:none!important;place-items:center!important;padding:10px!important;background:rgba(7,7,10,.82)!important;backdrop-filter:blur(10px)!important} .gg-claw-v379.show{display:grid!important} .gg-claw-card-v379{width:min(760px,96vw);max-height:94vh;overflow:auto;border-radius:26px;background:linear-gradient(180deg,#f4f5f7 0%,#d9dee4 100%);border:1px solid #8f99a5;box-shadow:0 28px 80px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.9);padding:14px;color:#16181d} .gg-claw-head-v379{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:6px 6px 12px}.gg-claw-head-v379 small{font:900 10px/1 Inter,sans-serif;letter-spacing:.16em;color:#9a7523}.gg-claw-head-v379 h2{margin:4px 0 2px;font:900 28px/1 Georgia,serif}.gg-claw-head-v379 p{margin:0;color:#59616d;font-size:13px}.gg-claw-head-v379 button{width:42px;height:42px;border-radius:14px;border:1px solid #9ea7b2;background:linear-gradient(#fff,#dfe4e9);font-size:22px;color:#20242b;box-shadow:0 5px 12px rgba(44,50,58,.12)} .gg-claw-hud-v379{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.gg-claw-hud-v379 span{display:grid;gap:2px;text-align:center;padding:8px 4px;border-radius:14px;background:linear-gradient(180deg,#fff,#e7ebef);border:1px solid #a8b0ba;box-shadow:inset 0 1px 0 #fff}.gg-claw-hud-v379 small{font:800 8px/1 Inter,sans-serif;letter-spacing:.12em;color:#7d8793}.gg-claw-hud-v379 b{font:900 18px/1 Inter,sans-serif;color:#1e2228} .gg-claw-progress-v379{position:relative;height:24px;border-radius:999px;overflow:hidden;margin:9px 0;background:#22242a;border:1px solid #434852}.gg-claw-progress-v379 i{position:absolute;inset:0 auto 0 0;width:0%;background:linear-gradient(90deg,#d7b05b,#ffe58a 65%,#fff4bf);box-shadow:0 0 18px rgba(255,220,105,.35);transition:width .2s ease}.gg-claw-progress-v379 span{position:relative;z-index:1;display:grid;place-items:center;height:100%;font:900 9px/1 Inter,sans-serif;letter-spacing:.1em;color:#fff;text-shadow:0 1px 4px #000} .gg-claw-cabinet-v379{border-radius:22px;padding:10px;background:linear-gradient(180deg,#292330,#17131d);border:1px solid #463b4e;box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 12px 30px rgba(0,0,0,.25)} .gg-claw-marquee-v379{height:56px;border-radius:16px 16px 8px 8px;background:linear-gradient(180deg,#e4c45e,#a77721);display:grid;grid-template-columns:54px 1fr 54px;align-items:center;text-align:center;color:#19130a;box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 8px 18px rgba(0,0,0,.18)}.gg-claw-marquee-v379 span{font:1000 19px/1 Inter,sans-serif;letter-spacing:.15em}.gg-claw-marquee-v379 b{font:1000 26px/1 Georgia,serif} .gg-claw-glass-v379{position:relative;height:390px;margin-top:8px;overflow:hidden;border-radius:14px;background:radial-gradient(circle at 50% 12%,rgba(255,239,185,.13),transparent 26%),linear-gradient(180deg,#181d27 0%,#242332 54%,#35283b 100%);border:2px solid #716c78;touch-action:none;box-shadow:inset 0 0 0 6px #101219,inset 0 0 38px rgba(0,0,0,.55)} .gg-claw-glass-shine-v379{position:absolute;inset:8px;pointer-events:none;z-index:20;border-radius:9px;background:linear-gradient(115deg,rgba(255,255,255,.13),transparent 18%,transparent 67%,rgba(255,255,255,.04));clip-path:polygon(0 0,28% 0,10% 100%,0 100%)} .gg-claw-track-v379{position:absolute;left:7%;right:7%;top:36px;height:10px;border-radius:99px;background:linear-gradient(#8e939c,#4f545e);box-shadow:0 4px 8px #0008;z-index:7} .gg-claw-carriage-v379{position:absolute;left:50%;top:21px;transform:translateX(-50%);width:62px;height:160px;z-index:12;transition:left .08s linear;pointer-events:none}.gg-claw-carriage-v379 .motor{display:grid;place-items:center;width:62px;height:34px;border-radius:10px;background:linear-gradient(#e2c260,#9b6e22);border:2px solid #573d11;font:900 10px/1 Inter,sans-serif;color:#211708;box-shadow:0 5px 9px #0007}.gg-claw-carriage-v379 .cable{position:absolute;left:29px;top:34px;width:4px;height:78px;background:linear-gradient(90deg,#868b92,#e4e7ea,#737880);transform-origin:top;transition:height .42s ease}.gg-claw-carriage-v379 .claw{position:absolute;left:17px;top:104px;width:28px;height:34px;transition:top .42s ease}.gg-claw-carriage-v379 .claw::before{content:"";position:absolute;left:8px;top:0;width:12px;height:9px;border-radius:7px;background:#c2c7ce;border:2px solid #656b73}.gg-claw-carriage-v379 .arm{position:absolute;top:7px;width:4px;height:28px;background:#b8bdc4;border-radius:4px;transform-origin:top}.gg-claw-carriage-v379 .arm.left{left:7px;transform:rotate(28deg)}.gg-claw-carriage-v379 .arm.mid{left:12px}.gg-claw-carriage-v379 .arm.right{right:7px;transform:rotate(-28deg)}.gg-claw-carriage-v379.dropping .cable{height:220px}.gg-claw-carriage-v379.dropping .claw{top:246px}.gg-claw-carriage-v379.holding .arm.left{transform:rotate(10deg)}.gg-claw-carriage-v379.holding .arm.right{transform:rotate(-10deg)} .gg-claw-bin-v379{position:absolute;left:4%;right:4%;bottom:30px;height:150px;z-index:5;border-radius:24px 24px 12px 12px;background:linear-gradient(180deg,rgba(95,72,103,.15),rgba(27,21,31,.5));border-top:2px solid rgba(255,255,255,.07)} .gg-claw-prize-v379{position:absolute;bottom:14px;transform:translateX(-50%);width:76px;height:100px;padding:0;border:0;background:transparent;transition:left .4s ease,bottom .4s ease,transform .4s ease,opacity .2s;animation:ggClawPlushBob379 2.4s ease-in-out infinite;pointer-events:none}.gg-claw-prize-v379 .plush{position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}.gg-claw-prize-v379 .face{width:58px;height:58px;border-radius:48% 48% 44% 44%;display:grid;place-items:center;background:linear-gradient(180deg,#494152,#2c2632);border:2px solid #7d7187;box-shadow:inset 0 -8px 0 rgba(0,0,0,.14),0 7px 12px rgba(0,0,0,.3);font:900 24px/1 Georgia,serif}.gg-claw-prize-v379 b{max-width:74px;margin-top:3px;font:900 8px/1 Inter,sans-serif;color:#f4edf7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gg-claw-prize-v379 small{margin-top:2px;padding:2px 5px;border-radius:99px;background:#18141c;color:#dac77d;font:900 7px/1 Inter,sans-serif}.gg-claw-prize-v379.rare .face{border-color:#75a9df;box-shadow:0 0 12px rgba(90,162,238,.25),inset 0 -8px 0 rgba(0,0,0,.14)}.gg-claw-prize-v379.epic .face,.gg-claw-prize-v379.jackpot .face{border-color:#e5bf4d;box-shadow:0 0 16px rgba(235,190,69,.42),inset 0 -8px 0 rgba(0,0,0,.14)}.gg-claw-prize-v379.jackpot .face{background:radial-gradient(circle,#fff0a3,#d39b24 60%,#6b4810);color:#241605}.gg-claw-prize-v379.caught{animation:none;bottom:154px;z-index:14;filter:drop-shadow(0 10px 10px rgba(0,0,0,.4))}.gg-claw-prize-v379.to-chute{bottom:30px!important;transform:translateX(-50%) scale(.72) rotate(8deg)!important;opacity:.45} @keyframes ggClawPlushBob379{0%,100%{transform:translateX(-50%) translateY(0) rotate(-1deg)}50%{transform:translateX(-50%) translateY(-5px) rotate(1deg)}} .gg-claw-drop-zone-v379{position:absolute;left:50%;bottom:20px;width:70px;height:150px;transform:translateX(-50%);border-left:1px dashed rgba(255,226,127,.18);border-right:1px dashed rgba(255,226,127,.18);pointer-events:none}.gg-claw-prize-door-v379{position:absolute;right:12px;bottom:0;width:82px;height:54px;border-radius:16px 16px 0 0;background:linear-gradient(#31283b,#17131d);border:2px solid #65566f;border-bottom:0;z-index:8}.gg-claw-prize-door-v379::before{content:"";position:absolute;left:12px;right:12px;top:10px;height:20px;border-radius:7px;background:#09080b}.gg-claw-prize-door-v379 span{position:absolute;bottom:5px;left:0;right:0;text-align:center;font:900 8px/1 Inter,sans-serif;letter-spacing:.16em;color:#d1b96d} .gg-claw-fx-v379{position:absolute;inset:0;pointer-events:none;z-index:30}.gg-claw-fx-v379 b{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);font:1000 24px/1 Inter,sans-serif;color:#ffe894;text-shadow:0 3px 10px #000;animation:ggClawFx379 1s ease forwards}.gg-claw-fx-v379 b.perfect{color:#fff4b0;filter:drop-shadow(0 0 12px #f0c84d)}.gg-claw-fx-v379 b.miss{color:#d798b7}.gg-claw-fx-v379 b.good{color:#dfefff}@keyframes ggClawFx379{0%{opacity:0;transform:translate(-50%,0) scale(.7)}20%{opacity:1;transform:translate(-50%,-10px) scale(1)}100%{opacity:0;transform:translate(-50%,-70px) scale(1.12)}} .gg-claw-console-v379{padding:10px 4px 2px}.gg-claw-message-v379{min-height:42px;display:grid;place-items:center;text-align:center;padding:8px 12px;border-radius:12px;background:#0f0d12;border:1px solid #3b3341;color:#e8e1ea;font:800 12px/1.35 Inter,sans-serif}.gg-claw-controls-v379{display:grid;grid-template-columns:1fr 1.35fr 1fr;gap:8px;margin-top:8px}.gg-claw-controls-v379 button,.gg-claw-console-v379 .play{min-height:48px;border-radius:15px;border:1px solid #6d5e74;background:linear-gradient(180deg,#2d2633,#17131d);color:#f4eac4;font:1000 13px/1 Inter,sans-serif;box-shadow:0 6px 14px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.05)}.gg-claw-controls-v379 button{min-height:48px;border-radius:15px;border:1px solid #6d5e74;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;font:1000 13px/1 Inter,sans-serif;box-shadow:0 6px 14px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.05);}.gg-claw-controls-v379 .drop,.gg-claw-console-v379 .play{background:linear-gradient(180deg,#e6c760,#a77422);border-color:#84601c;color:#201607;box-shadow:0 7px 16px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.42)}.gg-claw-console-v379 .play{width:100%;margin-top:8px}.gg-claw-controls-v379 button:disabled,.gg-claw-console-v379 .play:disabled{opacity:.5;filter:grayscale(.4)} @media(max-width:680px){.gg-claw-card-v379{width:calc(100vw - 12px);padding:10px;border-radius:20px}.gg-claw-head-v379 h2{font-size:23px}.gg-claw-head-v379 p{font-size:11px}.gg-claw-hud-v379{gap:4px}.gg-claw-hud-v379 span{padding:6px 2px}.gg-claw-hud-v379 b{font-size:15px}.gg-claw-glass-v379{height:330px}.gg-claw-bin-v379{height:130px}.gg-claw-prize-v379{width:64px;height:88px}.gg-claw-prize-v379 .face{width:50px;height:50px;font-size:20px}.gg-claw-carriage-v379.dropping .cable{height:180px}.gg-claw-carriage-v379.dropping .claw{top:206px}.gg-claw-controls-v379 button,.gg-claw-console-v379 .play{min-height:44px}.gg-claw-marquee-v379{height:48px;grid-template-columns:44px 1fr 44px}.gg-claw-marquee-v379 span{font-size:15px}} /* v380 — remove stray AI helper from the right side of the sun icon in Avatar Studio. */ body.avatar-page .avatar-polish-controls > .gg-ai-helper-v370, body.avatar-page .avatar-polish-controls > .gg-section-familiar-v346{display:none!important} /* ========================================================== v381 — Familiar progression / save feedback polish ========================================================== */ .gg-save-toast-v381{position:fixed;left:50%;bottom:88px;transform:translateX(-50%) translateY(16px);padding:10px 16px;border-radius:999px;background:rgba(16,16,22,.92);color:#fff;border:1px solid rgba(255,255,255,.18);box-shadow:0 16px 30px rgba(0,0,0,.28);font-weight:900;letter-spacing:.03em;z-index:2147483646;opacity:0;pointer-events:none;transition:opacity .22s ease,transform .22s ease} .gg-save-toast-v381.show{opacity:1;transform:translateX(-50%) translateY(0)} .gg-theme-flash-v381{position:fixed;inset:0;pointer-events:none;z-index:2147483645;opacity:0;background:radial-gradient(circle at 50% 35%,rgba(255,230,150,.26),rgba(255,230,150,0) 52%)} html[data-gg-site-theme="moon"] .gg-theme-flash-v381{background:radial-gradient(circle at 50% 35%,rgba(121,145,255,.18),rgba(121,145,255,0) 55%)} .gg-theme-flash-v381.show{animation:ggThemeFlashV381 .55s ease} @keyframes ggThemeFlashV381{0%{opacity:0}35%{opacity:1}100%{opacity:0}} body.gg-fam-theme-shift-v381 .gg-ai-helper-v370,body.gg-fam-theme-shift-v381 #ggAiPetV370{transform:scale(1.07);transition:transform .25s ease} .gg-progress-shell-v381{margin-top:18px} .gg-discovery-progress-v381{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px} .gg-discovery-progress-v381 article{display:grid;gap:6px} .gg-discovery-progress-v381 article strong{font-size:14px;line-height:1.35;color:#fff5cf} .gg-daily-familiar-v381{padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(135deg,rgba(18,18,26,.92),rgba(32,28,38,.92));color:#e9e3f2;box-shadow:0 16px 30px rgba(0,0,0,.18)} .gg-daily-familiar-v381 b{display:block;margin-bottom:6px;color:#f0d888;letter-spacing:.08em;text-transform:uppercase;font-size:12px} .gg-daily-familiar-v381 p{margin:0;color:inherit} /* v382 — Dove/Crow secret AI unlock codes */ #ggFamiliarBuilderV339 .pet-grid button[data-pet="dove"]:not(.gg-pet-locked-v378), #ggFamiliarBuilderV339 .pet-grid button[data-pet="crow"]:not(.gg-pet-locked-v378){ border-style:solid!important; opacity:1!important; box-shadow:0 0 0 1px rgba(215,176,91,.24),0 8px 20px rgba(0,0,0,.16)!important; } /* v385 PATCH ONLY — blackout red-eye fallback. No other systems changed. */ #avatarRoom{transition:filter .35s ease,background-color .35s ease} #avatarRoom.gg-blackout-v232{transition:filter .35s ease,background-color .35s ease} .gg-blackout-avatar-eyes-v385,.gg-blackout-pet-eyes-v385{position:absolute!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:20px!important;pointer-events:none!important;z-index:2147483646!important;filter:none!important} .gg-blackout-avatar-eyes-v385[hidden],.gg-blackout-pet-eyes-v385[hidden]{display:none!important} .gg-blackout-avatar-eyes-v385{left:50%!important;top:42%!important;transform:translate(-50%,-50%)!important;gap:28px!important} .gg-blackout-pet-eyes-v385{left:50%!important;top:37%!important;transform:translate(-50%,-50%)!important;gap:10px!important} .gg-blackout-avatar-eyes-v385 i,.gg-blackout-pet-eyes-v385 i{display:block!important;width:10px!important;height:8px!important;border-radius:50%!important;background:#ff1f3d!important;box-shadow:0 0 4px #ff1f3d,0 0 10px #ff1f3d,0 0 18px rgba(255,31,61,.95)!important;animation:ggRedEyeBlinkV385 6.5s infinite!important} .gg-blackout-pet-eyes-v385 i{width:7px!important;height:7px!important;box-shadow:0 0 4px #ff1f3d,0 0 9px #ff1f3d,0 0 15px rgba(255,31,61,.9)!important} @keyframes ggRedEyeBlinkV385{0%,44%,48%,100%{transform:scaleY(1)}46%{transform:scaleY(.08)}} /* ========================================================== v387 — jackalope antlers + salon HUD top layer ========================================================== */ .pet-accessory.antlers{left:10px;top:-10px;width:84px;height:38px;color:#8a6542;filter:drop-shadow(0 1px 0 rgba(255,236,196,.15)) drop-shadow(0 2px 5px rgba(53,33,17,.25))} .pet-accessory.antlers svg{display:block;width:100%;height:100%;overflow:visible} .pet-accessory.antlers path{fill:none;stroke:#8b6947;stroke-width:4.2;stroke-linecap:round;stroke-linejoin:round} .pet-accessory.antlers path:nth-child(2){stroke:#9f7d57} body.gg-salon-room-v206 #ggSalonMoneyGaugeV230, body.gg-salon-room-v206 #ggRoomLevelV143{ position:fixed!important; z-index:2147483646!important; pointer-events:auto!important; } body.gg-salon-room-v206 #ggSalonMoneyGaugeV230{ left:12px!important; right:auto!important; bottom:12px!important; top:auto!important; } body.gg-salon-room-v206 #ggRoomLevelV143{ right:12px!important; left:auto!important; bottom:12px!important; top:auto!important; transform:none!important; } body.gg-salon-room-v206 #ggSalonMoneyGaugeV230, body.gg-salon-room-v206 #ggRoomLevelV143{ box-shadow:0 10px 24px rgba(0,0,0,.28)!important; } /* ========================================================== v388 — patch-safe polish: blackout silhouettes, secret transforms, HUD ========================================================== */ /* v642: legacy direct Familiar blackout paint removed. The room darkness overlay is now the only body-darkening authority. */ #avatarRoom.gg-blackout-v232 #ggFamiliarRoomHostV339{ z-index:1550!important; opacity:1!important; visibility:visible!important; } /* Red-eye fallback pairs are intentionally above the darkness overlay. */ #ggBlackoutEyeLayerV387{z-index:9505!important} .gg-blackout-eye-pair-v387.pet[data-pet-type="cat"] i{width:5px!important;height:10px!important;border-radius:55% 55% 40% 40%!important} .gg-blackout-eye-pair-v387.pet[data-pet-type="bat"] i{width:9px!important;height:5px!important;border-radius:65% 65% 45% 45%!important;transform:rotate(-7deg)} .gg-blackout-eye-pair-v387.pet[data-pet-type="ghost"] i{width:7px!important;height:11px!important;border-radius:50%!important} .gg-blackout-eye-pair-v387.pet[data-pet-type="bunny"] i{width:9px!important;height:9px!important;border-radius:50%!important} .gg-blackout-eye-pair-v387.pet[data-pet-type="robotOwl"] i{width:10px!important;height:10px!important;border-radius:50%!important} .gg-blackout-eye-pair-v387.pet[data-pet-type="dove"] i,.gg-blackout-eye-pair-v387.pet[data-pet-type="crow"] i{width:8px!important;height:8px!important;border-radius:50%!important} .gg-blackout-eye-pair-v387.pet[data-pet-type="miniDragon"] i{width:8px!important;height:6px!important;border-radius:60% 45%!important} /* Jackalope: antlers grow in on render. */ .pet-accessory.antlers{transform-origin:50% 100%;animation:ggJackalopeGrowV388 .62s cubic-bezier(.18,.9,.25,1.15) both} @keyframes ggJackalopeGrowV388{0%{opacity:0;transform:scale(.2) translateY(8px)}55%{opacity:1;transform:scale(1.12) translateY(-2px)}100%{opacity:1;transform:scale(1) translateY(0)}} .gg-ai-session-badges-v388{display:flex;gap:5px;flex-wrap:wrap;margin-top:4px} .gg-ai-session-badges-v388[hidden]{display:none!important} .gg-ai-session-badges-v388 span{display:inline-flex;padding:3px 7px;border-radius:999px;border:1px solid rgba(218,190,107,.35);background:rgba(20,18,26,.72);font:800 9px/1.2 Inter,sans-serif;color:#f5dfa0} .gg-ai-session-badges-v388 span.jackalope{border-color:rgba(195,232,177,.42);color:#ddf5cf} /* Session transformation overlays. */ .gg-pet-session-transform-v388{position:absolute;pointer-events:none;z-index:28} .gg-pet-session-transform-v388.ghost-flame{inset:-8px;filter:drop-shadow(0 0 8px rgba(116,164,255,.55))} .gg-pet-session-transform-v388.ghost-flame i{position:absolute;bottom:5px;width:14px;height:28px;border-radius:50% 50% 35% 35%;background:radial-gradient(circle at 50% 70%,#e8f4ff 0 18%,#779cff 42%,rgba(70,70,255,.08) 74%);animation:ggGhostFlameV388 .8s ease-in-out infinite alternate} .gg-pet-session-transform-v388.ghost-flame i:nth-child(1){left:18px}.gg-pet-session-transform-v388.ghost-flame i:nth-child(2){left:44px;animation-delay:-.25s}.gg-pet-session-transform-v388.ghost-flame i:nth-child(3){right:16px;animation-delay:-.5s} @keyframes ggGhostFlameV388{to{transform:translateY(-7px) scaleY(1.16);opacity:.65}} .gg-pet-session-transform-v388.vampire-bat{left:16px;top:43px;width:68px;height:34px} .gg-pet-session-transform-v388.vampire-bat i,.gg-pet-session-transform-v388.vampire-bat b{position:absolute;top:0;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:14px solid #fff;filter:drop-shadow(0 0 3px rgba(255,255,255,.4))} .gg-pet-session-transform-v388.vampire-bat i{left:24px}.gg-pet-session-transform-v388.vampire-bat b{right:24px} .gg-pet-session-transform-v388.moon-owl{left:62px;top:-7px;font-size:25px;color:#d8e6ff;text-shadow:0 0 9px rgba(121,156,255,.85);animation:ggMoonOwlV388 2s ease-in-out infinite alternate} @keyframes ggMoonOwlV388{to{transform:translateY(-3px) rotate(7deg)}} .gg-pet-session-transform-v388.dragon-crown{left:48px;top:-4px;font-size:28px;color:#ffd765;text-shadow:0 0 8px rgba(255,184,40,.55);transform:translateX(-50%);animation:ggDragonCrownV388 1.3s ease-in-out infinite alternate} @keyframes ggDragonCrownV388{to{transform:translateX(-50%) translateY(-3px) scale(1.04)}} /* Goldie HUD: matching corner cards, always above avatar/client/familiar. */ body.gg-salon-room-v206 #ggSalonMoneyGaugeV230, body.gg-salon-room-v206 #ggRoomLevelV143{ position:fixed!important; bottom:12px!important; top:auto!important; z-index:2147483646!important; min-height:42px!important; border-radius:14px!important; background:rgba(17,15,21,.94)!important; border:1px solid rgba(215,176,91,.55)!important; box-shadow:0 10px 28px rgba(0,0,0,.35)!important; backdrop-filter:blur(9px)!important; } body.gg-salon-room-v206 #ggSalonMoneyGaugeV230{left:12px!important;right:auto!important;padding:8px 11px!important} body.gg-salon-room-v206 #ggRoomLevelV143{right:12px!important;left:auto!important;transform:none!important;padding:7px 10px!important;width:min(180px,42vw)!important} body.gg-salon-room-v206 #ggRoomLevelV143 span,body.gg-salon-room-v206 #ggRoomLevelV143 b{position:relative!important;z-index:1!important} /* Studio Cut completion reaction. */ .gg-salon-client-v230.gg-client-finish-reaction-v388{animation:ggClientHappyV388 .5s ease-in-out 1!important} @keyframes ggClientHappyV388{0%,100%{filter:none}50%{filter:brightness(1.18) drop-shadow(0 0 10px rgba(255,220,112,.42));transform:translateX(-50%) translateY(-5px)}} .gg-client-finish-sparkles-v388{position:absolute;inset:-16px;pointer-events:none;z-index:2147483500} .gg-client-finish-sparkles-v388 i{position:absolute;color:#ffe69b;font-style:normal;font-size:20px;text-shadow:0 0 8px rgba(255,219,116,.7);animation:ggClientSparkV388 .8s ease-out infinite} .gg-client-finish-sparkles-v388 i:nth-child(1){left:12%;top:18%}.gg-client-finish-sparkles-v388 i:nth-child(2){right:10%;top:10%;animation-delay:-.25s}.gg-client-finish-sparkles-v388 i:nth-child(3){right:18%;bottom:24%;animation-delay:-.5s} @keyframes ggClientSparkV388{0%{opacity:0;transform:scale(.5)}50%{opacity:1;transform:scale(1.2)}100%{opacity:0;transform:scale(.6) translateY(-7px)}} /* Rare salon client accents. */ .gg-salon-client-v230.vip-fae{filter:drop-shadow(0 0 10px rgba(180,255,195,.26))} .gg-salon-client-v230.vip-cosplay{filter:drop-shadow(0 0 10px rgba(255,151,219,.25))} .gg-salon-client-v230.vip-witch{filter:drop-shadow(0 0 11px rgba(145,103,255,.3))} .gg-salon-client-v230.vip-cyber{filter:drop-shadow(0 0 11px rgba(87,225,255,.3))} /* Discoveries: hidden AI transformations. */ .gg-secret-ai-unlocks-v388{margin-top:22px} .gg-secret-ai-copy-v388{opacity:.75;max-width:700px} .gg-secret-ai-grid-v388{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:12px} .gg-secret-ai-grid-v388 article{padding:15px;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);display:grid;gap:7px;min-height:150px} .gg-secret-ai-grid-v388 article.found{border-color:rgba(215,176,91,.42);background:linear-gradient(145deg,rgba(215,176,91,.10),rgba(255,255,255,.04))} .gg-secret-ai-grid-v388 b{font-size:13px}.gg-secret-ai-grid-v388 span{font-size:10px;opacity:.7} .gg-secret-silhouette-v388{height:72px;display:grid;place-items:center;font-size:32px;border-radius:12px;background:radial-gradient(circle,rgba(255,255,255,.08),rgba(255,255,255,.015));filter:grayscale(1) brightness(.55)} .gg-secret-ai-grid-v388 article.found .gg-secret-silhouette-v388{filter:none;color:#f3d982;text-shadow:0 0 10px rgba(243,217,130,.4)} /* ========================================================== v389 — gameplay polish, progression, profile, recovery ========================================================== */ /* Familiar bond evolution auras */ .gg-bond-evo-25-v389 .pet-hover,.gg-bond-evo-25-v389.pet-hover{filter:drop-shadow(0 0 6px rgba(255,220,120,.35))!important} .gg-bond-evo-50-v389 .pet-hover,.gg-bond-evo-50-v389.pet-hover{filter:drop-shadow(0 0 8px rgba(255,220,120,.52)) drop-shadow(0 0 14px rgba(137,112,255,.24))!important} .gg-bond-evo-75-v389 .pet-hover,.gg-bond-evo-75-v389.pet-hover{filter:drop-shadow(0 0 10px rgba(255,220,120,.68)) drop-shadow(0 0 18px rgba(137,112,255,.42))!important;animation:ggBondPulseV389 2.8s ease-in-out infinite!important} @keyframes ggBondPulseV389{50%{transform:translateY(-2px) scale(1.025)}} .gg-familiar-ability-v389{display:grid;gap:3px;padding:10px 12px;margin:0 0 10px;border-radius:14px;border:1px solid rgba(215,176,91,.28);background:rgba(215,176,91,.08)} .gg-familiar-ability-v389 small{font-size:9px;font-weight:950;letter-spacing:.09em}.gg-familiar-ability-v389 b{font-size:14px}.gg-familiar-ability-v389 span{font-size:11px;opacity:.88}.gg-familiar-ability-v389 em{font-size:10px;font-style:normal;opacity:.72} /* New secret Familiar transforms */ .gg-pet-session-transform-v388.celestial-dove{position:absolute;inset:0;pointer-events:none;z-index:26} .gg-pet-session-transform-v388.celestial-dove i{position:absolute;color:#fff1a7;text-shadow:0 0 8px #fff0a5;animation:ggCelestialTwinkleV389 1.4s ease-in-out infinite}.gg-pet-session-transform-v388.celestial-dove i:nth-child(1){left:12%;top:14%}.gg-pet-session-transform-v388.celestial-dove i:nth-child(2){right:8%;top:32%;animation-delay:-.5s}.gg-pet-session-transform-v388.celestial-dove i:nth-child(3){left:46%;bottom:2%;animation-delay:-.9s} .gg-pet-session-transform-v388.moon-crow{position:absolute;right:2px;top:-4px;z-index:26;color:#d6d0ff;font-size:24px;text-shadow:0 0 10px #8e82ff;pointer-events:none;animation:ggMoonCrowV389 2.1s ease-in-out infinite} .gg-pet-session-transform-v388.armored-owl{position:absolute;left:13px;top:18px;width:74px;height:48px;border:3px solid rgba(184,201,219,.88);border-top-width:6px;border-radius:44% 44% 36% 36%;box-shadow:inset 0 0 0 2px rgba(58,73,89,.4),0 0 8px rgba(188,216,240,.28);pointer-events:none;z-index:24} .gg-pet-session-transform-v388.armored-owl b{position:absolute;left:50%;top:12px;transform:translateX(-50%);color:#d8b862;text-shadow:0 0 5px rgba(255,218,109,.5)} @keyframes ggCelestialTwinkleV389{50%{opacity:.25;transform:scale(.7)}}@keyframes ggMoonCrowV389{50%{transform:translateY(-3px) rotate(-6deg)}} /* Owl Hint */ .gg-owl-hint-v389{position:fixed;right:62px;bottom:74px;z-index:2147483600;border:1px solid rgba(215,176,91,.45);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;border-radius:999px;padding:8px 12px;font-weight:900;box-shadow:0 8px 20px rgba(0,0,0,.25);} .gg-owl-hint-v389[hidden]{display:none!important} /* Salon combo + client personality */ .gg-salon-combo-hud-v389{position:fixed!important;left:50%!important;top:76px!important;transform:translateX(-50%)!important;z-index:2147483644!important;display:flex!important;align-items:center!important;gap:8px!important;padding:7px 11px!important;border-radius:14px!important;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important;border:1px solid rgba(215,176,91,.42)!important;color:#181818!important;pointer-events:none!important;box-shadow:0 10px 25px rgba(0,0,0,.25)!important;} .gg-salon-combo-hud-v389 small{font-size:8px;font-weight:950;letter-spacing:.08em}.gg-salon-combo-hud-v389 b{font-size:16px;color:#f2cf73}.gg-salon-combo-hud-v389 span{font-size:9px;opacity:.75} .gg-client-personality-v389{position:fixed;z-index:2147483400;display:grid;gap:2px;padding:6px 9px;border-radius:12px;background:rgba(17,15,20,.88);border:1px solid rgba(255,227,163,.32);color:#fff0c6;pointer-events:none;box-shadow:0 7px 16px rgba(0,0,0,.25)} .gg-client-personality-v389 b{font-size:10px}.gg-client-personality-v389 span{font-size:8px;opacity:.72} .gg-fam-client-bubble-v389{position:absolute!important;left:50%!important;top:-27px!important;transform:translateX(-50%)!important;min-width:84px!important;max-width:150px!important;padding:6px 8px!important;border-radius:12px!important;background:rgba(18,16,22,.94)!important;color:#fff0bf!important;border:1px solid rgba(215,176,91,.4)!important;font-size:9px!important;font-weight:850!important;text-align:center!important;z-index:2147483646!important;pointer-events:none!important} .gg-fam-client-bubble-v389[data-kind="perfect"]{background:rgba(78,54,9,.96)!important;box-shadow:0 0 14px rgba(255,216,95,.45)!important} .gg-cut-perfect-bonus-v389,.gg-cut-familiar-bonus-v389{color:#f4cf69!important;font-weight:900!important} .gg-perfect-cut-v389 .gg-cut-result-v299,.gg-perfect-cut-v389 .gg-v327-done{animation:ggPerfectCardV389 .7s ease both;box-shadow:0 0 0 2px rgba(255,224,126,.32),0 0 36px rgba(255,209,86,.2)!important} .gg-perfect-cut-v389:before{content:"✦ PERFECT CUT ✦";position:fixed;left:50%;top:20%;transform:translateX(-50%);z-index:2147483646;color:#ffe58e;font:1000 clamp(20px,5vw,42px)/1 Inter,sans-serif;text-shadow:0 0 12px rgba(255,212,80,.8);animation:ggPerfectBurstV389 1.25s ease both;pointer-events:none} @keyframes ggPerfectCardV389{0%{transform:scale(.96)}60%{transform:scale(1.02)}100%{transform:scale(1)}}@keyframes ggPerfectBurstV389{0%{opacity:0;transform:translateX(-50%) scale(.65)}25%{opacity:1;transform:translateX(-50%) scale(1.06)}100%{opacity:0;transform:translateX(-50%) translateY(-18px)}} /* Room light ambience */ .gg-ambient-v389{position:absolute;inset:0;z-index:9380;pointer-events:none;overflow:hidden;border-radius:inherit} #avatarRoom.gg-v389-light-star .gg-ambient-v389:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 12% 18%,rgba(255,225,105,.86) 0 1px,transparent 2px),radial-gradient(circle at 39% 28%,rgba(255,225,105,.75) 0 1px,transparent 2px),radial-gradient(circle at 64% 15%,rgba(255,225,105,.9) 0 1px,transparent 2px),radial-gradient(circle at 82% 36%,rgba(255,225,105,.72) 0 1px,transparent 2px),radial-gradient(circle at 24% 60%,rgba(255,225,105,.8) 0 1px,transparent 2px),radial-gradient(circle at 72% 74%,rgba(255,225,105,.82) 0 1px,transparent 2px);animation:ggStarTwinkleV389 1.8s ease-in-out infinite alternate} #avatarRoom.gg-v389-light-moon .gg-ambient-v389:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0,rgba(126,146,255,.12),transparent 42%);animation:ggMoonDriftV389 6s ease-in-out infinite alternate} #avatarRoom.gg-v389-light-disco .gg-ambient-v389:before{content:"";position:absolute;inset:-20%;background:conic-gradient(from 0deg,transparent,rgba(255,75,180,.08),transparent,rgba(85,212,255,.08),transparent,rgba(255,230,70,.08),transparent);animation:ggDiscoReflectV389 5s linear infinite} #avatarRoom.gg-v389-light-red .gg-ambient-v389:before{content:"";position:absolute;inset:0;background:rgba(140,0,18,.11)} @keyframes ggStarTwinkleV389{50%{opacity:.45;filter:brightness(1.5)}}@keyframes ggMoonDriftV389{to{transform:translateY(12px)}}@keyframes ggDiscoReflectV389{to{transform:rotate(360deg)}} .gg-night-event-v389{position:absolute;z-index:3;pointer-events:none}.gg-night-event-v389.shooting{left:-8%;top:17%;font-size:22px;color:#fff4b0;text-shadow:0 0 9px #ffe36f;animation:ggShootingV389 2.4s linear forwards}.gg-night-event-v389.bats{left:-10%;top:24%;font-size:20px;animation:ggBatsV389 3.4s linear forwards}.gg-night-event-v389.shadow{right:8%;bottom:14%;width:34px;height:54px;border-radius:50% 50% 35% 35%;background:rgba(0,0,0,.35);filter:blur(2px);animation:ggShadowV389 3.5s ease both}.gg-night-event-v389.lightning{left:50%;top:4%;font-size:42px;color:#eaf4ff;text-shadow:0 0 16px #fff;animation:ggLightningV389 1s ease both} @keyframes ggShootingV389{to{left:108%;top:48%;opacity:0}}@keyframes ggBatsV389{to{left:108%;top:9%;transform:translateY(-18px) scale(.8);opacity:.2}}@keyframes ggShadowV389{0%,100%{opacity:0}25%,70%{opacity:.58}50%{transform:translateX(-18px)}}@keyframes ggLightningV389{0%,100%{opacity:0}20%,40%{opacity:1}30%,55%{opacity:.15}} .gg-ghost-spirit-sight-v389 .gg-flash-secret-v232{opacity:.18!important;filter:drop-shadow(0 0 6px rgba(228,212,127,.35))!important} /* Furniture effects */ .gg-furniture-fx-v389{position:fixed;z-index:2147483500;pointer-events:none;transform:translate(-50%,-50%);display:block}.gg-furniture-fx-v389 i,.gg-furniture-fx-v389 b{position:absolute;animation:ggFurnitureFloatV389 1.8s ease-out forwards;font-style:normal;color:#ffe295;text-shadow:0 0 7px rgba(255,216,92,.5)}.gg-furniture-fx-v389 i:nth-child(2){left:18px;animation-delay:.15s}.gg-furniture-fx-v389 i:nth-child(3){left:-18px;animation-delay:.28s}.gg-furniture-fx-v389 i:nth-child(4){left:8px;animation-delay:.4s}.gg-furniture-fx-v389.cuckoo b{left:-24px;top:24px;font-size:8px}.gg-furniture-fx-v389.cuckoo i{font-size:22px} @keyframes ggFurnitureFloatV389{from{opacity:0;transform:translateY(8px) scale(.8)}20%{opacity:1}to{opacity:0;transform:translateY(-58px) translateX(14px) rotate(14deg)}} /* Discoveries rarity + progress */ .gg-rarity-v389{display:inline-flex!important;width:max-content;margin-top:6px;padding:3px 6px;border-radius:999px;font-size:7px!important;font-weight:1000!important;letter-spacing:.08em!important;background:rgba(255,255,255,.08)} [data-rarity="rare"] .gg-rarity-v389,[data-rarity="rare"]>.gg-rarity-v389{color:#b9c9ff!important;border:1px solid rgba(133,158,255,.35)}[data-rarity="legendary"] .gg-rarity-v389,[data-rarity="legendary"]>.gg-rarity-v389{color:#ffe082!important;border:1px solid rgba(255,214,82,.48);box-shadow:0 0 10px rgba(255,215,80,.15)} .gg-discovery-progress-v389{display:flex;align-items:center;gap:8px;margin-top:12px;width:min(310px,100%)}.gg-discovery-progress-v389 b{font-size:18px}.gg-discovery-progress-v389 span{font-size:10px;opacity:.7}.gg-discovery-progress-v389 i{flex:1;height:6px;border-radius:999px;background:rgba(255,255,255,.1);overflow:hidden}.gg-discovery-progress-v389 em{display:block;height:100%;background:linear-gradient(90deg,#b89448,#f0d27e);border-radius:inherit} .gg-hidden-achievements-v389{margin-top:24px}.gg-hidden-achievements-v389 .gg-discovery-grid-v260 article small{font-size:9px;opacity:.72} /* Profile + recovery */ .gg-profile-btn-v389,.gg-photo-btn-v389{position:fixed;top:74px;z-index:2147483600;width:38px;height:38px;border-radius:50%;border:1px solid rgba(215,176,91,.42);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;display:grid;place-items:center;font-size:16px;box-shadow:0 8px 20px rgba(0,0,0,.25);} .gg-profile-btn-v389{right:12px}.gg-photo-btn-v389{right:56px} .gg-profile-modal-v389{position:fixed;inset:0;z-index:2147483646;display:grid;place-items:center;padding:16px;opacity:0;transition:opacity .18s ease}.gg-profile-modal-v389[hidden]{display:none!important}.gg-profile-modal-v389.open{opacity:1}.gg-profile-modal-v389 .back{position:absolute;inset:0;background:rgba(3,3,5,.74);backdrop-filter:blur(5px)}.gg-profile-modal-v389>section{position:relative;width:min(620px,100%);max-height:88vh;overflow:auto;padding:22px;border-radius:22px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);border:1px solid rgba(215,176,91,.42);box-shadow:0 28px 70px rgba(0,0,0,.52);color:#181818;}.gg-profile-modal-v389 .x{position:absolute;right:12px;top:10px;border:0;background:transparent;color:#fff;font-size:22px}.gg-profile-modal-v389 h2{margin:3px 0 14px}.gg-profile-fam-v389{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:rgba(215,176,91,.08);margin-bottom:12px}.gg-profile-fam-v389 span{font-size:10px;opacity:.78}.gg-profile-grid-v389{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.gg-profile-grid-v389>div{padding:11px 8px;border-radius:13px;background:rgba(255,255,255,.05);text-align:center}.gg-profile-grid-v389 b{display:block;font-size:18px;color:#f0d17a}.gg-profile-grid-v389 span{font-size:8px;opacity:.72}.gg-profile-ability-v389,.gg-recovery-v389{margin-top:12px;padding:12px;border-radius:14px;background:rgba(255,255,255,.04);display:grid;gap:6px}.gg-profile-ability-v389 span,.gg-recovery-v389 span{font-size:10px;opacity:.75}.gg-recovery-v389 button{border:1px solid rgba(215,176,91,.32);background:rgba(215,176,91,.08);color:#f5dfa3;border-radius:10px;padding:7px 9px;text-align:left;font-size:10px} @media(max-width:560px){.gg-profile-grid-v389{grid-template-columns:repeat(2,minmax(0,1fr))}.gg-salon-combo-hud-v389{top:118px!important}.gg-profile-btn-v389,.gg-photo-btn-v389{top:68px}} /* Photo/camera mode hides interface but keeps scene/avatar/familiar/client */ body.gg-photo-mode-v389 header,body.gg-photo-mode-v389 footer,body.gg-photo-mode-v389 .room-editor,body.gg-photo-mode-v389 .room-edit-below-v212,body.gg-photo-mode-v389 #ggRoomEditBelowV212,body.gg-photo-mode-v389 #roomMoodGaugeV065,body.gg-photo-mode-v389 #ggRoomLevelV143,body.gg-photo-mode-v389 #ggSalonMoneyGaugeV230,body.gg-photo-mode-v389 .gg-salon-combo-hud-v389,body.gg-photo-mode-v389 .gg-client-personality-v389,body.gg-photo-mode-v389 .gg-profile-btn-v389,body.gg-photo-mode-v389 .gg-owl-hint-v389,body.gg-photo-mode-v389 .floating-actions,body.gg-photo-mode-v389 .gg-ai-helper-v370{opacity:0!important;pointer-events:none!important} body.gg-photo-mode-v389 .gg-photo-btn-v389{opacity:1!important;pointer-events:auto!important;right:12px!important;background:rgba(0,0,0,.72)!important} /* Hidden health panel (?debug=1) */ .gg-health-v389{position:fixed;left:8px;top:72px;z-index:2147483647;width:170px;padding:10px;border-radius:13px;background:rgba(5,5,8,.94);border:1px solid rgba(215,176,91,.35);color:#e9dfc8;font:800 10px/1.45 monospace;display:grid;gap:3px;box-shadow:0 12px 28px rgba(0,0,0,.4)}.gg-health-v389>b{color:#f1d481;margin-bottom:3px}.gg-health-v389 .ok{color:#9be6aa}.gg-health-v389 .bad{color:#ff8c9a} /* Cat Collector's Eye gives locked cards a subtle rarity trace without revealing them. */ .gg-cat-collector-eye-v389 .gg-discovery-grid-v260 article.locked{box-shadow:inset 0 0 0 1px rgba(165,143,255,.14)!important} /* ========================================================== v390 — requested fixes: centered Jackalope + AI FX + salon recovery ========================================================== */ .pet-accessory.antlers{ left:50%!important; right:auto!important; top:-10px!important; width:84px!important; transform:translateX(-50%)!important; transform-origin:50% 100%!important; animation:ggJackalopeGrowV390 .62s cubic-bezier(.18,.9,.25,1.15) both!important; } @keyframes ggJackalopeGrowV390{ 0%{opacity:0;transform:translateX(-50%) scale(.2) translateY(8px)} 55%{opacity:1;transform:translateX(-50%) scale(1.12) translateY(-2px)} 100%{opacity:1;transform:translateX(-50%) scale(1) translateY(0)} } /* Existing love hearts now render over the Assistant instead of behind its backdrop. */ .gg-fam-heart-layer-v351{z-index:2147483647!important;pointer-events:none!important} .gg-ai-assistant-v370 .gg-fam-heart-layer-v351{z-index:8!important} .gg-ai-bubbles-v390{position:fixed;inset:0;z-index:8;overflow:hidden;pointer-events:none} .gg-ai-bubbles-v390 i{position:absolute;bottom:-50px;border-radius:50%;border:1.5px solid rgba(210,239,255,.82);background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.85) 0 8%,rgba(170,222,255,.13) 26%,rgba(114,186,255,.05) 62%,transparent 72%);box-shadow:inset 0 0 7px rgba(255,255,255,.45),0 0 7px rgba(145,208,255,.22);animation:ggAiBubbleRiseV390 linear forwards} @keyframes ggAiBubbleRiseV390{0%{opacity:0;transform:translate3d(0,0,0) scale(.72)}12%{opacity:.9}100%{opacity:0;transform:translate3d(var(--drift),-112vh,0) scale(1.08)}} .gg-ai-chat-confetti-host-v390{position:relative!important} .gg-ai-confetti-v390{position:absolute;inset:0;z-index:8;overflow:hidden;pointer-events:none} .gg-ai-confetti-v390 i{position:absolute;font-style:normal;font-size:10px;color:#f4ce68;text-shadow:0 0 5px rgba(255,220,100,.35);animation:ggAiConfettiPopV390 cubic-bezier(.18,.82,.24,1) forwards} .gg-ai-confetti-v390 i:nth-child(3n){color:#ff7ca7}.gg-ai-confetti-v390 i:nth-child(4n){color:#9ed8ff}.gg-ai-confetti-v390 i:nth-child(5n){color:#b9ef9a} @keyframes ggAiConfettiPopV390{0%{opacity:0;transform:translate3d(0,8px,0) scale(.3) rotate(0)}20%{opacity:1;transform:translate3d(calc(var(--dx)*.25),-18px,0) scale(1)}100%{opacity:0;transform:translate3d(var(--dx),115px,0) scale(.75) rotate(var(--spin))}} .gg-ai-unlock-pop-v390{animation:ggAiUnlockCardV390 .72s ease both!important} @keyframes ggAiUnlockCardV390{0%,100%{filter:none}35%{filter:drop-shadow(0 0 18px rgba(255,213,93,.5));transform:scale(1.012)}60%{transform:scale(.997)}} body.gg-salon-v390-recovered #avatarRoom{display:block!important;visibility:visible!important;opacity:1!important} body.gg-salon-v390-recovered .gg-salon-shop-shell-v207{display:block!important;visibility:visible!important;opacity:1!important} /* ========================================================== v391 — AI discoveries, salon safety, chain, blackout, debug ========================================================== */ .gg-ai-command-discoveries-v391{margin-top:28px}.gg-ai-command-discoveries-v391>h2{margin-bottom:6px}.gg-ai-command-discoveries-v391>p{opacity:.75;margin-top:0} .gg-command-grid-v391{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}.gg-command-grid-v391 article{border:1px solid rgba(215,176,91,.2);border-radius:16px;padding:14px;background:rgba(15,14,18,.72);display:grid;gap:5px}.gg-command-grid-v391 article.locked{opacity:.58}.gg-command-grid-v391 article.found{border-color:rgba(215,176,91,.55);box-shadow:inset 0 0 20px rgba(215,176,91,.05)}.gg-command-grid-v391 .sigil{height:44px;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.035);font-size:22px}.gg-command-grid-v391 small{font-weight:900;letter-spacing:.08em;color:#d7b05b} .gg-jack-sparkle-v391{position:absolute;inset:-12px;pointer-events:none}.gg-jack-sparkle-v391 i{position:absolute;font-style:normal;color:#ffe58b;text-shadow:0 0 8px rgba(255,216,92,.8);animation:ggJackSparkV391 1.2s ease forwards}.gg-jack-sparkle-v391 i:nth-child(1){left:7%;top:30%}.gg-jack-sparkle-v391 i:nth-child(2){left:47%;top:-5%;animation-delay:.12s}.gg-jack-sparkle-v391 i:nth-child(3){right:2%;top:28%;animation-delay:.24s}@keyframes ggJackSparkV391{0%{opacity:0;transform:scale(.2) rotate(0)}35%{opacity:1;transform:scale(1.2) rotate(80deg)}100%{opacity:0;transform:scale(.5) translateY(-14px) rotate(160deg)}} .gg-jack-badge-v391{position:absolute;right:52px;top:12px;z-index:4;display:flex;flex-direction:column;gap:1px;padding:5px 8px;border-radius:10px;border:1px solid rgba(215,176,91,.4);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);font-size:10px;color:#181818;}.gg-jack-badge-v391 b{color:#f4d986}.gg-jack-badge-v391 span{opacity:.72} .gg-salon-safe-banner-v391{position:fixed;top:max(8px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);z-index:2147483647;display:flex;align-items:center;gap:8px;max-width:min(92vw,520px);padding:8px 10px;border:1px solid rgba(215,176,91,.48);border-radius:12px;background:rgba(16,14,19,.96);box-shadow:0 8px 26px rgba(0,0,0,.36);font-size:11px}.gg-salon-safe-banner-v391 b{color:#f2d47a}.gg-salon-safe-banner-v391 span{opacity:.78}.gg-salon-safe-banner-v391 button{margin-left:auto;border:0;background:transparent;color:inherit;font-size:17px} .gg-client-exit-v391{position:fixed;z-index:2147483645;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:2px;pointer-events:none;animation:ggClientExitV391 1.75s ease forwards}.gg-client-exit-v391 b{font-size:24px;color:#f1d075;text-shadow:0 0 10px rgba(244,198,76,.45)}.gg-client-exit-v391.goth b{color:#ca7cff}.gg-client-exit-v391.vip b{color:#ffe16a}.gg-client-exit-v391 span{padding:4px 7px;border-radius:999px;background:rgba(10,9,13,.9);font-size:10px;color:#fff}@keyframes ggClientExitV391{0%{opacity:0;transform:translate(-50%,0) scale(.75)}20%{opacity:1;transform:translate(-50%,-10px) scale(1)}100%{opacity:0;transform:translate(-50%,-54px) scale(.92)}} .gg-salon-combo-v391{position:fixed;right:12px;bottom:86px;z-index:2147483645;padding:8px 11px;border-radius:12px;border:1px solid rgba(215,176,91,.5);background:rgba(15,13,18,.94);display:grid;gap:1px;pointer-events:none}.gg-salon-combo-v391 small{font-size:8px;letter-spacing:.12em;color:#d7b05b}.gg-salon-combo-v391 b{font-size:18px}.gg-salon-combo-v391 span{font-size:10px;opacity:.8}.gg-salon-combo-v391.pop{animation:ggChainPopV391 .75s ease}@keyframes ggChainPopV391{35%{transform:scale(1.1);box-shadow:0 0 24px rgba(255,211,83,.42)}} #avatarRoom.gg-perfect-chain-v391 .gg-salon-chair-side-v230,#avatarRoom.gg-perfect-chain-v391 [class*="salon-chair"]{filter:drop-shadow(0 0 10px rgba(255,213,80,.92)) drop-shadow(0 0 22px rgba(255,190,60,.45))!important} .gg-perfect-cut-v391{box-shadow:0 0 0 1px rgba(255,217,100,.5),0 0 24px rgba(255,200,76,.2);border-radius:16px} .gg-fam-reaction-v391{position:absolute;left:50%;bottom:102%;transform:translateX(-50%);z-index:30;white-space:nowrap;padding:5px 8px;border-radius:999px;border:1px solid rgba(215,176,91,.35);background:rgba(12,10,16,.92);font-size:10px;font-weight:900;color:#ffe6a5;pointer-events:none}.gg-fam-reaction-v391[data-kind="love"]{color:#ff9fbc}.gg-fam-reaction-v391[data-kind="bubbles"]{color:#aee3ff} .gg-ai-react-love-v391{animation:ggAiPetLoveV391 .62s ease 2!important}.gg-ai-react-bubbles-v391{animation:ggAiPetBubbleV391 .8s ease 2!important}.gg-ai-react-unlock-v391{animation:ggAiPetUnlockV391 .5s ease 3!important}@keyframes ggAiPetLoveV391{50%{transform:scale(1.1) rotate(4deg)}}@keyframes ggAiPetBubbleV391{50%{transform:translateY(-5px) rotate(-4deg)}}@keyframes ggAiPetUnlockV391{50%{transform:scale(1.08)}} body.gg-blackout-polish-v391 #avatarRoom.gg-blackout-v232 #ggFamiliarRoomHostV339{opacity:1!important;visibility:visible!important;z-index:1550!important}body.gg-blackout-polish-v391 #ggBlackoutEyeLayerV387{z-index:9515!important;filter:brightness(1.3) saturate(1.3)!important}.gg-blackout-eye-pair-v387 i{box-shadow:0 0 3px #ff1637,0 0 8px #ff1637,0 0 16px rgba(255,22,55,.98),0 0 26px rgba(255,22,55,.55)!important} body.gg-photo-freeze-v391 #avatarRoom *:not(.gg-photo-btn-v389),body.gg-photo-freeze-v391 #ggFamiliarRoomHostV339 *,body.gg-photo-freeze-v391 .gg-salon-shop-shell-v207 *{animation-play-state:paused!important;transition-duration:0s!important} .gg-save-health-v391{position:fixed;left:8px;bottom:8px;z-index:2147483647;width:min(360px,calc(100vw - 16px));padding:8px;border-radius:11px;border:1px solid rgba(89,214,132,.4);background:rgba(9,12,11,.94);font:700 10px/1.35 ui-monospace,SFMono-Regular,monospace;color:#b9efc8;display:grid;gap:5px}.gg-save-health-v391[data-ok="0"]{border-color:rgba(255,105,105,.55);color:#ffb0b0}.gg-save-health-v391 button{justify-self:start;border:1px solid currentColor;border-radius:7px;background:transparent;color:inherit;padding:4px 7px;font:inherit} @media(max-width:640px){.gg-jack-badge-v391{right:46px;top:8px;max-width:120px}.gg-salon-combo-v391{right:8px;bottom:80px}.gg-salon-safe-banner-v391{font-size:10px}.gg-command-grid-v391{grid-template-columns:1fr 1fr}} /* ========================================================== v392 — Goldie's Studio client exit + level gauge box corner ========================================================== */ body.gg-salon-room-v206 #avatarRoom.gg-salon-hud-anchor-v392{ position:relative!important; } body.gg-salon-room-v206 #avatarRoom #ggRoomLevelV143.gg-salon-level-boxcorner-v392{ position:absolute!important; right:10px!important; left:auto!important; bottom:10px!important; top:auto!important; transform:none!important; z-index:2147483646!important; margin:0!important; } body.gg-salon-room-v206 #ggRoomLevelV143.gg-salon-level-boxcorner-v392{ pointer-events:auto!important; } .gg-salon-client-v230.gg-client-hopdown-v392{ will-change:transform,left,bottom!important; } /* ========================================================== v393 — Salon polish, mobile HUD, reactions, QA ========================================================== */ body.gg-salon-room-v206 #avatarRoom{position:relative!important} body.gg-salon-room-v206 #ggRoomLevelV143.gg-salon-level-boxcorner-v392{ position:absolute!important;right:10px!important;bottom:10px!important;left:auto!important;top:auto!important; transform:none!important;z-index:2147483646!important;max-width:min(180px,42vw)!important; } @media(max-width:640px){ body.gg-salon-room-v206 #ggRoomLevelV143.gg-salon-level-boxcorner-v392{right:7px!important;bottom:7px!important;max-width:142px!important;padding:5px 7px!important;font-size:10px!important} body.gg-salon-room-v206 #ggRoomLevelV143.gg-salon-level-boxcorner-v392 b, body.gg-salon-room-v206 #ggRoomLevelV143.gg-salon-level-boxcorner-v392 span{font-size:9px!important} #ggSalonStudioCutV327 button,#ggSalonStudioCutV299 button{min-height:42px!important;touch-action:manipulation!important} #ggSalonStudioCutV327 [data-v327-finish],#ggSalonStudioCutV327 [data-v327-done],#ggSalonStudioCutV299 [data-cut-done]{min-height:50px!important;font-size:15px!important;padding:12px 18px!important} #ggSalonStudioCutV327 [data-v327-color]{min-width:42px!important;min-height:42px!important} } .gg-client-request-v393{position:absolute!important;left:50%!important;top:-34px!important;transform:translateX(-50%)!important;z-index:2147483645!important;min-width:116px!important;max-width:190px!important;padding:7px 10px!important;border-radius:14px 14px 14px 4px!important;background:rgba(255,250,239,.97)!important;border:1px solid rgba(98,66,42,.22)!important;color:#2c211d!important;font:800 10px/1.25 Inter,sans-serif!important;text-align:center!important;box-shadow:0 8px 18px rgba(0,0,0,.2)!important;pointer-events:none!important;animation:ggReqPopV393 .25s ease both!important} .gg-client-request-v393[hidden]{display:none!important}@keyframes ggReqPopV393{from{opacity:0;transform:translate(-50%,8px) scale(.9)}to{opacity:1;transform:translate(-50%,0) scale(1)}} .gg-next-client-v393{position:absolute!important;left:50%!important;bottom:9%!important;transform:translateX(-50%) translateY(8px)!important;z-index:2147483600!important;display:flex!important;align-items:center!important;gap:8px!important;padding:7px 11px!important;border-radius:999px!important;background:rgba(14,12,18,.88)!important;border:1px solid rgba(215,176,91,.45)!important;color:#f6df9e!important;font:900 10px/1 Inter,sans-serif!important;opacity:0!important;transition:.25s ease!important;pointer-events:none!important}.gg-next-client-v393[hidden]{display:none!important}.gg-next-client-v393.show{opacity:1!important;transform:translateX(-50%) translateY(0)!important}.gg-next-client-v393 i{width:6px;height:6px;border-radius:50%;background:#f4d174;box-shadow:0 0 8px #f4d174;animation:ggNextDotV393 .8s ease-in-out infinite alternate}@keyframes ggNextDotV393{to{opacity:.3;transform:scale(.7)}} .gg-done-lock-v393{opacity:.72!important;pointer-events:none!important} .gg-perfect-badge-v393{display:grid!important;place-items:center!important;margin:0 auto 12px!important;max-width:220px!important;padding:9px 12px!important;border-radius:15px!important;background:linear-gradient(145deg,#f7df88,#b7862f)!important;color:#241705!important;box-shadow:0 0 0 2px rgba(255,242,170,.35),0 10px 28px rgba(215,176,91,.3)!important;animation:ggPerfectStampV393 .45s cubic-bezier(.15,.8,.2,1.2) both!important}.gg-perfect-badge-v393 b{font-size:20px!important;letter-spacing:.08em!important}.gg-perfect-badge-v393 span{font-size:8px!important;letter-spacing:.08em!important}@keyframes ggPerfectStampV393{0%{opacity:0;transform:scale(1.7) rotate(-7deg)}100%{opacity:1;transform:scale(1) rotate(0)}} .gg-salon-streak-v393{position:fixed!important;left:12px!important;bottom:56px!important;z-index:2147483645!important;display:grid!important;grid-template-columns:auto auto!important;gap:1px 7px!important;align-items:center!important;padding:5px 8px!important;border-radius:11px!important;background:rgba(15,13,18,.88)!important;border:1px solid rgba(215,176,91,.35)!important;color:#f3d274!important;pointer-events:none!important}.gg-salon-streak-v393 small{grid-column:1/-1;font:900 7px/1 Inter,sans-serif;letter-spacing:.11em}.gg-salon-streak-v393 b{font:1000 14px/1 Inter,sans-serif}.gg-salon-streak-v393 span{font:700 8px/1 Inter,sans-serif;opacity:.78} .gg-fam-reaction-v393{position:absolute!important;left:50%!important;top:-18px!important;transform:translate(-50%,-100%)!important;z-index:2147483647!important;min-width:105px!important;padding:6px 9px!important;border-radius:12px!important;background:rgba(14,12,18,.94)!important;border:1px solid rgba(215,176,91,.42)!important;color:#ffe7aa!important;font:850 9px/1.25 Inter,sans-serif!important;text-align:center!important;pointer-events:none!important}.gg-fam-reaction-v393[hidden]{display:none!important} body.gg-studio-cut-pause-v393 #avatarRoom *:not(#ggSalonStudioCutV327):not(#ggSalonStudioCutV327 *):not(#ggSalonStudioCutV299):not(#ggSalonStudioCutV299 *){animation-play-state:paused!important} body.gg-studio-cut-pause-v393 #ggFamiliarRoomHostV339 .pet-hover{animation-play-state:paused!important} .gg-salon-qa-v393{position:fixed;right:8px;top:72px;z-index:2147483647;display:grid;gap:3px;padding:8px 10px;border-radius:10px;background:rgba(0,0,0,.88);border:1px solid rgba(215,176,91,.45);color:#f5dda0;font:700 9px/1.25 ui-monospace,SFMono-Regular,Menlo,monospace;pointer-events:none}.gg-salon-qa-v393 b{font-size:10px;color:#fff0ba} /* ========================================================== v394 — Mobile Studio Cut live comparison workspace ========================================================== */ .gg-v394-safe-exit{opacity:0!important;transform:translate(-50%,-8px)!important;transition:opacity .2s ease,transform .2s ease!important} @media(max-width:760px){ #ggSalonStudioCutV327.gg-v394-mobile-studio{ overflow:hidden!important; height:100dvh!important; min-height:100svh!important; } #ggSalonStudioCutV327.gg-v394-mobile-studio .gg-v327-shell{ width:100%!important; height:100dvh!important; min-height:100svh!important; max-width:none!important; display:flex!important; flex-direction:column!important; overflow:hidden!important; border-left:0!important; border-right:0!important; } #ggSalonStudioCutV327.gg-v394-mobile-studio .gg-v327-shell>header{ position:relative!important; top:auto!important; flex:0 0 auto!important; padding:12px 16px 10px!important; min-height:88px!important; z-index:20!important; } #ggSalonStudioCutV327.gg-v394-mobile-studio .gg-v327-shell>header h2{ font-size:29px!important; margin:2px 0 4px!important; } #ggSalonStudioCutV327.gg-v394-mobile-studio .gg-v327-shell>header p{ font-size:14px!important; line-height:1.25!important; max-width:calc(100vw - 82px)!important; } #ggSalonStudioCutV327.gg-v394-mobile-studio .gg-v327-shell>header button[data-v327-close]{ width:46px!important;height:46px!important;flex:0 0 46px!important;font-size:28px!important; } .gg-v394-compare-dock{ flex:0 0 auto!important; display:grid!important; grid-template-columns:1fr 1fr!important; gap:7px!important; padding:7px 8px 8px!important; background:linear-gradient(180deg,rgba(10,9,14,.99),rgba(12,11,16,.97))!important; border-bottom:1px solid rgba(215,176,91,.22)!important; box-shadow:0 7px 18px rgba(0,0,0,.32)!important; z-index:18!important; } .gg-v394-preview-pane{ min-width:0!important; border:1px solid #332e36!important; border-radius:14px!important; padding:6px!important; background:#111015!important; overflow:hidden!important; } .gg-v394-preview-pane .gg-v327-title{ padding:0 1px 5px!important; gap:4px!important; } .gg-v394-preview-pane .gg-v327-title b{ font-size:10px!important; letter-spacing:.11em!important; white-space:nowrap!important; } .gg-v394-preview-pane .gg-v327-title span{ font-size:9px!important; white-space:nowrap!important; } .gg-v394-preview-pane .gg-v327-preview{ height:154px!important; border-radius:10px!important; } .gg-v394-preview-pane .gg-v327-cut-avatar>svg{ width:128%!important; transform:translateY(-45px)!important; } #ggSalonStudioCutV327.gg-v394-mobile-studio .gg-v327-main{ flex:1 1 auto!important; min-height:0!important; display:block!important; padding:8px!important; overflow-y:auto!important; overflow-x:hidden!important; -webkit-overflow-scrolling:touch!important; overscroll-behavior:contain!important; scroll-padding-bottom:105px!important; } #ggSalonStudioCutV327.gg-v394-mobile-studio .gg-v327-main>section{ width:100%!important; border:0!important; background:transparent!important; padding:0!important; } #ggSalonStudioCutV327.gg-v394-mobile-studio .gg-v394-hidden-source{ display:none!important; } #ggSalonStudioCutV327.gg-v394-mobile-studio .gg-v327-editor{ padding:0 0 100px!important; } .gg-v394-editor-group{ margin:0 0 8px!important; border:1px solid #37313b!important; border-radius:14px!important; background:#111015!important; overflow:hidden!important; } .gg-v394-group-toggle{ width:100%!important; min-height:48px!important; display:flex!important; align-items:center!important; justify-content:space-between!important; gap:10px!important; padding:11px 13px!important; border:0!important; border-radius:0!important; background:linear-gradient(180deg,#17151c,#121116)!important; color:#efd16e!important; font-size:14px!important; font-weight:900!important; text-align:left!important; } .gg-v394-group-toggle i{font-style:normal!important;transition:transform .18s ease!important} .gg-v394-editor-group.open .gg-v394-group-toggle i{transform:rotate(180deg)!important} .gg-v394-group-body{display:none!important;padding:10px!important} .gg-v394-editor-group.open .gg-v394-group-body{display:block!important} .gg-v394-group-body>.row{ display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:8px!important; } .gg-v394-group-body>.row.colors{ grid-template-columns:repeat(6,40px)!important; justify-content:start!important; } .gg-v394-group-body button{ min-height:46px!important; padding:9px 7px!important; font-size:11px!important; } .gg-v394-group-body>.row.colors button{ width:40px!important;height:40px!important;min-height:40px!important;padding:0!important; } .gg-v394-group-body>small{ margin:8px 2px 1px!important; line-height:1.35!important; } .gg-v394-actionbar{ flex:0 0 auto!important; display:grid!important; grid-template-columns:minmax(84px,.8fr) minmax(145px,1.35fr) auto!important; align-items:center!important; gap:8px!important; padding:8px max(8px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))!important; border-top:1px solid rgba(215,176,91,.28)!important; background:rgba(10,9,13,.98)!important; box-shadow:0 -8px 24px rgba(0,0,0,.34)!important; z-index:24!important; } .gg-v394-actionbar .gg-v327-score{ display:grid!important; grid-template-columns:auto 1fr!important; grid-template-rows:auto auto!important; gap:1px 6px!important; align-items:center!important; text-align:left!important; padding:3px 2px!important; } .gg-v394-actionbar .gg-v327-score strong{ grid-row:1/3!important; font-size:23px!important; line-height:1!important; } .gg-v394-actionbar .gg-v327-score span{ font-size:8px!important; align-self:end!important; } .gg-v394-actionbar .gg-v327-meter{ height:5px!important; align-self:start!important; } .gg-v394-actionbar .gg-v327-finish{ min-height:50px!important; margin:0!important; padding:10px 12px!important; font-size:15px!important; border-radius:14px!important; } .gg-v394-preview-jump{ min-height:44px!important; padding:7px 8px!important; border-radius:12px!important; border:1px solid rgba(215,176,91,.55)!important; background:#17151c!important; color:#f2d47a!important; font:900 10px/1 Inter,sans-serif!important; } /* Safe-mode fallback must never sit over Studio Cut. */ body:has(#ggSalonStudioCutV327) #ggSalonSafeModeV391{display:none!important} } @media(max-width:390px){ .gg-v394-preview-pane .gg-v327-preview{height:142px!important} .gg-v394-preview-pane .gg-v327-cut-avatar>svg{width:134%!important;transform:translateY(-48px)!important} .gg-v394-group-body>.row{grid-template-columns:repeat(2,minmax(0,1fr))!important} .gg-v394-group-body>.row.colors{grid-template-columns:repeat(5,40px)!important} .gg-v394-actionbar{grid-template-columns:78px minmax(130px,1fr) 56px!important;gap:6px!important} .gg-v394-preview-jump{font-size:9px!important;padding:6px!important} } /* ========================================================== v397 — Death Moth Familiar + blackout flashlight hunt ========================================================== */ .death-moth-pet .death-moth-wing-v397{fill:#191617;stroke:#71604b;stroke-width:2.5;transform-box:fill-box;transform-origin:center;animation:ggDeathMothWingV397 .48s ease-in-out infinite alternate} .death-moth-pet .death-moth-wing-v397.left{transform-origin:100% 55%}.death-moth-pet .death-moth-wing-v397.right{transform-origin:0 55%;animation-direction:alternate-reverse} .death-moth-pet .death-moth-wing-mark-v397{fill:none;stroke:#5e6a50;stroke-width:2.1;opacity:.75} .death-moth-pet .death-moth-thorax-v397{fill:#2d2926;stroke:#8b7560;stroke-width:2.4} .death-moth-pet .death-moth-abdomen-v397{fill:#201e1d;stroke:#6f6255;stroke-width:2.1} .death-moth-pet .death-moth-antenna-v397{fill:none;stroke:#8b7560;stroke-width:2.2;stroke-linecap:round} .death-moth-pet .death-moth-eye-v397{fill:#79ff42;stroke:#caff9f;stroke-width:1.1;filter:drop-shadow(0 0 4px #62ff2d) drop-shadow(0 0 10px rgba(86,255,42,.9));animation:ggDeathMothEyeV397 1.25s ease-in-out infinite alternate} .death-moth-pet .death-moth-shadow-v397{fill:rgba(0,0,0,.32)} @keyframes ggDeathMothWingV397{from{transform:rotate(-7deg) scaleY(.94)}to{transform:rotate(7deg) scaleY(1.04)}} @keyframes ggDeathMothEyeV397{from{opacity:.72}to{opacity:1;filter:drop-shadow(0 0 5px #73ff3a) drop-shadow(0 0 14px rgba(86,255,42,1))}} .gg-death-moth-hunt-v397{position:absolute;left:-14%;top:var(--moth-y,38%);width:82px;height:62px;z-index:9504!important;pointer-events:none!important;animation:ggDeathMothFlyV397 var(--moth-dur,14s) linear forwards;filter:drop-shadow(0 6px 8px rgba(0,0,0,.6))} .gg-death-moth-hunt-inner-v397{width:100%;height:100%;animation:ggDeathMothBobV397 .9s ease-in-out infinite alternate} .gg-death-moth-hunt-v397 svg{display:block;width:100%;height:100%;overflow:visible} .gg-death-moth-hunt-v397 .wing{fill:#070707;stroke:#262521;stroke-width:2.4;transform-box:fill-box;animation:ggDeathMothHuntWingV397 .28s ease-in-out infinite alternate} .gg-death-moth-hunt-v397 .wing.left{transform-origin:100% 58%}.gg-death-moth-hunt-v397 .wing.right{transform-origin:0 58%;animation-direction:alternate-reverse} .gg-death-moth-hunt-v397 .mark{fill:none;stroke:#151b12;stroke-width:2;opacity:.45} .gg-death-moth-hunt-v397 .body,.gg-death-moth-hunt-v397 .tail{fill:#080808;stroke:#20221d;stroke-width:2} .gg-death-moth-hunt-v397 .antenna{fill:none;stroke:#252822;stroke-width:2;stroke-linecap:round} .gg-death-moth-hunt-v397 .eye{fill:#66ff35;stroke:#c8ffa9;stroke-width:1;filter:drop-shadow(0 0 4px #59ff25) drop-shadow(0 0 11px rgba(72,255,35,.96));animation:ggDeathMothEyeV397 .75s ease-in-out infinite alternate} .gg-death-moth-hunt-v397.lit .wing{fill:#29251f;stroke:#8d7a5e}.gg-death-moth-hunt-v397.lit .mark{stroke:#788b5d;opacity:.9}.gg-death-moth-hunt-v397.lit .body,.gg-death-moth-hunt-v397.lit .tail{fill:#302a24;stroke:#9a8064}.gg-death-moth-hunt-v397.lit .antenna{stroke:#a08b6b} .gg-death-moth-hunt-v397.caught{animation:none!important;left:50%!important;top:42%!important;transform:translate(-50%,-50%) scale(1.35)!important;opacity:0;transition:transform .65s ease,opacity .8s ease;filter:drop-shadow(0 0 20px rgba(88,255,45,.85))} @keyframes ggDeathMothFlyV397{0%{left:-14%;transform:translateY(0) rotate(-5deg)}20%{transform:translateY(-35px) rotate(4deg)}42%{transform:translateY(24px) rotate(-3deg)}64%{transform:translateY(-20px) rotate(5deg)}82%{transform:translateY(30px) rotate(-4deg)}100%{left:108%;transform:translateY(-8px) rotate(2deg)}} @keyframes ggDeathMothBobV397{from{transform:translateY(-4px)}to{transform:translateY(5px)}} @keyframes ggDeathMothHuntWingV397{from{transform:rotate(-13deg) scaleY(.87)}to{transform:rotate(13deg) scaleY(1.08)}} .gg-death-moth-meter-v397{position:absolute!important;left:50%!important;bottom:74px!important;transform:translateX(-50%) translateY(10px)!important;z-index:9510!important;width:min(280px,76%)!important;padding:9px 11px!important;border-radius:15px!important;background:rgba(7,8,7,.94)!important;border:1px solid rgba(112,255,65,.48)!important;color:#b8ff9d!important;box-shadow:0 12px 28px rgba(0,0,0,.45),0 0 18px rgba(75,255,37,.12)!important;opacity:0!important;pointer-events:none!important;transition:opacity .16s ease,transform .16s ease!important} .gg-death-moth-meter-v397.show,.gg-death-moth-meter-v397.complete{opacity:1!important;transform:translateX(-50%) translateY(0)!important} .gg-death-moth-meter-v397>span{display:block!important;font:900 10px/1.2 Inter,sans-serif!important;letter-spacing:.08em!important;text-align:center!important;margin-bottom:6px!important} .gg-death-moth-meter-v397>div{height:7px!important;border-radius:999px!important;background:#1c2119!important;overflow:hidden!important}.gg-death-moth-meter-v397>div>i{display:block!important;width:0;height:100%!important;background:linear-gradient(90deg,#4cff23,#c7ff72)!important;box-shadow:0 0 9px rgba(81,255,37,.72)!important} .gg-death-moth-meter-v397>b{display:block!important;text-align:center!important;margin-top:5px!important;font-size:10px!important;color:#e1ffd4!important} /* Death Moth keeps its toxic-green eye identity during room blackout. */ .gg-blackout-v232 .gg-familiar-room-host-v339[data-pet-type="deathMoth"] .death-moth-eye-v397{fill:#66ff35!important;stroke:#d0ffb4!important;opacity:1!important;filter:drop-shadow(0 0 5px #59ff25) drop-shadow(0 0 14px rgba(72,255,35,.95))!important} /* ========================================================== v398 — Secret Familiar world + progression polish ========================================================== */ .gg-unlock-burst-v398{position:fixed;inset:0;z-index:2147483647;pointer-events:none;overflow:hidden}.gg-unlock-burst-v398 i{position:absolute;left:50%;top:62%;font-style:normal;color:#f5d568;text-shadow:0 0 10px currentColor;animation:ggUnlockBurstV398 1.8s ease-out forwards}@keyframes ggUnlockBurstV398{to{transform:translate(var(--x),var(--y)) rotate(300deg);opacity:0}} .gg-secret-cinematic-v398{position:fixed;inset:0;z-index:2147483647;background:rgba(0,0,0,.78);display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .22s ease}.gg-secret-cinematic-v398.show{opacity:1}.gg-secret-cinematic-v398 section{position:relative;padding:28px 34px;border:1px solid rgba(117,255,77,.65);border-radius:24px;background:linear-gradient(145deg,#0a100b,#12151b);box-shadow:0 0 44px rgba(85,255,56,.22);text-align:center;display:grid;gap:8px;min-width:min(82vw,360px)}.gg-secret-cinematic-v398 small{color:#8dff69;font-weight:900;letter-spacing:.16em}.gg-secret-cinematic-v398 b{font:900 clamp(28px,7vw,48px)/1 Georgia,serif;color:#f1f5ec}.gg-secret-cinematic-v398 span{color:#bdd8ba}.gg-secret-cinematic-v398 .particles i{position:absolute;left:50%;top:50%;width:6px;height:6px;border-radius:50%;background:#6cff3f;box-shadow:0 0 10px #6cff3f;animation:ggSecretParticleV398 1.9s ease-out forwards}.gg-secret-cinematic-v398 .particles i:nth-child(3n){--a:120deg}.gg-secret-cinematic-v398 .particles i:nth-child(3n/**/+1){--a:240deg}.gg-secret-cinematic-v398 .particles i:nth-child(3n/**/+2){--a:360deg}@keyframes ggSecretParticleV398{to{transform:rotate(var(--a,45deg)) translateY(-45vh);opacity:0}} .gg-secret-hunt-v398{position:absolute;left:62%;top:18%;z-index:9390;border:0;background:transparent;color:#fff;display:grid;place-items:center;cursor:pointer;filter:drop-shadow(0 0 12px rgba(255,255,255,.25));animation:ggSecretHuntFloatV398 2.6s ease-in-out infinite;touch-action:manipulation}.gg-secret-hunt-v398 i{font-style:normal;font-size:42px;filter:grayscale(.35)}.gg-secret-hunt-v398 span{position:absolute;right:-8px;top:-8px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#16131b;border:1px solid #d7b05b;color:#f3d46d;font-size:11px;font-weight:900}.gg-secret-hunt-v398.hit{transform:scale(1.12)}.gg-secret-hunt-v398.caught{animation:ggHuntCaughtV398 .65s ease forwards}.gg-secret-hunt-v398.moonOwl i{filter:drop-shadow(0 0 12px #d7eaff)}.gg-secret-hunt-v398.mirrorGhost i{filter:drop-shadow(0 0 12px #c7f8ff)}.gg-secret-hunt-v398.cuckooBat i{filter:drop-shadow(0 0 12px #be95ff)}@keyframes ggSecretHuntFloatV398{50%{transform:translateY(-12px) rotate(3deg)}}@keyframes ggHuntCaughtV398{to{transform:scale(.2) rotate(22deg);opacity:0}} .gg-fam-encyclopedia-v398{margin:28px auto;padding:22px;border:1px solid rgba(215,176,91,.32);border-radius:24px;background:rgba(16,14,19,.82)}.gg-fam-encyclopedia-v398 .head{display:flex;align-items:end;justify-content:space-between;gap:16px}.gg-fam-encyclopedia-v398 .head h2{margin:3px 0}.gg-fam-encyclopedia-v398 .head> b{font-size:22px;color:#f2cf69}.gg-fam-encyclopedia-v398 .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:10px;margin-top:18px}.gg-fam-encyclopedia-v398 .grid button{min-height:116px;border:1px solid rgba(215,176,91,.25);border-radius:18px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;display:grid;place-items:center;align-content:center;gap:5px;}.gg-fam-encyclopedia-v398 .grid button i{font-style:normal;font-size:30px}.gg-fam-encyclopedia-v398 .grid button small{font-size:9px;letter-spacing:.08em;color:#d7b05b}.gg-fam-encyclopedia-v398 .grid button.locked{filter:saturate(.15);opacity:.58}.gg-fam-encyclopedia-v398 .grid button.active{box-shadow:0 0 0 2px #d7b05b inset}.gg-fam-encyclopedia-v398 .detail{margin-top:14px;padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.035);display:grid;gap:5px}.gg-fam-encyclopedia-v398 .detail span,.gg-fam-encyclopedia-v398 .detail small{color:#c9c4cc}.gg-rare-client-collection-v398{margin-top:18px;border-top:1px solid rgba(215,176,91,.18);padding-top:16px}.gg-rare-client-collection-v398>div{display:flex;gap:8px;flex-wrap:wrap}.gg-rare-client-collection-v398 span{padding:7px 10px;border-radius:999px;background:#15131a;border:1px solid rgba(215,176,91,.2);font-size:11px}.gg-rare-client-collection-v398 span.locked{opacity:.45} .gg-death-moth-ability-v398 .gg-flash-secret-v232,.gg-death-moth-ability-v398 #ggSideDoorV111,.gg-death-moth-ability-v398 .v061-mirror,.gg-death-moth-ability-v398 .v097-bookshelf{filter:drop-shadow(0 0 8px rgba(91,255,58,.55))!important}.gg-moth-ceiling-circle-v398{animation:ggMothCeilingCircleV398 4.2s ease-in-out!important}@keyframes ggMothCeilingCircleV398{25%{transform:translate(-50%,-50%) translateY(-32px) translateX(24px)}55%{transform:translate(-50%,-50%) translateY(-46px) translateX(-16px)}80%{transform:translate(-50%,-50%) translateY(-14px) translateX(8px)}} .moon-owl-v398 .owl-eye-v345{fill:#b8e6ff!important;filter:drop-shadow(0 0 5px #9fdfff)}.moon-owl-v398 .owl-panel-v345{fill:#1d2743!important}.mirror-ghost-v398 .ghost-body-v345{filter:drop-shadow(0 0 10px rgba(189,241,255,.75));opacity:.85}.cuckoo-bat-v398 .bat-body-v345{fill:#4c3528!important}.cuckoo-bat-v398 .bat-wing-v345{stroke:#b38863!important} .gg-client-fam-request-v398{position:absolute;left:50%;top:-44px;transform:translateX(-50%);z-index:2147483500;width:max-content;max-width:210px;padding:9px 12px;border-radius:14px;background:rgba(13,12,17,.96);border:1px solid rgba(215,176,91,.55);box-shadow:0 8px 20px rgba(0,0,0,.35);display:grid;gap:2px;pointer-events:none}.gg-client-fam-request-v398 small{font-size:8px;color:#e7c76a;letter-spacing:.08em}.gg-client-fam-request-v398 b{font-size:11px;color:#fff} .gg-studio-quick-v398{padding:10px 0 14px;border-bottom:1px solid rgba(215,176,91,.14);margin-bottom:10px}.gg-studio-quick-v398 small{display:block;color:#d7b05b;font-weight:900;letter-spacing:.08em;margin-bottom:7px}.gg-studio-quick-v398>div{display:flex;gap:7px;overflow:auto}.gg-studio-quick-v398 button{white-space:nowrap!important;padding:8px 10px!important;min-height:36px!important}.gg-v327-editor [data-v327-hair]{position:relative}.gg-v327-editor .fav398{position:absolute;top:2px;right:5px;font-style:normal;color:#e6c864;font-size:11px;z-index:2}.gg-v327-editor .fav-v398{box-shadow:0 0 0 1px rgba(241,205,95,.65) inset!important} .gg-salon-cosmetics-v398{grid-column:1/-1;padding:12px;border:1px solid rgba(215,176,91,.22);border-radius:16px}.gg-salon-cosmetics-v398>div{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}.gg-salon-cosmetics-v398 button{padding:8px 10px;border-radius:999px}.gg-salon-cosmetics-v398 button.active{border-color:#d7b05b;background:rgba(215,176,91,.18)}.gg-salon-cos-overlay-v398{position:absolute;left:50%;top:8%;transform:translateX(-50%);z-index:120;font-size:36px;filter:drop-shadow(0 2px 5px rgba(0,0,0,.35));pointer-events:none} .gg-progress-hub-v398{margin-top:16px;padding:14px;border:1px solid rgba(215,176,91,.2);border-radius:16px;background:rgba(255,255,255,.03)}.gg-progress-hub-v398>div{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:9px 0}.gg-progress-hub-v398 span{display:flex;justify-content:space-between;gap:8px}.gg-progress-hub-v398 p{margin:5px 0;color:#c8c3ca;font-size:12px} /* Keep notifications from stacking over game screens. */ .gg-notification-clean-v398 [class*="safe-mode"],.gg-notification-clean-v398 [id*="SafeMode"]{max-width:280px!important;right:10px!important;left:auto!important;top:78px!important;bottom:auto!important;animation:ggSafeFadeV398 5s ease forwards!important}@keyframes ggSafeFadeV398{0%,75%{opacity:1}100%{opacity:0;visibility:hidden}} /* Compact lower-game controls on small phones. */ @media(max-width:720px){ body.gg-mobile-game-tray-v398 :is(#ggProfileBtnV389,#ggPhotoModeBtnV389,#ggOwlHintBtnV389){transform:scale(.84);transform-origin:center} body.gg-mobile-game-tray-v398 .gg-fam-encyclopedia-v398{margin-inline:10px;padding:15px} body.gg-mobile-game-tray-v398 .gg-fam-encyclopedia-v398 .grid{grid-template-columns:repeat(3,1fr)} .gg-client-fam-request-v398{top:-34px;max-width:170px} } /* Automatic lightweight performance fallback. */ .gg-performance-lite-v398 :is(.gg-fam-heart-v351,.gg-room-star-particle,.gg-furniture-fx-v389,.gg-fam-theme-shift-v381){animation-duration:2.6s!important}.gg-performance-lite-v398 .gg-familiar-roaming-v375{animation:none!important} .gg-selftest-fail-v398{position:fixed;left:8px;bottom:8px;z-index:2147483646;border:1px solid #ef9d48;background:#24160e;color:#ffd6a8;border-radius:999px;padding:7px 10px;font-size:10px} /* v400 — Astro Fish familiar + Moon Owl polish + Salon tap polish */ .moon-owl-v398 .owl-eye-v345{fill:#f4df74!important;filter:drop-shadow(0 0 5px #f1d25a) drop-shadow(0 0 10px rgba(245,211,92,.7))!important} .moon-owl-v398 .pet-hover{position:relative} .moon-owl-v398 .pet-hover::after{content:"☾";position:absolute;left:50%;top:58%;transform:translate(-50%,-50%);font:900 20px/1 Georgia,serif;color:#f3dd85;text-shadow:0 0 8px rgba(246,222,127,.55);pointer-events:none} .astro-fish-pet .astro-fish-shadow-v400{fill:rgba(0,0,0,.24)} .astro-fish-pet .astro-fish-helmet-v400{fill:rgba(196,236,255,.24);stroke:#dff6ff;stroke-width:2.3} .astro-fish-pet .astro-fish-water-v400{fill:rgba(86,202,255,.18);stroke:rgba(212,247,255,.6);stroke-width:1.2} .astro-fish-pet .astro-fish-body-fill-v400{fill:#ff9e42;stroke:#9f4d15;stroke-width:2.4} .astro-fish-pet .astro-fish-tail-v400,.astro-fish-pet .astro-fish-fin-v400,.astro-fish-pet .astro-fish-winglet-v400{fill:#ffa94f;stroke:#9f4d15;stroke-width:2.1} .astro-fish-pet .astro-fish-eye-v400{fill:#172029;stroke:#fff;stroke-width:2;filter:drop-shadow(0 0 2px rgba(255,255,255,.4))} .astro-fish-pet .astro-fish-mouth-v400{fill:none;stroke:#7f2f18;stroke-width:2.2;stroke-linecap:round} .astro-fish-pet .astro-fish-bubble-v400{fill:rgba(201,243,255,.55);stroke:#dff8ff;stroke-width:1.2;animation:ggAstroFishBubbleV400 1.6s ease-in-out infinite} .astro-fish-pet .astro-fish-bubble-v400.b2{animation-delay:.55s} .astro-fish-pet .pet-hover{animation:ggAstroFishHoverV400 2.2s ease-in-out infinite} @keyframes ggAstroFishHoverV400{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}} @keyframes ggAstroFishBubbleV400{0%,100%{transform:translateY(0);opacity:.65}50%{transform:translateY(-4px);opacity:1}} body.gg-salon-room-v206 #avatarRoom #ggFamiliarRoomHostV339.gg-salon-passive-v400{z-index:430!important;pointer-events:none!important;opacity:.94!important} body.gg-salon-room-v206 #avatarRoom #ggFamiliarRoomHostV339.gg-salon-passive-v400 .gg-familiar-room-reaction-v343{display:none!important} body.gg-salon-room-v206 #ggSalonClientV230{pointer-events:auto!important;touch-action:manipulation!important} /* ========================================================== v401 — Salon performance consolidation + Familiar polish ========================================================== */ body.gg-salon-room-v206 #ggSalonClientV230.gg-client-tappable-v401{pointer-events:auto!important;touch-action:manipulation!important;cursor:pointer!important;z-index:700!important} body.gg-salon-room-v206 #ggSalonClientV230.gg-client-arrive-halo-v401{filter:drop-shadow(0 0 7px rgba(255,222,118,.9)) drop-shadow(0 0 16px rgba(215,176,91,.65))!important} body.gg-salon-room-v206 #ggFamiliarRoomHostV339.gg-salon-pet-paused-v401{z-index:430!important;pointer-events:none!important} body.gg-salon-room-v206 #ggFamiliarRoomHostV339.gg-salon-pet-paused-v401 .pet-hover, body.gg-salon-room-v206 #ggFamiliarRoomHostV339.gg-salon-pet-paused-v401 .gg-familiar-room-avatar-v339{animation-play-state:paused!important} body.gg-salon-performance-v401 #avatarRoom .room-moon-bats-v065, body.gg-salon-performance-v401 #avatarRoom .room-disco-effects-v072, body.gg-salon-performance-v401 #avatarRoom .room-disco-lasers-v083, body.gg-salon-performance-v401 #avatarRoom .room-lens-flare-v075, body.gg-salon-performance-v401 #avatarRoom .room-saturn-galaxy-v091{animation-play-state:paused!important} body.gg-studio-performance-pause-v401 #avatarRoom .room-moon-bats-v065, body.gg-studio-performance-pause-v401 #avatarRoom .room-disco-effects-v072, body.gg-studio-performance-pause-v401 #avatarRoom .room-disco-lasers-v083, body.gg-studio-performance-pause-v401 #avatarRoom .room-lens-flare-v075, body.gg-studio-performance-pause-v401 #avatarRoom .room-star-field-v072, body.gg-studio-performance-pause-v401 #avatarRoom .room-saturn-galaxy-v091, body.gg-studio-performance-pause-v401 #avatarRoom .gg-familiar-room-host-v339 .pet-hover{animation-play-state:paused!important} body.gg-studio-performance-pause-v401 #avatarRoom .room-disco-effects-v072, body.gg-studio-performance-pause-v401 #avatarRoom .room-disco-lasers-v083, body.gg-studio-performance-pause-v401 #avatarRoom .room-lens-flare-v075{opacity:.08!important} .gg-studio-opening-v401{position:fixed;left:50%;top:44%;transform:translate(-50%,-50%);z-index:2147483647;display:flex;align-items:center;gap:9px;padding:12px 16px;border-radius:16px;background:rgba(13,12,17,.96);border:1px solid rgba(215,176,91,.55);color:#f6dfa0;box-shadow:0 18px 42px rgba(0,0,0,.46);font:900 13px/1.2 Inter,system-ui,sans-serif}.gg-studio-opening-v401[hidden]{display:none!important}.gg-studio-opening-v401 i{width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,231,160,.25);border-top-color:#f0c75e;animation:ggStudioOpenSpinV401 .65s linear infinite}@keyframes ggStudioOpenSpinV401{to{transform:rotate(360deg)}} .gg-salon-safe-v401{position:fixed;left:50%;top:96px;transform:translateX(-50%);z-index:2147483647;width:min(420px,calc(100% - 28px));display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:start;padding:11px 12px;border-radius:15px;background:#151319;border:1px solid rgba(215,176,91,.55);box-shadow:0 15px 35px rgba(0,0,0,.38);color:#e7dfd4}.gg-salon-safe-v401 b{color:#f0ca67}.gg-salon-safe-v401 span{font-size:12px;line-height:1.35}.gg-salon-safe-v401 button{border:0;background:transparent;color:#fff;font-size:19px} .gg-client-request-card-v401{display:grid;gap:2px;margin:0 0 8px;padding:8px 9px;border:1px solid rgba(215,176,91,.3);border-radius:12px;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;}.gg-client-request-card-v401 small{color:#d7b05b;font-weight:900;letter-spacing:.08em}.gg-client-request-card-v401 b{color:#fff}.gg-client-request-card-v401 span{color:#cfc8c0;font-size:11px} .gg-salon-perf-v401{position:fixed;left:8px;top:8px;z-index:2147483647;display:grid;gap:3px;max-width:260px;padding:8px 10px;border-radius:12px;background:rgba(8,9,12,.92);border:1px solid rgba(113,255,150,.38);color:#d9ffe4;font:700 10px/1.35 ui-monospace,SFMono-Regular,Menlo,monospace;pointer-events:none}.gg-salon-perf-v401 b{color:#8dffae} @media(max-width:760px){ #ggSalonStudioCutV327 .gg-v327-shell{height:100dvh!important;max-height:100dvh!important;overflow:hidden!important;padding-bottom:76px!important} #ggSalonStudioCutV327 .gg-v327-shell>header{flex:0 0 auto!important;padding:12px 14px 10px!important} #ggSalonStudioCutV327 .gg-v401-compare-dock{position:sticky!important;top:0!important;z-index:30!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;padding:8px!important;background:rgba(10,9,14,.985)!important;border-bottom:1px solid rgba(215,176,91,.24)!important} #ggSalonStudioCutV327 .gg-v401-compare-dock>section{min-width:0!important;border:1px solid rgba(255,255,255,.10)!important;border-radius:15px!important;padding:7px!important;background:#0d0c11!important} #ggSalonStudioCutV327 .gg-v401-compare-dock .gg-v327-title{margin-bottom:4px!important}.gg-v401-compare-dock .gg-v327-title span{font-size:10px!important} #ggSalonStudioCutV327 .gg-v401-compare-dock .gg-v327-preview{height:188px!important;min-height:188px!important;margin:0!important;overflow:hidden!important} #ggSalonStudioCutV327 .gg-v327-main{display:block!important;overflow:hidden!important;min-height:0!important;flex:1 1 auto!important} #ggSalonStudioCutV327 .gg-v401-controls{height:100%!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;padding:10px 12px 90px!important;border:0!important} #ggSalonStudioCutV327 .gg-v401-hidden-source{display:none!important} #ggSalonStudioCutV327 .gg-v327-editor{padding-bottom:20px!important} #ggSalonStudioCutV327 .gg-v327-editor .row{display:flex!important;flex-wrap:wrap!important;gap:8px!important} #ggSalonStudioCutV327 .gg-v327-editor button{min-height:48px!important;font-size:14px!important} #ggSalonStudioCutV327 .gg-v401-actionbar{position:absolute!important;left:0!important;right:0!important;bottom:0!important;z-index:45!important;display:grid!important;grid-template-columns:minmax(110px,.7fr) 1.3fr!important;gap:9px!important;align-items:center!important;padding:8px 10px calc(8px + env(safe-area-inset-bottom))!important;background:rgba(9,8,12,.985)!important;border-top:1px solid rgba(215,176,91,.3)!important} #ggSalonStudioCutV327 .gg-v401-actionbar .gg-v327-score{margin:0!important;padding:0 8px!important;display:grid!important;grid-template-columns:auto 1fr!important;grid-template-areas:"score label" "meter meter"!important;gap:2px 8px!important;align-items:center!important} #ggSalonStudioCutV327 .gg-v401-actionbar .gg-v327-score strong{grid-area:score!important;font-size:24px!important}#ggSalonStudioCutV327 .gg-v401-actionbar .gg-v327-score span{grid-area:label!important;font-size:11px!important}#ggSalonStudioCutV327 .gg-v401-actionbar .gg-v327-meter{grid-area:meter!important;margin-top:3px!important} #ggSalonStudioCutV327 .gg-v401-actionbar .gg-v327-finish{margin:0!important;min-height:54px!important} } /* Astro Fish: flying/swimming pet with a water helmet. */ .astro-fish-pet .pet-hover{animation:ggAstroFishFlyV401 2.4s ease-in-out infinite!important}.astro-fish-pet .astro-fish-tail-v400{transform-box:fill-box;transform-origin:100% 50%;animation:ggAstroFishTailV401 .42s ease-in-out infinite alternate}.astro-fish-pet .astro-fish-winglet-v400{transform-box:fill-box;transform-origin:center;animation:ggAstroFishWingV401 .5s ease-in-out infinite alternate}.astro-fish-pet .astro-fish-bubble-v400{animation:ggAstroFishBubbleV401 1.8s ease-out infinite}@keyframes ggAstroFishFlyV401{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-7px) rotate(2deg)}}@keyframes ggAstroFishTailV401{to{transform:rotate(-12deg) scaleX(.92)}}@keyframes ggAstroFishWingV401{to{transform:rotate(10deg)}}@keyframes ggAstroFishBubbleV401{0%{opacity:0;transform:translateY(2px) scale(.6)}35%{opacity:1}100%{opacity:0;transform:translateY(-15px) scale(1.18)}} .gg-astro-fish-underwater-v401 .astro-fish-helmet-v400{filter:drop-shadow(0 0 8px rgba(88,220,255,.8))!important}.gg-astro-fish-underwater-v401 .astro-fish-water-v400{fill:rgba(72,209,255,.34)!important}.gg-astro-fish-underwater-v401 .pet-hover{animation-duration:1.65s!important} /* Moon Owl: yellow eyes + crescent belly + lunar idle. */ .moon-owl-v398 .owl-eye-v345{fill:#ffe569!important;stroke:#fff5ae!important;filter:drop-shadow(0 0 4px #ffd83e) drop-shadow(0 0 11px rgba(255,218,62,.88))!important;animation:ggMoonOwlEyeV401 1.8s ease-in-out infinite alternate!important} .moon-owl-v398 .pet-hover::after{content:"☾"!important;position:absolute!important;left:50%!important;top:62%!important;transform:translate(-50%,-50%)!important;font:900 22px/1 Georgia,serif!important;color:#f7df70!important;text-shadow:0 0 7px rgba(247,223,112,.7)!important;pointer-events:none!important;animation:ggMoonCrescentV401 2.6s ease-in-out infinite alternate!important} .moon-owl-v398 .owl-wing-v345{transform-box:fill-box;transform-origin:50% 20%;animation:ggMoonOwlWingV401 5.8s ease-in-out infinite!important}.moon-owl-v398 .owl-head-v345{animation:ggMoonOwlLookV401 5.8s ease-in-out infinite!important}.gg-moon-owl-lit-v401 .pet-hover::after{color:#fff0a0!important;text-shadow:0 0 7px #f4d75c,0 0 18px rgba(255,223,94,.8)!important}.gg-moon-owl-lit-v401 .owl-eye-v345{filter:drop-shadow(0 0 5px #ffe65d) drop-shadow(0 0 15px rgba(255,222,66,.95))!important}@keyframes ggMoonOwlEyeV401{to{opacity:.72}}@keyframes ggMoonCrescentV401{to{transform:translate(-50%,-50%) scale(1.08);opacity:.82}}@keyframes ggMoonOwlWingV401{0%,78%,100%{transform:rotate(0)}86%{transform:rotate(16deg)}92%{transform:rotate(-9deg)}}@keyframes ggMoonOwlLookV401{0%,72%,100%{transform:rotate(0)}84%{transform:rotate(-7deg)}92%{transform:rotate(7deg)}} /* ========================================================== v404 — focused Salon/Avatar reliability + pet polish ========================================================== */ /* Moon Owl crescent belongs on the lower belly, never over the face. */ .moon-owl-v398 .pet-hover{position:relative!important} .moon-owl-v398 .pet-hover::after{ content:"☾"!important;position:absolute!important;left:50%!important;top:73%!important; transform:translate(-50%,-50%)!important;font:900 17px/1 Georgia,serif!important; color:#f6df72!important;text-shadow:0 0 7px rgba(246,223,114,.72)!important; pointer-events:none!important;z-index:8!important; } .moon-owl-v398 .owl-eye-v345{fill:#ffe56a!important;stroke:#fff2a5!important;filter:drop-shadow(0 0 5px #f0cf41)!important} /* Astro Fish v404: fish swims inside one large water bubble. */ .astro-fish-pet .astro-fish-bubble-shell-v404{fill:rgba(78,191,245,.16);stroke:#d8f5ff;stroke-width:3.2;filter:drop-shadow(0 0 6px rgba(118,218,255,.35))} .astro-fish-pet .astro-fish-bubble-gloss-v404{fill:rgba(255,255,255,.28);stroke:rgba(255,255,255,.45);stroke-width:1.2} .astro-fish-pet .astro-fish-body-v404{fill:#f89b3d;stroke:#a84f20;stroke-width:3} .astro-fish-pet .astro-fish-tail-v404,.astro-fish-pet .astro-fish-fin-v404{fill:#ffb154;stroke:#a84f20;stroke-width:2.5;stroke-linejoin:round} .astro-fish-pet .astro-fish-tail-v404{transform-box:fill-box;transform-origin:100% 50%;animation:ggAstroFishTailV404 .58s ease-in-out infinite alternate} .astro-fish-pet .astro-fish-fin-v404.side{transform-box:fill-box;transform-origin:80% 50%;animation:ggAstroFishFinV404 .68s ease-in-out infinite alternate} .astro-fish-pet .astro-fish-eye-white-v404{fill:#fff;stroke:#2c2b31;stroke-width:2} .astro-fish-pet .astro-fish-eye-v404{fill:#20242b} .astro-fish-pet .astro-fish-mouth-v404{fill:none;stroke:#7a321b;stroke-width:2;stroke-linecap:round} .astro-fish-pet .astro-fish-water-bubble-v404{fill:rgba(222,248,255,.52);stroke:#ecfbff;stroke-width:1;animation:ggAstroFishWaterBubbleV404 1.8s ease-in-out infinite} .astro-fish-pet .astro-fish-water-bubble-v404.b2{animation-delay:-.6s}.astro-fish-pet .astro-fish-water-bubble-v404.b3{animation-delay:-1.1s} .astro-fish-pet .astro-fish-shadow-v404{fill:rgba(0,0,0,.2)} .astro-fish-pet .pet-hover{animation:ggAstroFishFloatV404 2.6s ease-in-out infinite!important} @keyframes ggAstroFishTailV404{to{transform:rotate(-14deg)}} @keyframes ggAstroFishFinV404{to{transform:rotate(9deg)}} @keyframes ggAstroFishWaterBubbleV404{0%,100%{opacity:.3;transform:translateY(2px)}50%{opacity:1;transform:translateY(-5px)}} @keyframes ggAstroFishFloatV404{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-6px) rotate(1.5deg)}} /* Goldie's Studio HUD has one final position owner. */ body.gg-salon-room-v206 #avatarRoom{position:relative!important} body.gg-salon-room-v206 #avatarRoom #ggRoomLevelV143{ position:absolute!important;right:10px!important;bottom:10px!important;left:auto!important;top:auto!important; transform:none!important;margin:0!important;z-index:2147483646!important; } body.gg-salon-room-v206 #avatarRoom #ggSalonMoneyGaugeV230{ position:absolute!important;left:10px!important;bottom:10px!important;right:auto!important;top:auto!important; transform:none!important;margin:0!important;z-index:2147483646!important; } body.gg-salon-room-v206 #avatarRoom #ggFamiliarRoomHostV339{z-index:430!important} /* Studio Cut: fixed preview dock + genuinely scrollable controls on iPhone. */ @media(max-width:760px){ #ggSalonStudioCutV327 .gg-v327-shell{display:flex!important;flex-direction:column!important;height:100dvh!important;max-height:100dvh!important;overflow:hidden!important;touch-action:pan-y!important} #ggSalonStudioCutV327 .gg-v327-shell>header{flex:0 0 auto!important} #ggSalonStudioCutV327 .gg-v401-compare-dock{position:relative!important;flex:0 0 auto!important;top:auto!important} #ggSalonStudioCutV327 .gg-v327-main{display:block!important;flex:1 1 0!important;min-height:0!important;overflow:hidden!important} #ggSalonStudioCutV327 .gg-v401-controls{display:block!important;height:100%!important;max-height:100%!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;touch-action:pan-y!important;overscroll-behavior-y:contain!important;padding:10px 12px 112px!important} #ggSalonStudioCutV327 .gg-v401-controls .gg-v327-editor{display:block!important;overflow:visible!important;touch-action:pan-y!important;min-height:max-content!important;padding-bottom:72px!important} #ggSalonStudioCutV327 .gg-v401-controls .gg-v327-editor .row{touch-action:pan-y!important} #ggSalonStudioCutV327 .gg-v401-controls button{touch-action:manipulation!important} #ggSalonStudioCutV327 .gg-v401-actionbar{position:absolute!important;bottom:0!important} } /* ========================================================== v406 — care-unlocked outfits, level bar repair, Astro Fish teleport ========================================================== */ .gg-feather-outfit-v406 .feather{transform-box:fill-box;transform-origin:50% 90%;animation:ggFeatherFlutterV406 1.7s ease-in-out infinite alternate} .gg-feather-outfit-v406 .f2,.gg-feather-outfit-v406 .f5{animation-delay:-.45s}.gg-feather-outfit-v406 .f3,.gg-feather-outfit-v406 .f6{animation-delay:-.8s} @keyframes ggFeatherFlutterV406{to{transform:rotate(3deg) translateY(-2px)}} .gg-honey-goo-v406 .honey-drip{transform-box:fill-box;transform-origin:50% 0;animation:ggHoneyDripV406 1.9s ease-in-out infinite alternate} .gg-honey-goo-v406 .d2{animation-delay:-.7s}.gg-honey-goo-v406 .d3{animation-delay:-1.15s}.gg-honey-goo-v406 .honey-sheen{animation:ggHoneyShineV406 1.8s ease-in-out infinite alternate}.gg-honey-goo-v406 .honey-bubble{animation:ggHoneyBubbleV406 1.3s ease-in-out infinite alternate}.gg-honey-goo-v406 .b2{animation-delay:-.6s} @keyframes ggHoneyDripV406{to{transform:scaleY(1.14)}}@keyframes ggHoneyShineV406{to{opacity:.35}}@keyframes ggHoneyBubbleV406{to{transform:translateY(-5px);opacity:.55}} .gg-pizza-outfit-v406{transform-box:fill-box;transform-origin:center;animation:ggPizzaBounceV406 1.35s ease-in-out infinite}.gg-pizza-outfit-v406 .pizza-cheese{animation:ggPizzaCheeseV406 1.4s ease-in-out infinite alternate}.gg-pizza-outfit-v406 .pizza-pepperoni circle{transform-box:fill-box;transform-origin:center;animation:ggPepperoniPopV406 1.8s ease-in-out infinite alternate}.gg-pizza-outfit-v406 .pizza-pepperoni circle:nth-child(2){animation-delay:-.4s}.gg-pizza-outfit-v406 .pizza-pepperoni circle:nth-child(3){animation-delay:-.8s}.gg-pizza-outfit-v406 .pizza-pepperoni circle:nth-child(4){animation-delay:-1.2s}.gg-pizza-outfit-v406 .pizza-sparkles{animation:ggPizzaSparkV406 1.2s ease-in-out infinite alternate} @keyframes ggPizzaBounceV406{50%{transform:translateY(-3px) rotate(.6deg)}}@keyframes ggPizzaCheeseV406{to{opacity:.58;transform:translateY(2px)}}@keyframes ggPepperoniPopV406{to{transform:scale(1.12)}}@keyframes ggPizzaSparkV406{to{opacity:.35}} .gg-unlock-toast-v406{position:fixed;left:50%;top:88px;transform:translate(-50%,-14px);z-index:2147483647;min-width:min(88vw,340px);padding:13px 16px;border-radius:18px;border:1px solid rgba(215,176,91,.72);background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%);color:#181818;box-shadow:0 18px 45px rgba(0,0,0,.45);text-align:center;opacity:0;pointer-events:none;transition:.22s ease;}.gg-unlock-toast-v406.show{opacity:1;transform:translate(-50%,0)}.gg-unlock-toast-v406 b,.gg-unlock-toast-v406 span{display:block}.gg-unlock-toast-v406 span{margin-top:4px;color:#eee7dc;font-size:12px} #collectionPanel .gg-xp-track,#collectionPanel .gg-xp-track i{visibility:visible!important;opacity:1!important}.avatar-page #gameXPBar{min-width:0!important;background:linear-gradient(90deg,#b58a32,#f2d67a)!important} .gg-fish-burst-v406{position:absolute;z-index:850;transform:translate(-50%,-50%);width:72px;height:72px;pointer-events:none}.gg-fish-burst-v406 i{position:absolute;left:50%;top:50%;width:11px;height:11px;border-radius:50%;border:2px solid rgba(214,247,255,.95);background:rgba(124,220,255,.18);--a:0deg;animation:ggFishBurstV406 .82s ease-out forwards}.gg-fish-burst-v406 i:nth-child(1){--a:0deg}.gg-fish-burst-v406 i:nth-child(2){--a:45deg}.gg-fish-burst-v406 i:nth-child(3){--a:90deg}.gg-fish-burst-v406 i:nth-child(4){--a:135deg}.gg-fish-burst-v406 i:nth-child(5){--a:180deg}.gg-fish-burst-v406 i:nth-child(6){--a:225deg}.gg-fish-burst-v406 i:nth-child(7){--a:270deg}.gg-fish-burst-v406 i:nth-child(8){--a:315deg}@keyframes ggFishBurstV406{0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--a)) translateX(0) scale(.4)}25%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) rotate(var(--a)) translateX(40px) scale(1.25)}} #ggFamiliarRoomHostV339.gg-fish-teleporting-v406{opacity:0!important;transform:translate(-50%,-50%) scale(.25)!important;transition:opacity .32s ease,transform .32s ease!important}#ggFamiliarRoomHostV339.gg-fish-arrive-v406{animation:ggFishArriveV406 .72s cubic-bezier(.2,.9,.25,1.2)}@keyframes ggFishArriveV406{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}65%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}100%{transform:translate(-50%,-50%) scale(1)}} /* v407 — elemental ball familiars + Goldie HUD lock */ .flame-ball-pet .orb-shadow-v407,.water-ball-pet .orb-shadow-v407{fill:rgba(0,0,0,.28)} .flame-ball-pet .flame-orb-core-v407{fill:#ff8a1f;stroke:#7b2c0f;stroke-width:3;filter:drop-shadow(0 0 8px rgba(255,121,27,.85))} .flame-ball-pet .flame-orb-flame-v407.f1{fill:#ff5f1f;stroke:#7b2c0f;stroke-width:2.4;animation:ggFlameOrbFlickerV407 .58s ease-in-out infinite alternate;transform-origin:60px 75px} .flame-ball-pet .flame-orb-flame-v407.f2{fill:#ffd45c;opacity:.95;animation:ggFlameOrbFlickerV407 .42s ease-in-out infinite alternate-reverse;transform-origin:60px 75px} .flame-ball-pet .flame-orb-face-v407{fill:#ffb23d;stroke:#a84716;stroke-width:2} .flame-ball-pet .flame-orb-eye-v407{fill:#3c1d15}.flame-ball-pet .flame-orb-mouth-v407{fill:none;stroke:#7f311d;stroke-width:2.4;stroke-linecap:round} .flame-ball-pet .flame-orb-spark-v407{fill:#ffd86a;filter:drop-shadow(0 0 4px #ff7a1a);animation:ggFlameOrbSparkV407 1.1s ease-in-out infinite}.flame-ball-pet .s2{animation-delay:-.35s}.flame-ball-pet .s3{animation-delay:-.7s} .flame-ball-pet .pet-hover{animation:ggElementOrbFloatV407 1.7s ease-in-out infinite} @keyframes ggFlameOrbFlickerV407{to{transform:scale(.94,1.08) translateY(-2px)}} @keyframes ggFlameOrbSparkV407{0%,100%{opacity:.25;transform:translateY(2px) scale(.7)}50%{opacity:1;transform:translateY(-5px) scale(1.15)}} .water-ball-pet .water-orb-shell-v407{fill:rgba(113,205,255,.18);stroke:#c9f1ff;stroke-width:3;filter:drop-shadow(0 0 7px rgba(70,183,255,.48))} .water-ball-pet .water-orb-wave-v407.back{fill:#76d4ff;opacity:.55}.water-ball-pet .water-orb-wave-v407.front{fill:#3daee8;opacity:.8;animation:ggWaterOrbWaveV407 1.6s ease-in-out infinite alternate;transform-origin:60px 70px} .water-ball-pet .water-orb-face-v407{fill:rgba(199,241,255,.45);stroke:#79cfe9;stroke-width:2} .water-ball-pet .water-orb-eye-v407{fill:#15394c}.water-ball-pet .water-orb-mouth-v407{fill:none;stroke:#24607a;stroke-width:2.4;stroke-linecap:round} .water-ball-pet .water-orb-bubble-v407{fill:rgba(222,249,255,.45);stroke:#e9fbff;stroke-width:1.4;animation:ggWaterOrbBubbleV407 1.5s ease-in-out infinite}.water-ball-pet .b2{animation-delay:-.45s}.water-ball-pet .b3{animation-delay:-.85s} .water-ball-pet .pet-hover{animation:ggElementOrbFloatV407 2s ease-in-out infinite} @keyframes ggWaterOrbWaveV407{to{transform:translateX(3px) skewX(-5deg)}} @keyframes ggWaterOrbBubbleV407{0%,100%{opacity:.25;transform:translateY(2px)}50%{opacity:1;transform:translateY(-5px)}} @keyframes ggElementOrbFloatV407{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}} body.gg-salon-room-v206 #avatarRoom{position:relative!important} body.gg-salon-room-v206 #avatarRoom > #ggRoomLevelV143{ position:absolute!important;right:10px!important;bottom:10px!important;left:auto!important;top:auto!important; transform:none!important;margin:0!important;width:146px!important;max-width:146px!important;min-width:0!important; z-index:2147483646!important;box-sizing:border-box!important; } body.gg-salon-room-v206 #avatarRoom > #ggSalonMoneyGaugeV230{ position:absolute!important;left:10px!important;bottom:10px!important;right:auto!important;top:auto!important;transform:none!important;z-index:2147483646!important; } body.gg-salon-room-v206 #avatarRoom > #ggFamiliarRoomHostV339{z-index:520!important} /* ========================================================== v410 — redesigned animated Flame Ball + Water Ball familiars ========================================================== */ .flame-ball-v410 .orb-shadow-v410,.water-ball-v410 .orb-shadow-v410{fill:rgba(0,0,0,.28);filter:blur(.4px)} .flame-ball-v410 .flame-aura-v410 circle{fill:rgba(255,83,16,.26);animation:ggFlameAuraV410 1.15s ease-in-out infinite alternate;transform-origin:60px 61px} .flame-ball-v410 .flame-tongue-v410{fill:url(#ggFlameOuterV410);stroke:#a92d0d;stroke-width:2.1;stroke-linejoin:round;transform-box:fill-box;transform-origin:50% 85%} .flame-ball-v410 .flame-tongue-v410.t1{animation:ggFlameTongueV410 .82s ease-in-out infinite alternate} .flame-ball-v410 .flame-tongue-v410.t2{opacity:.88;animation:ggFlameTongueV410 .61s ease-in-out infinite alternate-reverse} .flame-ball-v410 .flame-core-v410{fill:url(#ggFlameCoreV410);stroke:#d64a10;stroke-width:2.2;filter:drop-shadow(0 0 5px rgba(255,187,42,.75));animation:ggFlameCoreV410 1.05s ease-in-out infinite alternate;transform-origin:60px 64px} .flame-ball-v410 .flame-swirl-v410{fill:none;stroke:#fff18a;stroke-width:3;stroke-linecap:round;opacity:.58;animation:ggFlameSwirlV410 2.7s linear infinite;transform-origin:60px 64px} .flame-ball-v410 .flame-swirl-v410.s2{stroke:#ffb126;stroke-width:2.4;opacity:.72;animation-direction:reverse;animation-duration:2.1s} .flame-ball-v410 .flame-eye-white-v410{fill:#fff9e9;stroke:#6f2715;stroke-width:1.7} .flame-ball-v410 .flame-eye-v410{fill:#35140d}.flame-ball-v410 .flame-eye-glint-v410{fill:#fff} .flame-ball-v410 .flame-mouth-v410{fill:none;stroke:#7a2815;stroke-width:2.2;stroke-linecap:round} .flame-ball-v410 .flame-sparks-v410 circle{fill:#ffe66f;filter:drop-shadow(0 0 4px #ff5a14);transform-box:fill-box;transform-origin:center} .flame-ball-v410 .flame-sparks-v410 .sp1{animation:ggFlameSparkV410 1.4s ease-in-out infinite}.flame-ball-v410 .flame-sparks-v410 .sp2{animation:ggFlameSparkV410 1.1s -.45s ease-in-out infinite}.flame-ball-v410 .flame-sparks-v410 .sp3{animation:ggFlameSparkV410 1.25s -.8s ease-in-out infinite}.flame-ball-v410 .flame-sparks-v410 .sp4{animation:ggFlameSparkV410 1.55s -.25s ease-in-out infinite} .flame-ball-v410 .pet-hover{animation:ggElementFloatV410 2.15s ease-in-out infinite!important} @keyframes ggFlameAuraV410{to{transform:scale(1.12);opacity:.55}} @keyframes ggFlameTongueV410{0%{transform:scaleX(.98) scaleY(.96) rotate(-1deg)}100%{transform:scaleX(1.03) scaleY(1.08) rotate(1.2deg)}} @keyframes ggFlameCoreV410{to{transform:scale(1.025);filter:drop-shadow(0 0 9px rgba(255,193,49,.95))}} @keyframes ggFlameSwirlV410{to{transform:rotate(360deg)}} @keyframes ggFlameSparkV410{0%,100%{opacity:.1;transform:translateY(4px) scale(.55)}45%{opacity:1;transform:translateY(-8px) scale(1.15)}75%{opacity:.55;transform:translateY(-13px) scale(.75)}} .water-ball-v410 .water-aura-v410 circle{fill:rgba(69,194,255,.22);animation:ggWaterAuraV410 1.6s ease-in-out infinite alternate;transform-origin:60px 61px} .water-ball-v410 .water-core-v410{fill:url(#ggWaterCoreV410);stroke:#bcefff;stroke-width:2.6;filter:drop-shadow(0 0 6px rgba(84,205,255,.58));animation:ggWaterCoreV410 1.9s ease-in-out infinite alternate;transform-origin:60px 61px} .water-ball-v410 .water-wave-v410{fill:url(#ggWaterWaveV410);opacity:.8;transform-box:fill-box;transform-origin:50% 50%} .water-ball-v410 .water-wave-v410.w1{animation:ggWaterWaveV410 2.2s ease-in-out infinite alternate}.water-ball-v410 .water-wave-v410.w2{opacity:.72;animation:ggWaterWaveV410 1.7s -.55s ease-in-out infinite alternate-reverse} .water-ball-v410 .water-crest-v410{fill:url(#ggWaterWaveV410);stroke:#bff6ff;stroke-width:1.8;stroke-linejoin:round;transform-box:fill-box;transform-origin:50% 80%} .water-ball-v410 .water-crest-v410.c1{animation:ggWaterCrestV410 1.95s ease-in-out infinite alternate}.water-ball-v410 .water-crest-v410.c2{animation:ggWaterCrestV410 1.55s -.65s ease-in-out infinite alternate-reverse} .water-ball-v410 .water-highlight-v410{fill:none;stroke:#fff;stroke-width:4.2;stroke-linecap:round;opacity:.75;animation:ggWaterHighlightV410 2.3s ease-in-out infinite alternate} .water-ball-v410 .water-eye-white-v410{fill:#f4fdff;stroke:#0b5a90;stroke-width:1.7}.water-ball-v410 .water-eye-v410{fill:#073c72}.water-ball-v410 .water-eye-glint-v410{fill:#fff} .water-ball-v410 .water-mouth-v410{fill:none;stroke:#075585;stroke-width:2.2;stroke-linecap:round} .water-ball-v410 .water-droplets-v410 circle{fill:rgba(198,247,255,.68);stroke:#e9fdff;stroke-width:1.2;filter:drop-shadow(0 0 3px rgba(52,190,255,.8));transform-box:fill-box;transform-origin:center} .water-ball-v410 .water-droplets-v410 .d1{animation:ggWaterDropV410 1.6s ease-in-out infinite}.water-ball-v410 .water-droplets-v410 .d2{animation:ggWaterDropV410 1.9s -.7s ease-in-out infinite}.water-ball-v410 .water-droplets-v410 .d3{animation:ggWaterDropV410 1.4s -.25s ease-in-out infinite}.water-ball-v410 .water-droplets-v410 .d4{animation:ggWaterDropV410 1.75s -.95s ease-in-out infinite}.water-ball-v410 .water-droplets-v410 .d5{animation:ggWaterDropV410 2s -.4s ease-in-out infinite} .water-ball-v410 .pet-hover{animation:ggElementFloatV410 2.45s ease-in-out infinite!important} @keyframes ggWaterAuraV410{to{transform:scale(1.1);opacity:.52}} @keyframes ggWaterCoreV410{to{transform:scale(1.025);filter:drop-shadow(0 0 10px rgba(70,205,255,.82))}} @keyframes ggWaterWaveV410{0%{transform:translateX(-2px) rotate(-1deg)}100%{transform:translateX(3px) rotate(1.5deg)}} @keyframes ggWaterCrestV410{to{transform:scaleX(1.05) scaleY(1.08) rotate(1.5deg)}} @keyframes ggWaterHighlightV410{to{opacity:.35;transform:translateX(4px)}} @keyframes ggWaterDropV410{0%,100%{opacity:.18;transform:translateY(4px) scale(.65)}45%{opacity:1;transform:translateY(-7px) scale(1.08)}75%{opacity:.5;transform:translateY(-12px) scale(.8)}} @keyframes ggElementFloatV410{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-5px) rotate(.6deg)}} /* Keep v409 elemental variants compatible with the redesigned shapes. */ .flame-ball-v410.gg-v409-variant-blue .flame-core-v410{filter:hue-rotate(145deg) saturate(1.15) drop-shadow(0 0 8px #55bfff)} .flame-ball-v410.gg-v409-variant-lava .flame-core-v410{filter:saturate(1.45) contrast(1.08) drop-shadow(0 0 9px #ff3c0a)} .water-ball-v410.gg-v409-variant-ice .water-core-v410{filter:saturate(.62) brightness(1.18) drop-shadow(0 0 8px #d8fbff)} .water-ball-v410.gg-v409-variant-galaxy .water-core-v410{filter:hue-rotate(40deg) saturate(1.3) drop-shadow(0 0 8px #8b71ff)} /* ========================================================== v433 — Avatar Room silver level gauge + salon client seat fix ========================================================== */ body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143{ background:linear-gradient(180deg,#eef0f4,#cfd4dc)!important; border:1px solid rgba(95,101,112,.28)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 8px 18px rgba(31,36,44,.18)!important; } body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 span, body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 b{ color:#1c1f26!important; } body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 > div{ background:rgba(74,79,89,.22)!important; box-shadow:inset 0 1px 2px rgba(255,255,255,.45)!important; } body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 > div i, body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelFillV143{ background:linear-gradient(90deg,#d8a94c,#f1d879)!important; } body.gg-salon-room-v206 #ggSalonChairLeftV230{z-index:560!important;} body.gg-salon-room-v206 #ggSalonClientV230, body.gg-salon-room-v206 #ggSalonClientV230.seated, body.gg-salon-room-v206 #ggSalonClientV230.gg-salon-seated-lock-v262{ z-index:760!important; } body.gg-salon-room-v206 #ggSalonClientV230.seated, body.gg-salon-room-v206 #ggSalonClientV230.gg-salon-seated-lock-v262{ bottom:4px!important; transform:translateX(-50%)!important; } /* ========================================================== v434 — pet speech, room level gauge, salon client in front ========================================================== */ body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143{ background:linear-gradient(145deg,#eff1f4,#c6ccd5)!important; color:#15171b!important; border:1px solid #a4adb9!important; box-shadow:0 8px 20px rgba(69,78,93,.16)!important; } body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 *, body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 span, body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 b{ color:#15171b!important; } body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 > div{ background:linear-gradient(180deg,rgba(116,123,134,.26),rgba(79,85,95,.26))!important; box-shadow:inset 0 1px 2px rgba(255,255,255,.42)!important; } body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 > div i, body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelFillV143{ background:linear-gradient(90deg,#d8a94c,#f1d879)!important; } body.gg-salon-room-v206 #ggSalonChairLeftV230{z-index:460!important;} body.gg-salon-room-v206 #ggSalonClientV230, body.gg-salon-room-v206 #ggSalonClientV230.seated, body.gg-salon-room-v206 #ggSalonClientV230.gg-salon-seated-lock-v262{z-index:900!important;} body.gg-salon-room-v206 #ggSalonClientV230 svg{position:relative!important;z-index:2!important;} /* ========================================================== v435 — force silver room level gauge, remove ambient ghost/bat ========================================================== */ body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143, html[data-gg-site-theme="sun"] body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143{ background:linear-gradient(145deg,#eff1f4,#c8ced7)!important; color:#15171b!important; border:1px solid #a8b0bb!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 8px 20px rgba(69,78,93,.16)!important; } body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 *, html[data-gg-site-theme="sun"] body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 *{ color:#15171b!important; } body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 > div, html[data-gg-site-theme="sun"] body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 > div{ background:linear-gradient(180deg,rgba(116,123,134,.22),rgba(79,85,95,.22))!important; box-shadow:inset 0 1px 2px rgba(255,255,255,.42)!important; } body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 > div i, body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelFillV143, html[data-gg-site-theme="sun"] body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelV143 > div i, html[data-gg-site-theme="sun"] body.avatar-room-page:not(.gg-salon-room-v206) #ggRoomLevelFillV143{ background:linear-gradient(90deg,#d8a94c,#f1d879)!important; } #roomMoonBatsV065, #ggFlashGhostV232, .gg-night-secret-v156, .gg-ghost-slime-v242, .gg-pet-session-transform-v388{ display:none!important; visibility:hidden!important; opacity:0!important; pointer-events:none!important; } /* ========================================================== v436 — silver readable boxes, client outfit cleanup, pet talk restore ========================================================== */ /* Familiar label + speech bubble become silver so text is readable. */ #avatarRoom .gg-familiar-room-host-v339>span, #avatarRoom .gg-familiar-room-reaction-v343, body.gg-salon-room-v206 #avatarRoom .gg-familiar-room-host-v339>span, body.gg-salon-room-v206 #avatarRoom .gg-familiar-room-reaction-v343{ background:linear-gradient(145deg,#eff1f4,#cfd5de)!important; color:#171a1f!important; border:1px solid #a9b1bc!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 8px 20px rgba(66,74,87,.14)!important; text-shadow:none!important; } #avatarRoom .gg-familiar-room-reaction-v343:after, body.gg-salon-room-v206 #avatarRoom .gg-familiar-room-reaction-v343:after{ background:linear-gradient(145deg,#eff1f4,#cfd5de)!important; border-right:1px solid #a9b1bc!important; border-bottom:1px solid #a9b1bc!important; } body.gg-salon-room-v206 #ggFamiliarRoomHostV339 .gg-familiar-room-reaction-v343{display:block!important} body.gg-salon-room-v206 #ggFamiliarRoomHostV339 .gg-familiar-room-reaction-v343[hidden]{display:none!important} /* Studio Cut: convert dark information boxes to silver for readability. */ #ggSalonStudioCutV327 .gg-v327-shell{ background:linear-gradient(180deg,#eef1f4,#d7dde5)!important; color:#171a1f!important; } #ggSalonStudioCutV327 .gg-v327-shell>header{ background:rgba(241,244,247,.98)!important; border-bottom:1px solid #b9c2ce!important; } #ggSalonStudioCutV327 .gg-v327-shell>header h2, #ggSalonStudioCutV327 .gg-v327-shell>header p, #ggSalonStudioCutV327 .gg-v327-shell>header button, #ggSalonStudioCutV327 .gg-v327-shell>header button *{ color:#171a1f!important; } #ggSalonStudioCutV327 .gg-v327-shell>header small, #ggSalonStudioCutV327 .gg-v327-title b, #ggSalonStudioCutV327 .gg-v327-editor>b{ color:#7d5d14!important; } #ggSalonStudioCutV327 .gg-v327-shell>header p, #ggSalonStudioCutV327 .gg-v327-title span, #ggSalonStudioCutV327 .gg-v327-score span, #ggSalonStudioCutV327 .gg-v327-editor small{ color:#4e5662!important; } #ggSalonStudioCutV327 .gg-v327-shell>header button{ background:linear-gradient(145deg,#eff2f5,#d2d8e0)!important; border:1px solid #aeb7c2!important; } #ggSalonStudioCutV327 .gg-v327-main>section, #ggSalonStudioCutV327 .gg-v401-controls, #ggSalonStudioCutV327 .gg-v401-actionbar, #ggSalonStudioCutV327 .gg-v394-actionbar, #ggSalonStudioCutV327 .gg-v394-preview-pane{ background:linear-gradient(180deg,#eef1f4,#d9dfe6)!important; border:1px solid #bcc5cf!important; } #ggSalonStudioCutV327 .gg-v327-preview{ background:#0f1218!important; border:1px solid rgba(136,145,159,.38)!important; } #ggSalonStudioCutV327 .gg-v327-editor button, #ggSalonStudioCutV327 .gg-studio-quick-v398 button, #ggSalonStudioCutV327 .gg-v405-outfit-fav button{ background:linear-gradient(145deg,#eef1f4,#d3d9e1)!important; border:1px solid #b2bbc6!important; color:#171a1f!important; } #ggSalonStudioCutV327 .gg-v327-editor button.selected, #ggSalonStudioCutV327 .gg-studio-quick-v398 button.selected{ background:linear-gradient(145deg,#f0dc99,#d8ac4f)!important; border-color:#e3bf65!important; color:#17120a!important; box-shadow:0 0 0 2px rgba(227,191,101,.22)!important; } #ggSalonStudioCutV327 .gg-v327-score strong, #ggSalonStudioCutV327 .gg-v327-done>b{color:#171a1f!important} #ggSalonStudioCutV327 .gg-v327-meter{background:rgba(101,111,124,.25)!important} /* Slightly lower the salon room client outfit/body so it stays below the head. */ body.gg-salon-room-v206 #ggSalonClientV230 svg #shirtLayer, body.gg-salon-room-v206 #ggSalonClientV230 svg #bodyLayer{ transform:translateY(8px)!important; } /* ========================================================== v439 — lightweight room stability pass No global MutationObserver, no fireball environmental aura. ========================================================== */ /* Silver/readable room status, Familiar name and speech. */ #avatarRoom .gg-room-status-v232, #avatarRoom .gg-familiar-room-host-v339>span, #avatarRoom .gg-familiar-room-label-v336, #avatarRoom .gg-familiar-room-reaction-v343{ background:linear-gradient(145deg,#f4f6f8,#d7dde5)!important; color:#171a1f!important; border:1px solid #aeb7c2!important; text-shadow:none!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.96),0 7px 18px rgba(66,74,87,.13)!important; } #avatarRoom .gg-room-status-v232 *, #avatarRoom .gg-familiar-room-host-v339>span *, #avatarRoom .gg-familiar-room-reaction-v343 *{color:#171a1f!important;text-shadow:none!important} #avatarRoom .gg-familiar-room-reaction-v343:after{ background:#dfe4ea!important; border-right:1px solid #aeb7c2!important; border-bottom:1px solid #aeb7c2!important; } #avatarRoom .gg-familiar-room-reaction-v343{font-size:10px!important;line-height:1.3!important;min-width:110px!important;max-width:170px!important;z-index:60!important} #avatarRoom .gg-familiar-room-reaction-v343[hidden]{display:none!important} /* Tutorial icon backgrounds: silver, high contrast. */ .gg-room-tutorial-icon-v109, .gg-room-tutorial-close-v109, .gg-room-help-v109{ background:linear-gradient(145deg,#f4f6f8,#d7dde5)!important; color:#171a1f!important; border:1px solid #aeb7c2!important; text-shadow:none!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.96),0 7px 18px rgba(66,74,87,.13)!important; } /* Larger salon client; always above chair. */ body.gg-salon-room-v206 #ggSalonChairLeftV230{z-index:450!important} body.gg-salon-room-v206 #ggSalonClientV230{ z-index:900!important; transform:scale(1.18)!important; transform-origin:center bottom!important; } body.gg-salon-room-v206 #ggSalonClientV230 svg{overflow:visible!important} body.gg-salon-room-v206 #ggSalonClientV230 svg #wardrobeExtraLayer, body.gg-salon-room-v206 #ggSalonClientV230 svg #wizardBodyLayerV159{display:none!important} /* Flame Ball stability mode: keep the pet selectable, but remove all continuous flame/spark/hover animations and expensive filters. */ #avatarRoom .gg-familiar-room-host-v339[data-pet-type="flameBall"], #avatarRoom .gg-familiar-room-host-v339[data-pet-type="flameBall"] *, #avatarRoom .flame-ball-pet, #avatarRoom .flame-ball-pet *, #avatarRoom .flame-ball-v410, #avatarRoom .flame-ball-v410 *{ animation:none!important; transition:none!important; } #avatarRoom .gg-familiar-room-host-v339[data-pet-type="flameBall"]{ filter:drop-shadow(0 6px 10px rgba(0,0,0,.28))!important; } #avatarRoom .flame-ball-v410 .flame-core-v410, #avatarRoom .flame-ball-pet .flame-orb-core-v407, #avatarRoom .flame-ball-v410 .flame-sparks-v410 circle, #avatarRoom .flame-ball-pet .flame-orb-spark-v407{ filter:none!important; } /* v445 follow-up fixes */ #avatarRoom #ggAtmosphereV413, #avatarRoom #ggAtmosphereV413 *{ background:linear-gradient(180deg,#f8f9fc 0%,#dde3ec 100%)!important; color:#171a1f!important; border-color:rgba(126,136,149,.55)!important; text-shadow:none!important; } #avatarRoom #ggAtmosphereV413{box-shadow:0 8px 18px rgba(0,0,0,.14)!important} #avatarRoom #ggAtmosphereV413 i{background:#d1d6dd!important;box-shadow:none!important} #ggSalonStudioCutV327 [data-v327-color]{ background:var(--c)!important; color:transparent!important; border:2px solid rgba(116,124,136,.46)!important; border-radius:999px!important; min-width:44px!important; min-height:44px!important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)!important; } #ggSalonStudioCutV327 [data-v327-color].selected{ background:var(--c)!important; border-color:#f1d172!important; box-shadow:0 0 0 3px rgba(241,209,114,.26), inset 0 0 0 2px rgba(255,255,255,.82)!important; } /* ========================================================== v447 Goldie mobile width — reduce wasted side/right space ========================================================== */ @media (max-width:699px){ body.goldie-page-v447 main, body.goldie-page-v447 main>section, body.goldie-page-v447 main .wrap{ width:100%!important; max-width:100%!important; box-sizing:border-box!important; } body.goldie-page-v447 main .wrap{ padding-left:12px!important; padding-right:12px!important; } body.goldie-page-v447 .gg-dreadlocks-head{ width:100%!important; padding-left:4px!important; padding-right:4px!important; box-sizing:border-box!important; } body.goldie-page-v447 .gg-dread-carousel-shell{ width:calc(100vw - 24px)!important; max-width:calc(100vw - 24px)!important; margin-left:0!important; margin-right:0!important; overflow:hidden!important; } body.goldie-page-v447 .gg-dread-carousel{ width:100%!important; box-sizing:border-box!important; padding-left:4px!important; padding-right:8px!important; gap:10px!important; scroll-padding-left:4px!important; } body.goldie-page-v447 .gg-dread-card{ flex-basis:min(88vw,340px)!important; width:min(88vw,340px)!important; scroll-snap-align:start!important; } body.goldie-page-v447 .goldie-loop-showcase, body.goldie-page-v447 .portfolio-grid, body.goldie-page-v447 .section-title{ width:100%!important; max-width:100%!important; box-sizing:border-box!important; } } /* v511 — plush fantasy-creature avatar graphical overhaul */ #avatarSvg #face{stroke:#5c4036;stroke-width:3;stroke-linejoin:round} #avatarSvg #earLayer{filter:drop-shadow(0 3px 2px rgba(0,0,0,.22))} #avatarSvg #eyesWhite{filter:drop-shadow(0 2px 2px rgba(0,0,0,.28))} #avatarSvg #plushFurLayerV511{filter:drop-shadow(0 2px 1px rgba(0,0,0,.16))} #avatarSvg #pearBody{rx:20px} /* v512 — rounded fantasy chibi avatar art direction */ #avatarSvg #face{stroke:#6f4938;stroke-width:3.5;filter:drop-shadow(0 4px 3px rgba(0,0,0,.18))} #avatarSvg #earLayer{stroke-width:3.5;filter:drop-shadow(0 5px 3px rgba(0,0,0,.2))} #avatarSvg #eyesWhite{filter:drop-shadow(0 3px 2px rgba(0,0,0,.18))} #avatarSvg #eyes{filter:drop-shadow(0 1px 1px rgba(0,0,0,.15))} #avatarSvg #plushFurLayerV511{filter:drop-shadow(0 3px 2px rgba(0,0,0,.14))} #avatarSvg #pearBody{transform:translateY(4px) scale(.94,1.02);transform-origin:210px 350px} /* v632 FIXED FAMILIAR ANCHOR GUARD Automatic room roaming was removed. A stale roaming flag must never change the inner idle. */ #avatarRoom .gg-familiar-room-host-v339[data-roaming="1"] .gg-familiar-room-avatar-v339 > .pet-hover{ animation-name:ggFamFloatSmoothV631!important; } /* v662 — readable conversational bubbles in Avatar Room + Goldie's Salon */ body.avatar-room-page #avatarRoom .gg-avatar-dialog-v243, body.avatar-room-page #avatarRoom .gg-familiar-room-reaction-v343, body.gg-salon-room-v206 #avatarRoom .gg-avatar-dialog-v243, body.gg-salon-room-v206 #avatarRoom .gg-familiar-room-reaction-v343, body.gg-salon-room-v206 #avatarRoom .gg-salon-talk-bubble-v222, body.gg-salon-room-v206 #avatarRoom .gg-room-rap-bubble-v220, body.gg-salon-room-v206 #avatarRoom .gg-fam-client-bubble-v389{ color:#111!important; background:linear-gradient(180deg,rgba(255,255,255,.99) 0%,rgba(229,233,239,.99) 55%,rgba(202,208,217,.99) 100%)!important; border-color:rgba(88,94,104,.68)!important; box-shadow:0 3px 10px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.96)!important; text-shadow:none!important; } body.avatar-room-page #avatarRoom .gg-avatar-dialog-v243 *, body.avatar-room-page #avatarRoom .gg-familiar-room-reaction-v343 *, body.gg-salon-room-v206 #avatarRoom .gg-avatar-dialog-v243 *, body.gg-salon-room-v206 #avatarRoom .gg-familiar-room-reaction-v343 *, body.gg-salon-room-v206 #avatarRoom .gg-salon-talk-bubble-v222 *, body.gg-salon-room-v206 #avatarRoom .gg-room-rap-bubble-v220 *, body.gg-salon-room-v206 #avatarRoom .gg-fam-client-bubble-v389 *{color:#111!important;text-shadow:none!important} body.avatar-room-page #avatarRoom .gg-avatar-dialog-v243::after, body.gg-salon-room-v206 #avatarRoom .gg-avatar-dialog-v243::after{border-top-color:#d9dee6!important} body.avatar-room-page #avatarRoom .gg-familiar-room-reaction-v343::after, body.gg-salon-room-v206 #avatarRoom .gg-familiar-room-reaction-v343::after{background:#d9dee6!important;border-color:rgba(88,94,104,.68)!important} /* v687 shared tactile feedback: keeps existing purple double-tap indicators visible. */ :is(button,.btn,[role="button"],input[type="button"],input[type="submit"]){touch-action:manipulation;-webkit-tap-highlight-color:rgba(19,20,25,.18);transition:filter .12s ease,transform .12s ease,box-shadow .12s ease} :is(button,.btn,[role="button"],input[type="button"],input[type="submit"]):active{filter:brightness(.76);transform:scale(.985);box-shadow:inset 0 3px 8px rgba(0,0,0,.28)} @media(prefers-reduced-motion:reduce){:is(button,.btn,[role="button"],input[type="button"],input[type="submit"]){transition:none}} /* ========================================================== v829 Gremlin Grab — bright physical cabinet, glass playfield, targeting beam, three-prong claw, and original prize pile. ========================================================== */ .gg-claw-game-v131.gg-claw-v829{padding:max(6px,env(safe-area-inset-top)) max(6px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));background:radial-gradient(circle at 50% 20%,rgba(45,204,220,.28),transparent 38%),radial-gradient(circle at 20% 88%,rgba(176,76,218,.25),transparent 36%),rgba(5,9,20,.92);backdrop-filter:blur(12px)} .gg-claw-card-v829{width:min(610px,calc(100vw - 12px))!important;max-height:calc(100svh - 12px)!important;padding:8px!important;overflow:auto!important;overscroll-behavior:contain;border:2px solid rgba(153,231,242,.72)!important;border-radius:25px!important;background:linear-gradient(145deg,#f4f4f4 0%,#d1d1d1 48%,#b7b7b7 100%)!important;color:#181818!important;box-shadow:0 28px 80px rgba(0,0,0,.68),inset 0 1px rgba(255,255,255,.24),0 0 0 4px rgba(106,230,239,.1)!important;scrollbar-width:thin;} .gg-claw-head-v829{padding:4px 5px 8px!important;align-items:center!important}.gg-claw-head-v829 small{color:#8ef7ff!important;text-shadow:0 0 8px rgba(68,235,255,.5)!important}.gg-claw-head-v829 h2{margin:3px 0 2px!important;color:#fff!important;font:1000 27px/1 system-ui,sans-serif!important;letter-spacing:-.035em;text-shadow:0 3px 0 #712d84,0 0 14px rgba(210,115,255,.4)}.gg-claw-head-v829 p{color:#dfeaff!important;font-size:11px!important;font-weight:750}.gg-claw-head-v829 button{flex:0 0 46px;width:46px!important;height:46px!important;min-height:46px;border:2px solid #91a5b9!important;border-radius:50%!important;background:linear-gradient(#314255,#111a27)!important;color:#fff!important;box-shadow:inset 0 1px rgba(255,255,255,.26),0 6px 14px rgba(0,0,0,.38)!important} .gg-claw-hud-v829{grid-template-columns:repeat(5,1fr)!important;gap:4px!important}.gg-claw-hud-v829>span{min-width:0;padding:6px 2px!important;border:1px solid #8397aa!important;border-radius:11px!important;background:linear-gradient(#f9fcff,#c5d0db)!important;box-shadow:inset 0 1px #fff,0 3px 7px rgba(0,0,0,.28)!important}.gg-claw-hud-v829 small{color:#334353!important;font:1000 7px/1 system-ui,sans-serif!important;letter-spacing:.1em!important}.gg-claw-hud-v829 b{color:#111a23!important;font:1000 16px/1 system-ui,sans-serif!important} .gg-claw-progress-v829{height:22px!important;margin:5px 0 7px!important;border:2px solid #627487!important;background:#07111e!important}.gg-claw-progress-v829 i{background:linear-gradient(90deg,#23d3d9,#9e52e8 55%,#ffe35c)!important;box-shadow:0 0 16px #75f7ff!important}.gg-claw-progress-v829 span{color:#fff!important;font-size:8px!important} .gg-claw-cabinet-v829{position:relative!important;width:min(490px,100%);margin:auto;padding:10px 10px 12px!important;border:4px solid #f08b15!important;border-radius:27px 27px 21px 21px!important;background:linear-gradient(90deg,#e75b18,#ffbe24 10%,#ffdc46 50%,#ffae1d 90%,#d64c16)!important;box-shadow:inset 0 0 0 4px #8b2f40,inset 0 1px #fff2a3,0 17px 34px rgba(0,0,0,.48),0 0 22px rgba(54,213,235,.18)!important} .gg-claw-top-vent-v829{width:44%;height:35px;margin:-8px auto 5px;padding:6px 8px;display:flex;gap:5px;border:3px solid #7693a1;border-radius:12px;background:linear-gradient(#e8f4f6,#91acb8);box-shadow:inset 0 -4px rgba(56,87,103,.2),0 4px 7px rgba(0,0,0,.3)}.gg-claw-top-vent-v829>i{flex:1;border-radius:999px;background:linear-gradient(90deg,#244a59,#487887,#1c3f50);box-shadow:inset 1px 0 rgba(255,255,255,.2)} .gg-claw-marquee-v829{position:relative;height:56px!important;grid-template-columns:42px 1fr 42px!important;border:3px solid #a33c16!important;border-radius:18px 18px 8px 8px!important;background:linear-gradient(#fff46f,#ffb01d 58%,#ef6814)!important;color:#3b1732!important;box-shadow:inset 0 3px rgba(255,255,255,.46),0 6px 10px rgba(0,0,0,.34)!important}.gg-claw-marquee-v829>span{display:grid;gap:3px;color:#31132d!important;font:1000 18px/1 system-ui,sans-serif!important;letter-spacing:.08em!important;text-shadow:0 2px #fff19b}.gg-claw-marquee-v829>span>small{font:1000 6px/1 system-ui,sans-serif;letter-spacing:.19em;color:#6b2443}.gg-claw-marquee-v829>b{display:grid;place-items:center;width:31px;height:31px;margin:auto;border:3px solid #692946;border-radius:50%;background:#a8469e;color:#fff5a5!important;font:1000 18px/1 Georgia,serif!important;box-shadow:inset 0 2px rgba(255,255,255,.35),0 0 9px #fff35c}.gg-claw-marquee-v829>i{position:absolute;top:5px;width:8px;height:8px;border-radius:50%;background:#fff9b0;box-shadow:0 0 7px #fff}.gg-claw-marquee-v829>i:nth-of-type(1){left:16%}.gg-claw-marquee-v829>i:nth-of-type(2){left:27%}.gg-claw-marquee-v829>i:nth-of-type(3){left:39%}.gg-claw-marquee-v829>i:nth-of-type(4){left:50%}.gg-claw-marquee-v829>i:nth-of-type(5){left:61%}.gg-claw-marquee-v829>i:nth-of-type(6){left:73%}.gg-claw-marquee-v829>i:nth-of-type(7){left:84%}.gg-claw-cabinet-v829.round-active .gg-claw-marquee-v829>i{animation:ggClawBulbV829 .8s steps(2,end) infinite}.gg-claw-cabinet-v829.round-active .gg-claw-marquee-v829>i:nth-of-type(even){animation-delay:-.4s}@keyframes ggClawBulbV829{50%{opacity:.28;box-shadow:none}} .gg-claw-glass-v829{height:clamp(315px,48svh,430px)!important;margin-top:6px!important;border:5px solid #7fa6ad!important;border-radius:13px!important;background:radial-gradient(circle at 50% 14%,rgba(100,236,241,.22),transparent 30%),linear-gradient(180deg,#243a5b 0%,#292746 48%,#332245 100%)!important;box-shadow:inset 0 0 0 5px #152131,inset 0 0 45px rgba(0,0,0,.62),0 5px 0 #a93424!important;touch-action:none!important}.gg-claw-curtain-v829{position:absolute;inset:0;z-index:0;opacity:.24;background:repeating-linear-gradient(90deg,rgba(115,197,226,.18) 0 31px,rgba(7,20,42,.25) 32px 62px),radial-gradient(circle at 50% 22%,rgba(189,120,247,.42),transparent 44%)}.gg-claw-glass-v829:after{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.1),transparent 17% 72%,rgba(107,238,244,.06));pointer-events:none} .gg-claw-track-v379{left:7%!important;right:7%!important;top:25px!important;height:9px!important;z-index:10!important;border:2px solid #426578;background:linear-gradient(#d8f4f5,#75929e)!important;box-shadow:0 4px 7px rgba(0,0,0,.55)!important}.gg-claw-aim-v829{position:absolute;z-index:4;left:50%;top:32px;bottom:38px;width:2px;translate:-50% 0;background:linear-gradient(rgba(99,246,255,.06),rgba(99,246,255,.82) 68%,rgba(255,239,100,.8));box-shadow:0 0 6px #70f4ff;transition:left .08s linear;pointer-events:none;opacity:.45}.gg-claw-aim-v829>i{position:absolute;left:50%;bottom:8px;width:38px;height:15px;translate:-50% 0;border:2px solid rgba(134,251,255,.7);border-radius:50%;box-shadow:0 0 10px rgba(84,241,255,.6);animation:ggClawTargetV829 1.15s ease-in-out infinite alternate}@keyframes ggClawTargetV829{to{scale:.7;opacity:.48}} .gg-claw-carriage-v829{top:12px!important;width:70px!important;height:175px!important;z-index:14!important;transition:left .08s linear!important}.gg-claw-carriage-v829 .motor{position:relative;width:70px!important;height:42px!important;border:3px solid #6c8390!important;border-radius:13px!important;background:linear-gradient(#f3fbfb,#8ca8b1 56%,#5d747f)!important;box-shadow:inset 0 2px #fff,0 5px 9px rgba(0,0,0,.48)!important}.gg-claw-carriage-v829 .motor>b{display:grid;place-items:center;width:30px;height:30px;border:3px solid #642948;border-radius:50%;background:#a84bad;color:#fff3a4;font:1000 10px/1 system-ui,sans-serif;box-shadow:0 0 8px rgba(255,231,96,.62)}.gg-claw-carriage-v829 .cable{left:33px!important;top:40px!important;width:5px!important;height:75px!important;background:linear-gradient(90deg,#38515d,#d9f0ee 45%,#45616d)!important}.gg-claw-carriage-v829 .claw{left:9px!important;top:107px!important;width:52px!important;height:57px!important}.gg-claw-carriage-v829 .claw:before{left:16px!important;width:20px!important;height:14px!important;border:3px solid #526c79!important;background:linear-gradient(#ecf8f7,#849da8)!important}.gg-claw-carriage-v829 .claw .joint{position:absolute;left:21px;top:11px;width:10px;height:12px;border-radius:4px;background:#9db4bb;border:2px solid #4c6571}.gg-claw-carriage-v829 .arm{top:15px!important;width:6px!important;height:43px!important;border:2px solid #4f6975;background:linear-gradient(90deg,#78949d,#e3efef,#6c8792)!important}.gg-claw-carriage-v829 .arm.left{left:13px!important;transform:rotate(31deg)!important}.gg-claw-carriage-v829 .arm.mid{left:23px!important;height:46px!important}.gg-claw-carriage-v829 .arm.right{right:12px!important;transform:rotate(-31deg)!important}.gg-claw-carriage-v829.dropping .cable{height:calc(clamp(315px,48svh,430px) - 172px)!important}.gg-claw-carriage-v829.dropping .claw{top:calc(clamp(315px,48svh,430px) - 105px)!important}.gg-claw-carriage-v829.grabbing .arm.left{transform:rotate(13deg)!important}.gg-claw-carriage-v829.grabbing .arm.right{transform:rotate(-13deg)!important}.gg-claw-carriage-v829.grabbing .arm.mid{scale:.95 .88} .gg-claw-prize-heap-v829{position:absolute;z-index:2;left:2%;right:2%;bottom:0;width:96%;height:48%;object-fit:cover;object-position:center bottom;pointer-events:none;filter:drop-shadow(0 -3px 5px rgba(0,0,0,.32)) saturate(.92)} .gg-claw-bin-v829{z-index:6!important;left:3%!important;right:3%!important;bottom:27px!important;height:135px!important;border:0!important;background:transparent!important}.gg-claw-prize-v379{z-index:7;width:64px!important;height:86px!important;bottom:8px!important}.gg-claw-prize-v379 .plush{filter:drop-shadow(0 5px 4px rgba(0,0,0,.45))}.gg-claw-prize-v379 .face{position:relative;width:52px!important;height:52px!important;border:3px solid #332344!important;background:linear-gradient(#9fca68,#587b48)!important;font-size:0!important;overflow:visible}.gg-claw-prize-v379 .ears{position:absolute;z-index:0;left:6px;bottom:29px;width:16px;height:28px;background:#739a54;border:3px solid #332344;clip-path:polygon(100% 0,100% 100%,0 55%);transform:rotate(-8deg)}.gg-claw-prize-v379 .ears:after{content:"";position:absolute;left:42px;top:-3px;width:16px;height:28px;background:#739a54;border:3px solid #332344;clip-path:polygon(0 0,100% 55%,0 100%);transform:rotate(16deg)}.gg-claw-prize-v379 .eye{position:absolute;z-index:2;top:16px;width:10px;height:12px;border:2px solid #332344;border-radius:50%;background:#fff}.gg-claw-prize-v379 .eye:after{content:"";position:absolute;left:3px;top:4px;width:3px;height:4px;border-radius:50%;background:#241b31}.gg-claw-prize-v379 .eye.left{left:10px}.gg-claw-prize-v379 .eye.right{right:10px}.gg-claw-prize-v379 .mouth{position:absolute;left:18px;bottom:7px;width:13px;height:7px;border-bottom:3px solid #332344;border-radius:50%}.gg-claw-prize-v379 .face>em{position:absolute;z-index:3;inset:0;display:grid;place-items:center;color:#3d1d3f;font:1000 25px/1 Georgia,serif;text-shadow:0 1px #fff0a3}.gg-claw-prize-v379 .face>em~.eye,.gg-claw-prize-v379 .face>em~.mouth{display:none}.gg-claw-prize-v379 b{color:#fff!important;text-shadow:0 2px 3px #111;font-size:7px!important}.gg-claw-prize-v379 small{color:#26142e!important;background:#ffe66e!important;border:1px solid #8c4926!important;font-size:7px!important}.gg-claw-prize-v379 .bat .face{background:linear-gradient(#81619e,#3c2f58)!important}.gg-claw-prize-v379 .bat .ears{background:#6b4f8a}.gg-claw-prize-v379 .bat .ears:after{background:#6b4f8a}.gg-claw-prize-v379 .moon .face{background:linear-gradient(#acdfff,#5376b7)!important}.gg-claw-prize-v379 .grim .face{background:linear-gradient(#616273,#282a38)!important}.gg-claw-prize-v379 .goldie .face{background:linear-gradient(#ffe46a,#d6843b)!important}.gg-claw-prize-v379 .crown .face,.gg-claw-prize-v379 .jackpot .face{background:radial-gradient(circle,#fff4a0,#e0a123 65%,#a6591d)!important}.gg-claw-prize-v379.caught{bottom:46%!important}.gg-claw-prize-v379.to-chute{bottom:16px!important} .gg-claw-prize-v379 :is(.crown,.jackpot) .face .eye,.gg-claw-prize-v379 :is(.crown,.jackpot) .face .mouth{display:none} .gg-claw-prize-door-v829{z-index:9!important;right:8px!important;width:82px!important;height:48px!important;border:3px solid #8596a5!important;background:linear-gradient(#647482,#24303e)!important;box-shadow:inset 0 2px rgba(255,255,255,.24),0 -4px 10px rgba(0,0,0,.35)}.gg-claw-prize-door-v829:before{background:#090b12!important;box-shadow:inset 0 3px 6px #000}.gg-claw-prize-door-v829>span{color:#fff4a8!important;font-size:7px!important} .gg-claw-console-v829{padding:7px 3px 1px!important}.gg-claw-message-v379{min-height:35px!important;padding:6px 10px!important;border:2px solid #8d4c20!important;border-radius:10px!important;background:linear-gradient(#fff7d1,#e5b951)!important;color:#2b1724!important;font:1000 10px/1.25 system-ui,sans-serif!important;box-shadow:inset 0 1px #fff!important}.gg-claw-deck-v829{display:grid;grid-template-columns:minmax(0,1fr) 68px;gap:8px;align-items:center;margin-top:7px}.gg-claw-controls-v829{grid-template-columns:1fr 1fr 1.18fr!important;gap:7px!important;margin:0!important}.gg-claw-controls-v829>button{min-width:0;min-height:54px!important;padding:5px!important;display:grid!important;place-items:center;gap:2px;border:3px solid #27567b!important;border-radius:11px!important;background:linear-gradient(#65ddff,#168cd4 60%,#0864a8)!important;color:#fff!important;box-shadow:inset 0 2px rgba(255,255,255,.55),0 5px 0 #123e68,0 8px 12px rgba(0,0,0,.3)!important}.gg-claw-controls-v829>button>span{font:1000 22px/1 system-ui,sans-serif;text-shadow:0 2px #0a4f85}.gg-claw-controls-v829>button>small{font:1000 7px/1 system-ui,sans-serif;letter-spacing:.12em}.gg-claw-controls-v829>.drop{border-color:#287139!important;border-radius:50%!important;background:radial-gradient(circle at 42% 27%,#baff8b,#47d75a 52%,#15953c 73%)!important;box-shadow:inset 0 3px rgba(255,255,255,.52),0 6px 0 #1a6531,0 9px 14px rgba(0,0,0,.35)!important}.gg-claw-controls-v829>.drop>span{color:#f2fff0;font-size:17px;text-shadow:0 2px #16722c}.gg-claw-coin-v829{display:grid;grid-template-columns:26px 1fr;align-items:center;gap:4px;height:52px;padding:4px;border:3px solid #814017;border-radius:12px;background:linear-gradient(#ffed78,#e47c16);color:#32152c;box-shadow:inset 0 2px rgba(255,255,255,.48),0 5px 0 #873815}.gg-claw-coin-v829>i{position:relative;width:25px;height:25px;border:3px solid #586673;border-radius:50%;background:linear-gradient(#eff8fa,#8ca1ad)}.gg-claw-coin-v829>i:after{content:"";position:absolute;left:4px;right:4px;top:9px;height:4px;border-radius:99px;background:#2f424e}.gg-claw-coin-v829>b{font:1000 7px/1.05 system-ui,sans-serif;letter-spacing:.07em}.gg-claw-console-v829>.play{width:100%!important;min-height:47px!important;margin-top:8px!important;border:3px solid #6b2856!important;border-radius:13px!important;background:linear-gradient(#d76ae5,#8c36ae 58%,#61277e)!important;color:#fff7a1!important;font:1000 11px/1 system-ui,sans-serif!important;letter-spacing:.08em;box-shadow:inset 0 2px rgba(255,255,255,.3),0 5px 0 #461d60,0 8px 13px rgba(0,0,0,.28)!important}.gg-claw-console-v829>.play:disabled{opacity:.72!important;filter:saturate(.7)!important} .gg-claw-cabinet-v829.round-active .gg-claw-aim-v829{opacity:.82}.gg-claw-fx-v379 b{z-index:30;padding:8px 14px;border:3px solid #fff0a5;border-radius:999px;background:#52285f;color:#fff!important;font-size:21px!important;white-space:nowrap;box-shadow:0 8px 22px rgba(0,0,0,.45),0 0 18px rgba(141,240,255,.48)} @media(max-width:520px){.gg-claw-card-v829{border-radius:18px!important}.gg-claw-head-v829 h2{font-size:23px!important}.gg-claw-head-v829 p{font-size:9px!important}.gg-claw-hud-v829 b{font-size:14px!important}.gg-claw-hud-v829 small{font-size:6px!important}.gg-claw-cabinet-v829{padding:8px!important;border-width:3px!important}.gg-claw-top-vent-v829{height:29px}.gg-claw-marquee-v829{height:48px!important}.gg-claw-marquee-v829>span{font-size:15px!important}.gg-claw-glass-v829{height:clamp(292px,45svh,365px)!important}.gg-claw-carriage-v829.dropping .cable{height:calc(clamp(292px,45svh,365px) - 165px)!important}.gg-claw-carriage-v829.dropping .claw{top:calc(clamp(292px,45svh,365px) - 98px)!important}.gg-claw-bin-v829{height:116px!important}.gg-claw-prize-v379{width:55px!important;height:75px!important}.gg-claw-prize-v379 .face{width:45px!important;height:45px!important}.gg-claw-prize-v379 .eye{top:13px}.gg-claw-prize-v379 .mouth{left:15px}.gg-claw-prize-v379 .ears{bottom:25px}.gg-claw-controls-v829>button{min-height:50px!important}.gg-claw-deck-v829{grid-template-columns:minmax(0,1fr) 61px}.gg-claw-coin-v829{grid-template-columns:22px 1fr;height:48px;padding:3px}.gg-claw-coin-v829>i{width:21px;height:21px}} @media(max-height:690px){.gg-claw-head-v829 p{display:none}.gg-claw-head-v829{padding-bottom:4px!important}.gg-claw-progress-v829{margin-block:3px 5px!important}.gg-claw-glass-v829{height:278px!important}.gg-claw-carriage-v829.dropping .cable{height:116px!important}.gg-claw-carriage-v829.dropping .claw{top:181px!important}.gg-claw-prize-heap-v829{height:43%}.gg-claw-bin-v829{height:104px!important}.gg-claw-top-vent-v829{display:none}.gg-claw-marquee-v829{height:43px!important}.gg-claw-message-v379{min-height:30px!important}.gg-claw-controls-v829>button{min-height:46px!important}.gg-claw-console-v829>.play{min-height:43px!important}} @media(prefers-reduced-motion:reduce){.gg-claw-marquee-v829>i,.gg-claw-aim-v829>i,.gg-claw-prize-v379,.gg-claw-fx-v379 b{animation:none!important}} /* ========================================================== v844 — miniature Familiar portraits preserve one coordinate system. Scale the complete 128px model, including the selected Extra, instead of resizing the model and leaving accessory offsets in full-size pixels. ========================================================== */ :is(.gg-ai-pet-v370,.gg-ai-msg-v370 i,.gg-ai-helper-v370,#ggFamiliarPortraitV339,.bot-portrait,.gg-familiar-guide-btn-v341,.gg-section-pet-v346){position:relative!important;overflow:hidden!important;isolation:isolate} .gg-ai-pet-v370>.gg-familiar-avatar-v339{position:absolute!important;left:50%!important;top:50%!important;width:128px!important;height:128px!important;margin:0!important;padding:0!important;transform:translate(-50%,-50%) scale(.45)!important;transform-origin:center!important} .gg-ai-msg-v370 i>.gg-familiar-avatar-v339{position:absolute!important;left:50%!important;top:50%!important;width:128px!important;height:128px!important;margin:0!important;padding:0!important;transform:translate(-50%,-50%) scale(.34)!important;transform-origin:center!important} .gg-ai-helper-v370>.gg-familiar-avatar-v339{position:absolute!important;left:50%!important;top:50%!important;width:128px!important;height:128px!important;margin:0!important;padding:0!important;transform:translate(-50%,-50%) scale(.34)!important;transform-origin:center!important} #ggFamiliarPortraitV339>.gg-familiar-avatar-v339{position:absolute!important;left:50%!important;top:50%!important;width:128px!important;height:128px!important;margin:0!important;padding:0!important;transform:translate(-50%,-50%) scale(.42)!important;transform-origin:center!important} .bot-portrait>.gg-familiar-avatar-v339,.gg-familiar-guide-btn-v341>.gg-familiar-avatar-v339,.gg-section-pet-v346>.gg-familiar-avatar-v339{position:absolute!important;left:50%!important;top:50%!important;width:128px!important;height:128px!important;margin:0!important;padding:0!important;transform:translate(-50%,-50%) scale(.32)!important;transform-origin:center!important} :is(.gg-ai-pet-v370,.gg-ai-msg-v370 i,.gg-ai-helper-v370,#ggFamiliarPortraitV339,.bot-portrait,.gg-familiar-guide-btn-v341,.gg-section-pet-v346) .gg-familiar-avatar-v339>.pet-hover{position:relative!important;width:100%!important;height:100%!important;display:grid!important;place-items:center!important} :is(.gg-ai-pet-v370,.gg-ai-msg-v370 i,.gg-ai-helper-v370,#ggFamiliarPortraitV339,.bot-portrait,.gg-familiar-guide-btn-v341,.gg-section-pet-v346) .pet-model-v345{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important} :is(.gg-ai-pet-v370,.gg-ai-msg-v370 i,.gg-ai-helper-v370,#ggFamiliarPortraitV339,.bot-portrait,.gg-familiar-guide-btn-v341,.gg-section-pet-v346) .pet-accessory.bow, :is(.gg-ai-pet-v370,.gg-ai-msg-v370 i,.gg-ai-helper-v370,#ggFamiliarPortraitV339,.bot-portrait,.gg-familiar-guide-btn-v341,.gg-section-pet-v346) .pet-accessory.bandana, :is(.gg-ai-pet-v370,.gg-ai-msg-v370 i,.gg-ai-helper-v370,#ggFamiliarPortraitV339,.bot-portrait,.gg-familiar-guide-btn-v341,.gg-section-pet-v346) .pet-accessory.glasses, :is(.gg-ai-pet-v370,.gg-ai-msg-v370 i,.gg-ai-helper-v370,#ggFamiliarPortraitV339,.bot-portrait,.gg-familiar-guide-btn-v341,.gg-section-pet-v346) .pet-accessory.star-clip, :is(.gg-ai-pet-v370,.gg-ai-msg-v370 i,.gg-ai-helper-v370,#ggFamiliarPortraitV339,.bot-portrait,.gg-familiar-guide-btn-v341,.gg-section-pet-v346) .pet-accessory.antlers{transform:none!important} :is(.gg-ai-pet-v370,.gg-ai-msg-v370 i,.gg-ai-helper-v370,#ggFamiliarPortraitV339,.bot-portrait,.gg-familiar-guide-btn-v341,.gg-section-pet-v346) .pet-accessory.halo{transform:rotate(-4deg)!important} @media(max-width:680px){.gg-ai-helper-v370>.gg-familiar-avatar-v339{transform:translate(-50%,-50%) scale(.30)!important}} /* ========================================================== v845 — Familiar Extras share the pet model's coordinate box. Percent anchors keep the accessory attached in Island, Studio, and every miniature Assistant portrait regardless of the portrait's final scale. ========================================================== */ .gg-familiar-avatar-v339>.pet-hover,.gg-familiar-room-avatar-v339>.pet-hover{position:relative!important;container-type:inline-size;overflow:visible!important} .pet-hover>.pet-accessory{position:absolute!important;right:auto!important;bottom:auto!important;box-sizing:border-box!important;transform-origin:center!important} .pet-hover>.pet-accessory.bow{left:58%!important;top:7%!important;width:28%!important;height:22%!important} .pet-hover>.pet-accessory.bow .left,.pet-hover>.pet-accessory.bow .right{top:18%!important;width:43%!important;height:55%!important;border-width:2px!important} .pet-hover>.pet-accessory.bow .left{left:0!important}.pet-hover>.pet-accessory.bow .right{right:0!important} .pet-hover>.pet-accessory.bow .center{left:32%!important;top:23%!important;width:36%!important;height:46%!important;border-width:2px!important} .pet-hover>.pet-accessory.bandana{left:27%!important;top:54%!important;width:46%!important;height:20%!important;border-width:2px!important} .pet-hover>.pet-accessory.glasses{left:18%!important;top:28%!important;width:62%!important;height:22%!important} .pet-hover>.pet-accessory.glasses .lens{top:0!important;width:35%!important;height:73%!important;border-width:2px!important} .pet-hover>.pet-accessory.glasses .lens.left{left:0!important}.pet-hover>.pet-accessory.glasses .lens.right{right:0!important} .pet-hover>.pet-accessory.glasses .bridge{left:39%!important;top:27%!important;width:23%!important;height:14%!important} .pet-hover>.pet-accessory.halo{left:20%!important;top:-2%!important;width:60%!important;height:18%!important;border-width:3px!important} .pet-hover>.pet-accessory.star-clip{left:71%!important;top:10%!important;font-size:22px!important;font-size:22cqw!important;line-height:1!important} .pet-hover>.pet-accessory.antlers{left:50%!important;top:-8%!important;width:84%!important;height:38%!important;transform:translateX(-50%)!important} /* ========================================================== v846 — per-Familiar Extra anchors. Every Familiar keeps a single 128px coordinate system, while these profiles move each Extra to that species' actual head/neck landmarks. The same variables are inherited by Pet Salon cards and AI portraits. ========================================================== */ [data-pet-type]{ --gg-extra-bow-left:58%;--gg-extra-bow-top:7%;--gg-extra-bow-width:28%;--gg-extra-bow-height:22%; --gg-extra-band-left:27%;--gg-extra-band-top:54%;--gg-extra-band-width:46%;--gg-extra-band-height:20%; --gg-extra-glasses-left:18%;--gg-extra-glasses-top:28%;--gg-extra-glasses-width:62%;--gg-extra-glasses-height:22%; --gg-extra-halo-left:20%;--gg-extra-halo-top:-2%;--gg-extra-halo-width:60%;--gg-extra-halo-height:18%; --gg-extra-star-left:71%;--gg-extra-star-top:10%;--gg-extra-star-size:22cqw; --gg-extra-antler-top:-8%;--gg-extra-antler-width:84%;--gg-extra-antler-height:38%; } :is([data-pet-type="dove"],[data-pet-type="crow"],[data-pet-type="alienChicken"]){ --gg-extra-bow-left:64%;--gg-extra-bow-top:11%;--gg-extra-band-left:29%;--gg-extra-band-top:59%;--gg-extra-band-width:42%; --gg-extra-glasses-left:24%;--gg-extra-glasses-top:32%;--gg-extra-glasses-width:52%;--gg-extra-halo-left:24%;--gg-extra-halo-top:0%;--gg-extra-halo-width:52%;--gg-extra-star-left:70%;--gg-extra-star-top:13%; } :is([data-pet-type="robotOwl"],[data-pet-type="moonOwl"]){ --gg-extra-bow-left:63%;--gg-extra-bow-top:11%;--gg-extra-band-left:28%;--gg-extra-band-top:58%;--gg-extra-glasses-left:21%;--gg-extra-glasses-top:31%;--gg-extra-glasses-width:58%;--gg-extra-halo-left:22%;--gg-extra-halo-top:-1%;--gg-extra-halo-width:56%;--gg-extra-star-left:70%;--gg-extra-star-top:13%; } :is([data-pet-type="dog"],[data-pet-type="cat"],[data-pet-type="bunny"]){ --gg-extra-bow-left:64%;--gg-extra-bow-top:10%;--gg-extra-band-left:28%;--gg-extra-band-top:61%;--gg-extra-glasses-left:20%;--gg-extra-glasses-top:31%;--gg-extra-glasses-width:60%;--gg-extra-halo-left:22%;--gg-extra-halo-top:-5%;--gg-extra-halo-width:56%;--gg-extra-star-left:71%;--gg-extra-star-top:11%;--gg-extra-antler-top:-10%; } :is([data-pet-type="ghost"],[data-pet-type="mirrorGhost"]){ --gg-extra-bow-left:63%;--gg-extra-bow-top:9%;--gg-extra-band-left:29%;--gg-extra-band-top:57%;--gg-extra-glasses-left:21%;--gg-extra-glasses-top:30%;--gg-extra-glasses-width:58%;--gg-extra-halo-left:22%;--gg-extra-halo-top:-4%;--gg-extra-halo-width:56%;--gg-extra-star-left:69%;--gg-extra-star-top:12%; } :is([data-pet-type="bat"],[data-pet-type="cuckooBat"],[data-pet-type="deathMoth"]){ --gg-extra-bow-left:66%;--gg-extra-bow-top:17%;--gg-extra-band-left:30%;--gg-extra-band-top:61%;--gg-extra-glasses-left:24%;--gg-extra-glasses-top:35%;--gg-extra-glasses-width:52%;--gg-extra-halo-left:24%;--gg-extra-halo-top:2%;--gg-extra-halo-width:52%;--gg-extra-star-left:72%;--gg-extra-star-top:18%; } [data-pet-type="miniDragon"]{ --gg-extra-bow-left:64%;--gg-extra-bow-top:17%;--gg-extra-band-left:28%;--gg-extra-band-top:61%;--gg-extra-glasses-left:20%;--gg-extra-glasses-top:34%;--gg-extra-glasses-width:60%;--gg-extra-halo-left:21%;--gg-extra-halo-top:1%;--gg-extra-halo-width:58%;--gg-extra-star-left:72%;--gg-extra-star-top:16%; } :is([data-pet-type="flameBall"],[data-pet-type="waterBall"]){ --gg-extra-bow-left:62%;--gg-extra-bow-top:13%;--gg-extra-band-left:28%;--gg-extra-band-top:60%;--gg-extra-glasses-left:21%;--gg-extra-glasses-top:32%;--gg-extra-glasses-width:58%;--gg-extra-halo-left:21%;--gg-extra-halo-top:-3%;--gg-extra-halo-width:58%;--gg-extra-star-left:70%;--gg-extra-star-top:14%; } [data-pet-type="astroFish"]{ --gg-extra-bow-left:62%;--gg-extra-bow-top:16%;--gg-extra-band-left:30%;--gg-extra-band-top:60%;--gg-extra-glasses-left:25%;--gg-extra-glasses-top:34%;--gg-extra-glasses-width:50%;--gg-extra-halo-left:24%;--gg-extra-halo-top:1%;--gg-extra-halo-width:52%;--gg-extra-star-left:70%;--gg-extra-star-top:18%; } [data-pet-type="waterStar"]{ --gg-extra-bow-left:64%;--gg-extra-bow-top:15%;--gg-extra-band-left:29%;--gg-extra-band-top:61%;--gg-extra-glasses-left:21%;--gg-extra-glasses-top:35%;--gg-extra-glasses-width:58%;--gg-extra-halo-left:23%;--gg-extra-halo-top:0%;--gg-extra-halo-width:54%;--gg-extra-star-left:71%;--gg-extra-star-top:16%; } [data-pet-type="stormJelly"]{ --gg-extra-bow-left:64%;--gg-extra-bow-top:9%;--gg-extra-band-left:29%;--gg-extra-band-top:60%;--gg-extra-glasses-left:21%;--gg-extra-glasses-top:31%;--gg-extra-glasses-width:58%;--gg-extra-halo-left:22%;--gg-extra-halo-top:-4%;--gg-extra-halo-width:56%;--gg-extra-star-left:72%;--gg-extra-star-top:10%; } [data-pet-type] .pet-hover>.pet-accessory.bow{left:var(--gg-extra-bow-left)!important;top:var(--gg-extra-bow-top)!important;width:var(--gg-extra-bow-width)!important;height:var(--gg-extra-bow-height)!important} [data-pet-type] .pet-hover>.pet-accessory.bandana{left:var(--gg-extra-band-left)!important;top:var(--gg-extra-band-top)!important;width:var(--gg-extra-band-width)!important;height:var(--gg-extra-band-height)!important} [data-pet-type] .pet-hover>.pet-accessory.glasses{left:var(--gg-extra-glasses-left)!important;top:var(--gg-extra-glasses-top)!important;width:var(--gg-extra-glasses-width)!important;height:var(--gg-extra-glasses-height)!important} [data-pet-type] .pet-hover>.pet-accessory.halo{left:var(--gg-extra-halo-left)!important;top:var(--gg-extra-halo-top)!important;width:var(--gg-extra-halo-width)!important;height:var(--gg-extra-halo-height)!important} [data-pet-type] .pet-hover>.pet-accessory.star-clip{left:var(--gg-extra-star-left)!important;top:var(--gg-extra-star-top)!important;font-size:var(--gg-extra-star-size)!important} [data-pet-type] .pet-hover>.pet-accessory.antlers{left:50%!important;top:var(--gg-extra-antler-top)!important;width:var(--gg-extra-antler-width)!important;height:var(--gg-extra-antler-height)!important;transform:translateX(-50%)!important} /* ========================================================== v847 — readable surface contract. New overlays opt in with data-gg-surface; existing award, tutorial, activity, and temporary-message cards inherit the same silver authority. Gold remains the single action/accent surface. ========================================================== */ :root{--gg-ui-silver-v847:linear-gradient(145deg,#f7f8f9 0%,#d8dde2 48%,#b9c1c9 100%);--gg-ui-gold-v847:linear-gradient(145deg,#f7e8b2 0%,#dfbd5c 52%,#bd9132 100%);--gg-ui-ink-v847:#121820;--gg-ui-silver-border-v847:#697680;--gg-ui-gold-border-v847:#785b1e} [data-gg-surface="silver"], :is(.gg-rank-award-toast-v814,.gg-reward-toast-v087,.gg-palm-win-toast-v102,.gg-toast-v106,.gg-kind-toast,.gg-achievement-v260,.welcome-back-toast,.avatar-share-toast,.save-toast,.gg-level-dialog-v241,.gg-whats-new-v260,.gg-settings-v260,.gg-game-prompt-card-v097,.gg-room-tutorial-card-v109,.gg-game-tutorial-card-v131,.gg-room-tools-tutorial-v267,.gg-living-tutorial-v270){background:var(--gg-ui-silver-v847)!important;color:var(--gg-ui-ink-v847)!important;border-color:var(--gg-ui-silver-border-v847)!important;text-shadow:none!important;box-shadow:inset 0 1px rgba(255,255,255,.95),0 12px 34px rgba(15,24,32,.28)!important} [data-gg-surface="gold"]{background:var(--gg-ui-gold-v847)!important;color:#21180c!important;border-color:var(--gg-ui-gold-border-v847)!important;text-shadow:none!important;box-shadow:inset 0 1px rgba(255,255,255,.9),0 12px 32px rgba(84,60,15,.28)!important} :is([data-gg-surface="silver"],[data-gg-surface="gold"],.gg-rank-award-toast-v814,.gg-reward-toast-v087,.gg-palm-win-toast-v102,.gg-toast-v106,.gg-kind-toast,.gg-achievement-v260,.welcome-back-toast,.avatar-share-toast,.save-toast,.gg-level-dialog-v241,.gg-whats-new-v260,.gg-settings-v260,.gg-game-prompt-card-v097,.gg-room-tutorial-card-v109,.gg-game-tutorial-card-v131,.gg-room-tools-tutorial-v267,.gg-living-tutorial-v270) :is(h1,h2,h3,h4,b,strong,small,span,p,em,label){color:inherit!important;text-shadow:none!important;opacity:1!important} :is([data-gg-surface="silver"],[data-gg-surface="gold"],.gg-room-tutorial-card-v109,.gg-game-tutorial-card-v131,.gg-room-tools-tutorial-v267,.gg-living-tutorial-v270) :is(button,.primary,[role="button"]){background:var(--gg-ui-gold-v847)!important;color:#21180c!important;border-color:var(--gg-ui-gold-border-v847)!important}