:root{
  --bg:#0a0a0b;--panel:#111113;--panel2:#17171a;--line:#252529;
  --text:#f5f5f7;--muted:#8f8f98;--accent:#8b7cff;--success:#71dfbf;
  --danger:#ff748b;--radius:14px;
}
*{box-sizing:border-box}
html{color-scheme:dark}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
button{color:inherit}
svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hidden{display:none!important}
.app-shell{min-height:100vh;display:grid;grid-template-columns:220px 1fr}
.sidebar{position:sticky;top:0;height:100vh;padding:20px 15px;border-right:1px solid var(--line);background:#0d0d0f;display:flex;flex-direction:column}
.brand{display:flex;align-items:center;gap:10px;padding:2px 7px 22px;font-size:18px;font-weight:700}
.brand em{font-style:normal;color:var(--muted);font-weight:500}
.brand-mark{width:34px;height:34px;border-radius:10px;background:var(--accent);display:grid;place-items:center}
.vault-pill{margin:0 3px 15px;padding:9px 10px;border:1px solid var(--line);background:var(--panel);border-radius:10px;font-size:11px;font-weight:700;display:flex;align-items:center;gap:8px;color:#baf2e2}
.status-dot{width:7px;height:7px;border-radius:50%;background:var(--success)}
nav{display:flex;flex-direction:column;gap:4px}
.nav-item{display:flex;align-items:center;gap:10px;padding:10px 11px;border-radius:10px;color:var(--muted);font-size:13px;font-weight:600}
.nav-item:hover{background:var(--panel);color:var(--text)}
.nav-item.active{background:var(--panel2);color:var(--text)}
.sidebar-bottom{margin-top:auto}
.storage-card{padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.storage-card span,.storage-card small{display:block}
.storage-card span{font-size:11px;color:var(--muted)}
.storage-card strong{display:block;font-size:13px;margin-top:5px}
.storage-card small{font-size:10px;color:var(--muted);margin-top:5px}
.main{min-width:0}
.topbar{min-height:78px;padding:17px 26px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;background:rgba(10,10,11,.94);position:sticky;top:0;z-index:10;backdrop-filter:blur(12px)}
.page-heading{min-width:0;flex:1}
.page-heading h1{margin:0;font-size:21px;letter-spacing:-.4px}
.page-heading p{margin:4px 0 0;color:var(--muted);font-size:11px}
.top-actions{display:flex;gap:8px}
.content{padding:24px 26px 44px;max-width:1300px;margin:auto}
.btn{border:1px solid var(--line);border-radius:10px;padding:10px 13px;background:var(--panel);font-weight:700;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:7px}
.btn:hover{background:var(--panel2)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:white}
.btn.danger{color:var(--danger);background:transparent;border-color:#40262d}
.btn:disabled{opacity:.55;cursor:not-allowed}
.icon-btn{border:0;background:transparent;padding:7px;border-radius:8px;display:grid;place-items:center;cursor:pointer;color:var(--muted)}
.icon-btn:hover{background:var(--panel);color:var(--text)}
.mobile-menu{display:none}
.grid{display:grid;gap:14px}
.stats{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.card-pad{padding:18px}
.stat{padding:18px}
.stat-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--panel2);color:#c6beff;margin-bottom:15px}
.stat span{display:block;color:var(--muted);font-size:11px}
.stat strong{display:block;font-size:22px;margin-top:5px}
.stat small{display:block;color:var(--muted);font-size:10px;margin-top:7px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:12px;margin:24px 0 12px}
.section-head h2{font-size:15px;margin:0}
.section-head p{font-size:10px;color:var(--muted);margin:4px 0 0}
.search-box{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--panel);padding:9px 11px;border-radius:10px;min-width:220px}
.search-box input{border:0;outline:0;background:transparent;color:var(--text);width:100%}
.file-table{overflow:hidden}
.file-row{display:grid;grid-template-columns:minmax(250px,2fr) 1fr 100px 42px;align-items:center;gap:10px;padding:13px 16px;border-top:1px solid var(--line)}
.file-row.header{border-top:0;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.07em}
.file-row:not(.header):hover{background:#151518}
.file-name{display:flex;align-items:center;gap:11px;min-width:0}
.file-name strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}
.file-name small{display:block;color:var(--muted);font-size:10px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.file-icon{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;font-size:9px;font-weight:800;border:1px solid var(--line);background:var(--panel2);color:#c7c0ff}
.file-meta{color:var(--muted);font-size:11px}
.badge{display:inline-flex;padding:5px 8px;border-radius:999px;background:#12211d;color:#a3ead4;border:1px solid #214238;font-size:9px;font-weight:800}
.empty{text-align:center;padding:52px 20px}
.empty-icon{width:54px;height:54px;border-radius:16px;margin:auto;background:var(--panel2);display:grid;place-items:center;color:var(--muted)}
.empty h3{margin:16px 0 7px;font-size:15px}
.empty p{margin:0 auto;max-width:360px;color:var(--muted);font-size:11px;line-height:1.55}
.notice{padding:12px 13px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);color:var(--muted);font-size:10px;line-height:1.5}
.error-box{margin-top:13px;padding:11px 12px;border-radius:10px;border:1px solid #512a34;background:#1b1114;color:#ff9daf;font-size:11px}
.loading{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:11px}
.spinner{width:14px;height:14px;border:2px solid #33333a;border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.auth-body{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--bg)}
.auth-wrap{width:min(100%,410px);border:1px solid var(--line);border-radius:18px;background:var(--panel);overflow:hidden}
.auth-panel{padding:32px}
.auth-panel h1{font-size:24px;margin:0;letter-spacing:-.5px}
.auth-panel>p{color:var(--muted);font-size:12px;line-height:1.55;margin:8px 0 22px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:10px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.input{width:100%;border:1px solid var(--line);background:#0d0d0f;color:var(--text);border-radius:10px;padding:11px 12px;outline:none}
.input:focus{border-color:#665bbb}
.form-actions{margin-top:15px}
.setup-card{max-width:600px;margin:0 auto}
.setup-card h1{margin:0;font-size:25px}
.setup-card>p{color:var(--muted);font-size:12px;line-height:1.6}
.form-grid{display:grid;gap:13px;margin-top:20px}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;word-break:break-all}
.toast{position:fixed;right:20px;bottom:20px;display:flex;align-items:center;gap:9px;background:var(--panel2);border:1px solid var(--line);padding:12px 14px;border-radius:10px;transform:translateY(20px);opacity:0;pointer-events:none;transition:.2s;z-index:100}
.toast.show{transform:none;opacity:1}
@media(max-width:980px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){
  .app-shell{grid-template-columns:1fr}
  .sidebar{position:fixed;left:-240px;width:220px;z-index:30;transition:.22s}
  .sidebar.open{left:0}
  .mobile-menu{display:grid}
  .topbar{padding:14px 15px;min-height:70px}
  .content{padding:19px 15px 34px}
  .file-row{grid-template-columns:minmax(180px,1fr) 80px 36px}
  .file-row>*:nth-child(2){display:none}
}
@media(max-width:480px){
  .stats{grid-template-columns:1fr}
  .page-heading p{display:none}
  .search-box{min-width:0;width:100%}
  .section-head{align-items:stretch;flex-direction:column}
}

.dropzone{
  min-height:260px;
  display:grid;
  place-items:center;
  align-content:center;
  text-align:center;
  padding:30px;
  border-style:dashed;
  transition:.18s ease;
}
.dropzone.dragging{
  border-color:var(--accent);
  background:#15131f;
}
.dropzone h2{
  margin:15px 0 6px;
  font-size:18px;
}
.dropzone p{
  margin:0 0 17px;
  color:var(--muted);
  font-size:11px;
}
.upload-list{
  display:flex;
  flex-direction:column;
  gap:9px;
}
.upload-item{
  display:grid;
  grid-template-columns:36px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#0e0e10;
}
.upload-info{
  min-width:0;
}
.upload-info strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
}
.upload-info small{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:10px;
}
.progress{
  height:5px;
  overflow:hidden;
  margin-top:8px;
  border-radius:10px;
  background:#28282d;
}
.progress i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:var(--accent);
  transition:width .15s linear;
}
.error-badge{
  color:#ff9daf;
  background:#1b1114;
  border-color:#512a34;
}
.compact-empty{
  padding:22px;
}

.icon-btn:disabled{
  opacity:.35;
  cursor:not-allowed;
}
.file-row .spinner{
  width:14px;
  height:14px;
}

.file-row{
  grid-template-columns:
    minmax(250px,2fr)
    1fr
    100px
    116px;
}

.file-actions{
  display:flex;
  justify-content:flex-end;
  gap:2px;
}

.danger-icon{
  color:#b66f7c;
}

.danger-icon:hover{
  color:#ff8ca0;
  background:#211216;
}

.modal{
  width:min(92vw,430px);
  padding:0;
  border:1px solid var(--line);
  border-radius:16px;
  background:transparent;
  color:var(--text);
  box-shadow:0 24px 90px rgba(0,0,0,.55);
}

.modal::backdrop{
  background:rgba(0,0,0,.68);
  backdrop-filter:blur(5px);
}

.modal-card{
  padding:20px;
  border-radius:inherit;
  background:var(--panel);
}

.modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:18px;
}

.modal-head h2{
  margin:0;
  font-size:17px;
}

.modal-head p{
  margin:5px 0 0;
  color:var(--muted);
  font-size:10px;
}

.modal-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:17px;
}

@media(max-width:720px){
  .file-row{
    grid-template-columns:
      minmax(150px,1fr)
      72px
      104px;
  }

  .file-row>*:nth-child(2){
    display:none;
  }

  .file-actions{
    gap:0;
  }
}

.restore-icon{
  color:#83d8bf;
}

.restore-icon:hover{
  color:#b0f3df;
  background:#11201b;
}

.trash-warning{
  margin:0;
  color:#d7a5ae;
  border-color:#42272e;
  background:#171013;
}

.confirm-modal{
  width:min(92vw,390px);
}

.confirm-modal .modal-card{
  padding:24px;
  text-align:center;
}

.confirm-modal h2{
  margin:15px 0 7px;
  font-size:18px;
}

.confirm-modal p{
  margin:0;
  color:var(--muted);
  font-size:11px;
  line-height:1.6;
}

.confirm-modal p strong{
  color:var(--text);
  font-weight:700;
  word-break:break-word;
}

.confirm-icon{
  width:54px;
  height:54px;
  margin:0 auto;
  border-radius:16px;
  display:grid;
  place-items:center;
}

.confirm-icon svg{
  width:23px;
  height:23px;
}

.trash-confirm-icon{
  color:#ff9aac;
  background:#241317;
  border:1px solid #4a2730;
}

.permanent-confirm-icon{
  color:#ffbd76;
  background:#23190e;
  border:1px solid #49341c;
}

.split-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  margin-top:20px;
}

.solid-danger{
  color:white;
  background:#d74d65;
  border-color:#d74d65;
}

.solid-danger:hover{
  background:#e15870;
}

.permanent-field{
  margin-top:18px;
  text-align:left;
}

.permanent-field .input{
  text-align:center;
  letter-spacing:.16em;
  font-weight:800;
}

@media(max-width:420px){
  .split-actions{
    grid-template-columns:1fr;
  }
}

.breadcrumb{
  min-height:22px;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  margin-bottom:16px;
  color:var(--muted);
  font-size:11px;
}

.breadcrumb-item{
  color:var(--muted);
}

.breadcrumb-item:hover{
  color:var(--text);
}

.breadcrumb-item.active{
  color:var(--text);
  font-weight:700;
}

.breadcrumb-separator{
  color:#55555d;
}

.folder-grid{
  grid-template-columns:
    repeat(4,minmax(0,1fr));
}

.folder-card{
  display:grid;
  grid-template-columns:40px minmax(0,1fr) 18px;
  align-items:center;
  gap:11px;
  padding:14px;
}

.folder-card:hover{
  background:var(--panel2);
}

.folder-icon{
  width:40px;
  height:40px;
  border-radius:11px;
  display:grid;
  place-items:center;
  color:#c7c0ff;
  background:#1b1828;
}

.folder-info{
  min-width:0;
}

.folder-info strong,
.folder-info small{
  display:block;
}

.folder-info strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
}

.folder-info small{
  margin-top:4px;
  color:var(--muted);
  font-size:10px;
}

.folder-chevron{
  color:#65656e;
}

.select-input{
  appearance:auto;
}

.file-row{
  grid-template-columns:
    minmax(250px,2fr)
    1fr
    100px
    148px;
}

@media(max-width:1050px){
  .folder-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }
}

@media(max-width:720px){
  .folder-grid{
    grid-template-columns:1fr;
  }

  .file-row{
    grid-template-columns:
      minmax(140px,1fr)
      70px
      140px;
  }
}

.folder-card{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  padding:0;
  overflow:hidden;
}

.folder-open{
  min-width:0;
  display:grid;
  grid-template-columns:40px minmax(0,1fr) 18px;
  align-items:center;
  gap:11px;
  padding:14px 8px 14px 14px;
}

.folder-actions{
  display:flex;
  align-items:center;
  gap:1px;
  padding-right:8px;
}

.folder-card:hover{
  background:var(--panel2);
}

.upload-destination{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:16px;
}

.upload-destination small,
.upload-destination strong,
.upload-destination p{
  display:block;
}

.upload-destination small{
  color:var(--muted);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.12em;
}

.upload-destination strong{
  margin-top:5px;
  font-size:13px;
}

.upload-destination p{
  margin:5px 0 0;
  color:var(--muted);
  font-size:10px;
}

#folderTrashMessage{
  margin-top:8px;
}

@media(max-width:620px){
  .upload-destination{
    align-items:flex-start;
    flex-direction:column;
  }

  .upload-destination .btn{
    width:100%;
  }

  .folder-open{
    grid-template-columns:36px minmax(0,1fr);
  }

  .folder-chevron{
    display:none;
  }
}

.security-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:14px;
}

