:root{--font-space-grotesk:"Space Grotesk","Sora","Avenir Next","Segoe UI",sans-serif;--font-manrope:"Manrope","Nunito Sans","Avenir Next","Segoe UI",sans-serif;--font-inter:"Inter","Plus Jakarta Sans","Avenir Next","Segoe UI",sans-serif;--font-jetbrains-mono:"JetBrains Mono","IBM Plex Mono","SFMono-Regular",ui-monospace,monospace;--bg-canvas:#0f1419;--bg-surface:#1a1f26;--bg-surface-soft:#151b22;--bg-card:#131923;--border:rgba(245,247,250,0.12);--border-strong:rgba(0,217,255,0.38);--text-primary:#f5f7fa;--text-secondary:rgba(245,247,250,0.72);--text-muted:rgba(245,247,250,0.5);--accent-cyan:#00d9ff;--accent-amber:#ffb84d;--accent-violet:#7d8dff;--accent-emerald:#34d399;--radius-lg:16px;--radius-md:12px;--shadow-soft:0 20px 50px rgba(0,0,0,0.24);--ease-standard:cubic-bezier(0.4,0,0.2,1)}*{box-sizing:border-box}body,html{max-width:100vw;overflow-x:hidden}body{margin:0;color:var(--text-primary);background:radial-gradient(circle at 16% 12%,rgba(0,217,255,.14),transparent 45%),radial-gradient(circle at 84% 8%,rgba(125,141,255,.14),transparent 40%),linear-gradient(180deg,#0f1419,#0c1218);font-family:var(--font-inter),sans-serif;min-height:100vh}button,input{font:inherit}.page-shell{display:grid;grid-template-columns:272px minmax(0,1fr) 320px;gap:20px;min-height:100vh;padding:20px}.glass{background:linear-gradient(145deg,rgba(26,31,38,.84),rgba(19,25,35,.75));border:1px solid var(--border);backdrop-filter:blur(20px);box-shadow:var(--shadow-soft)}.sidebar{border-radius:24px;display:flex;flex-direction:column;gap:20px;padding:20px}.brand{align-items:center;display:flex;gap:12px}.brand-mark{background:linear-gradient(135deg,#00d9ff,#6be4ff);border-radius:10px;height:30px;width:30px}.brand-title{font-family:var(--font-space-grotesk),sans-serif;font-size:22px;font-weight:700;line-height:1.1;margin:0}.brand-subtitle{color:var(--text-muted);font-family:var(--font-manrope),sans-serif;font-size:12px;margin:0}.primary-button,.secondary-button{border-radius:12px;border:1px solid transparent;cursor:pointer;font-family:var(--font-manrope),sans-serif;font-size:14px;font-weight:600;padding:11px 14px;transition:transform .18s var(--ease-standard),border-color .18s var(--ease-standard),background-color .18s var(--ease-standard),box-shadow .18s var(--ease-standard)}.primary-button{background:linear-gradient(135deg,#00d9ff,#4be4ff);box-shadow:0 10px 30px rgba(0,217,255,.26);color:#0a1218}.primary-button:hover{transform:translateY(-2px)}.secondary-button{background:rgba(245,247,250,.06);border-color:var(--border);color:var(--text-primary)}.secondary-button:hover{border-color:var(--border-strong)}.nav-list{display:flex;flex-direction:column;gap:6px}.nav-button{background:transparent;border:1px solid transparent;border-radius:10px;color:var(--text-secondary);cursor:pointer;font-family:var(--font-manrope),sans-serif;font-size:15px;font-weight:600;padding:11px 12px;text-align:left;transition:background-color .18s var(--ease-standard),border-color .18s var(--ease-standard),color .18s var(--ease-standard)}.nav-button:hover{background:rgba(245,247,250,.05)}.nav-button.active{background:rgba(0,217,255,.15);border-color:rgba(0,217,255,.4);color:var(--text-primary)}.storage-card{border:1px solid var(--border);border-radius:var(--radius-md);margin-top:auto;padding:12px}.storage-header{color:var(--text-secondary);display:flex;font-family:var(--font-manrope),sans-serif;font-size:13px;justify-content:space-between;margin-bottom:10px}.storage-track{background:rgba(245,247,250,.14);border-radius:999px;height:8px;overflow:hidden}.storage-fill{background:linear-gradient(90deg,#00d9ff,#53e5ff);border-radius:inherit;height:100%;width:43%}.storage-note{color:var(--text-muted);font-family:var(--font-jetbrains-mono),monospace;font-size:12px;margin:10px 0 0}.workspace{display:grid;gap:16px;grid-template-rows:auto 1fr}.workspace-topbar{align-items:center;border-radius:18px;display:flex;gap:16px;justify-content:space-between;padding:14px}.search-field{align-items:center;background:rgba(245,247,250,.04);border:1px solid var(--border);border-radius:12px;display:flex;flex:1;min-width:200px;padding:0 12px}.search-hint{color:var(--text-muted);font-family:var(--font-manrope),sans-serif;font-size:13px;margin-right:10px;white-space:nowrap}.search-field input{background:transparent;border:0;color:var(--text-primary);flex:1;min-height:42px;outline:none}.search-field input::-moz-placeholder{color:var(--text-muted)}.search-field input::placeholder{color:var(--text-muted)}.toolbar-actions{align-items:center;display:flex;gap:10px}.toggle-group{background:rgba(245,247,250,.06);border:1px solid var(--border);border-radius:12px;display:inline-flex;overflow:hidden}.toggle-group button{background:transparent;border:0;color:var(--text-secondary);cursor:pointer;font-family:var(--font-manrope),sans-serif;font-size:13px;font-weight:700;padding:9px 12px}.toggle-group button.active{background:rgba(0,217,255,.18);color:var(--text-primary)}.workspace-content{border:1px solid var(--border);border-radius:18px;padding:22px}.breadcrumbs h1{font-family:var(--font-space-grotesk),sans-serif;font-size:32px;font-weight:700;margin:0}.breadcrumbs p{color:var(--text-muted);font-family:var(--font-manrope),sans-serif;font-size:13px;margin:4px 0 0}.upload-zone{align-items:center;border:1px dashed rgba(0,217,255,.48);border-radius:var(--radius-md);display:flex;gap:16px;justify-content:space-between;margin-top:18px;padding:16px}.upload-title{font-family:var(--font-manrope),sans-serif;font-size:15px;font-weight:700;margin:0}.upload-subtitle{color:var(--text-secondary);font-size:13px;margin:4px 0 0}.upload-progress{display:grid;gap:8px;min-width:250px}.upload-card{align-items:center;background:rgba(15,20,25,.66);border:1px solid var(--border);border-radius:10px;display:flex;justify-content:space-between;padding:8px 10px}.upload-card span{color:var(--text-secondary);font-size:12px}.upload-card strong{color:var(--accent-cyan);font-family:var(--font-jetbrains-mono),monospace;font-size:12px}.folder-grid{display:grid;gap:14px;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:20px}.folder-card{align-items:center;background:rgba(245,247,250,.03);border:1px solid var(--border);border-radius:var(--radius-md);color:inherit;cursor:pointer;display:grid;gap:12px;grid-template-columns:18px minmax(0,1fr) auto;padding:14px;text-align:left;transition:transform .2s var(--ease-standard),border-color .2s var(--ease-standard)}.folder-card:hover{border-color:var(--border-strong);transform:translateY(-2px)}.folder-chip{border-radius:6px;height:16px;width:16px}.folder-chip.cyan{background:var(--accent-cyan)}.folder-chip.violet{background:var(--accent-violet)}.folder-chip.emerald{background:var(--accent-emerald)}.folder-chip.amber{background:var(--accent-amber)}.folder-text h3{font-family:var(--font-space-grotesk),sans-serif;font-size:16px;margin:0}.folder-text p{color:var(--text-muted);font-family:var(--font-manrope),sans-serif;font-size:12px;margin:4px 0 0}.folder-shared{border:1px solid rgba(0,217,255,.35);border-radius:999px;color:var(--accent-cyan);font-size:11px;font-weight:700;padding:4px 8px}.selection-toolbar{align-items:center;background:rgba(0,217,255,.12);border:1px solid rgba(0,217,255,.42);border-radius:var(--radius-md);display:flex;justify-content:space-between;margin-top:18px;padding:10px 12px}.selection-toolbar span{font-family:var(--font-manrope),sans-serif;font-size:13px;font-weight:700}.selection-toolbar div{display:flex;gap:8px}.selection-toolbar button{background:rgba(255,255,255,.08);border:1px solid var(--border);border-radius:9px;color:var(--text-primary);cursor:pointer;padding:6px 10px}.file-grid{display:grid;gap:16px;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:18px}.file-card{background:rgba(245,247,250,.03);border:1px solid var(--border);border-radius:var(--radius-lg);color:inherit;cursor:pointer;overflow:hidden;padding:0;text-align:left;transition:transform .24s var(--ease-standard),border-color .24s var(--ease-standard),box-shadow .24s var(--ease-standard)}.file-card:hover{transform:translateY(-3px) scale(1.01)}.file-card.selected{border-color:var(--border-strong);box-shadow:0 12px 24px rgba(0,217,255,.15)}.thumb{border-bottom:1px solid var(--border);height:180px}.thumb-image{background:linear-gradient(120deg,rgba(0,217,255,.42),rgba(0,217,255,.08) 48%),linear-gradient(220deg,rgba(245,247,250,.16),rgba(15,20,25,.5))}.thumb-video{background:radial-gradient(circle at 50% 50%,rgba(255,184,77,.24) 0,transparent 30%),linear-gradient(145deg,rgba(255,184,77,.4),rgba(15,20,25,.6) 60%)}.thumb-doc{background:linear-gradient(145deg,rgba(125,141,255,.38),rgba(125,141,255,.08) 50%),linear-gradient(220deg,rgba(245,247,250,.1),rgba(15,20,25,.5))}.file-meta{padding:14px 14px 8px}.file-meta h3{font-family:var(--font-space-grotesk),sans-serif;font-size:18px;margin:0}.file-meta p{color:var(--text-muted);font-family:var(--font-manrope),sans-serif;font-size:12px;margin:6px 0 0}.file-meta-row{border-top:1px solid var(--border);color:var(--text-secondary);display:flex;font-family:var(--font-jetbrains-mono),monospace;font-size:11px;justify-content:space-between;padding:10px 14px 12px}.file-list-wrap{border:1px solid var(--border);border-radius:var(--radius-md);margin-top:16px;overflow:hidden}.file-list{border-collapse:collapse;width:100%}.file-list td,.file-list th{border-bottom:1px solid var(--border);font-size:13px;padding:12px 10px;text-align:left}.file-list th{color:var(--text-muted);font-family:var(--font-manrope),sans-serif;font-weight:700}.file-list td{color:var(--text-secondary)}.file-list tbody tr{cursor:pointer;transition:background-color .18s var(--ease-standard)}.file-list tbody tr:hover{background:rgba(255,255,255,.03)}.file-list tbody tr.selected{background:rgba(0,217,255,.12)}.empty-state{align-items:center;background:linear-gradient(rgba(0,217,255,.08),rgba(0,217,255,.08)),repeating-linear-gradient(45deg,rgba(0,217,255,.16),rgba(0,217,255,.16) 2px,transparent 0,transparent 14px);border:1px dashed rgba(0,217,255,.45);border-radius:var(--radius-md);display:grid;margin-top:18px;min-height:240px;place-content:center;text-align:center}.empty-state h2{font-family:var(--font-space-grotesk),sans-serif;margin:0}.empty-state p{color:var(--text-secondary);margin:6px 0 0}.preview-drawer{border-radius:24px;display:flex;flex-direction:column;gap:14px;padding:18px;transform:translateX(22px);transition:transform .3s var(--ease-standard)}.preview-drawer.open{transform:translateX(0)}.preview-drawer h2{font-family:var(--font-space-grotesk),sans-serif;font-size:22px;margin:0}.preview-drawer>p{color:var(--text-muted);font-family:var(--font-jetbrains-mono),monospace;margin:-8px 0 0}.preview-meta{border-top:1px solid var(--border);display:grid;gap:10px;margin:0;padding-top:14px}.preview-meta div{display:flex;justify-content:space-between}.preview-meta dt{color:var(--text-muted);font-family:var(--font-manrope),sans-serif;font-size:12px}.preview-meta dd{margin:0}.version-block{border:1px solid var(--border);border-radius:var(--radius-md);padding:12px}.section-title{color:var(--text-muted);font-family:var(--font-manrope),sans-serif;font-size:12px;margin:0}.version-block ul{display:grid;gap:8px;list-style:none;margin:10px 0 0;padding:0}.version-block li{align-items:center;display:flex;justify-content:space-between}.version-block span{font-family:var(--font-jetbrains-mono),monospace}.version-block small{color:var(--text-muted)}.preview-actions{display:grid;gap:8px;grid-template-columns:1fr 1fr;margin-top:auto}@media (max-width:1440px){.page-shell{grid-template-columns:250px minmax(0,1fr)}.preview-drawer{grid-column:1/-1}}@media (max-width:1100px){.page-shell{grid-template-columns:1fr}.sidebar{position:static}.file-grid,.folder-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:760px){.page-shell{gap:14px;padding:14px}.workspace-topbar{align-items:stretch;flex-direction:column}.search-hint{display:none}.toolbar-actions{justify-content:space-between}.upload-zone{align-items:stretch;flex-direction:column}.upload-progress{min-width:auto}.file-grid,.folder-grid{grid-template-columns:1fr}}