.photo-editor{--gap:.75rem;--panel:var(--card-tint);--surface:var(--color-surface-raised);--control:2.25rem;gap:var(--gap);width:100%;min-width:0;min-height:0;padding:0 var(--gap) .25rem;background:var(--color-bg);color:var(--color-text-body);font-size:var(--text-sm);letter-spacing:var(--tracking-ui);flex:1;grid-template-rows:auto auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);line-height:1.45;display:grid;position:relative}.photo-editor .muted{color:var(--color-text-muted)}.photo-editor .small{font-size:var(--text-xs)}.photo-editor .icon{flex:none;width:1.125rem;height:1.125rem;display:inline-flex}.photo-editor .icon svg{width:100%;height:100%}.photo-editor .button{border-radius:var(--radius-pill);background:var(--surface);min-height:2.75rem;color:var(--color-text);font-size:var(--text-sm);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-ui);white-space:nowrap;cursor:pointer;transition:background-color var(--duration-fast) var(--ease), border-color var(--duration-fast) var(--ease), transform var(--duration-fast) var(--ease);border:1px solid #0000;justify-content:center;align-items:center;gap:.5rem;padding:0 1.25rem;line-height:1;display:inline-flex}.photo-editor .button:active:not(:disabled){transform:scale(.98)}.photo-editor .button.primary{background:var(--accent-strong);color:var(--color-on-accent)}.photo-editor .button.primary:hover:not(:disabled){background:var(--accent-hover)}.photo-editor .button.secondary{border-color:var(--color-border-strong);background:var(--surface)}.photo-editor .button.secondary:hover:not(:disabled),.photo-editor .button.ghost:hover:not(:disabled){background:var(--panel)}.photo-editor .button.ghost{background:0 0}.photo-editor .button.small{min-height:var(--control);padding:0 1rem}.photo-editor .button:disabled{opacity:.45;cursor:not-allowed}.photo-editor .icon-button{width:var(--control);height:var(--control);border-radius:var(--radius-pill);color:var(--color-text);cursor:pointer;transition:background-color var(--duration-fast) var(--ease);background:0 0;border:0;flex:none;place-items:center;padding:0;display:inline-grid}.photo-editor .icon-button:hover:not(:disabled){background:var(--surface)}.photo-editor .icon-button[aria-pressed=true],.photo-editor .icon-button[aria-pressed=true]:hover:not(:disabled){background:var(--color-text);color:var(--color-bg)}.photo-editor .icon-button:disabled{opacity:.35;cursor:not-allowed}.photo-editor :focus-visible{outline:2px solid var(--accent);outline-offset:2px}.photo-editor .button-row{flex-wrap:wrap;align-items:center;gap:.25rem;display:flex}.photo-editor input:not([type=checkbox],[type=range],[type=color]),.photo-editor select,.photo-editor textarea{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);width:100%;min-width:0;min-height:2.5rem;color:var(--color-text);font:inherit;transition:border-color var(--duration-fast) var(--ease);padding:.5rem .875rem}.photo-editor input:not([type=checkbox],[type=range],[type=color]):hover,.photo-editor select:hover,.photo-editor textarea:hover{border-color:var(--color-text-muted)}.photo-editor textarea{resize:vertical}.photo-editor input[type=checkbox]{width:1.125rem;height:1.125rem;accent-color:var(--accent)}.photo-editor input[type=color]{width:var(--control);height:var(--control);border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-bg);cursor:pointer;padding:.1875rem}.photo-editor input[type=color]::-webkit-color-swatch-wrapper{padding:0}.photo-editor input[type=color]::-webkit-color-swatch{border-radius:var(--radius-pill);border:0}.photo-editor input[type=range]{--fill:50%;cursor:pointer;appearance:none;background:0 0;width:100%;height:1.25rem;margin:0}.photo-editor input[type=range]::-webkit-slider-runnable-track{border-radius:var(--radius-pill);background:linear-gradient(to right, var(--accent) var(--fill), var(--color-border) var(--fill));height:.25rem}.photo-editor input[type=range]::-moz-range-track{border-radius:var(--radius-pill);background:linear-gradient(to right, var(--accent) var(--fill), var(--color-border) var(--fill));height:.25rem}.photo-editor input[type=range]::-webkit-slider-thumb{background:var(--color-surface-raised);width:1.125rem;height:1.125rem;box-shadow:0 0 0 1px var(--color-border), var(--shadow-md);appearance:none;border:0;border-radius:50%;margin-top:-.4375rem}.photo-editor input[type=range]::-moz-range-thumb{background:var(--color-surface-raised);width:1.125rem;height:1.125rem;box-shadow:0 0 0 1px var(--color-border), var(--shadow-md);border:0;border-radius:50%}.photo-editor input[type=range]:disabled{opacity:.4;cursor:not-allowed}.photo-editor label{min-width:0;color:var(--color-text);font-weight:var(--weight-medium);flex-direction:column;gap:.375rem;display:flex}.photo-editor label:has(>[type=checkbox]){flex-direction:row;align-items:center;gap:.5rem}.photo-editor fieldset{border:0;flex-direction:column;gap:.875rem;min-width:0;margin:0;padding:0;display:flex}.photo-editor .property-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;display:grid}.photo-editor .number-field span{color:var(--color-text-muted);font-size:var(--text-xs)}.photo-editor .range-field>span{justify-content:space-between;gap:.5rem;display:flex}.photo-editor .range-field output{color:var(--color-text-muted);font-variant-numeric:tabular-nums}.photo-editor .topbar{justify-content:space-between;align-items:center;gap:var(--space-2);min-height:4rem;display:flex}.photo-editor .topbar-group{align-items:center;gap:.5rem;min-width:0;display:flex}.photo-editor .menus{border-radius:var(--radius-pill);background:var(--panel);padding:.25rem;display:flex}.photo-editor .menu{position:relative}.photo-editor .menu summary{border-radius:var(--radius-pill);min-height:2rem;color:var(--color-text);font-weight:var(--weight-medium);cursor:pointer;transition:background-color var(--duration-fast) var(--ease);align-items:center;padding:0 .875rem;list-style:none;display:flex}.photo-editor .menu summary::-webkit-details-marker{display:none}.photo-editor .menu summary:hover{background:var(--surface)}.photo-editor .menu[open]>summary{background:var(--color-text);color:var(--color-bg);font-weight:var(--weight-semibold)}.photo-editor .menu>div{z-index:40;border-radius:var(--radius-md);background:var(--color-surface-raised);min-width:15rem;box-shadow:0 0 0 1px var(--color-border), var(--shadow-lg);flex-direction:column;padding:.375rem;display:flex;position:absolute;top:calc(100% + .5rem);left:0}.photo-editor .menu>div button{border-radius:var(--radius-sm);min-height:2.25rem;color:var(--color-text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;padding:0 .75rem;display:flex}.photo-editor .menu>div button:hover:not(:disabled){background:var(--panel)}.photo-editor .menu>div button:disabled{color:var(--color-text-muted);opacity:.6;cursor:not-allowed}.photo-editor .history{border-radius:var(--radius-pill);background:var(--panel);padding:.25rem;display:flex}.photo-editor .dimensions{color:var(--color-text);font-weight:var(--weight-semibold);font-variant-numeric:tabular-nums;white-space:nowrap;align-items:center;gap:.375rem;padding:0 .75rem;display:inline-flex}.photo-editor .local-badge{border-radius:var(--radius-pill);background:var(--accent-soft);color:var(--accent-text);font-size:var(--text-xs);font-weight:var(--weight-semibold);white-space:nowrap;align-items:center;gap:.375rem;padding:.5rem .875rem;display:inline-flex}.photo-editor .options-bar{border-radius:var(--radius-lg);background:var(--panel);align-items:center;gap:.25rem;min-height:3.25rem;padding:.5rem .75rem;display:flex}.photo-editor .tool-name{min-width:9rem;color:var(--color-text);font-weight:var(--weight-semibold);padding-right:.5rem}.photo-editor .options-separator{background:var(--color-border);width:1px;height:1.25rem;margin:0 .375rem}.photo-editor .zoom-field{flex-direction:row;align-items:center;gap:.375rem}.photo-editor .zoom-field input{width:4.5rem;min-height:var(--control);font-variant-numeric:tabular-nums;padding-block:.25rem}.photo-editor .main{gap:var(--gap);grid-template-columns:auto minmax(0,1fr) minmax(17rem,20rem);min-height:0;display:grid}.photo-editor .tools{border-radius:var(--radius-lg);background:var(--panel);scrollbar-width:thin;flex-direction:column;align-items:center;gap:.25rem;padding:.5rem;display:flex;overflow-y:auto}.photo-editor .tools .icon-button{width:2.5rem;height:2.5rem}.photo-editor .toolbar-color{margin-top:.5rem}.photo-editor .document-area{flex-direction:column;gap:.5rem;min-width:0;min-height:0;display:flex}.photo-editor .document-tabs{scrollbar-width:thin;flex:none;gap:.375rem;display:flex;overflow-x:auto}.photo-editor .document-tabs>div{border-radius:var(--radius-pill);background:var(--panel);align-items:center;max-width:15rem;padding-left:.25rem;display:flex}.photo-editor .document-tabs>div.active{background:var(--color-text);color:var(--color-bg)}.photo-editor .document-tabs>div.active .icon-button{color:inherit}.photo-editor .document-tabs>div.active .icon-button:hover{background:color-mix(in oklch, currentColor 14%, transparent)}.photo-editor .document-tabs button[role=tab]{min-width:0;min-height:var(--control);color:inherit;font:inherit;font-weight:var(--weight-semibold);text-overflow:ellipsis;white-space:nowrap;cursor:pointer;background:0 0;border:0;padding:0 .75rem;overflow:hidden}.photo-editor .canvas-area{border-radius:var(--radius-lg);background:var(--panel);min-height:0;color:var(--color-text-muted);touch-action:none;user-select:none;flex:1;position:relative;overflow:hidden}.photo-editor .canvas-area[data-tool=brush],.photo-editor .canvas-area[data-tool=eraser]{cursor:none}.photo-editor .canvas-area[data-tool=move]{cursor:default}.photo-editor .canvas-area[data-tool=text]{cursor:text}.photo-editor .canvas-area[data-tool=crop],.photo-editor .canvas-area[data-tool=rectangle],.photo-editor .canvas-area[data-tool=ellipse],.photo-editor .canvas-area[data-tool=lasso],.photo-editor .canvas-area[data-tool=shape]{cursor:crosshair}.photo-editor .document-canvas{transform-origin:0 0;background-color:var(--color-bg);background-image:conic-gradient(var(--color-border) 25%, transparent 0 50%, var(--color-border) 0 75%, transparent 0);box-shadow:0 0 0 1px var(--color-border), var(--shadow-lg);background-size:16px 16px;position:absolute;top:0;left:0}.photo-editor .canvas-overlay{width:100%;height:100%;color:var(--accent);pointer-events:none;position:absolute;inset:0}.photo-editor .empty-workspace{inset:var(--gap);padding:var(--space-4);border:2px dashed var(--color-border);border-radius:var(--radius-lg);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.75rem;display:flex;position:absolute}.photo-editor .empty-icon{border-radius:var(--radius-md);background:var(--accent-soft);width:3.5rem;height:3.5rem;color:var(--accent-text);place-items:center;display:grid}.photo-editor .empty-title{color:var(--color-text);font-size:var(--text-xl);font-weight:var(--weight-bold);letter-spacing:var(--tracking-heading)}.photo-editor .empty-workspace .button-row{justify-content:center;gap:.5rem;margin-block:.5rem}.photo-editor .empty-workspace .button{min-height:2.75rem;padding:0 1.25rem}.photo-editor .crop-toolbar{border-radius:var(--radius-md);background:var(--color-surface-raised);box-shadow:0 0 0 1px var(--color-border), var(--shadow-lg);align-items:flex-end;gap:.5rem;padding:.75rem;display:flex;position:absolute;bottom:1rem;left:50%;transform:translate(-50%)}.photo-editor .crop-toolbar label{color:var(--color-text-muted);font-size:var(--text-xs);gap:.25rem}.photo-editor .crop-toolbar input{width:6rem;min-height:var(--control);padding-block:.25rem}.photo-editor .side{gap:var(--gap);flex-direction:column;min-height:0;display:flex}.photo-editor .panel{border-radius:var(--radius-lg);background:var(--panel);flex-direction:column;min-height:0;display:flex}.photo-editor .settings-panel{flex:60%}.photo-editor .panel-tabs{border-radius:var(--radius-pill);background:var(--surface);flex:none;gap:.125rem;margin:.75rem .75rem .5rem;padding:.25rem;display:flex}.photo-editor .panel-tabs button{border-radius:var(--radius-pill);min-height:2rem;color:var(--color-text-muted);font:inherit;font-weight:var(--weight-medium);cursor:pointer;background:0 0;border:0;flex:1}.photo-editor .panel-tabs button:hover{color:var(--color-text)}.photo-editor .panel-tabs [aria-selected=true]{background:var(--color-text);color:var(--color-bg);font-weight:var(--weight-semibold)}.photo-editor .panel-scroll{scrollbar-width:thin;flex-direction:column;flex:1;gap:.5rem;min-height:0;padding-bottom:.75rem;display:flex;overflow-y:auto}.photo-editor .panel-heading{flex-direction:column;gap:.25rem;padding:1rem 1.25rem .5rem;display:flex}.photo-editor .panel-heading.row{flex-direction:row;justify-content:space-between;align-items:center}.photo-editor .panel-title{color:var(--color-text);font-size:var(--text-xl);font-weight:var(--weight-bold);line-height:var(--leading-heading);letter-spacing:var(--tracking-heading)}.photo-editor .panel-section{border-radius:var(--radius-md);background:var(--surface);flex-direction:column;gap:.875rem;margin:0 .75rem;padding:1rem;display:flex}.photo-editor .panel-section h3,.photo-editor .adjustments summary{color:var(--color-text);font-size:var(--text-sm);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-ui);justify-content:space-between;align-items:baseline;gap:.5rem;display:flex}.photo-editor .panel-section h3 span{color:var(--color-text-muted);font-weight:var(--weight-regular)}.photo-editor .tool-properties,.photo-editor .layer-properties,.photo-editor .type-properties,.photo-editor .shape-properties,.photo-editor .document-properties{flex-direction:column;gap:.875rem;display:flex}.photo-editor .adjustments summary{cursor:pointer}.photo-editor .adjustments[open] summary{margin-bottom:.875rem}.photo-editor .adjustment-row{align-items:flex-end;gap:.25rem;display:flex}.photo-editor .adjustment-row label{flex:1}.photo-editor .color-control{grid-template-columns:var(--control) minmax(0, 1fr);align-items:center;gap:.5rem;display:grid}.photo-editor .history-panel ol{flex-direction:column;gap:.125rem;margin:0;padding:0;list-style:none;display:flex}.photo-editor .history-panel li button{border-radius:var(--radius-sm);width:100%;min-height:2rem;color:var(--color-text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;padding:.25rem .625rem}.photo-editor .history-panel li:last-child button{background:var(--panel);font-weight:var(--weight-semibold)}.photo-editor .history-panel li button:hover{background:var(--panel)}.photo-editor .layers-panel{scrollbar-width:thin;flex:40%;gap:.5rem;padding-bottom:.75rem;overflow-y:auto}.photo-editor .layers-panel>label,.photo-editor .layers-panel>.range-field{margin:0 .75rem}.photo-editor .layers-panel>.button-row{margin:0 .5rem}.photo-editor .layer-list{scrollbar-width:thin;flex-direction:column;flex:1;gap:.25rem;min-height:3rem;margin:0 .75rem;display:flex;overflow-y:auto}.photo-editor .layer-row{border-radius:var(--radius-md);background:var(--surface);flex:none;align-items:center;gap:.25rem;min-height:3.25rem;display:flex}.photo-editor .layer-row.selected{background:var(--color-text);color:var(--color-bg)}.photo-editor .layer-row.selected .icon-button,.photo-editor .layer-row.selected small{color:inherit}.photo-editor .layer-row.selected .icon-button:hover{background:color-mix(in oklch, currentColor 14%, transparent)}.photo-editor .layer-select{min-width:0;color:inherit;font:inherit;font-weight:var(--weight-semibold);text-align:left;cursor:pointer;background:0 0;border:0;flex:1;align-items:center;gap:.5rem;padding:.25rem;display:flex}.photo-editor .layer-select>span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.photo-editor .layer-select small{color:var(--color-text-muted);font-size:var(--text-xs);font-weight:var(--weight-medium);display:block}.photo-editor .thumbnail{border-radius:var(--radius-sm);background:var(--color-bg);object-fit:contain;width:2.5rem;height:2rem;box-shadow:0 0 0 1px var(--color-border);flex:none}.photo-editor .status-bar{align-items:center;gap:var(--space-2);min-height:1.5rem;color:var(--color-text-muted);font-size:var(--text-xs);font-variant-numeric:tabular-nums;padding:0 .25rem;display:flex}.photo-editor .status-bar>span:first-child{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.photo-editor .notices{z-index:40;width:min(34rem, calc(100% - 2 * var(--gap)));pointer-events:none;flex-direction:column;gap:.5rem;display:flex;position:absolute;top:4.5rem;left:50%;transform:translate(-50%)}.photo-editor .notice{border-radius:var(--radius-md);background:var(--color-surface-raised);color:var(--color-text);box-shadow:0 0 0 1px var(--color-border), var(--shadow-lg);pointer-events:auto;align-items:flex-start;gap:.75rem;padding:.875rem .875rem .875rem 1.125rem;display:flex}.photo-editor .notice p{flex:1}.photo-editor .notice.error{background:var(--accent-soft);box-shadow:0 0 0 1px color-mix(in oklch, var(--accent) 40%, transparent), var(--shadow-lg)}.photo-editor .notice.error .icon{color:var(--accent-text)}.photo-editor .photo-dialog{border-radius:var(--radius-lg);background:var(--color-surface-raised);width:min(30rem,100vw - 2rem);max-height:90dvh;color:var(--color-text-body);box-shadow:0 0 0 1px var(--color-border), var(--shadow-lg);border:0;margin:auto;padding:1.5rem;overflow:auto}.photo-editor .photo-dialog::backdrop{background:color-mix(in oklch, var(--color-bg) 65%, transparent);backdrop-filter:blur(4px)}.photo-editor .photo-dialog header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.photo-editor .photo-dialog h2{color:var(--color-text);font-size:var(--text-xl);font-weight:var(--weight-bold);line-height:var(--leading-heading);letter-spacing:var(--tracking-heading)}.photo-editor .photo-dialog form{flex-direction:column;gap:.875rem;display:flex}.photo-editor .photo-dialog form>.button.primary,.photo-editor .photo-dialog form>button.primary{align-self:stretch}.photo-editor .memory-note,.photo-editor .photo-dialog [role=status]{color:var(--color-text-muted);font-size:var(--text-xs);font-variant-numeric:tabular-nums}.photo-editor .export-preview{border-radius:var(--radius-md);background:var(--panel);justify-content:center;align-items:center;height:11rem;margin-bottom:1rem;display:flex}.photo-editor .export-preview img{object-fit:contain;max-width:100%;max-height:100%}@media (width<=72rem){.photo-editor .local-badge,.photo-editor .dimensions{display:none}.photo-editor .main{grid-template-columns:auto minmax(0,1fr) minmax(15rem,17rem)}.photo-editor .tool-name{min-width:0}}@media (width<=60rem){.photo-editor .menu summary{padding:0 .5rem}}