.security-grid-lower{
  margin-top:14px;
  align-items:start;
}

.security-card{
  min-width:0;
}

.security-card-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin-bottom:18px;
}

.security-card-head h2{
  margin:0;
  font-size:15px;
}

.security-card-head p{
  margin:5px 0 0;
  color:var(--muted);
  font-size:10px;
  line-height:1.55;
}

.security-card-icon{
  width:38px;
  height:38px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:11px;
  color:#c6beff;
  background:#17151f;
}

.security-card-icon svg{
  width:18px;
  height:18px;
}

.security-details{
  display:grid;
  gap:9px;
}

.security-details>div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#0e0e10;
}

.security-details span{
  color:var(--muted);
  font-size:10px;
}

.security-details strong{
  font-size:11px;
}

.security-form{
  display:grid;
  gap:13px;
}

.security-action{
  width:100%;
  justify-content:center;
  margin-top:14px;
}

.field-help{
  display:block;
  margin-top:7px;
  color:var(--muted);
  font-size:9px;
}

.password-strength{
  display:grid;
  grid-template-columns:
    repeat(3,1fr);
  gap:5px;
  margin-top:8px;
}

.password-strength i{
  height:4px;
  border-radius:8px;
  background:#2b2b31;
}

.password-strength[data-level="1"] i:nth-child(1){
  background:#a4834d;
}

