*{box-sizing:border-box;margin:0;padding:0}html,body{background:#1a1a1a;width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}#app{width:100%;height:100%;position:relative}#editor-canvas{touch-action:none;background:#2a2a2a;width:100%;height:100%;display:block}#toolbar{bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:100;background:#000c;border-radius:12px;gap:10px;padding:10px;display:flex;position:fixed;left:50%;transform:translate(-50%)}#toolbar button{color:#888;cursor:pointer;background:0 0;border:2px solid #888;border-radius:12px;justify-content:center;align-items:center;width:48px;height:48px;transition:border-color .2s,color .2s,background .2s;display:flex}#toolbar button svg{width:24px;height:24px}#toolbar button:hover{color:#fff;border-color:#fff}#toolbar button:active{background:#ffffff1a}#btn-delete{color:#e74c3c;border-color:#e74c3c;position:relative}#btn-delete:hover{color:#ff6b5b;border-color:#ff6b5b}.delete-tooltip{color:#fff;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;background:#e74c3c;border-radius:6px;padding:8px 12px;font-size:12px;font-weight:500;transition:opacity .2s,visibility .2s;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.delete-tooltip:after{content:"";border:6px solid #0000;border-top-color:#e74c3c;position:absolute;top:100%;left:50%;transform:translate(-50%)}#btn-delete.confirming .delete-tooltip{opacity:1;visibility:visible}#btn-export{color:#2ecc71;border-color:#2ecc71}#btn-export:hover{color:#4ade80;border-color:#4ade80}.hidden{display:none!important}#side-buttons{z-index:100;flex-direction:column;gap:10px;display:flex;position:fixed;top:50%;right:20px;transform:translateY(-50%)}#side-buttons button{color:#fff;cursor:pointer;background:#000c;border:none;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;transition:background .2s;display:flex}#side-buttons button:hover{background:#000000e6}#btn-lock .icon-locked{display:none}#btn-lock .icon-unlocked{display:block}#btn-lock.locked{background:#c0392b}#btn-lock.locked:hover{background:#e74c3c}#btn-lock.locked .icon-locked{display:block}#btn-lock.locked .icon-unlocked{display:none}#btn-crop{background:#000c}#btn-crop:hover{background:#3b82f6}@media (width<=600px){#toolbar{bottom:calc(10px + env(safe-area-inset-bottom,0px));gap:8px;padding:8px}#toolbar button{width:44px;height:44px}#toolbar button svg{width:22px;height:22px}#side-buttons{right:10px}#side-buttons button{width:44px;height:44px}}.modal{z-index:200;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-backdrop{background:#000000e6;position:absolute;inset:0}.modal-content{flex-direction:column;align-items:center;gap:16px;max-width:90vw;max-height:90vh;padding:20px;display:flex;position:relative}.modal-hint{color:#aaa;font-size:14px}#export-image{-webkit-touch-callout:default;border-radius:8px;max-width:100%;max-height:calc(90vh - 100px);box-shadow:0 4px 20px #00000080}#modal-close{color:#fff;cursor:pointer;background:#4a4a4a;border:none;border-radius:8px;padding:12px 32px;font-size:16px;font-weight:500;transition:background .2s}#modal-close:hover{background:#5a5a5a}#crop-mode{z-index:150;background:#1a1a1a;position:fixed;inset:0}#crop-canvas{touch-action:none;width:100%;height:100%}#crop-buttons{z-index:151;flex-direction:column;gap:10px;display:flex;position:fixed;top:50%;right:20px;transform:translateY(-50%)}#crop-buttons button{color:#fff;cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;transition:background .2s;display:flex}#btn-crop-cancel{background:#e74c3c}#btn-crop-cancel:hover{background:#ff6b5b}#btn-crop-confirm{background:#2ecc71}#btn-crop-confirm:hover{background:#4ade80}@media (width<=600px){#crop-buttons{right:10px}#crop-buttons button{width:44px;height:44px}}