/* Carbon studio. The artwork owns the screen; tools open only when needed. */
:root{color-scheme:dark;--ink:#eceee8;--muted:#a4acb7;--accent:#c8fa63;--blue:#c8fa63;--paper:#11151b;--border:#2a3039;--peach:#252d28;--sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--studio-surface:#151a21;--studio-inset:#0b0e13}
html,body{background:#0b0d10;color:#eceee8}body{font-family:var(--sans)}button,a,input,textarea,select,summary{-webkit-tap-highlight-color:transparent}button{transition:background .15s,border-color .15s,transform .15s}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.36}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button{color:inherit}
.topbar{background:#0d1015;border-color:#272d35;height:80px;padding:0 28px}.brand-mark{background:#c8fa63;color:#0b1108;border:0;border-radius:12px;width:44px;height:44px}.brand b{font-size:20px;letter-spacing:3px}.brand small{color:#9aa59f;letter-spacing:2px}.project-title{color:#a2ada8}.status-dot,.live-pill span{background:#c8fa63}.header-actions{gap:9px}.header-actions button,.header-actions .iconbutton{min-height:48px;background:#1b212a;border:1px solid #323a45;color:#e7eae4;border-radius:12px;margin:0}.header-actions .quiet{padding:12px 18px;font-size:13px}.header-actions .primary{background:#c8fa63;border-color:#c8fa63;color:#10160a;padding:12px 20px;font-size:13px;font-weight:800}.primary{background:#c8fa63!important;border-color:#c8fa63!important;color:#10160a!important;font-weight:800;border-radius:12px}.primary:hover{background:#d8ff8a!important}.quiet:hover,.outline:hover{background:#242d36}.workspace{max-width:1800px;gap:20px;padding:22px}.studio{background:transparent;padding:0}.studio-top{padding:0 0 18px}.studio-top .eyebrow,.eyebrow{color:#a4b098}.studio-top h1{font-size:30px;color:#f0f0e7;font-weight:650;letter-spacing:-1px}.live-pill{color:#98a68d}.panel,.action-controls,.photo-controls,.quick-color,.quick-effects,.background-controls{background:#141920;border:1px solid #2a323c;border-radius:18px;color:#e7eae4}.panel-heading h2,.action-heading h2,.photo-controls h2{color:#edf0e7}.panel{padding:22px}.controls summary{color:#e2e7df;border-color:#29313d}.controls summary span,.controls summary:after{color:#afbbab}.controls details,.photo-placement,.gradient-controls,.action-shortcuts,.import-foot,.studio-note{border-color:#2b333f}.count{background:#243022;color:#d0edb0}.searchbox{background:#0c1016;border-color:#343d49;border-radius:12px;min-height:48px}.searchbox input{color:#e8eee2;font-size:14px}.searchbox input::placeholder,textarea::placeholder{color:#899582}.searchbox svg{color:#c4d2b4}.categories button,.font-gallery-tabs button{background:#1b222b;color:#c4cec0;border-color:#303947;min-height:46px;border-radius:11px;font-size:12px}.categories button.selected,.font-gallery-tabs button.selected{background:#293921;border-color:#779948;color:#d8fba6}.font-gallery-tabs span{color:#b8c99f}.real-gallery-hint{color:#bbc9af;background:#202921}.font-card{background:#171e26;border:1px solid #323c48;border-radius:16px;min-height:124px}.font-card.active{background:#233023;border-color:#b4d86a;box-shadow:inset 0 0 0 1px #b4d86a}.font-select{padding:15px 13px}.font-sample{color:#f1eee3;min-height:64px}.font-sample svg{height:64px}.font-meta{color:#ccd7c2;font-size:12px}.font-tag{color:#a2ada0;font-size:9px}.favorite{color:#a4b594}.favorite.on{color:#c8fa63}.favorite.on svg{fill:#729b33}.library-toolbar{color:#abb9a1}.found-font{background:#1b232b;border-color:#343f4a}.found-font h3,.found-font p,.finder-note{color:#d3dec9}.outline{background:#1b232c;border-color:#3d4855;color:#dbe7cd;border-radius:12px;min-height:48px}.import-foot p,.collection-note{color:#a9b5a2}.preview-dock{background:#0d1117;border:1px solid #343d47;border-radius:20px;box-shadow:0 24px 80px #0005}.stage-toolbar{background:#11161d;border-bottom:1px solid #2a333e;height:54px;padding:0 14px}.stage-toolbar #selectedName{color:#c0ceb3;font-size:12px}.stage-toolbar button{color:#d9e4cf}.stage.dark{background:#0d1117;background-image:radial-gradient(ellipse at 50% 35%,#20293255,transparent 65%)}.stage.paper{background-color:#e4dece;background-image:linear-gradient(#9e9e9222 1px,transparent 1px),linear-gradient(90deg,#9e9e9222 1px,transparent 1px);background-size:32px 32px}.stage.checker{background:conic-gradient(#1a2028 25%,#262e37 0 50%,#1a2028 0 75%,#262e37 0);background-size:20px 20px}.stage-loading{background:#10151deb;color:#d6e2c5;border:1px solid #3c4937;border-radius:12px}.stage-corner,.stage-bottom{color:#84947f}.stage-corner{font-size:9px;letter-spacing:2px}.text-dock{background:#161d25;border-color:#2c3640}.text-dock label{color:#b4c3a5;font-size:10px}.text-dock textarea{color:#f3f0e5;background:#0f141b;border:1px solid #394535;border-radius:12px;padding:8px 12px;line-height:32px;min-height:52px;font-size:24px}.text-actions button,.photo-buttons button,.placement-buttons button,.photo-quick-actions button,.layer-order button,.action-shortcuts button,.thickness-presets button{background:#222b35;color:#d6e3c6;border-color:#3b4857;border-radius:12px;min-height:48px;font-size:13px}.delete-action{color:#ffc2b7!important;background:#342022!important;border-color:#754246!important}.textlink{color:#c0e69a;font-size:13px;min-height:44px}.action-reset,.slider-value{color:#d8efbb;background:#253227;border-color:#4a6540;border-radius:11px;font-size:13px;min-height:44px}.action-slider label,.range-control label,.texture-slider label,.cutout-range label{color:#e0e8d7;font-size:14px}.action-slider-grid{gap:20px}.slider-step{background:#2b353e;color:#dce8cd;border-radius:10px;width:44px;height:44px;font-size:23px}.action-slider-row{gap:10px}.action-slider input[type=range]{height:48px}.slider-guide{color:#a8b997;font-size:11px;display:flex!important}.action-slider input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right,#c8fa63 0 var(--slider-fill),#35403b var(--slider-fill) 100%);height:5px}.action-slider input[type=range]::-webkit-slider-thumb{background:#d2fb81;border:3px solid #131a11;box-shadow:0 0 0 1px #91b257}.action-slider input[type=range]::-moz-range-track{background:#35403b}.action-slider input[type=range]::-moz-range-progress{background:#c8fa63}.action-slider input[type=range]::-moz-range-thumb{background:#d2fb81;border-color:#131a11}.range-control input[type=number],.quick-color-head input[type=text],.export-label input,.export-label select,select,.cutout-scope select{background:#0c1118;color:#e1edd2;border:1px solid #39453d;border-radius:10px;font-size:14px;min-height:44px}.range-control input[type=range],.texture-slider input[type=range],.cutout-range input[type=range]{min-height:48px;height:48px;accent-color:#c8fa63}.texture-slider input[type=range],.cutout-range input[type=range]{appearance:none;-webkit-appearance:none;background:transparent;width:100%;cursor:pointer}.texture-slider input[type=range]::-webkit-slider-runnable-track,.cutout-range input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:8px;background:#35423a}.texture-slider input[type=range]::-webkit-slider-thumb,.cutout-range input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;margin-top:-10px;width:26px;height:26px;background:#d2fb81;border:4px solid #172016;border-radius:50%;box-shadow:0 0 0 1px #96ad75}.texture-slider input[type=range]::-moz-range-track,.cutout-range input[type=range]::-moz-range-track{height:5px;border-radius:8px;background:#35423a}.texture-slider input[type=range]::-moz-range-thumb,.cutout-range input[type=range]::-moz-range-thumb{width:20px;height:20px;background:#d2fb81;border:4px solid #172016;border-radius:50%}.texture-slider{padding:10px 0;margin:8px 0}.texture-slider output{font-size:14px;color:#c8fa63}.texture-toggle-row button{min-height:58px;font-size:16px;background:#202a32;color:#d8e3cb;border:1px solid #3b4a45;border-radius:15px}.texture-toggle-row button.selected{background:#2d3e24;color:#dcffb1;border-color:#9cbf61}.texture-target{color:#b7c8a5;font-size:12px}.effect-tabs button,.background-tabs button{background:#202832;color:#c2d1b5;border-color:#3a454f;border-radius:12px;font-size:12px;min-height:48px}.effect-tabs button.selected,.background-tabs button.selected{background:#2e4028;border-color:#76994e;color:#d3f3b1}.effect-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.effect-gallery button{background:#202731;border-color:#3c4853;color:#e0e7d8;min-height:84px;border-radius:13px;font-size:12px}.effect-gallery button.selected{border-color:#c8fa63}.look-sample{font-size:24px}.photo-hint,.photo-name,.control-hint,.check,.color-row,.gradient-end,.gradient-controls,.custom-color-label,.custom-backdrop,.cutout-scope,.dialog-intro,.export-label,.export-note,.export-photo-note,.export-types small,.saves-area p{color:#aebca4;font-size:12px;line-height:1.7}.gradient-end input[type=color],.color-row input[type=color],.custom-color-label input[type=color],.custom-backdrop input[type=color],.cutout-custom input[type=color]{width:46px;height:44px;background:#0b1016;border-color:#47513e;border-radius:10px}.quick-swatches{gap:13px}.quick-swatches button{width:38px;height:38px;border:3px solid #182016;border-radius:50%;outline-offset:2px}.quick-swatches button.selected{outline:2px solid #d8f3b3}.layer-row,.saved-row{background:#1b232d;border-color:#354135;border-radius:12px;min-height:56px;color:#d9e6c9}.layer-row.selected{background:#293824;border-color:#a7c56e}.layer-number{background:#344831;color:#d4f3b0}.letter-picker button{background:#202a33;color:#d3e2c6;border-color:#3c493d;min-width:44px;min-height:48px;font-size:18px}.letter-picker button.selected{background:#35472b;border-color:#c8fa63}.object-picker{background:#11161d;border-color:#2a343e;padding:5px 12px;gap:10px}.picker-heading strong{color:#d8e3cd;font-size:11px}.picker-heading small{color:#9bae8c;font-size:9px}.object-chip{background:#1a232d;color:#c9d6be;border-color:#35443b;border-radius:12px;min-height:44px}.object-chip.selected{background:#2b3b27;border-color:#b5d773;color:#e0f6c2;box-shadow:inset 0 0 0 1px #88a95a}.picker-icon{background:#293528;color:#d5ebbf}.picker-caption b{font-size:12px}.picker-caption small{font-size:9px}.object-chip.selected .picker-icon{background:#415937}.selection-actions{background:#151d24f2;color:#d8e7c9;border-color:#4b5a43;border-radius:14px;box-shadow:0 4px 16px #0004}.selection-actions span{color:#b4c8a3}.selection-actions button,.selection-actions #editSelected{min-height:44px;border-radius:10px;background:#263326;color:#d5efbb;font-size:12px}.empty-canvas{background:#131b23f5;border:1px solid #4b5c40;border-radius:18px;color:#e2efd4;box-shadow:0 12px 50px #0008}.empty-canvas strong{color:#ecf3e2;font-size:20px}.empty-canvas span{color:#b8c9a8;font-size:13px}.empty-canvas button{background:#2b3b25;color:#d8f5b5;font-size:13px;min-height:50px}.canvas-transform,.canvas-zoom{background:#131b25ee;border-color:#45543c;color:#cfdfbd;border-radius:12px}.canvas-transform button,.canvas-zoom button{background:#28362b;color:#d9efbd;font-size:13px;min-height:44px;border-radius:10px}.canvas-transform [aria-pressed=true]{background:#384d2c;color:#e3ffbd}.canvas-zoom output{color:#d3e6bc;font-size:12px}.bg-option.selected{background:#263b20;border-color:#a9cc73}.expand-button{background:#253824;color:#d8efb8;border-color:#486b3d}.project-actions{background:#141c24;border-color:#303e31}.project-actions button{background:#29382a;border-color:#486041;color:#d7ebc0;border-radius:12px;font-size:13px;min-height:50px}.project-actions .save-draft{background:#2c3628;color:#deedce;border-color:#4a6240}.preset-row button{background:#202b30;border-color:#3d4e43;color:#c5d9b6;min-height:44px}.tool-strip{background:#131a21;border-color:#303c32;padding:10px;gap:9px}.tool-strip button{background:#1f2931;border:1px solid #35443c;border-radius:13px;color:#c0d3ae;min-height:60px;font-size:12px}.tool-strip button b,.tool-strip button>svg{background:transparent;color:#d6e8c1;border-radius:0}.tool-strip button.active{background:#30482b;color:#e4fac9;border-color:#a4c76a}.tool-strip button.active b,.tool-strip button.active>svg{background:transparent}.tool-strip .color-wheel{border:4px solid #2a372a!important;border-radius:50%;width:23px!important;height:23px!important}.studio-note{color:#b1c79b}.action-heading .eyebrow,.quick-color-head .eyebrow{color:#b2c79e}.quick-color-head h3{color:#f0f2e6}.background-choices button,.cutout-presets button{background:#253029;color:#d7e8c3;border-color:#475c3d;min-height:48px;border-radius:12px;font-size:12px}.background-choices button.selected{background:#3c542c;border-color:#c8fa63}.effect-extra{border-color:#3e4c39;color:#bed2a8}.effect-extra summary{min-height:48px;font-size:13px}.pick-image-color{background:#2a3b26;color:#e0f7bc;border-color:#648442;min-height:56px;font-size:14px}.eyedropper-toolbar{background:#131c24f5;color:#d6eec0;border-color:#566c46}.eyedropper-toolbar button{background:#2b3d28;color:#e0f4c9;border-radius:11px;min-height:48px}.eyedropper-caption b{color:#dceece}.eyedropper-loupe{background:#16211a;border-color:#c8fa63;color:#eaffd0}dialog{background:#141c24;border:1px solid #455541;border-radius:22px;box-shadow:0 30px 120px #000a;color:#ecf2e5}dialog::backdrop{background:#050709c9;backdrop-filter:blur(7px)}.dialog-head h2,#draftsDialog h2{color:#ebf2df}.dialog-head .iconbutton{color:#d9e6c7;background:#263626;border-radius:10px;width:48px;height:48px}.export-types button{background:#202d2b;color:#e3efcc;border-color:#465c40;min-height:64px;border-radius:12px}.export-types button.selected{background:#384f2c;border-color:#b2d272}.export-dimensions,#exportStatus{color:#d3eea9}.export-label input,.export-label select{font-size:16px;min-height:48px}.alphabet-preview{background:#0c1118;border-color:#677451;border-radius:12px}.specimen-references a{color:#daf1b8;background:#253b29;border-color:#536c45;border-radius:11px;min-height:44px}#helpDialog p,#helpDialog li{color:#c7d7ba}.saves-area input,.saved-list p{color:#d1e0c0}.full{min-height:48px}#toast{background:#263624;border-color:#789254;color:#e1f9c4;box-shadow:0 10px 40px #0009;border-radius:14px;font-size:13px}.selection-border{stroke:#c8fa63;stroke-dasharray:none;stroke-width:1.1}.selection-handle circle{fill:#172216;stroke:#b5db6c}.selection-handle text{fill:#ddf7b9}
.phone-brand,.main-dock,.drawer-handle,.canvas-options{display:none}#createControls{display:none}
@media(min-width:961px){.workspace{grid-template-columns:280px minmax(0,1fr) 285px}.preview-dock .stage{height:clamp(500px,65dvh,900px)}.tool-strip{flex-wrap:wrap}.tool-strip button{min-width:64px}.panel.library{position:sticky;top:22px}.canvas-focus .preview-dock{background:#0d1117}.canvas-focus .stage{min-height:0}}
@media(max-width:960px){
 body.mobile-editor{background:#0b0d10}.mobile-editor #previewDock{background:#0b0d10;isolation:isolate}.mobile-editor #previewDock .stage-toolbar{height:calc(60px + env(safe-area-inset-top));min-height:60px;padding:env(safe-area-inset-top) 12px 0;border-color:#2b333d;justify-content:space-between;background:#10151c}.mobile-editor .phone-brand{display:flex;flex-direction:column;gap:2px;flex-shrink:0}.phone-brand b{font-size:17px;font-weight:850;letter-spacing:2px}.phone-brand b span{font-size:7px;vertical-align:super;margin-left:2px}.phone-brand small{font-size:7px;letter-spacing:1.8px;color:#a5b996}.mobile-editor .header-actions{gap:5px}.mobile-editor .header-actions button{width:44px;height:44px;min-height:44px;background:#1d2730;border:1px solid #384536;border-radius:12px;color:#d2e3be;flex-shrink:0}.mobile-editor .header-actions #save{width:48px;color:#d2e3be;font-size:12px;background:#253126;border-color:#3b5434}.mobile-editor .header-actions #exportTop{width:82px;background:#c8fa63;color:#11180a;gap:5px;font-size:12px;font-weight:800}.mobile-editor .header-actions #exportTop svg{width:17px}.mobile-editor .header-actions #openDrafts{display:none}.mobile-editor .header-actions .history-button span{font-size:8px}.mobile-editor .header-actions .history-button svg{width:17px;height:17px}.mobile-editor #objectPicker{height:50px;min-height:50px;flex:0 0 50px;padding:3px 12px}.mobile-editor .picker-heading{flex-basis:40px}.mobile-editor .object-chip{height:42px;min-height:42px;max-width:180px}.mobile-editor .picker-icon{height:30px;width:28px;flex-basis:28px}.mobile-editor .selection-actions{top:12px;left:12px;transform:none;gap:3px;border-radius:12px;max-width:calc(100% - 116px);padding:3px}.mobile-editor .selection-actions span{display:none}.mobile-editor .selection-actions button{font-size:11px;padding:8px 9px;min-height:42px}.mobile-editor .selection-actions #deleteSelected{display:inline-flex}.mobile-editor .main-dock{position:relative;display:grid;grid-template-columns:1.1fr 1fr 1fr;flex:0 0 auto;height:calc(78px + env(safe-area-inset-bottom));padding:10px 12px calc(10px + env(safe-area-inset-bottom));gap:9px;background:#10151c;border-top:1px solid #354031;z-index:14;box-shadow:0 -12px 35px #0005}.main-action{min-height:56px;background:#202c2a;border:1px solid #43543a;border-radius:16px;display:flex;align-items:center;justify-content:center;gap:8px;color:#e5f3d5;font-size:15px;font-weight:750}.main-action b{font-size:26px;font-weight:400;line-height:1}.main-action.add-action{background:#c8fa63;color:#111b09;border-color:#c8fa63}.main-action[aria-expanded=true]{background:#344d2b;border-color:#b6d975}.main-action.add-action[aria-expanded=true]{background:#ddff99}.dock-pull{position:absolute;left:50%;top:-21px;transform:translateX(-50%);height:36px;min-height:36px;width:78px;background:transparent;display:grid;place-items:center;border:0;touch-action:none;z-index:15}.dock-pull span{width:32px;height:4px;border-radius:10px;background:#758d5d}.dock-pull:active:not(:disabled){transform:translateX(-50%)}.mobile-editor .tool-drawer{position:absolute;left:8px;right:8px;bottom:calc(84px + env(safe-area-inset-bottom));height:var(--drawer-height,min(300px,36dvh));max-height:calc(var(--editor-height,100dvh) * .7);min-height:160px;flex:none;background:#171f27f5;border:1px solid #52603f;border-radius:24px;overflow:hidden;z-index:12;box-shadow:0 -14px 70px #0009;backdrop-filter:blur(20px);animation:tools-rise .18s ease-out}.mobile-editor .tool-drawer[hidden]{display:none!important}.mobile-editor .drawer-handle{display:grid;place-items:center;width:100%;height:44px;min-height:44px;padding:0;background:transparent;touch-action:none;cursor:ns-resize;flex-shrink:0}.drawer-handle span{width:40px;height:4px;border-radius:10px;background:#91a47b}.mobile-editor .drawer-heading{height:48px;padding:0 15px;gap:8px;border:0}.mobile-editor .drawer-heading strong{font-size:16px;font-weight:750;color:#edf4e2}.mobile-editor .drawer-heading span{display:none}.mobile-editor #closeTools{margin-left:auto;background:#29372d;border:1px solid #4a5c3b;border-radius:10px;width:44px;height:44px;color:#d4e8b8;font-size:23px;min-height:44px}.mobile-editor .drawer-tabs{flex:0 0 auto;min-height:58px;padding:0 12px;border-bottom:1px solid #354132;overflow:hidden}.mobile-editor .drawer-tabs .tool-strip{display:flex;flex-wrap:nowrap;height:58px;min-height:58px;gap:7px;padding:5px 0 7px;border:0;background:transparent;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;touch-action:pan-x;overscroll-behavior-x:contain}.drawer-tabs .tool-strip::-webkit-scrollbar{display:none}.mobile-editor .drawer-tabs .tool-strip button{display:flex;flex-direction:row;flex:0 0 auto;min-width:85px;height:46px;min-height:46px;padding:8px 12px;gap:7px;font-size:12px;border-radius:12px}.mobile-editor .drawer-tabs .tool-strip button b,.mobile-editor .drawer-tabs .tool-strip button>svg{width:19px;height:24px;font-size:20px;background:transparent;padding:0}.mobile-editor #mobileContent{background:transparent;padding:0;scroll-padding:18px}.mobile-editor #mobileContent>[data-drawer-panel]{padding:16px 18px 22px;background:transparent;border:0;color:#e3edda}.mobile-editor #mobileContent .action-slider-grid{grid-template-columns:1fr;gap:20px}.mobile-editor #mobileContent .action-slider label{font-size:14px}.mobile-editor #mobileContent .slider-step{width:44px;height:44px;border-radius:11px}.mobile-editor #mobileContent .action-slider input[type=range]{height:48px}.mobile-editor #mobileContent .action-reset{min-height:40px;font-size:12px}.mobile-editor #mobileContent .slider-guide{display:flex!important;font-size:11px}.mobile-editor #mobileContent .text-entry{display:block}.mobile-editor #mobileContent .text-entry label{display:block;max-width:none;margin-bottom:7px;font-size:10px}.mobile-editor #mobileContent .text-entry textarea{width:100%;height:58px;min-height:58px;font-size:26px;line-height:38px}.mobile-editor #mobileContent .text-actions{flex-wrap:wrap;gap:8px}.mobile-editor #mobileContent .text-actions button{min-height:48px;font-size:12px;padding:8px}.mobile-editor #addLayer{background:#314529;color:#dff7bf}.mobile-editor #mobileContent .font-gallery-tabs{background:#171f27;top:-16px;padding:8px 0;z-index:3}.mobile-editor #mobileContent .font-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mobile-editor #mobileContent .font-card{min-height:124px}.mobile-editor #mobileContent .categories button{min-height:44px;font-size:12px}.mobile-editor #mobileContent .library-toolbar{top:16px;right:18px}.mobile-editor #favoriteFilter{background:#243326;border:1px solid #47643a;border-radius:11px;width:44px;height:44px}.mobile-editor #mobileContent .searchbox{min-height:48px;padding-right:48px}.mobile-editor #mobileContent .quick-swatches button{width:38px;height:38px}.mobile-editor #mobileContent .range-control{margin:18px 0}.mobile-editor #mobileContent .range-control input[type=number]{height:44px;font-size:14px;min-width:60px}.mobile-editor #mobileContent .photo-buttons,.mobile-editor #mobileContent .placement-buttons{gap:10px}.mobile-editor #mobileContent .photo-quick-actions{flex-wrap:wrap;gap:8px}.mobile-editor .photo-quick-actions button{min-height:48px;font-size:12px}.mobile-editor #mobileContent .texture-slider label{font-size:14px}.mobile-editor .canvas-options{display:block;position:absolute;top:12px;right:12px;z-index:8}.canvas-options>summary{list-style:none;display:flex;align-items:center;gap:5px;border:1px solid #50603d;background:#16201aee;border-radius:12px;height:48px;min-height:48px;padding:0 11px;color:#dbedbf;font-size:20px;cursor:pointer}.canvas-options>summary span{font-size:11px}.canvas-options>summary::-webkit-details-marker{display:none}.canvas-view-menu{position:absolute;right:0;top:56px;width:250px;border:1px solid #536b40;padding:14px;border-radius:16px;background:#151f1af5;box-shadow:0 12px 50px #000a;display:flex;flex-direction:column;gap:12px}.view-menu-title{color:#bace9f;text-transform:uppercase;letter-spacing:1.5px;font-size:10px;margin:0}.mobile-editor .canvas-view-menu .background-picker{gap:8px;padding:0;justify-content:space-between}.mobile-editor .canvas-view-menu .bg-option{width:64px;height:48px;border-radius:10px;background:#25332a;border:1px solid #485c3d}.canvas-view-menu .bg-option span{width:26px;height:26px}.mobile-editor .canvas-view-menu #fit{width:100%;height:48px;border-radius:10px;background:#2e4427;font-size:13px;color:#e1f2c9;border:1px solid #627c43}.mobile-editor .canvas-view-menu .canvas-transform,.mobile-editor .canvas-view-menu .canvas-zoom{position:static;display:flex;border:0;background:transparent;box-shadow:none;padding:0;gap:8px;justify-content:space-between;align-items:center}.canvas-view-menu .canvas-transform button{flex:1;font-size:11px}.mobile-editor .canvas-view-menu .canvas-zoom button{width:58px;height:48px;font-size:24px}.mobile-editor .canvas-view-menu .canvas-zoom output{font-size:13px}.mobile-editor .create-controls{display:block}.create-controls h2{font-size:23px;font-weight:700;color:#eff6e5;letter-spacing:-.5px;margin:4px 0 8px}.create-controls p{font-size:13px;color:#aebda0;line-height:1.6;margin:0 0 18px}.create-tiles{display:grid;gap:10px}.create-tiles button{display:flex;align-items:center;gap:14px;padding:14px;background:#263228;border:1px solid #4a603c;border-radius:16px;min-height:78px;text-align:left}.create-tiles button>b{width:40px;font-size:27px;font-weight:500;text-align:center;color:#d8f6b3}.create-tiles button>span{flex:1;display:flex;flex-direction:column;gap:5px}.create-tiles strong{font-size:15px;color:#eef7e2}.create-tiles small{font-size:12px;color:#b7cda4}.create-tiles i{font-size:21px;color:#d1eaaf;font-style:normal}.mobile-editor .empty-canvas{max-width:calc(100% - 32px);width:320px}.mobile-editor #toast{bottom:calc(92px + env(safe-area-inset-bottom));z-index:30}.mobile-editor #eyedropperToolbar{max-width:calc(100% - 24px);top:12px}.mobile-editor.picking-photo-color .canvas-options{display:none}.mobile-editor #toolDrawer:has([data-drawer-panel=create]:not([hidden])){--drawer-height:min(460px,55dvh)}.mobile-editor #toolDrawer:has([data-drawer-panel=fonts]:not([hidden])){--drawer-height:min(560px,65dvh)}
}
@media(max-width:379px){.mobile-editor #previewDock .stage-toolbar{padding-left:8px;padding-right:8px}.phone-brand b{font-size:14px;letter-spacing:1.6px}.phone-brand small{font-size:6px;letter-spacing:1px}.mobile-editor .header-actions{gap:4px}.mobile-editor .header-actions button{width:40px}.mobile-editor .header-actions #save{width:43px}.mobile-editor .header-actions #exportTop{width:74px;font-size:11px}.mobile-editor .header-actions #exportTop svg{width:14px}.mobile-editor .main-dock{gap:7px;padding-left:9px;padding-right:9px}.main-action{font-size:14px;gap:5px}.mobile-editor #mobileContent>[data-drawer-panel]{padding-left:14px;padding-right:14px}.mobile-editor .effect-tabs button{font-size:11px;padding:7px 8px}}
@media(max-width:960px) and (max-height:500px){.mobile-editor #previewDock .stage-toolbar{min-height:48px;height:48px}.mobile-editor #objectPicker{height:44px;min-height:44px;flex-basis:44px}.mobile-editor .main-dock{height:64px;padding-top:6px;padding-bottom:6px}.main-action{min-height:50px}.mobile-editor .tool-drawer{bottom:70px;min-height:150px}.mobile-editor .drawer-handle{height:18px;min-height:18px}.mobile-editor .drawer-heading{height:36px}}
@keyframes tools-rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* PLACASO identity and a preview that stays clear of the editing sheet. */
.brand-wordmark{display:block;width:205px;height:43px;object-fit:contain;object-position:left center}.brand small{display:block;margin-top:5px;font-size:11px;font-weight:300;letter-spacing:3px;color:#b8c1b2;text-transform:none}
@media(max-width:960px){
 .mobile-editor .phone-brand{width:128px;gap:0;align-items:center}.phone-brand .brand-wordmark{width:128px;height:31px;object-position:center}.phone-brand small{font-size:10px;font-weight:300;letter-spacing:2px;margin-top:3px;color:#bcc7b3}
 .mobile-editor .header-actions{gap:4px}.mobile-editor .header-actions button{width:40px}.mobile-editor .header-actions #save{width:44px}.mobile-editor .header-actions #exportTop{width:72px;font-size:11px}
 .mobile-editor #artboard{position:absolute;left:0;top:0;width:100%;height:calc(100% - var(--tools-space,0px));min-height:1px}
 .mobile-editor .tool-drawer{min-height:100px;max-height:none;animation:none}
 .mobile-editor .drawer-heading{height:54px;padding:4px 10px;gap:8px;flex-shrink:0}
 .mobile-editor .drawer-heading strong{flex:1;font-size:14px}
 .mobile-editor .drawer-handle{display:grid;position:static;place-items:center;width:44px;height:44px;min-height:44px;padding:0;flex:0 0 44px;border-radius:11px;background:#202b2b}
 .mobile-editor .drawer-handle span{width:24px;height:4px}
 .mobile-editor .drawer-tabs,.mobile-editor .drawer-tabs .tool-strip{height:54px;min-height:54px}
 .mobile-editor.tools-open .selection-actions{display:none}
}
@media(max-width:359px){.mobile-editor .phone-brand{width:106px}.phone-brand .brand-wordmark{width:106px;height:29px}.phone-brand small{font-size:9px;letter-spacing:1.6px}.mobile-editor .header-actions button{width:36px}.mobile-editor .header-actions #save{width:40px}.mobile-editor .header-actions #exportTop{width:65px}}
@media(max-width:960px){.mobile-editor.editor-keyboard .drawer-tabs{display:none}.mobile-editor.editor-keyboard[data-tool=text] #mobileContent>.text-dock{padding:8px 12px}.mobile-editor.editor-keyboard[data-tool=text] .text-entry label{display:none}.mobile-editor.editor-keyboard[data-tool=text] #wordInput{height:52px;min-height:52px}}

/* The collection has only two large category actions on a phone. */
@media(max-width:960px){.mobile-editor #mobileContent .categories{display:grid;grid-template-columns:1fr 1fr;overflow:visible;gap:8px;padding:0;margin:0 0 10px}.mobile-editor #mobileContent .categories button{width:100%;min-height:50px;white-space:normal;flex:none;font-size:13px;font-weight:700}}