.password-strength[data-level="2"] i:nth-child(-n+2){
  background:#7d71d5;
}

.password-strength[data-level="3"] i{
  background:#68bea5;
}

.recovery-notice{
  line-height:1.65;
}

.config-ready-icon{
  color:#91dfc7;
  background:#112019;
  border-color:#244b3e;
}

.replacement-warning{
  margin-top:15px;
  padding:11px;
  border:1px solid #49361e;
  border-radius:10px;
  color:#e2bd82;
  background:#1c160e;
  font-size:10px;
  line-height:1.55;
}

@media(max-width:840px){
  .security-grid{
    grid-template-columns:1fr;
  }
}

.startup-error-overlay{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(4,4,6,.88);
  backdrop-filter:blur(8px);
}

.startup-error-card{
  width:min(92vw,420px);
  padding:24px;
  text-align:center;
}

.startup-error-card h2{
  margin:0;
  font-size:18px;
}

.startup-error-card p{
  margin:9px 0 18px;
  color:var(--muted);
  font-size:11px;
  line-height:1.6;
}

.file-row{
  grid-template-columns:
    minmax(250px,2fr)
    1fr
    100px
    180px;
}

.preview-dialog{
  width:min(94vw,1100px);
  height:min(92vh,820px);
  padding:0;
  border:1px solid var(--line);
  border-radius:18px;
  color:var(--text);
  background:#0b0b0e;
  box-shadow:0 30px 110px rgba(0,0,0,.72);
}

