.fabric-editor-page{background:radial-gradient(900px 420px at 85% -8%,#2563eb12,#0000 62%),linear-gradient(#fbfcfe 0%,#f2f5f9 60%,#eef2f7 100%);min-height:calc(100vh - 72px);padding:28px 0 64px}.fabric-editor-shell{grid-template-columns:minmax(0,1fr) minmax(430px,480px);align-items:start;gap:20px;display:grid}.fabric-editor-page .fabric-editor-shell{width:min(1720px,100% - 48px)}.fabric-editor-main{gap:12px;min-width:0;display:grid}.fabric-editor-heading{max-width:100%}.fabric-editor-heading .page-title{margin-bottom:4px;font-size:24px;line-height:1.15}.fabric-editor-heading .page-text{margin-top:2px;font-size:14px}.fabric-project-bar{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;display:grid}.fabric-project-bar div,.fabric-work-area,.preview-strip{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);box-shadow:var(--shadow-sm)}.fabric-project-bar div{min-height:54px;color:var(--ink-500);align-content:center;gap:2px;padding:10px 12px;font-size:13px;display:grid}.fabric-project-bar strong{color:var(--ink-900);font-size:13.5px}.fabric-project-bar .project-save-chip{color:#15803d;justify-items:start;font-weight:800}.fabric-project-bar .project-save-chip:before{content:"";background:#22c55e;border-radius:999px;width:8px;height:8px}.fabric-project-bar .project-save-chip-dirty{color:#b45309}.fabric-project-bar .project-save-chip-dirty:before{background:#f59e0b}.face-tabs{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface-muted);grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;padding:5px;display:grid}.face-tabs button{border-radius:var(--radius-sm);min-height:42px;color:var(--ink-600);cursor:pointer;background:0 0;border:0;font-weight:800;line-height:1.2;transition:background-color .18s,color .18s,box-shadow .18s}.face-tabs button:hover{color:var(--ink-900);background:#ffffffd9}.face-tabs .face-tab-active,.face-tabs .face-tab-active:hover{background:var(--gradient-brand);color:#fff;box-shadow:0 6px 16px #2563eb4d}.fabric-work-area{border-radius:var(--radius-lg);overflow:hidden}.canvas-toolbar{border-bottom:1px solid var(--line);background:#f8fafc;flex-wrap:wrap;gap:8px;padding:12px;display:flex}.canvas-toolbar-compact{background:var(--surface);padding-top:0}.canvas-utility-toolbar{border-top:1px solid var(--line);background:var(--surface);justify-content:space-between;align-items:center;gap:12px;padding-block:10px}.canvas-zoom-controls,.canvas-nudge-cluster{align-items:center;gap:8px;display:inline-flex}.canvas-zoom-readout{text-align:center;min-width:54px;color:var(--ink-900);font-variant-numeric:tabular-nums;font-size:14px;font-weight:900}.canvas-advanced-toggle{gap:6px}.canvas-advanced-toggle-open{color:var(--brand-700);border-color:var(--brand-600)!important;background:var(--brand-50)!important}.nudge-step-control{color:var(--ink-600);align-items:center;gap:8px;font-size:12px;font-weight:900;display:inline-flex}.nudge-step-control input{border:1px solid var(--line-strong);border-radius:var(--radius-sm);width:64px;min-height:36px;color:var(--ink-900);padding:6px 8px;font-weight:800}.nudge-pad{grid-template-rows:repeat(2,38px);grid-template-columns:repeat(3,38px);gap:6px;display:grid}.nudge-pad button{width:38px;min-height:38px;padding:0}.nudge-pad button:first-child{grid-column:2}.nudge-pad button:nth-child(2){grid-area:2/1}.nudge-pad button:nth-child(3){grid-area:2/3}.nudge-pad button:nth-child(4){grid-area:2/2}.canvas-toolbar button,.copy-actions button{border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface);min-height:38px;color:var(--ink-900);cursor:pointer;justify-content:center;align-items:center;gap:7px;padding:8px 10px;font-weight:800;transition:border-color .16s,background-color .16s,box-shadow .16s,transform .16s;display:inline-flex}.canvas-toolbar button:hover:not(:disabled),.copy-actions button:hover:not(:disabled){border-color:var(--brand-500);background:var(--brand-50);box-shadow:var(--shadow-xs)}.canvas-toolbar button:active:not(:disabled){transform:translateY(1px)}.canvas-toolbar button:disabled,.copy-actions button:disabled{cursor:not-allowed;opacity:.48}.canvas-advanced-toolbar{border-top:1px solid var(--line);background:var(--surface);grid-template-columns:minmax(170px,.8fr) minmax(190px,1fr) minmax(220px,1.1fr);gap:10px;padding:12px;display:grid}.canvas-tool-group{align-content:start;gap:8px;min-width:0;display:grid}.canvas-tool-group strong{color:var(--ink-900);letter-spacing:.08em;text-transform:uppercase;font-size:11px;font-weight:900}.canvas-tool-row{flex-wrap:wrap;gap:6px;display:flex}.canvas-tool-row button,.canvas-layer-list button{border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface);min-height:32px;color:var(--ink-900);cursor:pointer;padding:6px 8px;font-size:12px;font-weight:850;transition:border-color .16s,background-color .16s}.canvas-tool-row button{align-items:center;gap:5px;display:inline-flex}.canvas-tool-row button:hover,.canvas-layer-list button:hover,.canvas-layer-active{border-color:var(--brand-600)!important;background:var(--brand-50)!important}.canvas-tool-row button:disabled{cursor:not-allowed;opacity:.48}.canvas-layer-list{gap:6px;max-height:116px;padding-right:2px;display:grid;overflow:auto}.canvas-layer-list button{text-align:left;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;min-width:0;display:grid}.canvas-layer-list span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.canvas-layer-list small{color:var(--ink-400);font-size:10px;font-weight:800}.canvas-layer-list p{color:var(--ink-400);margin:0;font-size:12px;font-weight:800}.fabric-canvas-frame{background:radial-gradient(circle at 1px 1px,#0f172a12 1px,#0000 0) 0 0/22px 22px,linear-gradient(#eef2f7 0%,#e9eef5 100%);place-items:safe center;height:clamp(520px,100vh - 300px,940px);padding:52px 18px 24px;display:grid;position:relative;overflow:auto;box-shadow:inset 0 2px 10px #0c12220d}.canvas-is-interacting{cursor:grabbing}.canvas-state-chip{z-index:2;border-radius:var(--radius-pill);color:var(--brand-700);opacity:1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#eff6fff2;border:1px solid #2563eb47;padding:7px 11px;font-size:13px;font-weight:900;transition:opacity .12s,transform .12s;position:absolute;top:14px;right:14px;transform:translateY(0)}.canvas-state-chip-hidden{opacity:0;pointer-events:none;transform:translateY(-4px)}.canvas-distance-chip{z-index:5;pointer-events:none;flex-wrap:wrap;justify-content:center;gap:6px;max-width:min(92%,760px);display:flex;position:absolute;bottom:14px;left:50%;transform:translate(-50%)}.canvas-distance-chip span{border-radius:var(--radius-pill);color:#075985;background:#f0f9fff5;border:1px solid #bae6fd;padding:5px 8px;font-size:12px;font-weight:900;line-height:1}.smart-guide{z-index:4;pointer-events:none;opacity:0;background:var(--brand-600);transition:opacity 60ms linear;position:absolute;box-shadow:0 0 0 1px #ffffffb8}.smart-guide-vertical{width:1px}.smart-guide-horizontal{height:1px}.fabric-canvas-frame .canvas-container{aspect-ratio:var(--face-aspect-ratio,1 / 1);border:1px solid var(--line-strong);background:#fff;border-radius:2px;overflow:hidden;box-shadow:0 18px 45px #11182729;width:var(--canvas-display-width,720px)!important;max-width:none!important;height:auto!important}.fabric-canvas-frame .canvas-container canvas{width:100%!important;height:100%!important}.three-preview-panel{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-sm);gap:12px;display:grid;overflow:hidden}.three-preview-heading{border-bottom:1px solid var(--line);justify-content:space-between;align-items:end;gap:12px;padding:14px 16px 0;display:flex}.three-preview-heading h2{color:var(--ink-900);margin:0 0 12px;font-size:22px;line-height:1.2}.three-axis-controls{gap:6px;display:inline-flex}.three-axis-controls button{border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface);width:34px;height:34px;color:var(--ink-900);cursor:pointer;font-weight:900;transition:border-color .16s,color .16s}.three-axis-controls button:hover{border-color:var(--brand-600);color:var(--brand-700)}.three-preview-stage{touch-action:none;cursor:grab;height:min(58vh,620px);min-height:420px}.three-preview-stage:active{cursor:grabbing}.three-preview-stage-loading{background:#f8fafc}.three-preview-stage canvas{display:block;width:100%!important;height:100%!important}.standalone-3d-page .three-preview-stage{height:min(74vh,760px)}.standalone-3d-empty{color:var(--ink-500);place-items:center;font-weight:800;display:grid}.studio-processing-backdrop{z-index:70;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0c122273;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.studio-processing-modal{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);width:min(100%,390px);box-shadow:var(--shadow-lg);color:var(--ink-900);grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:12px;padding:18px;display:grid}.studio-processing-spinner{border:3px solid var(--brand-100);border-top-color:var(--brand-600);border-radius:50%;width:34px;height:34px;animation:.78s linear infinite button-spinner}.studio-processing-modal strong,.studio-processing-modal span,.studio-processing-modal small{display:block}.studio-processing-modal strong{font-size:15px;line-height:1.2}.studio-processing-modal span{color:var(--ink-500);margin-top:3px;font-size:13px;font-weight:700;line-height:1.35}.studio-processing-modal small{color:var(--brand-700);font-size:12px;font-weight:900}.studio-processing-track{border-radius:var(--radius-pill);background:var(--line);grid-column:1/-1;height:7px;overflow:hidden}.studio-processing-track span{border-radius:inherit;background:var(--gradient-brand);height:100%;transition:width .16s}.face-size-chip{z-index:2;border:1px solid var(--line);border-radius:var(--radius-pill);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffffeb;padding:7px 11px;font-size:13px;font-weight:800;position:absolute;top:14px;left:14px}@media (max-width:1280px){.fabric-editor-shell{grid-template-columns:minmax(0,1fr) 430px}}@media (max-width:1180px){.fabric-editor-shell{grid-template-columns:1fr}.face-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:640px){.fabric-editor-page{padding:24px 0 48px}.fabric-project-bar,.face-tabs{grid-template-columns:1fr 1fr}.fabric-canvas-frame{height:clamp(380px,66vh,600px);padding:58px 10px 16px}.canvas-advanced-toolbar{grid-template-columns:1fr}.canvas-utility-toolbar{justify-content:flex-start}}
