.design-intro{display:grid;grid-template-columns:1fr 1fr;gap:50px;padding-bottom:40px}.design-intro>p{font-size:13px;line-height:1.9;color:#5c6b5c;max-width:550px}.design-workspace{display:grid;grid-template-columns:240px minmax(0,1fr) 240px;gap:24px;background:linear-gradient(135deg,#e6e8dd,#f3eadc);align-items:start;padding-top:35px}.design-catalog,.design-tools{background:#faf8f0;border:1px solid #c5cbb8;padding:20px;border-radius:7px;min-width:0}.design-catalog>label,.design-tools label{display:block;font-size:10px;font-weight:600;letter-spacing:.04em;margin:13px 0 7px;color:#3d5541}.design-workspace input:not([type=color]):not([type=range]),.design-workspace select{width:100%;padding:11px 9px;border:1px solid #b9c4ad;background:#fffdf6;color:#223f31;border-radius:3px;font-size:12px}.design-workspace input[type=color]{width:100%;height:34px;border:1px solid #c2cbb8;background:transparent;padding:3px;margin-top:6px}.design-workspace input[type=range]{width:100%;accent-color:#315d47;margin-top:10px}.design-workspace input[type=file]{font-size:10px!important}.design-product-list{max-height:650px;overflow:auto;display:grid;gap:6px;scrollbar-width:thin}.design-product{padding:11px;text-align:left;border:1px solid #d1d6c7;background:#f1f2e8;border-radius:3px;color:#254433}.design-product small{display:block;font-size:8px;color:#788468;margin-bottom:5px}.design-product strong{font-size:12px;font-weight:600}.design-product[aria-pressed=true]{background:#244c3e;color:#faf0dc;border-color:#244c3e}.design-product[aria-pressed=true] small{color:#cfbd96}#design-count{font-size:10px;line-height:1.6;color:#647358;margin:13px 0}.design-studio{min-width:0}.design-stage-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.design-stage-head small{font-size:8px;color:#7b755b;letter-spacing:.08em}.design-stage-head h2{font-size:24px;letter-spacing:-.8px;margin:10px 0}.design-stage-head>span{font-size:7px;letter-spacing:.08em;color:#65735b;white-space:nowrap}.design-canvas{height:470px;display:grid;place-items:center;background:radial-gradient(ellipse,#fff9,transparent 65%);border:1px solid #bfc8b555;border-radius:9px;margin-top:16px}.design-canvas svg{width:100%;height:100%;max-width:500px;filter:drop-shadow(7px 15px 9px #17392622)}.design-views{display:flex;justify-content:center;gap:8px;margin-top:15px}.design-views button,.design-tools>button{padding:10px 14px;font-size:11px;border:1px solid #9caa8e;background:#f7f4e9;color:#294933}.design-views button[aria-pressed=true]{background:#264e40;color:#fff5e1}.design-note,.design-tools>p,.design-tools>small{font-size:10px;line-height:1.8;color:#69715b}.design-note{text-align:center;margin:15px 0}.design-tools h3{font-size:17px;color:#264833}.design-tools label input,.design-tools label select{display:block;margin-top:7px}.design-tools>button{margin-top:10px}.design-actions{display:flex;gap:10px;flex-wrap:wrap}.design-actions .button{font-size:11px;padding:16px 20px;flex:1;text-align:center;justify-content:center;white-space:nowrap}#design-status{font-size:11px;line-height:1.6;color:#37563d}.design-sources h2{font-size:32px}.design-sources p{color:#596958}.design-sources details{margin-top:30px;font-size:11px;color:#62735c;line-height:1.9}.design-sources summary{cursor:pointer}.design-sources details a{text-decoration:underline;text-underline-offset:3px}@media(max-width:1150px){.design-workspace{grid-template-columns:200px minmax(0,1fr)}.design-tools{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 20px}.design-tools h3,.design-tools>p,.design-tools>small{grid-column:1/-1}.design-tools label{margin:0}.design-canvas{height:400px}.design-product-list{max-height:570px}}@media(max-width:700px){.design-intro{grid-template-columns:1fr;gap:15px}.design-workspace{grid-template-columns:1fr;gap:20px}.design-catalog{padding:15px}.design-product-list{max-height:195px;grid-template-columns:1fr 1fr}.design-product{padding:10px}.design-product strong{font-size:11px}.design-catalog>label{margin:10px 0 5px}.design-canvas{height:350px}.design-stage-head{display:block}.design-stage-head h2{font-size:25px}.design-tools{grid-template-columns:repeat(2,minmax(0,1fr));padding:17px;gap:15px}.design-tools>small{font-size:9px}.design-actions .button{font-size:10px;padding:14px 10px}.design-intro h2{font-size:35px}}
@font-face{font-family:Teko;src:url(fonts/Teko.ttf) format('truetype');font-weight:300 700;font-display:swap}@font-face{font-family:Oswald;src:url(fonts/Oswald.ttf) format('truetype');font-weight:200 700;font-display:swap}@font-face{font-family:'Barlow Condensed';src:url(fonts/BarlowCondensed-Bold.ttf) format('truetype');font-weight:700;font-display:swap}.design-canvas{height:560px;background:radial-gradient(ellipse at 50% 40%,#faf9f0,#d5dfce);box-shadow:inset 0 0 60px #c3cbb244}.design-canvas canvas{width:100%;height:100%;object-fit:contain;filter:drop-shadow(5px 16px 10px #18382b26);touch-action:none;cursor:grab;max-width:560px}.design-canvas canvas:active{cursor:grabbing}.design-ready-links{display:flex;justify-content:center;gap:10px;margin:15px 0}.design-ready-links button{background:#234a3c;border:1px solid #345943;color:#f6efdf;padding:11px 17px;font-size:11px}.template-pending{padding:35px;max-width:430px;text-align:center}.template-pending>span{font-size:9px;letter-spacing:.16em;color:#8b704b}.template-pending h3{font-size:27px;color:#244c3c;margin:20px 0}.template-pending p{font-size:13px;line-height:1.9;color:#566b52}.design-tools :disabled,.design-views :disabled,#design-download:disabled{opacity:.4;cursor:not-allowed}.design-stage-head>span{white-space:normal;text-align:right}.design-tools select#design-font{font-size:13px}.design-tools{max-height:1000px;overflow:auto}@media(max-width:1150px){.design-tools{max-height:none;overflow:visible}.design-canvas{height:480px}}@media(max-width:700px){.design-canvas{height:410px}.template-pending{padding:25px}.design-tools{grid-template-columns:1fr 1fr}.design-stage-head>span{display:block;text-align:left;font-size:7px}.design-ready-links button{flex:1}}
/* Keep the preview inside its stage and controls outside the canvas hit area. */
.design-canvas{position:relative;display:block;overflow:hidden}.design-canvas canvas{position:absolute;inset:0;width:100%;height:100%;max-width:none;display:block;object-fit:contain}
/* Product-specific image thumbnails */
.design-product{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:9px;align-items:center}.design-product img{grid-column:1;grid-row:1/3;width:40px;height:48px;object-fit:contain;filter:drop-shadow(0 3px 2px #1c392d22)}.design-product small,.design-product strong{grid-column:2;min-width:0}.design-product small{font-size:7px;line-height:1.6;margin:0 0 3px}.design-product strong{font-size:11px;line-height:1.5}.design-canvas:has(.template-pending){display:grid;place-items:center}.design-tools input[type=range]:disabled{opacity:.4}@media(max-width:700px){.design-product{grid-template-columns:32px minmax(0,1fr);gap:3px 7px}.design-product img{width:32px;height:43px}.design-product strong{font-size:10px}.design-product small{font-size:6px}}

@font-face{font-family:"Anton";src:url(fonts/Anton-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Bebas Neue";src:url(fonts/BebasNeue-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Graduate";src:url(fonts/Graduate-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Black Ops One";src:url(fonts/BlackOpsOne-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Bungee";src:url(fonts/Bungee-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Russo One";src:url(fonts/RussoOne-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Rajdhani";src:url(fonts/Rajdhani-Bold.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Saira Condensed";src:url(fonts/SairaCondensed-Bold.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url(fonts/ChakraPetch-Bold.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Staatliches";src:url(fonts/Staatliches-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Squada One";src:url(fonts/SquadaOne-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Quantico";src:url(fonts/Quantico-Bold.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Oxanium";src:url(fonts/Oxanium%5Bwght%5D.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Orbitron";src:url(fonts/Orbitron%5Bwght%5D.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Jersey 10";src:url(fonts/Jersey10-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Jersey 15";src:url(fonts/Jersey15-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Jersey 20";src:url(fonts/Jersey20-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"Jersey 25";src:url(fonts/Jersey25-Regular.ttf) format("truetype");font-weight:100 900;font-display:swap}
.design-font-sample{display:flex;align-items:center;justify-content:space-between;background:#e8ecdf;border:1px solid #c5ceb9;padding:12px 15px;margin:12px 0;grid-column:1/-1;color:#254a3e}.design-font-sample span{font-size:25px}.design-font-sample strong{font-size:48px;font-weight:700;line-height:1}.design-tools label:has(#design-back-layout){grid-column:1/-1}
.design-transform-panel{grid-column:1/-1;background:#e5ebdd;border:1px solid #b2c1a4;padding:15px;border-radius:5px;margin:5px 0 15px}.design-transform-panel h4{margin:0 0 12px;color:#244935;font-size:14px}.design-transform-panel p{font-size:10px;line-height:1.8;color:#55684c;margin:12px 0 0}.design-transform-panel output{font-size:10px;color:#6a7153;display:block;margin-top:8px}.design-move-buttons,.design-transform-buttons{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}.design-move-buttons button,.design-transform-buttons button{padding:10px 12px;border:1px solid #9ead8f;background:#fffdf3;color:#244935;font-size:11px;min-height:38px}.design-move-buttons button:hover,.design-transform-buttons button:hover{background:#c6d5b9}.design-move-buttons button:focus-visible,.design-transform-buttons button:focus-visible{outline:2px solid #b2854f;outline-offset:2px}.design-move-buttons button:first-child,.design-move-buttons button:last-child{min-width:38px}.design-transform-buttons button{flex:1 1 44%}.design-guide-toggle{display:flex!important;gap:7px;align-items:center}.design-guide-toggle input{width:16px!important}.design-canvas canvas{cursor:move}.design-tools>small,.design-tools>p{grid-column:1/-1}.design-tools #design-x,.design-tools #design-y{min-width:0}@media(min-width:1151px){.design-tools{max-height:none;overflow:visible}.design-workspace{grid-template-columns:210px minmax(0,1fr) 280px}.design-studio{position:sticky;top:20px}}@media(max-width:1150px){.design-transform-panel{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}.design-transform-panel h4,.design-transform-panel>.design-move-buttons,.design-transform-panel>.design-transform-buttons,.design-transform-panel>output,.design-transform-panel>p{grid-column:1/-1}.design-transform-panel .design-transform-buttons button{flex:1 1 23%}.design-transform-panel label{min-width:0}}@media(max-width:650px){.design-transform-panel{display:block}.design-transform-panel .design-transform-buttons button{flex:1 1 44%}}