.preview-dialog::backdrop{
  background:rgba(0,0,0,.78);
  backdrop-filter:blur(8px);
}

.preview-shell{
  width:100%;
  height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  overflow:hidden;
  border-radius:inherit;
}

.preview-header,
.preview-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:14px 16px;
  background:#111114;
}

.preview-header{
  border-bottom:1px solid var(--line);
}

.preview-footer{
  border-top:1px solid var(--line);
}

.preview-title{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
}

.preview-title>div{
  min-width:0;
}

.preview-title strong,
.preview-title small{
  display:block;
}

.preview-title strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
}

.preview-title small{
  margin-top:3px;
  color:var(--muted);
  font-size:9px;
}

.preview-lock{
  width:34px;
  height:34px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border:1px solid #34303f;
  border-radius:10px;
  color:#c7bfff;
  background:#191621;
}

.preview-lock svg{
  width:16px;
  height:16px;
}

.preview-body{
  min-height:0;
  display:grid;
  place-items:center;
  overflow:auto;
  padding:18px;
  background:
    radial-gradient(circle at 50% 0%,rgba(104,85,180,.10),transparent 42%),
    #08080a;
}

.preview-loading{
  width:min(90%,360px);
  display:grid;
  justify-items:center;
  gap:10px;
  text-align:center;
}

