.bitmap-tool{padding-top:120px;padding-bottom:64px;font-family:var(--font-sans)}.bitmap-tool button,.bitmap-tool input,.bitmap-tool textarea{font:inherit;color:inherit}.bitmap-tool button{border:0;background:transparent;cursor:pointer;transition:color .14s ease,background-color .14s ease}.bitmap-tool button:disabled{opacity:.35;cursor:default}.bitmap-tool [hidden]{display:none!important}.bitmap-tool :is(button,input,textarea,summary,canvas):focus-visible{outline:2px solid var(--color-accent-red);outline-offset:4px}.bitmap-tool button:hover:not(:disabled),.bitmap-tool a:hover{color:var(--color-accent-red)}.bitmap-back{font-size:12px;color:var(--color-text-sub);text-decoration:none}.bitmap-title-line{display:flex;justify-content:space-between;align-items:baseline;gap:24px;margin-top:24px}.bitmap-title-line h1{font-family:var(--font-serif);font-weight:600;font-size:36px;line-height:1.3}.bitmap-title-dot{display:inline-block;width:7px;height:7px;margin:0 0 5px 14px;border-radius:50%;background:var(--color-accent-red);animation:bitmap-dot-arrive .42s ease-out both}@keyframes bitmap-dot-arrive{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.bitmap-eyebrow,.bitmap-mono,.bitmap-canvas-meta,.bitmap-local-note{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.bitmap-eyebrow{color:var(--color-text-sub);font-size:11px;letter-spacing:.08em;white-space:nowrap}.bitmap-intro{font-family:var(--font-serif);margin-top:14px;font-size:15px;color:var(--color-text-sub);line-height:1.8}.bitmap-header{margin-bottom:28px}.bitmap-size-bar{display:flex;align-items:center;flex-wrap:wrap;gap:16px 24px;padding-block:20px;border-block:1px solid var(--color-border-light)}.bitmap-size-bar h2,.bitmap-group-title{font-size:14px;font-weight:600}.bitmap-size-bar .bitmap-dimensions{width:244px}.bitmap-tool .bitmap-apply{padding:10px 16px;border:1px solid var(--color-text-main);border-radius:3px;font-size:13px}.bitmap-tool .bitmap-apply:hover{border-color:var(--color-accent-red)}.bitmap-size-bar .bitmap-presets{margin:0 0 0 auto}.bitmap-size-feedback{flex-basis:100%;font-size:12px;color:var(--color-text-sub)}.bitmap-size-feedback[data-error=true],.bitmap-status[data-error=true]{color:var(--color-accent-red)}.bitmap-status{font-size:12px;color:var(--color-text-sub);min-height:20px;margin:12px 0 24px;line-height:1.7}.bitmap-workspace{display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px;align-items:start}.bitmap-section{padding-bottom:24px;margin-bottom:24px;border-bottom:1px solid var(--color-border-light)}.bitmap-section:last-child{border-bottom:0;margin-bottom:0}.bitmap-section h2{display:flex;justify-content:space-between;align-items:baseline;font-size:14px;font-weight:600;margin-bottom:18px}.bitmap-section h2 span{font-family:ui-monospace,Consolas,monospace;font-size:10px;font-weight:400;color:var(--color-text-sub)}.bitmap-tool input:is([type=text],[type=number]),.bitmap-tool textarea:not(.bitmap-code){width:100%;min-width:0;border:0;border-bottom:1px solid var(--color-border-light);border-radius:0;background:transparent;padding:8px 0;font-size:13px}.bitmap-tool textarea{resize:vertical}.bitmap-tool input::placeholder,.bitmap-tool textarea::placeholder{color:var(--color-text-sub)}.bitmap-dimensions{display:flex;align-items:center;gap:12px}.bitmap-dimensions label{display:flex;align-items:center;gap:8px;flex:1;min-width:0;color:var(--color-text-sub);font-size:12px}.bitmap-dimensions input[type=number]{font:18px ui-monospace,Consolas,monospace;color:var(--color-text-main);padding-block:8px}.bitmap-dimensions>span{color:var(--color-text-sub);font-size:14px}.bitmap-dimensions .bitmap-unit{font-size:11px}.bitmap-text-button{font-size:12px!important;margin-top:12px;padding:4px 0}.bitmap-presets{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}.bitmap-presets button{font:12px ui-monospace,Consolas,monospace;padding:6px 0;color:var(--color-text-sub)}.bitmap-presets button[aria-pressed=true]{color:var(--color-text-main);text-decoration:underline;text-underline-offset:5px}.bitmap-hint{font-size:12px;line-height:1.8;color:var(--color-text-sub);margin-top:10px;overflow-wrap:anywhere}.bitmap-file-button{position:relative;display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:8px 0;border-bottom:1px solid var(--color-border-light);font-size:13px}.bitmap-file-button input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.bitmap-file-button:focus-within{outline:2px solid var(--color-accent-red);outline-offset:4px}.bitmap-choice{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.bitmap-choice button{padding:8px 0;font-size:12px;border-bottom:1px solid transparent;color:var(--color-text-sub)}.bitmap-choice button[aria-pressed=true],.bitmap-choice button[aria-selected=true]{color:var(--color-accent-red);border-bottom-color:currentColor}.bitmap-source-tabs{gap:24px;border-bottom:1px solid var(--color-border-light);margin-top:12px}.bitmap-source-tabs button{font-size:14px;padding-block:12px}.bitmap-source-panel{margin-top:20px;margin-bottom:0;border-bottom:0}.bitmap-input-intro{font-size:13px;line-height:1.9}.bitmap-project-actions{display:flex;align-items:center;gap:24px;padding-bottom:20px;border-bottom:1px solid var(--color-border-light)}.bitmap-project-actions button,.bitmap-project-actions label{font-size:12px}.bitmap-preview-details{margin-top:18px;font-size:12px}.bitmap-preview-details summary{cursor:pointer}.bitmap-preview-details summary span{color:var(--color-text-sub);margin-left:16px;font-size:11px}.bitmap-setup .bitmap-choice{margin-top:12px;gap:10px}.bitmap-range-label{display:flex;justify-content:space-between;font-size:11px;margin-top:18px}.bitmap-range-label output{font-family:ui-monospace,Consolas,monospace}.bitmap-tool input[type=range]{width:100%;margin-top:12px;accent-color:var(--color-text-main)}.bitmap-check{display:flex;align-items:center;gap:8px;font-size:11px;margin-top:14px;line-height:1.5}.bitmap-check input{accent-color:var(--color-accent-red)}.bitmap-inline-field{display:flex;align-items:baseline;gap:8px;font-size:11px;color:var(--color-text-sub);margin-top:12px}.bitmap-inline-field input[type=number]{width:64px}.bitmap-editor{min-width:0}.bitmap-toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:32px;margin-bottom:18px}.bitmap-toolbar .bitmap-choice button{font-size:12px}.bitmap-history{display:flex;gap:12px}.bitmap-history button{font-size:16px}.bitmap-history span{font-size:12px;margin-left:2px}.bitmap-stage{display:flex;align-items:safe center;justify-content:safe center;min-height:360px;max-height:620px;overflow:auto;background:#ecefea;border:1px solid var(--color-border-light)}#bitmap-canvas{display:block;flex:none;touch-action:none;cursor:crosshair}.bitmap-canvas-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:12px;color:var(--color-text-sub);font-size:10px}.bitmap-zoom{display:flex;align-items:center;gap:10px}.bitmap-zoom button{font-size:12px;min-width:24px;min-height:28px}.bitmap-transforms{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:16px;padding-top:12px;border-top:1px solid var(--color-border-light)}.bitmap-transforms button{font-size:12px;padding-block:6px}.bitmap-edit-hint{margin-top:14px}.bitmap-pixel-stage{height:152px;display:flex;align-items:center;justify-content:center}#bitmap-preview{display:block;image-rendering:pixelated;max-width:100%;max-height:140px}.bitmap-output-settings{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:48px}.bitmap-output-settings .bitmap-section{margin-bottom:0;border:0}.bitmap-preview-details .bitmap-choice{justify-content:center}.bitmap-format-presets{display:flex;flex-wrap:wrap;gap:16px}.bitmap-format-presets button{text-align:left;padding:10px 12px;border-left:2px solid transparent;font-size:13px}.bitmap-format-presets button span{display:block;font-size:10px;color:var(--color-text-sub);margin-top:5px}.bitmap-format-presets button[aria-pressed=true]{border-left-color:var(--color-accent-red);background:#24302e09}.bitmap-advanced{margin-top:18px}.bitmap-advanced summary{cursor:pointer;font-size:11px;color:var(--color-text-sub)}.bitmap-field-label{display:block;font-size:11px;color:var(--color-text-sub);margin-top:16px}.bitmap-advanced .bitmap-choice{justify-content:flex-start;margin-top:4px;gap:10px}.bitmap-export{margin-top:40px;padding-top:28px;border-top:1px solid var(--color-border-light)}.bitmap-export-header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.bitmap-export-header h2{font-family:var(--font-serif);font-size:23px;font-weight:600}.bitmap-export-meta{font-size:11px}.bitmap-export-actions{display:flex;gap:20px;align-items:center}.bitmap-export-actions button{font-size:12px;min-height:40px}.bitmap-tool .bitmap-primary{background:var(--color-text-main);color:var(--color-bg);padding:12px 20px;border-radius:4px}.bitmap-tool .bitmap-primary:hover{background:var(--color-accent-red);color:var(--color-bg)}.bitmap-primary span{margin-left:14px}.bitmap-tool .bitmap-code{display:block;width:100%;background:transparent;border:0;border-block:1px solid var(--color-border-light);border-radius:0;padding:20px 0;font:12px/1.9 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre;min-height:200px;max-height:460px;overflow:auto}.bitmap-secondary-actions{display:flex;flex-wrap:wrap;gap:24px;align-items:center;margin-top:16px}.bitmap-code-details{padding-block:14px;border-block:1px solid var(--color-border-light)}.bitmap-code-details>summary{cursor:pointer;font-size:13px}.bitmap-code-details .bitmap-code{margin-top:12px;border:0}.bitmap-secondary-actions button,.bitmap-import-project{font-size:11px;padding:8px 0}.bitmap-import-project{border-bottom:0}.bitmap-footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-top:36px;font-size:11px;color:var(--color-text-sub);line-height:1.6}.bitmap-footer p[data-error=true]{color:var(--color-accent-red)}.bitmap-local-note{font-size:10px;letter-spacing:.03em}.bitmap-help{margin-top:28px;padding-top:20px;border-top:1px solid var(--color-border-light);font-size:12px;color:var(--color-text-sub)}.bitmap-help summary{cursor:pointer}.bitmap-help>div{max-width:680px;padding-top:16px}.bitmap-help p{margin-bottom:12px;line-height:1.9}.bitmap-help a{color:var(--color-text-main);text-underline-offset:3px}.bitmap-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:900px){.bitmap-workspace{grid-template-columns:192px minmax(0,1fr);gap:24px}.bitmap-size-bar .bitmap-presets{margin-left:0}.bitmap-output-settings{grid-template-columns:minmax(0,1fr) 180px;gap:24px}}@media(max-width:600px){.bitmap-tool{padding-top:104px}.bitmap-title-line h1{font-size:28px}.bitmap-eyebrow{font-size:9px}.bitmap-size-bar{gap:12px 16px}.bitmap-size-bar h2{flex-basis:100%}.bitmap-size-bar .bitmap-dimensions{flex:1;width:auto}.bitmap-size-bar .bitmap-presets{flex-basis:100%}.bitmap-workspace{display:flex;flex-direction:column}.bitmap-setup,.bitmap-editor{width:100%}.bitmap-source-panel,.bitmap-project-actions{padding-bottom:16px}.bitmap-setup .bitmap-choice{margin-top:4px}.bitmap-stage{min-height:320px;max-height:440px}.bitmap-export{margin-top:24px}.bitmap-output-settings{display:block}.bitmap-output-settings .bitmap-section{padding-bottom:20px}.bitmap-export-header{align-items:flex-start;flex-direction:column}.bitmap-export-actions{width:100%;justify-content:space-between}.bitmap-secondary-actions{gap:18px}.bitmap-history span{display:none}}@media(prefers-reduced-motion:reduce){.bitmap-tool button{transition:none}.bitmap-title-dot{animation:none}}
