@font-face{font-family:Bebas;src:url('/fonts/bebas-neue.woff2') format('woff2');font-display:swap}
:root{--cyan:#28c2f2;--cyan-deep:#0b88b6;--green:#68e7a7;--text:#f4f7f8;--muted:#9cacb8;--panel:#061d2e;--panel-2:#082539;--line:#15506f}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-width:320px;color:var(--text);font-family:Inter,Arial,sans-serif;background:#010b12}
button,a,label{cursor:pointer}
button,input{font:inherit}
button:focus-visible,input:focus-visible,label:has(input:focus-visible){outline:3px solid #fff;outline-offset:3px}
.bt-nav{position:sticky;top:0;z-index:40;min-height:80px;display:flex;align-items:center;justify-content:space-between;padding:8px clamp(18px,4vw,64px);background:#050707;border-bottom:1px solid #132d3d}
.bt-brand img{width:62px;height:62px;object-fit:contain}
.bt-links{display:flex;gap:clamp(14px,2vw,30px);align-items:center;padding-right:84px}
.bt-links a{color:#a5adb2;text-decoration:none;text-transform:uppercase;letter-spacing:1.6px;font:16px Bebas,sans-serif}
.bt-links a:hover,.bt-links a.active{color:var(--cyan)}
.builder-app{min-height:calc(100vh - 80px);overflow:clip;background:linear-gradient(90deg,#010a11e8,#010b12b0 48%,#010a11e8),url('/stadium-bg-optimized.webp') center top/cover fixed no-repeat}
.builder{min-height:calc(100vh - 80px);padding:28px 30px 56px}
.builder-shell{width:min(1460px,100%);margin:auto;display:grid;grid-template-columns:180px minmax(420px,1fr) minmax(390px,500px);gap:24px;align-items:start}
.step-rail{position:sticky;top:108px;margin-top:290px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#041827;box-shadow:0 22px 60px #0007}
.step-rail-head{display:flex;justify-content:space-between;gap:14px;padding:15px 16px;border-bottom:1px solid var(--line);color:#8fa4b2;text-transform:uppercase;font-size:11px;letter-spacing:.16em}
.step-rail-head b{color:var(--cyan)}
.step-rail-button{width:100%;min-height:108px;display:flex;align-items:center;gap:16px;padding:18px;border:0;border-left:4px solid transparent;border-bottom:1px solid #123a50;background:#041827;color:#fff;text-align:left;text-transform:uppercase}
.step-rail-button strong{font:34px Bebas,sans-serif;color:#8295a1;letter-spacing:.04em}
.step-rail-button span{font-size:12px;font-weight:900;letter-spacing:.09em}
.step-rail-button:hover{background:#08283b}
.step-rail-button.active{border-left-color:var(--cyan);background:#0b425e}
.step-rail-button.active strong{color:var(--cyan)}
.preview-zone{position:sticky;top:108px;min-height:710px}
.preview-head,.price-card,.controls,.order-card{border:1px solid var(--line);border-radius:16px;background:#061d2e;box-shadow:0 24px 70px #0006}
.preview-head{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:16px 18px}
.preview-head>div{display:grid;gap:4px}
.preview-head b,.set-heading b,.price-card span,.controls-head span{color:var(--cyan);font-size:12px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.preview-head span{color:#d6e1e7;font-size:11px}
.preview-head button{min-height:44px;padding:0 16px;border:1px solid #236484;border-radius:10px;background:#0b3850;color:#fff;text-transform:uppercase;font:17px Bebas,sans-serif;letter-spacing:.04em}
.tour-note{margin:10px 0 0;padding:12px 16px;border:1px solid #25637f;border-radius:10px;background:#062338;color:#cfe7f2;font-size:12px;line-height:1.5}
.set-heading{display:flex;justify-content:space-between;gap:20px;margin:14px 4px 4px;align-items:center}
.set-heading span{color:#c8d4da;font-size:11px;text-transform:uppercase}
.preview-track{min-height:570px;display:grid;grid-template-columns:repeat(2,minmax(190px,1fr));gap:20px;align-content:start;padding:36px 10px 20px}
.tag-card{display:grid;place-items:center;min-height:260px}
.tag-art{--tag:#244aa7;--letters:#f6f3e9;--logo:#16a9dc;position:relative;width:224px;height:224px;display:grid;place-items:center;padding:36px 30px 22px;color:var(--letters);filter:drop-shadow(0 20px 18px #000b)}
.tag-art:before{content:"";position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(0deg,#ffffff08 0 1px,transparent 1px 4px),linear-gradient(135deg,color-mix(in srgb,var(--tag),white 9%),var(--tag) 52%,color-mix(in srgb,var(--tag),black 20%));border:3px solid color-mix(in srgb,var(--tag),white 28%);border-radius:18px;box-shadow:inset 0 0 0 1px #fff2,inset -8px -9px 16px #0004,0 6px 0 color-mix(in srgb,var(--tag),black 38%)}
.tag-art.circle:before{border-radius:50%}
.tag-art.vertical{width:175px;height:245px}
.tag-art.horizontal{width:250px;height:168px}
.tag-art.pentagon:before{clip-path:polygon(50% 0,100% 36%,82% 100%,18% 100%,0 36%);border-radius:0}
.tag-art.homeplate:before{clip-path:polygon(0 0,100% 0,100% 58%,50% 100%,0 58%);border-radius:4px}
.tag-hole{position:absolute;top:13px;left:50%;transform:translateX(-50%);width:20px;height:20px;border-radius:50%;background:#01070b;box-shadow:0 0 0 4px #cfd3d5,inset 0 2px 5px #000}
.tag-content{width:100%;height:100%;display:grid;grid-template-rows:1fr auto auto;gap:2px;place-items:center;text-align:center}
.tag-logo{max-width:76%;max-height:86px;object-fit:contain;filter:drop-shadow(0 2px 2px #0008)}
.tag-name,.tag-number{text-transform:uppercase;font-family:Bebas,sans-serif;letter-spacing:.05em;text-shadow:0 2px 2px #0008;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.tag-name{font-size:25px}
.tag-number{font-size:42px;line-height:.9}
.preview-add{display:grid;place-items:center;gap:5px;margin:0 auto;min-width:80px;border:0;background:transparent;color:#fff}
.preview-add span{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--cyan);color:#001620;font-size:44px;line-height:1}
.preview-add small{text-transform:uppercase;font-size:10px;font-weight:900;letter-spacing:.08em}
.builder-side{display:grid;gap:14px}
.price-card{min-height:98px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 20px}
.price-card>div:first-child{display:grid;grid-template-columns:auto auto;align-items:end;column-gap:9px}
.price-card>div:first-child span{grid-column:1/3}
.price-card strong{font:44px/1 Bebas,sans-serif;letter-spacing:.02em}
.price-card small{padding-bottom:5px;color:#bdc9d0;text-transform:uppercase;font-size:10px;font-weight:900}
.rating{display:grid;gap:4px;text-align:right}
.rating b{color:#ffd126;font-size:17px;letter-spacing:.1em}
.rating span{font-size:11px;font-weight:900}
.controls{overflow:hidden}
.controls-head{padding:22px 20px 18px;border-bottom:1px solid var(--line)}
.controls-head h1{margin:8px 0 0;font:42px/1 Bebas,sans-serif;letter-spacing:.02em}
.step-panel[hidden]{display:none}
.control-block{padding:18px 20px;border-bottom:1px solid var(--line)}
.step-title{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.step-title>b{flex:0 0 auto;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--cyan);color:#001824}
.step-title div{display:grid;gap:3px}
.step-title span{font-size:13px;font-weight:900}
.step-title small{color:var(--muted);font-size:11px}
.shape-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.shape-grid button{min-height:72px;display:grid;place-items:center;gap:6px;border:1px solid #1b5270;border-radius:9px;color:#a8bbc7;background:#061722;font-size:10px;font-weight:900}
.shape-grid button.active{border-color:var(--cyan);color:#fff;background:#0b3850;box-shadow:inset 0 0 0 1px #26c8ff44}
.shape-icon{display:block;width:26px;height:22px;background:#8295a1}
.shape-grid button.active .shape-icon{background:var(--cyan)}
.shape-icon.circle{width:25px;height:25px;border-radius:50%}
.shape-icon.square{border-radius:1px}
.shape-icon.vertical{width:18px;height:28px}
.shape-icon.horizontal{width:30px;height:18px}
.shape-icon.pentagon{clip-path:polygon(50% 0,100% 38%,82% 100%,18% 100%,0 38%)}
.shape-icon.homeplate{clip-path:polygon(0 0,100% 0,100% 58%,50% 100%,0 58%)}
.color-targets{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.color-targets button{min-height:54px;display:grid;grid-template-columns:20px auto;place-content:center;align-items:center;gap:7px;border:1px solid #1b5270;border-radius:9px;color:#a8bbc7;background:#061722;font-size:10px;font-weight:900;text-transform:uppercase}
.color-targets button i{width:18px;height:18px;border:2px solid #d9e3e7;border-radius:50%;background:var(--target)}
.color-targets button.active{border-color:var(--cyan);color:#fff;background:#0b3850}
.hardware-note{display:flex;align-items:center;gap:7px;margin:5px 0 12px;color:#b9c8d0;text-transform:uppercase;font-size:9px;font-weight:900;letter-spacing:.04em}
.hardware-note i{width:18px;height:18px;border:2px solid #8fa4b2;border-radius:50%;background:#d8d8d2}
.swatches{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;padding:12px;border:1px solid #174b68;border-radius:10px;background:#04131d}
.swatches button{aspect-ratio:1;min-width:0;border:3px solid #78909f;border-radius:50%;background:var(--swatch);box-shadow:inset 0 0 0 2px #031019}
.swatches button.active{border-color:var(--cyan);box-shadow:0 0 0 3px #26c8ff55,inset 0 0 0 2px #031019}
.custom-color{display:flex;justify-content:space-between;align-items:center;margin-top:10px;color:var(--muted);font-size:10px;font-weight:900;text-transform:uppercase}
.custom-color input{width:42px;height:32px;border:0;background:transparent}
.upload-button{position:relative;display:grid;place-items:center;min-height:48px;border:1px solid var(--cyan);border-radius:9px;background:#0b3850;text-transform:uppercase;font:18px Bebas,sans-serif;letter-spacing:.06em}
.upload-button input{position:absolute;opacity:0;pointer-events:none}
.file-name{margin:9px 0 0;color:var(--muted);font-size:10px;line-height:1.5}
.players{display:grid;gap:9px}
.player-row{display:grid;grid-template-columns:42px 1fr 88px 40px;gap:8px}
.player-row span{display:grid;place-items:center;border-radius:8px;background:#0b3850;color:var(--cyan);font-weight:900}
.player-row input{min-width:0;min-height:46px;border:1px solid #1b5270;border-radius:8px;background:#04131d;color:#fff;padding:11px}
.player-row button{border:1px solid #814054;border-radius:8px;background:#321523;color:#ff8ba5;font-size:20px}
.add-player{width:100%;min-height:46px;margin-top:10px;border:1px dashed var(--cyan);border-radius:9px;background:#071e2d;color:var(--cyan);font-weight:900}
.players-help{margin:12px 0 0;color:var(--muted);font-size:11px;line-height:1.5}
.review-list{display:grid;gap:0;margin:0;border:1px solid #174b68;border-radius:10px;overflow:hidden}
.review-list>div{display:flex;justify-content:space-between;gap:18px;padding:13px 14px;border-bottom:1px solid #174b68}
.review-list>div:last-child{border-bottom:0}
.review-list dt{color:var(--muted);font-size:11px;text-transform:uppercase}
.review-list dd{margin:0;text-align:right;font-size:12px;font-weight:900}
.step-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:10px;padding:14px 20px}
.step-actions button{min-height:52px;border:1px solid #1b5270;border-radius:9px;background:#061722;color:#b3c0c8;text-transform:uppercase;font:18px Bebas,sans-serif;letter-spacing:.04em}
.step-actions button:last-child{border-color:var(--cyan);background:var(--cyan);color:#001824}
.step-actions button:disabled{opacity:.35;cursor:not-allowed}
.order-card{padding:18px 20px}
.order-card-head{display:flex;justify-content:space-between;gap:20px;padding-bottom:14px;border-bottom:1px solid #174b68}
.order-card-head>div{display:grid;gap:4px}
.order-card-head b{text-transform:uppercase;font-size:12px}
.order-card-head small,.secure-note{color:var(--muted);font-size:10px}
.order-card-head button{border:0;background:transparent;color:var(--cyan);text-transform:uppercase;font-size:10px;font-weight:900}
.order-total{display:flex;justify-content:space-between;align-items:end;padding:16px 0 12px}
.order-total span{color:var(--muted);font-size:11px}
.order-total strong{font:34px Bebas,sans-serif}
#addToCart{width:100%;min-height:54px;border:0;border-radius:9px;background:var(--green);color:#002615;text-transform:uppercase;font:20px Bebas,sans-serif;letter-spacing:.05em}
#addToCart:disabled{opacity:.6;cursor:wait}
#builderStatus{min-height:18px;margin:8px 0 0;color:#ffb9c7;font-size:11px}
.secure-note{display:block;line-height:1.45}
body[data-fourlife-product="bag"]>.fl-related,body[data-fourlife-product="bag"]>.fl-showcase{display:none!important}

/* Compact builder: the shared site header and checkout are intentionally untouched. */
.builder{padding:20px 24px 40px}
.builder-shell{width:min(1320px,100%);grid-template-columns:minmax(0,1fr) minmax(360px,440px);gap:16px 24px}
.step-rail{position:static;grid-column:1/-1;margin:0;display:grid;grid-template-columns:140px repeat(3,1fr);border-radius:12px;box-shadow:none}
.step-rail-head{align-items:center;padding:10px 12px;border:0;border-right:1px solid var(--line);letter-spacing:.06em}
.step-rail-button{min-height:48px;padding:8px 16px;gap:10px;border:0;border-bottom:3px solid transparent;border-right:1px solid var(--line)}
.step-rail-button strong{font-size:24px}
.step-rail-button.active{border-bottom-color:var(--cyan)}
.preview-zone{top:100px;min-height:0;min-width:0}
.preview-head{padding:12px 14px;box-shadow:none;gap:10px}
.set-heading{margin:12px 0 0;gap:12px}
.set-heading>div{display:grid;gap:5px;min-width:0}
.set-heading span{font-size:12px;line-height:1.4}
.preview-add{display:flex;justify-content:center;flex-shrink:0;gap:6px;margin:0;min-width:0;min-height:44px;padding:8px 14px;border:1px solid var(--cyan);border-radius:9px;background:var(--cyan);color:#001824;font-size:13px;font-weight:800;white-space:nowrap}
.preview-add span{display:inline;width:auto;height:auto;background:none;font-size:22px}
.preview-feedback{display:flex;align-items:center;gap:8px;min-height:24px;font-size:12px;color:#c9d7df}
.preview-feedback button{min-height:44px;border:0;background:none;color:var(--cyan);text-decoration:underline;font-weight:700}
.preview-feedback button[hidden]{display:none}
.preview-track{min-height:0;max-height:min(620px,calc(100dvh - 310px));overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#28627e #061722;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;padding:4px 6px 12px 2px;align-content:start;border-radius:10px}
.tag-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;min-height:0;min-width:0;padding:0 8px 14px;border:1px solid #163448;border-radius:12px;background:#05172499}
.tag-card-tools{display:flex;align-items:center;justify-content:space-between;width:100%;gap:4px}
.tag-card-tools button{min-height:44px;border:0;border-radius:8px;background:none;color:#c9d7df}
.tag-card-tools .edit-tag{padding:0 6px;font-size:12px;text-align:left}
.tag-card-tools .edit-tag:hover{color:var(--cyan);text-decoration:underline}
.tag-card-tools .remove-tag{display:grid;place-items:center;min-width:44px;color:#ffb9c7}
.tag-card-tools .remove-tag:hover:not(:disabled){background:#402130}
.tag-card-tools button:disabled,.player-row button:disabled,.preview-add:disabled,.add-player:disabled{opacity:.4;cursor:not-allowed}
.tag-art{isolation:isolate;container-type:inline-size;width:100%;max-width:180px;height:auto;aspect-ratio:1;padding:0;display:block;filter:drop-shadow(0 6px 6px #0007)}
.tag-art.vertical{width:78%;max-width:140px;height:auto;aspect-ratio:175/245}
.tag-art.horizontal{width:100%;max-width:200px;height:auto;aspect-ratio:250/168}
.tag-hole{top:7%;width:8%;height:auto;aspect-ratio:1;box-shadow:0 0 0 3px #cfd3d5,inset 0 2px 5px #000}
.tag-content{position:absolute;left:16%;right:16%;top:23%;bottom:12%;width:auto;height:auto;display:grid;grid-template-rows:minmax(0,1fr) 24% 27%;gap:0;overflow:hidden}
.tag-art.circle .tag-content{left:18%;right:18%;top:23%;bottom:16%}
.tag-art.horizontal .tag-content{left:12%;right:12%;top:25%;bottom:10%;grid-template-rows:minmax(0,1fr) 27% 30%}
.tag-art.vertical .tag-content{left:12%;right:12%;top:19%;bottom:12%}
.tag-art.pentagon .tag-content{left:21%;right:21%;top:32%;bottom:11%}
.tag-art.homeplate .tag-content{left:20%;right:20%;top:21%;bottom:31%}
.tag-logo{display:block;width:100%;height:100%;min-height:0;max-width:80%;max-height:100%;object-fit:contain}
.tag-name,.tag-number{display:block;max-width:100%;width:100%;min-width:0;line-height:1;letter-spacing:.025em;white-space:nowrap;text-overflow:clip;align-self:center}
.tag-name{font-size:11cqw}
.tag-number{font-size:16cqw}
.tag-art.horizontal .tag-name{font-size:8cqw}
.tag-art.horizontal .tag-number{font-size:11cqw}
.tag-art.homeplate .tag-name{font-size:9cqw}
.tag-art.homeplate .tag-number{font-size:12cqw}
.tag-name,.tag-number,.tag-logo[role=button]{cursor:pointer;border-radius:3px}
.tag-name:hover,.tag-number:hover,.tag-logo[role=button]:hover{background:#071b3b55;outline:1px dashed #ffffffa0;outline-offset:-1px}
.tag-name:focus-visible,.tag-number:focus-visible,.tag-logo[role=button]:focus-visible{outline:2px solid #fff;outline-offset:-2px}
.tag-inline-input{display:block;width:100%;min-width:0;height:100%;box-sizing:border-box;border:0;border-radius:2px;padding:0;color:#fff;background:#071b3bcc;font:inherit;letter-spacing:inherit;line-height:1;text-align:center;outline:2px solid var(--cyan);outline-offset:-2px}
.builder-side{min-width:0;gap:12px}
.price-card{min-height:76px;padding:12px 16px;box-shadow:none}
.price-card strong{font-size:36px}
.controls-head{padding:14px 16px}
.controls-head h1{font-size:32px;margin-top:6px}
.control-block{padding:14px 16px}
.step-title{margin-bottom:10px;gap:10px}
.step-title>b{width:28px;height:28px}
.step-title small{font-size:12px;line-height:1.4}
.shape-grid button{min-height:56px;grid-template-columns:28px auto;gap:6px;place-content:center;font-size:12px}
.color-targets button{min-height:44px;font-size:11px}
.swatches{padding:8px;gap:6px;grid-template-columns:repeat(8,1fr)}
.swatches button{min-height:32px}
.players{max-height:380px;overflow-y:auto;padding:4px 2px;scrollbar-width:thin}
.player-row{grid-template-columns:28px minmax(0,1fr) 64px 44px;gap:6px}
.player-row input{font-size:16px;padding:8px;min-height:44px}
.player-row button{display:grid;place-items:center;min-height:44px}
.add-player{margin:0 0 10px}
.step-actions{padding:12px 16px}
.step-actions button{min-height:44px}
.order-card{padding:14px 16px}
.order-total{padding:12px 0}
@media(max-width:980px){
  .builder-shell{grid-template-columns:minmax(0,1fr) minmax(340px,400px);gap:16px}
  .preview-track{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .builder{padding:12px 12px 32px}
  .builder-shell{display:flex;flex-direction:column;gap:12px}
  .step-rail{width:100%;grid-template-columns:repeat(3,1fr)}
  .step-rail-head{display:none}
  .step-rail-button{justify-content:center;padding:8px;gap:6px}
  .step-rail-button strong{font-size:20px}
  .step-rail-button span{font-size:11px}
  .preview-zone{position:static;width:100%;margin:0}
  .preview-head{padding:8px 12px}
  .preview-head span{font-size:12px}
  .preview-head button{font-size:15px;padding:0 10px}
  .preview-track{max-height:280px;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;scrollbar-gutter:stable}
  .tag-card{padding:0 8px 12px;gap:2px}
  .tag-art{max-width:140px}
  .tag-art.horizontal{max-width:160px}
  .tag-art.vertical{max-width:105px}
  .builder-side{width:100%}
  .controls-head h1{font-size:30px;scroll-margin-top:100px}
  .swatches{grid-template-columns:repeat(7,1fr);gap:4px;padding:6px}
  .swatches button{min-height:40px}
  .shape-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .shape-grid button{font-size:11px;grid-template-columns:1fr;gap:4px;min-height:60px}
  .players{max-height:320px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Legacy breakpoints superseded by the compact layout above. */
@media(max-width:0px){
  .builder-shell{grid-template-columns:150px minmax(390px,1fr) minmax(370px,460px);gap:16px}
  .step-rail{margin-top:250px}
  .preview-track{grid-template-columns:1fr}
}
@media(max-width:0px){
  .builder{padding:22px 18px 48px}
  .builder-shell{grid-template-columns:1fr 1fr;align-items:start}
  .step-rail{position:static;grid-column:1/3;margin:0;display:grid;grid-template-columns:auto repeat(3,1fr)}
  .step-rail-head{align-items:center;border-bottom:0;border-right:1px solid var(--line)}
  .step-rail-button{min-height:64px;border-left:0;border-bottom:0;border-right:1px solid #123a50}
  .step-rail-button.active{border-left:0;border-bottom:4px solid var(--cyan)}
  .preview-zone{position:sticky;top:132px}
  .preview-track{min-height:460px}
}
@media(max-width:0px){
  .bt-nav{justify-content:center;flex-wrap:wrap;padding-inline:10px}
  .bt-links{display:flex;width:100%;overflow-x:auto;justify-content:flex-start;padding:4px 6px 10px;scrollbar-width:none}
  .bt-links::-webkit-scrollbar{display:none}.bt-links a{white-space:nowrap}
  .builder-app{min-height:calc(100vh - 112px)}
  .builder{padding:14px 10px 42px}
  .builder-shell{display:block}
  .step-rail{position:static;margin:0 0 12px;grid-template-columns:repeat(3,1fr)}
  .step-rail-head{grid-column:1/4;border-right:0;border-bottom:1px solid var(--line)}
  .step-rail-button{padding:10px;justify-content:center;gap:8px}
  .step-rail-button strong{font-size:28px}
  .preview-zone{position:static;min-height:0;margin-bottom:14px}
  .preview-head{padding:12px}
  .preview-head button{padding-inline:10px}
  .set-heading{padding-inline:6px}
  .preview-track{min-height:300px;grid-template-columns:1fr;padding:18px 4px 8px}
  .tag-card{min-height:240px}
  .price-card{min-height:88px}
  .controls-head h1{font-size:36px}
  .control-block{padding-inline:14px}
  .swatches{grid-template-columns:repeat(6,1fr)}
  .player-row{grid-template-columns:38px 1fr 70px 38px}
  .step-actions{padding-inline:14px}
}
@media(max-width:0px){
  .step-rail-button{display:grid;gap:2px;text-align:center}
  .step-rail-button span{font-size:10px}
  .shape-grid{grid-template-columns:repeat(2,1fr)}
  .swatches{grid-template-columns:repeat(5,1fr)}
  .price-card strong{font-size:38px}
}