:root{
  --bg:#f5f5f7;
  --surface:#ffffff;
  --surface-2:#f0f1f4;
  --ink:#0b0d12;
  --muted:#707580;
  --line:#e3e5e9;
  --accent:#6327ff;
  --accent-soft:#efe9ff;
  --radius:18px;
  --shadow:0 14px 38px rgba(18,23,38,.08);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}
button,input,select{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
.hidden{display:none!important}

/* Shared top navigation */
.topbar{height:58px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 22px;position:sticky;top:0;z-index:50}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.03em}
.brand-mark{width:30px;height:30px;border-radius:9px;background:#0d0f14;display:grid;place-items:center;color:#fff;font-size:14px}
.top-actions{display:flex;align-items:center;gap:10px}
.btn{border:0;border-radius:999px;padding:11px 17px;font-weight:750;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.18s ease}
.btn:hover{transform:translateY(-1px)}
.btn-dark{background:#0b0d12;color:white}
.btn-light{background:#eff0f2;color:#0b0d12}
.btn-outline{background:white;border:1px solid var(--line)}
.btn-accent{background:var(--accent);color:white}
.btn-small{padding:8px 12px;font-size:13px}

/* Landing / catalog */
.page-shell{max-width:1400px;margin:0 auto;padding:44px 34px 72px}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:42px;align-items:center;margin-bottom:48px}
.hero h1{font-size:clamp(46px,6vw,82px);line-height:.94;letter-spacing:-.065em;margin:0 0 22px;max-width:850px}
.hero p{font-size:18px;line-height:1.65;color:#5c616c;max-width:650px;margin:0 0 26px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-visual{min-height:420px;border-radius:32px;background:#111319;position:relative;overflow:hidden;box-shadow:var(--shadow)}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,rgba(0,0,0,1),rgba(0,0,0,.3))}
.hero-box{position:absolute;width:190px;height:280px;left:50%;top:48%;transform:translate(-50%,-50%) rotate(-4deg);background:#d9ec2f;border-radius:8px;box-shadow:28px 32px 60px rgba(0,0,0,.35);padding:28px 24px;display:flex;flex-direction:column;justify-content:space-between}
.hero-box:before{content:"";position:absolute;top:0;right:-38px;width:38px;height:100%;background:#b5c520;transform:skewY(-35deg);transform-origin:left top;border-radius:0 8px 8px 0}
.hero-box:after{content:"";position:absolute;left:0;top:-27px;width:100%;height:27px;background:#e9f66a;transform:skewX(-55deg);transform-origin:left bottom;border-radius:7px 7px 0 0}
.hero-box small{font-size:11px;letter-spacing:.18em;font-weight:800}.hero-box strong{font-size:25px;line-height:1.05;letter-spacing:-.04em}.hero-leaf{width:86px;height:56px;background:#5e973c;border-radius:100% 0 100% 0;transform:rotate(-38deg);align-self:center}
.hero-pill{position:absolute;background:white;border-radius:18px;box-shadow:0 20px 50px rgba(0,0,0,.28);padding:12px 15px;font-size:13px;font-weight:700}
.hero-pill.one{left:42px;top:54px}.hero-pill.two{right:36px;bottom:45px}.hero-pill.three{right:24px;top:86px;background:#efe9ff;color:#6327ff}

.section-head{display:flex;justify-content:space-between;align-items:end;margin:28px 0 20px;gap:20px}.section-head h2{font-size:32px;letter-spacing:-.04em;margin:0}.section-head p{margin:0;color:var(--muted)}
.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.product-card{background:white;border:1px solid var(--line);border-radius:22px;overflow:hidden;transition:.22s ease;display:flex;flex-direction:column}
.product-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.product-art{height:310px;background:#eceef2;display:grid;place-items:center;position:relative;overflow:hidden}
.product-art .bottle{width:62px;height:145px;border-radius:12px 12px 16px 16px;background:linear-gradient(90deg,#fff,#dfe2e8,#fff);box-shadow:0 24px 28px rgba(35,42,61,.18);position:relative}
.product-art .bottle:before{content:"";position:absolute;width:36px;height:32px;left:13px;top:-25px;border-radius:8px 8px 3px 3px;background:linear-gradient(90deg,#f7f7f7,#cdd1d8,#fff)}
.product-art .box-mini{width:104px;height:186px;border-radius:4px;background:#dbea32;position:absolute;transform:translateX(-58px) rotate(-2deg);box-shadow:0 24px 30px rgba(35,42,61,.18);padding:18px 12px;font-size:10px;font-weight:800}
.product-art .box-mini:after{content:"";width:42px;height:28px;background:#5a913f;border-radius:100% 0 100% 0;position:absolute;left:31px;top:60px;transform:rotate(-32deg)}
.product-art.jar .bottle{height:88px;width:112px;border-radius:10px 10px 24px 24px}.product-art.jar .bottle:before{width:112px;height:21px;left:0;top:-17px;border-radius:12px 12px 4px 4px;background:#111319}
.product-art.pouch:before{content:"";width:150px;height:210px;background:linear-gradient(150deg,#fc8f78,#ffcfbf);clip-path:polygon(10% 0,90% 0,100% 100%,0 100%);box-shadow:0 26px 35px rgba(35,42,61,.18)}
.product-info{padding:18px}.product-tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px}.tag{font-size:12px;background:#f1f2f4;padding:6px 8px;border-radius:7px;color:#414651}.product-info h3{margin:0 0 7px;font-size:20px;letter-spacing:-.03em}.product-info p{margin:0 0 16px;color:var(--muted);line-height:1.5}.product-meta{display:flex;align-items:center;justify-content:space-between}.price{font-size:20px;font-weight:800}

.project-strip{margin-top:54px;background:#111319;color:white;border-radius:28px;padding:28px}.project-strip .section-head{margin:0 0 18px}.project-strip .section-head p{color:#b8bbc4}.saved-projects{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.saved-card{background:#1e2128;border:1px solid #30343e;border-radius:16px;padding:14px;min-height:130px;display:flex;flex-direction:column;justify-content:space-between}.saved-card strong{display:block;margin-bottom:6px}.saved-card small{color:#b7bac3}

/* Editor */
.editor-body{height:100vh;overflow:hidden;background:#d9dade}
.editor-top{height:56px;background:#fff;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 20px;gap:16px;position:relative;z-index:20}
.editor-title{display:flex;align-items:center;gap:14px;font-size:13px}.back-link{width:34px;height:34px;display:grid;place-items:center;border-radius:50%}.back-link:hover{background:#f2f3f5}.editor-top-actions{justify-self:end;display:flex;gap:10px;align-items:center}.status-dot{width:8px;height:8px;border-radius:50%;background:#9ca1ad}.status-dot.saved{background:#41a657}
.editor-layout{height:calc(100vh - 56px);display:grid;grid-template-columns:84px 360px minmax(0,1fr);position:relative}
.tool-rail{background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:14px 8px;gap:8px;z-index:11}
.tool-button{width:68px;min-height:62px;border:0;background:transparent;border-radius:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-size:11px;color:#20232a}
.tool-button svg{width:22px;height:22px}.tool-button:hover{background:#f3f4f6}.tool-button.active{background:var(--accent-soft);color:var(--accent)}
.tool-spacer{flex:1}
.tool-panel{background:#fff;border-right:1px solid var(--line);overflow:auto;padding:28px 30px 34px;z-index:10}.panel-title{font-size:17px;margin:0 0 20px}.panel-sub{font-size:13px;color:var(--muted);line-height:1.5}.panel-section{margin-bottom:28px}.panel-label{display:block;font-size:12px;font-weight:750;margin-bottom:9px}.control{width:100%;border:1px solid var(--line);border-radius:11px;background:#fff;padding:11px 12px;outline:none}.control:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.upload-drop{height:178px;border:1px dashed #aeb3bd;border-radius:14px;display:grid;place-items:center;text-align:center;padding:24px;color:#383d47;margin-bottom:14px}.upload-drop.drag{border-color:var(--accent);background:var(--accent-soft)}
.preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.preset-card{border:1px solid var(--line);border-radius:14px;padding:8px;background:white;text-align:left}.preset-card:hover{border-color:#b3a0ff}.preset-preview{height:105px;border-radius:10px;margin-bottom:8px;position:relative;overflow:hidden}.preset-preview:after{content:"";position:absolute;width:30px;height:52px;background:#fff;border-radius:5px;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 8px 14px rgba(0,0,0,.15)}.preset-card span{font-size:12px;font-weight:700}.preset-natural{background:#ddeb34}.preset-clinical{background:linear-gradient(145deg,#fff,#dcecff)}.preset-coral{background:linear-gradient(145deg,#ff8c76,#ffe0d8)}.preset-noir{background:linear-gradient(145deg,#13151a,#565b66)}.preset-lilac{background:linear-gradient(145deg,#e9e0ff,#b69aff)}.preset-sand{background:linear-gradient(145deg,#f0dfc9,#fff8ed)}
.placeholder-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.placeholder{border:1px solid var(--line);background:#f7f7f9;border-radius:11px;padding:13px 9px;font-size:12px}.placeholder:hover{border-color:var(--accent);color:var(--accent)}
.shape-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.shape-card{height:105px;border:1px solid var(--line);border-radius:14px;background:#fff;display:grid;place-items:center}.shape-card:hover{border-color:var(--accent)}.shape-dot{width:42px;height:42px;border-radius:50%;background:#4f9447}.shape-leaf{width:62px;height:36px;border-radius:100% 0 100% 0;background:#4f9447;transform:rotate(-28deg)}.shape-blob{width:66px;height:48px;border-radius:70% 30% 60% 40% / 45% 60% 40% 55%;background:#4f9447}.shape-stripe{width:70px;height:18px;border-radius:99px;background:#4f9447}.shape-wave{font-size:54px;line-height:1;color:#4f9447;transform:rotate(-8deg)}
.color-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.swatch{aspect-ratio:1;border-radius:8px;border:1px solid rgba(0,0,0,.08)}
.layer-row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px 8px;border-radius:10px;font-size:13px}.layer-row:hover,.layer-row.active{background:#f3f0ff}.layer-grab{color:#a2a6af}.layer-actions{display:flex;gap:4px}.icon-mini{width:28px;height:28px;border:0;background:transparent;border-radius:7px}.icon-mini:hover{background:#fff}
.canvas-area{position:relative;overflow:hidden;background:#d7d8dc}.canvas-toolbar{height:58px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 26px;position:relative;z-index:4}.canvas-toolbar-left,.canvas-toolbar-right{display:flex;align-items:center;gap:10px}.mini-toggle{display:flex;align-items:center;gap:8px;font-size:12px}.toggle{width:34px;height:20px;border:0;border-radius:999px;background:#c7c9cf;padding:2px;transition:.15s}.toggle:after{content:"";display:block;width:16px;height:16px;background:#fff;border-radius:50%;transition:.15s}.toggle.on{background:var(--accent)}.toggle.on:after{transform:translateX(14px)}
.workspace{height:calc(100% - 58px);display:grid;place-items:center;padding:54px 110px 70px 80px;overflow:auto;position:relative}.artboard-wrap{position:relative;transform-origin:center}.artboard{width:760px;height:500px;background:transparent;filter:drop-shadow(0 20px 25px rgba(42,48,64,.12));user-select:none}.artboard .guide-line{stroke:#ff6b5d;stroke-width:1.4;vector-effect:non-scaling-stroke}.artboard.guides-off .guide-line,.artboard.guides-off .cut-line,.artboard.guides-off .safe-line{display:none}.cut-line{fill:none;stroke:#5a38ff;stroke-width:1.2;stroke-dasharray:5 4}.safe-line{fill:none;stroke:#6ba4ff;stroke-width:1;stroke-dasharray:3 4}.select-box{fill:none;stroke:#6427ff;stroke-width:2;stroke-dasharray:4 3;pointer-events:none}.selection-handle{fill:#6427ff;pointer-events:none}
.zoom-control{position:absolute;left:24px;bottom:18px;background:#2c2f38;color:#fff;border-radius:999px;padding:9px 12px;display:flex;gap:10px;align-items:center;font-size:12px;z-index:5}.zoom-control input{width:130px}
.right-float{position:absolute;right:18px;top:82px;z-index:7;display:flex;flex-direction:column;gap:12px;align-items:flex-end}.view-switch{background:#fff;border-radius:16px;padding:10px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px}.view-option{width:58px;height:74px;border:2px solid transparent;border-radius:12px;background:#f5f5f6;font-size:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.view-option.active{border-color:var(--accent);background:#fff}.view-icon{width:26px;height:34px;border:1px solid #b8bcc4;background:#fff;border-radius:4px}.view-icon.label{height:42px;width:18px;border-radius:6px}
.layers-drawer{width:270px;background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:14px;max-height:440px;overflow:auto}.layers-drawer h3{font-size:14px;margin:4px 6px 10px}

/* Inspector / selected element panel */
.inspector-block{border-top:1px solid var(--line);padding-top:20px;margin-top:20px}.inline-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px}.range-row{display:flex;gap:10px;align-items:center}.range-row input[type=range]{flex:1}.action-row{display:flex;gap:8px;flex-wrap:wrap}

/* Preview modal */
.modal{position:fixed;inset:0;background:rgba(8,10,15,.78);display:grid;place-items:center;z-index:100;padding:30px}.modal-card{width:min(1100px,96vw);height:min(720px,92vh);background:#0e1016;border-radius:24px;overflow:hidden;position:relative;display:grid;grid-template-columns:1fr 320px}.modal-stage{position:relative;display:grid;place-items:center;background:radial-gradient(circle at 50% 28%,#343943 0,#151820 47%,#0a0b10 100%)}.modal-close{position:absolute;right:18px;top:18px;width:42px;height:42px;border-radius:50%;border:0;background:#272a33;color:#fff;font-size:22px;z-index:2}.preview-scene{width:560px;height:480px;position:relative;perspective:1100px}.preview-box{position:absolute;width:220px;height:335px;left:120px;top:80px;transform-style:preserve-3d;transform:rotateY(-22deg) rotateX(4deg)}.box-face{position:absolute;overflow:hidden;background:#dbea32;backface-visibility:hidden}.box-front{width:220px;height:335px;transform:translateZ(48px)}.box-side{width:96px;height:335px;left:62px;transform:rotateY(90deg) translateZ(158px);filter:brightness(.82)}.box-top{width:220px;height:96px;top:119px;transform:rotateX(90deg) translateZ(167px);filter:brightness(1.12)}.box-face svg{width:100%;height:100%;display:block}.preview-bottle{position:absolute;width:92px;height:230px;right:90px;bottom:66px;background:linear-gradient(90deg,#f5f5f5,#bfc4cd,#fff);border-radius:18px 18px 24px 24px;box-shadow:0 30px 32px rgba(0,0,0,.42)}.preview-bottle:before{content:"";position:absolute;width:62px;height:52px;left:15px;top:-38px;border-radius:11px 11px 4px 4px;background:linear-gradient(90deg,#fafafa,#c8ccd4,#fff)}.preview-bottle:after{content:"";position:absolute;left:12px;right:12px;top:70px;height:95px;background:var(--preview-color,#dbea32);border-radius:3px;opacity:.94}.modal-side{background:#fff;padding:28px;display:flex;flex-direction:column}.modal-side h2{font-size:27px;letter-spacing:-.04em;margin:0 0 8px}.modal-side p{color:var(--muted);line-height:1.5;margin:0 0 20px}.preview-thumb-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.scene-thumb{height:105px;border:2px solid transparent;border-radius:12px;background:#eceef2;display:grid;place-items:center;font-size:12px;font-weight:700}.scene-thumb.active{border-color:var(--accent)}.modal-side .btn{margin-top:auto}

.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(30px);background:#101218;color:#fff;padding:12px 16px;border-radius:999px;font-size:13px;opacity:0;pointer-events:none;transition:.2s;z-index:150}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media(max-width:1100px){.hero{grid-template-columns:1fr}.hero-visual{min-height:360px}.product-grid{grid-template-columns:1fr 1fr}.saved-projects{grid-template-columns:1fr 1fr}.editor-layout{grid-template-columns:72px 300px minmax(700px,1fr)}.tool-panel{padding:22px 20px}}
@media(max-width:760px){.page-shell{padding:28px 18px 60px}.hero h1{font-size:48px}.product-grid{grid-template-columns:1fr}.saved-projects{grid-template-columns:1fr}.topbar .top-actions .btn-light{display:none}.hero-visual{min-height:320px}.hero-box{transform:translate(-50%,-50%) scale(.78) rotate(-4deg)}}

/* === MVP pro refresh === */
.editor-layout-pro{grid-template-columns:84px 360px minmax(0,1fr)}
.canvas-area-pro{display:flex;flex-direction:column}
.editor-controlbar{height:56px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 18px;gap:14px;position:relative;z-index:4;flex-wrap:nowrap}
.control-group{display:flex;align-items:center;gap:10px}
.font-toolbar{min-width:0;flex:1}
.font-toolbar .mini-control{width:auto;min-width:78px;padding:8px 10px;height:38px}
.font-toolbar #fontFamilyTop{min-width:142px}
.mini-color{width:42px;height:38px;padding:4px;border-radius:11px}
.icon-toolbar{height:38px;min-width:38px;border:1px solid var(--line);background:#fff;border-radius:11px;font-size:16px}
.icon-toolbar:hover{border-color:#b4a7ff;background:#f7f4ff}
.print-toolbar label{display:flex;align-items:center;gap:8px;font-size:12px;color:#535765}
.compact-number{width:70px;height:38px;padding:8px 10px}
.workspace-pro{height:calc(100% - 56px);position:relative;overflow:hidden;padding:0;display:block}
.workspace-grid{position:absolute;inset:0;background:radial-gradient(circle at 1px 1px, rgba(0,0,0,.045) 1px, transparent 0);background-size:22px 22px;opacity:.6}
.artboard-wrap-pan{position:absolute;left:50%;top:50%;transform:translate(0,0) scale(1);transform-origin:center center;will-change:transform}
.canvas-bottombar{position:absolute;left:24px;right:24px;bottom:18px;display:flex;justify-content:space-between;align-items:center;z-index:5;pointer-events:none}
.canvas-bottombar > *{pointer-events:auto}
.canvas-mode-group{background:#fff;border-radius:999px;padding:6px;display:flex;gap:6px;box-shadow:var(--shadow)}
.mode-btn{width:40px;height:40px;border:0;border-radius:999px;background:transparent;font-size:18px}
.mode-btn.active{background:#161820;color:#fff}
.zoom-control-pro{position:static;background:#fff;color:#111;border-radius:999px;box-shadow:var(--shadow);padding:6px 10px}
.zoom-control-pro input{width:180px}
.right-float-pro{top:78px}
.bleed-box{fill:none;stroke:#aaa;stroke-dasharray:8 6;stroke-width:1}
.guide-legend{font-size:12px;fill:#7a7f8b;font-weight:600}
.layer-row{cursor:pointer}.layer-row.dragging{opacity:.45}
.style-stack{display:grid;gap:14px}.style-preset-card{border:1px solid var(--line);background:#fff;border-radius:16px;padding:14px;text-align:left;display:flex;flex-direction:column;gap:10px}.style-preset-card.active{border-color:#7f5cff;box-shadow:0 0 0 3px rgba(127,92,255,.08)}.style-preset-card p{margin:0;color:#666;font-size:12px;line-height:1.45}.style-preset-head{display:flex;justify-content:space-between;align-items:center}.style-preview-row{display:flex;align-items:center;justify-content:space-between;gap:14px}.style-swatches{display:flex;gap:8px}.style-swatches span{width:24px;height:24px;border-radius:999px;border:1px solid rgba(0,0,0,.08);display:block}.style-preview-mini{width:84px;height:62px;border-radius:12px;position:relative;overflow:hidden;border:1px solid rgba(0,0,0,.08)}.style-preview-mini:before{content:"";position:absolute;left:50%;top:50%;width:32px;height:48px;background:#fff;border-radius:8px;transform:translate(-50%,-50%);box-shadow:0 10px 14px rgba(0,0,0,.12)}.style-preview-mini.clinical-minimal{background:linear-gradient(180deg,#f5eaee,#edeff4)}.style-preview-mini.natural-soft{background:linear-gradient(180deg,#efe7d8,#d7dcca)}.placeholder-card{display:grid;place-items:center;min-height:124px;border-style:dashed}.plus-circle{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#f4f4f8;font-size:20px;color:#5d6270}
.shape-square{width:48px;height:48px;background:#4f9447;border-radius:14px}
.export-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px}.export-card p{margin:8px 0 12px;color:#666;font-size:12px;line-height:1.5}.export-card.static{padding:18px}.export-tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.export-tags span{padding:5px 8px;border-radius:999px;background:#f2f3f6;font-size:11px;font-weight:700;color:#5a5f6c}
textarea.control{resize:vertical;min-height:92px}
.preview-modal-card{width:min(1320px,96vw);height:min(840px,94vh);grid-template-columns:minmax(0,1fr) 370px}
.preview-modal-stage{background:#0d0f14;overflow:hidden;position:relative}
.preview-scene-large{width:100%;height:100%;position:relative;display:grid;place-items:center;padding:40px}
.preview-scene-canvas{width:100%;height:100%;border-radius:30px;position:relative;overflow:hidden;background:linear-gradient(180deg,var(--scene-bg),var(--scene-floor))}
.preview-scene-canvas:before{content:"";position:absolute;inset:auto 0 0 0;height:42%;background:linear-gradient(180deg, transparent, rgba(0,0,0,.08))}
.preview-scene-canvas:after{content:"";position:absolute;left:12%;right:12%;bottom:12%;height:12%;background:radial-gradient(ellipse at center, rgba(0,0,0,.18), transparent 70%)}
.preview-scene-canvas[data-scene="bathroom-shelf"]:before,.preview-scene-canvas[data-scene="clean-tiles"]:before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;background-image:linear-gradient(to right, rgba(255,255,255,.55) 1px, transparent 1px), linear-gradient(to bottom, rgba(255,255,255,.55) 1px, transparent 1px);background-size:90px 90px;opacity:.55}
.preview-scene-canvas[data-scene="desert-sand"]:after{background:radial-gradient(ellipse at center, rgba(0,0,0,.16), transparent 70%), linear-gradient(180deg, transparent, rgba(111,84,60,.18));height:22%;bottom:10%}
.preview-scene-canvas[data-scene="botanical"]{background:linear-gradient(180deg,#dfe9da,#bccab6)}
.preview-scene-canvas[data-scene="night-stone"]{background:linear-gradient(180deg,#2f3439,#0f1317)}
.preview-scene-canvas[data-scene="night-stone"]:before{content:"";position:absolute;left:0;right:0;bottom:0;height:44%;background:linear-gradient(180deg, transparent, rgba(0,0,0,.55))}
.preview-box-box{position:absolute;left:24%;top:22%;width:280px;height:410px;transform-style:preserve-3d;transform:rotateY(-24deg) rotateX(6deg)}
.preview-box-box .box-face{position:absolute;overflow:hidden;backface-visibility:hidden;box-shadow:0 26px 30px rgba(0,0,0,.18)}
.preview-box-box .box-front{width:280px;height:410px;transform:translateZ(56px)}
.preview-box-box .box-side{width:118px;height:410px;left:81px;transform:rotateY(90deg) translateZ(199px);filter:brightness(.84)}
.preview-box-box .box-top{width:280px;height:118px;top:146px;transform:rotateX(90deg) translateZ(205px);filter:brightness(1.08);background:#fff}
.preview-box-box .box-face svg{width:100%;height:100%;display:block}
.preview-bottle{position:absolute;right:17%;bottom:18%;width:145px;height:350px;border-radius:30px 30px 34px 34px;background:linear-gradient(90deg,#ffffff,#d2d7df,#ffffff);box-shadow:0 26px 30px rgba(0,0,0,.22)}
.preview-bottle:before{content:"";position:absolute;left:24px;right:24px;top:-72px;height:92px;border-radius:18px 18px 10px 10px;background:linear-gradient(90deg,#ffffff,#d2d7df,#ffffff);box-shadow:0 10px 16px rgba(0,0,0,.12)}
.preview-bottle-label{position:absolute;left:16px;right:16px;top:106px;height:170px;background:#fff;border-radius:8px;overflow:hidden}
.preview-bottle-label svg{width:100%;height:100%;display:block}
.preview-side h2{font-size:24px;margin-bottom:16px}.preview-side h3{font-size:15px;margin:0 0 12px}
.scene-card{border:1px solid var(--line);background:#fff;border-radius:14px;padding:8px;text-align:left;display:flex;gap:10px;align-items:center;font-size:12px;font-weight:700}.scene-card.active{border-color:#7655ff;box-shadow:0 0 0 3px rgba(118,85,255,.08)}.scene-thumb-visual{width:82px;height:66px;border-radius:10px;background:linear-gradient(180deg,var(--thumb-a),var(--thumb-b));position:relative;overflow:hidden}.scene-thumb-visual:before{content:"";position:absolute;left:50%;top:50%;width:22px;height:34px;background:#fff;border-radius:6px;transform:translate(-50%,-50%)}.scene-thumb-visual:after{content:"";position:absolute;left:8px;right:8px;bottom:10px;height:12px;border-radius:999px;background:rgba(0,0,0,.12)}
.preview-thumb-grid{display:grid;grid-template-columns:1fr;gap:10px;max-height:300px;overflow:auto;margin-bottom:20px}
.export-grid{display:grid;gap:12px}.preview-side{overflow:auto}
.stage-nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border:0;border-radius:18px;background:rgba(33,35,43,.82);color:#fff;font-size:20px;z-index:3}.stage-nav.prev{left:22px}.stage-nav.next{right:22px}
.space-pan{cursor:grab}
#previewStageWrap .modal-close{background:#1e2230}
@media(max-width:1280px){.editor-controlbar{height:auto;padding:12px;flex-wrap:wrap}.workspace-pro{height:calc(100% - 82px)}.print-toolbar{margin-left:auto}.preview-modal-card{grid-template-columns:1fr}.preview-side{max-height:38vh}}

/* === Label Studio MVP v3 === */
.landing-body{background:#f6f6f8}.landing-topbar{position:relative}.landing-shell{max-width:1480px;margin:auto;padding:54px 34px 80px}.landing-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center;min-height:650px}.landing-copy h1{font-size:clamp(54px,6.5vw,94px);line-height:.94;letter-spacing:-.07em;margin:14px 0 24px;max-width:900px}.landing-copy>p{font-size:19px;line-height:1.65;color:#5c616c;max-width:680px}.eyebrow{font-size:12px;font-weight:850;letter-spacing:.18em;color:#6327ff}.landing-points{display:flex;gap:22px;flex-wrap:wrap;margin-top:26px;color:#555b66;font-size:13px;font-weight:700}.landing-product-visual{height:570px;border-radius:36px;background:#101219;position:relative;overflow:hidden;box-shadow:0 30px 70px rgba(17,19,26,.18)}.landing-stage-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:36px 36px;mask-image:linear-gradient(to bottom,#000,transparent)}.landing-package{position:absolute;width:220px;height:340px;left:43%;top:48%;transform:translate(-50%,-50%) rotateY(-10deg) rotate(-3deg);background:#efe7d8;border-radius:10px;box-shadow:35px 45px 55px rgba(0,0,0,.38);padding:32px 25px;display:flex;flex-direction:column;justify-content:space-between}.landing-package:after{content:"";position:absolute;right:-42px;top:12px;width:42px;height:100%;background:#d1c3ab;transform:skewY(-32deg);transform-origin:left top;border-radius:0 8px 8px 0}.landing-package small{font-size:10px;font-weight:800;letter-spacing:.14em}.landing-package strong{font-size:25px;line-height:1.03;letter-spacing:-.04em}.landing-leaf{width:92px;height:125px;align-self:center;background:#5b8f4c;clip-path:path('M18 115C15 60 44 18 92 8c1 51-24 101-74 107Z')}.landing-bottle{position:absolute;width:104px;height:270px;right:18%;bottom:18%;border-radius:22px 22px 28px 28px;background:linear-gradient(90deg,#fff,#d2d6dd,#fff);box-shadow:0 30px 38px rgba(0,0,0,.35);display:grid;place-items:center;text-align:center;font-weight:900;font-size:13px}.landing-bottle:before{content:"";position:absolute;top:-52px;width:64px;height:72px;border-radius:12px;background:linear-gradient(90deg,#fff,#d2d6dd,#fff)}.floating-card{position:absolute;background:#fff;padding:13px 16px;border-radius:16px;font-size:13px;font-weight:800;box-shadow:0 18px 36px rgba(0,0,0,.3)}.floating-card.one{left:28px;top:54px}.floating-card.two{right:28px;bottom:42px;color:#6327ff}.landing-features{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px}.landing-features article{background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px}.landing-features article>span{font-size:12px;font-weight:900;color:#6327ff}.landing-features h3{font-size:21px;margin:18px 0 8px}.landing-features p{color:#6a6f79;line-height:1.55;margin:0}
.auth-modal{position:fixed;inset:0;background:rgba(8,10,15,.72);z-index:200;display:grid;place-items:center;padding:24px}.auth-card{width:min(470px,94vw);background:#fff;border-radius:24px;padding:24px;position:relative;box-shadow:0 30px 80px rgba(0,0,0,.3)}.auth-close{right:18px;top:16px;background:#f0f1f4;color:#111}.auth-tabs{display:flex;background:#f1f2f4;border-radius:999px;padding:5px;margin-bottom:24px}.auth-tab{flex:1;border:0;border-radius:999px;padding:10px;background:transparent;font-weight:800}.auth-tab.active{background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.08)}.auth-form{display:grid;gap:14px}.auth-form h2{margin:4px 0 0;font-size:31px;letter-spacing:-.04em}.auth-form p{margin:0;color:#6d727e;line-height:1.5}.auth-form label{display:grid;gap:7px;font-size:12px;font-weight:800}.auth-message{color:#bd2438;font-size:13px;min-height:18px}.auth-note{font-size:11px;color:#888d96;margin:10px 0 0}.dashboard-shell{padding-top:36px}.dashboard-intro{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px}.dashboard-intro h1{font-size:54px;margin:8px 0 6px;letter-spacing:-.055em}.dashboard-intro p{color:#6e737e;margin:0}.dashboard-user>span{font-size:13px;font-weight:800;color:#565b65}

.editor-layout-v3{grid-template-columns:84px 330px minmax(0,1fr)}.canvas-area-v3{display:flex;flex-direction:column;background:#d7d8dc}.editor-controlbar-v3{height:58px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 14px;gap:12px;position:relative;z-index:12}.context-toolbar{display:flex;align-items:center;gap:7px;min-width:0;overflow-x:auto;flex:1;padding:4px 0}.context-empty{font-size:12px;color:#777c87;white-space:nowrap}.toolbar-field{display:flex;align-items:center;gap:5px;font-size:10px;font-weight:800;color:#666b75;white-space:nowrap}.toolbar-input{height:36px;border:1px solid var(--line);border-radius:9px;background:#fff;padding:6px 8px;min-width:80px;font-size:12px}.toolbar-input.short{width:64px;min-width:64px}.toolbar-input.wide{width:126px}.toolbar-color{width:36px;height:36px;border:1px solid var(--line);border-radius:9px;padding:3px;background:#fff}.icon-toolbar.active{background:#14171d;color:#fff;border-color:#14171d}.print-menu-wrap{position:relative}.print-popover{position:absolute;right:0;top:46px;width:310px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 22px 60px rgba(22,28,42,.2);padding:16px;z-index:40}.print-popover-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.unit-control{display:grid;grid-template-columns:1fr 42px;border:1px solid var(--line);border-radius:11px;overflow:hidden}.unit-control .control{border:0;border-radius:0}.unit-control span{display:grid;place-items:center;background:#f3f4f6;font-size:11px;color:#626773}.check-row{display:flex;align-items:center;gap:8px;font-size:12px;color:#565b65;margin:15px 0}.print-actions{display:grid;gap:8px}.workspace-v3{height:calc(100% - 58px);position:relative;overflow:hidden;padding:0;display:grid;place-items:center;touch-action:none}.artboard-shell{width:min(1000px,calc(100% - 170px));aspect-ratio:1000/660;position:relative;z-index:2}.artboard-v3{display:block;width:100%;height:100%;background:transparent;filter:drop-shadow(0 18px 22px rgba(42,48,64,.10));user-select:none}.workspace-v3.is-panning,.workspace-v3.temporary-pan{cursor:move}.workspace-v3.is-panning .artboard-v3,.workspace-v3.temporary-pan .artboard-v3{cursor:move}.mode-btn svg{width:20px;height:20px}.bleed-band{fill:none;stroke:#8168ff;opacity:.14;stroke-linejoin:round}.bleed-guide{fill:none;stroke:#8168ff;stroke-dasharray:5 4}.safe-line.secondary{opacity:.75}.drawer-head{display:flex;justify-content:space-between;align-items:baseline;padding:4px 6px 10px}.drawer-head h3{margin:0}.drawer-head small{color:#8a8e97}.preset-layout-preview{height:128px;border-radius:13px;position:relative;overflow:hidden;border:1px solid rgba(0,0,0,.07);background:#f5eaee}.preset-layout-preview .mini-brand,.preset-layout-preview .mini-title{position:absolute;font-size:9px;font-weight:900;line-height:1.05}.preset-layout-preview.clinical-minimal .mini-brand{left:50%;top:18px;transform:translateX(-50%)}.preset-layout-preview.clinical-minimal .mini-title{left:50%;top:67px;transform:translateX(-50%);text-align:center}.preset-layout-preview.clinical-minimal i{position:absolute;width:46px;height:46px;border:9px solid #efb0c2;border-radius:50%;left:50%;top:45%;transform:translate(-50%,-50%)}.preset-layout-preview.natural-soft{background:#efe7d8}.preset-layout-preview.natural-soft .mini-brand{left:16px;top:18px}.preset-layout-preview.natural-soft .mini-title{left:16px;bottom:22px;font-family:Georgia,serif;font-size:11px}.preset-layout-preview.natural-soft i{position:absolute;right:22px;top:25px;width:36px;height:72px;background:#5b8f4c;border-radius:90% 0 90% 0;transform:rotate(-18deg)}.shape-asset-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.shape-asset-card{height:124px;border:1px solid var(--line);border-radius:15px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:750}.shape-asset-card:hover{border-color:#7455ff;background:#faf8ff}.shape-asset-card img{width:60px;height:70px;object-fit:contain}.info-list{padding-left:18px}.info-list li{margin-bottom:10px}.layers-drawer{width:290px}.right-float-pro{top:76px}.canvas-bottombar{left:22px;right:22px}.zoom-control-pro{min-width:370px}.zoom-control-pro input{width:190px}.preview-side .export-panel{margin-top:auto;background:#f7f7f9;border-radius:16px;padding:16px}

@media(max-width:1250px){.editor-layout-v3{grid-template-columns:72px 280px minmax(680px,1fr)}.editor-controlbar-v3{height:auto;min-height:58px;flex-wrap:wrap;padding:10px}.workspace-v3{height:calc(100% - 86px)}.landing-hero{grid-template-columns:1fr}.landing-product-visual{min-height:520px}.landing-features{grid-template-columns:1fr}}
@media(max-width:760px){.landing-shell{padding:34px 18px}.landing-copy h1{font-size:52px}.landing-product-visual{height:440px}.dashboard-intro{align-items:start;flex-direction:column}.dashboard-user>span{display:none}}

/* --- v4 fixes --- */
.preview-scene-backdrop{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.92;pointer-events:none}
.preview-box-box{z-index:2}
.preview-bottle{z-index:2;position:absolute}
.preview-bottle-label{position:absolute;overflow:hidden;border-radius:4px;background:#fff;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
.preview-bottle-label svg{width:100%;height:100%;display:block}
.scene-card{display:grid;grid-template-columns:1fr;gap:8px;align-items:start;padding:10px;text-align:left}
.scene-thumb-visual{width:100%;aspect-ratio:1/1;height:auto;border-radius:14px;background-size:cover;background-position:center}
.scene-card span{font-size:12px;font-weight:800;line-height:1.2}
.symbol-asset-grid .shape-asset-card{height:112px}
.symbol-preview{width:54px;height:54px;border-radius:14px;border:1px dashed #c8cbd3;display:grid;place-items:center;font-size:10px;font-weight:800;color:#444;text-align:center;padding:6px}
.artboard-shell.label-view{width:min(760px,calc(100% - 170px));aspect-ratio:360/420}
.hidden{display:none !important}

/* --- v5 canvas and contextual layout controls --- */
.workspace-v3{display:block;position:relative;overflow:hidden}
.artboard-shell,.artboard-shell.label-view{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;max-width:none}
.artboard-v3{width:100%;height:100%;filter:none}
.workspace-grid{z-index:0}
.canvas-bottombar,.right-float-pro{z-index:20}
.context-toolbar{overflow-x:auto;overflow-y:visible;gap:10px;scrollbar-width:thin}
.context-section{display:flex;align-items:center;gap:7px;padding:4px 9px;border:1px solid #e7e8ec;border-radius:12px;background:#fbfbfc;white-space:nowrap;min-height:42px}
.context-label{font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#7b808a;margin-right:2px}
.surface-section{padding-right:14px}.surface-hint{font-size:12px;color:#777d88}
.typography-section{background:#fff}
.font-size-input{width:66px;min-width:66px}.weight-input{min-width:90px}.fit-input{min-width:145px}
.text-align-group,.layout-button-group,.nudge-button-group{display:flex;align-items:center;gap:3px;padding:3px;border-radius:9px;background:#f0f1f4}
.layout-icon{width:30px;height:30px;border:0;border-radius:7px;background:transparent;color:#333842;font-size:14px;display:grid;place-items:center}
.layout-icon:hover{background:#fff;box-shadow:0 2px 7px rgba(0,0,0,.08)}
.layout-icon.active{background:#16191f;color:#fff}
.layout-icon.subtle{font-size:13px;color:#5e6470}
.exact-position{position:relative}
.exact-position summary{list-style:none;cursor:pointer;border:0;background:#fff;border-radius:8px;padding:8px 10px;font-size:11px;font-weight:800;color:#585e69}
.exact-position summary::-webkit-details-marker{display:none}
.exact-position-pop{position:fixed;margin-top:8px;z-index:80;background:#fff;border:1px solid #e1e3e8;border-radius:14px;padding:12px;box-shadow:0 18px 40px rgba(20,24,34,.18);display:grid;grid-template-columns:1fr 1fr;gap:8px}
.exact-position-pop label{display:grid;gap:5px;font-size:10px;font-weight:800;color:#656a74}
.size-section{gap:6px}.dimension-field{display:flex;align-items:center;gap:5px;font-size:10px;font-weight:800;color:#686e78}.dimension-field span{min-width:35px}
.aspect-lock{width:34px;height:34px;border:1px solid #dddfe5;background:#fff;border-radius:9px;font-size:18px;color:#7a808b}.aspect-lock.active{background:#171a20;color:#fff;border-color:#171a20}
.fit-surface-btn{height:34px;border:1px solid #dedfe5;background:#fff;border-radius:9px;padding:0 10px;font-size:11px;font-weight:800;color:#555b66}
.fit-surface-btn:hover{border-color:#7d60ff;color:#5e39f4}
.rotate-section{gap:6px}.rotation-range{width:88px;accent-color:#6c42ff}.rotation-number{width:58px;min-width:58px}.degree-mark{font-size:12px;color:#6a707b;margin-left:-4px}
.context-actions{display:flex;gap:5px;align-items:center}.icon-toolbar.danger:hover{border-color:#f0a4aa;background:#fff1f2;color:#b51f2c}
.appearance-section,.surface-section{background:#fff}.color-chip,.stroke-field,.opacity-field{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:800;color:#676d77}.stroke-input{width:58px;min-width:58px}
.opacity-field .rotation-range{width:90px}
.editor-controlbar-v3{overflow:visible}
.canvas-area-v3{min-width:0}
@media(max-width:1350px){.context-section{padding:3px 7px}.layout-icon{width:28px}.rotation-range{width:70px}.surface-hint{display:none}}
.preview-thumb-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-height:430px;overflow-y:auto;overflow-x:hidden;padding-right:3px}
.scene-card{min-width:0;width:100%;padding:7px;gap:6px}
.scene-thumb-visual{width:100%;aspect-ratio:1/1;min-width:0}
.scene-card span{white-space:normal;overflow-wrap:anywhere}
.editor-controlbar-v3{height:auto;min-height:58px;align-items:flex-start;padding:7px 14px}
.context-toolbar{flex-wrap:wrap;overflow:visible;align-content:center}
.canvas-toolbar-right{padding-top:2px;flex-shrink:0}
.workspace-v3{height:auto;flex:1;min-height:0}
.size-details{position:relative}
.size-details summary{list-style:none;cursor:pointer;height:34px;display:flex;align-items:center;border:1px solid #dedfe5;background:#fff;border-radius:9px;padding:0 10px;font-size:11px;font-weight:800;color:#555b66}
.size-details summary::-webkit-details-marker{display:none}
.size-details-pop{position:absolute;top:42px;right:0;z-index:90;background:#fff;border:1px solid #dedfe5;border-radius:14px;padding:12px;box-shadow:0 18px 40px rgba(20,24,34,.18);display:grid;grid-template-columns:1fr 1fr;gap:10px}
.size-details-pop label{display:grid;gap:5px;font-size:10px;font-weight:800;color:#656a74}

/* === Label Studio MVP v6 UI === */
iconify-icon{display:inline-block;width:1em;height:1em;vertical-align:-.12em;pointer-events:none}
.tool-button iconify-icon{font-size:24px}
.icon-btn-label{display:inline-flex;align-items:center;justify-content:center;gap:7px}
.icon-btn-label iconify-icon{font-size:18px}
.editor-top-actions{position:relative}
.top-print-menu{position:relative}
.top-print-menu .print-popover{top:44px;right:0}
.toolbar-action-btn{width:38px;height:38px;border:1px solid var(--line);background:#fff;border-radius:11px;display:grid;place-items:center;font-size:19px;color:#272b34;transition:.16s}
.toolbar-action-btn:hover{border-color:#9d8cff;background:#f7f5ff;color:#5e3be8;transform:translateY(-1px)}
.print-visibility-title{font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.08em;color:#8b909b;margin:16px 0 8px}
.print-popover .check-row{margin:8px 0;padding:7px 8px;border-radius:9px;background:#f7f8fa}
.print-popover .check-row:hover{background:#f0edff}
.print-popover .check-row input{accent-color:#6d4aff}

/* Pickr */
.pickr-trigger{height:38px;min-width:38px;padding:4px 9px;border:1px solid var(--line);border-radius:11px;background:#fff;display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:750;color:#555b66;cursor:pointer;white-space:nowrap}
.pickr-trigger:hover{border-color:#8e78ff;box-shadow:0 0 0 3px rgba(109,74,255,.08)}
.pickr-trigger:disabled{opacity:.45;cursor:not-allowed}
.pickr-swatch{display:block;width:24px;height:24px;border-radius:8px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12),0 2px 5px rgba(0,0,0,.1)}
.pcr-app{z-index:500!important;border-radius:16px!important;box-shadow:0 24px 60px rgba(17,21,31,.24)!important}
.pcr-app .pcr-save{background:#171a21!important;border-radius:8px!important}
.pcr-app .pcr-interaction input{border-radius:8px!important}

/* Select2 in contextual toolbar */
.context-toolbar .select2-container{font-size:12px;flex:0 0 auto}
.context-toolbar .select2-container .select2-selection--single{height:38px;border:1px solid var(--line);border-radius:10px;background:#fff}
.context-toolbar .select2-container--default .select2-selection--single .select2-selection__rendered{line-height:36px;padding-left:11px;color:#282c34}
.context-toolbar .select2-container--default .select2-selection--single .select2-selection__arrow{height:36px;right:5px}
.select2-dropdown{z-index:460;border:1px solid #d8dae1;border-radius:12px;overflow:hidden;box-shadow:0 16px 40px rgba(20,24,34,.14)}
.select2-search--dropdown .select2-search__field{border:1px solid #dddfe6!important;border-radius:8px;padding:8px!important}
.select2-results__option{font-size:12px;padding:9px 11px}
.select2-container--default .select2-results__option--highlighted[aria-selected]{background:#6845ec}

/* Contextual text editing */
.text-content-section{min-width:230px;max-width:310px}
.toolbar-text-editor{width:240px;min-height:38px;max-height:70px;resize:none;border:1px solid var(--line);border-radius:10px;padding:8px 10px;font:600 12px/1.35 inherit;outline:none;background:#fff}
.toolbar-text-editor:focus{border-color:#7758f3;box-shadow:0 0 0 3px rgba(119,88,243,.1)}
.context-section.is-locked{opacity:.55}
.context-section.is-locked::after{content:"Locked";font-size:9px;font-weight:850;color:#7558e7;background:#eee9ff;padding:3px 6px;border-radius:999px;margin-left:3px}
.text-style-group,.text-align-group{display:flex;align-items:center;gap:4px}
.text-actions-section{display:flex;align-items:center;gap:6px}
.layout-icon iconify-icon,.icon-toolbar iconify-icon,.mode-btn iconify-icon,.icon-mini iconify-icon{font-size:18px}
.icon-toolbar.active{background:#171a21;color:#fff;border-color:#171a21}
.icon-toolbar.danger{color:#b52737}
.icon-toolbar.danger:hover,.icon-mini.danger:hover{background:#fff0f2;color:#cf1f36;border-color:#f0abb5}
.fit-surface-btn{height:36px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:0 10px;display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:750}
.size-details summary{display:inline-flex;align-items:center;gap:5px}

/* Layers + Draggable */
.layer-row{grid-template-columns:32px minmax(0,1fr) auto;min-height:44px;border:1px solid transparent}
.layer-row.locked{background:#faf9ff;color:#727785}
.layer-row.active{border-color:#d5caff;background:#f4f1ff}
.layer-grab{width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:#9a9fab;cursor:grab;display:grid;place-items:center}
.layer-grab:active{cursor:grabbing}
.layer-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.layer-actions{gap:2px}
.draggable-mirror{z-index:700!important;background:#fff!important;border:1px solid #8a70ff!important;border-radius:11px!important;box-shadow:0 18px 45px rgba(30,35,50,.22)!important;opacity:.95!important}
.draggable-source--is-dragging{opacity:.25}

/* Modern zoom control */
.zoom-control-pro{min-width:390px;padding:7px 9px;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.75);box-shadow:0 13px 36px rgba(32,38,52,.16)}
.zoom-control-pro #zoomLabel{min-width:48px;font-weight:850;color:#313640;text-align:center}
.zoom-control-pro input[type=range]{appearance:none;-webkit-appearance:none;width:190px;height:6px;border-radius:999px;background:linear-gradient(90deg,#6845ec 0%,#8c72ff 35%,#e1dafa 35%,#e1dafa 100%);outline:none}
.zoom-control-pro input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:4px solid #6845ec;box-shadow:0 3px 8px rgba(70,45,170,.32);cursor:pointer;transition:.15s}
.zoom-control-pro input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.12)}
.zoom-control-pro input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#fff;border:4px solid #6845ec;box-shadow:0 3px 8px rgba(70,45,170,.32);cursor:pointer}
.zoom-control-pro .icon-mini{width:34px;height:34px;border:1px solid #e1e2e7;background:#fff}
.mode-btn{display:grid;place-items:center}
.mode-btn iconify-icon{font-size:20px}

/* SweetAlert print controls */
.swal-print-options{text-align:left;display:grid;gap:9px;margin-top:12px}
.swal-print-options>p{color:#6a707b;font-size:13px;margin:0 0 5px}
.swal-print-options label{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#f6f7f9;border-radius:10px;font-size:13px;font-weight:700;color:#414650}
.swal-print-options input{accent-color:#6845ec;width:17px;height:17px}
.swal2-popup{border-radius:20px!important}
.swal2-confirm,.swal2-cancel{border-radius:10px!important}

@media(max-width:1450px){
  .toolbar-text-editor{width:190px}
  .text-content-section{min-width:190px}
  .context-toolbar{gap:6px}
}

/* Canvas overlays must never block selecting or dragging artwork. */
#guides,#selectionLayer,#bleedArtwork,#labelArtwork{pointer-events:none}
#designLayer{pointer-events:auto}

/* === Label Studio MVP v7 refinements === */
.tool-panel-shell{position:relative;min-width:0;height:100%;background:#fff;border-right:1px solid var(--line);transition:opacity .18s ease,transform .18s ease}
.tool-panel-shell .tool-panel{height:100%;border-right:0;padding-top:56px}
.tool-panel-close{position:absolute;right:12px;top:12px;z-index:20;width:32px;height:32px;border:1px solid #e2e3e8;border-radius:10px;background:#fff;color:#5c626e;display:grid;place-items:center;font-size:20px;box-shadow:0 5px 14px rgba(30,35,48,.08)}
.tool-panel-close:hover{border-color:#8f78ff;color:#5e39e9;background:#f7f5ff}
.editor-layout-v3{transition:grid-template-columns .2s ease}
.editor-layout-v3.panel-collapsed{grid-template-columns:84px 0 minmax(0,1fr)}
.editor-layout-v3.panel-collapsed .tool-panel-shell{opacity:0;transform:translateX(-16px);pointer-events:none;overflow:hidden;border-right:0}

.compact-style-stack{gap:12px}
.style-preset-card.compact-preset{padding:9px;gap:9px;border-radius:16px}
.compact-preset .preset-layout-preview{height:148px;margin:0}
.compact-preset>strong{font-size:13px;letter-spacing:-.01em;padding:1px 3px 3px}
.compact-preset:hover{border-color:#8268f5;transform:translateY(-1px);box-shadow:0 10px 24px rgba(50,42,92,.09)}

.text-preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.text-preset-card{min-height:92px;border:1px solid var(--line);border-radius:15px;background:#fff;padding:13px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:12px;text-align:left;color:#303640;transition:.16s}
.text-preset-card iconify-icon{font-size:25px;color:#6948e8}
.text-preset-card span{font-size:12px;font-weight:800}
.text-preset-card:hover{border-color:#836cf3;background:#faf8ff;transform:translateY(-1px);box-shadow:0 9px 22px rgba(62,48,118,.09)}
.barcode-card iconify-icon{color:#14171d}

.layer-row{grid-template-columns:30px 28px minmax(0,1fr) auto}
.layer-type-icon{width:28px;height:28px;border-radius:8px;background:#f1f2f5;color:#5e6571;display:grid;place-items:center;font-size:17px}
.layer-row.active .layer-type-icon{background:#e7e0ff;color:#6441df}
.layer-row.locked .layer-type-icon{opacity:.55}

.surface-switch-icon{width:34px;height:38px;object-fit:contain;display:block}
.view-option{height:80px}
.view-option.active .surface-switch-icon{filter:drop-shadow(0 2px 4px rgba(94,61,230,.18))}

.guide-caption rect{fill:#fff;fill-opacity:.92;stroke:#dedfe5;stroke-width:1}
.guide-caption text{font-size:9px;font-family:Arial,sans-serif;font-weight:700;fill:#5e6470}
.dimension-line{stroke:#6f7580;stroke-width:1;stroke-dasharray:3 3;vector-effect:non-scaling-stroke}
.dimension-text{font-size:10px;font-family:Arial,sans-serif;font-weight:700;fill:#505661}
.cmyk-label{font-size:9px;font-family:Arial,sans-serif;font-weight:800;fill:#505661;letter-spacing:.06em}
.cmyk-indicator circle{stroke:#fff;stroke-width:1;filter:drop-shadow(0 1px 1px rgba(0,0,0,.12))}

.canvas-text-editor-overlay{position:absolute;z-index:60;border:2px solid #6d4aff;border-radius:10px;background:rgba(255,255,255,.97);color:#171a20;padding:8px 10px;resize:both;outline:none;box-shadow:0 14px 36px rgba(36,30,67,.22),0 0 0 4px rgba(109,74,255,.11);line-height:1.25;min-width:120px;min-height:42px}
.canvas-text-editor-overlay:focus{border-color:#5d36e3}

.symbol-asset-grid .shape-asset-card img{width:54px;height:54px;object-fit:contain}

@media(max-width:1200px){
  .editor-layout-v3.panel-collapsed{grid-template-columns:72px 0 minmax(680px,1fr)}
  .text-preset-grid{grid-template-columns:1fr}
}

/* === v8 PHP / print production refinements === */
.tool-panel-shell .tool-panel{
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:rgba(99,72,220,.45) transparent;
}
.tool-panel-shell .tool-panel::-webkit-scrollbar{width:8px}
.tool-panel-shell .tool-panel::-webkit-scrollbar-track{background:transparent}
.tool-panel-shell .tool-panel::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(99,72,220,.28),rgba(99,72,220,.58));border-radius:999px;border:2px solid #fff}
.tool-panel-shell .tool-panel::-webkit-scrollbar-thumb:hover{background:rgba(99,72,220,.72)}
.workspace-grid{
  opacity:.72;
  background-image:radial-gradient(circle,rgba(59,64,78,.13) 1px,transparent 1.2px);
  background-size:20px 20px;
  background-position:center;
}
.pickr-control-wrap{display:flex;align-items:center;gap:7px;min-width:0}
.cmyk-readout{font-size:9px;line-height:1.15;color:#707581;background:#f3f4f7;border:1px solid #e1e3e9;padding:5px 7px;border-radius:8px;white-space:nowrap;font-weight:750;letter-spacing:.01em}
.print-popover .control{font-size:12px}
.print-popover .print-visibility-title{margin-top:15px}
.project-saved-card{position:relative;display:flex;align-items:center;gap:8px}
.project-saved-card>a{display:flex;align-items:center;justify-content:space-between;gap:18px;flex:1;color:inherit;text-decoration:none}
.project-delete{flex:0 0 auto;color:#9d3543}
.auth-note{background:#f6f5fb;border:1px solid #e7e3f7;border-radius:12px;padding:11px 12px;line-height:1.55}