:root{--orange-50:#fff7ed;--orange-100:#ffedd5;--orange-200:#fed7aa;--orange-400:#fb923c;--orange-500:#f97316;--orange-600:#ea580c;--orange-700:#c2410c;--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-400:#9ca3af;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--white:#fff;--danger:#ef4444;--radius:12px;--radius-sm:8px}[data-theme=dark]{--orange-50:#1c1206;--orange-100:#2a1a0a;--orange-200:#3d2410;--orange-700:#fdba74;--gray-50:#111827;--gray-100:#1f2937;--gray-200:#374151;--gray-300:#4b5563;--gray-400:#9ca3af;--gray-500:#d1d5db;--gray-600:#e5e7eb;--gray-700:#f3f4f6;--gray-800:#f9fafb;--white:#1a1a2e;--danger:#f87171;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--gray-50);color:var(--gray-800);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}button{cursor:pointer;font-family:inherit}input,select{font-family:inherit}.app{max-width:480px;min-height:100vh;margin:0 auto;padding:0 16px 120px;position:relative}.header{align-items:center;gap:12px;padding:16px 0 12px;display:flex}.header-logo{color:var(--orange-500);letter-spacing:-.5px;font-size:22px;font-weight:800}.header-btn{border-radius:var(--radius-sm);background:var(--gray-100);cursor:pointer;border:none;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:16px;transition:background .15s;display:flex}.header-btn:hover{background:var(--gray-200)}.storage-bar-wrapper{align-items:center;gap:8px;margin-left:auto;display:flex}.storage-bar{background:var(--gray-200);border-radius:3px;width:60px;height:6px;overflow:hidden}.storage-bar-fill{background:var(--orange-500);border-radius:3px;height:100%;transition:width .3s}.storage-label{color:var(--gray-400);white-space:nowrap;font-size:11px}.breadcrumbs{color:var(--gray-400);flex-wrap:wrap;align-items:center;gap:4px;margin-bottom:12px;font-size:13px;display:flex}.breadcrumbs button{color:var(--orange-500);background:0 0;border:none;border-radius:4px;padding:2px 4px;font-size:13px}.breadcrumbs button:hover{background:var(--orange-50)}.breadcrumbs .sep{color:var(--gray-300)}.breadcrumbs .current{color:var(--gray-700);font-weight:600}.search-input{border-radius:var(--radius);border:1.5px solid var(--gray-200);background:var(--white);width:100%;color:var(--gray-800);outline:none;margin-bottom:12px;padding:10px 14px;font-size:14px;transition:border-color .15s}.search-input:focus{border-color:var(--orange-400)}.search-input::placeholder{color:var(--gray-400)}.drop-zone{min-height:200px;position:relative}.drop-overlay{border:3px dashed var(--orange-400);z-index:50;pointer-events:none;background:#f9731614;border-radius:16px;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.drop-overlay-text{background:var(--white);border-radius:var(--radius);color:var(--orange-600);padding:16px 32px;font-size:16px;font-weight:600;box-shadow:0 4px 24px #0000001a}.item-row{background:var(--white);border-radius:var(--radius);border:1px solid var(--gray-100);cursor:default;align-items:center;gap:12px;margin-bottom:6px;padding:10px 12px;transition:border-color .15s,background .15s;display:flex}.item-row:hover{border-color:var(--orange-200)}.item-row.clickable{cursor:pointer}.item-icon{background:var(--orange-50);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:18px;display:flex}.item-info{flex:1;min-width:0}.item-name{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:600;overflow:hidden}.item-meta{color:var(--gray-400);margin-top:4px;font-size:12px}.item-stats{color:var(--gray-400);gap:10px;margin-top:2px;font-size:11px;display:flex}.star-btn{width:32px;height:32px;color:var(--gray-300);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;font-size:18px;transition:color .15s;display:flex}.star-btn.starred{color:#f59e0b}.item-selected{background:var(--orange-50);border-color:var(--orange-400)}.select-check{border:2px solid var(--gray-300);color:#fff;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;font-size:12px;font-weight:700;display:flex}.select-check.checked{background:var(--orange-500);border-color:var(--orange-500)}.batch-bar{z-index:40;background:var(--white);border:1.5px solid var(--gray-200);border-radius:16px;align-items:center;gap:8px;width:calc(100% - 32px);max-width:480px;padding:10px 14px;display:flex;position:fixed;bottom:72px;left:50%;transform:translate(-50%);box-shadow:0 4px 24px #0000001f}.batch-count{color:var(--gray-700);margin-right:auto;font-size:13px;font-weight:600}.batch-action{cursor:pointer;background:var(--gray-100);color:var(--gray-700);border:none;border-radius:10px;padding:8px 12px;font-size:13px;font-weight:500;transition:background .15s}.batch-action:hover{background:var(--gray-200)}.batch-action.danger{color:var(--danger)}.batch-close{background:var(--gray-100);width:32px;height:32px;color:var(--gray-500);cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;font-size:16px;display:flex}.menu-trigger{border-radius:var(--radius-sm);width:32px;height:32px;color:var(--gray-400);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;font-size:18px;transition:background .15s;display:flex}.menu-trigger:hover{background:var(--gray-100);color:var(--gray-600)}.tags-inline{flex-wrap:wrap;gap:4px;margin-top:4px;display:flex}.tag{background:var(--orange-100);color:var(--orange-700);border-radius:10px;padding:1px 7px;font-size:10px;font-weight:500}@keyframes sheetUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.upload-progress{flex-direction:column;gap:4px;margin-bottom:8px;display:flex}.upload-item{border-radius:var(--radius-sm);align-items:center;gap:8px;padding:8px 12px;font-size:13px;animation:.2s ease-out toastIn;display:flex}.upload-uploading{background:var(--orange-50);color:var(--orange-700)}.upload-done{color:#065f46;background:#ecfdf5}.upload-error{color:#991b1b;background:#fef2f2}[data-theme=dark] .upload-done{color:#a7f3d0;background:#064e3b}[data-theme=dark] .upload-error{color:#fecaca;background:#7f1d1d}.upload-icon{flex-shrink:0;font-size:14px}.upload-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.upload-spinner{border:2px solid var(--orange-200);border-top-color:var(--orange-500);border-radius:50%;flex-shrink:0;width:14px;height:14px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.fab-row{z-index:40;gap:10px;width:calc(100% - 32px);max-width:480px;display:flex;position:fixed;bottom:72px;left:50%;transform:translate(-50%)}.fab{appearance:none;border:none;border-radius:16px;flex:1;justify-content:center;align-items:center;gap:8px;padding:14px;font-size:14px;font-weight:600;line-height:1;transition:transform .1s,box-shadow .15s,background .15s;display:flex;box-shadow:0 4px 20px #0000001a}.fab:active{transform:scale(.96)}.fab:disabled{opacity:.5;cursor:not-allowed}.fab-primary{background:var(--orange-500);color:var(--white);box-shadow:0 4px 20px #f973164d}.fab-primary:hover{background:var(--orange-600);box-shadow:0 6px 24px #f9731659}.fab-secondary{background:var(--white);color:var(--gray-700);border:1.5px solid var(--gray-200);box-shadow:0 4px 20px #0000000f}.fab-secondary:hover{border-color:var(--orange-400);background:var(--orange-50)}.btn-full{text-align:center;cursor:pointer;appearance:none;border-radius:14px;width:100%;padding:14px;font-size:15px;font-weight:600;line-height:1;transition:background .15s,transform .1s,box-shadow .15s}.btn-full:active{transform:scale(.98)}.btn-full.primary{background:var(--orange-500);color:var(--white);border:none;box-shadow:0 2px 8px #f973164d}.btn-full.primary:hover{background:var(--orange-600);box-shadow:0 4px 12px #f9731659}.btn-full.primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.btn-full.secondary{background:var(--gray-50);color:var(--gray-600);border:1.5px solid var(--gray-200)}.btn-full.secondary:hover{background:var(--gray-100);border-color:var(--gray-300)}.sort-bar{gap:6px;margin-bottom:8px;display:flex}.sort-btn{border:1px solid var(--gray-200);background:var(--white);color:var(--gray-500);cursor:pointer;appearance:none;border-radius:8px;align-items:center;gap:3px;padding:5px 10px;font-size:12px;font-weight:500;transition:all .15s;display:flex}.sort-btn:hover{border-color:var(--orange-400)}.sort-btn.active{border-color:var(--orange-500);color:var(--orange-600);background:var(--orange-50);font-weight:600}.sort-arrow{font-size:11px}.preview-media{border-radius:var(--radius);background:var(--gray-100);justify-content:center;align-items:center;min-height:120px;display:flex;overflow:hidden}.preview-img{object-fit:contain;width:100%;max-height:50vh;display:block}.preview-video{outline:none;width:100%;max-height:50vh;display:block}.preview-audio-wrapper{flex-direction:column;align-items:center;width:100%;padding:32px 16px;display:flex}.preview-loading{color:var(--gray-400);flex-direction:column;justify-content:center;align-items:center;padding:40px;display:flex}.tag-filter-bar{-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:6px;margin-bottom:4px;padding:0 0 10px;display:flex;overflow-x:auto}.tag-filter-bar::-webkit-scrollbar{display:none}.tag-chip{border:1.5px solid var(--gray-200);background:var(--white);color:var(--gray-600);white-space:nowrap;cursor:pointer;appearance:none;border-radius:20px;align-items:center;gap:5px;padding:6px 12px;font-size:12px;font-weight:500;transition:all .15s;display:flex}.tag-chip:hover{border-color:var(--orange-400)}.tag-chip.active{background:var(--orange-500);color:#fff;border-color:var(--orange-500)}.tag-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.section-label{text-transform:uppercase;letter-spacing:.5px;color:var(--gray-400);margin:12px 0 6px 4px;font-size:11px;font-weight:600}.empty{text-align:center;color:var(--gray-400);padding:48px 16px}.empty-icon{margin-bottom:12px;font-size:48px}.empty p{margin-top:4px;font-size:14px}.loading{text-align:center;color:var(--gray-400);padding:48px;font-size:14px}.error{text-align:center;color:#ef4444;padding:48px;font-size:14px}.pagination{justify-content:center;align-items:center;gap:12px;margin-top:16px;display:flex}.pagination button{border-radius:var(--radius-sm);border:1.5px solid var(--gray-200);background:var(--white);color:var(--gray-600);padding:8px 16px;font-size:13px}.pagination button:disabled{opacity:.4;cursor:not-allowed}.pagination span{color:var(--gray-400);font-size:13px}.shared-header{text-align:center;padding:24px 0 16px}.shared-header .badge{background:var(--orange-100);color:var(--orange-600);border-radius:20px;margin-bottom:12px;padding:4px 12px;font-size:11px;font-weight:600;display:inline-block}.shared-header h2{font-size:20px;font-weight:700}.shared-header p{color:var(--gray-400);margin-top:4px;font-size:13px}.toast-container{z-index:10000;pointer-events:none;flex-direction:column;gap:8px;width:calc(100% - 32px);max-width:420px;display:flex;position:fixed;top:12px;left:50%;transform:translate(-50%)}.toast{border-radius:var(--radius);pointer-events:auto;cursor:pointer;align-items:center;gap:10px;padding:12px 16px;font-size:14px;font-weight:500;animation:.25s ease-out toastIn;display:flex;box-shadow:0 4px 20px #0000001f}.toast-icon{flex-shrink:0;font-size:16px}.toast-success{color:#065f46;background:#ecfdf5;border:1px solid #a7f3d0}.toast-error{color:#991b1b;background:#fef2f2;border:1px solid #fecaca}.toast-info{background:var(--orange-50);color:var(--orange-700);border:1px solid var(--orange-200)}[data-theme=dark] .toast-success{color:#a7f3d0;background:#064e3b;border-color:#065f46}[data-theme=dark] .toast-error{color:#fecaca;background:#7f1d1d;border-color:#991b1b}[data-theme=dark] .toast-info{background:var(--orange-50);color:var(--orange-700);border-color:var(--orange-200)}@keyframes toastIn{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}.swipe-container{border-radius:var(--radius);margin-bottom:6px}.swipe-action{color:#fff;align-items:center;padding:0 16px;font-size:13px;font-weight:600;display:flex;position:absolute;top:0;bottom:0}.swipe-right{border-radius:var(--radius) 0 0 var(--radius);left:0}.swipe-left{border-radius:0 var(--radius) var(--radius) 0;justify-content:flex-end;right:0}.bottom-tabs{background:var(--white);border-top:1px solid var(--gray-100);width:100%;max-width:480px;padding:6px 0 max(env(safe-area-inset-bottom,6px), 6px);z-index:50;display:flex;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.tab-item{color:var(--gray-400);cursor:pointer;appearance:none;background:0 0;border:none;flex-direction:column;flex:1;align-items:center;gap:2px;padding:6px 0;font-size:10px;transition:color .15s;display:flex}.tab-item.active{color:var(--orange-500)}.tab-icon{font-size:20px;line-height:1}.tab-label{font-weight:500}.settings-section{margin-bottom:16px}.settings-header{text-transform:uppercase;letter-spacing:.5px;color:var(--gray-400);padding:12px 16px 6px;font-size:11px;font-weight:600}.settings-row{border-bottom:1px solid var(--gray-100);justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.settings-label{color:var(--gray-800);font-size:14px}.settings-value{color:var(--gray-500);font-size:14px}