/* Vitrine editorial e interação com peças reais do catálogo */
html{scroll-padding-top:calc(var(--u)*84)}
button{touch-action:manipulation}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #b9c874;outline-offset:3px}
.hero-content .eyebrow{animation:riseIn .8s .1s both}
.hero h1{animation:riseIn .9s .18s both}
.hero-content>p{animation:riseIn .9s .34s both}
.hero-ctas{animation:riseIn .9s .48s both}
.hero-bottom span:last-child{animation:softBounce 2.5s infinite}
@keyframes riseIn{from{opacity:0;transform:translateY(calc(var(--u)*23))}to{opacity:1;transform:translateY(0)}}
@keyframes softBounce{50%{transform:translateY(calc(var(--u)*-6))}}
.button{position:relative;overflow:hidden}
.button:before{content:"";position:absolute;inset:0 auto 0 -55%;width:38%;background:linear-gradient(90deg,transparent,#ffffff48,transparent);transform:skewX(-22deg);transition:left .55s}
.button:hover:before{left:130%}
.cart-trigger.bump{animation:cartBump .4s ease}
@keyframes cartBump{50%{transform:scale(1.15)}}
.showcase{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);min-height:calc(var(--u)*760);background:#f0ede3}
.showcase-stage{background:#20392d;color:white;position:relative;min-height:calc(var(--u)*760);display:flex;flex-direction:column;overflow:hidden}
.showcase-stage-top,.stage-image-bottom{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:calc(var(--u)*31) calc(var(--u)*42);font-size:calc(var(--u)*10);letter-spacing:.16em;color:#e6eadf}
.showcase-stage-top{border-bottom:1px solid #ffffff35}
.stage-image-button{flex:1;border:0;padding:0;background:#24382e;display:block;position:relative;overflow:hidden}
.stage-image-button img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.stage-image-button:hover img{transform:scale(1.045)}
.stage-image-button img.image-enter{animation:photoIn .5s both}
@keyframes photoIn{from{opacity:.25;transform:scale(1.055)}to{opacity:1;transform:scale(1)}}
.stage-image-button:after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(0deg,#07180c65,transparent);pointer-events:none}
.stage-image-bottom{padding-top:calc(var(--u)*18);padding-bottom:calc(var(--u)*18);background:#20392d}
.stage-image-bottom div{display:flex;gap:calc(var(--u)*8)}
.stage-image-bottom button{width:calc(var(--u)*41);height:calc(var(--u)*41);border:1px solid #a6b6a28c;border-radius:50%;background:transparent;color:white;font-size:calc(var(--u)*17);transition:background .2s,transform .2s}
.stage-image-bottom button:hover{background:#e4ecd2;color:#17362b;transform:translateY(-2px)}
.showcase-controls{padding:calc(var(--u)*68) calc(var(--u)*66) calc(var(--u)*48);min-width:0}
.showcase-controls h2{font-size:calc(var(--u)*56);line-height:1.08;letter-spacing:-.045em;margin:0 0 calc(var(--u)*16)}
.showcase-controls h2 em{color:var(--olive)}
.showcase-lead{font-size:calc(var(--u)*14);line-height:1.7;color:#657167;max-width:calc(var(--u)*490);margin-bottom:calc(var(--u)*32)}
.showcase-step{border-top:1px solid #c9d0c4;padding:calc(var(--u)*18) 0 calc(var(--u)*22)}
.step-heading{display:flex;align-items:baseline;gap:calc(var(--u)*15)}
.step-heading>span{font-size:calc(var(--u)*10);color:var(--olive);font-weight:700;letter-spacing:.1em}
.step-heading h3{font-family:'DM Sans',sans-serif;font-size:calc(var(--u)*15);font-weight:700;margin:0 0 calc(var(--u)*14)}
.showcase-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(var(--u)*7)}
.showcase-option{background:#faf9f3;border:1px solid #d6d9cf;padding:calc(var(--u)*5);text-align:left;color:var(--ink);min-width:0;transition:transform .2s,box-shadow .2s,border-color .2s}
.showcase-option:hover{transform:translateY(-4px);box-shadow:0 9px 20px #1236231b}
.showcase-option.selected{border:2px solid var(--green);box-shadow:0 0 0 3px #456c4430}
.showcase-option img{height:calc(var(--u)*76);object-fit:cover;margin-bottom:calc(var(--u)*7)}
.showcase-option span{display:block;font-size:calc(var(--u)*10);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.showcase-option small{display:block;font-size:calc(var(--u)*10);color:#667465;margin-top:calc(var(--u)*4)}
.showcase-quantity{display:flex;align-items:center;gap:calc(var(--u)*18)}
.showcase-quantity button{width:calc(var(--u)*38);height:calc(var(--u)*38);background:#f9f8f2;border:1px solid #cbd3c8;border-radius:50%;font-size:calc(var(--u)*18);color:var(--green);transition:background .2s,color .2s}
.showcase-quantity button:hover{background:var(--green);color:#fff}
.showcase-quantity span{font-size:calc(var(--u)*18);font-weight:700;min-width:calc(var(--u)*18);text-align:center}
.showcase-summary{display:flex;justify-content:space-between;gap:calc(var(--u)*25);align-items:end;border-top:1px solid #c9d0c4;padding-top:calc(var(--u)*19)}
.showcase-summary small{display:block;letter-spacing:.14em;color:var(--olive);font-size:calc(var(--u)*10);margin-bottom:calc(var(--u)*8)}
.showcase-summary strong{display:block;font-family:'Playfair Display',serif;font-weight:400;font-size:calc(var(--u)*24)}
.showcase-summary span{display:block;font-size:calc(var(--u)*11);color:#687469;margin-top:calc(var(--u)*5)}
.showcase-price{font-family:'Playfair Display',serif;font-size:calc(var(--u)*26);white-space:nowrap}
.showcase-actions{display:flex;align-items:center;gap:calc(var(--u)*22);margin-top:calc(var(--u)*25)}
.showcase-actions .button{min-width:calc(var(--u)*235)}
.showcase-fine{font-size:calc(var(--u)*10);color:#7b8379;margin:calc(var(--u)*20) 0 0}
.catalog-section{padding-top:calc(var(--u)*112)}
.catalog-tools{display:flex;justify-content:space-between;gap:calc(var(--u)*20);margin-top:calc(var(--u)*32)}
.catalog-tools label{font-size:calc(var(--u)*11);letter-spacing:.08em;font-weight:700;color:#617064;display:flex;flex-direction:column;gap:calc(var(--u)*8)}
.catalog-search{width:min(calc(var(--u)*480),100%)}
.catalog-sort{width:calc(var(--u)*220)}
.catalog-tools input,.catalog-tools select{height:calc(var(--u)*48);border:1px solid #c9d0c4;background:#faf9f4;color:var(--ink);padding:0 calc(var(--u)*15);border-radius:0;font-size:calc(var(--u)*13);width:100%;outline-offset:1px}
.catalog-tools input:focus,.catalog-tools select:focus{border-color:var(--green)}
.filters{margin-top:calc(var(--u)*15);margin-bottom:calc(var(--u)*10)}
.catalog-count{text-align:right;color:#677468;font-size:calc(var(--u)*12);margin:0 0 calc(var(--u)*20)}
.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--u)*42) calc(var(--u)*24)}
.product-card{background:#fbfaf5;padding-bottom:calc(var(--u)*12);box-shadow:0 1px 0 #c9d0c440;transition:transform .3s,box-shadow .3s;min-width:0}
.product-card:hover{transform:translateY(calc(var(--u)*-6));box-shadow:0 18px 40px #28462b19}
.product-visual{width:100%;height:calc(var(--u)*370);display:block;position:relative;overflow:hidden;border:0;padding:0;background:#e4e5d9;text-align:left}
.product-visual img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.product-card:hover .product-visual img{transform:scale(1.075)}
.product-badge{background:#f9f8f1;z-index:2}
.product-zoom{position:absolute;right:calc(var(--u)*15);bottom:calc(var(--u)*15);background:#f7f3e9;color:var(--green);padding:calc(var(--u)*10) calc(var(--u)*13);font-size:calc(var(--u)*11);font-weight:700;transform:translateY(calc(var(--u)*55));opacity:0;transition:transform .25s,opacity .25s}
.product-card:hover .product-zoom,.product-visual:focus-visible .product-zoom{transform:translateY(0);opacity:1}
.product-detail{display:block;padding:calc(var(--u)*20) calc(var(--u)*17) calc(var(--u)*8)}
.product-number{display:block;color:var(--olive);font-size:calc(var(--u)*10);letter-spacing:.16em;margin-bottom:calc(var(--u)*12)}
.product-title-row{display:flex;justify-content:space-between;gap:calc(var(--u)*10);align-items:baseline}
.product-title-row h3{font-family:'Playfair Display',serif;font-weight:500;font-size:calc(var(--u)*24);line-height:1.2;margin:0}
.product-title-row strong{font-size:calc(var(--u)*13);white-space:nowrap}
.product-detail>p{font-size:calc(var(--u)*12);min-height:calc(var(--u)*35);margin:calc(var(--u)*10) 0;color:#657066;line-height:1.5}
.product-actions{display:flex;padding:0 calc(var(--u)*17);gap:calc(var(--u)*9)}
.product-view{flex:1;text-align:left;border:1px solid #aeb9aa;background:transparent;color:var(--green);padding:calc(var(--u)*11);display:flex;justify-content:space-between;font-size:calc(var(--u)*12);font-weight:700;transition:background .2s,color .2s}
.product-view:hover{background:var(--green);color:#fff}
.product-add{margin:0;width:calc(var(--u)*42);flex:0 0 calc(var(--u)*42);padding:0;display:grid;place-items:center;background:var(--green);color:white;border:1px solid var(--green);font-size:calc(var(--u)*22)}
.product-add:hover{background:#2e5840}
.catalog-empty{grid-column:1/-1;padding:calc(var(--u)*60);text-align:center;background:#edf0e7;color:#59695c}
.product-modal{padding:0;border:0;background:#f7f3e9;color:var(--ink);width:min(calc(var(--u)*930),92vw);max-width:none;max-height:90vh;box-shadow:0 24px 100px #00160a70;overflow:auto}
.product-modal::backdrop{background:#06180dc9;backdrop-filter:blur(5px)}
.product-modal[open]{display:grid;grid-template-columns:1fr 1fr;animation:modalIn .28s both}
@keyframes modalIn{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.modal-close{position:absolute;right:calc(var(--u)*20);top:calc(var(--u)*16);z-index:3;width:calc(var(--u)*34);height:calc(var(--u)*34);border:0;border-radius:50%;background:#f7f3e9;font-size:calc(var(--u)*26);color:var(--green)}
.modal-photo{min-height:calc(var(--u)*580);background:#e0e5dc}
.modal-photo img{height:100%;width:100%;object-fit:cover}
.modal-info{padding:calc(var(--u)*70) calc(var(--u)*55);align-self:center}
.modal-info h2{font-size:calc(var(--u)*53);line-height:1.1;margin-bottom:calc(var(--u)*20)}
.modal-info>p{font-size:calc(var(--u)*15);line-height:1.7;color:#5d695f;margin-bottom:calc(var(--u)*34)}
.modal-meta,.modal-total{border-top:1px solid var(--line);padding:calc(var(--u)*20) 0;display:flex;justify-content:space-between;align-items:center;gap:calc(var(--u)*12)}
.modal-meta span,.modal-total small{font-size:calc(var(--u)*10);letter-spacing:.13em;color:var(--olive);font-weight:700}
.modal-meta strong{font-size:calc(var(--u)*13)}
.modal-total strong{font-family:'Playfair Display',serif;font-size:calc(var(--u)*27);font-weight:400}
.modal-actions{display:flex;flex-direction:column;align-items:start;gap:calc(var(--u)*20);margin-top:calc(var(--u)*20)}
.modal-actions .button{width:100%}
.modal-note{display:block;color:#6f7a6f;font-size:calc(var(--u)*11);line-height:1.5;margin-top:calc(var(--u)*30)}
.reveal{opacity:0;transform:translateY(calc(var(--u)*38));transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--delay,0ms)}
.reveal.is-visible{opacity:1;transform:translateY(0)}
@media(max-width:999px){.showcase{min-height:0}.showcase-stage{min-height:calc(var(--u)*780)}.showcase-controls{padding:calc(var(--u)*45) calc(var(--u)*35)}.showcase-controls h2{font-size:calc(var(--u)*46)}.showcase-options{grid-template-columns:repeat(2,1fr)}.showcase-option img{height:calc(var(--u)*64)}.product-visual{height:calc(var(--u)*310)}.product-title-row{display:block}.product-title-row strong{display:block;margin-top:calc(var(--u)*7)}.product-modal{width:94vw}.modal-info{padding:calc(var(--u)*55) calc(var(--u)*35)}}
@media(max-width:639px){html{scroll-padding-top:calc(var(--u)*66)}.showcase{display:flex;flex-direction:column}.showcase-stage{min-height:0;height:calc(var(--u)*460)}.showcase-stage-top,.stage-image-bottom{padding:calc(var(--u)*14) calc(var(--u)*20);font-size:calc(var(--u)*9)}.stage-image-bottom button{width:calc(var(--u)*35);height:calc(var(--u)*35);font-size:calc(var(--u)*15)}.showcase-controls{padding:calc(var(--u)*55) calc(var(--u)*24) calc(var(--u)*60)}.showcase-controls h2{font-size:calc(var(--u)*40)}.showcase-lead{font-size:calc(var(--u)*13);margin-bottom:calc(var(--u)*30)}.showcase-step{padding:calc(var(--u)*18) 0}.step-heading h3{font-size:calc(var(--u)*14)}.showcase-options{grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(var(--u)*5)}.showcase-option{padding:calc(var(--u)*3)}.showcase-option img{height:calc(var(--u)*63)}.showcase-option span,.showcase-option small{font-size:calc(var(--u)*8)}.showcase-summary strong{font-size:calc(var(--u)*21)}.showcase-price{font-size:calc(var(--u)*21)}.showcase-actions{display:flex;flex-direction:column;align-items:stretch;gap:calc(var(--u)*18)}.showcase-actions .button{width:100%;min-width:0}.showcase-actions .under-link{align-self:flex-start}.showcase-fine{font-size:calc(var(--u)*10)}.catalog-section{padding-top:calc(var(--u)*85)}.catalog-tools{gap:calc(var(--u)*10);margin-top:calc(var(--u)*18)}.catalog-search{width:60%}.catalog-sort{width:40%}.catalog-tools label{font-size:calc(var(--u)*10)}.catalog-tools input,.catalog-tools select{height:calc(var(--u)*42);padding:0 calc(var(--u)*8);font-size:calc(var(--u)*11)}.catalog-count{font-size:calc(var(--u)*10);margin-bottom:calc(var(--u)*16)}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--u)*18) calc(var(--u)*10)}.product-card{padding-bottom:calc(var(--u)*9)}.product-card:hover{transform:none}.product-visual{height:calc(var(--u)*210)}.product-zoom{display:none}.product-detail{padding:calc(var(--u)*12) calc(var(--u)*8) calc(var(--u)*7)}.product-number{font-size:calc(var(--u)*8);margin-bottom:calc(var(--u)*7)}.product-title-row h3{font-size:calc(var(--u)*16)}.product-title-row strong{font-size:calc(var(--u)*11);margin-top:calc(var(--u)*5)}.product-detail>p{font-size:calc(var(--u)*10);min-height:calc(var(--u)*45);height:auto;margin:calc(var(--u)*8) 0}.product-actions{padding:0 calc(var(--u)*8);gap:calc(var(--u)*5)}.product-view{font-size:calc(var(--u)*9);padding:calc(var(--u)*8)}.product-add{width:calc(var(--u)*31);flex-basis:calc(var(--u)*31);font-size:calc(var(--u)*17)}.product-modal{width:100vw;max-height:100dvh;height:100dvh}.product-modal[open]{display:block}.modal-photo{height:calc(var(--u)*395);min-height:0}.modal-info{padding:calc(var(--u)*30) calc(var(--u)*25) calc(var(--u)*70)}.modal-info h2{font-size:calc(var(--u)*36)}.modal-info>p{font-size:calc(var(--u)*13);margin-bottom:calc(var(--u)*25)}.modal-meta,.modal-total{padding:calc(var(--u)*14) 0}.modal-meta span,.modal-total small{font-size:calc(var(--u)*9)}.modal-total strong{font-size:calc(var(--u)*23)}.modal-actions .button{width:100%}.modal-close{right:calc(var(--u)*15);top:calc(var(--u)*15);width:calc(var(--u)*35);height:calc(var(--u)*35);font-size:calc(var(--u)*26)}.reveal{transform:translateY(calc(var(--u)*22))}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}

/* Monte seu canto: composição de fotos reais, com controles à direita */
.composition{display:grid;grid-template-columns:1fr 1fr;background:var(--green);color:#f7f4e9;min-height:calc(var(--u)*800)}
.composition-stage{min-width:0;display:flex;flex-direction:column;background:radial-gradient(circle at 48% 49%,#42634b 0,#274637 38%,#17362b 73%);position:relative;overflow:hidden}
.composition-stage:before{content:"";position:absolute;width:calc(var(--u)*610);height:calc(var(--u)*610);border:1px solid #dbe8ce20;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%)}
.composition-stage:after{content:"";position:absolute;width:calc(var(--u)*410);height:calc(var(--u)*410);border:1px solid #dbe8ce20;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%)}
.composition-stage-top,.composition-stage-bottom{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:calc(var(--u)*20);padding:calc(var(--u)*32) calc(var(--u)*45);font-size:calc(var(--u)*10);letter-spacing:.16em;color:#d6e4cd}
.composition-stage-bottom{font-size:calc(var(--u)*12);letter-spacing:0;color:#d7e5d2}
.composition-stage-bottom span:last-child{font-size:calc(var(--u)*34)}
.composition-canvas{flex:1;position:relative;z-index:2;min-height:calc(var(--u)*590)}
.composition-art{width:100%;height:100%;position:relative}
.composition-glow{position:absolute;left:50%;top:50%;width:calc(var(--u)*490);height:calc(var(--u)*340);transform:translate(-50%,-50%);background:#afc59629;filter:blur(55px);border-radius:50%}
.composition-piece,.composition-placeholder{position:absolute;width:calc(var(--u)*245);height:calc(var(--u)*315);background:#f6f2e7;padding:calc(var(--u)*9);border:0;color:var(--ink);box-shadow:0 20px 45px #081d12a6;transition:transform .35s,box-shadow .35s;animation:pieceIn .55s both}
.composition-piece img{width:100%;height:calc(var(--u)*260);object-fit:cover}
.composition-piece span{display:block;font-family:'Playfair Display',serif;font-size:calc(var(--u)*16);padding-top:calc(var(--u)*9);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}
.composition-piece:hover{box-shadow:0 30px 60px #071a10d0;z-index:10}
.composition-piece.piece-1,.composition-placeholder.placeholder-1{top:13%;left:17%;transform:rotate(-9deg)}
.composition-piece.piece-2,.composition-placeholder.placeholder-2{top:25%;right:13%;transform:rotate(10deg)}
.composition-piece.piece-3,.composition-placeholder.placeholder-3{top:37%;left:35%;transform:rotate(-2deg)}
.composition-piece.piece-1:hover{transform:rotate(-4deg) translateY(-10px)}
.composition-piece.piece-2:hover{transform:rotate(5deg) translateY(-10px)}
.composition-piece.piece-3:hover{transform:rotate(0) translateY(-10px)}
.composition-placeholder{background:#ffffff0a;border:1px dashed #ebf3df70;box-shadow:none;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#d9e4d1}
.composition-art:has(.composition-piece) .composition-placeholder,.composition-placeholder:not(.placeholder-1){display:none}
.composition-placeholder span{font-size:calc(var(--u)*42)}
.composition-placeholder small{font-size:calc(var(--u)*11);letter-spacing:.07em}
@keyframes pieceIn{from{opacity:0;scale:.85}to{opacity:1;scale:1}}
.composition-controls{padding:calc(var(--u)*80) calc(var(--u)*78) calc(var(--u)*65);min-width:0}
.composition-controls h2{font-size:calc(var(--u)*62);line-height:1.08;letter-spacing:-.04em;margin:0 0 calc(var(--u)*20)}
.composition-controls h2 em{color:#d8d9ac}
.composition-controls>p:not(.composition-note){font-size:calc(var(--u)*14);color:#d5dfd2;line-height:1.75;max-width:calc(var(--u)*470);margin-bottom:calc(var(--u)*27)}
.composition-options{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*7)}
.composition-option{display:flex;align-items:center;gap:calc(var(--u)*10);background:#ffffff12;border:1px solid #d3e0cd30;padding:calc(var(--u)*7);min-width:0;transition:background .2s,transform .2s}
.composition-option:hover{background:#ffffff21;transform:translateY(-2px)}
.composition-option.selected{border-color:#d9e4b2a3;background:#d3e3c01f}
.composition-option img{width:calc(var(--u)*48);height:calc(var(--u)*48);object-fit:cover;flex:none}
.composition-option>div{min-width:0;flex:1}
.composition-option strong{font-size:calc(var(--u)*11);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.composition-option small{font-size:calc(var(--u)*10);color:#c9d8c4;display:block;margin-top:calc(var(--u)*4)}
.composition-option button{width:calc(var(--u)*28);height:calc(var(--u)*28);flex:none;background:#d7e0be;color:var(--green);border:0;border-radius:50%;font-size:calc(var(--u)*18);line-height:1}
.composition-option button:disabled{opacity:.3;cursor:not-allowed}
.composition-summary{display:flex;justify-content:space-between;gap:calc(var(--u)*20);border-top:1px solid #d3e0cd55;padding-top:calc(var(--u)*20);margin-top:calc(var(--u)*24)}
.composition-summary small{display:block;font-size:calc(var(--u)*10);letter-spacing:.13em;color:#bbccb6;margin-bottom:calc(var(--u)*9)}
.composition-summary strong{font-family:'Playfair Display',serif;font-weight:400;font-size:calc(var(--u)*22)}
.composition-note{font-size:calc(var(--u)*11);color:#bacdb8;line-height:1.5;min-height:calc(var(--u)*20);margin:calc(var(--u)*16) 0}
.composition-actions{display:flex;align-items:center;gap:calc(var(--u)*20)}
.composition-actions .button{flex:1}
.composition-actions .button:disabled{opacity:.45;cursor:not-allowed}
.composition-reset{background:none;border:0;color:#d7e3d3;text-decoration:underline;text-underline-offset:5px;font-size:calc(var(--u)*12);white-space:nowrap}
@media(max-width:999px){.composition-stage{min-height:calc(var(--u)*780)}.composition-controls{padding:calc(var(--u)*65) calc(var(--u)*40)}.composition-controls h2{font-size:calc(var(--u)*49)}.composition-piece,.composition-placeholder{width:calc(var(--u)*195);height:calc(var(--u)*255)}.composition-piece img{height:calc(var(--u)*210)}.composition-canvas{min-height:calc(var(--u)*550)}.composition-option img{width:calc(var(--u)*39);height:calc(var(--u)*39)}}
@media(max-width:639px){.composition{display:flex;flex-direction:column}.composition-stage{min-height:0;height:calc(var(--u)*480)}.composition-stage:before{width:calc(var(--u)*355);height:calc(var(--u)*355)}.composition-stage:after{width:calc(var(--u)*250);height:calc(var(--u)*250)}.composition-stage-top,.composition-stage-bottom{padding:calc(var(--u)*16) calc(var(--u)*22);font-size:calc(var(--u)*9)}.composition-stage-bottom{font-size:calc(var(--u)*11)}.composition-canvas{min-height:0}.composition-glow{width:calc(var(--u)*250);height:calc(var(--u)*250)}.composition-piece,.composition-placeholder{width:calc(var(--u)*142);height:calc(var(--u)*200);padding:calc(var(--u)*6)}.composition-piece img{height:calc(var(--u)*165)}.composition-piece span{font-size:calc(var(--u)*11);padding-top:calc(var(--u)*5)}.composition-piece.piece-1,.composition-placeholder.placeholder-1{top:9%;left:8%}.composition-piece.piece-2,.composition-placeholder.placeholder-2{top:24%;right:8%}.composition-piece.piece-3,.composition-placeholder.placeholder-3{top:34%;left:30%}.composition-placeholder span{font-size:calc(var(--u)*27)}.composition-placeholder small{font-size:calc(var(--u)*8)}.composition-controls{padding:calc(var(--u)*60) calc(var(--u)*24)}.composition-controls h2{font-size:calc(var(--u)*42)}.composition-controls>p:not(.composition-note){font-size:calc(var(--u)*13)}.composition-options{gap:calc(var(--u)*6)}.composition-option{gap:calc(var(--u)*5);padding:calc(var(--u)*5)}.composition-option img{width:calc(var(--u)*36);height:calc(var(--u)*36)}.composition-option strong{font-size:calc(var(--u)*9)}.composition-option small{font-size:calc(var(--u)*9)}.composition-option button{width:calc(var(--u)*24);height:calc(var(--u)*24);font-size:calc(var(--u)*15)}.composition-summary strong{font-size:calc(var(--u)*18)}.composition-summary small{font-size:calc(var(--u)*9)}.composition-note{font-size:calc(var(--u)*10)}.composition-actions{flex-direction:column;align-items:stretch}.composition-actions .button{width:100%}.composition-reset{align-self:flex-start;font-size:calc(var(--u)*11)}}
