:root{--bg-main:#f5f4ef;--bg-surface:#fff;--bg-card:#fffffff0;--border-subtle:#00000012;--border-active:#00000026;--text-main:#1e293b;--text-muted:#64748b;--text-dim:#94a3b8;--accent-blue:#2563eb;--accent-emerald:#10b981;--accent-amber:#d97706;--font-ui:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-hand:"Caveat", cursive;--font-text:"Inter", sans-serif;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-pill:9999px}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;margin:0;padding:0}body{font-family:var(--font-ui);background-color:var(--bg-main);color:var(--text-main);background-image:radial-gradient(at 50% 20%,#fffc 0,#0000 70%),radial-gradient(at 80% 80%,#d9e6f566 0,#0000 60%),radial-gradient(at 20% 80%,#f0ebe180 0,#0000 60%);height:100vh;min-height:100vh;overflow:hidden}.zen-app{flex-direction:column;width:100vw;height:100vh;display:flex;position:relative}.zen-header{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--border-subtle);z-index:50;background:#ffffffd9;flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 28px;display:flex;box-shadow:0 1px 8px #00000008}.zen-brand{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.zen-dot{background:var(--accent-emerald);border-radius:50%;flex-shrink:0;width:8px;height:8px;box-shadow:0 0 8px #10b98180}.zen-brand h1{letter-spacing:.1em;color:var(--text-main);white-space:nowrap;font-size:1.15rem;font-weight:800}.zen-tag{color:var(--text-muted);letter-spacing:.01em;border:1px solid var(--border-subtle);border-radius:var(--radius-pill);background:#00000008;align-items:center;gap:4px;padding:3px 10px;font-size:.78rem;font-weight:500;display:inline-flex}.zen-controls{align-items:center;gap:10px;display:flex}.zen-btn{border:1px solid var(--border-subtle);color:var(--text-muted);font-family:var(--font-ui);border-radius:var(--radius-md);cursor:pointer;background:#fff;align-items:center;gap:8px;padding:7px 14px;font-size:.8rem;font-weight:600;transition:all .2s;display:flex;box-shadow:0 1px 3px #0000000a}.zen-btn:hover{color:var(--text-main);border-color:var(--border-active);background:#f8fafc;box-shadow:0 2px 6px #0000000f}.zen-btn.active{color:var(--accent-blue);background:#2563eb0d;border-color:#2563eb4d}.zen-desk{flex-direction:column;flex:1;align-items:center;display:flex;position:relative;overflow:hidden}.desk-toolbar{background:var(--bg-card);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid var(--border-active);border-radius:var(--radius-pill);z-index:40;align-items:center;gap:8px;padding:6px 10px;transition:opacity .3s,transform .3s;display:flex;position:absolute;top:14px;box-shadow:0 12px 32px #00000012,0 2px 8px #0000000a}.tool-btn{color:var(--text-muted);font-family:var(--font-ui);border-radius:var(--radius-pill);cursor:pointer;background:0 0;border:1px solid #0000;align-items:center;gap:8px;padding:8px 16px;font-size:.82rem;font-weight:600;transition:all .15s;display:flex}.tool-btn:hover{color:var(--text-main);background:#0000000a}.tool-btn.active{color:var(--accent-blue);background:#2563eb1a}.tool-btn.primary{color:#fff;background:#1e293b;box-shadow:0 4px 12px #1e293b40}.tool-btn.primary:hover{background:#0f172a;transform:translateY(-1px)}.hidden-input{display:none}.text-editor-popover{border:1px solid var(--border-active);border-radius:var(--radius-md);z-index:45;background:#fff;flex-direction:column;gap:10px;width:460px;max-width:90vw;padding:16px;transition:all .25s cubic-bezier(.16,1,.3,1);display:flex;position:absolute;top:70px;box-shadow:0 20px 45px #0000001f,0 4px 12px #0000000d}.text-editor-popover.hidden{opacity:0;pointer-events:none;transform:translateY(-8px)}textarea#note-input{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);width:100%;color:var(--text-main);font-family:var(--font-hand);resize:vertical;-webkit-user-select:text;user-select:text;background:#fafaf9;min-height:85px;padding:12px 14px;font-size:1.4rem;line-height:1.4}textarea#note-input:focus{border-color:var(--accent-blue);background:#fff;outline:none;box-shadow:0 0 0 3px #2563eb1a}.editor-actions{justify-content:space-between;align-items:center;display:flex}.editor-hint{color:var(--text-dim);font-size:.75rem}.dropzone-popover{border:1px solid var(--border-active);border-radius:var(--radius-lg);z-index:45;background:#fff;width:480px;max-width:90vw;padding:18px;transition:all .25s cubic-bezier(.16,1,.3,1);position:absolute;top:70px;box-shadow:0 20px 45px #0000001f,0 4px 12px #0000000d}.dropzone-popover.hidden{opacity:0;pointer-events:none;transform:translateY(-8px)}.dropzone-field{border-radius:var(--radius-md);text-align:center;cursor:pointer;background:#fafaf9;border:2px dashed #cbd5e1;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:28px 16px;transition:all .2s;display:flex}.dropzone-field:hover,.dropzone-field.dragover{border-color:var(--accent-blue);background:#2563eb0d}.dropzone-field.dragover{border-style:solid;transform:scale(1.02)}.dropzone-icon{color:var(--accent-blue)}.dropzone-text h4{color:var(--text-main);font-size:.95rem;font-weight:700}.dropzone-text p{color:var(--text-muted);margin-top:2px;font-size:.78rem}.btn-subtle{color:#fff;font-family:var(--font-ui);border-radius:var(--radius-sm);cursor:pointer;background:#1e293b;border:none;padding:7px 16px;font-size:.78rem;font-weight:600;transition:all .15s}.btn-subtle:hover{background:#0f172a;transform:translateY(-1px)}.url-popover{border:1px solid var(--border-active);border-radius:var(--radius-lg);z-index:45;background:#fff;width:500px;max-width:90vw;padding:20px;transition:all .25s cubic-bezier(.16,1,.3,1);position:absolute;top:70px;box-shadow:0 20px 45px #0000001f,0 4px 12px #0000000d}.url-popover.hidden{opacity:0;pointer-events:none;transform:translateY(-8px)}.url-card h4{color:var(--text-main);font-size:.95rem;font-weight:700}.url-sub{color:var(--text-muted);margin-top:3px;margin-bottom:12px;font-size:.78rem}.url-input-group{gap:8px;margin-bottom:12px;display:flex}#url-input{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);font-family:var(--font-ui);color:var(--text-main);-webkit-user-select:text;user-select:text;background:#fafaf9;flex:1;padding:10px 14px;font-size:.88rem}#url-input:focus{border-color:var(--accent-blue);background:#fff;outline:none;box-shadow:0 0 0 3px #2563eb1a}.btn-primary-sm{color:#fff;border-radius:var(--radius-sm);font-family:var(--font-ui);cursor:pointer;white-space:nowrap;background:#2563eb;border:none;align-items:center;gap:6px;padding:10px 18px;font-size:.82rem;font-weight:700;transition:all .15s;display:flex}.btn-primary-sm:hover{background:#1d4ed8;transform:translateY(-1px)}.btn-primary-sm:disabled{opacity:.6;cursor:not-allowed}.url-presets{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.preset-label{color:var(--text-dim);font-size:.75rem;font-weight:600}.url-chip{border:1px solid var(--border-subtle);color:var(--text-muted);font-family:var(--font-ui);border-radius:var(--radius-pill);cursor:pointer;background:#f1f5f9;padding:4px 10px;font-size:.75rem;font-weight:600;transition:all .15s}.url-chip:hover{color:var(--text-main);background:#e2e8f0}.spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:14px;height:14px;animation:.6s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.global-drop-indicator{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:60;pointer-events:none;background:#f5f4efd9;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .2s;display:flex;position:absolute;top:0;left:0}.global-drop-indicator.hidden{display:none!important}.drop-pulse-card{border:2px dashed var(--accent-blue);border-radius:var(--radius-lg);color:var(--accent-blue);background:#fff;flex-direction:column;align-items:center;gap:12px;padding:36px 48px;font-size:1.1rem;font-weight:700;animation:1.5s ease-in-out infinite pulseCard;display:flex;box-shadow:0 20px 40px #2563eb26}@keyframes pulseCard{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}.canvas-wrapper{flex:1;width:100%;height:100%;position:relative}#shredder-canvas{width:100%;height:100%;display:block}.drag-cue{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border-subtle);border-radius:var(--radius-pill);color:var(--text-muted);pointer-events:none;background:#ffffffd9;padding:6px 18px;font-size:.82rem;font-weight:500;transition:opacity .3s;position:absolute;top:24px;left:50%;transform:translate(-50%);box-shadow:0 2px 10px #0000000a}.drag-cue.hidden{opacity:0}.hidden{display:none!important}@media (width<=600px){.zen-header{padding:10px 16px}.desk-toolbar{gap:4px;padding:4px 6px;top:8px}.tool-btn{padding:6px 10px;font-size:.75rem}.text-editor-popover,.dropzone-popover{width:94vw;top:55px}}.zen-footer{color:var(--text-dim);z-index:50;background:0 0;flex-shrink:0;justify-content:center;align-items:center;padding:10px 16px 14px;font-size:.78rem;display:flex}.zen-footer span{align-items:center;gap:4px;display:inline-flex}.zen-footer a{color:var(--text-muted);font-weight:600;text-decoration:none;transition:all .2s}.zen-footer a:hover{color:var(--accent-blue);text-decoration:underline}
