:root{--accent: #2563eb;--bg-gray: #f8fafc;--border-color: #e2e8f0;--text-main: #333333;--text-sub: #94a3b8}body,html{margin:0;padding:0;overflow:hidden;font-family:Pretendard,-apple-system,sans-serif;height:100%;width:100%;background-color:#fff}.header{position:absolute;top:0;left:0;right:0;background:#fff;padding:5px 15px;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;z-index:10;height:45px;box-sizing:border-box}.header-left{display:flex;align-items:center;gap:10px;flex-shrink:0}.home-btn{text-decoration:none;color:var(--text-sub);font-size:.7rem;padding:3px 6px;border:1px solid var(--border-color);border-radius:4px}.header-title{font-weight:600;font-size:.8rem;color:#555}#toolbar-container{display:flex;align-items:center;gap:12px;background:var(--bg-gray);padding:4px 12px;border-radius:20px;border:1px solid var(--border-color)}.tool-btn{background:none;border:none;cursor:pointer;padding:4px;border-radius:50%;transition:background .2s;display:flex;align-items:center;justify-content:center}.tool-btn:hover{background:#e2e8f0}.tool-btn.active{background:#fff;box-shadow:0 2px 5px #0000001a}.tool-label{font-size:.7rem;color:var(--text-sub);margin-right:-5px}input[type=color]{-webkit-appearance:none;border:none;width:20px;height:20px;cursor:pointer;background:none;padding:0}input[type=color]::-webkit-color-swatch{border-radius:50%;border:1px solid var(--border-color)}input[type=range]{width:60px;height:4px;accent-color:var(--accent);cursor:pointer}#clear{background:none;border:none;cursor:pointer;font-size:.9rem;opacity:.6;transition:opacity .2s}#clear:hover{opacity:1}#canvas{display:block;cursor:crosshair;background-color:#fff;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}#canvas.eraser-mode{cursor:cell}@media (max-width: 768px){#toolbar-container{gap:8px;padding:2px 8px}input[type=range]{width:40px}.tool-label{display:none}}