.preview-loading strong{
  font-size:12px;
}

.preview-loading small{
  color:var(--muted);
  font-size:10px;
}

.preview-progress{
  width:100%;
}

.preview-empty{
  max-width:420px;
  text-align:center;
}

.preview-empty-icon{
  width:46px;
  height:46px;
  margin:0 auto 12px;
  display:grid;
  place-items:center;
  border:1px solid #4d2b33;
  border-radius:14px;
  color:#ff9caf;
  background:#1e1115;
  font-weight:900;
}

.preview-empty h3{
  margin:0;
  font-size:15px;
}

.preview-empty p{
  margin:7px 0 0;
  color:var(--muted);
  font-size:10px;
  line-height:1.6;
}

.image-preview{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  border-radius:8px;
  box-shadow:0 15px 50px rgba(0,0,0,.4);
}

.video-preview{
  width:min(100%,920px);
  max-height:100%;
  border-radius:10px;
  background:#000;
}

.audio-preview{
  width:min(100%,620px);
}

.pdf-preview{
  width:100%;
  height:100%;
  min-height:520px;
  border:0;
  border-radius:8px;
  background:white;
}

.text-preview{
  width:100%;
  min-height:100%;
  margin:0;
  padding:18px;
  overflow:auto;
  border:1px solid var(--line);
  border-radius:10px;
  color:#dddde4;
  background:#0d0d10;
  font:11px/1.65 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

.preview-details{
  min-width:0;
  display:flex;
  align-items:center;
  gap:22px;
}

.preview-details span{
  min-width:0;
}

.preview-details small,
.preview-details strong{
  display:block;
}

.preview-details small{
  color:var(--muted);
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.1em;
}

.preview-details strong{
  max-width:220px;
  margin-top:3px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:10px;
}

.preview-actions{
  display:flex;
  gap:8px;
}

@media(max-width:760px){
  .file-row{
    grid-template-columns:
      minmax(130px,1fr)
      68px
      172px;
  }

  .preview-dialog{
    width:100vw;
    height:100vh;
    max-width:none;
    max-height:none;
    border:0;
    border-radius:0;
  }

  .preview-footer{
    align-items:stretch;
    flex-direction:column;
  }

  .preview-details{
    display:grid;
    grid-template-columns:
      repeat(3,minmax(0,1fr));
    gap:10px;
  }

  .preview-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .preview-actions .btn{
    justify-content:center;
  }

  .pdf-preview{
    min-height:440px;
  }
}

.preview-icon{
  color:#bdb4ff;
}

.preview-icon:hover:not(:disabled){
  color:#ded9ff;
  background:#1c1927;
}

.text-stream-shell{
  width:100%;
  height:100%;
  min-height:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  gap:10px;
}

.text-stream-toolbar{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
}

.text-stream-toolbar span{
  overflow:hidden;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--muted);
  font-size:9px;
}

