*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;color:#fff;background:#030817;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}.glass{background:linear-gradient(135deg,rgba(15,42,94,.38),rgba(3,8,27,.52));border:1px solid rgba(114,170,255,.34);box-shadow:0 12px 36px rgba(0,0,0,.34),0 0 18px rgba(42,89,255,.08),inset 0 1px rgba(255,255,255,.10);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}.neon-bg{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 20% 12%,rgba(0,160,255,.24),transparent 22%),radial-gradient(circle at 84% 18%,rgba(172,56,255,.25),transparent 24%),radial-gradient(circle at 50% 70%,rgba(0,104,255,.15),transparent 32%),linear-gradient(115deg,#061b3c 0,#030916 50%,#071534 100%)}button,a{font:inherit}button{cursor:pointer;color:#fff}.top{position:sticky;top:12px;z-index:30;width:min(940px,calc(100% - 26px));margin:12px auto;padding:10px 12px 10px 14px;border-radius:32px;display:flex;align-items:center;justify-content:space-between}.brand{border:0;background:none;display:flex;align-items:center;gap:12px;text-align:left}.brand img,.drawer-brand img,.footer-brand img{width:48px;height:48px;border-radius:50%;object-fit:cover;background:#000;border:1px solid rgba(255,255,255,.35);box-shadow:0 0 22px rgba(95,113,255,.3)}.brand strong{display:block;font-size:23px;letter-spacing:-.6px}.brand small{display:block;color:#b9c9ed;font-size:12px;margin-top:2px}.top-actions{display:flex;align-items:center;gap:10px}.music-top{height:48px;min-width:126px;border:1px solid rgba(119,170,255,.45);background:rgba(3,10,31,.35);border-radius:26px;padding:5px 9px 5px 13px;display:flex;align-items:center;gap:10px}.music-top span{font-size:21px}.music-top b{font-size:12px}.music-top i{display:block;width:46px;height:29px;border-radius:18px;background:linear-gradient(90deg,#427cff,#b84fff);position:relative;box-shadow:0 0 18px rgba(126,81,255,.7)}.music-top i:after{content:"";position:absolute;width:23px;height:23px;border-radius:50%;right:3px;top:3px;background:#f1edff;box-shadow:0 0 14px rgba(255,255,255,.6)}.music-top.off i{background:rgba(255,255,255,.13)}.music-top.off i:after{right:auto;left:3px}.menu-btn{width:48px;height:48px;border-radius:50%;border:1px solid rgba(119,170,255,.45);background:rgba(3,10,31,.32);display:grid;place-content:center;gap:5px}.menu-btn span{display:block;width:22px;height:2px;background:#fff;border-radius:2px}main{position:relative;z-index:2;width:min(940px,calc(100% - 26px));margin:18px auto 40px}.hero{min-height:330px;padding:32px;border-radius:34px;overflow:hidden;position:relative;background:linear-gradient(110deg,rgba(2,17,44,.8),rgba(8,25,65,.48)),radial-gradient(circle at 78% 50%,rgba(105,53,255,.45),transparent 32%)}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0 40%,rgba(41,136,255,.12) 55%,transparent 70%),radial-gradient(circle at 85% 70%,rgba(255,40,218,.14),transparent 28%);pointer-events:none}.hero-art{position:absolute;right:2%;bottom:-6%;width:48%;height:90%;background:radial-gradient(ellipse at center,rgba(1,5,17,.2),rgba(1,5,17,.85) 66%,transparent 67%),linear-gradient(140deg,transparent 40%,rgba(166,71,255,.3));clip-path:polygon(30% 0,70% 0,100% 30%,82% 100%,12% 100%,0 50%);opacity:.85}.hero-content{position:relative;z-index:2;max-width:560px}.pill{display:inline-flex;padding:8px 13px;border-radius:999px;border:1px solid rgba(146,116,255,.7);background:rgba(43,25,108,.32);font-size:11px;color:#e4dfff;letter-spacing:.3px}.hero h1{font-size:clamp(50px,11vw,82px);line-height:.9;margin:20px 0 7px;color:#e8dcff;text-shadow:0 0 25px rgba(105,96,255,.8)}.hero h2{font-size:clamp(22px,5vw,38px);margin:0 0 12px}.hero p{max-width:600px;color:#c6d2ed;line-height:1.45}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.primary,.secondary,.buy,.confirm{border-radius:18px;padding:13px 19px;color:#fff;border:0;font-weight:800}.primary,.buy,.confirm{background:linear-gradient(100deg,#356dff,#a84dff);box-shadow:0 10px 28px rgba(76,69,255,.3)}.secondary{background:rgba(255,255,255,.06);border:1px solid rgba(144,174,255,.45)}.section-title{display:flex;align-items:center;justify-content:space-between;margin:27px 3px 13px}.section-title h2{margin:0;font-size:28px}.section-title h2:before{content:"";display:inline-block;width:22px;height:4px;border-radius:3px;background:#3f7cff;box-shadow:0 7px 0 #9a4eff;margin-right:12px;vertical-align:middle}.small-action{border:1px solid rgba(150,177,255,.4);background:rgba(255,255,255,.05);color:#dce5ff;border-radius:20px;padding:9px 15px}.category-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.category-card{padding:10px;border-radius:23px;text-align:center;min-width:0}.category-card .cat-pic{height:145px;border-radius:17px;overflow:hidden;background:linear-gradient(145deg,rgba(10,29,65,.8),rgba(1,7,23,.85));border:1px solid rgba(120,162,255,.22)}.category-card img{width:100%;height:100%;object-fit:contain;padding:4px}.category-icon{font-size:31px;margin:-18px auto 2px;position:relative;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#172e69,#07112f);border:1px solid rgba(153,180,255,.45);box-shadow:0 0 18px rgba(70,104,255,.4)}.category-card h3{font-size:14px;margin:7px 0 9px}.cat-enter{width:100%;padding:8px;border-radius:16px;border:1px solid rgba(134,168,255,.4);background:linear-gradient(100deg,rgba(51,103,255,.8),rgba(125,72,255,.8));color:#fff;font-weight:700}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-top:24px}.benefit{padding:17px;border-radius:23px;display:flex;gap:13px;align-items:center}.benefit-icon{width:52px;height:52px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:24px;border:1px solid rgba(138,178,255,.45);background:rgba(14,32,78,.55);box-shadow:0 0 20px rgba(55,103,255,.18)}.benefit b{display:block;margin-bottom:5px}.benefit p{margin:0;color:#aebcdb;font-size:12px;line-height:1.45}.featured-head{margin-top:29px}.featured-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.card{border-radius:22px;overflow:hidden;min-width:0;background:linear-gradient(145deg,rgba(18,44,91,.54),rgba(3,8,25,.7))}.pic{width:100%;aspect-ratio:1/1;display:block;object-fit:contain;background:transparent;padding:3px;transform:scale(1.04);transform-origin:center}.body{padding:12px}.body h3{margin:0 0 6px;font-size:14px;line-height:1.2}.price{font-weight:800;color:#aebdff;margin-bottom:4px}.stock{font-size:11px;color:#aeb9d3;margin-bottom:10px}.stock.low{color:#ffd27c}.buy{width:100%;padding:9px 11px;border-radius:16px;font-size:12px}.back{border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:#fff;border-radius:14px;padding:10px 14px;margin-bottom:13px}.head{padding:22px;border-radius:28px;margin-bottom:13px}.head h2{margin:12px 0 5px}.head p{margin:0;color:#aeb8d8}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.drawer{position:fixed;z-index:60;top:12px;right:12px;bottom:12px;left:auto;width:min(350px,calc(100% - 24px));padding:18px;border-radius:28px;display:flex;flex-direction:column;gap:5px;transform:translateX(120%);transition:transform .25s ease}.drawer.open{transform:translateX(0)}.drawer-brand{display:flex;align-items:center;gap:10px;padding:5px 4px 15px}.drawer-brand b{display:block;font-size:19px}.drawer-brand small{color:#9eafd1}.drawer button{border:0;background:transparent;color:#fff;text-align:left;padding:13px;border-radius:14px;display:flex;gap:10px;align-items:center}.drawer button:hover{background:rgba(255,255,255,.08)}#shade{position:fixed;z-index:50;inset:0;background:rgba(0,0,0,.65);opacity:0;pointer-events:none;transition:.2s}#shade.show{opacity:1;pointer-events:auto}.modal{position:fixed;z-index:100;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(9px);display:flex;align-items:center;justify-content:center;padding:16px}.hidden{display:none!important}.modal-card{width:min(560px,100%);max-height:92vh;overflow:auto;border-radius:30px;padding:22px;position:relative}.close{position:absolute;right:12px;top:12px;width:38px;height:38px;border:0;border-radius:50%;background:rgba(255,255,255,.08);color:#fff;font-size:25px}.sizes{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.size{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;border-radius:13px;padding:10px 14px}.size.active{background:linear-gradient(100deg,#4d7cff,#a04cff)}.form{display:grid;gap:10px}.form label{font-size:12px;color:#b9c3e2}.form input,.form textarea{width:100%;margin-top:5px;padding:13px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.25);color:#fff;outline:none}.form textarea{min-height:90px;resize:vertical}.confirm{width:100%}.footer{position:relative;z-index:3;width:min(940px,calc(100% - 26px));margin:0 auto 28px;border-radius:26px;padding:16px}.footer-main{display:flex;align-items:center;justify-content:space-between;gap:14px}.footer-brand{display:flex;align-items:center;gap:10px}.footer-brand strong{display:block;font-size:22px}.footer-brand small{display:block;color:#aeb8d8;margin-top:3px}.contact-actions{display:flex;gap:10px;min-width:390px}.contact-actions a{flex:1;text-align:center;text-decoration:none;color:#fff;padding:13px;border-radius:18px;font-weight:800}.call{background:linear-gradient(100deg,#20d6b1,#4ee7d2)}.wa{background:linear-gradient(100deg,#624dff,#a44dff)}.socials{display:flex;justify-content:flex-end;gap:16px;margin:10px 4px 0}.socials a{color:#dce5ff;text-decoration:none;font-size:20px}.copyright{margin-top:10px;text-align:left;color:#a1aecb;font-size:11px}#rain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.48;mix-blend-mode:screen;filter:blur(.05px)}.admin-list{display:grid;gap:9px}.order{padding:14px;border-radius:18px}.empty{color:#aeb8d8}.notice{padding:12px;border-radius:16px;background:#ffffff09;color:#aeb8d8;font-size:12px;line-height:1.5}@media(max-width:820px){.category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.featured-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-main{align-items:stretch;flex-direction:column}.contact-actions{min-width:0}.hero-art{width:55%;opacity:.6}}@media(max-width:600px){.top{top:7px;margin:7px auto}.brand strong{font-size:20px}.brand small{font-size:10px}.music-top{min-width:102px}.hero{padding:23px;min-height:430px}.hero-art{width:75%;right:-12%;bottom:0;opacity:.34}.hero-content{max-width:100%}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.category-card .cat-pic{height:118px}.benefits{grid-template-columns:1fr}.featured-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.section-title h2{font-size:24px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-actions{flex-direction:row}.footer-brand small{font-size:10px}}@media(max-width:390px){.brand small{display:none}.music-top{min-width:88px}.music-top span{display:none}.hero h1{font-size:52px}.category-card .cat-pic{height:125px}.body{padding:10px}.contact-actions a{font-size:13px}}
.socials svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.socials a{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.05);border:1px solid rgba(145,178,255,.25)}
/* Linha única compacta no telemóvel, inspirada na referência enviada. */
@media(max-width:820px){main,.footer{width:min(980px,calc(100% - 16px))}.category-grid,.featured-grid{display:flex;overflow-x:auto;flex-wrap:nowrap;gap:9px;padding-bottom:5px;scrollbar-width:none}.category-grid::-webkit-scrollbar,.featured-grid::-webkit-scrollbar{display:none}.category-card{flex:0 0 132px}.category-card .cat-pic{height:112px}.featured-grid .card{flex:0 0 174px}.benefits{display:flex;overflow-x:auto;gap:9px;scrollbar-width:none}.benefits::-webkit-scrollbar{display:none}.benefit{flex:0 0 230px;padding:12px}.hero{min-height:310px;padding:24px}.hero h1{font-size:58px}.hero h2{font-size:25px}.hero p{font-size:13px;max-width:430px}.hero-art{opacity:.55;width:50%}.section-title{margin-top:18px}.featured-head{margin-top:20px}}
@media(max-width:600px){.top{width:calc(100% - 12px);padding:7px 8px}.brand img{width:42px;height:42px}.brand strong{font-size:18px}.brand small{font-size:9px}.music-top{height:42px;min-width:96px}.menu-btn{width:42px;height:42px}.hero{min-height:290px;padding:20px;border-radius:25px}.hero h1{font-size:49px;margin-top:15px}.hero h2{font-size:21px}.hero p{font-size:12px}.actions{gap:8px;margin-top:15px}.primary,.secondary{padding:10px 13px;font-size:12px}.category-card{flex-basis:124px}.category-card h3{font-size:12px}.cat-enter{padding:7px;font-size:11px}.benefit{flex-basis:215px}.benefit-icon{width:42px;height:42px}.benefit b{font-size:12px}.benefit p{font-size:10px}.featured-grid .card{flex-basis:168px}.body h3{font-size:12px}.buy{padding:8px}.footer{padding:12px}.footer-main{gap:10px}.contact-actions a{padding:10px 7px;font-size:12px}.socials{justify-content:center}.copyright{text-align:center}}
/* =========================================================
PERFORMANCE — mantém o visual, reduz o custo de renderização
========================================================= */
html{scroll-behavior:auto}
.card,.category-card,.benefit{contain:layout paint style}
.pic,.cat-pic img{display:block;aspect-ratio:1/1;object-fit:cover}
#rain{will-change:opacity;transition:opacity .12s ease}
#rain.rain-paused{opacity:0}
.drawer{will-change:transform}
@media (max-width:700px){
.glass{
backdrop-filter:blur(5px);
-webkit-backdrop-filter:blur(5px);
box-shadow:0 10px 28px rgba(0,0,0,.30),0 0 12px rgba(42,89,255,.07),inset 0 1px rgba(255,255,255,.10);
}
.modal{backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.hero-art{opacity:.45}
#rain{opacity:.42}
}
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
#rain{display:none!important}
}
/* AJUSTES FINAIS — imagens normais + opções de compra */
.pic{width:100%;height:320px;aspect-ratio:auto!important;object-fit:contain;background:rgba(7,16,35,.38)}
.variants{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0 16px}.variant{min-height:68px;border:1px solid rgba(140,175,255,.2);background:rgba(255,255,255,.05);color:#fff;border-radius:16px;padding:11px;text-align:left;display:flex;flex-direction:column;gap:5px}.variant strong{font-size:13px}.variant span{font-size:12px;color:#bfcaff}.variant.active{border-color:rgba(151,103,255,.9);background:linear-gradient(135deg,rgba(53,109,255,.75),rgba(168,77,255,.75));box-shadow:0 7px 20px rgba(82,70,255,.2)}.variant-title{font-size:13px;font-weight:800;margin-top:12px}
@media(max-width:820px){.pic{height:250px}.featured-grid .card{flex-basis:190px}.featured-grid .pic{height:220px}}
@media(max-width:600px){.pic{height:230px}.featured-grid .card{flex:0 0 190px}.featured-grid .pic{height:210px}.variants{grid-template-columns:1fr 1fr}.modal-card{padding:18px}}
@media(max-width:390px){.pic{height:210px}.featured-grid .card{flex-basis:178px}.featured-grid .pic{height:195px}}
/* ================= CONTA / LOGIN ================= */
.top-left{display:flex;align-items:center;gap:10px;min-width:0}
.account-top{height:44px;min-width:98px;padding:5px 12px;border-radius:23px;border:1px solid rgba(129,170,255,.42);background:rgba(5,14,39,.38);color:#fff;display:flex;align-items:center;justify-content:center;gap:7px;box-shadow:inset 0 1px rgba(255,255,255,.1),0 0 18px rgba(70,90,255,.08);font-weight:800;transition:.2s ease}
.account-top:hover{transform:translateY(-1px);border-color:rgba(174,126,255,.75);background:rgba(72,59,145,.25)}
.account-icon{font-size:20px;line-height:1}
.auth-card{width:min(470px,100%);padding:28px;overflow:auto;max-height:90vh}
.auth-brand{text-align:center;margin:2px 0 20px}
.auth-brand .auth-logo{width:62px;height:62px;border-radius:50%;object-fit:cover;border:1px solid rgba(255,255,255,.28);box-shadow:0 0 30px rgba(100,105,255,.35)}
.auth-brand h2{margin:12px 0 5px;font-size:29px}
.auth-brand p{margin:0;color:#aebce0;font-size:13px}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:5px;border-radius:17px;background:rgba(255,255,255,.045);border:1px solid rgba(133,168,255,.15);margin-bottom:18px}
.auth-tabs button{border:0;border-radius:12px;padding:11px;background:transparent;color:#aeb9d9;font-weight:800}
.auth-tabs button.active{color:#fff;background:linear-gradient(100deg,rgba(56,109,255,.95),rgba(166,72,255,.95));box-shadow:0 8px 22px rgba(89,70,255,.22)}
.auth-form{display:grid;gap:12px}
.auth-field{display:grid;gap:6px;color:#cbd6f1;font-size:12px;font-weight:700}
.auth-input-wrap{position:relative}
.auth-input{width:100%;height:49px;padding:0 46px 0 14px;border-radius:16px;border:1px solid rgba(134,169,255,.2);background:rgba(2,8,26,.48);color:#fff;outline:none;box-shadow:inset 0 1px rgba(255,255,255,.05);transition:.2s}
.auth-input:focus{border-color:rgba(137,110,255,.85);box-shadow:0 0 0 3px rgba(106,85,255,.12),inset 0 1px rgba(255,255,255,.08)}
.auth-input::placeholder{color:#7180a3}
.pass-toggle{position:absolute;right:7px;top:7px;width:36px;height:35px;border:0;border-radius:11px;background:rgba(255,255,255,.06);color:#dbe4ff;font-size:17px}
.auth-submit{width:100%;margin-top:3px}
.auth-link{border:0;background:transparent;color:#9fb9ff;padding:5px 0;text-align:right;font-size:12px}
.auth-link:hover{text-decoration:underline}
.auth-message{padding:11px 13px;border-radius:14px;background:rgba(255,255,255,.055);border:1px solid rgba(132,168,255,.14);color:#c9d5f2;font-size:12px;line-height:1.45}
.auth-message.error{border-color:rgba(255,91,126,.35);color:#ffc0cd;background:rgba(255,60,100,.07)}
.auth-message.ok{border-color:rgba(45,225,181,.3);color:#b9ffe9;background:rgba(45,225,181,.07)}
.auth-account-head{display:flex;align-items:center;gap:12px;padding:14px;border-radius:18px;background:rgba(255,255,255,.045);border:1px solid rgba(134,169,255,.15);margin-bottom:14px}
.auth-avatar{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#376eff,#aa4cff);font-weight:900;font-size:20px}
.auth-account-head strong{display:block;font-size:16px}.auth-account-head small{display:block;color:#8e9dbe;margin-top:3px}
.account-actions{display:grid;gap:9px}.account-actions button{width:100%;padding:13px;border-radius:15px;border:1px solid rgba(130,166,255,.22);background:rgba(255,255,255,.045);color:#fff;font-weight:800}.account-actions .logout{background:rgba(255,60,100,.08);border-color:rgba(255,90,125,.22)}
.auth-orders{display:grid;gap:8px;margin-top:14px}.auth-order{padding:12px;border-radius:15px;background:rgba(2,8,27,.38);border:1px solid rgba(123,161,255,.14)}.auth-order b{font-size:13px}.auth-order small{display:block;color:#9aa8c8;line-height:1.5;margin-top:3px}
@media(max-width:600px){
.top-left{gap:6px}.account-top{min-width:44px;width:44px;padding:0}.account-top #accountLabel{display:none}.account-icon{font-size:19px}
.brand{gap:8px}.brand img{width:43px;height:43px}.brand strong{font-size:18px}.brand small{font-size:10px}
.auth-card{padding:22px;border-radius:25px}
}
/* ================= V4 — CONTA / PRODUTOS / CHUVA ================= */
.menu-btn span{background:#fff!important;box-shadow:0 0 7px rgba(255,255,255,.35)}
.pic-btn{display:block;width:100%;padding:0;border:0;background:transparent;border-radius:18px;cursor:zoom-in;overflow:hidden;color:inherit}
.pic-btn:focus-visible{outline:2px solid #8ca8ff;outline-offset:3px}
.pic-btn .pic{transition:transform .22s ease,filter .22s ease}.pic-btn:hover .pic{transform:scale(1.025);filter:brightness(1.06)}
.product-preview{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}.product-preview>img{width:100%;max-height:500px;object-fit:contain;border-radius:22px;background:transparent;padding:4px;border:1px solid rgba(255,255,255,.08)}.preview-price{font-size:24px;font-weight:900;margin:10px 0 14px}
.confirm-mail-card{text-align:center;padding:6px 2px 2px}.confirm-mail-icon{width:70px;height:70px;margin:0 auto 12px;border-radius:22px;display:grid;place-items:center;font-size:31px;background:linear-gradient(135deg,rgba(61,112,255,.32),rgba(171,75,255,.28));border:1px solid rgba(168,190,255,.25);box-shadow:0 12px 35px rgba(55,80,255,.16)}.confirm-mail-card h3{margin:0 0 6px;font-size:21px}.confirm-mail-card p{color:#aebcdf;font-size:12px;line-height:1.55}.confirm-mail-card>strong{display:inline-block;padding:9px 13px;border-radius:13px;background:rgba(255,255,255,.06);border:1px solid rgba(150,178,255,.15);letter-spacing:.2px}.confirm-mail-note{margin:14px 0}.confirm-mail-actions{display:grid;gap:8px}.auth-link-btn{border:1px solid rgba(137,170,255,.18);background:rgba(255,255,255,.045);color:#dce5ff;padding:12px;border-radius:14px;font-weight:800}.signup-rain #rain{display:block!important;opacity:.28}.auth-modal{z-index:110}.auth-modal .auth-card{background:linear-gradient(145deg,rgba(13,25,61,.58),rgba(8,13,35,.62));border:1px solid rgba(188,207,255,.18);box-shadow:0 30px 80px rgba(0,0,0,.55),inset 0 1px rgba(255,255,255,.12);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.orders-panel{margin-top:17px}.orders-tabs{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:5px;border-radius:17px;background:rgba(255,255,255,.04);border:1px solid rgba(130,165,255,.12)}.orders-tabs button{border:0;background:transparent;color:#aebbe0;padding:11px;border-radius:12px;font-weight:800}.orders-tabs button.active{color:#fff;background:linear-gradient(100deg,rgba(55,108,255,.9),rgba(163,74,255,.9))}.orders-tabs span{display:inline-grid;place-items:center;min-width:22px;height:20px;margin-left:4px;border-radius:10px;background:rgba(255,255,255,.12);font-size:10px}.orders-pane{display:grid;gap:9px;margin-top:10px}.hidden-orders{display:none}.auth-order{padding:14px;border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(2,8,26,.38));border:1px solid rgba(129,164,255,.14)}.order-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.order-row b{display:block;font-size:14px}.order-row small{display:block;color:#93a3c8;margin-top:4px}.order-status{white-space:nowrap;font-size:10px;font-weight:900;padding:6px 8px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}.order-status.pending{color:#ffe0a2}.order-status.processing{color:#b8d0ff}.order-status.completed{color:#aaffdf}.order-status.cancelled{color:#ffb7c5}.order-meta{margin-top:10px;color:#9caacc;font-size:11px}.orders-empty{text-align:center;padding:22px 12px;border-radius:17px;background:rgba(255,255,255,.035);border:1px dashed rgba(150,175,235,.15);color:#8f9ebe;font-size:12px}
@media(max-width:600px){.product-preview>img{max-height:330px}.auth-modal .auth-card{backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}.confirm-mail-card{padding-bottom:4px}}
/* Produtos: a peça ocupa mais espaço no card e o fundo do site fica visível atrás. */
.product-image-auto-bg{background:transparent!important}
.product-preview-image{background:transparent!important}
@media(max-width:700px){
.category-card .cat-pic{height:135px}
.pic{aspect-ratio:1/1.02;transform:scale(1.05)}
}
/* Ajuste solicitado: cards de catálogo e Mais vistos em proporção quadrada. */
.pic{width:100%!important;height:auto!important;aspect-ratio:1/1!important;object-fit:contain!important;background:transparent!important;padding:3px!important;transform:scale(1.04)}
.featured-grid .card,.grid .card{overflow:hidden}
.top-viewed-grid .card{position:relative}
.top-viewed-grid .pic-btn{position:relative;aspect-ratio:1/1;display:block}
.top-viewed-grid .top-rank{position:absolute;left:9px;top:9px;z-index:3;padding:6px 9px;border-radius:10px;background:linear-gradient(135deg,#3d70ff,#a54dff);border:1px solid rgba(255,255,255,.45);font-size:10px;font-weight:900;box-shadow:0 5px 15px rgba(65,75,255,.35)}
.top-viewed-grid .view-count{font-size:11px;color:#b9c8ee;margin:0 0 6px}
@media(max-width:820px){.featured-grid .card{flex-basis:190px}.featured-grid .pic-btn{aspect-ratio:1/1}.featured-grid .pic{height:auto!important}}
@media(max-width:600px){.featured-grid .card{flex-basis:190px}.featured-grid .pic{height:auto!important;aspect-ratio:1/1!important}}
@media(max-width:390px){.featured-grid .card{flex-basis:178px}.featured-grid .pic{height:auto!important;aspect-ratio:1/1!important}}
/* Ajuste visual do catálogo: imagem mais larga, preenchendo o retângulo e cortando suavemente nos cantos.
A seção Mais vistos não é alterada por estas regras. */
.category-card .cat-pic{
height:auto !important;
aspect-ratio:1.18 / 1 !important;
border-radius:18px !important;
overflow:hidden !important;
}
.category-card .cat-pic img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:center !important;
padding:0 !important;
display:block !important;
}
@media(max-width:820px){
.category-card .cat-pic{
height:auto !important;
aspect-ratio:1.18 / 1 !important;
}
}
@media(max-width:600px){
.category-card .cat-pic{
height:auto !important;
aspect-ratio:1.18 / 1 !important;
}
}
/* Ajuste final solicitado: catálogo ligeiramente maior, sem alterar Mais vistos. */
@media(min-width:821px){
.category-card .cat-pic{aspect-ratio:1.24 / 1 !important;}
}
@media(max-width:820px){
.category-card{flex-basis:145px !important;}
.category-card .cat-pic{aspect-ratio:1.24 / 1 !important;}
}
@media(max-width:600px){
.category-card{flex-basis:142px !important;}
.category-card .cat-pic{aspect-ratio:1.24 / 1 !important;}
}
@media(max-width:390px){
.category-card{flex-basis:138px !important;}
}
/* Aviso obrigatório de entrega — etapa que o cliente deve confirmar antes dos dados */
.modal.mandatory-notice .close{display:none}
.mandatory-notice-card{border-color:rgba(255,255,255,.22);box-shadow:0 24px 80px rgba(0,0,0,.62),0 0 38px rgba(94,96,255,.16),inset 0 1px rgba(255,255,255,.12)}
.delivery-notice{text-align:center;padding:6px 2px 2px}
.delivery-notice-icon{width:70px;height:70px;margin:2px auto 10px;border-radius:22px;display:grid;place-items:center;font-size:32px;background:linear-gradient(145deg,rgba(255,55,76,.18),rgba(120,54,255,.16));border:1px solid rgba(255,115,130,.35);box-shadow:0 12px 34px rgba(255,55,76,.12),inset 0 1px rgba(255,255,255,.12)}
.delivery-notice-kicker{font-size:11px;letter-spacing:1.6px;font-weight:900;color:#ff9eaa;margin-bottom:5px}
.delivery-notice h2{margin:0 0 9px;font-size:27px}
.delivery-lead{margin:0 auto 17px;max-width:470px;color:#d4dcf4;font-size:13px;line-height:1.65}
.delivery-lead strong{color:#fff}
.delivery-cost-banner{display:flex;align-items:center;gap:11px;text-align:left;margin:0 auto 14px;padding:13px 14px;border-radius:18px;background:linear-gradient(135deg,rgba(255,63,83,.13),rgba(156,76,255,.12));border:1px solid rgba(255,116,132,.34);box-shadow:0 10px 28px rgba(0,0,0,.16),inset 0 1px rgba(255,255,255,.08)}
.delivery-cost-banner>span{width:42px;height:42px;flex:none;border-radius:13px;display:grid;place-items:center;background:rgba(255,65,85,.13);border:1px solid rgba(255,120,135,.3);font-size:21px}
.delivery-cost-banner strong{display:block;color:#fff;font-size:12px;letter-spacing:.5px}
.delivery-cost-banner small{display:block;margin-top:4px;color:#c7d1ea;font-size:11px;line-height:1.5}
.delivery-cost-banner small b{color:#fff}
.delivery-rates{display:grid;gap:9px;text-align:left;margin:0 0 12px}
.delivery-rate{display:flex;align-items:center;gap:11px;padding:12px 13px;border-radius:17px;background:rgba(255,255,255,.055);border:1px solid rgba(148,176,255,.18);box-shadow:inset 0 1px rgba(255,255,255,.05)}
.delivery-rate>span{width:38px;height:38px;flex:none;border-radius:12px;display:grid;place-items:center;background:rgba(79,111,255,.15);border:1px solid rgba(145,171,255,.2);font-size:18px}
.delivery-rate strong{display:block;font-size:13px;color:#fff}
.delivery-rate small{display:block;margin-top:3px;color:#aebbd9;font-size:11px;line-height:1.4}
.delivery-rate b{color:#dce4ff}
.delivery-note{text-align:left;margin:0 0 14px;padding:11px 12px;border-radius:15px;background:rgba(255,255,255,.045);border:1px solid rgba(150,178,255,.13);color:#aebbd8;font-size:11px;line-height:1.55}
.delivery-note strong{color:#dbe5ff}
.delivery-continue{margin-top:2px}
@media(max-width:600px){.delivery-notice h2{font-size:24px}.delivery-rate{padding:11px}.delivery-notice-icon{width:64px;height:64px}.delivery-lead{font-size:12px}}
/* =========================================================
TIPOGRAFIA WR.PROD'S — hierarquia visual segura
Os exemplos enviados representam estilos Unicode. Como ainda não
existem ficheiros .ttf/.otf anexados, usamos equivalentes CSS para
não substituir o texto por caracteres especiais e não quebrar o site.
========================================================= */
:root{--font-grande:"Arial Black","Trebuchet MS",sans-serif;--font-media:"Georgia","Times New Roman",serif;--font-pequena:"Courier New",monospace}
.brand strong,.drawer-brand b,h1,h2,h3,.hero-title,.section-title,.category-card h3,.product-title,.ai-chat-head h3{font-family:var(--font-grande)}
button,.cat-enter,.music-top,.menu-btn,.nav button,.section-tabs,.ai-type-btn,.ai-type-confirm{font-family:var(--font-media)}
p,.hero-subtitle,.category-card p,.product-desc,.footer small,.footer .copyright,.ai-chat-head p,.ai-msg,.ai-future-note,.drawer button span{font-family:var(--font-pequena)}
/* =========================================================
CRIADOR IA — botão flutuante + chat preparado para Worker/FLUX
Ajuste mobile estilo WhatsApp: composer fica junto ao teclado.
A animação fica SOMENTE no botão flutuante.
========================================================= */
.ai-creator{position:fixed;right:16px;bottom:86px;z-index:1200;font-family:inherit}
.ai-float-btn{position:relative;isolation:isolate;display:flex;align-items:center;gap:9px;border:0;border-radius:999px;padding:11px 16px;background:linear-gradient(135deg,#5d35e8,#7b2cff,#3c57ff);color:#fff;box-shadow:0 14px 42px rgba(0,0,0,.42),0 0 30px rgba(126,72,255,.38),inset 0 1px rgba(255,255,255,.18);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);font-weight:900;cursor:pointer;transition:opacity .35s,transform .35s,filter .25s;overflow:hidden}
.ai-float-btn:before{content:"";position:absolute;inset:-2px;border-radius:inherit;padding:2px;background:conic-gradient(from 0deg,#7b2cff,#238cff,#ff2f70,#a84dff,#7b2cff);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;mask-composite:exclude;animation:aiFloatColor 3.6s linear infinite;pointer-events:none;z-index:-1}
.ai-float-btn:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,rgba(255,255,255,.06),rgba(190,80,255,.2),rgba(55,135,255,.2),rgba(255,50,100,.16));background-size:260% 260%;animation:aiFloatGlow 4s ease-in-out infinite;pointer-events:none;z-index:-1}
.ai-float-btn:hover{filter:brightness(1.12);transform:translateY(-2px)}
.ai-float-icon{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#9c5cff,#5e6dff,#ff477c);background-size:220% 220%;box-shadow:0 0 18px rgba(151,86,255,.55);font-size:16px;animation:aiIconColors 3s ease-in-out infinite}
.ai-float-text{font-size:12px;letter-spacing:.2px}
.ai-creator.ai-idle .ai-float-btn{opacity:0;transform:translateY(14px) scale(.92);pointer-events:none}
.ai-chat-panel{position:fixed;right:14px;bottom:78px;width:min(620px,calc(100vw - 28px));height:min(86vh,760px);display:flex;flex-direction:column;overflow:hidden;border:1px solid rgba(190,180,255,.34);border-radius:30px;background:linear-gradient(145deg,rgba(3,7,18,.97),rgba(9,10,24,.97));box-shadow:0 28px 100px rgba(0,0,0,.7),inset 0 1px rgba(255,255,255,.1);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);opacity:0;visibility:hidden;transform:translateY(18px) scale(.96);transform-origin:bottom right;transition:.25s ease}
.ai-chat-panel.open{opacity:1;visibility:visible;transform:none}
.ai-chat-head{display:flex;justify-content:space-between;gap:12px;padding:17px 17px 13px;border-bottom:1px solid rgba(255,255,255,.08)}
.ai-chat-head h3{margin:6px 0 3px;font-size:17px}.ai-chat-head p{margin:0;color:#aebbd8;font-size:11px;line-height:1.4}.ai-chat-badge{font-size:10px;font-weight:900;letter-spacing:1px;color:#ddd8ff}
.ai-close{width:34px;height:34px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.05);color:#fff;font-size:22px;cursor:pointer;flex:none}
.ai-chat-messages{flex:1;min-height:0;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px}.ai-msg{display:flex;align-items:flex-start;gap:8px;max-width:90%;font-size:12px;line-height:1.5}.ai-msg span{width:28px;height:28px;display:grid;place-items:center;border-radius:10px;background:rgba(124,103,255,.14);flex:none}.ai-msg div{padding:10px 12px;border-radius:15px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07);color:#dce4fa}.ai-msg-user{margin-left:auto;flex-direction:row-reverse}.ai-msg-user div{background:rgba(100,92,220,.2)}
.ai-image-preview{margin:0 13px 8px;padding:8px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.04)}.ai-image-preview img{display:block;width:100%;max-height:150px;object-fit:cover;border-radius:10px}.ai-image-preview button{margin-top:6px;border:0;background:none;color:#bfc9ff;font-size:10px;cursor:pointer}
.ai-type-chooser{position:absolute;inset:0;z-index:20;display:flex;align-items:flex-end;justify-content:center;padding:16px;visibility:hidden;opacity:0;pointer-events:none;background:rgba(0,0,0,.28);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);transition:.2s ease}.ai-type-chooser.show{visibility:visible;opacity:1;pointer-events:auto}.ai-type-sheet{width:min(430px,100%);padding:15px;border:1px solid rgba(188,174,255,.2);border-radius:22px;background:rgba(4,5,14,.9);box-shadow:0 18px 55px rgba(0,0,0,.55),inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}.ai-type-title{margin:0 0 10px;text-align:center;color:#eef1ff;font-size:12px;font-weight:900}.ai-type-options{display:flex;gap:9px}.ai-type-btn{flex:1;min-height:48px;border:1px solid rgba(139,159,255,.24);border-radius:15px;background:rgba(255,255,255,.045);color:#eef1ff;font:inherit;font-size:12px;font-weight:900;cursor:pointer;transition:.2s}.ai-type-btn.selected{background:linear-gradient(135deg,rgba(126,80,255,.88),rgba(171,93,255,.9));border-color:rgba(219,202,255,.9);box-shadow:0 0 22px rgba(145,91,255,.28)}.ai-type-confirm{width:100%;margin-top:9px;min-height:44px;border:1px solid rgba(139,159,255,.16);border-radius:14px;background:rgba(255,255,255,.06);color:#66708d;font:inherit;font-size:12px;font-weight:900;cursor:not-allowed;transition:.2s}.ai-type-confirm.ready{background:linear-gradient(135deg,#9b68ff,#b478ff);border-color:rgba(226,213,255,.9);color:#fff;cursor:pointer;box-shadow:0 0 24px rgba(155,104,255,.28)}
.ai-confirm-actions{display:none!important}
.ai-chat-compose{display:flex;align-items:flex-end;gap:7px;padding:10px;flex:none;border-top:1px solid rgba(255,255,255,.1);background:#02040a;padding-bottom:max(10px,env(safe-area-inset-bottom))}.ai-chat-compose textarea{flex:1;resize:none;max-height:92px;border:1px solid rgba(139,159,255,.28);border-radius:18px;padding:10px 11px;background:#000;color:#fff;outline:none;font:inherit;font-size:12px;font-weight:700}.ai-chat-compose textarea::placeholder{color:#8491b1}.ai-attach,.ai-send{width:39px;height:39px;display:grid;place-items:center;border-radius:13px;cursor:pointer;flex:none}.ai-attach{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.045);font-size:16px}.ai-send{border:1px solid rgba(180,166,255,.35);background:linear-gradient(135deg,#6658d9,#44378f);color:#fff;font-size:16px}
.ai-future-note{padding:7px 12px 9px;color:#8795b5;font-size:9px;line-height:1.45;flex:none;background:#02040a}.ai-future-note b{color:#b9c4e5}
@keyframes aiFloatColor{to{transform:rotate(360deg)}}
@keyframes aiFloatGlow{0%,100%{background-position:0% 50%;opacity:.72}50%{background-position:100% 50%;opacity:1}}
@keyframes aiIconColors{0%,100%{filter:hue-rotate(0deg);transform:scale(1)}50%{filter:hue-rotate(55deg);transform:scale(1.04)}}
@media(max-width:600px){
.ai-creator{right:10px;bottom:76px}
.ai-chat-panel{position:fixed;inset:0;width:100vw;height:var(--ai-vvh,100dvh);max-height:none;border-radius:0;border:0;transform:translateY(12px);background:linear-gradient(180deg,rgba(3,7,18,.99),rgba(5,7,18,.99));box-shadow:none}
.ai-chat-panel.open{transform:none}
.ai-chat-head{padding:14px 14px 11px;flex:none}.ai-chat-head h3{font-size:16px}.ai-chat-head p{font-size:10px}
.ai-chat-messages{padding:11px;gap:8px}
.ai-type-choices{padding:7px 10px 5px}
.ai-float-btn{padding:10px 13px;border-radius:22px}.ai-float-text{font-size:11px}
.ai-chat-compose{padding:7px 9px;padding-bottom:max(7px,env(safe-area-inset-bottom))}
.ai-chat-compose textarea{font-size:12px;min-height:40px}
}
@media(min-width:601px){.ai-chat-panel{right:14px;bottom:78px}}