/* V5 reference styles, followed by bindings for the existing PHP controls. */

:root{--blue:#4b6ff1;--ink:#1b2b48;--muted:#8290a9;--line:#e2eafb;--bg:#f8faff;--soft:#eff4ff;--shadow:0 12px 35px rgba(54,91,170,.07)}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 75% 0%,#edf3ff,transparent 42%),#f9fbff;font:14px/1.5 Inter,Segoe UI,Arial,sans-serif;color:var(--ink)}button,input,select{font:inherit}button{cursor:pointer}.shell{min-height:100vh;display:flex}.side{width:230px;flex-shrink:0;background:linear-gradient(170deg,#fff,#f6f9ff);border-right:1px solid var(--line);padding:22px 13px;display:flex;flex-direction:column;gap:8px}.brand{display:flex;gap:11px;align-items:center;padding:0 6px 24px;border-bottom:1px solid #e9eef8}.brand img{width:51px;height:51px;object-fit:contain;border-radius:12px}.brand strong{display:block;font-size:19px;letter-spacing:1px}.brand small{display:block;font-size:8px;letter-spacing:1.2px;font-weight:800;color:#8a99b5}.section{font-size:10px;color:#8d9db9;font-weight:900;letter-spacing:1.5px;padding:20px 12px 8px}.nav{border:1px solid transparent;background:transparent;border-radius:12px;padding:12px;color:#61718d;display:flex;gap:11px;align-items:center;text-align:left;font-weight:700}.nav i{font-style:normal;width:26px;height:26px;border-radius:9px;background:#f0f4fd;display:grid;place-items:center}.nav.active{color:#365be2;border-color:#d3dfff;background:linear-gradient(100deg,#eaf0ff,#fff);box-shadow:0 5px 14px #dfe8ff}.nav.active i{background:#6486fb;color:white}.spacer{flex:1}.foot{font-size:11px;color:#8b9bb5;padding:13px;border:1px solid var(--line);border-radius:14px;background:white}.main{flex:1;min-width:0;padding:26px clamp(16px,2.5vw,42px)}.head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.eyebrow{font-size:10px;font-weight:900;letter-spacing:1.8px;color:var(--blue)}h1{font-size:29px;margin:5px 0 4px;letter-spacing:-.9px}p{margin:0;color:var(--muted)}.pill{border:1px solid #d9e4ff;background:#fff;border-radius:100px;padding:9px 13px;font-size:12px;font-weight:800;color:#4a6fe3}.studio{display:grid;grid-template-columns:minmax(0,1.28fr) minmax(390px,.85fr);gap:19px;align-items:start}.card{background:linear-gradient(135deg,#fff 20%,#fafdff);border:1px solid #dce6fb;border-radius:22px;box-shadow:var(--shadow)}.preview{padding:18px;position:sticky;top:16px}.cardtop{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:2px 4px 14px}.cardtop b{font-size:16px}.badge{background:#e9faf4;color:#119b75;border-radius:100px;padding:7px 11px;font-weight:800;font-size:11px}.stage{height:min(61vh,630px);min-height:440px;border:1px solid #edf0f8;border-radius:18px;background:radial-gradient(ellipse at center,#fff 20%,#f2f6ff 100%);position:relative;display:grid;place-items:center;overflow:hidden}.stage:before{content:"";position:absolute;width:70%;aspect-ratio:1;border:1px solid #e7efff;border-radius:50%}.stage svg{width:min(73%,540px);max-height:78%;filter:drop-shadow(0 22px 18px #1b2e4922);z-index:1;transition:transform .2s}.stage .stage-tag{position:absolute;top:16px;left:16px;z-index:2;background:#fff;border:1px solid #e2eafd;border-radius:30px;padding:8px 12px;color:#5574d8;font-size:11px;font-weight:800}.stage .zoom{position:absolute;right:14px;bottom:16px;z-index:3;display:flex;flex-direction:column;gap:7px}.iconbtn{background:white;border:1px solid #dae5fc;border-radius:10px;min-width:37px;min-height:36px;color:#4e6ed4;font-weight:900}.toolbar{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:13px}.tool{background:#fff;border:1px solid #dfe7f7;border-radius:10px;padding:9px 14px;color:#526580;font-weight:800;font-size:12px}.tool.selected{background:#eaf0ff;color:#4569ec;border-color:#bdd0ff}.caption{text-align:center;font-size:11px;color:#98a5bc;margin-top:10px}.right{display:flex;flex-direction:column;gap:15px}.panel{padding:18px}.panel h2{font-size:16px;margin:0 0 4px}.sub{font-size:12px;color:#8795ac;margin-bottom:15px}.productgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.product{border:1px solid #e2e9f5;background:white;border-radius:11px;padding:10px 9px;color:#60708d;text-align:left;font-size:12px;font-weight:750}.product.active{background:#edf3ff;border-color:#84a3ff;color:#315de2}.tabs{display:flex;gap:5px;background:#f0f4fb;border-radius:12px;padding:5px;margin-bottom:14px}.tab{flex:1;border:0;border-radius:9px;background:transparent;color:#6b7d99;padding:10px 6px;font-weight:800;font-size:12px}.tab.active{background:white;color:#4065e8;box-shadow:0 3px 12px #d6e0f5}.row{display:flex;gap:10px;align-items:center}.field{display:block;font-size:12px;font-weight:800;margin:12px 0 6px}.input{width:100%;padding:11px 12px;border-radius:10px;border:1px solid #dce5f6;background:white;color:#2b3e5d}.muted{font-size:11px;color:#95a3b9;margin-top:6px}.swatches{display:flex;gap:8px;margin-top:9px}.swatch{height:26px;width:26px;border-radius:50%;border:3px solid white;box-shadow:0 0 0 1px #d5deed;cursor:pointer}.swatch.active{box-shadow:0 0 0 2px #6281ee}.action{display:flex;gap:9px}.primary{border:0;border-radius:11px;background:linear-gradient(110deg,#3e66eb,#6c8afa);color:white;font-weight:850;padding:13px 16px;box-shadow:0 7px 15px #4c6ff02c}.secondary{background:#fff;border:1px solid #d9e4fa;color:#4b67a8;border-radius:11px;padding:13px 16px;font-weight:800}.template{width:100%;background:white;border:1px solid #dfe7f5;border-radius:9px;padding:10px;text-align:left;margin:5px 0;color:#536788}.template.active{background:#edf3ff;border-color:#8ba8ff;color:#3e62df}.notice{padding:11px;border-radius:10px;background:#f2f6ff;color:#6a7eaa;font-size:11px}.hidden{display:none}.mini{font-size:11px;color:#7286aa}.footline{margin-top:17px;font-size:11px;color:#92a0b8;text-align:center}@media(max-width:1180px){.studio{grid-template-columns:1fr}.preview{position:static}.stage{height:520px}}@media(max-width:700px){.shell{display:block}.side{width:100%;padding:12px}.brand{padding-bottom:8px}.section,.side .nav,.spacer,.foot{display:none}.main{padding:17px}.head{align-items:flex-start}.head h1{font-size:24px}.stage{min-height:340px;height:390px}.productgrid{grid-template-columns:1fr 1fr}.panel{padding:15px}}

/* Stable studio: only the tools column scrolls on desktop. */
@media (min-width:1181px){
 html,body{height:100%;overflow:hidden}
 .shell{height:100vh;min-height:0;overflow:hidden}
 .side{height:100vh;overflow-y:auto;overscroll-behavior:contain}
 .main{height:100vh;min-height:0;display:flex;flex-direction:column;overflow:hidden}
 .head{flex:0 0 auto}
 .studio{flex:1;min-height:0;overflow:hidden;align-items:stretch}
 .preview{position:relative;top:auto;height:100%;min-height:0;display:flex;flex-direction:column}
 .stage{height:auto;min-height:0;flex:1}
 .toolbar,.caption,.cardtop{flex:0 0 auto}
 .right{height:100%;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:5px;scrollbar-width:thin;scrollbar-color:#c8d6f5 transparent}
}

/* Admin Inventory screenshot-matched color treatment */
:root{--blue:#3863ed;--ink:#192640;--muted:#8190aa;--line:#e2eaf7;--bg:#fff;--soft:#f5f8ff;--shadow:0 9px 27px rgba(29,53,99,.055)}
body{background:#fff;color:#192640}
.side{background:linear-gradient(180deg,#fff 0%,#f5f8fe 100%);border-right:1px solid #dfe8f7}
.nav{color:#233453}.nav.active{background:linear-gradient(105deg,#e9efff,#f8faff);border-color:#c7d7ff;color:#315ee7;box-shadow:0 5px 15px rgba(64,105,215,.09)}
.nav.active i{background:#6687f7;color:#fff;box-shadow:0 4px 9px rgba(69,108,222,.17)}
.card{background:linear-gradient(140deg,#fff 40%,#fbfdff);border:1px solid #e3eaf6;border-radius:19px;box-shadow:0 10px 30px rgba(37,64,109,.05)}
.stage{background:linear-gradient(145deg,#fff,#f9fbff);border-color:#e9eef7}
.stage:before{border-color:#eff3fb}
.product.active,.tool.selected,.template.active{background:#edf2ff;border-color:#bcd0ff;color:#315fe5}
.primary{background:linear-gradient(115deg,#4169ee,#6585f7)}
.pill,.iconbtn,.secondary{background:#fff;border-color:#dfe7f7}
.right{scrollbar-color:#d7e1f3 transparent}
.brand .brand-lockup{width:185px;max-width:100%;height:auto;object-fit:contain;border-radius:0;display:block}.brand{padding:0 3px 20px;justify-content:flex-start}

body.customizer-wrapper.customizer-v5 {--ink:#192640;--muted:#8190aa;--workspace-border:#e2eaf7;--workspace-blue:#3863ed;--workspace-cyan:#4b6ff1;--workspace-field:#fff;--font-serif:var(--font-sans);font:14px/1.5 Inter,"Segoe UI",Arial,sans-serif;display:block;background:#fff}
.customizer-v5 .customizer-topbar,.customizer-v5 .customizer-guest-notice {display:none}
.customizer-v5 [hidden] {display:none!important}
.customizer-v5 .studio-visually-hidden {position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.customizer-v5 .brand,.customizer-v5 .nav {color:inherit;text-decoration:none}
.customizer-v5 .brand img {background:#050505;padding:8px;flex-shrink:0}
.customizer-v5 .brand {padding:0 6px 24px;gap:11px}
.customizer-v5 .brand strong {color:#192640;font:800 19px/1.2 Inter,"Segoe UI",Arial,sans-serif;letter-spacing:1px}
.customizer-v5 .brand small {margin-top:4px;white-space:nowrap}
.customizer-v5 .nav {font:700 14px/1.5 Inter,"Segoe UI",Arial,sans-serif;color:#233453}
.customizer-v5 .nav.active {color:#315ee7}
.customizer-v5 .head h1 {font:750 29px/1.25 Inter,"Segoe UI",Arial,sans-serif;letter-spacing:-.9px;margin:5px 0 4px}
.customizer-v5 .head .pill {white-space:nowrap;flex-shrink:0}
.customizer-v5 .customizer-layout {margin:0;padding:0;width:100%;gap:19px;grid-template-columns:minmax(0,1.28fr) minmax(390px,.85fr)}
.customizer-v5 .preview-panel {padding:18px;min-width:0;min-height:0;border-radius:19px}
.customizer-v5 .preview-header {justify-content:space-between;gap:12px;margin-bottom:14px;flex:0 0 auto}
.customizer-v5 .preview-header-icon {display:none}
.customizer-v5 .preview-header-meta h2 {font:700 16px/1.4 Inter,"Segoe UI",Arial,sans-serif;color:#1b2b48;margin:0 0 3px}
.customizer-v5 .preview-header-meta p {font-size:11px;line-height:1.5;color:#8290a9}
.customizer-v5 .studio-model-status {font-size:11px;text-transform:none;letter-spacing:normal;white-space:nowrap}
.customizer-v5 .studio-model-status[data-status="loading"] {background:#edf3ff;color:#4b6ff1}
.customizer-v5 .studio-model-status[data-status="error"] {background:#fff0ed;color:#a34236;white-space:normal}
.customizer-v5 .preview-3d-wrap {border-radius:18px;transform:none;flex:1;min-height:0;background:#fff}
.customizer-v5 .preview-3d-wrap::before {display:none}
.customizer-v5 #customizer3dCanvas {position:absolute;inset:0;width:100%;height:100%;z-index:1}
.customizer-v5 .stage-tag {max-width:calc(100% - 32px);pointer-events:none}
.customizer-v5 .preview-hint {font-size:11px;line-height:1.5;margin:10px 0 0;color:#98a5bc}
.customizer-v5 .decal-toolbar {position:static;transform:none;flex:0 0 auto;display:flex;justify-content:center;flex-wrap:wrap;width:auto;max-width:100%;gap:8px;padding:0;margin:13px auto 0;border:0;background:none;box-shadow:none;backdrop-filter:none}
.customizer-v5 .decal-btn {border:1px solid #dfe7f7;border-radius:10px;padding:9px 12px;min-height:36px;font-size:12px;font-weight:800;background:#fff;color:#526580}
.customizer-v5 .decal-btn i {font-size:12px}
.customizer-v5 .decal-btn.active {background:#edf2ff;color:#315fe5;border-color:#bcd0ff}
.customizer-v5 .decal-popover {bottom:16px;padding:16px;border-radius:14px;width:300px}
.customizer-v5 .decal-popover-header,.customizer-v5 .popover-row label {font-size:12px}
.customizer-v5 .slider-badge {font-size:11px;background:#edf3ff;color:#486ad8}
.customizer-v5 .workspace-panel {padding:0;border:0;background:none;box-shadow:none;border-radius:0;min-width:0;min-height:0;scrollbar-color:#d7e1f3 transparent}
.customizer-v5 #designForm {display:flex;flex-direction:column;gap:15px}
.customizer-v5 .panel {padding:18px;min-width:0}
.customizer-v5 .panel h2 {font:700 16px/1.5 Inter,"Segoe UI",Arial,sans-serif;color:#1b2b48;margin:0 0 4px}
.customizer-v5 .panel .sub {font-size:12px;margin-bottom:15px}
.customizer-v5 .workspace-group {margin:12px 0}
.customizer-v5 .workspace-group>label {font-size:12px;line-height:1.5;color:#2b3e5d;letter-spacing:normal;margin-bottom:6px}
.customizer-v5 .workspace-group input[type="text"],.customizer-v5 .workspace-group select {height:42px;border:1px solid #dce5f6;border-radius:10px;padding:10px 12px;background:#fff;color:#2b3e5d;font-size:13px}
.customizer-v5 .workspace-group input[type="file"] {font-size:12px;min-height:43px;padding:10px;border:1px solid #dce5f6;border-radius:10px;width:100%;color:#526580}
.customizer-v5 .workspace-group input[type="range"] {accent-color:#4b6ff1}
.customizer-v5 .workspace-group-dual {gap:10px;margin-bottom:14px}
.customizer-v5 .workspace-year-field {width:100px}
.customizer-v5 .workspace-scale-field {width:120px}
.customizer-v5 .workspace-scale-value,.customizer-v5 .field-hint {font-size:11px;line-height:1.5;color:#8290a9}
.customizer-v5 .product-tabs {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.customizer-v5 .product-tab {min-width:0;min-height:43px;padding:10px 9px;border:1px solid #e2e9f5;border-radius:11px;background:#fff;color:#60708d;font-size:12px;gap:7px;justify-content:flex-start}
.customizer-v5 .product-tab span {font-size:12px;white-space:normal;line-height:1.4;text-align:left}
.customizer-v5 .product-tab.active {background:#edf2ff;border-color:#bcd0ff;color:#315fe5;box-shadow:none}
.customizer-v5 .artwork-grid {display:grid;grid-template-columns:1fr;max-height:none;overflow:visible;padding:0;gap:8px}
.customizer-v5 .artwork-card {min-height:42px;padding:10px;border:1px solid #dfe7f5;border-radius:9px;justify-content:flex-start;background:#fff}
.customizer-v5 .artwork-card span {font-size:12px;white-space:normal;color:#536788;font-weight:600}
.customizer-v5 .artwork-card.active {background:#edf3ff;border-color:#8ba8ff}
.customizer-v5 .artwork-card.active span {color:#3e62df}
.customizer-v5 .color-group-label,.customizer-v5 .combo-title,.customizer-v5 .combo-subtitle {font-size:11px}
.customizer-v5 .color-swatch {height:26px;width:26px}
.customizer-v5 .pen-set-targets button,.customizer-v5 .pen-set-open {font-size:12px;border-color:#dce5f6;background:#fff;color:#4b67a8;padding:10px 12px}
.customizer-v5 .pen-set-targets button[aria-pressed="true"] {background:#edf2ff;color:#315fe5;border-color:#bcd0ff}
.customizer-v5 .studio-summary-row {display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin:12px 0;color:#8491a9}
.customizer-v5 .studio-summary-row strong {text-align:right;color:#1b2b48;overflow-wrap:anywhere}
.customizer-v5 .studio-submit-actions {margin-top:15px;flex-wrap:wrap}
.customizer-v5 .submit-design-btn {width:auto;flex:1;min-height:44px;margin:0;font-size:12px;line-height:1.4;border-radius:11px;background:linear-gradient(115deg,#4169ee,#6585f7);box-shadow:0 7px 15px #4c6ff02c}
.customizer-v5 .submit-design-btn:disabled,.customizer-v5 button:disabled {opacity:.5;cursor:not-allowed;box-shadow:none}
.customizer-v5 .studio-design-panel .tabs button {cursor:pointer}
.customizer-v5 button:focus-visible,.customizer-v5 a:focus-visible,.customizer-v5 input:focus-visible,.customizer-v5 select:focus-visible {outline:3px solid #9fb8ff;outline-offset:2px}
@media(min-width:1181px){
 body.customizer-wrapper.customizer-v5 {height:100dvh;overflow:hidden}
 .customizer-v5 .customizer-shell {height:100dvh;min-height:0;overflow:hidden}
 .customizer-v5 .customizer-sidebar {height:100dvh;overflow-y:auto;overscroll-behavior:contain}
 .customizer-v5 .customizer-main {height:100dvh;display:flex;flex-direction:column;min-height:0;overflow:hidden}
 .customizer-v5 .customizer-layout {flex:1;min-height:0;overflow:hidden;align-items:stretch}
 .customizer-v5 .preview-panel {height:100%;display:flex;flex-direction:column;position:relative;top:0}
 .customizer-v5 .preview-3d-wrap {height:auto;flex:1;min-height:0}
 .customizer-v5 .workspace-panel {height:100%;overflow-y:auto;overscroll-behavior:contain;padding-right:5px}
}
@media(max-width:1180px){
 body.customizer-wrapper.customizer-v5 {height:auto;min-height:100vh;overflow:auto;display:block}
 .customizer-v5 .customizer-layout {grid-template-columns:minmax(0,1fr);overflow:visible;flex:none}
 .customizer-v5 .preview-panel,.customizer-v5 .workspace-panel {height:auto;overflow:visible}
 .customizer-v5 .preview-3d-wrap {height:520px;min-height:340px;flex:none}
 .customizer-v5 .customizer-sidebar {position:sticky;top:0;height:100vh;overflow-y:auto}
}
@media(max-width:700px){
 .customizer-v5 .customizer-sidebar {position:static;height:auto}
 .customizer-v5 .brand {padding-bottom:8px}
 .customizer-v5 .head {flex-wrap:wrap;gap:12px}
 .customizer-v5 .head h1 {font-size:24px}
 .customizer-v5 .preview-panel,.customizer-v5 .panel {padding:15px}
 .customizer-v5 .preview-3d-wrap {height:390px;min-height:340px}
 .customizer-v5 .decal-btn {font-size:11px;padding:8px}
 .customizer-v5 .workspace-scale-field {width:96px}
 .customizer-v5 .workspace-year-field {width:85px}
 .customizer-v5 .studio-model-status {max-width:110px}
}

/* Mirror-specific controls keep the approved workspace styling. */
.customizer-v5 .mirror-view-actions {display:flex;gap:8px;margin:8px 0 14px;flex-wrap:wrap}
.customizer-v5 .mirror-view-actions button {flex:1;min-height:40px;padding:9px;border:1px solid #dce5f6;border-radius:10px;background:#fff;color:#526580;font-size:12px}
.customizer-v5 .mirror-view-actions button[aria-pressed="true"] {background:#edf2ff;color:#315fe5;border-color:#bcd0ff}
.customizer-v5 #mirrorTiltValue {color:#8290a9;margin-left:8px;font-weight:500}

.customizer-v5 .studio-product-photo { width:38px;height:38px;flex:0 0 38px;object-fit:contain;background:#fff;border-radius:6px; }

/* Editing affordances appear only around an uploaded image; the workspace layout is unchanged. */
.artwork-interaction {position:absolute;inset:0;pointer-events:none;z-index:5;overflow:hidden}
.artwork-interaction[hidden],.artwork-handle[hidden] {display:none!important}
.artwork-interaction svg {z-index:1;width:100%;height:100%;max-height:none;max-width:none;overflow:visible;position:absolute;inset:0}
.artwork-interaction polygon {fill:transparent;stroke:transparent;stroke-width:1.5;pointer-events:all;cursor:move;touch-action:none}
.artwork-interaction.is-selected polygon,.artwork-interaction polygon:focus {stroke:#315fe5;stroke-dasharray:5 3;outline:none}
.artwork-handle {z-index:2;position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;padding:0;border:1px solid #bcd0ff;border-radius:50%;background:#fff;color:#315fe5;box-shadow:0 2px 8px #234a9a24;font-size:20px;line-height:26px;pointer-events:auto;touch-action:none;cursor:grab}
.artwork-resize {cursor:nwse-resize}
.artwork-handle:focus-visible {outline:2px solid #315fe5;outline-offset:2px}
/* Visual shape cards reuse the existing cropping selector and DEMI tokens. */
.customizer-v5 .artwork-shapes {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:8px 0 14px}
.customizer-v5 .artwork-shapes button {position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:116px;padding:9px 8px 10px;border:1px solid #dce5f6;border-radius:12px;background:#fff;color:#526580;font:600 12px Inter,sans-serif;box-shadow:0 1px 3px #234a9a05;transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease;cursor:pointer}
.customizer-v5 .shape-card-visual {display:flex;align-items:center;justify-content:center;width:100%;height:65px;flex:none;border-radius:7px;background:#f6f8fc}
.customizer-v5 .shape-thumbnail {display:block;width:48px;height:48px;flex:none;overflow:hidden;background:#dceaff;border:1px solid #c6d8f1;box-shadow:0 2px 4px #305a9b16}
.customizer-v5 .shape-thumbnail svg {display:block;width:100%;height:100%;max-width:none;max-height:none}
.customizer-v5 .shape-thumbnail-original {width:65px;height:43px;border-radius:2px}
.customizer-v5 .shape-thumbnail-square {border-radius:1px}
.customizer-v5 .shape-thumbnail-circle {border-radius:50%}
.customizer-v5 .shape-thumbnail-rounded {border-radius:11px}
.customizer-v5 .shape-card-title {color:#344662;font-size:12px;font-weight:700;line-height:1.35;text-align:center}
.customizer-v5 .shape-card-note {color:#8290a9;font-size:10px;font-weight:400;line-height:1.3;text-align:center}
.customizer-v5 .shape-card-check {position:absolute;right:7px;top:7px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#315fe5;color:#fff;font-size:12px;line-height:1;opacity:0}
.customizer-v5 .artwork-shapes button[aria-pressed="true"] {border-color:#779aee;background:#f6f9ff;box-shadow:inset 0 0 0 1px #779aee}
.customizer-v5 .artwork-shapes button[aria-pressed="true"] .shape-card-visual {background:#eaf1ff}
.customizer-v5 .artwork-shapes button[aria-pressed="true"] .shape-card-title {color:#315fe5}
.customizer-v5 .artwork-shapes button[aria-pressed="true"] .shape-card-check {opacity:1}
.customizer-v5 .artwork-shapes button:focus-visible {outline:2px solid #315fe5;outline-offset:3px}
.customizer-v5 .artwork-shapes button:disabled {opacity:.45;cursor:not-allowed;box-shadow:none}
@media(hover:hover){.customizer-v5 .artwork-shapes button:hover:not(:disabled) {border-color:#9cb7ec;box-shadow:0 3px 9px #315fe512}}
@media(max-width:400px){.customizer-v5 .artwork-shapes {gap:8px}.customizer-v5 .artwork-shapes button {padding:8px 5px;min-height:110px}.customizer-v5 .shape-card-note {font-size:9px}}
@media(prefers-reduced-motion:reduce){.customizer-v5 .artwork-shapes button {transition:none}}

/* Local image tools: scoped to the existing Mug/Tote Upload panel. */
.customizer-v5 .artwork-image-editor {margin:16px 0;padding:14px;border:1px solid #dce6f7;border-radius:12px;background:#f8fbff}
.customizer-v5 .artwork-image-editor[hidden] {display:none}
.customizer-v5 .artwork-image-editor h3 {font:700 14px/1.4 Inter,Arial,sans-serif;margin:0 0 6px;color:#233e64}
.customizer-v5 .image-edit-note,.customizer-v5 .image-edit-state,.customizer-v5 .image-edit-metrics {font-size:11px;line-height:1.55;color:#657b98;margin:5px 0 10px}
.customizer-v5 .image-edit-views {display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}
.customizer-v5 .image-edit-views figure {margin:0;min-width:0}
.customizer-v5 .image-edit-views figcaption {font-size:11px;font-weight:600;color:#4b6483;margin-bottom:5px}
.customizer-v5 .image-checker {height:100px;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid #dce6f7;border-radius:8px;background-color:#fff;background-image:linear-gradient(45deg,#e6ecf4 25%,transparent 25%),linear-gradient(-45deg,#e6ecf4 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e6ecf4 75%),linear-gradient(-45deg,transparent 75%,#e6ecf4 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}
.customizer-v5 .image-checker img {max-width:100%;max-height:100%;object-fit:contain}
.customizer-v5 .image-checker img[hidden] {display:none}
.customizer-v5 .image-edit-actions {display:flex;flex-wrap:wrap;gap:7px}
.customizer-v5 .image-edit-actions button {flex:1 1 42%;min-width:0;min-height:36px;margin:0;padding:8px;border:1px solid #d4e1f7;border-radius:8px;background:#fff;color:#315fe5;font:600 11px/1.35 Inter,Arial,sans-serif;cursor:pointer}
.customizer-v5 .image-edit-actions button:hover:not(:disabled),.customizer-v5 .image-edit-actions button[aria-pressed="true"] {background:#eaf1ff;border-color:#6c98ed}
.customizer-v5 .image-edit-actions button:focus-visible {outline:2px solid #315fe5;outline-offset:2px}
.customizer-v5 .image-edit-actions button:disabled {opacity:.45;cursor:default}
.customizer-v5 .image-edit-actions .image-remove-button {flex-basis:100%;background:#315fe5;color:#fff;border-color:#315fe5}
.customizer-v5 .image-edit-actions .image-remove-button:hover:not(:disabled) {background:#244bc1;color:#fff}
.customizer-v5 .image-edit-status {font-size:11px;line-height:1.5;color:#315078;margin:10px 0 0;overflow-wrap:anywhere}
.customizer-v5 .artwork-image-editor[aria-busy="true"] .image-edit-status::before {content:'';display:inline-block;width:9px;height:9px;margin-right:6px;border:2px solid #bed3fa;border-top-color:#315fe5;border-radius:50%;animation:image-edit-spin 1s linear infinite}
@keyframes image-edit-spin {to {transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.customizer-v5 .artwork-image-editor[aria-busy="true"] .image-edit-status::before {animation:none}}