.paint-window{position:absolute;left:max(100px,calc(50% - 390px));top:65px;width:min(780px,calc(100vw - 115px));height:min(600px,calc(100dvh - 110px));min-height:320px;display:flex;flex-direction:column;color:#000}.paint-menubar{display:flex;align-items:center;gap:0;min-height:22px;flex-shrink:0;padding:0 2px}.paint-menubar>button,.paint-menubar summary{border:0;background:none;padding:4px 7px;font:12px Arial;color:#000;cursor:pointer}.paint-menubar>button:hover,.classic-dropdown[open]>summary{background:#000080;color:#fff}.classic-dropdown{position:relative}.classic-dropdown>summary{list-style:none;cursor:pointer}.classic-dropdown>summary::-webkit-details-marker{display:none}.classic-popup{position:absolute;top:100%;left:0;z-index:500;min-width:205px;background:#c0c0c0;box-shadow:var(--border-out),1px 1px #000;padding:3px;display:flex;flex-direction:column;gap:1px;font:12px Arial;color:#000}.classic-popup>button{padding:6px 16px;border:0;background:none;text-align:left;display:flex;align-items:center;gap:25px;white-space:nowrap;min-height:25px}.classic-popup>button:hover:enabled{background:#000080;color:#fff}.classic-popup>button:disabled{color:#808080}.classic-popup kbd{margin-left:auto;font:11px Arial;white-space:nowrap}.classic-popup hr{border:0;border-top:1px solid #808080;border-bottom:1px solid #fff;width:calc(100% - 5px);margin:3px 0}.classic-popup>label{display:flex;align-items:center;gap:10px;padding:8px}.classic-popup select{font:12px Arial;border:1px solid #808080;background:white;padding:2px}.paint-workarea{display:flex;flex:1;min-height:0;border-top:1px solid #fff}.paint-toolbox{flex:0 0 58px;padding:3px 3px;overflow:auto;border-right:1px solid #808080;box-shadow:1px 0 #fff}.paint-tool-grid{display:grid;grid-template-columns:repeat(2,25px);grid-auto-rows:25px;gap:0}.paint-tool-grid>button{border:0;padding:2px;background:#c0c0c0;box-shadow:var(--border-out);width:25px;height:25px;display:grid;place-items:center}.paint-tool-grid>button>svg{width:20px;height:20px;pointer-events:none}.paint-tool-grid>button[aria-pressed=true]{box-shadow:var(--border-in);background:repeating-conic-gradient(#fff 0% 25%,#c0c0c0 0% 50%) 50%/2px 2px}.paint-options{border:1px solid #808080;border-right-color:#fff;border-bottom-color:#fff;margin-top:7px;padding:5px 2px}.paint-options label{font:9px Arial;display:flex;flex-direction:column;gap:4px;color:#333}.paint-options select{font:10px Arial;width:44px;padding:2px 0;background:white;border:1px solid #888;border-radius:0}.shape-modes{display:flex;flex-direction:column;gap:2px;margin-top:7px}.shape-modes button{background:#c0c0c0;border:0;height:22px;padding:4px}.shape-modes button[aria-pressed=true]{background:#000080}.shape-modes i{display:block;width:26px;height:12px;border:1px solid #000;background:#fff}.shape-modes button[data-paint-shape=outline] i{background:transparent}.shape-modes button[data-paint-shape=solid] i{border:0;background:#000}.shape-modes button[aria-pressed=true] i{border-color:#fff}.paint-workspace{background:#808080;flex:1;min-width:0;min-height:0;overflow:auto;padding:4px;box-shadow:inset 1px 1px #404040}.paint-stage{position:relative;margin:0 4px 4px 0;width:640px;height:400px;background:#fff;flex-shrink:0}#paint-canvas,#paint-overlay{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}#paint-canvas{touch-action:none;cursor:crosshair;outline:none}#paint-overlay{pointer-events:none}#paint-canvas[data-tool=text]{cursor:text}#paint-canvas[data-tool=zoom]{cursor:zoom-in}#paint-canvas[data-tool=select],#paint-canvas[data-tool=lasso]{cursor:crosshair}.canvas-handle{position:absolute;width:4px;height:4px;background:#000080;pointer-events:none}.h-right{right:-3px;top:50%}.h-bottom{left:50%;bottom:-3px}.h-corner{right:-3px;bottom:-3px}#paint-text{position:absolute;z-index:4;background:transparent;border:1px dashed #555;outline:none;min-width:30px;padding:0;margin:0;font-family:Arial;max-width:100%;border-radius:0}.paint-palette{display:flex;align-items:center;gap:7px;padding:7px 6px;flex-shrink:0;border-top:1px solid #fff;overflow:auto;min-height:53px}.paint-current-colors{width:39px;height:36px;background:repeating-conic-gradient(#fff 0% 25%,#c0c0c0 0% 50%) 50%/2px 2px;box-shadow:var(--border-in);border:0;position:relative;flex-shrink:0}.paint-current-colors i{width:19px;height:19px;position:absolute;box-shadow:inset 1px 1px #fff,inset -1px -1px #000,0 0 0 1px #808080}.paint-current-colors #paint-bg{left:13px;top:11px;background:#fff}.paint-current-colors #paint-fg{left:5px;top:5px;background:#000}.paint-swatches{display:grid;grid-template-columns:repeat(14,17px);grid-auto-rows:17px;gap:1px;flex-shrink:0}.paint-swatches>button{width:17px;height:17px;padding:0;border:0;box-shadow:inset 1px 1px #808080,inset -1px -1px #fff,inset 2px 2px #000;cursor:pointer}.paint-status{min-height:23px;display:flex;gap:3px;padding:2px 0 0;flex-shrink:0;font:11px Arial}.paint-status>span{box-shadow:inset 1px 1px #808080,inset -1px -1px #fff;padding:4px 6px;white-space:nowrap}.paint-status>span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.paint-status>span:nth-child(2){width:70px}.paint-window.maximized{left:0!important;top:0!important;width:100vw!important;height:calc(100dvh - var(--taskbar-height,36px))!important;max-width:none}.paint-status>span:last-child{min-width:70px}.paint-window .titlebar>strong{min-width:0}
@media(max-width:800px){.paint-window{top:91px;left:7px;width:calc(100vw - 14px);height:calc(100dvh - 133px);min-height:0}.paint-menubar>button,.paint-menubar summary{font-size:11px;padding:6px 5px}.paint-status{font-size:10px}.paint-status>span:nth-child(2){width:48px}.paint-status>span:last-child{min-width:64px}.paint-swatches{grid-template-columns:repeat(14,16px);grid-auto-rows:16px}.paint-swatches>button{width:16px;height:16px}.paint-palette{padding:7px 5px;gap:5px}.paint-workspace{padding:4px}.paint-tool-grid{grid-template-columns:repeat(2,25px);grid-auto-rows:27px}.paint-tool-grid>button{height:27px}.paint-toolbox{flex-basis:58px}}
@media(max-width:360px){.paint-menubar>button,.paint-menubar summary{font-size:10px;padding:6px 4px}.paint-current-colors{width:31px}.paint-current-colors #paint-bg{left:8px}.paint-current-colors #paint-fg{left:3px}.paint-palette{gap:4px;padding-left:4px;padding-right:4px}.paint-swatches{grid-template-columns:repeat(14,16px);gap:0}.paint-status>span:last-child{display:none}.classic-popup{min-width:180px}.classic-popup>button{font-size:11px;padding:6px 10px;gap:10px}.paint-toolbox{flex-basis:54px;padding-left:1px;padding-right:1px}}