/* Native studio artwork is framed in full, preserving the actual room geometry. */
.home-showcase{background:#203846;min-height:470px}.home-frame{display:flex;align-items:center;justify-content:center;padding:48px 8px 28px}.home-frame img{width:100%;height:100%;object-fit:contain;object-position:center;transform:none}.home-stamp{font-size:11px}.home-switch{top:18px}
/* Shared rows align copy, preview and controls across both feature cards. */
.identity-features{grid-template-rows:auto 340px 160px}.fashion-feature,.chat-feature{display:grid;grid-row:span 3;grid-template-rows:subgrid;gap:0}.feature-card-copy,.fashion-feature .feature-card-copy{padding:32px 32px 26px}.identity-features h3{min-height:2.3em;text-wrap:balance}.feature-card-copy p:not(.eyebrow){margin-top:0}.fashion-stage,.chat-preview-stage{min-height:0;height:100%;padding:24px;justify-content:center}.fashion-stage .atelier-label,.chat-preview-stage .atelier-label{margin:0 0 20px}.fashion-stage img{height:220px;width:100%;object-fit:contain;margin:0}.fashion-names{margin-top:8px}.chat-preview-stage{gap:7px}.chat-person{transform:scale(1.35);margin:22px 0 12px}.feature-card-foot{flex-direction:column;gap:12px;padding:22px;font-size:12px}.fashion-tags{display:flex;gap:20px}.feature-card-foot p{margin:0;font-size:13px;color:#675b73}.bubble-controls{padding:18px 24px}.bubble-controls label{display:block;margin-bottom:4px}.bubble-choices{margin-bottom:8px}.showcase-bubble{max-width:95%}
.mobile-showcase{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px;margin-top:32px;padding:56px;background:#e7ecde;border:1px solid #c8d0bb;border-radius:24px;overflow:hidden}.mobile-copy h3{font-size:46px;line-height:1.1;letter-spacing:-2px;margin:0 0 24px}.mobile-copy h3 em{font-style:normal;color:#d9765c}.mobile-copy>p:not(.eyebrow){font-size:15px;color:#526557;max-width:460px;line-height:1.8}.mobile-highlights{list-style:none;padding:0;margin:30px 0;display:grid;gap:20px}.mobile-highlights li{display:flex;gap:16px;align-items:flex-start}.mobile-highlights li>span{display:grid;place-items:center;flex:0 0 34px;height:34px;border:1px solid #bbc8b3;border-radius:50%;font-size:11px;color:#63755f}.mobile-highlights strong{font-size:15px}.mobile-highlights p{font-size:13px;color:#63755f;margin:3px 0 0}.mobile-copy .button{font-size:13px;gap:20px}.mobile-copy .mobile-note{font-size:11px;margin:16px 0 0}.mobile-visual{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0}.mobile-orbit{position:absolute;border:1px solid #b7c8ac;border-radius:50%;width:470px;height:470px;top:40px}.orbit-two{width:540px;height:540px;top:5px;opacity:.5}.phone-shell{width:280px;max-width:100%;padding:8px;border:2px solid #627269;border-radius:38px;background:#243f38;box-shadow:14px 18px 0 #c6d3bc,0 25px 40px #203b3520;z-index:1}.phone-screen{position:relative;overflow:hidden;background:#203846;aspect-ratio:9/18.6;border-radius:29px;display:flex;flex-direction:column;align-items:center;color:#f5f3df;padding:32px 12px 26px}.phone-screen:before{content:'';position:absolute;top:8px;left:calc(50% - 32px);width:64px;height:12px;border-radius:12px;background:#112b31}.phone-top{display:flex;align-items:center;justify-content:space-between;width:100%;gap:10px;font-size:22px;font-weight:900;letter-spacing:-1px}.coral-text{color:#ed8c72}.phone-online{font-size:7px;letter-spacing:1px;color:#b5d6c5}.phone-room{margin-top:30px;font-size:10px;letter-spacing:2px;color:#efcf83}.phone-scene{position:relative;width:calc(100% + 24px);flex:1;display:flex;align-items:center;justify-content:center}.phone-scene img{width:100%;height:auto;display:block}.phone-bubble{position:absolute;z-index:1;top:34px;left:50%;transform:translateX(-50%);white-space:nowrap;background:#fff6dc;color:#29453e;padding:9px 12px;border-radius:12px 12px 12px 2px;font-size:10px;box-shadow:0 4px 0 #10273033}.phone-bottom{display:flex;justify-content:space-around;width:100%;border-top:1px solid #66827b70;padding-top:17px;font-size:8px;letter-spacing:1px;color:#dcebdc}.phone-homebar{position:absolute;bottom:10px;width:75px;height:3px;border-radius:5px;background:#d9e6da}.mobile-preview-label{margin:30px 0 0;font-size:9px;letter-spacing:1.4px;color:#67765c;z-index:1}
@media(max-width:1000px){.feature-card-copy,.fashion-feature .feature-card-copy{padding:26px 24px}.identity-features{grid-template-rows:auto 320px 160px}.mobile-showcase{padding:36px;gap:30px}.mobile-copy h3{font-size:37px}.mobile-orbit{width:350px;height:350px;top:100px}.orbit-two{width:410px;height:410px;top:70px}}
@media(max-width:700px){.home-showcase{min-height:350px}.home-frame{padding:64px 0 48px}.home-frame img{transform:none;object-position:center}.home-switch{top:15px}.identity-features{grid-template-rows:none;gap:22px}.fashion-feature,.chat-feature{display:flex;grid-row:auto}.identity-features h3{min-height:0}.feature-card-copy,.fashion-feature .feature-card-copy{padding:28px}.fashion-stage,.chat-preview-stage{min-height:300px;padding:24px 18px}.feature-card-foot{min-height:110px}.bubble-controls{min-height:160px}.mobile-showcase{grid-template-columns:1fr;padding:30px 24px;gap:40px}.mobile-copy h3{font-size:38px}.mobile-copy .eyebrow{font-size:10px;letter-spacing:1.4px}.mobile-copy .button{width:100%;font-size:12px;padding:14px 12px}.mobile-visual{padding:0 8px}.phone-shell{width:260px}.mobile-orbit{width:320px;height:320px}.orbit-two{width:365px;height:365px}.mobile-preview-label{font-size:8px}.fashion-tags{gap:14px}}

.phone-scene{margin-top:16px;margin-bottom:16px;overflow:hidden;border-radius:12px;width:100%}.phone-scene img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:82% 78%}.phone-bubble{top:18px;box-shadow:0 4px 12px #163c4540}.phone-room{margin-top:22px}

.home-showcase{background-color:#203846;background-image:url('/welcome/media/home-skyline.svg'),linear-gradient(180deg,#496669 0%,#2d4b55 55%,#203846 100%);background-position:center,center;background-size:cover,cover}.phone-scene img{object-position:70% 80%;transform:scale(2.05);transform-origin:60% 100%}.phone-bubble{top:20px}.footer small a{font-weight:bold;text-decoration:none}.footer small a:hover{text-decoration:underline}

/* Actual Popilife neighborhood behind the player's home. */
.home-showcase{isolation:isolate;background:#36545a}
.home-showcase:before,.home-showcase:after{content:'';position:absolute;inset:0;pointer-events:none}
.home-showcase:before{background:url('/welcome/media/city.png') 35% 38%/cover no-repeat;filter:saturate(.55) brightness(.8) blur(1px);opacity:.72}
.home-showcase:after{background:linear-gradient(180deg,#20384635,#20384675 65%,#203846bd)}
.home-frame{z-index:1}.home-frame img{filter:drop-shadow(0 14px 12px #112e3945)}.home-switch,.home-stamp{z-index:2}
/* Portrait artwork is composed to the screen ratio, so every asset fits. */
.phone-screen{padding:0;background:#4c9aab;isolation:isolate}
.phone-scene{position:absolute;inset:0;width:100%;height:100%;margin:0;border-radius:0;z-index:-1}
.phone-scene img{width:100%;height:100%;object-fit:contain;object-position:center;transform:none}
.phone-top{position:absolute;top:31px;left:12px;right:12px;width:auto;padding:7px 9px;border-radius:12px;background:#25483dd9;font-size:21px}
.phone-bottom{position:absolute;bottom:20px;left:12px;right:12px;width:auto;padding:14px 8px;border:1px solid #fff7df35;border-radius:12px;background:#25483dd9;backdrop-filter:blur(4px);color:#fff5df}
.phone-screen:before{z-index:2}.phone-homebar{z-index:2}