*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--primary:#6366f1;--primary-hover:#818cf8;--danger:#f87171;--danger-hover:#ef4444;--bg:#0b0b12;--surface:#12121c;--text:#e2e8f0;--text-muted:#8892a8;--border:#1e1e2e;--radius:8px;--shadow:0 1px 3px #0006;--shadow-lg:0 4px 20px #00000080;--primary-glow:#6366f126;--surface-hover:#1a1a28;--border-subtle:#6366f10f;--surface-elevated:#16162a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::selection{background:#6366f14d}.navbar{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:100;background:#12121cd9;border-bottom:1px solid #6366f114;justify-content:space-between;align-items:center;padding:1rem 2rem;display:flex;position:sticky;top:0;box-shadow:0 1px 3px #0006,0 4px 12px #00000026}.navbar-brand a{color:var(--primary);letter-spacing:-.02em;font-size:1.25rem;font-weight:800;text-decoration:none;transition:color .2s}.navbar-brand a:hover{color:var(--primary-hover)}.navbar-links{gap:1.5rem;display:flex}.navbar-links a{color:var(--text);font-weight:500;text-decoration:none;transition:color .2s;position:relative}.navbar-links a:after{content:"";background:var(--primary);border-radius:1px;width:0;height:2px;transition:width .25s;position:absolute;bottom:-4px;left:0}.navbar-links a:hover{color:var(--primary)}.navbar-links a:hover:after{width:100%}.navbar-user{align-items:center;gap:.75rem;display:flex}.navbar-user span{color:var(--text-muted);font-size:.875rem}.btn-logout{border-radius:var(--radius);color:var(--danger);cursor:pointer;background:0 0;border:1px solid #f8717140;justify-content:center;align-items:center;padding:.3rem .85rem;font-size:.8rem;font-weight:500;transition:all .2s;display:inline-flex}.btn-logout:hover{background:#f871711a;border-color:#f8717180;box-shadow:0 0 15px #f8717126}.main-content{max-width:1200px;margin:0 auto;padding:2rem 1.5rem}.vault-page{flex-direction:column;width:100vw;height:calc(100vh - 57px);margin-left:calc(50% - 50vw);padding:0;display:flex}.btn{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);cursor:pointer;justify-content:center;align-items:center;padding:.5rem 1rem;font-size:.875rem;font-weight:500;transition:all .2s;display:inline-flex}.btn:hover{background:var(--surface-hover)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:#fff;border-color:var(--primary)}.btn-primary:hover{background:var(--primary-hover);box-shadow:0 0 20px var(--primary-glow)}.btn-danger{color:var(--danger);border-color:var(--danger)}.btn-danger:hover{background:var(--danger);color:#fff;box-shadow:0 0 15px #f8717133}.btn-sm{padding:.25rem .75rem;font-size:.8rem}.btn-lg{padding:.75rem 2rem;font-size:1rem}.btn-full{width:100%}.form-group{margin-bottom:1rem}.form-group label{margin-bottom:.25rem;font-size:.875rem;font-weight:500;display:block}.form-group input{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);width:100%;color:var(--text);padding:.625rem .75rem;font-size:1rem;transition:border-color .2s,box-shadow .2s}.form-group input::placeholder{color:var(--text-muted);opacity:.6}.form-group input:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow);outline:none}input:-webkit-autofill{-webkit-text-fill-color:var(--text);-webkit-box-shadow:0 0 0px 1000px var(--bg) inset;border:1px solid var(--border);transition:background-color 5000s ease-in-out}input:-webkit-autofill:hover{-webkit-text-fill-color:var(--text);-webkit-box-shadow:0 0 0px 1000px var(--bg) inset;border:1px solid var(--border);transition:background-color 5000s ease-in-out}input:-webkit-autofill:focus{-webkit-text-fill-color:var(--text);-webkit-box-shadow:0 0 0px 1000px var(--bg) inset;border:1px solid var(--border);transition:background-color 5000s ease-in-out}.login-page{justify-content:center;align-items:center;min-height:100vh;display:flex}.login-card{background:var(--surface);box-shadow:var(--shadow-lg), 0 0 40px var(--primary-glow);border:1px solid var(--border);border-radius:12px;width:100%;max-width:400px;padding:2.5rem}.login-card h1{text-align:center;color:var(--primary);margin-bottom:.25rem;font-size:2rem}.login-subtitle{text-align:center;color:var(--text-muted);margin-bottom:1.5rem}.toggle-auth{text-align:center;color:var(--text-muted);margin-top:1rem;font-size:.875rem}.link-button{color:var(--primary);cursor:pointer;font-weight:600;font-size:inherit;background:0 0;border:none;text-decoration:underline}.error-text{color:var(--danger);margin-top:.5rem;font-size:.875rem}.loading{text-align:center;color:var(--text-muted);padding:2rem}.dashboard-page h1{letter-spacing:-.025em;margin-bottom:.25rem;font-size:2rem;font-weight:800}.vault-toolbar{border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0;justify-content:space-between;align-items:center;padding:.75rem 1.5rem;display:flex}.vault-toolbar-left{align-items:baseline;gap:.75rem;display:flex}.vault-toolbar-left h1{letter-spacing:-.02em;margin:0;font-size:1.15rem;font-weight:700}.vault-file-count{color:var(--text-muted);font-size:.8rem}.vault-toolbar-right{align-items:center;gap:.5rem;display:flex}.btn-upload{border:1px solid var(--primary);border-radius:var(--radius);background:var(--primary);color:#fff;cursor:pointer;align-items:center;gap:.4rem;padding:.4rem .85rem;font-size:.8rem;font-weight:500;transition:all .2s;display:inline-flex}.btn-upload:hover{background:var(--primary-hover);box-shadow:0 0 15px var(--primary-glow)}.upload-btn-progress{font-variant-numeric:tabular-nums;text-align:center;min-width:2rem}.upload-toast{z-index:200;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-lg);border-radius:10px;flex-direction:column;gap:.35rem;min-width:260px;max-width:340px;padding:.75rem;display:flex;position:fixed;bottom:1.5rem;right:1.5rem}.upload-toast-item{align-items:center;gap:.5rem;padding:.3rem 0;font-size:.78rem;display:flex}.upload-toast-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--text);flex:1;overflow:hidden}.upload-toast-pct{font-variant-numeric:tabular-nums;color:var(--primary);font-size:.75rem;font-weight:600}.upload-toast-error{color:var(--danger);flex-shrink:0;font-size:.7rem}.upload-toast-dismiss{color:var(--text-muted);cursor:pointer;text-align:right;background:0 0;border:none;padding:.25rem 0;font-size:.72rem}.upload-toast-dismiss:hover{color:var(--text)}.btn-toolbar{border:1px solid var(--border);border-radius:var(--radius);color:var(--text);cursor:pointer;background:0 0;align-items:center;gap:.35rem;padding:.35rem .75rem;font-size:.78rem;font-weight:500;transition:all .15s;display:inline-flex}.btn-toolbar:hover{background:var(--surface-hover)}.btn-toolbar-danger{color:var(--danger);border-color:#f871714d}.btn-toolbar-danger:hover{background:#f871711a;border-color:#f8717180}.btn-toolbar:disabled{opacity:.5;cursor:not-allowed}.vault-selected-count{color:var(--primary);font-size:.8rem;font-weight:500}.file-card-checkbox{border:1.5px solid var(--border);cursor:pointer;opacity:0;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:18px;height:18px;transition:all .15s;display:flex}.file-card:hover .file-card-checkbox,.file-card-checkbox.visible,.file-card-checkbox.checked{opacity:1}.file-card-checkbox:hover{border-color:var(--primary)}.file-card-checkbox.checked{background:var(--primary);border-color:var(--primary)}.file-card.checked{background:#6366f10f}.vault-panel-left.drag-over{position:relative}.vault-panel-left.drag-over:after{content:"";border:2px dashed var(--primary);pointer-events:none;z-index:10;background:#6366f10f;position:absolute;inset:0}.folder-card.drop-target{box-shadow:inset 0 0 0 2px var(--primary);background:#6366f11f}.folder-card{cursor:pointer}.folder-icon-bg{background:#f59e0b1a}.vault-breadcrumb{background:var(--bg);border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;padding:.4rem 1.5rem;font-size:.8rem;display:flex}.breadcrumb-item{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:.15rem .3rem;font-size:.8rem;transition:all .15s}.breadcrumb-item:hover{color:var(--primary);background:var(--surface-hover)}.breadcrumb-item.active{color:var(--text);font-weight:600}.breadcrumb-sep{color:var(--text-muted);opacity:.4;margin:0 .15rem}.new-folder-bar{background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:.5rem;padding:.5rem 1.5rem;display:flex}.new-folder-input{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);max-width:280px;color:var(--text);outline:none;flex:1;padding:.3rem .6rem;font-size:.8rem;transition:border-color .15s}.new-folder-input:focus{border-color:var(--primary)}.status-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin-bottom:1.5rem;padding:1.5rem;transition:border-color .2s;box-shadow:0 2px 8px #0003}.status-card:hover{border-color:#6366f126}.status-card h3{color:#4ade80;margin-bottom:.5rem}.dashboard-actions{margin-bottom:1.5rem}.account-info{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1.5rem;transition:border-color .2s;box-shadow:0 2px 8px #0003}.account-info:hover{border-color:#6366f126}.account-info h3{margin-bottom:.75rem}.account-info p{color:var(--text-muted);margin-bottom:.25rem;font-size:.875rem}.account-info p strong{color:var(--text)}.subscription-gate{justify-content:center;padding:2rem 0;display:flex}.gate-content{text-align:center;max-width:400px}.gate-content h2{margin-bottom:.5rem}.gate-content>p{color:var(--text-muted);margin-bottom:1.5rem}.plan-card{background:var(--surface);border:2px solid var(--primary);box-shadow:var(--shadow-lg), 0 0 30px var(--primary-glow);border-radius:12px;padding:2rem;transition:transform .2s,box-shadow .2s}.plan-card:hover{box-shadow:var(--shadow-lg), 0 0 50px #6366f140;transform:translateY(-2px)}.plan-card h3{margin-bottom:.5rem}.plan-price{color:var(--primary);margin-bottom:1rem;font-size:2.5rem;font-weight:700}.plan-price span{color:var(--text-muted);font-size:1rem;font-weight:400}.plan-card ul{margin-bottom:1.5rem;list-style:none}.plan-card ul li{color:var(--text-muted);padding:.25rem 0}.plan-card ul li:before{content:"✓";color:#4ade80;font-weight:700}.subscribe-button{text-align:center}.file-grid{flex-direction:column;display:flex}.file-grid-empty{color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:.5rem;height:100%;padding:3rem 2rem;display:flex}.file-grid-empty svg{opacity:.3;margin-bottom:.5rem}.file-grid-empty-sub{opacity:.7;font-size:.8rem}.file-card{cursor:pointer;border-bottom:1px solid var(--border);align-items:center;gap:.75rem;padding:.625rem 1rem;transition:background .15s,box-shadow .15s;display:flex}.file-card:hover{background:var(--surface-hover);box-shadow:inset 2px 0 0 var(--primary)}.file-card.selected{box-shadow:inset 3px 0 0 var(--primary);background:#6366f11a}.file-card-icon{background:var(--bg);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.file-card-info{flex-direction:column;flex:1;gap:.15rem;min-width:0;display:flex}.file-card-name{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:.85rem;font-weight:500;overflow:hidden}.file-card.selected .file-card-name{color:var(--primary-hover);font-weight:600}.file-card-meta{color:var(--text-muted);font-size:.7rem}.file-card-actions{opacity:0;flex-shrink:0;gap:.15rem;transition:opacity .15s;display:flex}.file-card:hover .file-card-actions,.file-card.selected .file-card-actions{opacity:1}.vault-split-pane{flex:1;min-height:0;display:flex;overflow:hidden}.vault-panel-left{background:var(--surface);border-right:1px solid var(--border);flex-shrink:0;width:340px;min-width:260px;overflow-y:auto}.vault-panel-right{background:var(--surface);flex-direction:column;flex:1;min-width:0;display:flex}.btn-icon{cursor:pointer;color:var(--text-muted);background:0 0;border:1px solid #0000;border-radius:6px;justify-content:center;align-items:center;padding:.4rem;line-height:1;transition:all .15s;display:inline-flex}.btn-icon:hover{background:var(--surface-hover);border-color:var(--border);color:var(--text)}.btn-icon.btn-danger:hover{color:var(--danger);background:#f871711a;border-color:#f871714d}.btn-icon svg{width:16px;height:16px}.preview-panel{flex-direction:column;height:100%;display:flex}.preview-header{border-bottom:1px solid var(--border);background:var(--bg);align-items:center;gap:.75rem;padding:.75rem 1rem;display:flex}.preview-filename{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:.875rem;font-weight:600;overflow:hidden}.preview-size{color:var(--text-muted);flex-shrink:0;font-size:.75rem}.preview-content{flex:1;justify-content:center;align-items:center;padding:1rem;display:flex;overflow:auto}.preview-empty{height:100%;color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:3rem;display:flex}.preview-empty-icon{color:var(--primary);opacity:.3;animation:3s ease-in-out infinite float}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.preview-empty-title{color:var(--text);font-size:1rem;font-weight:600}.preview-empty-subtitle{color:var(--text-muted);font-size:.85rem}.preview-empty p{font-size:.875rem}.preview-loading{color:var(--text-muted);flex-direction:column;align-items:center;gap:.75rem;display:flex}.spinner{border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.preview-error{color:var(--danger);font-size:.875rem}.preview-image{object-fit:contain;border-radius:4px;max-width:100%;max-height:100%}.preview-iframe{border:none;border-radius:4px;width:100%;height:100%}.preview-video{border-radius:4px;max-width:100%;max-height:100%}.preview-audio-wrap{flex-direction:column;align-items:center;gap:1.5rem;display:flex}.preview-audio{width:100%;max-width:400px}.preview-text-wrap{flex-direction:column;width:100%;height:100%;display:flex}.preview-text-content{color:#cdd6f4;white-space:pre-wrap;word-break:break-word;background:#1e1e2e;border-radius:6px;flex:1;margin:0;padding:1rem;font-family:SF Mono,Fira Code,Cascadia Code,monospace;font-size:.8rem;line-height:1.6;overflow:auto}.preview-truncated{text-align:center;color:var(--text-muted);padding:.5rem 0;font-size:.8rem}.preview-unsupported{color:var(--text-muted);flex-direction:column;align-items:center;gap:.75rem;display:flex}.preview-unsupported-name{color:var(--text);font-size:.875rem;font-weight:600}.preview-unsupported-meta{font-size:.75rem}.modal-backdrop{z-index:300;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-card{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-lg), 0 0 40px var(--primary-glow);border-radius:12px;flex-direction:column;width:100%;max-width:520px;max-height:80vh;margin:1rem;display:flex}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}.modal-header h3{margin:0;font-size:1rem;font-weight:600}.modal-body{flex-direction:column;gap:1rem;padding:1.25rem;display:flex;overflow-y:auto}.modal-footer{border-top:1px solid var(--border);justify-content:flex-end;align-items:center;gap:.5rem;padding:.75rem 1.25rem;display:flex}.modal-hint{color:var(--text-muted);margin-right:auto;font-size:.7rem}.new-file-label{color:var(--text-muted);flex-direction:column;gap:.35rem;font-size:.8rem;font-weight:500;display:flex}.new-file-name-input{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);outline:none;padding:.45rem .7rem;font-size:.85rem;transition:border-color .15s}.new-file-name-input:focus{border-color:var(--primary)}.new-file-textarea{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);resize:vertical;outline:none;padding:.6rem .75rem;font-family:SF Mono,Fira Code,Cascadia Code,monospace;font-size:.8rem;line-height:1.6;transition:border-color .15s}.new-file-textarea:focus{border-color:var(--primary)}.btn:active{transform:scale(.97)}.btn:focus-visible,.upload-area:focus-visible,.btn-icon:focus-visible,.btn-logout:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.preview-header .btn:hover{background:var(--surface-hover);border-color:var(--primary)}@media (width<=900px){.vault-panel-left{width:300px}}@media (width<=768px){.main-content{padding:1.25rem 1rem}.dashboard-page h1{font-size:1.5rem}.login-card{padding:2rem 1.5rem}.status-card,.account-info{padding:1.25rem}.plan-card{padding:1.5rem}.vault-panel-left{width:280px;min-width:220px}}@media (width<=640px){.navbar{flex-direction:column;gap:.5rem}.vault-page{height:auto}.vault-split-pane{flex-direction:column;min-height:auto}.vault-panel-left{border-right:none;border-bottom:1px solid var(--border);width:100%;max-height:300px;overflow-y:auto}.vault-panel-right{min-height:350px}.vault-toolbar{padding:.5rem 1rem}.file-card-actions{opacity:1}}
