:root{color-scheme:dark;--bg:#090f1b;--nav:#0b1422;--panel:#101a2b;--card:#111d2f;--card2:#142237;--line:#243349;--line-soft:#1d2b3f;--muted:#90a2b9;--text:#f1f5fc;--blue:#37a8fa;--blue2:#067fda;--cyan:#5bdddc;--radius:16px;--shadow:0 24px 90px #010614aa;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text)}body{font-size:14px;line-height:1.5}button,input,select{font:inherit}button{cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button:disabled{opacity:.55;cursor:not-allowed}svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.ico{width:18px;height:18px;flex:none}.hidden{display:none!important}.mobile-only{display:none!important}
.btn{border:none;border-radius:11px;padding:11px 16px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:670;min-height:43px;white-space:nowrap;transition:transform .17s,background .17s,border-color .17s}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn-primary{color:#021326;background:linear-gradient(125deg,#63ccff,#369ff7);box-shadow:0 5px 19px #168bd92e}.btn-primary:hover{background:linear-gradient(125deg,#8ad9ff,#49affb)}.btn-secondary{background:#17263a;border:1px solid #304059;color:#dce9f8}.btn-secondary:hover{background:#1c3048}.btn-ghost{background:transparent;color:var(--muted)}.btn-ghost:hover{background:#17263a}.btn-danger{background:#b63749;color:#fff}.btn-danger:hover{background:#cc4357}.btn-small{min-height:36px;padding:8px 12px;font-size:12px}.btn-wide{width:100%}.icon-btn{height:38px;width:38px;background:transparent;border:1px solid transparent;border-radius:10px;display:grid;place-items:center;color:#b1c1d4}.icon-btn:hover{background:#18283d;border-color:var(--line)}.icon-btn .ico{width:19px;height:19px}
.eyebrow{font-size:10px;letter-spacing:2.1px;font-weight:750;color:var(--cyan)}
/* AUTH */
.auth-page{min-height:100vh;display:grid;place-items:center;padding:28px 18px;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(circle at 12% 10%,#112a49 0%,transparent 33%),radial-gradient(circle at 92% 82%,#0b2d43 0%,transparent 30%),#070e19}.auth-page::after{content:'';inset:0;position:absolute;z-index:-1;background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:56px 56px;opacity:.018}.auth-glow{position:absolute;width:720px;height:720px;border-radius:50%;background:#0a62ba2b;filter:blur(120px);left:calc(50% - 360px);top:calc(50% - 360px);z-index:-1}.auth-card{width:min(100%,476px);padding:33px 42px 38px;border:1px solid #294461;background:linear-gradient(145deg,#122138ed,#0c1829f2);border-radius:26px;box-shadow:var(--shadow);position:relative}.auth-brand{display:flex;align-items:center;gap:11px;font-size:15px;letter-spacing:1.6px;font-weight:750}.auth-brand strong{color:#55c8fa;font-weight:700}.brand-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,#49c6ff,#1a6cbc);font-size:24px;color:#051628;font-weight:950;line-height:1;font-style:italic;letter-spacing:-4px;padding-right:5px;box-shadow:0 4px 16px #24a3ff3d}.brand-icon-lg{width:43px;height:43px;font-size:28px}.auth-art{height:172px;position:relative;display:grid;place-items:center}.auth-cloud{width:125px;height:125px;filter:drop-shadow(0 8px 25px #149fff7a);color:#60c8ff;stroke-width:.85;z-index:2}.auth-orb{position:absolute;border-radius:50%;background:var(--cyan);box-shadow:0 0 24px #25edff6b}.orb-a{width:9px;height:9px;left:22%;top:26%}.orb-b{width:7px;height:7px;right:17%;bottom:26%}.auth-card h1{font-size:34px;letter-spacing:-1.4px;line-height:1.12;font-weight:760;margin:13px 0 14px}.auth-card h1 em{font-style:normal;background:linear-gradient(90deg,#6cdbfc,#3a93fa);-webkit-background-clip:text;background-clip:text;color:transparent}.auth-subtitle{color:#9aabc1;font-size:13.5px;line-height:1.7;margin:0 0 27px;max-width:365px}.input-label{display:block;color:#d9e6f4;margin:0 0 8px;font-size:12px;font-weight:650}.auth-card input{width:100%;border:1px solid #34506d;border-radius:11px;background:#0a1524;padding:13px 14px;color:#f0f7ff;outline:none;margin-bottom:13px}.auth-card input:focus{border-color:var(--blue);box-shadow:0 0 0 3px #318ef330}.form-error{color:#ff9299;margin:0 0 12px;font-size:12px}.auth-foot{border-top:1px solid #28405a;margin-top:26px;padding-top:20px;display:flex;justify-content:center;align-items:center;gap:8px;color:#7e98b5;font-size:11px}.auth-foot .ico{width:16px;height:16px;color:#5fd4c5}.connect-icon{margin:37px 0 22px;width:93px;height:93px;border-radius:24px;background:linear-gradient(145deg,#174a70,#14304e);display:grid;place-items:center;color:#65d4ff;box-shadow:0 8px 30px #005db03d}.connect-icon .ico{height:55px;width:55px}.connect-card .auth-subtitle{margin-bottom:18px}.account-note{margin:0 0 22px;border:1px solid #254564;border-radius:10px;padding:11px 13px;font-size:12px;color:#b7cfe4;background:#102538;overflow-wrap:anywhere}.connect-card .btn-ghost{margin-top:8px}
/* LAYOUT */
.app{min-height:100vh;display:flex}.sidebar{width:256px;flex-shrink:0;background:linear-gradient(185deg,#0d1829,#0a1320);border-right:1px solid #1c2d44;display:flex;flex-direction:column;min-height:100vh;position:sticky;top:0;height:100vh;padding:29px 18px 18px;z-index:30}.side-top{padding:0 10px 32px}.brand{display:flex;align-items:center;gap:11px}.brand-text{font-size:21px;letter-spacing:-.7px;font-weight:780}.brand-text>span{color:#45b4fb;margin-left:3px;font-weight:530}.side-upload{width:100%;min-height:47px;box-shadow:none;border-radius:12px;margin-bottom:36px}.upload-plus{margin-left:auto;font-weight:700;font-size:19px}.nav-label{padding:0 15px;color:#69849f;font-size:10px;letter-spacing:1.5px;font-weight:780;margin:0 0 13px}.nav{display:grid;gap:6px}.nav-item{height:44px;width:100%;display:flex;gap:13px;align-items:center;padding:0 14px;color:#9cacc2;background:transparent;border:1px solid transparent;border-radius:10px;font-weight:580;text-align:left}.nav-item:hover{background:#17283d;color:#e7f3ff}.nav-item.active{border-color:#284c6e;background:linear-gradient(90deg,#1c4160b8,#15263b);color:#7acbff}.nav-item .ico{width:19px;height:19px}.side-bottom{margin-top:auto}.quota-card{border:1px solid #2c435c;border-radius:14px;padding:17px 15px;background:#14243a;margin-bottom:20px}.quota-title{display:flex;gap:9px;align-items:center;font-weight:680;font-size:12px;color:#d8e5f6}.quota-title .ico{color:#5ec3fb}.quota-track{background:#273e55;border-radius:999px;height:6px;margin:15px 0 9px;overflow:hidden}.quota-fill{height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,#36a9ff,#73edeb);transition:width .3s}.quota-text{font-size:11px;color:#8fa5bd}.side-settings{height:45px;width:100%;padding:0 11px;display:flex;align-items:center;gap:12px;border:none;background:transparent;color:#a9bbce;text-align:left;border-radius:11px}.side-settings:hover{background:#1a2b40}.chevron-side{margin-left:auto;width:15px}.side-footer{margin:16px 10px 0;border-top:1px solid #213047;padding-top:15px;font-size:9px;color:#658098;letter-spacing:1.3px;font-weight:750}.side-footer span{float:right;letter-spacing:0}
.workspace{min-width:0;flex:1}.topbar{height:82px;border-bottom:1px solid #1e2d40;display:flex;align-items:center;justify-content:space-between;padding:0 43px;gap:20px}.search-shell{width:min(100%,460px);height:44px;display:flex;align-items:center;gap:12px;background:#131f30;border:1px solid #293a50;border-radius:12px;padding:0 13px;color:#7896b5}.search-shell:focus-within{border-color:#3185d0}.search-symbol{width:19px;height:19px}.search-shell input{background:transparent;border:none;min-width:0;flex:1;color:#ecf5fe;outline:none;font-size:13px}.search-shell input::placeholder{color:#7488a0}.search-shell input::-webkit-search-cancel-button{cursor:pointer}.search-shell kbd{border:1px solid #2f4057;color:#7188a3;border-radius:5px;padding:2px 5px;white-space:nowrap;font-size:10px}.top-actions{display:flex;align-items:center;gap:13px}.secure-pill{display:flex;align-items:center;gap:8px;color:#acc3d8;font-size:11px;white-space:nowrap}.secure-dot{width:7px;height:7px;border-radius:50%;background:#54e3ad;box-shadow:0 0 10px #54e3ad70}.avatar{height:37px;width:37px;border-radius:50%;background:linear-gradient(145deg,#37c8e9,#336fe4);color:#051322;border:2px solid #457cab;font-weight:800;font-size:17px}
.main-content{max-width:1600px;margin:0 auto;padding:42px 44px 80px}.section-meta{display:flex;align-items:center;gap:22px;margin-bottom:17px}.subtitle-date{color:#667f96;font-size:11px}.main-heading{display:flex;justify-content:space-between;gap:20px;align-items:center}.main-heading h1{font-size:32px;letter-spacing:-1.1px;line-height:1.25;margin:0 0 7px;font-weight:760}.main-heading p{margin:0;color:#859bb4;font-size:13px}.main-heading-actions{display:flex;gap:9px}.folder-breadcrumb{display:flex;align-items:center;gap:8px;min-height:57px;margin:21px 0 8px;flex-wrap:wrap}.crumb{border:none;background:transparent;color:#7999b9;font-size:12px;padding:5px 3px;max-width:195px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.crumb:hover{color:#7acbff}.crumb.last{color:#d7e9fc;font-weight:700;pointer-events:none}.crumb-sep{width:13px;color:#45617a}.list-head{border-top:1px solid #233349;display:flex;align-items:center;justify-content:space-between;padding-top:25px;margin-bottom:22px;gap:15px}.file-list-title{display:flex;align-items:center;gap:11px}.file-list-title h2{font-size:18px;letter-spacing:-.4px;font-weight:710;margin:0}.count-badge{background:#203149;color:#91acc9;border-radius:7px;font-weight:750;font-size:11px;padding:2px 9px}.file-controls{display:flex;gap:12px;align-items:center}.file-controls select{background:#131f30;color:#b2c6da;border:1px solid #2b4057;border-radius:9px;padding:9px 28px 9px 12px;outline:none;font-size:12px}.view-switch{display:flex;border:1px solid #293b52;border-radius:9px;padding:3px;background:#121d2d;gap:3px}.view-switch button{background:transparent;border:none;border-radius:6px;color:#7b91ab;display:grid;place-items:center;width:32px;height:31px}.view-switch button.active{background:#284864;color:#7ad5ff}
/* FILES */
.file-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:17px;align-content:start}.file-tile{border:1px solid #263a52;border-radius:15px;background:linear-gradient(160deg,#132338,#0f1b2b);min-width:0;cursor:pointer;transition:border-color .16s,transform .16s,background .16s;overflow:hidden;position:relative}.file-tile:hover{border-color:#427cac;transform:translateY(-2px);background:#182c43}.tile-media{height:127px;display:grid;place-items:center;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 75%,#244360 0,transparent 65%),#152439}.tile-media img{width:100%;height:100%;object-fit:cover}.tile-icon{width:61px;height:61px;filter:drop-shadow(0 7px 11px #0003);stroke-width:1.25}.kind-folder{color:#60beff}.kind-image{color:#9d9cff}.kind-video{color:#84d0ec}.kind-pdf{color:#ff918b}.kind-music{color:#87d7b5}.kind-text{color:#d7b9ff}.kind-file{color:#92b1cf}.folder .tile-media{background:radial-gradient(circle at 50% 95%,#27506d,transparent 70%),#15273e}.tile-info{min-height:71px;padding:12px 13px 12px}.tile-name{font-weight:670;color:#e7f1fa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:19px;font-size:12.5px}.tile-details{color:#7892ab;font-size:10.5px;margin-top:5px;display:flex;gap:5px;align-items:center;white-space:nowrap;overflow:hidden}.tile-star{position:absolute;top:9px;right:9px;color:#ffcf79}.tile-star .ico{width:16px;height:16px;fill:#ffcf793f}.tile-more{position:absolute;right:7px;bottom:34px;width:31px;height:29px;border:none;color:#a5bbd1;background:transparent;border-radius:6px;display:grid;place-items:center}.tile-more:hover{background:#2c4965;color:#fff}.tile-more .ico{width:18px}.file-grid.list-view{display:flex;flex-direction:column;gap:5px}.list-view .file-tile{display:flex;align-items:center;border-radius:10px;min-height:64px}.list-view .tile-media{width:62px;height:61px;flex:none;background:none}.list-view .tile-media .tile-icon{width:28px;height:28px}.list-view .tile-info{flex:1;min-height:0;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:10px 65px 10px 5px}.list-view .tile-name{flex:1;font-size:13px}.list-view .tile-details{margin:0;width:260px;justify-content:space-between;font-size:11px}.list-view .tile-more{bottom:16px;right:13px}.list-view .tile-star{top:24px;right:51px}.list-view .tile-media img{height:45px;width:45px;object-fit:cover;border-radius:6px}.load-more-row{display:flex;justify-content:center;padding:32px 0}.empty-state{grid-column:1/-1;border:1px dashed #2c435b;border-radius:19px;min-height:340px;background:linear-gradient(145deg,#0e1b2a,#101c2b);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:35px;color:#91aac2}.empty-state>.ico{width:52px;height:52px;color:#4778a4;stroke-width:1.25;margin-bottom:17px}.empty-state h3{margin:0 0 7px;color:#e1f0ff;font-size:19px}.empty-state p{margin:0;max-width:400px;line-height:1.7;font-size:12px}.empty-state .btn{margin-top:20px}.skeleton{height:207px;border:1px solid #243449;border-radius:14px;background:linear-gradient(100deg,#142135 25%,#1b2d43 45%,#142135 65%);background-size:200% 100%;animation:loading 1.25s ease infinite}@keyframes loading{to{background-position-x:-200%}}
/* MODALS */
.modal-overlay,.preview-overlay{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px;background:#030912c7;backdrop-filter:blur(7px)}.modal-box{background:#111f32;border:1px solid #344e67;border-radius:17px;box-shadow:var(--shadow);width:min(100%,490px);max-height:min(90vh,730px);overflow:auto;padding:24px}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px;gap:12px}.modal-head h2{margin:0;font-size:19px;letter-spacing:-.35px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.modal-copy{font-size:13px;color:#9eafc3;margin:0 0 15px;line-height:1.6}.modal-label{font-size:12px;color:#acc1d8;display:block;margin:0 0 8px}.modal-input{width:100%;border:1px solid #35506b;background:#0b1828;color:#fff;border-radius:10px;padding:12px;outline:none}.modal-input:focus{border-color:#58b7f7}.action-stack{display:grid;gap:7px}.action-row{border:1px solid transparent;background:#15273c;display:flex;align-items:center;gap:12px;border-radius:9px;width:100%;padding:12px 14px;text-align:left;color:#d9e7f4}.action-row:hover{border-color:#365c7b;background:#1b3149}.action-row.danger{color:#ff9eaa}.action-row .ico{width:18px;height:18px}.file-summary{padding:13px;background:#13273c;border-radius:10px;display:flex;align-items:center;gap:13px;margin-bottom:15px;min-width:0}.file-summary .ico{width:29px;height:29px;color:#70bff7}.file-summary strong{font-size:13px;overflow-wrap:anywhere}.file-summary small{display:block;color:#829ab1;margin-top:3px}.folder-picker{border:1px solid #2b425a;border-radius:10px;overflow:hidden;min-height:180px;max-height:310px;overflow-y:auto}.folder-option{display:flex;align-items:center;gap:10px;border:none;border-bottom:1px solid #25394f;background:#0d1c2f;color:#d1e3f5;width:100%;text-align:left;padding:12px}.folder-option:hover{background:#19334d}.folder-option .ico{color:#64bfff}.folder-option small{margin-left:auto;color:#788ea4}.picker-path{font-size:12px;color:#7facd2;margin-bottom:10px;overflow-wrap:anywhere}.picker-parent{color:#76c7ff}.settings-email{display:block;color:#8aacc8;overflow-wrap:anywhere;font-size:12px;margin:8px 0 18px}.settings-box{padding:14px;border:1px solid #29425a;border-radius:10px;background:#14273a;margin-bottom:10px;font-size:12px;color:#9fb4c8}.settings-box strong{color:#e6f0fc;display:block;margin-bottom:5px}.settings-box .ico{vertical-align:middle;margin-right:5px;color:#65d7ad}
/* PREVIEW */
.preview-overlay{padding:24px}.preview-pane{width:min(100%,1150px);height:min(92vh,850px);background:#091421;border:1px solid #2e4963;border-radius:19px;display:flex;flex-direction:column;box-shadow:var(--shadow);overflow:hidden}.preview-head{height:73px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2a4058;padding:14px 22px;gap:15px}.preview-head>div:first-child{min-width:0}.preview-label{display:block;font-size:9px;color:#6ba4c3;letter-spacing:1.5px;font-weight:800;margin-bottom:2px}.preview-head strong{font-size:13px;display:block;max-width:75vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preview-actions{display:flex;gap:6px;align-items:center}.preview-body{flex:1;min-height:0;display:grid;place-items:center;overflow:auto;padding:22px}.preview-body img{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px}.preview-body video{max-width:100%;max-height:100%}.preview-body audio{width:min(100%,500px)}.preview-body iframe{border:none;width:100%;height:100%;background:#fff;border-radius:6px}.preview-body pre{font-size:13px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;color:#cbdced;width:100%;align-self:start;background:#0e1d2e;padding:22px;border-radius:10px;margin:0}.preview-fallback{text-align:center;color:#8faac2}.preview-fallback>.ico{width:62px;height:62px;color:#6ca5d0}.preview-fallback h3{color:#f0f5ff}
/* UPLOAD / TOAST */
.drop-overlay{position:fixed;inset:12px;border:2px dashed #63baff;z-index:150;background:#081626ee;display:grid;place-items:center;border-radius:24px;text-align:center;pointer-events:none}.drop-overlay>.ico,.drop-overlay div>.ico{width:70px;height:70px;color:#55d3ff}.drop-overlay h2{font-size:29px;margin:17px 0 5px}.drop-overlay p{color:#9db7d0}.upload-queue{position:fixed;right:26px;bottom:24px;width:min(400px,calc(100vw - 30px));z-index:80;border-radius:15px;background:#17283d;border:1px solid #3e5873;box-shadow:var(--shadow);overflow:hidden}.queue-head{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;border-bottom:1px solid #2a425a}.queue-head strong{font-size:13px}.queue-head strong span{color:#7aa5c6}.queue-items{max-height:280px;overflow:auto}.queue-item{padding:12px 14px;border-bottom:1px solid #263d53}.queue-item:last-child{border-bottom:0}.queue-line{display:flex;justify-content:space-between;gap:10px;font-size:12px}.queue-filename{max-width:265px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.queue-status{font-size:11px;color:#83bad5}.queue-status.error{color:#ff9fa7}.upload-track{height:5px;background:#2b4760;border-radius:99px;margin-top:9px;overflow:hidden}.upload-progress{height:100%;background:linear-gradient(90deg,#1e9dea,#61e7db);transition:width .2s;width:0}.toast-host{position:fixed;right:24px;top:24px;z-index:180;display:grid;gap:10px}.toast{background:#193249;border:1px solid #3a637e;border-radius:10px;padding:12px 15px;box-shadow:0 10px 30px #0009;color:#e3f4ff;font-size:12px;max-width:360px;animation:toastin .2s}.toast.error{border-color:#aa515c;color:#ffd1d6;background:#422333}@keyframes toastin{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1000px){.sidebar{width:226px}.main-content{padding:34px 28px 70px}.topbar{padding:0 28px}.file-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}}
@media(max-width:730px){.mobile-only{display:grid!important}.sidebar{position:fixed;left:0;top:0;bottom:0;transform:translateX(-100%);transition:transform .23s;width:260px}.sidebar.open{transform:translateX(0)}.side-top{display:flex;align-items:center;justify-content:space-between}.sidebar-overlay{position:fixed;inset:0;z-index:25;background:#0009}.topbar{height:72px;padding:0 16px;gap:10px}.topbar>.mobile-only{flex:none}.top-actions{gap:3px}.secure-pill,.search-shell kbd{display:none}.search-shell{width:auto;flex:1}.main-content{padding:28px 18px 70px}.main-heading{align-items:flex-start}.main-heading h1{font-size:28px}.main-heading-actions{gap:6px}.main-heading-actions .btn{padding:8px 11px;min-height:40px;font-size:12px}.main-heading-actions .btn .ico{width:15px}.file-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.tile-media{height:105px}.tile-info{padding:10px;min-height:65px}.tile-more{bottom:30px}.list-view .tile-details{width:auto;display:block}.list-view .tile-details span:last-child{display:none}.list-head{padding-top:21px}.file-controls{gap:6px}.file-controls select{max-width:120px}.section-meta{margin-bottom:13px}.auth-card{padding:26px 27px}.preview-overlay{padding:7px}.preview-pane{height:95vh}.preview-head{padding:12px}.preview-body{padding:8px}.preview-actions .btn-small{padding:6px 8px}.modal-box{padding:18px}.upload-queue{right:15px;bottom:15px}}
@media(max-width:400px){.file-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.main-heading-actions .btn-secondary{font-size:0;gap:0}.main-heading-actions .btn-secondary .ico{width:18px;height:18px}.list-head{align-items:flex-start}.file-controls{flex-wrap:wrap;justify-content:flex-end}.auth-card h1{font-size:30px}}