*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{overscroll-behavior:none;color:#f9fafb;-webkit-user-select:none;user-select:none;touch-action:manipulation;background:#111827;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}#app{flex-direction:column;height:100%;display:flex}.gallery{height:100%;padding:calc(env(safe-area-inset-top,0px) + 12px) 12px calc(env(safe-area-inset-bottom,0px) + 24px);flex-direction:column;display:flex}.gallery header{justify-content:space-between;align-items:baseline;padding:4px 4px 12px;display:flex}.gallery h1{font-size:24px;font-weight:700}.status{color:#9ca3af;font-size:12px}.grid{flex:1;grid-template-columns:repeat(3,1fr);align-content:start;gap:4px;display:grid;overflow-y:auto}.tile{aspect-ratio:1;background:#1f2937;border:none;border-radius:4px;padding:0;position:relative;overflow:hidden}.tile img{object-fit:cover;width:100%;height:100%;display:block}.tile .del{text-align:center;color:#fff;background:#000000a6;border-radius:50%;width:22px;height:22px;font-size:14px;font-weight:700;line-height:20px;display:none;position:absolute;top:4px;right:4px}.tile:active .del,.tile:hover .del{display:block}.empty{text-align:center;color:#9ca3af;grid-column:1/-1;padding:60px 24px;font-size:14px;line-height:1.6}.fab{right:20px;bottom:calc(env(safe-area-inset-bottom,0px) + 20px);color:#fff;background:#2563eb;border:none;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;font-size:30px;font-weight:300;display:flex;position:fixed;box-shadow:0 6px 20px #00000073}.hidden{display:none}.toast{left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 90px);color:#f9fafb;opacity:0;pointer-events:none;z-index:50;background:#111827f2;border:1px solid #374151;border-radius:10px;padding:10px 16px;font-size:13px;transition:opacity .25s,transform .25s;position:fixed;transform:translate(-50%)translateY(12px)}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}.errbanner{top:calc(env(safe-area-inset-top,0px) + 12px);color:#fef2f2;opacity:0;z-index:60;background:#7f1d1d;border:1px solid #ef4444;border-radius:10px;padding:12px 14px;font-size:13px;line-height:1.5;transition:opacity .25s,transform .25s;position:fixed;left:12px;right:12px;transform:translateY(-8px)}.errbanner.show{opacity:1;transform:translateY(0)}.installbanner{top:calc(env(safe-area-inset-top,0px) + 64px);color:#f9fafb;opacity:0;pointer-events:none;z-index:55;background:#111827f2;border:1px solid #374151;border-radius:999px;align-items:center;gap:10px;max-width:calc(100% - 32px);padding:9px 10px 9px 14px;font-size:13px;transition:opacity .25s,transform .25s;display:flex;position:fixed;left:50%;transform:translate(-50%)translateY(-8px)}.installbanner.show{opacity:1;pointer-events:auto;transform:translate(-50%)translateY(0)}.installbanner .ib-btn{color:#fff;white-space:nowrap;background:#2563eb;border:none;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600}.editor{flex-direction:column;height:100%;display:flex;position:relative}.toolbar{padding:calc(env(safe-area-inset-top,0px) + 10px) 12px 10px;z-index:5;background:#111827eb;border-bottom:1px solid #1f2937;align-items:center;gap:8px;display:flex}.toolbar .btn{color:#f9fafb;touch-action:manipulation;background:#1f2937;border:1px solid #374151;border-radius:8px;flex:none;justify-content:center;align-items:center;min-width:44px;height:40px;padding:0 12px;font-size:15px;display:flex}.toolbar .btn:active{background:#374151}.toolbar .btn.icon{width:44px;padding:0;font-size:17px}.toolbar-group{flex:1;justify-content:center;gap:8px;display:flex}.toolbar .btn.active{background:#1d4ed8;border-color:#3b82f6}.toolbar .btn.primary{background:#2563eb;border-color:#2563eb;font-weight:600}.workspace{touch-action:none;background:#0b0f19;flex:1;position:relative;overflow:hidden}.canvas-stage{pointer-events:none;position:absolute;top:50%;left:50%}.canvas-img{transform-origin:50%;will-change:transform;pointer-events:none;display:block;position:relative}.cropbox{touch-action:none;border:1.5px solid #fffffff2;position:absolute;box-shadow:0 0 0 9999px #0000008c}.cropbox:before,.cropbox:after{content:"";background:#ffffff80;position:absolute}.cropbox:before{height:1px;top:33.33%;left:0;right:0}.cropbox:after{width:1px;top:0;bottom:0;left:33.33%}.handle{touch-action:none;width:28px;height:28px;position:absolute}.handle[data-handle=nw]{cursor:nwse-resize;top:-14px;left:-14px}.handle[data-handle=n]{cursor:ns-resize;margin-left:-14px;top:-14px;left:50%}.handle[data-handle=ne]{cursor:nesw-resize;top:-14px;right:-14px}.handle[data-handle=e]{cursor:ew-resize;margin-top:-14px;top:50%;right:-14px}.handle[data-handle=se]{cursor:nwse-resize;bottom:-14px;right:-14px}.handle[data-handle=s]{cursor:ns-resize;margin-left:-14px;bottom:-14px;left:50%}.handle[data-handle=sw]{cursor:nesw-resize;bottom:-14px;left:-14px}.handle[data-handle=w]{cursor:ew-resize;margin-top:-14px;top:50%;left:-14px}.handle:after{content:"";background:#111827;border:2px solid #fff;border-radius:2px;position:absolute;inset:9px}