.text-stream-shell .text-preview{
  min-height:0;
  height:100%;
}

@media(max-width:560px){
  .text-stream-toolbar{
    grid-template-columns:1fr 1fr;
  }

  .text-stream-toolbar span{
    grid-column:1/-1;
    grid-row:1;
  }
}

html:not(.auth-ready) body[data-protected="true"]{
  visibility:hidden;
}

.format-mark{
  display:inline-flex;
  align-items:center;
  margin-left:7px;
  padding:2px 5px;
  border:1px solid var(--line);
  border-radius:6px;
  font-size:7px;
  font-style:normal;
  letter-spacing:.04em;
  vertical-align:middle;
}

.format-v2{
  color:#9ce1ca;
  border-color:#285044;
  background:#0e1915;
}

.format-v1{
  color:#b2b2ba;
  background:#151519;
}

.file-view-controls{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.compact-btn{
  min-height:38px;
}

#favoritesOnly.active{
  color:#f0d982;
  border-color:#574b24;
  background:#1d190d;
}

.sort-select{
  width:auto;
  min-width:140px;
  min-height:38px;
  padding-top:8px;
  padding-bottom:8px;
}

.bulk-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
  padding:12px;
}

.bulk-selection-info,
.bulk-actions{
  display:flex;
  align-items:center;
  gap:8px;
}

.bulk-selection-info strong{
  font-size:11px;
}

.bulk-selection-mark{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:1px solid #3d365f;
  border-radius:9px;
  color:#c8bfff;
  background:#191621;
}

.bulk-selection-mark svg{
  width:14px;
  height:14px;
}

.select-file-button{
  width:20px;
  height:20px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid #3a3a41;
  border-radius:6px;
  background:#0c0c0f;
  cursor:pointer;
}

.select-file-button span{
  width:8px;
  height:5px;
  border-left:2px solid transparent;
  border-bottom:2px solid transparent;
  transform:rotate(-45deg) translateY(-1px);
}

