:root{--bg:#f8f6ef;--paper:#fffdf8;--ink:#253c34;--muted:#637066;--green:#214c42;--sage:#e5eadc;--line:#dedfd2;--peach:#ecd6be;--radius:22px;font-size:20px;color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-bottom:100px}body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5;padding-bottom:100px}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:disabled{opacity:.6;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #a15c2c;outline-offset:4px}button{touch-action:auto}a{color:inherit}button svg{pointer-events:none}h1,h2,h3,p{margin:0}h1,h2{letter-spacing:-.045em;line-height:1.12}h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,4.7vw,3.7rem);font-weight:400}h2{font-size:1.65rem;font-weight:550}h3{font-size:1.1rem;line-height:1.35;font-weight:650}p{margin-top:.65rem}small{font-size:.8rem}button{border:0}svg{max-width:100%;height:auto;display:block}main{max-width:1380px;margin:auto;padding:36px 38px 20px;outline:none}main:focus{outline:none}.topbar{height:102px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px max(38px,calc((100vw - 1304px)/2));background:var(--paper)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-family:Georgia,serif;font-weight:bold;font-size:1.4rem;white-space:nowrap;letter-spacing:-.04em}.brand small{font:400 .68rem system-ui;display:block;letter-spacing:.06em;color:var(--muted);margin-top:0}.brand-icon{border-radius:14px;background:var(--green);color:#f8ecd6;width:52px;height:54px;display:grid;place-items:center;font-size:2rem;line-height:1}.header-actions{display:flex;align-items:center;gap:18px}.wallet{display:flex;align-items:center;gap:8px;background:#efe5c9;border:1px solid #e0cda1;padding:10px 16px;border-radius:40px;font-size:.95rem;color:#6b5020}.wallet-label{font-size:.72rem}.icon-button{width:54px;height:54px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;background:transparent;font-size:1.5rem;flex-shrink:0}.primary,.secondary{min-height:56px;padding:13px 22px;border-radius:12px;font-size:.95rem;font-weight:650;display:inline-flex;align-items:center;justify-content:center;gap:12px;text-decoration:none;line-height:1.35;transition:background .15s,transform .15s}.primary{background:var(--green);color:#fff9e9;border:1px solid var(--green)}.primary:hover{background:#173c33}.secondary{background:var(--paper);border:1px solid #b8c3b3}.secondary:hover{background:#edf0e6}.full{width:100%}.text-button,.back-link{background:transparent;text-decoration:underline;text-underline-offset:4px;min-height:48px;padding:8px 4px;font-size:.85rem;font-weight:600;line-height:1.4}.back-link{text-decoration:none;color:var(--muted);margin-bottom:12px}.eyebrow{display:block;font-size:.68rem;letter-spacing:.16em;font-weight:750;color:#5b6b58;margin-bottom:14px}.pill{display:inline-block;border:1px solid #b8c3ab;border-radius:99px;padding:7px 14px;font-size:.65rem;font-weight:700;letter-spacing:.06em;background:#f7f5e9e8}.muted{color:var(--muted);font-size:.85rem}.fineprint{color:var(--muted);font-size:.75rem;line-height:1.6;margin-top:16px}.fineprint .text-button{font-size:inherit}.coins{font-weight:750;font-size:1.05rem;white-space:nowrap}.coins>span{color:#b78b36;font-size:.8em}.coins small{display:block;font-size:.72rem;font-weight:400;color:var(--muted);margin-left:17px}.hero{display:grid;grid-template-columns:1fr 1.1fr;gap:30px;align-items:center;padding:25px 0 50px}.hero-copy p{font-size:1.05rem;color:#5b675c;margin:20px 0 27px;line-height:1.65}.hero-note{display:block;font-size:.75rem;color:var(--muted);margin-top:14px}.hero-art{position:relative;background:#e6eadc;padding:28px;border-radius:50% 50% 22px 22px;overflow:hidden}.hero-scene{position:relative;border-radius:180px 180px 12px 12px;overflow:hidden}.hero-pieces{position:absolute;left:5%;right:3%;bottom:10%;display:flex;align-items:flex-end}.hero-pieces svg{width:34%}.hero-pieces svg:nth-child(2){width:42%;margin-left:-7%;margin-right:-7%;z-index:1}.floating-note{position:absolute;bottom:18px;right:20px;background:#fffaf0;padding:10px 18px;border-radius:7px;box-shadow:0 6px 20px #253c3410;font-family:Georgia,serif;font-style:italic;font-size:.95rem;transform:rotate(-3deg)}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin:24px 0}.section-heading .eyebrow{margin-bottom:9px}.section-heading h2{font-family:Georgia,serif;font-weight:400;font-size:1.8rem}.room-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.room-card{text-align:left;position:relative;background:var(--paper);border:1px solid var(--line);border-radius:18px;overflow:hidden;padding:0;transition:transform .2s}.room-card:hover{transform:translateY(-3px)}.room-illustration{height:150px;background:var(--room-color);display:flex;align-items:center;justify-content:center;margin:9px 9px 0;border-radius:12px}.room-illustration svg{height:142px;width:165px}.room-card-copy{display:block;padding:16px 18px 20px}.room-card strong{display:block;font-size:1rem;font-weight:650;padding-right:16px}.room-card small{display:block;color:var(--muted);font-size:.7rem;margin-top:6px}.card-arrow{position:absolute;right:14px;bottom:48px;font-size:1.2rem}.delivery-banner{margin:32px 0 10px;width:100%;padding:22px 28px;border-radius:18px;background:#e8d9c0;display:flex;align-items:center;gap:22px;text-align:left}.delivery-banner small{display:block;font-size:.8rem;margin-top:4px}.delivery-banner>span:last-child{margin-left:auto;font-size:1.5rem}.parcel-icon{font-size:2.3rem}.challenge-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.challenge-card{padding:25px;border:1px solid var(--line);border-radius:18px;background:var(--paper);display:flex;flex-direction:column}.challenge-number{font-family:Georgia,serif;font-size:1.6rem;color:#8c9a80;margin-bottom:16px}.challenge-card p{font-size:.85rem;color:var(--muted);margin:12px 0 23px}.challenge-bottom{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.challenge-bottom>span{font-size:.78rem;font-weight:650}.challenge-bottom button{font-size:.8rem;min-height:50px;padding:10px 16px}.page-footer{margin:55px 0 10px;padding-top:22px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.75rem;color:var(--muted)}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:#fffdf8f5;backdrop-filter:blur(16px);z-index:5;border-top:1px solid var(--line);display:flex;justify-content:center;gap:15px;padding:8px 15px max(8px,env(safe-area-inset-bottom))}.bottom-nav[hidden]{display:none}.bottom-nav button{position:relative;background:none;min-width:130px;min-height:65px;padding:2px 20px;border-radius:12px;color:var(--muted);font-size:.73rem;font-weight:650}.bottom-nav button>span{font-size:1.35rem;display:block;line-height:1.25}.bottom-nav button.active{color:var(--green);background:var(--sage)}.bottom-nav b{position:absolute;top:3px;right:17px;background:var(--green);color:#fff;border-radius:20px;min-width:23px;padding:2px 5px;font-size:.6rem}.welcome{display:grid;grid-template-columns:1fr 1fr;gap:75px;min-height:calc(100vh - 230px);align-items:center;padding:20px 0}.welcome-art{background:#e6eadc;border-radius:24px;padding:35px 20px;text-align:center}.welcome-room{position:relative;margin:32px 0;border-radius:150px 150px 12px 12px;overflow:hidden}.welcome-furniture{position:absolute;display:flex;left:6%;bottom:8%;width:90%}.welcome-furniture svg{width:36%}.welcome-furniture svg:nth-child(2){width:43%;margin-left:-7%;z-index:1}.welcome-furniture svg:last-child{width:23%}.welcome-art p{font-family:Georgia,serif;font-size:1.6rem;line-height:1.4}.welcome-art strong{font-weight:400;font-style:italic;color:#5c725a}.welcome-copy h1{font-size:clamp(2rem,4vw,3.1rem)}.welcome-copy>p{margin:18px 0;font-size:1rem;color:var(--muted)}.steps{display:flex;gap:8px;margin-bottom:30px}.steps span{height:5px;width:45px;border-radius:20px;background:#dedfd2}.steps .done{background:var(--green)}label,.field-label{display:block;font-size:.85rem;font-weight:600}.field-label{margin:25px 0 9px}input:not([type=checkbox]),select{width:100%;height:59px;padding:10px 15px;border:1px solid #aebba7;border-radius:10px;background:#fffdf8;color:var(--ink);font-size:1rem;min-width:0}input::placeholder{color:#6d756b;opacity:1}.onboarding-actions{display:flex;gap:12px;margin-top:25px}.onboarding-actions>.primary{flex:1}.choices{display:grid;gap:14px;margin-top:25px}.choice{text-align:left;border:2px solid var(--line);border-radius:14px;background:var(--paper);padding:20px;position:relative;min-height:110px}.choice.chosen{border-color:var(--green);background:#edf1e6}.choice strong{display:block;font-size:1.1rem;padding-right:25px}.choice small{display:block;color:var(--muted);margin-top:6px}.choice-mark{position:absolute;right:18px;top:18px;font-size:1.2rem;color:var(--green)}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:25px;margin:12px 0 28px}.page-heading h1{font-size:clamp(2rem,4vw,3rem)}.page-heading p{color:var(--muted);font-size:.95rem;margin-top:10px}.hint{display:flex;gap:16px;align-items:center;padding:16px 20px;background:#edf0e5;border:1px solid #d6dfca;border-radius:14px;margin-bottom:20px}.hint>span{font-size:1.6rem;align-self:flex-start}.hint p{margin:0;font-size:.85rem;flex:1}.hint button{font-size:.7rem;white-space:nowrap}.studio{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(290px,1fr);gap:24px;align-items:start}.studio-canvas{background:var(--paper);border:1px solid var(--line);border-radius:20px;overflow:hidden;min-width:0}.canvas-heading{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;gap:10px}.saved{font-size:.72rem;color:#4b6c52;white-space:nowrap}.room-scene{position:relative;aspect-ratio:1.35;background:var(--wall);overflow:hidden;isolation:isolate}.scene-background{position:absolute;inset:0}.scene-background>svg{width:100%;height:100%;object-fit:cover}.scene-slots{position:absolute;inset:32% 2% 2%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:1fr 1fr;gap:8px}.scene-piece{background:none;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-width:0;border-radius:12px}.scene-piece>svg{width:100%;max-height:calc(100% - 32px);object-fit:contain;flex:1;min-height:0;filter:drop-shadow(0 3px 3px #403b2815)}.scene-piece>span{display:block;background:#fffaf0f0;border-radius:7px;padding:4px 6px;font-size:.6rem;font-weight:650;line-height:1.25;max-width:100%;box-shadow:0 1px 3px #0001}.scene-piece b{color:#214c42}.scene-piece:hover{background:#fff3}.empty-slot{align-self:end;justify-self:center;width:95%;min-height:64px;border-radius:12px;background:#faf5e960;border:1px dashed #5d715b8c;padding:5px 4px;color:#415642;margin:0 0 2px;line-height:1.2}.empty-slot>span{font-size:1.25rem;display:block;line-height:1.1}.empty-slot>small{font-size:.58rem;line-height:1.3;display:block}.target{background:#f7f8dfd9;border:2px dashed #345d40;animation:pulse 1.8s infinite}.occupied{opacity:.5}.canvas-tools{padding:16px;display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}.canvas-tools .secondary{font-size:.8rem;padding:10px 15px}.studio-canvas>.fineprint{margin:0;padding:0 18px 18px;font-size:.65rem}.inventory{background:var(--paper);border:1px solid var(--line);border-radius:20px;min-width:0;overflow:hidden}.inventory-heading{padding:22px 20px 16px}.inventory-heading h2{font-family:Georgia,serif;font-size:1.6rem;font-weight:400}.inventory-heading p{font-size:.8rem;color:var(--muted)}.inventory-tabs{display:flex;border-bottom:1px solid var(--line);padding:0 8px;gap:3px}.inventory-tabs button{background:transparent;padding:12px 6px;min-height:55px;font-size:.67rem;flex:1;border-bottom:3px solid transparent;font-weight:650}.inventory-tabs button.active{border-color:var(--green);color:var(--green);background:#f0f3e9}.inventory-list{max-height:none;overflow:visible;padding:0 16px;overscroll-behavior:auto}.inventory-item{padding:18px 0;display:grid;grid-template-columns:90px minmax(0,1fr);gap:12px;border-bottom:1px solid var(--line);align-items:center}.inventory-item:last-child{border:0}.inventory-art{background:#eff0e6;border-radius:12px;overflow:hidden}.inventory-art.boxed{background:#efe3ce}.inventory-item h3{font-size:.85rem}.inventory-item p{font-size:.7rem;margin:3px 0 10px;color:var(--muted)}.inventory-item button{font-size:.75rem;min-height:48px;padding:9px 12px}.empty-state{text-align:center;padding:26px 12px 32px}.empty-state>svg{width:150px;margin:0 auto 10px}.empty-state h3{font-size:1rem}.empty-state p{font-size:.85rem;color:var(--muted);margin:10px 0 20px}.empty-state .primary{font-size:.85rem}.large-empty{padding:45px 0}.large-empty>svg{width:230px}.large-empty h2{font-family:Georgia,serif;font-size:1.8rem}.challenge-strip{display:flex;align-items:center;gap:18px;justify-content:space-between;background:#efe4ce;border-radius:14px;padding:18px 22px;margin-bottom:18px}.challenge-strip strong{font-size:.9rem}.challenge-strip p{font-size:.8rem;color:#625c49;margin-top:5px}.challenge-strip button{font-size:.7rem;flex-shrink:0}.shop-controls{display:grid;grid-template-columns:1fr 1.8fr 1fr;gap:18px;margin:30px 0 22px}.shop-controls label{color:var(--muted);font-size:.75rem}.shop-controls input,.shop-controls select{margin-top:7px}.shop-filters{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:20px 0}.chips{display:flex;gap:9px;flex-wrap:wrap}.chip{background:transparent;border:1px solid #bac2b1;border-radius:30px;padding:11px 18px;min-height:50px;font-size:.78rem}.chip.active{background:var(--green);border-color:var(--green);color:#fff8e5}.shop-filters>.muted{font-size:.7rem;white-space:nowrap}.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.product-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;overflow:hidden}.product-image{background:#e9ecdf;width:calc(100% - 20px);margin:10px 10px 0;border-radius:12px;display:flex;align-items:center;justify-content:center;min-height:210px;padding:16px}.product-image svg{height:185px;width:220px;transition:transform .2s}.product-image:hover svg{transform:scale(1.04)}.product-copy{padding:20px}.product-category{font-size:.6rem;letter-spacing:.13em;color:var(--muted);font-weight:700}.product-copy h2{font-size:1.05rem;letter-spacing:-.02em;line-height:1.35;margin-top:7px}.product-copy p{font-size:.75rem;color:var(--muted);margin-top:5px}.swatch-preview{display:flex;align-items:center;gap:7px;margin:15px 0}.swatch-preview>span{width:17px;height:17px;border-radius:50%;border:1px solid #0002}.swatch-preview small{font-size:.65rem;color:var(--muted);margin-left:3px}.product-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px}.product-bottom button{font-size:.75rem;min-height:48px;padding:10px 14px}.product-bottom .coins{font-size:1rem}.cart-layout{display:grid;grid-template-columns:1.5fr 1fr;gap:32px;align-items:start}.cart-items{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:0 24px}.cart-item{display:grid;grid-template-columns:130px 1fr;gap:24px;padding:25px 0;align-items:center;border-bottom:1px solid var(--line)}.cart-item:last-child{border:0}.cart-art{background:#edf0e4;border-radius:12px}.cart-item h2{font-size:1.1rem;line-height:1.4}.cart-item p{font-size:.8rem;color:var(--muted);margin:7px 0 12px}.cart-item .coins small{display:inline;margin:0}.cart-item .text-button{display:block;font-size:.7rem;margin-top:7px}.checkout-card{background:#e9eddf;border:1px solid #d9dfce;border-radius:20px;padding:27px;position:sticky;top:25px}.checkout-card h2{font-family:Georgia,serif;font-weight:400;font-size:1.7rem}.checkout-card dl{font-size:.8rem}.checkout-card dl div{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 0;border-bottom:1px solid #cdd5c1}.checkout-card dd{margin:0;text-align:right;font-weight:650}.checkout-card .total{font-size:1rem;border:0;padding:22px 0 5px}.checkout-card>.primary{margin-top:20px}.danger{color:#993d2b}.danger-fill{background:#8d392c;border-color:#8d392c}.stack-actions{display:flex;flex-direction:column;gap:12px;margin-top:25px}dialog{border:1px solid #d2d8c7;background:var(--paper);color:var(--ink);border-radius:22px;max-width:620px;width:calc(100% - 32px);max-height:88dvh;padding:28px;box-shadow:0 25px 90px #182f3440;overscroll-behavior:auto}dialog::backdrop{background:#172e2b99;backdrop-filter:blur(4px)}.modal-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:16px}.modal-heading h2{font-family:Georgia,serif;font-weight:400;font-size:1.7rem;line-height:1.2}.modal-heading .icon-button{width:46px;height:46px;background:#f0f1e7}.detail-art{background:#e9eddf;border-radius:14px;margin:15px 0;display:flex;justify-content:center;padding:15px}.detail-art>svg{width:250px;height:210px}.detail-art.compact>svg{height:140px;width:170px}.detail-measure{font-size:.8rem;color:var(--muted)}dialog p{font-size:.9rem}fieldset{border:0;padding:0;margin:22px 0}.color-options{display:flex;gap:10px;flex-wrap:wrap}.color-options legend{font-size:.85rem;font-weight:650;margin-bottom:14px}.color-option{background:transparent;border:1px solid var(--line);border-radius:12px;display:flex;flex:1;min-width:115px;align-items:center;flex-direction:column;gap:10px;padding:12px 7px;font-size:.7rem}.color-option>span{width:39px;height:39px;border-radius:50%;display:grid;place-items:center;font-size:1rem;border:1px solid #0002;color:#173c33}.color-option.chosen{border:2px solid var(--green);background:#eef1e4}.detail-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:25px}.detail-footer>.primary{font-size:.85rem}.order-success{text-align:center}.order-success>svg{width:220px;margin:auto}.order-success h3{font-size:1.1rem;margin-top:15px}.order-success p{margin-bottom:22px}.compartment-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px;padding:14px;background:#d8ba91;border:6px solid #b79369;border-radius:10px}.compartment{background:#f7edd7;border:1px dashed #9a8260;border-radius:6px;min-height:130px;padding:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0}.compartment>strong{font-size:1.5rem}.compartment span{font-size:.65rem;line-height:1.3}.compartment svg{height:80px;width:90px}.container-choice{display:flex;align-items:center;text-align:left;gap:13px;background:#eef0e5;border:1px solid var(--line);border-radius:12px;padding:12px;margin:12px 0;width:100%}.container-choice>span:first-child{width:90px;flex-shrink:0}.container-choice strong{font-size:.9rem;display:block}.container-choice small{font-size:.75rem;display:block;color:var(--muted);margin-top:5px}.container-choice>span:last-child{margin-left:auto}.object-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}.object-choice{border:1px solid var(--line);background:#edf0e4;border-radius:14px;padding:12px;text-align:center;min-height:140px;font-size:.8rem}.object-choice>svg{height:100px;margin:auto}.object-choice>span{display:block}.unbox-reveal>svg{height:240px;margin:auto;animation:reveal .65s ease-out}.center{text-align:center}.room-picker{display:grid;gap:12px;margin-top:22px}.room-picker .secondary{justify-content:flex-start}#preferences{display:grid;gap:20px}#preferences label input:not([type=checkbox]),#preferences select{margin-top:8px}.check{display:flex;gap:14px;align-items:center;min-height:48px;font-weight:500}.check input{width:26px;height:26px;accent-color:var(--green);flex-shrink:0}.settings-links{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:22px}.help-list{padding-left:28px;font-size:.95rem}.help-list li{padding:8px 0}.loading,.error-card{text-align:center;padding:80px 20px;max-width:650px;margin:auto}.loading h1,.error-card h1{font-size:2rem}.error-card p{margin:22px 0}.spinner{display:block;width:45px;height:45px;border:3px solid #d4ddc9;border-top-color:var(--green);border-radius:50%;animation:spin 1s infinite linear;margin:0 auto 30px}#toast{position:fixed;bottom:110px;left:50%;transform:translate(-50%,20px);width:max-content;max-width:min(600px,calc(100vw - 28px));padding:16px 22px;border-radius:14px;background:#173e35;color:#fff9eb;box-shadow:0 8px 30px #102f3830;font-size:.85rem;z-index:20;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}#toast.visible{opacity:1;transform:translate(-50%,0)}body:has(dialog[open]) #toast{z-index:1}body:has(dialog[open]){overflow:visible}.busy button{cursor:progress}.skip{position:fixed;top:-100px;left:15px;z-index:50;background:#fff;padding:15px;border-radius:8px}.skip:focus{top:10px}html[data-text=xl]{font-size:24px}html[data-text=xl] .room-grid{grid-template-columns:repeat(3,minmax(0,1fr))}html[data-text=xl] .studio{grid-template-columns:minmax(0,1.5fr) minmax(320px,1fr)}html[data-text=xl] .scene-piece>span{font-size:.6rem}.reduce-motion *,.reduce-motion *::before,.reduce-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{background:#fff9e6}}@keyframes reveal{from{transform:translateY(15px) scale(.8);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(min-width:1600px){main{padding-top:45px}.hero{gap:70px}}
@media(max-width:1100px){.room-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.studio,html[data-text=xl] .studio{grid-template-columns:minmax(0,1fr)}.inventory-list{max-height:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}.inventory-list>.empty-state{grid-column:1/-1}.product-grid{gap:15px}.product-copy{padding:15px}.product-bottom{flex-wrap:wrap}.welcome{gap:35px}.challenge-grid{gap:12px}.challenge-card{padding:20px}.hero-art{padding:18px}.shop-filters{flex-wrap:wrap}.page-heading{align-items:flex-start}.cart-layout{grid-template-columns:1.3fr 1fr;gap:20px}}
@media(max-width:760px){main{padding:24px 18px 14px}.topbar{padding:13px 18px;height:88px}.brand{font-size:1.16rem;gap:9px}.brand small{font-size:.56rem;letter-spacing:.02em}.brand-icon{width:43px;height:46px;border-radius:12px;font-size:1.7rem}.header-actions{gap:9px}.wallet{padding:8px 11px;font-size:.85rem;gap:5px}.wallet-label{display:none}.header-actions .icon-button{width:44px;height:44px;font-size:1.2rem}.hero{grid-template-columns:1fr;gap:26px;padding:5px 0 22px}.hero-copy h1{font-size:2.5rem}.hero-copy p{font-size:1rem;margin:15px 0 20px}.hero-copy .primary{width:100%}.hero-note{text-align:center;font-size:.7rem}.hero-art{max-width:520px;width:100%;margin:auto;border-radius:28px;padding:18px}.hero-scene{border-radius:90px 90px 10px 10px;max-height:260px}.hero-scene>svg{width:100%;height:260px;object-fit:cover}.floating-note{font-size:.8rem;bottom:12px;right:14px}.section-heading{margin:28px 0 18px;display:block}.section-heading h2{font-size:1.65rem}.section-heading>.muted{display:block;margin-top:12px;font-size:.75rem}.room-grid,html[data-text=xl] .room-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.room-illustration{height:119px;margin:7px 7px 0}.room-illustration svg{height:115px;width:140px}.room-card-copy{padding:12px 13px 16px}.room-card strong{font-size:.85rem;line-height:1.3}.room-card small{font-size:.65rem;line-height:1.5}.card-arrow{display:none}.challenge-grid{grid-template-columns:1fr;gap:14px}.challenge-card{padding:22px}.challenge-number{font-size:1.3rem;margin-bottom:10px}.challenge-card p{margin-bottom:18px}.challenge-bottom{flex-wrap:nowrap}.challenge-bottom button{font-size:.8rem}.delivery-banner{padding:18px 16px;gap:12px}.delivery-banner strong{font-size:.85rem;line-height:1.4;display:block}.delivery-banner small{font-size:.75rem}.parcel-icon{font-size:1.8rem}.page-footer{margin-top:35px;display:block;font-size:.7rem}.page-footer .text-button{font-size:.7rem;padding-left:0}.bottom-nav{gap:4px;padding:7px 8px max(7px,env(safe-area-inset-bottom))}.bottom-nav button{min-width:0;flex:1;padding:4px 0;font-size:.64rem;min-height:64px;line-height:1.4}.bottom-nav b{right:10px}.welcome{display:block;padding:0;min-height:auto}.welcome-art{display:none}.welcome-copy{max-width:520px;margin:0 auto;padding:12px 0}.welcome-copy h1{font-size:2.35rem}.welcome-copy>p{font-size:.95rem}.steps{margin-bottom:26px}.choice{padding:18px;min-height:110px}.choice strong{font-size:1rem}.choice small{font-size:.8rem}.welcome-copy>.fineprint{font-size:.7rem}.onboarding-actions .primary{min-height:60px}.page-heading{display:block;margin:4px 0 23px}.page-heading h1{font-size:2.15rem}.page-heading p{font-size:.9rem}.page-heading>.secondary{margin-top:18px;width:100%}.back-link{margin-bottom:9px;font-size:.8rem;padding:4px 0}.hint{padding:13px;gap:10px;flex-wrap:wrap}.hint>span{display:none}.hint p{font-size:.8rem;flex-basis:100%}.hint button{padding:0;min-height:35px;font-size:.7rem}.challenge-strip{padding:15px;display:block}.challenge-strip button{margin-top:8px;padding-left:0;font-size:.75rem}.studio{gap:18px}.canvas-heading{padding:13px 12px}.canvas-heading .pill{font-size:.55rem;padding:6px 10px}.room-scene{aspect-ratio:1;min-height:390px}.scene-slots{inset:32% 2% 3%;gap:6px}.scene-piece>span{font-size:.65rem;min-height:33px;display:flex;align-items:center;justify-content:center;text-align:center;padding:4px}.scene-piece>svg{max-height:calc(100% - 40px)}.empty-slot{min-height:64px}.empty-slot>small{font-size:.6rem}.canvas-tools{padding:12px;gap:10px}.canvas-tools .secondary{font-size:.75rem}.canvas-tools .text-button{font-size:.75rem}.studio-canvas>.fineprint{font-size:.65rem;padding:0 13px 15px}.inventory-heading{padding:18px 16px 13px}.inventory-list{display:block;padding:0 16px}.inventory-item{grid-template-columns:95px 1fr;gap:15px}.inventory-item h3{font-size:.95rem}.inventory-item p{font-size:.75rem}.inventory-item button{font-size:.85rem;min-height:52px}.inventory-tabs button{font-size:.75rem;min-height:57px}.shop-controls{grid-template-columns:1fr 1fr;gap:15px;margin:22px 0 18px}.search-label{grid-column:1/-1;grid-row:1}.shop-controls label{font-size:.75rem}.shop-controls input,.shop-controls select{font-size:.85rem}.shop-filters{display:block}.shop-filters>.muted{display:block;margin:12px 0;font-size:.75rem}.chips{gap:8px}.chip{font-size:.73rem;padding:10px 13px;min-height:50px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.product-image{min-height:130px;padding:4px;width:calc(100% - 12px);margin:6px 6px 0}.product-image>svg{width:145px;height:135px}.product-copy{padding:13px 11px}.product-category{font-size:.52rem;letter-spacing:.08em}.product-copy h2{font-size:.9rem;min-height:2.7em}.product-copy p{font-size:.7rem;min-height:2.8em}.swatch-preview{gap:5px;margin:12px 0}.swatch-preview>span{width:15px;height:15px}.swatch-preview small{font-size:.58rem}.product-bottom{display:block}.product-bottom .coins{font-size:1rem}.product-bottom .coins small{display:inline;margin:0;font-size:.62rem}.product-bottom button{width:100%;margin-top:12px;min-height:52px;font-size:.85rem;padding:10px 8px}.cart-layout{display:block}.cart-items{padding:0 15px}.cart-item{grid-template-columns:90px 1fr;gap:16px;padding:20px 0}.cart-item h2{font-size:1rem}.cart-item p{font-size:.75rem}.cart-item .coins{font-size:.9rem}.cart-item .text-button{font-size:.75rem}.checkout-card{position:static;margin-top:22px;padding:24px 20px}.checkout-card .primary{font-size:.85rem;min-height:62px}.large-empty h2{font-size:1.6rem}.large-empty{padding:22px 0}.detail-footer{display:block}.detail-footer>.primary{width:100%;margin-top:18px;font-size:.9rem}.detail-footer>.coins small{display:inline;margin:0}dialog{padding:22px 18px;border-radius:19px;max-height:90dvh;width:calc(100% - 20px)}.modal-heading h2{font-size:1.55rem}.modal-heading{gap:12px}.modal-heading .icon-button{width:44px;height:44px}dialog p{font-size:.85rem}.detail-art>svg{height:180px}.color-option{min-width:88px;font-size:.65rem;padding:10px 6px}.compartment-grid{gap:7px;padding:8px;border-width:5px}.compartment{min-height:112px;padding:5px}.compartment span{font-size:.6rem}.compartment svg{height:65px}.container-choice{gap:10px;padding:10px}.container-choice>span:first-child{width:65px}.container-choice strong{font-size:.8rem}.container-choice small{font-size:.7rem}.stack-actions>button{font-size:.85rem}.settings-links{display:block}.settings-links>button{display:block;text-align:left}#toast{font-size:.8rem;bottom:100px;padding:14px 18px}.error-card{padding:40px 0}html[data-text=xl] .brand{font-size:.95rem}html[data-text=xl] .brand small{font-size:.5rem}html[data-text=xl] .wallet{font-size:.72rem;padding:7px 9px}html[data-text=xl] .header-actions{gap:7px}html[data-text=xl] .hero-copy h1,html[data-text=xl] .welcome-copy h1{font-size:2.1rem}html[data-text=xl] .room-card strong{font-size:.83rem}html[data-text=xl] .product-grid{grid-template-columns:1fr}html[data-text=xl] .product-copy h2,html[data-text=xl] .product-copy p{min-height:0}html[data-text=xl] .product-copy{padding:18px}html[data-text=xl] .product-image svg{height:180px;width:200px}html[data-text=xl] .scene-piece>span{font-size:.58rem}html[data-text=xl] .inventory-tabs button{font-size:.64rem}html[data-text=xl] .bottom-nav button{font-size:.58rem}html[data-text=xl] .bottom-nav b{right:2px}html[data-text=xl] .compartment-grid{grid-template-columns:repeat(2,minmax(0,1fr))}html[data-text=xl] .wallet-label{display:none}}
@media(max-width:360px){main{padding:20px 12px}.topbar{padding:12px;gap:8px}.brand{font-size:1.05rem}.brand small{font-size:.5rem}.brand-icon{width:36px;height:40px}.header-actions{gap:6px}.wallet{font-size:.75rem;padding:7px 9px}.header-actions .icon-button{width:40px;height:40px}.room-scene{min-height:375px}.canvas-tools{gap:4px}.canvas-tools .text-button{font-size:.7rem}.inventory-tabs button{font-size:.68rem}.color-option{min-width:75px}.bottom-nav button{font-size:.6rem}.hero-copy h1{font-size:2.2rem}html[data-text=xl] .brand-icon{display:none}html[data-text=xl] .brand{font-size:.9rem}html[data-text=xl] .scene-piece>span{font-size:.54rem}}
/* Plopi 1.1: logo aprovado e ícone em todas as superfícies da marca. */
.brand{font-family:inherit;letter-spacing:normal;line-height:1;flex-shrink:0;min-height:48px}
.brand-logo-frame{display:block;position:relative;width:220px;aspect-ratio:3.26;overflow:hidden;flex-shrink:0}
.brand-logo-frame .brand-logo{display:block;position:absolute;width:121.5%;max-width:none;height:auto;left:-10.4%;top:-33%;object-fit:contain}
.footer-brand{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.footer-brand .brand-logo-frame{width:118px}
.footer-brand>span:last-child{font-size:.78rem;color:var(--muted)}
.nav-brand-icon{display:block;width:27px;height:27px;object-fit:contain;margin:0 auto 4px}
.loading-brand{display:block;width:80px;height:80px;object-fit:contain;margin:0 auto 26px;animation:plopi-breathe 2s ease-in-out infinite}
@keyframes plopi-breathe{50%{transform:translateY(-5px)}}
@media(max-width:760px){.brand-logo-frame{width:155px}.topbar{gap:12px}.footer-brand{gap:14px}.footer-brand .brand-logo-frame{width:105px}.nav-brand-icon{width:25px;height:25px;margin-bottom:3px}}
@media(max-width:360px){.brand-logo-frame{width:132px}.topbar{gap:8px}.nav-brand-icon{width:25px;height:25px}html[data-text=xl] .brand-logo-frame{width:122px}}

/* Plopi 1.3: rolagem contínua das peças em celulares e tablets. */
@media (max-width:1100px){
  .inventory{overflow:visible}
  .inventory-list{
    height:auto;
    max-height:none;
    overflow:visible;
    overscroll-behavior:auto;
    touch-action:pan-y pinch-zoom;
  }
  .inventory-item{scroll-margin-bottom:120px}
  body{padding-bottom:calc(120px + env(safe-area-inset-bottom,0px))}
  html{scroll-padding-bottom:calc(120px + env(safe-area-inset-bottom,0px))}
}

/* Plopi 2: uma única rolagem para a página; diálogos têm sua própria superfície. */
html{overflow-y:auto;overscroll-behavior-y:auto;scroll-behavior:auto}
body{overflow:visible;overscroll-behavior-y:auto}
button,a,input,select{touch-action:auto}
.inventory,.inventory-list,.inventory-item,.product-card,.cart-items,.cart-item,.object-choices,.container-choice{touch-action:auto;overscroll-behavior:auto}
.inventory{overflow:visible}.inventory-list{height:auto;max-height:none;overflow:visible;overscroll-behavior:auto;touch-action:auto}
dialog{overflow-y:auto;overflow-x:hidden;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overscroll-behavior:auto;touch-action:auto;-webkit-overflow-scrolling:touch;scroll-behavior:auto}
#modal-body{overflow:visible;touch-action:auto}.modal-heading{position:sticky;top:0;background:var(--paper);z-index:2;padding:8px 0}
:root{--bg:#fff7ed;--paper:#fffefb;--line:#dfdfce;--sage:#d3f1df;--peach:#ffd8aa;--muted:#53665b}
.hero-art,.welcome-art{background:#d3efd7}.hero-art{border:2px solid #c2e1b9}.floating-note{background:#fff0b4;color:#5b4517}
.hero .eyebrow{color:#a04f25}.pill{background:#fff0b8;border-color:#d8b55b;color:#604613}
.room-card{border:2px solid #e6dac6;box-shadow:0 4px 0 #dfcdb955}.room-illustration{background:var(--room-color)}
.room-card:hover{border-color:#5f997b}.room-card:nth-child(2n){border-color:#ecc6c8}.room-card:nth-child(3n){border-color:#c9b7e8}
.product-image{background:#ffebb7}.product-card:nth-child(3n+2) .product-image{background:#d9f2e5}.product-card:nth-child(3n) .product-image{background:#eadfff}
.product-card:nth-child(4n) .product-image{background:#ffd9d2}.product-card{border-color:#e5d4b6}
.challenge-card:nth-child(1){background:#fff0c7;border-color:#ebd58b}.challenge-card:nth-child(2){background:#e8dcff;border-color:#cdb6ee}.challenge-card:nth-child(3){background:#d7f0e6;border-color:#a4d8c4}
.challenge-number{color:#755a39}.challenge-strip{background:#ffecad;border:1px solid #e1be62}.mission-checks{display:flex;gap:8px 20px;flex-wrap:wrap;list-style:none;padding:0;margin:12px 0 0;font-size:.8rem}.mission-checks li{color:#725c39}.mission-checks li.done{color:#215b3d;font-weight:700}
.hint{background:#e4f4ff;border-color:#b5d4e8}.next-step{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px;border-radius:20px;background:#fff0b8;border:1px solid #e0c765;margin:0 0 22px}.next-step .eyebrow{margin-bottom:8px;color:#805818}.next-step h2{font-size:1.35rem;letter-spacing:-.02em}.next-step p{font-size:.85rem;color:#66553b}.next-step button{flex-shrink:0}
.inventory{border:2px solid #d5dbcb}.inventory-heading{background:#e8f4df;border-radius:18px 18px 0 0}.inventory-tabs{padding:10px 9px 0;gap:5px;border-bottom:0;align-items:stretch}.inventory-tabs button{border:2px solid transparent;border-radius:12px;display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;font-size:.7rem;line-height:1.25;min-height:82px;padding:10px 5px;touch-action:auto}
.inventory-tabs button b{border-radius:30px;min-width:30px;padding:2px 7px;background:#fff9;font-size:.8rem}.inventory-tabs [data-tab=boxes]{background:#fff0c3;color:#765018}.inventory-tabs [data-tab=ready]{background:#dcefff;color:#235b7e}.inventory-tabs [data-tab=placed]{background:#d8f0df;color:#215d3d}.inventory-tabs button.active{border-color:currentColor;box-shadow:0 2px 0 #0001;background-color:inherit}.inventory-tabs [data-tab=boxes].active{background:#ffdf83}.inventory-tabs [data-tab=ready].active{background:#bfe2fb}.inventory-tabs [data-tab=placed].active{background:#aee2c0}
.inventory-explanation{padding:12px 17px;color:#526054;font-size:.75rem;margin:0;border-bottom:1px solid #dce3d2}.inventory-item{gap:16px}.inventory-art{background:#e4f3ff;border-radius:14px}.inventory-art.boxed{background:#ffe4a8}.status-placed .inventory-art{background:#dcf2df}.item-status{display:inline-block;font-size:.58rem;letter-spacing:.05em;font-weight:800;padding:4px 7px;border-radius:7px;margin-bottom:7px}.item-status.boxes{background:#ffe4a1;color:#74501a}.item-status.ready{background:#d8ecff;color:#245c82}.item-status.placed{background:#ccebd8;color:#245c3c}.inventory-item .item-location{color:#335b48;font-size:.74rem;line-height:1.4}.inventory-item .text-button{font-size:.7rem;display:block;padding:8px 0}.delivery-banner{background:#ffd594;color:#59401b}.checkout-card{background:#e1f2df}.detail-art{background:#e3f2ff}.compartment-grid{background:#edbf7b;border-color:#c6904c}
.account-banner{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:24px 28px;background:#e6dcff;border:1px solid #c9b4ea;border-radius:20px;margin:10px 0 30px}.account-banner.signed{background:#d9f3e4;border-color:#a4d6b8}.account-banner strong{font-size:1.15rem;line-height:1.3}.account-banner p{font-size:.85rem;color:#4e5265}.account-banner .eyebrow{color:#68508d;margin-bottom:8px}.account-banner button{flex-shrink:0}
.account-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px;align-items:start}.auth-card,.invite-card,.account-info{padding:30px;border:1px solid #dacfb8;border-radius:22px;background:var(--paper);min-width:0}.account-info{background:#e2f1df;border-color:#b9d1ae}.account-info h2,.invite-card h2{font-family:Georgia,serif;font-weight:400;font-size:1.8rem}.account-info p,.invite-card p{font-size:.9rem;margin:17px 0}.account-info>.primary,.account-info>.secondary{margin-top:14px}.account-info ul{padding-left:24px;font-size:.9rem}.account-info li{padding:7px 0}.account-art{display:flex;justify-content:center}.account-art>svg{width:46%;height:180px}.account-menu{padding-top:24px;border-top:1px solid var(--line);margin-top:22px}.account-info .fineprint{font-size:.75rem}
.auth-tabs{display:flex;gap:10px;margin-bottom:24px}.auth-tabs button{flex:1;border:2px solid #bfb7d1;border-radius:12px;min-height:58px;background:#f1ebff;font-size:.85rem;padding:12px}.auth-tabs button.active{background:#d7c3fa;border-color:#7e60ab;color:#3a2954;font-weight:750}#account-form{display:grid;gap:20px}#account-form label input{margin-top:8px}#account-form .primary{white-space:normal}.form-error{margin:0;color:#963d2f;font-size:.85rem}.form-error:empty{display:none}.invite-welcome{padding:18px;background:#fff0ba;border:1px solid #dfc263;border-radius:13px;margin-bottom:24px}.invite-welcome p{font-size:.85rem}.invite-card{background:#fff0c3;border-color:#e5c96e}.bonus-amount{font-size:2.8rem;color:#805222;font-family:Georgia,serif;margin:20px 0}.bonus-amount span{display:block;font-family:system-ui;font-size:.95rem;color:#5f513d}.invite-card label{margin-top:22px}.invite-card input{margin-top:8px;font-size:.8rem;background:#fffaf0}.whatsapp-button{background:#207647;color:#fff;border-color:#207647}.whatsapp-button:hover{background:#175f39}.referral-stats{display:grid;grid-template-columns:1fr 1fr;gap:14px;border-top:1px solid #d7be75;margin-top:27px;padding-top:22px}.referral-stats strong{display:block;font-size:1.5rem}.referral-stats span{display:block;font-size:.75rem;color:#685638}.shared-scene{max-width:900px;margin:24px auto;border:2px solid #c5d3b4;border-radius:22px;overflow:hidden}.share-intro{text-align:center;margin:25px auto;max-width:800px}.share-intro p{color:#526054}.shared-invite{max-width:900px;margin:30px auto}.shared-invite>.primary{margin-top:12px}.public-share{padding-bottom:30px}.public-share .topbar>.secondary{font-size:.8rem}.share-bonus{background:#fff8df;border-radius:13px;padding:16px}
@media(max-width:760px){.next-step,.account-banner{display:block;padding:20px}.next-step button,.account-banner button{margin-top:17px;width:100%;white-space:normal}.next-step h2{font-size:1.2rem}.inventory-tabs button,html[data-text=xl] .inventory-tabs button{font-size:.7rem;min-height:84px}.inventory-item{grid-template-columns:85px minmax(0,1fr)}.inventory-item button{width:100%;white-space:normal}.inventory-item h3{font-size:1rem}.item-status{font-size:.6rem}.inventory-list{padding:0 14px}.inventory-item .item-location{font-size:.8rem}.modal-heading{top:0;padding:10px 0}.account-layout{grid-template-columns:1fr;gap:20px}.auth-card,.invite-card,.account-info{padding:22px 18px}.auth-tabs button{font-size:.8rem}.account-info h2,.invite-card h2{font-size:1.65rem}.account-info ul{font-size:.85rem}.bonus-amount{font-size:2.5rem}.referral-stats{gap:10px}.shared-invite{margin:22px auto}.public-share .topbar .secondary{padding:10px 12px;font-size:.75rem}.public-share .brand-logo-frame{width:130px}}

/* Plopi 2.1: avisos leves, dispensáveis e sem bloquear o jogo. */
#toast{
  top:calc(12px + env(safe-area-inset-top,0px));right:12px;bottom:auto;left:auto;
  width:min(460px,calc(100vw - 24px));max-width:calc(100vw - 24px);
  display:flex;align-items:flex-start;gap:12px;
  background:#def0ff;color:#183d56;border:1px solid #a9cce5;
  padding:14px 12px 14px 18px;border-radius:14px;box-shadow:0 5px 18px #183d5620;
  transform:translateY(-8px);pointer-events:none;z-index:20;
}
#toast.visible{transform:translateY(0);pointer-events:none}
#toast .toast-message{flex:1;min-width:0;line-height:1.5;font-size:.85rem;pointer-events:none}
#toast .toast-close{
  flex:0 0 44px;display:grid;place-items:center;width:44px;min-width:44px;height:44px;
  padding:0;margin:-5px -3px -5px 0;border:1px solid #a9cce5;border-radius:10px;
  background:#eff8ff;color:#183d56;font-size:1.45rem;line-height:1;
  pointer-events:auto;touch-action:auto;cursor:pointer;
}
#toast:not(.visible) .toast-close{pointer-events:none}
#toast .toast-close:hover{background:#c4e5ff}
.color-options{display:block}
.color-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%}
.color-grid .color-option{min-width:0;width:100%;min-height:100px;flex:none;font-size:.75rem;line-height:1.4;padding:12px 5px}
.swatch-preview{display:grid;grid-template-columns:repeat(3,18px);gap:6px;width:max-content;max-width:100%;align-items:center}
.swatch-preview small{grid-column:1/-1;margin-left:0;white-space:nowrap}
@media(max-width:760px){.color-grid{gap:8px}.color-grid .color-option{font-size:.7rem;min-height:105px}.swatch-preview{grid-template-columns:repeat(3,16px)}#toast{font-size:.85rem}#toast .toast-message{font-size:.85rem}}

#toast[hidden]{display:none}

/* ============================================================
   PLOPI 2.5: NOVO DIORAMA 3D, ENTREGAS, UNBOXING & DUELOS
   ============================================================ */

/* 1. Cenário 3D Proporcional sem Cortes em Telas de Celular */
.room-scene {
  position: relative;
  width: 100%;
  aspect-ratio: 1000 / 650;
  max-width: 1000px;
  margin: 0 auto;
  border-radius: 20px;
  overflow: hidden;
  isolation: isolate;
  background: var(--wall, #e5ecdf);
  box-shadow: 0 12px 35px rgba(33, 76, 66, 0.09);
  border: 2px solid rgba(0, 0, 0, 0.05);
}

.scene-background {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.scene-background > svg {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

.scene-slots {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

/* Posicionamento 3D em perspectiva diorama calibrado para 1000x650 */
.scene-piece, .empty-slot {
  pointer-events: auto;
  position: absolute;
  transform: translate(-50%, -100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  background: none;
  padding: 0;
  transition: transform .22s cubic-bezier(0.34, 1.56, 0.64, 1), filter .2s ease;
}

.scene-piece:hover {
  transform: translate(-50%, -104%) scale(1.03);
  z-index: 10 !important;
}

.scene-piece > svg {
  width: 100%;
  height: auto;
  max-height: 100%;
  filter: drop-shadow(0 14px 12px rgba(25, 45, 35, 0.16));
}

.scene-piece > span {
  position: absolute;
  bottom: calc(100% + 4px);
  left: 50%;
  transform: translateX(-50%) translateY(0);
  background: rgba(23, 62, 53, 0.94);
  color: #fffdf8;
  border-radius: 8px;
  padding: 4px 10px;
  font-size: .65rem;
  font-weight: 700;
  white-space: nowrap;
  box-shadow: 0 4px 14px rgba(0,0,0,0.22);
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
  z-index: 60;
}

.scene-piece > span::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 4px;
  border-style: solid;
  border-color: rgba(23, 62, 53, 0.94) transparent transparent transparent;
}

.scene-piece:hover > span,
.scene-piece:focus > span,
.scene-piece.is-active > span,
.scene-piece.is-selected > span {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(-6px);
}

/* Coordenadas precisas de cada slot no diorama */
[data-slot="left"], .slot-pos-left { left: 20%; top: 72%; z-index: 3; }
[data-slot="back"], .slot-pos-back { left: 38%; top: 62%; z-index: 2; }
[data-slot="right"], .slot-pos-right { left: 80%; top: 72%; z-index: 3; }
[data-slot="center"], .slot-pos-center { left: 50%; top: 82%; z-index: 4; }
[data-slot="detail"], .slot-pos-detail { left: 14%; top: 88%; z-index: 5; }
[data-slot="front"], .slot-pos-front { left: 50%; top: 94%; z-index: 6; }

.empty-slot {
  width: auto;
  min-width: 90px;
  min-height: 58px;
  background: rgba(255, 255, 255, 0.55);
  border: 2px dashed rgba(50, 95, 65, 0.45);
  border-radius: 12px;
  padding: 6px 12px;
  color: var(--green);
  text-align: center;
  backdrop-filter: blur(2px);
  cursor: pointer;
}

.empty-slot:hover {
  background: rgba(255, 255, 255, 0.85);
  border-color: var(--green);
  transform: translate(-50%, -102%) scale(1.05);
}

.empty-slot.target {
  background: rgba(255, 246, 204, 0.9);
  border: 2px dashed #b5821c;
  animation: slot-pulse 1.4s infinite;
}

@keyframes slot-pulse {
  50% { transform: translate(-50%, -100%) scale(1.08); background: #fff5bd; }
}

/* 2. Rastreamento e Entrega Estilo Shopee / TikTok Shop */
.delivery-tracker {
  background: #fff8eb;
  border: 2px solid #e8c878;
  border-radius: 20px;
  padding: 22px;
  margin: 0 0 24px;
  box-shadow: 0 8px 24px rgba(181, 130, 28, 0.1);
}

.delivery-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.delivery-title {
  display: flex;
  align-items: center;
  gap: 12px;
}

.delivery-title .van-icon {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
}

.delivery-route-anim {
  position: relative;
  background: #f0e2ca;
  height: 8px;
  border-radius: 99px;
  margin: 18px 0;
  overflow: hidden;
}

.delivery-route-bar {
  height: 100%;
  background: linear-gradient(90deg, #38b000, #214c42);
  border-radius: 99px;
  transition: width 1s linear;
}

.delivery-timeline {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 14px 0 18px;
  font-size: .75rem;
}

.delivery-step {
  text-align: center;
  color: var(--muted);
}

.delivery-step.active {
  color: var(--green);
  font-weight: 750;
}

.delivery-step.active span {
  background: var(--green);
  color: #fff;
}

.delivery-step span {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #dfd8cb;
  color: #555;
  margin: 0 auto 6px;
  font-size: .75rem;
}

.doorbell-banner {
  background: #ffea79;
  border: 2px solid #e0be38;
  border-radius: 16px;
  padding: 16px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 14px 0;
  animation: bell-shake 2.5s infinite;
}

@keyframes bell-shake {
  0%, 85%, 100% { transform: scale(1); }
  90% { transform: scale(1.02) rotate(-1deg); }
  95% { transform: scale(1.02) rotate(1deg); }
}

.doorbell-banner strong {
  font-size: 1rem;
  color: #594006;
}

/* 3. Abertura das Caixas / Unboxing Interativo */
.unbox-wrapper {
  text-align: center;
  padding: 15px 0;
}

.unbox-box-art {
  width: 220px;
  height: 180px;
  margin: 0 auto 20px;
  position: relative;
  animation: box-hover 2.2s ease-in-out infinite;
}

@keyframes box-hover {
  50% { transform: translateY(-8px); }
}

.tape-pull-btn {
  background: #e76f51;
  color: #ffffff;
  border: none;
  font-size: 1.05rem;
  font-weight: 700;
  padding: 14px 28px;
  border-radius: 14px;
  box-shadow: 0 6px 18px rgba(231, 111, 81, 0.35);
  cursor: pointer;
  transition: transform .15s, background .15s;
}

.tape-pull-btn:hover {
  background: #d6593a;
  transform: translateY(-2px);
}

/* 4. Duelos de Cantinhos & Votação da Comunidade */
.battles-layout {
  display: grid;
  gap: 32px;
  margin-top: 20px;
}

.duel-stage {
  background: var(--paper);
  border: 2px solid var(--line);
  border-radius: 24px;
  padding: 28px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.04);
}

.duel-stage h2 {
  font-family: Georgia, serif;
  font-size: 1.8rem;
  margin-bottom: 8px;
}

.duel-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin: 24px 0 16px;
  align-items: stretch;
}

.duel-card {
  background: #fdfbf7;
  border: 2px solid #ded5be;
  border-radius: 20px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  transition: transform .2s, border-color .2s;
}

.duel-card:hover {
  border-color: var(--green);
  transform: translateY(-3px);
}

.duel-preview {
  aspect-ratio: 1000 / 650;
  width: 100%;
  border-radius: 14px;
  overflow: hidden;
  background: #eee;
  margin-bottom: 14px;
  position: relative;
}

.duel-card h3 {
  font-size: 1.15rem;
  margin-bottom: 4px;
}

.duel-author {
  font-size: .8rem;
  color: var(--muted);
  margin-bottom: 16px;
}

.duel-card .vote-btn {
  margin-top: auto;
  width: 100%;
  min-height: 52px;
  font-size: .95rem;
  font-weight: 700;
  border-radius: 12px;
}

.vote-reward-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #ffecb3;
  color: #725206;
  font-size: .75rem;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 99px;
  margin-left: 8px;
}

/* 5. Pódio & Ranking da Comunidade */
.leaderboard-section {
  background: var(--paper);
  border: 2px solid var(--line);
  border-radius: 24px;
  padding: 28px;
}

.podium-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin: 24px 0;
  align-items: end;
}

.podium-card {
  text-align: center;
  background: #f7f9f4;
  border: 2px solid #dae5d5;
  border-radius: 18px;
  padding: 16px;
  position: relative;
}

.podium-card.first {
  background: #fff8e1;
  border-color: #ffd54f;
  transform: scale(1.05);
}

.podium-medal {
  font-size: 2.2rem;
  line-height: 1;
  margin-bottom: 8px;
}

.podium-card strong {
  display: block;
  font-size: 1rem;
}

.podium-card small {
  color: var(--muted);
  font-size: .75rem;
}

.podium-votes {
  display: inline-block;
  background: #214c42;
  color: #ffffff;
  padding: 3px 10px;
  border-radius: 99px;
  font-size: .72rem;
  font-weight: 700;
  margin-top: 8px;
}

.ranking-list {
  display: grid;
  gap: 10px;
  margin-top: 20px;
}

.ranking-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  background: #fbf9f4;
  border: 1px solid var(--line);
  border-radius: 14px;
  gap: 14px;
}

.ranking-pos {
  font-weight: 800;
  font-size: 1.1rem;
  color: #7a6e5b;
  min-width: 28px;
}

.ranking-info {
  flex: 1;
}

.ranking-info strong {
  display: block;
  font-size: .95rem;
}

.ranking-info small {
  color: var(--muted);
  font-size: .75rem;
}

/* ============================================================
   CORREÇÃO DAS COORDENADAS: TODOS OS SLOTS NO PISO (LONGE DA JANELA)
   ============================================================ */
[data-slot="left"], .slot-pos-left { left: 20%; top: 72%; z-index: 3; }
[data-slot="back"], .slot-pos-back { left: 38%; top: 62%; z-index: 2; }
[data-slot="right"], .slot-pos-right { left: 80%; top: 72%; z-index: 3; }
[data-slot="center"], .slot-pos-center { left: 50%; top: 82%; z-index: 4; }
[data-slot="detail"], .slot-pos-detail { left: 14%; top: 88%; z-index: 5; }
[data-slot="front"], .slot-pos-front { left: 50%; top: 94%; z-index: 6; }

/* ============================================================
   LIVRE ARRASTAR E SOLTAR (DRAG & DROP TOUCH E MOUSE)
   ============================================================ */
.scene-piece {
  cursor: grab;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}

.scene-piece:active {
  cursor: grabbing;
}

.scene-piece.is-dragging {
  cursor: grabbing;
  z-index: 100 !important;
  transform: translate(-50%, -100%) scale(1.08) rotate(-1deg) !important;
  filter: drop-shadow(0 20px 24px rgba(25, 45, 35, 0.28)) !important;
  transition: none !important;
  pointer-events: none;
}

.drag-hint-bubble {
  position: absolute;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(33, 76, 66, 0.88);
  color: #fffdf8;
  padding: 6px 14px;
  border-radius: 99px;
  font-size: .72rem;
  font-weight: 600;
  pointer-events: none;
  backdrop-filter: blur(4px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  animation: fadeInDown .3s ease;
  z-index: 20;
}

@keyframes fadeInDown {
  from { opacity: 0; transform: translate(-50%, -8px); }
  to { opacity: 1; transform: translate(-50%, 0); }
}

/* ============================================================
   CORREÇÃO DO MODAL EM CELULARES (SEM CARDS ESTICADOS)
   ============================================================ */
.object-choices {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-top: 16px !important;
  width: 100% !important;
}

.object-choice {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  text-align: left !important;
  background: #fdfbf7 !important;
  border: 2px solid #ded5be !important;
  border-radius: 14px !important;
  padding: 10px 14px !important;
  min-height: 68px !important;
  width: 100% !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.03) !important;
  cursor: pointer !important;
  transition: transform .15s, border-color .15s, background .15s !important;
}

.object-choice:hover, .object-choice:active {
  border-color: var(--green) !important;
  background: #f2f7ec !important;
  transform: translateY(-1px) !important;
}

.object-choice > svg {
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  margin: 0 14px 0 0 !important;
  object-fit: contain !important;
  display: block !important;
  flex-shrink: 0 !important;
}

.object-choice > span {
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
  flex: 1 !important;
  line-height: 1.3 !important;
}

.object-choice::after {
  content: 'Escolher →';
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--green);
  background: #e5f1e3;
  padding: 6px 12px;
  border-radius: 8px;
  flex-shrink: 0;
  margin-left: 8px;
}

/* Responsividade Mobile Reforçada para Celulares (sem corte de imagens!) */
@media(max-width: 760px) {
  .room-scene {
    aspect-ratio: 1000 / 650 !important;
    min-height: auto !important;
  }
  .scene-piece > span {
    font-size: .52rem;
    padding: 2px 5px;
    min-height: 0;
  }
  .empty-slot {
    min-width: 65px;
    min-height: 44px;
    padding: 3px 6px;
    font-size: .65rem;
  }
  .empty-slot > small {
    font-size: .5rem;
  }
  .duel-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .podium-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .podium-card.first {
    transform: none;
    order: -1;
  }
  .delivery-timeline {
    font-size: .68rem;
  }
  dialog {
    width: calc(100% - 24px) !important;
    padding: 20px 16px !important;
  }
}

/* ============================================================
   NOVO SISTEMA: ADICIONAR AO AMBIENTE LIVRE (SEM BOTÕES NO MEIO)
   ============================================================ */
.add-to-room-btn {
  background: var(--green);
  color: #fff9e9;
  border: 1px solid var(--green);
  border-radius: 99px;
  padding: 7px 16px;
  font-size: .78rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  box-shadow: 0 4px 12px rgba(33, 76, 66, 0.2);
  transition: transform .15s, background .15s;
  cursor: pointer;
}

.add-to-room-btn:hover {
  background: #173c33;
  transform: translateY(-1px);
}

.room-fab-add {
  position: absolute;
  right: 14px;
  bottom: 14px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--green);
  color: #ffffff;
  border: 2px solid #ffffff;
  display: grid;
  place-items: center;
  font-size: 1.5rem;
  font-weight: 700;
  box-shadow: 0 6px 18px rgba(0,0,0,0.25);
  cursor: pointer;
  z-index: 80;
  transition: transform .15s, background .15s;
}

.room-fab-add:hover {
  transform: scale(1.08);
  background: #173c33;
}

/* Proporções visuais dos móveis, quadros e utensílios */
.scene-piece.piece-object {
  width: 14% !important;
  max-width: 90px;
}

.scene-piece.piece-rug {
  width: 48% !important;
  z-index: 1 !important;
}

.scene-piece.piece-wall {
  width: 24% !important;
}

/* Filtros por Categoria no Diálogo de Adicionar Peça */
.add-modal-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 6px;
  margin: 14px 0 10px;
  -webkit-overflow-scrolling: touch;
}

.add-modal-tab {
  background: #f0f2eb;
  border: 1px solid var(--line);
  border-radius: 99px;
  padding: 6px 14px;
  font-size: .75rem;
  font-weight: 700;
  color: var(--muted);
  white-space: nowrap;
  cursor: pointer;
}

.add-modal-tab.active {
  background: var(--green);
  color: #ffffff;
  border-color: var(--green);
}

/* ============================================================
   SELETOR DE DUELOS: CARDS MENORES NA LINHA DE BAIXO
   ============================================================ */
.duel-pool-section {
  margin-top: 24px;
  background: #fbf9f4;
  border: 2px solid var(--line);
  border-radius: 20px;
  padding: 20px;
}

.duel-pool-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
  flex-wrap: wrap;
  gap: 8px;
}

.duel-pool-heading h3 {
  font-size: 1.15rem;
  font-family: Georgia, serif;
}

.duel-pool-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 12px;
}

.duel-mini-card {
  background: var(--paper);
  border: 2px solid var(--line);
  border-radius: 14px;
  padding: 8px;
  text-align: center;
  cursor: pointer;
  transition: transform .15s, border-color .15s, box-shadow .15s;
}

.duel-mini-card:hover {
  transform: translateY(-2px);
  border-color: var(--green);
  box-shadow: 0 4px 14px rgba(0,0,0,0.06);
}

.duel-mini-card.active-duel-a {
  border-color: #214c42 !important;
  background: #eef5ea !important;
  box-shadow: 0 0 0 2px #214c42;
}

.duel-mini-card.active-duel-b {
  border-color: #e76f51 !important;
  background: #fdf3f0 !important;
  box-shadow: 0 0 0 2px #e76f51;
}

.duel-mini-preview {
  width: 100%;
  aspect-ratio: 1.35;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 6px;
  pointer-events: none;
}

.duel-mini-preview .room-scene {
  aspect-ratio: 1000 / 650 !important;
  width: 100%;
  height: 100%;
}

.duel-mini-card strong {
  display: block;
  font-size: .75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.duel-mini-card small {
  font-size: .65rem;
  color: var(--muted);
  display: block;
}

.duel-mini-badge {
  display: inline-block;
  font-size: .62rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 6px;
  margin-top: 5px;
}

.duel-mini-card.active-duel-a .duel-mini-badge {
  background: #214c42;
  color: #fff;
}

.duel-mini-card.active-duel-b .duel-mini-badge {
  background: #e76f51;
  color: #fff;
}




/* Sem texto nas miniaturas de fotos dos duelos */
.duel-mini-preview span,
.duel-preview span,
.duel-mini-preview b,
.duel-preview b {
  display: none !important;
}

/* Margens e controles de redimensionamento da peça */
.scene-piece {
  width: 26%;
}

.scene-piece.is-selected {
  z-index: 99 !important;
}

.piece-selection-outline {
  position: absolute;
  inset: -6px;
  border: 2px dashed #214c42;
  border-radius: 14px;
  pointer-events: none;
  animation: sel-pulse 1.8s infinite alternate ease-in-out;
}

@keyframes sel-pulse {
  from { border-color: #214c42; }
  to { border-color: #e76f51; }
}

.corner-dot {
  position: absolute;
  width: 10px;
  height: 10px;
  background: #ffffff;
  border: 2px solid #214c42;
  border-radius: 50%;
}
.corner-dot.tl { top: -5px; left: -5px; }
.corner-dot.tr { top: -5px; right: -5px; }
.corner-dot.bl { bottom: -5px; left: -5px; }
.corner-dot.br {
  bottom: -6px;
  right: -6px;
  width: 18px;
  height: 18px;
  background: #214c42;
  border: 2px solid #ffffff;
  cursor: se-resize;
  pointer-events: auto;
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);
  border-radius: 50%;
}

.piece-controls-bar {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 6px;
  background: #fffdf8;
  border: 2px solid #214c42;
  border-radius: 99px;
  padding: 4px 10px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.22);
  z-index: 100;
  white-space: nowrap;
  user-select: none;
}

.ctrl-btn {
  background: #f0f3eb;
  color: #214c42;
  border: 1px solid #c9d5c5;
  border-radius: 50%;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  font-size: .85rem;
  font-weight: 800;
  cursor: pointer;
  transition: transform .12s, background .12s;
  padding: 0;
  flex-shrink: 0;
}

.ctrl-btn:hover {
  background: #214c42;
  color: #fff;
  transform: scale(1.1);
}

.ctrl-btn.ctrl-done {
  background: #214c42;
  color: #fff;
  border-color: #214c42;
}

.ctrl-scale-val {
  font-size: .72rem;
  font-weight: 800;
  color: #214c42;
  min-width: 36px;
  text-align: center;
}