.canvas-container{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none;cursor:crosshair}.canvas-transform-wrapper{position:absolute;top:50%;left:50%}.canvas-layer{position:absolute;top:0;left:0}.canvas-image{z-index:1}.canvas-mask{z-index:2}.canvas-cursor{z-index:3;pointer-events:none}.zoom-indicator{position:absolute;bottom:8px;right:8px;background:#0009;color:#fff;padding:4px 8px;border-radius:4px;font-size:12px;pointer-events:none}.canvas-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;z-index:10;background:var(--tg-theme-bg-color, #ffffff)}.canvas-loading .spinner{width:40px;height:40px;border:3px solid var(--tg-theme-hint-color, #cccccc);border-top-color:var(--tg-theme-button-color, #3390ec);border-radius:50%;animation:spin 1s linear infinite}.toolbar{display:flex;align-items:center;padding:8px 12px;background:var(--tg-theme-secondary-bg-color, #f5f5f5);border-top:1px solid var(--tg-theme-hint-color, #e0e0e0);gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch}.toolbar-group{display:flex;align-items:center;gap:4px}.toolbar-separator{width:1px;height:28px;background:var(--tg-theme-hint-color, #d0d0d0);flex-shrink:0}.toolbar-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:none;border-radius:8px;background:var(--tg-theme-bg-color, #ffffff);cursor:pointer;transition:all .15s ease;-webkit-tap-highlight-color:transparent}.toolbar-btn:active{transform:scale(.95)}.toolbar-btn.active{background:var(--tg-theme-button-color, #3390ec);color:var(--tg-theme-button-text-color, #ffffff)}.toolbar-btn:disabled{opacity:.4;cursor:not-allowed}.toolbar-btn:disabled:active{transform:none}.toolbar-icon{font-size:18px;line-height:1}.brush-size-group{flex:1;min-width:120px;max-width:200px}.brush-size-label{display:flex;align-items:center;gap:8px;width:100%}.brush-size-slider{flex:1;height:4px;-webkit-appearance:none;appearance:none;background:var(--tg-theme-hint-color, #d0d0d0);border-radius:2px;outline:none}.brush-size-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:var(--tg-theme-button-color, #3390ec);border-radius:50%;cursor:pointer}.brush-size-slider::-moz-range-thumb{width:18px;height:18px;background:var(--tg-theme-button-color, #3390ec);border-radius:50%;border:none;cursor:pointer}.brush-size-value{min-width:45px;font-size:13px;color:var(--tg-theme-hint-color, #999999);text-align:right}.zoom-value{min-width:45px;font-size:13px;color:var(--tg-theme-hint-color, #999999);text-align:center}.toolbar-btn.save-btn{width:auto;padding:0 12px;gap:6px;background:var(--tg-theme-button-color, #3390ec);color:var(--tg-theme-button-text-color, #ffffff)}.toolbar-btn.save-btn:disabled{background:var(--tg-theme-hint-color, #cccccc)}.save-label{font-size:14px;font-weight:500}@media(max-width:480px){.toolbar{padding:6px 8px;gap:6px}.toolbar-btn{width:36px;height:36px}.toolbar-icon{font-size:16px}.brush-size-group{min-width:100px}.brush-size-value,.zoom-value{font-size:12px;min-width:40px}}.screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;padding:24px;background:var(--tg-theme-bg-color, #ffffff);color:var(--tg-theme-text-color, #000000)}.loading-screen{gap:16px}.loading-spinner{width:48px;height:48px;border:3px solid var(--tg-theme-hint-color, #e0e0e0);border-top-color:var(--tg-theme-button-color, #3390ec);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-message{font-size:16px;color:var(--tg-theme-hint-color, #999999)}.error-screen{gap:16px;text-align:center}.error-icon{font-size:56px}.error-message{font-size:16px;color:var(--tg-theme-hint-color, #999999);max-width:280px;line-height:1.5}.error-retry-btn{margin-top:8px;padding:12px 32px;font-size:16px;font-weight:500;color:var(--tg-theme-button-text-color, #ffffff);background:var(--tg-theme-button-color, #3390ec);border:none;border-radius:10px;cursor:pointer;transition:opacity .2s}.error-retry-btn:active{opacity:.8}.dialog-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:24px}.dialog{background:var(--tg-theme-bg-color, #ffffff);border-radius:16px;padding:24px;max-width:320px;width:100%;display:flex;flex-direction:column;align-items:center;gap:20px;box-shadow:0 4px 24px #00000026}.dialog-message{font-size:16px;text-align:center;color:var(--tg-theme-text-color, #000000);line-height:1.5}.dialog-buttons{display:flex;gap:12px;width:100%}.dialog-btn{flex:1;padding:12px 16px;font-size:15px;font-weight:500;border:none;border-radius:10px;cursor:pointer;transition:opacity .2s}.dialog-btn:active{opacity:.8}.dialog-btn-primary{background:var(--tg-theme-button-color, #3390ec);color:var(--tg-theme-button-text-color, #ffffff)}.dialog-btn-secondary{background:var(--tg-theme-secondary-bg-color, #f0f0f0);color:var(--tg-theme-text-color, #000000)}.save-spinner{width:40px;height:40px;border:3px solid var(--tg-theme-hint-color, #e0e0e0);border-top-color:var(--tg-theme-button-color, #3390ec);border-radius:50%;animation:spin .8s linear infinite}.progress-bar{width:100%;height:4px;background:var(--tg-theme-hint-color, #e0e0e0);border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:var(--tg-theme-button-color, #3390ec);transition:width .3s ease}.success-icon{width:56px;height:56px;border-radius:50%;background:#4caf50;color:#fff;font-size:32px;display:flex;align-items:center;justify-content:center}.dialog-countdown{font-size:14px;color:var(--tg-theme-hint-color, #999999);margin:0}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;overflow:hidden}.app{height:100%;display:flex;flex-direction:column;background:var(--tg-theme-bg-color, #ffffff);color:var(--tg-theme-text-color, #000000);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.app-header{display:flex;align-items:center;justify-content:center;padding:12px 16px;border-bottom:1px solid var(--tg-theme-hint-color, #e0e0e0);flex-shrink:0}.app-title{font-size:17px;font-weight:600}.dev-badge{margin-left:8px;padding:2px 6px;background:#ff9800;color:#fff;border-radius:4px;font-size:10px;font-weight:600}.app-canvas{flex:1;overflow:hidden;position:relative}
