:root{font-family:Inter,"Segoe UI",system-ui,sans-serif;color-scheme:dark;--page:#10151b;--panel:#1a222b;--panel-2:#202a35;--line:#303b47;--text:#f1f4f6;--muted:#a0acb8;--soft:#788694;--gold:#e6a443;--gold-dark:#835a25;--green:#71d3a0;--danger:#d97b72;--canvas:#202a35;--grid:#31404e;--shadow:0 12px 32px #0004}
*{box-sizing:border-box}body{margin:0;background:var(--page);color:var(--text);font-size:13px}body[data-theme="medium"]{--page:#20262e;--panel:#2c343e;--panel-2:#37414c;--line:#48525e;--canvas:#343e49;--grid:#465462}body[data-theme="light"]{color-scheme:light;--page:#e8edf1;--panel:#fff;--panel-2:#f3f6f8;--line:#d2dbe3;--text:#202832;--muted:#5f6d7a;--soft:#7c8995;--gold:#b97822;--gold-dark:#edd3a7;--green:#26835a;--danger:#b84b43;--canvas:#f2f5f7;--grid:#d9e0e6;--shadow:0 12px 32px #2333}
button,input,select{font:inherit}button,select{cursor:pointer}.app-shell{min-height:100vh;display:flex;flex-direction:column}.topbar{height:66px;padding:0 22px;display:flex;align-items:center;gap:26px;background:var(--panel);border-bottom:1px solid var(--line);box-shadow:0 2px 8px #0002;z-index:2}.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--text);min-width:185px}.brand-mark{font-size:26px;color:var(--gold)}.brand b{display:block;letter-spacing:2px;font-size:13px}.brand small{font-size:9px;letter-spacing:2px;color:var(--muted)}.main-actions,.top-controls{display:flex;align-items:center;gap:6px}.main-actions{flex:1}.top-controls{margin-left:auto}.button{border:1px solid var(--line);background:var(--panel-2);color:var(--text);padding:8px 12px;border-radius:7px;font-weight:600;transition:.15s}.button:hover{border-color:var(--gold);transform:translateY(-1px)}.button.quiet{border-color:transparent;background:transparent;color:var(--muted)}.button.quiet:hover{background:var(--panel-2);color:var(--text)}.button.primary{background:var(--gold);border-color:var(--gold);color:#20170b}.button.outline{background:transparent;border-color:var(--gold-dark);color:var(--gold)}.button.small{padding:6px 9px;font-size:12px}.button.full{width:100%}.danger-quiet{color:var(--danger)}select,input[type=number]{background:var(--panel-2);border:1px solid var(--line);color:var(--text);border-radius:6px;padding:7px 8px;outline:none}select:focus,input:focus{border-color:var(--gold)}.top-controls select{padding:8px}.workbench{padding:14px;display:grid;grid-template-columns:254px minmax(430px,1fr) 290px;gap:12px;flex:1;min-height:0}.panel{background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow)}.object-panel,.properties-panel{padding:15px;overflow:auto}.panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.eyebrow{color:var(--gold);font-size:9px;font-weight:800;letter-spacing:1.5px}h1,h2{margin:3px 0 0;font-size:18px}.icon-button{border:1px solid var(--line);background:var(--panel-2);color:var(--text);border-radius:7px;padding:7px 9px}.drop-zone{height:104px;border:1px dashed var(--gold-dark);border-radius:8px;background:color-mix(in srgb,var(--gold) 7%,var(--panel));display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;cursor:pointer}.drop-zone:hover{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 12%,var(--panel))}.upload-icon{font-size:23px;color:var(--gold);line-height:1}.drop-zone small{font-size:10px;color:var(--muted)}.import-options{padding:10px 0 3px;display:grid;gap:7px}.import-options label{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:11px}.import-options span{display:flex;align-items:center;gap:5px}.import-options input{width:74px;text-align:right;padding:5px}.section-title{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:9px;font-weight:800;letter-spacing:1px;margin:15px 0 8px}.section-title span+span{font-size:10px;letter-spacing:0;font-weight:500}.object-list{display:flex;flex-direction:column;gap:5px;min-height:90px}.empty-list{color:var(--soft);font-size:11px;line-height:1.5;padding:10px 4px}.layer{display:flex;align-items:center;gap:8px;padding:9px 8px;border:1px solid transparent;border-radius:7px;cursor:pointer}.layer:hover{background:var(--panel-2)}.layer.active{background:color-mix(in srgb,var(--gold) 11%,var(--panel));border-color:var(--gold-dark)}.swatch{width:13px;height:13px;border-radius:4px;border:1px solid #fff5;flex:none}.layer-copy{min-width:0;flex:1}.layer-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px;font-weight:650}.layer-meta{font-size:9px;color:var(--muted);margin-top:2px}.layer-off{opacity:.48}.layer-tools{display:flex;gap:4px;margin:8px 0 10px}.helper{font-size:10px;line-height:1.5;color:var(--muted);margin:8px 1px}.workspace{display:flex;flex-direction:column;overflow:hidden;min-height:500px}.canvas-toolbar{height:49px;display:flex;align-items:center;justify-content:space-between;padding:0 13px;border-bottom:1px solid var(--line)}.segmented{display:flex;background:var(--panel-2);padding:3px;border-radius:7px;gap:3px}.segmented button{border:0;background:transparent;color:var(--muted);padding:6px 10px;border-radius:5px;font-size:11px}.segmented button.active{background:var(--panel);color:var(--text);box-shadow:0 1px 3px #0003}.canvas-tools{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px}.canvas-stage{position:relative;flex:1;min-height:390px;background-color:var(--canvas);background-image:radial-gradient(var(--grid) 1px,transparent 1px);background-size:20px 20px;overflow:hidden}#designCanvas{width:100%;height:100%;display:block;touch-action:none}.stage-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;background:color-mix(in srgb,var(--canvas) 88%,transparent);pointer-events:none}.stage-empty .button{pointer-events:auto}.stage-empty span{font-size:11px;color:var(--muted)}.empty-star{font-size:31px;color:var(--gold);margin-bottom:3px}.stage-empty b{font-size:16px}.statusbar{height:35px;border-top:1px solid var(--line);display:flex;align-items:center;gap:8px;padding:0 12px;color:var(--muted);font-size:10px}.status-dot{width:7px;height:7px;background:var(--green);border-radius:50%}.statusbar #statusRight{margin-left:auto;color:var(--soft)}.properties-panel h2{font-size:15px;max-width:225px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.properties-empty{font-size:11px;line-height:1.5;color:var(--muted);padding:10px 0}.properties-form{display:flex;flex-direction:column;gap:12px}.hidden{display:none!important}.check-row{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}input[type=checkbox]{accent-color:var(--gold)}.field-label{position:relative;display:flex;flex-direction:column;gap:5px;color:var(--muted);font-size:10px}.field-label select,.field-label input{width:100%;font-size:11px}.unit{position:absolute;right:7px;top:0;color:var(--soft);font-size:9px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.divider{height:1px;background:var(--line);margin:1px 0}.mini-badge{color:var(--gold)!important;font-size:8px!important;padding:3px 5px;border:1px solid var(--gold-dark);border-radius:4px}.spacing-note{border-left:2px solid var(--gold);background:var(--panel-2);padding:8px;color:var(--muted);font-size:10px;line-height:1.45}.apply-button{margin-top:3px}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--text);color:var(--page);padding:10px 15px;border-radius:8px;box-shadow:var(--shadow);transition:.2s;z-index:5;font-size:12px}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1120px){.workbench{grid-template-columns:220px minmax(350px,1fr)}.properties-panel{grid-column:1/-1;display:grid;grid-template-columns:220px 1fr;gap:12px}.properties-panel .panel-heading{align-items:start}.properties-form{display:grid;grid-template-columns:repeat(2,minmax(140px,1fr));align-items:end}.properties-form .divider,.properties-form .section-title,.properties-form .spacing-note,.properties-form .apply-button{grid-column:1/-1}.properties-empty{grid-column:2}.topbar{gap:10px;padding:0 12px}.brand{min-width:150px}}
@media(max-width:760px){.topbar{height:auto;min-height:60px;flex-wrap:wrap;padding:10px;gap:8px}.brand{min-width:auto;margin-right:auto}.main-actions{order:3;width:100%;overflow:auto}.top-controls{gap:4px}.top-controls select{max-width:90px}.button{padding:7px 8px;font-size:11px}.workbench{display:flex;flex-direction:column;padding:8px}.workspace{order:1;min-height:55vh}.object-panel{order:2}.properties-panel{order:3;display:block}.properties-form{display:flex}.properties-empty{display:block}.canvas-stage{min-height:330px}}
@media print{.topbar,.object-panel,.properties-panel,.canvas-toolbar,.statusbar,.toast{display:none!important}.workbench{display:block;padding:0}.workspace{border:0;box-shadow:none}.canvas-stage{background:none;height:auto;min-height:0;overflow:visible}#designCanvas{width:100%;height:auto;aspect-ratio:1/1}.stage-empty{display:none}}
body[data-layout="beginner"] .pro-only{display:none!important}
body[data-layout="pro"] .pro-only{display:flex}
.drop-zone.dragging{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 16%,var(--panel))}
.font-actions{display:flex;gap:5px;align-items:center}.lettering-dialog{width:min(480px,calc(100vw - 28px));border:1px solid var(--line);border-radius:12px;padding:22px;background:var(--panel);color:var(--text);box-shadow:var(--shadow)}.lettering-dialog::backdrop{background:#071019b8;backdrop-filter:blur(3px)}.lettering-dialog form{display:flex;flex-direction:column;gap:15px}.dialog-heading h2{margin:5px 0 0}.dialog-note{margin:0;color:var(--muted);font-size:11px}.dialog-actions{display:flex;justify-content:flex-end;gap:8px}
.point-tools{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:7px;padding:9px}.point-tools b{font-size:10px;color:var(--text)}.point-tools span{font-size:9px;color:var(--muted);line-height:1.35}.point-tools div{display:flex;gap:5px}
.manual-toolbar{min-height:42px;padding:6px 12px;display:flex;align-items:center;gap:6px;border-bottom:1px solid var(--line);background:var(--panel)}.manual-label{font-size:9px;font-weight:800;letter-spacing:1px;color:var(--gold);margin-right:3px}.manual-hint{margin-left:auto;font-size:10px;color:var(--muted);text-align:right}.manual-toolbar button.active{border-color:var(--gold);color:var(--gold);background:color-mix(in srgb,var(--gold) 10%,var(--panel))}input[type=color]{height:31px;padding:3px;background:var(--panel-2);border:1px solid var(--line);border-radius:6px;cursor:pointer}
@media(max-width:760px){.manual-toolbar{flex-wrap:wrap}.manual-hint{width:100%;text-align:left;margin-left:0}.manual-toolbar .button{font-size:10px}}
.import-options #detailLevel{min-width:115px}.detail-note{font-size:9px;line-height:1.35;color:var(--soft);padding-left:1px}
.preview-controls,.playback-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 12px;border-bottom:1px solid var(--line);font-size:10px;background:var(--panel)}
.preview-controls label{display:flex;align-items:center;gap:5px;color:var(--muted)}.preview-controls select,.playback-controls select{font-size:10px;padding:4px}.preview-controls input[type=color]{width:30px;height:24px}.playback-controls input[type=range]{flex:1;min-width:80px;accent-color:var(--gold)}#playbackCount{font-variant-numeric:tabular-nums;color:var(--muted);font-size:10px}.preview-note{margin:0;padding:5px 12px;color:var(--muted);font-size:9px;line-height:1.4;background:var(--panel)}
@media(max-width:760px){.canvas-toolbar{padding:5px;height:auto;gap:4px}.preview-controls{gap:7px}.playback-controls{gap:6px}.preview-controls label{font-size:9px}}

.dst-dialog{width:min(1000px,96vw);max-height:95vh;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:16px}.dst-dialog::backdrop{background:#000a}.dst-heading{display:flex;justify-content:space-between;align-items:center}.dst-dialog #dstStats{font-size:12px;line-height:1.5}#dstCanvas{width:100%;height:52vh;display:block}.dst-dialog .helper{font-size:11px;line-height:1.5}.main-actions{flex-wrap:wrap}.topbar{height:auto;min-height:66px;padding-top:7px;padding-bottom:7px}

.trim-settings input[type=number]{width:55px;padding:4px}.trim-settings span{font-size:9px;color:var(--muted)}

.alpha-banner{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:6px 18px;background:var(--panel-2);border-bottom:1px solid var(--line);font-size:10px;color:var(--muted)}.alpha-banner>span:first-child{color:var(--gold);font-weight:700}#recoveryStatus{margin-left:auto}.alpha-dialog{width:min(1000px,96vw);max-height:94vh;overflow:auto;border:1px solid var(--line);border-radius:12px;padding:20px;background:var(--panel);color:var(--text)}.alpha-dialog::backdrop{background:#000a}.alpha-dialog>p{font-size:12px;line-height:1.5}.alpha-tests{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0}.alpha-card{background:var(--panel-2);border:1px solid var(--line);padding:14px;border-radius:8px;display:flex;flex-direction:column;gap:10px}.alpha-card h3{margin:0;font-size:14px}.alpha-card p{font-size:11px;line-height:1.5;min-height:100px;margin:0;color:var(--muted)}.alpha-card textarea{width:100%;min-height:90px;resize:vertical;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:8px;font:11px system-ui}.button:disabled{opacity:.4;cursor:default;transform:none}@media(max-width:760px){.alpha-tests{grid-template-columns:1fr}.alpha-card p{min-height:0}#recoveryStatus{margin-left:0}.alpha-banner{font-size:9px}}

.quality-dialog{width:min(780px,95vw);max-height:92vh;overflow:auto;border:1px solid var(--line);border-radius:12px;padding:20px;background:var(--panel);color:var(--text)}.quality-dialog::backdrop{background:#000a}.quality-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:16px 0}.quality-metrics>div{background:var(--panel-2);padding:13px;border:1px solid var(--line);border-radius:7px}.quality-metrics span{display:block;color:var(--muted);font-size:10px;margin-bottom:5px}.quality-metrics b{font-size:19px}.quality-issue{padding:10px 12px;border-left:3px solid var(--gold);background:var(--panel-2);font-size:12px;line-height:1.5}.quality-issue.error{border-color:var(--danger)}.quality-dialog .helper{font-size:11px;line-height:1.5}@media(max-width:600px){.quality-metrics{grid-template-columns:repeat(2,1fr)}}

.resize-controls{flex-wrap:wrap}.resize-controls input[type=number]{width:72px}.resize-controls span{font-size:10px;color:var(--muted)}

.selection-actions{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin:8px 0}.selection-actions small{color:var(--muted)}.layer input[type=checkbox]{flex:none;width:14px;height:14px;margin:0}

.object-list{position:relative;max-height:300px;overflow-y:auto;flex-shrink:0}.object-list .layer{flex-shrink:0}.color-group{flex-shrink:0;border:1px solid var(--line);border-radius:7px;overflow:hidden}.color-group.has-selection{border-color:var(--gold-dark)}.color-group summary{display:flex;align-items:center;gap:7px;padding:8px;cursor:pointer;background:var(--panel-2);list-style:none}.color-group summary:before{content:"▸";color:var(--muted);font-size:11px}.color-group[open] summary:before{content:"▾"}.color-group summary input{width:14px;height:14px;margin:0;flex-shrink:0}.color-group-label{display:flex;flex-direction:column;gap:3px;min-width:0}.color-group-label b{font-size:11px}.color-group-label small{font-size:9px;color:var(--muted)}.color-group .layer{margin:4px 5px 4px 16px}.color-group summary::-webkit-details-marker{display:none}

.hoop-picker{display:flex;flex-direction:column;gap:3px;font-size:9px;color:var(--muted)}.hoop-picker select{max-width:210px;padding:6px;border:1px solid var(--line);background:var(--panel-2);color:var(--text);border-radius:6px}

.support-card{padding:14px;margin:10px 0;border:1px solid var(--border);border-radius:10px}.support-card p{white-space:pre-wrap;overflow-wrap:anywhere}.support-ticket{display:block;width:100%;text-align:left;margin:8px 0}.quality-dialog textarea{width:100%;box-sizing:border-box;background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:10px}.quality-dialog pre{max-height:220px;overflow:auto;white-space:pre-wrap;font-size:12px}.getting-started li{margin:14px 0;line-height:1.6}[hidden]{display:none!important}

/* Keep workspace controls usable when account/support actions are present. */
.topbar{flex-wrap:wrap;gap:10px 20px;align-items:center}.brand{flex:0 0 185px}.main-actions{flex:1 1 700px;min-width:0;align-content:center}.top-controls{flex:1 1 100%;justify-content:flex-end;flex-wrap:wrap;margin-left:0}.manual-toolbar{flex-wrap:wrap}.manual-hint{flex:1 1 220px}.support-card,.quality-dialog textarea{border-color:var(--line)}#nodeTools input{width:78px}#nodeTools select{max-width:125px}.quality-dialog .button{margin-top:4px}.support-card{border:1px solid var(--line)}

@media(min-width:1051px){.app-shell{height:100dvh;min-height:0}.topbar,.alpha-banner{flex-shrink:0}.workbench{flex:1;min-height:0;overflow:hidden}.object-panel,.properties-panel{min-height:0;overflow:auto}.workspace{min-height:0}.canvas-stage{min-height:120px}.canvas-toolbar,.preview-controls,.playback-controls,.preview-note,.manual-toolbar,.statusbar{flex-shrink:0}}

.object-panel{overflow-x:hidden}.import-options label,.import-options input{min-width:0}

.letter-envelope{border:1px solid var(--line);border-radius:8px;margin-top:14px;padding:12px}.letter-envelope legend{color:var(--gold);font-weight:700}#letteringPreview{display:block;width:100%;height:130px;background:var(--canvas);border:1px solid var(--line);border-radius:8px;margin-top:12px}.lettering-dialog{max-height:94vh;overflow-y:auto}.applique-step{padding:12px;margin:12px 0;border:1px solid var(--line);border-radius:8px}.applique-step input[type=number]{width:100%;box-sizing:border-box}

.lettering-dialog{width:min(820px,94vw);box-sizing:border-box}
