/* Reference artwork is unchanged; every pictured action is an actual button. */
/* Fluid alternative when the exact-position art cannot provide 44px targets.
   Pictured tile art stays inside its real button; live summaries remain DOM. */
.approved-gui.approved-gui-flow{overflow:visible;width:100%;max-width:1000px;min-width:0}
.approved-gui-flow .approved-gui-stage{min-width:0!important;aspect-ratio:auto;display:flex;flex-direction:column;gap:16px;padding:16px;background:linear-gradient(#061a37e8,#082647f2),url('/assets/dev82-holographic/home-city.webp') center/cover;box-sizing:border-box}
.approved-gui-flow .approved-gui-art{display:none}
.approved-gui-flow .approved-gui-controls{position:relative;inset:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr));gap:12px;order:2}
.approved-gui.approved-gui-flow .approved-gui-button{position:relative!important;left:auto!important;top:auto!important;width:100%!important;height:auto!important;min-height:44px;min-width:44px;padding:12px 8px;font-size:16px;line-height:1.4;border-radius:12px;box-sizing:border-box}
.approved-gui.approved-gui-flow .approved-gui-tile{min-height:120px;padding:0;aspect-ratio:4/3;align-items:flex-end}
.approved-gui.approved-gui-flow .approved-gui-tile span{font-size:16px;padding:8px 4px;box-sizing:border-box}
.approved-gui-flow .approved-gui-stage>:not(.approved-gui-art):not(.approved-gui-controls){position:relative!important;inset:auto!important;width:100%!important;height:auto!important;max-height:none!important;box-sizing:border-box;order:1;overflow-wrap:anywhere;font-size:16px!important}
.approved-gui-flow [data-avatar-live]{min-height:240px}.approved-gui-flow .approved-room-live,.approved-gui-flow .approved-sticker-live{min-height:300px}
.approved-gui-flow .approved-profile-live .who-grid{flex-wrap:wrap}.approved-gui-flow .approved-profile-live .who{flex:1 1 120px}
.approved-gui.approved-gui-flow .approved-gui-swatch{min-height:56px;aspect-ratio:auto;border-radius:12px}
.approved-gui.approved-gui-flow .approved-gui-swatch span{position:relative;width:auto;height:auto;padding:0;clip-path:none;white-space:normal;overflow:visible}
.approved-gui{overflow-x:auto;max-width:1000px;margin:0 auto 24px}.approved-gui-stage{min-width:var(--panel-min-width,0px);position:relative;aspect-ratio:var(--panel-ratio);isolation:isolate;border-radius:18px;overflow:hidden;background:#061a37;box-shadow:0 0 24px #149fff44;border:1px solid #72cfff;container-type:inline-size}.approved-gui-art{position:absolute;inset:0;width:100%;height:100%;z-index:0}.approved-gui-controls{position:absolute;inset:0;z-index:1;pointer-events:none}
.approved-gui .approved-gui-button{position:absolute;pointer-events:auto;display:flex;align-items:center;justify-content:center;padding:2px;min-height:0;min-width:0;border:1px solid #91eaff;border-radius:6px;color:#fff;background:linear-gradient(180deg,#4fcaff 0%,#0667b9 22%,#072f67 75%,#041b45 100%);box-shadow:inset 0 2px 2px #e8fbffad,inset 0 -3px 3px #01152c,0 3px 0 #031a39,0 0 8px #28bcff9e;text-shadow:0 1px 3px #00132a;font:700 clamp(10px,1.65cqw,18px)/1.1 system-ui;transform:translateZ(0);transform-origin:center;transition:transform .14s ease,box-shadow .14s ease;cursor:pointer;touch-action:manipulation}
.approved-gui .approved-gui-button span{overflow-wrap:anywhere}.approved-gui .approved-gui-button:hover:not(:disabled){transform:translateY(-2px) rotateX(5deg);box-shadow:inset 0 2px 2px #fff9,0 5px 0 #031a39,0 0 16px #53dfff}.approved-gui .approved-gui-button:active:not(:disabled),.approved-gui .approved-gui-button.is-pressed{transform:translateY(2px);box-shadow:inset 0 2px 5px #00102c,0 1px 0 #031a39,0 0 8px #28bcff}.approved-gui .approved-gui-button:focus-visible{outline:3px solid #ffe19a;outline-offset:2px;z-index:2}.approved-gui .approved-gui-button:disabled{cursor:not-allowed;background:#29425e;color:#dbe7f3;box-shadow:inset 0 1px 2px #afc5d5;filter:saturate(.3)}.approved-gui-status:empty{display:none}.approved-gui-status{padding:12px;background:#082647;color:#f1f8ff;border-radius:10px}
@media(max-width:600px){.approved-gui{overflow-x:auto;padding-bottom:8px}.approved-gui-stage{min-width:var(--panel-min-width,600px)}.approved-gui .approved-gui-button{font-size:12px}}
@media(prefers-reduced-motion:reduce){.approved-gui .approved-gui-button{transition:none}.approved-gui .approved-gui-button:hover:not(:disabled),.approved-gui .approved-gui-button:active:not(:disabled){transform:none}}

/* The actual pictured game tile moves with its semantic button, including its artwork. */
.approved-gui .approved-gui-tile{overflow:hidden;padding:0;background:#062750;align-items:flex-end}
.approved-gui-tile-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.approved-gui .approved-gui-tile span{position:relative;width:100%;padding:3px 1px;background:#052855;color:#fff;font-size:clamp(10px,1.5cqw,16px);z-index:1}
.approved-gui .approved-gui-tile:disabled .approved-gui-tile-art{opacity:.45}

.approved-gui .approved-gui-swatch{border-radius:50%;align-items:center}
.approved-gui .approved-gui-swatch span{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.approved-gui .approved-gui-swatch[aria-pressed="true"]{outline:3px solid white;outline-offset:2px;box-shadow:0 0 0 6px #124c89,0 5px 10px #001d42}

.approved-gui .approved-gui-tile[aria-pressed="true"]{outline:3px solid white;outline-offset:2px}

/* The existing editable scene occupies the approved room picture, above its buttons. */
.approved-room-live{position:absolute;left:3%;top:13%;width:94%;height:63%;overflow:hidden;border-radius:8px;background:#092442}
.approved-room-live .cr-stage{width:100%;height:100%;max-width:none;margin:0;border:0;border-radius:0}
.approved-room-live .cr-scene{width:100%;height:100%;aspect-ratio:auto}

.approved-sticker-live{position:absolute;left:4%;top:13%;width:92%;height:76%;overflow:hidden;border-radius:8px}
.approved-sticker-live .lf-wall{height:100%;width:100%;aspect-ratio:auto;min-height:0;margin:0}

.approved-profile-live{position:absolute;z-index:2;left:3%;top:17%;width:74%;height:43%;overflow:auto;background:#06264b;color:white;border-radius:8px;padding:4px;box-sizing:border-box}
.approved-profile-greeting{position:absolute;left:3%;top:60%;width:94%;height:17%;display:grid;place-items:center;background:#eaf7ff;color:#092848;font-weight:700;text-align:center}
.approved-profile-live .who-grid{display:flex;gap:8px;margin:0;justify-content:flex-start;align-items:flex-start}
.approved-profile-live .who{min-width:90px;max-width:170px;margin:0;padding:4px;color:white;background:#0b3960;border-radius:8px;box-shadow:none}
.approved-profile-live button.who{min-height:44px;border:2px solid #83ceff;width:100%;font-size:14px}
.approved-profile-live button.who[aria-pressed=true]{border-color:#ffe168;box-shadow:0 0 10px #ffe168}
.approved-profile-live .who .pic{width:64px;height:64px;margin:0 auto}.approved-profile-live .who small{color:#e0eeff;font-size:12px}
.approved-profile-live button:focus-visible{outline:3px solid #ffe168;outline-offset:-3px}

.approved-welcome-layout{display:grid;grid-template-columns:minmax(320px,560px) minmax(0,1fr);gap:clamp(20px,4vw,56px);align-items:center;max-width:1150px;margin:24px auto}.approved-welcome-layout .command-intro{color:#f4fbff}.approved-welcome-layout .command-intro p{color:#e2efff}.approved-welcome-layout [data-approved-welcome]{min-width:0}@media(max-width:760px){.approved-welcome-layout{grid-template-columns:minmax(0,1fr)}.approved-welcome-layout .command-intro{padding:16px}.approved-welcome-layout [data-approved-welcome]{max-width:560px;width:100%;margin:auto}}

.approved-setup-summary{position:absolute;left:3%;top:14%;width:58%;height:59%;box-sizing:border-box;padding:8px;background:#f3fbff;color:#123152;overflow:auto;font-size:clamp(13px,1.8vw,18px);line-height:1.45}.approved-setup-summary p{margin:0 0 8px;color:#123152}.approved-setup-consent-note{position:absolute;left:61%;top:61%;width:36%;height:34%;box-sizing:border-box;padding:6px;display:grid;place-items:center;background:#f3fbff;color:#123152;text-align:center;font-size:clamp(12px,1.6vw,16px)}.approved-setup-intro{max-width:640px;margin:0 auto}.approved-setup-intro>p{color:var(--text)}