.select-file-button.selected,
.file-row.selected .select-file-button{
  border-color:#8274de;
  background:#7667d8;
}

.select-file-button.selected span,
.file-row.selected .select-file-button span{
  border-color:white;
}

.file-row.selected{
  background:#15131d;
  box-shadow:inset 2px 0 0 #7667d8;
}

.favorite-icon.active{
  color:#f0d982;
  background:#1d190d;
}

.favorite-icon svg{
  fill:transparent;
}

.favorite-icon.active svg{
  fill:currentColor;
}

@media(max-width:900px){
  .file-view-controls{
    width:100%;
    justify-content:stretch;
  }

  .file-view-controls .search-box{
    flex:1 1 100%;
  }

  .sort-select{
    flex:1;
  }

  .bulk-toolbar{
    align-items:stretch;
    flex-direction:column;
  }

  .bulk-actions{
    display:grid;
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .bulk-actions .btn{
    justify-content:center;
  }
}

@media(max-width:620px){
  .file-view-controls{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .file-view-controls .search-box{
    grid-column:1/-1;
  }

  .bulk-actions{
    grid-template-columns:1fr;
  }
}

.file-row{
  grid-template-columns:
    minmax(250px,2fr)
    1fr
    100px
    220px;
}

.folder-actions{
  flex:0 0 auto;
}

.favorite-icon{
  color:#777780;
}

.favorite-icon:hover:not(:disabled){
  color:#f0d982;
  background:#1d190d;
}

.favorite-icon.active{
  color:#f0d982;
  border-color:#574b24;
  background:#1d190d;
}

.favorite-icon svg{
  fill:transparent;
}

.favorite-icon.active svg{
  fill:currentColor;
}

@media(max-width:720px){
  .file-row{
    grid-template-columns:
      minmax(130px,1fr)
      68px
      210px;
  }

  .folder-card{
    grid-template-columns:
      minmax(0,1fr)
      auto;
  }

  .folder-actions{
    padding-right:6px;
  }
}

.duplicate-dialog{
  width:min(92vw,440px);
}

.duplicate-confirm-icon{
  color:#ffd18a;
  border-color:#4e3a20;
  background:#20170d;
}

.duplicate-options{
  display:grid;
  gap:8px;
  margin-top:20px;
}

.duplicate-option{
  width:100%;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  gap:11px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:12px;
  color:var(--text);
  background:#0e0e11;
  text-align:left;
  cursor:pointer;
}

.duplicate-option:hover{
  border-color:#554b88;
  background:#15131d;
}

.duplicate-option-icon{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border:1px solid #3a3651;
  border-radius:10px;
  color:#c9c1ff;
  background:#181520;
  font-size:13px;
  font-weight:900;
}

.duplicate-option strong,
.duplicate-option small{
  display:block;
}

.duplicate-option strong{
  font-size:11px;
}

.duplicate-option small{
  margin-top:4px;
  color:var(--muted);
  font-size:9px;
  line-height:1.45;
}

.duplicate-option.danger-option:hover{
  border-color:#59303a;
  background:#1b1114;
}

.duplicate-option.danger-option
.duplicate-option-icon{
  color:#ff9caf;
  border-color:#4d2b34;
  background:#1e1115;
}

.duplicate-cancel{
  width:100%;
  justify-content:center;
  margin-top:12px;
}

.upload-item{
  grid-template-columns:
    38px minmax(0,1fr) auto auto;
}

.upload-cancel{
  align-self:center;
}

.upload-item.complete{
  border-color:#28483d;
  background:#0e1714;
}

.upload-item.warning{
  border-color:#5b4825;
  background:#1a150c;
}

.upload-item.failed{
  border-color:#572d37;
  background:#1a1013;
}

.upload-item.warning .upload-status{
  color:#e7c77f;
}

.upload-item.failed .upload-status{
  color:#f1a0b1;
}

.duplicate-option:disabled{
  display:none;
}