:root{--ink:#151515;--yellow:#fbb03b;--muted:#747570;--line:#deded7;--paper:#f3f3ee}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font-family:Manrope,Arial,sans-serif;font-size:13px}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid #a36a12;outline-offset:3px}[hidden]{display:none!important}.q-header{height:93px;display:flex;align-items:center;gap:35px;padding:16px 4%;background:#fff;border-bottom:1px solid var(--line)}.q-header img{display:block;max-height:65px}.studio-label{font-size:9px;font-weight:700;letter-spacing:1.7px;border-left:1px solid #ccc;padding-left:25px}.q-header .all-quotes{margin-left:auto;font-size:10px;color:#777}.q-header .exit{font-size:10px;border-bottom:1px solid #222;padding-bottom:5px}.studio{max-width:1540px;margin:auto;padding:35px 4% 70px}.studio-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.back{font-size:10px;color:#777}.studio-top h1{font-family:'Barlow Condensed',Impact,sans-serif;font-size:60px;letter-spacing:-1px;line-height:1;margin:17px 0 8px;font-weight:600}.studio-top h1 em{font-style:normal;color:#a66913}.studio-top p{font-size:11px;color:#777;margin-bottom:0}.prototype-note{text-align:right}.prototype-note>span{display:inline-block;padding:7px 10px;border:1px solid #d0b98d;background:#fcf0d8;color:#78510d;font-size:8px;font-weight:800;letter-spacing:1px}.prototype-note p{font-size:10px;line-height:1.7}.service-tabs{display:flex;gap:30px;border-bottom:1px solid #cfcfc7;margin-bottom:30px}.service-tabs a{font-size:11px;padding:15px 0;border-bottom:3px solid transparent;font-weight:600;color:#75756d}.service-tabs a[aria-current]{border-color:#111;color:#111}.service-tabs a:hover{color:#111}.studio-grid{display:grid;grid-template-columns:minmax(0,1fr) 410px;gap:30px;align-items:start}.preview-pane{position:sticky;top:22px;min-width:0}.canvas-top{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 22px;background:#fff;border:1px solid var(--line);border-bottom:0}.micro{display:block;font-size:8px;letter-spacing:1.6px;font-weight:800;color:#8a8b83;margin-bottom:6px}.canvas-top strong{font-size:12px}.view-switch{display:flex;padding:3px;background:#efefeb;gap:3px}.view-switch button{border:0;background:transparent;padding:7px 12px;font-size:9px;color:#777}.view-switch button[aria-pressed=true]{background:#fff;color:#111;box-shadow:0 1px 4px #0001}.canvas{position:relative;overflow:hidden;border:1px solid var(--line);background-color:#eaece7;background-image:radial-gradient(#b5bbb1 1px,transparent 1px);background-size:20px 20px;min-height:450px}.canvas:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 40%,#ffffff60,transparent 70%);pointer-events:none}.canvas-caption{position:absolute;top:22px;left:24px;right:24px;display:flex;align-items:center;gap:7px;font-size:7px;letter-spacing:1.3px;font-weight:800;color:#747b70;z-index:1}.canvas-caption #canvas-state{margin-left:auto;font-weight:500}.live-dot{width:5px;height:5px;border-radius:50%;background:#5b7e63}#garment-svg{position:relative;width:100%;display:block;max-height:610px;z-index:1}.floor-shadow{fill:#9fa79b;opacity:.22}#garment-shape{stroke:#0003;stroke-width:1;transition:fill .5s}#garment-light{pointer-events:none;transition:opacity .3s}#neckline,#collar,#pockets,#seams{fill:none;stroke:#ffffff70;stroke-width:2;stroke-linejoin:round;transition:opacity .3s}#collar{fill:#ffffff12}#seams{stroke-dasharray:3 3;stroke-width:1.5}#school-crest{transition:opacity .4s,transform .4s}#school-crest>path{stroke:#fff9;stroke-width:1}#school-crest text{font-size:12px;font-weight:800;fill:#222}#set-pants path:first-child{stroke:#0003;stroke-width:1;transition:fill .5s}#set-pants path:last-child{fill:none;stroke:#ffffff60;stroke-width:2}.embroidery-wrap{cursor:grab;touch-action:none;transition:transform .3s;transform-box:fill-box}.embroidery-wrap:active{cursor:grabbing;transition:none}#embroidery-zone{fill:#ffffff0d;stroke:#fff9;stroke-width:1;stroke-dasharray:4 4}.embroidery-wrap:hover #embroidery-zone{stroke:var(--yellow);fill:#fbb03b15}#embroidery-content{filter:drop-shadow(.6px 1px 0 #0007)}#embroidery-content.raised{filter:drop-shadow(1px 2px 0 #0008) drop-shadow(-1px -1px 0 #fff5)}#width-ruler,#height-ruler{fill:none;stroke:#5f685c;stroke-width:1}#width-label,#height-label{fill:#5c6458;font-family:Manrope,Arial,sans-serif;font-size:10px;font-weight:700;paint-order:stroke;stroke:#eaece7;stroke-width:3}.is-updating #embroidery-content{animation:stitch-in .55s ease both}.is-updating #school-crest{animation:stitch-in .6s ease}.fabric-swatch{position:absolute;bottom:23px;left:23px;display:flex;align-items:center;gap:10px;z-index:2}.fabric-swatch>span{width:28px;height:28px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px #c4c6bd}.fabric-swatch small{display:block;font-size:6px;letter-spacing:1.2px;color:#84897d}.fabric-swatch strong{font-size:9px;font-weight:600}.reset-design{position:absolute;bottom:24px;right:23px;z-index:2;border:0;background:#ffffffa0;padding:9px 11px;font-size:8px;color:#62685c}.preview-foot{padding:16px 4px;display:flex;align-items:center;gap:10px;color:#777}.preview-foot>span:first-child{font-size:20px}.preview-foot p{font-size:9px;line-height:1.8;max-width:400px;margin:0}.preview-tag{font-size:7px;white-space:nowrap;margin-left:auto;letter-spacing:.8px}.preview-help{font-size:9px;color:#788170;padding:14px 0;border-top:1px solid #ddd}.options-pane{background:#fff;border:1px solid var(--line)}.options-heading{padding:25px 25px 22px;border-bottom:1px solid var(--line)}.options-heading h2{font-size:21px;font-weight:800;letter-spacing:-.7px;margin:9px 0}.options-heading p{font-size:10px;color:#888;line-height:1.8;margin:0}.option-section{padding:23px 25px;border-bottom:1px solid var(--line)}.option-section h3{font-size:12px;display:flex;align-items:center;gap:11px;margin:0 0 19px}.option-section h3>span{border:1px solid #ddd;padding:5px;font-size:8px;color:#777;font-weight:600}label{display:block;font-size:10px;font-weight:700;margin:16px 0 8px}label small{font-size:9px;color:#999;font-weight:400;margin-left:8px}input:not([type=range]):not([type=checkbox]):not([type=color]),select,textarea{width:100%;padding:12px 13px;border:1px solid #d5d5ce;border-radius:0;background:#fff;color:#222;font-size:11px;min-height:42px}select{padding-right:24px}textarea{resize:vertical}.field-hint,.section-hint{font-size:9px;line-height:1.8;color:#8a8a82;margin:9px 0}.field-error{font-size:10px;color:#ab2731}.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:15px}.two-cols>div:only-child{grid-column:1/-1}.quantity-control{display:flex;border:1px solid #d5d5ce;min-height:42px}.quantity-control button{border:0;background:#f7f7f3;width:34px;flex-shrink:0;font-size:15px}.quantity-control input{border:0!important;text-align:center;min-width:0;padding:0!important;appearance:textfield;-moz-appearance:textfield}.quantity-control input::-webkit-inner-spin-button{appearance:none}.color-options{display:flex;flex-wrap:wrap;gap:9px;margin-top:10px}.color-choice{width:29px;height:29px;border-radius:50%;border:3px solid #fff;background:var(--swatch);box-shadow:0 0 0 1px #ccc;position:relative}.color-choice[aria-pressed=true]{box-shadow:0 0 0 2px #111}.color-choice span{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.section-with-switch{display:flex;align-items:center;justify-content:space-between}.section-with-switch h3{margin:0}.switch-label{position:relative;margin:0}.switch-label input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;z-index:2}.switch-track{display:block;width:34px;height:20px;border-radius:20px;background:#d8d8d1;transition:background .25s}.switch-track:after{content:'';display:block;width:14px;height:14px;position:absolute;left:3px;top:3px;border-radius:50%;background:#fff;transition:transform .25s}.switch-label input:checked+.switch-track{background:#111}.switch-label input:checked+.switch-track:after{transform:translateX(14px)}.switch-label input:focus-visible+.switch-track{outline:2px solid #a36a12;outline-offset:3px}.design-mode{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}.design-mode button{padding:14px 10px;font-size:20px;border:1px solid #ddd;background:#fff}.design-mode button span{font-size:10px;margin-left:7px;vertical-align:middle}.design-mode button[aria-pressed=true]{border-color:#111;background:#f5f5ef}.dimensions-heading{display:flex;justify-content:space-between;align-items:center;margin-top:18px}.dimensions-heading label{margin:0}.dimensions-heading output{font-size:10px;font-weight:800;background:#f2f2ed;padding:5px 8px}.dimension-row{display:grid;grid-template-columns:38px 1fr 43px;gap:12px;align-items:center;margin-top:15px}.dimension-row label{margin:0;font-size:9px;font-weight:500}.dimension-row output{font-size:9px;color:#777;text-align:right}.dimension-row input{width:100%;accent-color:#111;cursor:pointer;height:18px}.thread-control{display:flex;align-items:center;gap:10px;border:1px solid #ddd;padding:9px}.thread-control input{width:27px;height:27px;padding:0;border:0;background:none;cursor:pointer}.thread-control>span:not(.field-hint){font-size:10px}.thread-control .field-hint{margin:0 0 0 auto;font-size:8px}.upload-zone{border:1px dashed #b6b6ad;position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px 10px;cursor:pointer;background:#f7f7f1}.upload-zone>span{font-size:25px}.upload-zone strong{font-size:10px}.upload-zone small{font-size:8px}.upload-zone input{position:absolute;inset:0;opacity:0;cursor:pointer}.quote-total{padding:25px;background:#171918;color:#fff}.total-top{display:flex;justify-content:space-between;color:#a6aaa3;font-size:7px;letter-spacing:1px}.total-top>span:last-child{letter-spacing:0;font-size:9px}.total-number{font-size:43px;font-weight:600;letter-spacing:-2px;color:#fbb03b;margin:14px 0 3px;font-variant-numeric:tabular-nums}.per-unit{font-size:9px;color:#979e93}.breakdown{border-top:1px solid #ffffff22;margin-top:20px;padding-top:14px}.breakdown>div{display:flex;justify-content:space-between;gap:10px;font-size:9px;margin:9px 0;color:#aeb5aa}.breakdown strong{font-weight:500;color:#ddd}.quote-submit{display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;background:#fbb03b;color:#171918;font-size:10px;font-weight:800;padding:18px;border:0;margin-top:20px}.quote-submit span{font-size:17px}.quote-submit:hover{background:#ffc66a}.quote-disclaimer{font-size:8px;line-height:1.9;color:#9fa59b;margin:13px 0 0}.quote-error{font-size:10px;color:#ffb6b6}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@keyframes stitch-in{0%{opacity:.15;filter:blur(2px)}50%{opacity:.75}100%{opacity:1;filter:blur(0)}}@keyframes garment-in{0%{opacity:.7;transform:translateY(3px)}100%{opacity:1;transform:translateY(0)}}@media(min-width:1500px){.studio-grid{grid-template-columns:minmax(0,1fr) 450px}.options-heading,.option-section,.quote-total{padding-left:30px;padding-right:30px}}@media(max-width:1050px){.studio-grid{grid-template-columns:minmax(0,1fr) 365px;gap:20px}.studio-label{display:none}.q-header{gap:25px}.canvas{min-height:400px}.preview-tag{display:none}.options-heading,.option-section,.quote-total{padding-left:20px;padding-right:20px}.canvas-top{padding:15px}.canvas-top strong{font-size:10px}.view-switch button{padding:7px 9px}.canvas-caption{left:16px;right:16px}.reset-design{right:15px;bottom:18px}.fabric-swatch{left:15px;bottom:16px}.preview-foot p{font-size:8px}}@media(max-width:780px){.studio{padding:26px 5% 50px}.studio-grid{grid-template-columns:1fr;gap:20px}.preview-pane{position:static}.canvas{min-height:0}#garment-svg{max-height:530px}.options-pane{width:100%}.service-tabs{gap:20px;overflow-x:auto;white-space:nowrap;margin-bottom:24px}.service-tabs a{font-size:10px;padding:13px 0}.q-header{height:80px;padding:12px 5%;gap:15px}.q-header img{width:125px}.q-header .all-quotes{font-size:8px}.q-header .exit{font-size:8px}.studio-top h1{font-size:53px}.studio-top p{font-size:10px}.prototype-note p{font-size:8px}.prototype-note>span{font-size:6px;padding:6px 7px}.canvas-top strong{font-size:12px}.preview-foot p{font-size:9px}.options-heading h2{font-size:24px}.option-section,.options-heading,.quote-total{padding:24px}.total-number{font-size:45px}}@media(max-width:420px){.q-header img{width:105px}.q-header .exit{font-size:7px}.q-header .all-quotes{font-size:7px}.q-header{gap:12px}.prototype-note{max-width:135px}.studio-top{gap:12px}.studio-top h1{font-size:48px}.studio-top p{max-width:175px;line-height:1.8}.canvas-top{padding:13px}.canvas-top strong{font-size:10px}.view-switch button{font-size:8px;padding:7px}.micro{font-size:7px}.preview-foot p{font-size:8px}.fabric-swatch small{font-size:5px}.fabric-swatch strong{font-size:8px}.reset-design{font-size:7px;padding:8px}.option-section,.options-heading,.quote-total{padding:22px}.studio-top .back{font-size:9px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:780px){.studio-grid{display:block}.preview-pane{position:sticky;top:0;z-index:4;background:var(--paper);padding-top:7px}.options-pane{margin-top:20px}#garment-svg{max-height:270px}.canvas-top{padding:10px 14px}.preview-help{display:none}.preview-foot{padding:10px 4px}.preview-foot p{font-size:8px}.fabric-swatch{bottom:12px}.reset-design{bottom:12px}.preview-pane .canvas-caption{top:12px}.service-tabs{scrollbar-width:thin}}@media(max-width:780px) and (max-height:700px){#garment-svg{max-height:220px}.preview-foot{display:none}}
.is-updating #embroidery-zone{animation:sew-guide .7s ease}.is-updating #stitch-overlay{animation:thread-build .7s ease}@keyframes sew-guide{from{stroke-dashoffset:80;stroke:#fbb03b}to{stroke-dashoffset:0;stroke:#ffffff99}}@keyframes thread-build{from{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.is-updating #embroidery-zone,.is-updating #stitch-overlay{animation:none}}

/* Foco discreto con borde neutro y acento de marca. */
input:not([type=checkbox]):not([type=radio]):not([type=range]):focus-visible,
select:focus-visible,textarea:focus-visible{outline:1px solid #77786e;outline-offset:0;border-color:#77786e;box-shadow:0 0 0 3px #fbb03b20}
select option:checked{background-color:#fbb03b;color:#111}
@media(forced-colors:active){a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid Highlight;outline-offset:2px;box-shadow:none}}

.quantity-control:focus-within{border-color:#77786e;box-shadow:0 0 0 3px #fbb03b20}.quantity-control input:focus-visible{outline:none!important;box-shadow:none!important}

/* El foco sigue la guía del bordado, sin un marco alrededor de las medidas. */
.embroidery-wrap:focus,.embroidery-wrap:focus-visible{outline:none;box-shadow:none}
.embroidery-wrap:focus-visible #embroidery-zone{stroke:var(--yellow);stroke-width:2;fill:#fbb03b15}
@media(forced-colors:active){.embroidery-wrap:focus-visible #embroidery-zone{stroke:Highlight;stroke-width:2}}

/* Controles cómodos con dedo y sin zoom automático al escribir. */
@media(pointer:coarse){
button,a.exit,a.all-quotes,.service-tabs a{min-height:44px;touch-action:manipulation}
.color-choice{width:44px;height:44px}.color-options{gap:12px}
.quantity-control button{width:44px;min-height:46px}
.view-switch button{min-width:60px;font-size:12px}
.reset-design{font-size:11px;min-height:44px}
.switch-label{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}.switch-track{position:relative}
.dimension-row input{height:44px}.dimension-row input::-webkit-slider-thumb{min-width:26px;min-height:26px}
input:not([type=range]):not([type=checkbox]):not([type=color]),select,textarea{font-size:16px;min-height:46px}
input[type=color]{min-width:44px;min-height:44px}
}
@media(max-width:780px){
.q-header{height:auto;min-height:90px;display:grid;grid-template-columns:auto 1fr;gap:4px 16px}.q-header>a:first-child{grid-row:1/3}.q-header .all-quotes,.q-header .exit{justify-self:end;font-size:11px;margin-left:0;min-height:44px;display:flex;align-items:center}.q-header .exit{padding:5px 0}
label,.field-hint,.section-hint,.options-heading p{font-size:12px}.dimension-row label,.dimension-row output{font-size:11px}.quote-disclaimer{font-size:11px}.quote-submit{font-size:12px;min-height:48px}
}
@media(max-width:420px){.two-cols{grid-template-columns:1fr}.q-header img{width:125px}}
@media(max-width:780px) and (max-height:500px){.preview-pane{position:static}}
.embroidery-wrap.is-dragging{transition:none;cursor:grabbing}

/* Reserve the gesture on the HTML canvas before a finger touches the SVG. */
.canvas.has-embroidery{touch-action:none}
#garment-svg,#garment-svg *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.embroidery-wrap{transition:none;pointer-events:none}
#embroidery-hit-area{pointer-events:all}

@media(max-width:780px){.service-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px;overflow:visible;white-space:normal}.service-tabs a{display:flex;align-items:center;font-size:12px;min-height:44px;padding:10px 0}}
.total-number.is-pending{font-size:27px;letter-spacing:-.6px;line-height:1.25;margin:18px 0 10px}.preview-toggle{display:none}
@media(max-width:780px){
 .q-header{display:flex;min-height:70px;padding:10px 5%;gap:16px}.q-header img{width:110px;max-height:50px}.q-header .all-quotes{margin-left:auto;font-size:11px}.q-header .exit{display:none}
 .studio{padding-top:12px}.studio-top{margin-bottom:12px;display:block}.studio-top h1{font-size:32px;margin:6px 0 8px;letter-spacing:-.5px}.studio-top p{max-width:none;margin:0;font-size:11px;line-height:1.6}.studio-top .back{display:inline-flex;align-items:center;min-height:32px;font-size:11px}.prototype-note{display:none}.service-tabs{margin-bottom:14px;gap:0 12px}.service-tabs a{font-size:11px}
 .preview-pane{padding-top:0}.canvas-top{padding:8px 12px;gap:8px}.canvas-top>div:first-child{min-width:0;flex:1}.view-switch{flex-shrink:0}.view-switch button{min-height:40px;padding:8px;font-size:11px}.canvas-top strong{font-size:11px;line-height:1.4}.preview-toggle{display:flex;align-items:center;justify-content:center;min-width:40px;min-height:44px;border:1px solid #ddd;background:white;font-size:22px;flex-shrink:0}.preview-pane.is-collapsed .canvas,.preview-pane.is-collapsed .preview-foot,.preview-pane.is-collapsed .preview-help{display:none}
 .options-heading{padding:16px 20px}.options-heading h2{font-size:19px;margin:0}.options-heading .micro,.options-heading p{display:none}.option-section,.quote-total{padding:18px 20px}.option-section h3{margin-bottom:14px}.two-cols{grid-template-columns:1fr 1fr;gap:12px}input:not([type=range]):not([type=checkbox]):not([type=color]),select,textarea{font-size:16px;min-height:44px}.quantity-control button{min-width:44px;min-height:44px}.color-choice{width:40px;height:40px}.reset-design{min-height:40px;font-size:10px}.dimension-row input{min-height:40px}.switch-label{min-height:44px;min-width:44px;display:flex;align-items:center;justify-content:center}.switch-track{position:relative}.field-hint,.section-hint{font-size:11px;line-height:1.65}
}
@media(max-width:360px){.two-cols{grid-template-columns:1fr}.canvas-top strong{font-size:10px}.view-switch button{font-size:10px;padding:7px}.preview-toggle{min-width:36px}}