.csd-root{
--csd-bg: #f8fafc;
--csd-panel: rgba(15,23,42,.04);
--csd-panel2: rgba(15,23,42,.06);
--csd-border: rgba(15,23,42,.16);
--csd-text: #0f172a;
--csd-muted: rgba(15,23,42,.70);
--csd-accent: #22d3ee;
--csd-accent2: #a78bfa;
--csd-good: #22c55e;
--csd-bad: #ef4444;
color-scheme: light;
font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Apple Color Emoji", "Segoe UI Emoji";
color: var(--csd-text);
background:
radial-gradient(900px 520px at 22% 18%, rgba(34,211,238,.18), rgba(34,211,238,0) 60%),
radial-gradient(900px 520px at 78% 60%, rgba(167,139,250,.14), rgba(167,139,250,0) 60%),
linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
border-radius: 18px;
padding: 0;
border: 0;
box-shadow: none;
width: 100%;
max-width: none;
overflow-x: hidden;
} .csd-root, .csd-root *{box-sizing:border-box}
.csd-root a{color:inherit}
.csd-root button, .csd-root input, .csd-root select, .csd-root textarea{font:inherit}
.csd-root button{appearance:none;-webkit-appearance:none}
.csd-root button{color:inherit;-webkit-text-fill-color: currentColor;opacity:1;filter:none;mix-blend-mode:normal}
.csd-stack{display:block}
.csd-panel, .csd-preview{
background: linear-gradient(180deg, var(--csd-panel2), var(--csd-panel));
border: 0;
border-radius: 0;
padding: 16px;
box-shadow: none;
}
.csd-panel-title, .csd-preview-title{font-weight:900;font-size:18px;margin:0 0 12px}
.csd-label{display:block;font-size:12px;color:var(--csd-muted);margin-top:8px;margin-bottom:6px;font-weight:800}
.csd-help{margin-top:8px;font-size:12px;color:var(--csd-muted);min-height:18px}
.csd-input,.csd-select{
width:100%;height:40px;padding:0 12px;border-radius:12px;
background: rgba(255,255,255,.85);
border: 0;
color: var(--csd-text);
outline:none;
}
.csd-input:focus,.csd-select:focus{
border-color: rgba(34,211,238,.65);
box-shadow: 0 0 0 3px rgba(34,211,238,.18), 0 18px 55px rgba(0,0,0,.35);
}
.csd-input--sm{height:36px;padding:0 10px;border-radius:12px;font-size:13px}
.csd-btn,.csd-btn-primary,.csd-font-btn,.csd-icon-btn,.csd-swatch{
appearance:none;-webkit-appearance:none;
border: 1px solid transparent;
background: rgba(255,255,255,.06);
color: var(--csd-text);
font-weight: 900;
border-radius: 14px;
padding: 0 14px;
-webkit-text-fill-color: currentColor;
opacity:1 !important;
filter:none !important;
}
.csd-btn,.csd-btn-primary{
margin-top:10px;min-height:40px;padding:0 12px;border-radius:12px;
display:inline-flex;align-items:center;justify-content:center;gap:8px;
font-weight:900;line-height:40px;
transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}
.csd-btn{
background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05));
box-shadow: 0 12px 28px rgba(0,0,0,.25);
}
.csd-btn-primary{
background: linear-gradient(135deg, rgba(34,211,238,.85), rgba(167,139,250,.75));
border-color: rgba(34,211,238,.55);
color:#081018;
-webkit-text-fill-color:#081018;
box-shadow: 0 18px 40px rgba(34,211,238,.18), 0 10px 22px rgba(0,0,0,.32);
}
.csd-btn:hover,.csd-btn-primary:hover{transform:translateY(-1px);box-shadow:0 18px 40px rgba(0,0,0,.32)}
.csd-btn:active,.csd-btn-primary:active{transform:translateY(0)}
.csd-btn:focus-visible,.csd-btn-primary:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(34,211,238,.22), 0 22px 70px rgba(0,0,0,.35)}
.csd-btn--compact{margin-top:0;min-height:40px;line-height:40px;font-size:13px}
.csd-preview-topbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start;margin-bottom:12px}
.csd-topbar-row{border:0;background:rgba(255,255,255,.60);border-radius:0;padding:10px 12px}
.csd-topbar-title{font-weight:900;font-size:13px;margin:0 0 8px;display:flex;align-items:center;gap:8px}
.csd-q{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:999px;border:0;color:var(--csd-muted);font-weight:900;font-size:12px;cursor:help;background:rgba(255,255,255,.65)}
.csd-inline{display:flex;align-items:flex-end;gap:10px;min-width:0}
.csd-inline-grow{flex:1;min-width:0}
.csd-inline-actions{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.csd-inline-actions .csd-btn{white-space:nowrap;margin-top:0}
.csd-size-row{display:flex;align-items:stretch;gap:8px;min-width:0}
.csd-size-row .csd-select{flex:1;min-width:0}
.csd-custom-size-anchor{position:relative}
.csd-custom-size-pop{position:absolute;left:0;top:calc(100% + 8px);width:220px;max-width:75vw;border:0;border-radius:14px;padding:10px 12px;background:rgba(255,255,255,.96);box-shadow:0 22px 80px rgba(15,23,42,.20);z-index:50;display:none}
.csd-custom-size-anchor.is-open .csd-custom-size-pop{display:block}
.csd-custom-size-pop .csd-label{margin-top:0}
.csd-mini-price{margin-top:10px;border-top:1px dashed rgba(255,255,255,.16);padding-top:10px;color:var(--csd-muted);font-size:12px;display:grid;gap:6px}
.csd-mini-price strong{font-weight:900;color:var(--csd-text)}
.csd-mini-price span{font-weight:900;float:right}
.csd-preview-surface{border-radius:0;background:transparent;border:0;overflow:hidden;position:relative;height:560px;overflow-x:hidden}
.csd-preview-layout{position:absolute;inset:0;display:grid;grid-template-columns:132px 1fr;grid-template-rows:1fr auto;gap:10px;padding:10px}
.csd-side{background:rgba(255,255,255,.70);border:0;border-radius:0;padding:10px;overflow:auto}
.csd-side-title{font-size:12px;color:var(--csd-muted);font-weight:900;margin-bottom:8px}
.csd-side--left{grid-column:1;grid-row:1 / span 2}
.csd-canvas-wrap{grid-column:2;grid-row:1}
.csd-side--right{grid-column:2;grid-row:2}
.csd-preview-layout > *{min-width:0}
.csd-side--right{max-height:none;overflow:visible;display:grid;grid-template-columns:minmax(0,1fr) 240px;grid-template-rows:auto auto auto;grid-template-areas:"title title" "swatches note" "info note";gap:8px;align-items:start}
.csd-side--right .csd-side-title{grid-area:title;margin-bottom:0}
#csd_swatches{grid-area:swatches}
#csd_color_info{grid-area:info;margin-top:0}
#csd_color_surcharge_note{grid-area:note;margin-top:0;border-top:0;padding-top:0}
.csd-icon-rail{display:grid;grid-template-columns:repeat(3, 34px);gap:8px}
.csd-icon-rail .csd-icon-btn{width:34px;height:34px;padding:0;border-radius:10px;display:grid;place-items:center;line-height:0;font-size:0;transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease}
.csd-icon-rail .csd-icon-btn:hover{transform:translateY(-1px);box-shadow:0 14px 35px rgba(0,0,0,.35);border-color:rgba(34,211,238,.35)}
.csd-icon-rail .csd-icon-btn.is-active{border-color:rgba(0,0,0,.75);box-shadow:none}
.csd-icon-rail .csd-icon-btn svg,.csd-icon-rail .csd-icon-btn img{width:18px;height:18px;display:block}
.csd-icon-rail .csd-icon-btn[data-icon="none"]{font-size:12px;line-height:1;color:var(--csd-muted);font-weight:900}
.csd-swatches--rail{display:grid;grid-template-columns:repeat(auto-fit, 24px);gap:6px;justify-content:start;align-content:start}
.csd-swatches--rail .csd-swatch{position:relative;width:28px;height:28px;border-radius:999px;background:rgba(255,255,255,.04);display:grid;place-items:center;padding:0}
.csd-swatches--rail .csd-swatch span{width:20px;height:20px;border-radius:999px;border:1px solid rgba(0,0,0,.38);display:block}
.csd-swatches--rail .csd-swatch.is-active{border-color:rgba(0,0,0,.75);box-shadow:none}
.csd-swatch-badge{position:absolute;right:-8px;top:-8px;min-width:22px;height:18px;padding:0 6px;border-radius:999px;background:rgba(34,211,238,.85);color:#081018;font-size:11px;line-height:18px;text-align:center;font-style:normal;font-weight:900;border:1px solid rgba(255,255,255,.35);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.csd-color-info{margin-top:10px;font-size:12px;color:var(--csd-muted);font-weight:900;min-height:16px}
.csd-color-surcharge-note{margin-top:10px;border-top:1px dashed rgba(255,255,255,.16);padding-top:10px;font-size:11px;color:var(--csd-muted);display:grid;gap:4px}
.csd-color-surcharge-note strong{color:var(--csd-text);font-weight:900}
.csd-canvas-wrap{position:relative;border-radius:0;overflow:hidden;border:0;background:linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.45))}
.csd-canvas-wrap::before{content:"";position:absolute;inset:-30%;background:
radial-gradient(800px 380px at 35% 20%, rgba(34,211,238,.16), rgba(34,211,238,0) 55%),
radial-gradient(900px 520px at 75% 60%, rgba(167,139,250,.14), rgba(167,139,250,0) 60%),
linear-gradient(180deg, rgba(255,255,255,.30), rgba(15,23,42,.06));
transform:rotate(-6deg);opacity:.95;pointer-events:none}
.csd-canvas-wrap::after{content:"";position:absolute;inset:0;background:
linear-gradient(120deg, rgba(255,255,255,.08), rgba(255,255,255,0) 40%),
radial-gradient(500px 260px at 20% 80%, rgba(255,255,255,.06), rgba(255,255,255,0) 60%);
opacity:.40;pointer-events:none}
#csd_canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.csd-fontbar{margin-top:10px;border:0;border-radius:0;padding:10px 12px;background:rgba(255,255,255,.70)}
.csd-fontbar-title{font-weight:900;font-size:13px;margin:0 0 8px;color:var(--csd-muted)}
.csd-fonts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:6px;max-height:220px;overflow:auto;padding:2px 4px 4px 2px}
.csd-font-btn{padding:8px 10px;border-radius:14px;text-align:left;font-weight:900;line-height:1.05;font-size:13px;transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease}
.csd-font-btn small{display:block;margin-top:3px;font-size:11px;color:var(--csd-muted);font-weight:800}
.csd-font-btn:hover{transform:translateY(-1px);box-shadow:0 14px 35px rgba(0,0,0,.35);border-color:rgba(34,211,238,.35)}
.csd-font-btn.is-active{border-color:rgba(0,0,0,.75);box-shadow:none}
.csd-font-btn:focus,.csd-font-btn:focus-visible,.csd-font-btn:active{color:var(--csd-text) !important;-webkit-text-fill-color:currentColor !important;opacity:1 !important;filter:none !important}
.csd-preview-hint{margin-top:10px;color:var(--csd-muted);font-size:12px}
.csd-panel--bottom{margin-top:10px}
.csd-panel--bottom .csd-btn,.csd-panel--bottom .csd-btn-primary{width:100%}
.csd-order-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:12px;align-items:stretch}
.csd-order-col{min-width:0}
.csd-order-col--price{display:flex;align-items:stretch;justify-content:flex-start}
.csd-order-col--price .csd-price{width:100%;max-width:440px}
.csd-order-col--cta .csd-label{margin-top:0}
.csd-order-col--cta .csd-btn,.csd-order-col--cta .csd-btn-primary{margin-top:10px}
.csd-order-col--cta .csd-form{height:100%;display:flex;flex-direction:column;border:0;border-radius:0;padding:10px 12px;background:rgba(255,255,255,.70)}
.csd-price{border:0;border-radius:0;padding:10px 12px;background:rgba(255,255,255,.70);color:var(--csd-text);font-size:13px;height:100%}
.csd-price strong{font-weight:900}
.csd-price-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;margin-top:6px}
.csd-price-row:first-child{margin-top:0}
.csd-price-sub{color:var(--csd-muted);font-size:12px;margin-top:6px}
.csd-toast{position:fixed;right:16px;bottom:16px;z-index:10050;max-width:min(360px, calc(100vw - 32px));background:rgba(255,255,255,.96);color:var(--csd-text);border-radius:14px;padding:12px 14px;border:0;box-shadow:0 22px 70px rgba(15,23,42,.18);opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .18s ease, transform .18s ease}
.csd-toast.is-show{opacity:1;transform:translateY(0)}
.csd-toast.is-success{border-color:rgba(34,197,94,.45)}
.csd-toast.is-error{border-color:rgba(239,68,68,.45)}
.csd-toast-msg{font-weight:900;font-size:13px;line-height:1.25}
.csd-tour-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:10040}
.csd-tour-card{position:fixed;max-width:min(320px, calc(100vw - 16px));background:rgba(255,255,255,.98);border:0;border-radius:14px;box-shadow:0 26px 90px rgba(15,23,42,.25);padding:12px 14px;z-index:10050}
.csd-tour-title{font-weight:900;font-size:13px;margin:0 0 6px;color:var(--csd-text)}
.csd-tour-body{font-size:12px;line-height:1.35;color:var(--csd-muted)}
.csd-tour-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:10px}
.csd-tour-actions .csd-btn{margin-top:0;min-height:36px;line-height:36px;padding:0 10px;border-radius:12px;font-size:12px}
.csd-tour-target{outline:2px solid rgba(34,211,238,.65);outline-offset:4px;border-radius:12px}
@media (max-width: 980px){
.csd-preview-surface{height:auto;overflow:visible}
.csd-preview{padding:8px}
.csd-panel{padding:8px}
.csd-preview-layout{gap:6px;padding:6px}
.csd-preview-topbar{gap:6px;margin-bottom:6px}
.csd-topbar-row{padding:6px 8px}
.csd-fonts{grid-template-columns:repeat(2,minmax(0,1fr));max-height:240px}
.csd-preview-topbar{grid-template-columns:1fr;}
.csd-inline{flex-direction:column;align-items:stretch}
.csd-inline-actions{align-items:stretch}
.csd-inline-actions .csd-btn{width:100%}
.csd-order-grid{grid-template-columns:1fr}
.csd-preview-layout{position:static;inset:auto;grid-template-columns:1fr;grid-template-rows:auto auto auto}
.csd-side--left{grid-column:1;grid-row:1}
.csd-canvas-wrap{grid-column:1;grid-row:2}
.csd-side--right{grid-column:1;grid-row:3}
.csd-side--right{grid-template-columns:1fr;grid-template-rows:auto auto auto auto;grid-template-areas:"title" "swatches" "info" "note"}
.csd-side{max-height:none;padding:8px;overflow:visible}
.csd-side-title{margin-bottom:6px}
.csd-icon-rail{display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding-bottom:4px;position:relative}
.csd-icon-rail .csd-icon-btn{flex:0 0 auto;width:32px;height:32px;border-radius:10px}
.csd-swatches--rail{display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding-bottom:4px;position:relative}
.csd-swatches--rail .csd-swatch{width:26px;height:26px}
.csd-swatches--rail .csd-swatch span{width:18px;height:18px}
.csd-canvas-wrap{min-height:190px}
}
@media (max-width: 980px){
.csd-custom-size-pop{position:fixed;left:12px;right:12px;top:auto;bottom:12px;width:auto;max-width:none;z-index:10060;max-height:70vh;overflow:auto}
.csd-icon-rail .csd-icon-btn.is-active{border-color:rgba(0,0,0,.55)}
.csd-swatches--rail .csd-swatch.is-active{border-color:rgba(0,0,0,.55)}
.csd-font-btn.is-active{border-color:rgba(0,0,0,.55)}
}
@media (max-width: 980px){
.csd-icon-rail::after,.csd-swatches--rail::after{content:"";position:sticky;right:0;top:0;align-self:stretch;width:26px;flex:0 0 26px;pointer-events:none;background:linear-gradient(90deg, rgba(248,250,252,0), rgba(248,250,252,.92))}
.csd-icon-rail::before,.csd-swatches--rail::before{content:"›";position:sticky;right:6px;top:50%;transform:translateY(-50%);align-self:center;flex:0 0 auto;pointer-events:none;color:rgba(15,23,42,.55);font-weight:900;font-size:14px;line-height:1}
}.wpa-test-msg{background: #d1ecf1 !important; border: 1px solid #bee5eb !important; border-radius: 5px !important;color: #0c5460 !important; font-size: 14px !important; padding:.75rem 1.25rem !important; font-family: Arial !important; margin-top:5px !important;}
span.wpa-button{ display: inline-block !important; padding-top: 5px !important; color: #fff !important;background-color: #6c757d !important;border-color: #6c757d !important; padding: 5px 10px !important; border-radius: 5px !important; margin-top:5px !important;  cursor: pointer !important; }
#altEmail_container, .altEmail_container{position:absolute !important; overflow: hidden !important; display: inline !important; height:1px !important; width: 1px !important;z-index:-1000 !important;}