#mandala-app{font-family:'Zen Kaku Gothic New',sans-serif;background-color:#fdfbf7;overscroll-behavior:none;user-select:none}#mandala-app ::-webkit-scrollbar{width:6px;height:6px}#mandala-app ::-webkit-scrollbar-track{background:transparent}#mandala-app ::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}#mandala-app ::-webkit-scrollbar-thumb:hover{background:#94a3b8}.canvas-container{background-image:linear-gradient(45deg,#f0f0f0 25%,transparent 25%) , linear-gradient(-45deg,#f0f0f0 25%,transparent 25%) , linear-gradient(45deg,transparent 75%,#f0f0f0 75%) , linear-gradient(-45deg,transparent 75%,#f0f0f0 75%);background-size:20px 20px;background-position:0 0 , 0 10px , 10px -10px , -10px 0;box-shadow:inset 0 0 20px rgba(0,0,0,.05)}#quickColorBar .recent-chip{width:16px;height:16px;border-radius:4px;border:1px solid #e2e8f0}.resizer{width:6px;cursor:col-resize;background:linear-gradient(to right,rgba(203,213,225,0),rgba(203,213,225,.8),rgba(203,213,225,0))}.resizer:hover{background:linear-gradient(to right,rgba(148,163,184,0),rgba(148,163,184,.9),rgba(148,163,184,0))}.floating-panel{position:fixed;top:88px;right:24px;width:300px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.12);z-index:1000}.floating-panel .panel-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid #f1f5f9;font-weight:600;color:#334155}.floating-panel .panel-header button{color:#64748b}.floating-panel .panel-header button:hover{color:#0f172a}.floating-panel .panel-body{padding:12px;max-height:60vh;overflow:auto}input[type="color"]{-webkit-appearance:none;appearance:none;border:none;width:32px;height:32px;border-radius:50%;overflow:hidden;padding:0;cursor:pointer}input[type="color"]::-webkit-color-swatch-wrapper{padding:0}input[type="color"]::-webkit-color-swatch{border:none;border-radius:50%;border:1px solid rgba(0,0,0,.1)}.tool-btn{transition:all .2s ease}.tool-btn.active{background-color:#e2e8f0;color:#0f172a;transform:translateY(-1px)}.cursor-brush{cursor:url(data:image/svg+xml;utf8,<svg\ xmlns=\'http://www.w3.org/2000/svg\'\ width=\'24\'\ height=\'24\'\ viewport=\'0\ 0\ 24\ 24\'\ fill=\'%231e293b\'\ stroke=\'none\'><path\ d=\'M9.06\ 11.9\ 17.13\ 3.84a2.85\ 2.85\ 0\ 1\ 1\ 4.03\ 4.03l-8.06\ 8.08a.5.5\ 0\ 0\ 1-.15.12l-4\ 1.5a.5.5\ 0\ 0\ 1-.63-.63l1.5-4a.5.5\ 0\ 0\ 1\ .12-.15zm-1.99\ 3.04c-1.66\ 0-3\ 1.35-3\ 3.02\ 0\ 1.33-2.5\ 1.52-2.5\ 4.04\ 0\ 2.5\ 2.5\ 2.5\ 4\ 2.5\ 2.5\ 0\ 4-2.5\ 4.5-5\ 0-1.23-.13-3.08-.63-4.55l-.37.37z\'/></svg>) 0 24 , auto}.cursor-eraser{cursor:url(data:image/svg+xml;utf8,<svg\ xmlns=\'http://www.w3.org/2000/svg\'\ width=\'24\'\ height=\'24\'\ viewport=\'0\ 0\ 24\ 24\'\ fill=\'none\'\ stroke=\'%231e293b\'\ stroke-width=\'2\'><circle\ cx=\'12\'\ cy=\'12\'\ r=\'8\'/></svg>) 12 12 , auto}.cursor-grab{cursor:grab}.cursor-grabbing{cursor:grabbing}.spinner{border:3px solid rgba(0,0,0,.1);width:24px;height:24px;border-radius:50%;border-left-color:#09f;animation:spin 1s ease infinite}@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}.layer-stack{position:relative;box-shadow:0 20px 25px -5px rgba(0,0,0,.1) , 0 10px 10px -5px rgba(0,0,0,.04);background-color:#fff}.layer-canvas{position:absolute;top:0;left:0;width:100%;height:100%;touch-action:none;transform-origin:center center}#contextMenu{position:absolute;z-index:100;width:180px;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);border:1px solid rgba(0,0,0,.1);border-radius:12px;box-shadow:0 10px 25px -5px rgba(0,0,0,.1) , 0 8px 10px -6px rgba(0,0,0,.1);padding:6px;display:none;transform-origin:top left;animation:menuIn .1s ease-out forwards}@keyframes menuIn {
    from { opacity: 0; transform: scale(0.9); }
    to { opacity: 1; transform: scale(1); }
}.ctx-item{display:flex;align-items:center;gap:10px;padding:8px 12px;font-size:13px;color:#334155;border-radius:8px;cursor:pointer;transition:all .15s}.ctx-item:hover{background-color:#f1f5f9;color:#0f172a}.ctx-item i{width:16px;height:16px;color:#64748b}.ctx-divider{height:1px;background-color:#e2e8f0;margin:4px 0}.carousel-panel{transition:transform .3s cubic-bezier(.16,1,.3,1);transform:translateY(100%)}.carousel-panel.open{transform:translateY(0)}.thumbnail-btn{transition:all .2s;border:2px solid transparent}.thumbnail-btn:hover{transform:translateY(-2px)}.thumbnail-btn.active{border-color:#0f766e;box-shadow:0 0 0 2px rgba(15,118,110,.2)}.lock-overlay{position:absolute;inset:0;background:rgba(15,23,42,.6);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(1px);transition:opacity .2s;border-radius:4px;z-index:10}.thumbnail-btn:hover .lock-overlay{background:rgba(15,23,42,.7)}.gradient-btn{position:relative;overflow:hidden}.gradient-btn.active{border:2px solid #0f766e;transform:scale(1.05)}.brush-type-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 4px;background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;transition:all .2s;position:relative;overflow:hidden;height:60px}.brush-type-btn:hover{background-color:#f1f5f9;transform:translateY(-1px)}.brush-type-btn.active{background-color:#f0fdfa;border-color:#0d9488;color:#0f766e;box-shadow:0 2px 4px rgba(13,148,136,.1)}.brush-type-btn i{margin-bottom:4px}.brush-lock{position:absolute;inset:0;background-color:rgba(255,255,255,.7);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(1px);z-index:10}.brush-type-btn:disabled{opacity:.8;cursor:not-allowed}.badge{display:inline-block;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500}.badge-premium{background-color:#fef3c7;color:#92400e}.badge-free{background-color:#e0f2fe;color:#075985}