:root{--bg:#f5f6f1;--surface:#fff;--soft:#f9faf6;--ink:#212a22;--ink2:#566253;--muted:#8c9688;--line:#e7eae0;--accent:#4d7a38;--accent-soft:#e8f1da;--lime:#d4ed9c;--side:#1e2620;--side-ink:#b9c4b5;--side-line:#2f3a30;--danger:#b9654a;--danger-soft:#fbefe9;--sidebar:236px;--r:14px;--shadow:0 1px 2px #1f2d1a0a,0 10px 30px #1f2d1a0d;--sk-hi:#f3f5ef;--ease:cubic-bezier(.22,.8,.3,1);color-scheme:light;font-family:Inter,-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;color:var(--ink);font-synthesis:none;font-size:14px;-webkit-font-smoothing:antialiased}
@media(prefers-color-scheme:dark){:root{--bg:#131813;--surface:#1b221c;--soft:#202820;--ink:#e8eee3;--ink2:#b3bfae;--muted:#7f8b7b;--line:#2b342c;--accent:#a8cf7a;--accent-soft:#2a3a25;--side:#0f140f;--side-ink:#9fab9b;--side-line:#222b23;--danger:#d98c72;--danger-soft:#33241e;--shadow:0 10px 30px #0006;--sk-hi:#333d34;color-scheme:dark}}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);transition:background .3s}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;background:none;color:inherit}button:disabled{cursor:not-allowed;opacity:.5}a{color:inherit;text-decoration:none}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}svg.icon{width:18px;height:18px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}[data-icon]{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}[hidden]{display:none!important}
/* sidebar */
.sidebar{width:var(--sidebar);position:fixed;inset:0 auto 0 0;background:var(--side);color:var(--side-ink);display:flex;flex-direction:column;padding:28px 16px 16px;z-index:40}.brand{display:flex;align-items:center;gap:12px;padding:0 10px;color:#f4f8ec;font-size:22px;font-weight:650;letter-spacing:2px;line-height:1.1}.brand-mark{display:grid;grid-template-columns:11px 11px;gap:4px;transform:rotate(-9deg);transition:transform .5s var(--ease)}.brand:hover .brand-mark{transform:rotate(0)}.brand-mark i{width:11px;height:11px;border-radius:3px;background:var(--lime)}.brand-mark i:last-child{border-radius:6px}.brand-en{display:block;font-size:9px;letter-spacing:3px;margin-top:6px;font-weight:400;opacity:.55}
.main-nav{display:flex;flex-direction:column;gap:4px;margin-top:38px}.nav-item{position:relative;display:flex;align-items:center;gap:12px;width:100%;height:42px;border-radius:10px;padding:0 14px;color:var(--side-ink);text-align:left;font-size:14px;transition:background .2s,color .2s,transform .2s var(--ease)}.nav-item:hover{background:#ffffff0f;color:#f4f7ed;transform:translateX(2px)}.nav-item.active{background:var(--lime);color:#2f3f27;font-weight:600;transform:none}.nav-count{margin-left:auto;min-width:22px;height:20px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;border-radius:6px;background:#ffffff1a}.nav-item.active .nav-count{background:#2f3f2722}.tiny-dot{width:6px;height:6px;background:#9cae85;border-radius:50%;margin-left:auto}.nav-divider{height:1px;background:var(--side-line);margin:10px 8px}
.sidebar-bottom{margin-top:auto;display:flex;flex-direction:column;gap:12px}.storage-card{padding:16px;border:1px solid var(--side-line);border-radius:12px;background:#ffffff08}.storage-heading{display:flex;align-items:center;gap:8px;font-size:13px;color:#e5ebdf}.storage-heading .icon{width:16px;height:16px;color:#bbc99e}.storage-badge{display:none}.storage-meter{height:5px;background:#ffffff1a;border-radius:5px;margin:14px 0 10px;overflow:hidden}.storage-meter span{display:block;height:100%;background:var(--lime);min-width:4px;border-radius:5px;transition:width .8s var(--ease)}.storage-caption{display:flex;align-items:baseline;gap:6px;font-size:12px;color:#8e9b89}.storage-caption strong{font-size:13px;font-weight:600;color:#e6eedd}.storage-card p{display:none}.storage-button{display:flex;justify-content:space-between;align-items:center;font-size:12px;width:100%;border-radius:8px;padding:9px 11px;margin-top:12px;background:#ffffff0f;color:#d8e9b6;transition:background .2s}.storage-button:hover{background:#ffffff1c}.storage-button .icon{width:13px;height:13px}.sidebar-note{display:none}.online-dot{display:inline-block;width:6px;height:6px;background:#92ad6f;border-radius:50%;flex-shrink:0}
.account{border-top:1px solid var(--side-line);width:100%;padding:16px 4px 4px;display:flex;gap:10px;align-items:center;text-align:left}.avatar{display:flex;align-items:center;justify-content:center;height:36px;width:36px;border-radius:11px;background:#d0dea9;color:#40532f;font-size:15px;font-weight:650;flex-shrink:0}.account-copy{display:flex;flex-direction:column;gap:3px;min-width:0}.account-copy strong{font-size:13px;font-weight:500;color:#e6ecde}.account-copy>span{font-size:11px;color:#8a9784}.account>[data-icon]{margin-left:auto;color:#8d9c81}.account .icon{width:14px;height:14px}
/* topbar */
.main-shell{margin-left:var(--sidebar);min-height:100vh}.topbar{position:sticky;top:0;z-index:20;height:68px;padding:0 40px;display:flex;align-items:center;justify-content:space-between;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.workspace-path{display:flex;gap:10px;font-size:13px;color:var(--muted);align-items:center}.workspace-path>span{color:var(--line)}.workspace-path strong{font-weight:500;color:var(--ink2)}.topbar-right{display:flex;align-items:center;gap:14px}.search-box{display:flex;align-items:center;gap:10px;min-width:280px;height:38px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--muted);transition:border-color .2s,box-shadow .2s}.search-box:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.search-box .icon{width:16px;height:16px}.search-box input{flex:1;min-width:0;background:none;border:0;outline:0;font-size:13px;color:var(--ink)}.search-box input::placeholder{color:var(--muted)}.search-box kbd{border:1px solid var(--line);border-radius:5px;font-size:11px;padding:2px 6px;color:var(--muted);font-family:inherit}.icon-button{display:inline-flex;align-items:center;justify-content:center;padding:8px;border-radius:9px;color:var(--muted);transition:background .2s,color .2s}.icon-button:hover{background:var(--accent-soft);color:var(--accent)}.topbar-separator{height:20px;width:1px;background:var(--line)}.role-button{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:9px;font-size:13px;color:var(--ink2);transition:background .2s}.role-button:hover{background:var(--accent-soft)}.role-button .icon{height:13px;width:13px}.role-indicator{width:7px;height:7px;background:var(--accent);border-radius:50%}.mobile-menu{display:none}
/* main */
main{max-width:1560px;margin:auto;padding:32px 40px 28px;animation:rise .5s var(--ease) both}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:24px}.eyebrow{display:none}h1{font-size:28px;letter-spacing:.5px;line-height:1.3;margin:0;font-weight:650}.heading-dot{color:var(--accent)}.page-heading p{margin:8px 0 0;font-size:13px;color:var(--muted)}.date-label{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}.date-label .icon{width:14px;height:14px}
.overview{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(300px,1fr);gap:18px;margin-bottom:20px}.overview.guest-view{grid-template-columns:minmax(0,1fr)}.hero-card{position:relative;display:flex;min-height:240px;overflow:hidden;border-radius:var(--r);background:radial-gradient(ellipse at 78% 50%,#e3ecc9 0%,#ecf0db 55%,#eef1e0 100%);border:1px solid #e1e8cf}.hero-copy{position:relative;z-index:2;padding:32px 0 28px 36px;min-width:280px;display:flex;flex-direction:column;align-items:flex-start}.hero-tag,.hero-footnote,.art-label,.hero-copy p{display:none}.hero-copy h2{font-size:34px;line-height:1.4;letter-spacing:1.5px;margin:0 0 24px;font-weight:650;color:#2f4027}.hero-copy h2>span{color:#6f8d4d}.hero-actions{display:flex;gap:10px}.hero-art{position:absolute;width:52%;right:0;top:0;height:100%;display:flex;align-items:center;justify-content:center}.hero-art>svg{width:108%;height:100%;max-height:260px;animation:float 6s ease-in-out infinite}
.button{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:10px;padding:11px 18px;font-size:13px;font-weight:500;transition:background .2s,transform .2s var(--ease),box-shadow .2s;white-space:nowrap}.button:hover:not(:disabled){transform:translateY(-1px)}.button:active:not(:disabled){transform:none}.button .icon{width:15px;height:15px}.primary{background:#2f4227;color:#f6faee;border:1px solid #2f4227}.primary:hover:not(:disabled){background:#40583a;box-shadow:0 6px 16px #2f422733}.hero-secondary{background:#ffffffa6;border:1px solid #d9e2c4;color:#4f6a3a}.hero-secondary:hover{background:#fff}.outline{border:1px solid var(--line);color:var(--ink2);background:var(--surface)}.outline:hover{background:var(--soft);border-color:var(--accent)}
.permission-card{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:22px;display:flex;flex-direction:column;box-shadow:var(--shadow)}.card-heading{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600}.permission-icon{height:28px;width:28px;border-radius:8px;background:var(--accent-soft);color:var(--accent)}.permission-icon .icon{width:15px;height:15px}.subtle-badge,.permission-footer{display:none}.permission-status{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:20px 0 14px}.permission-status h3{font-size:14px;font-weight:600;margin:0 0 5px}.permission-status>div>span{font-size:12px;color:var(--muted)}.switch{width:40px;height:23px;flex-shrink:0;border-radius:30px;background:var(--line);padding:3px;transition:background .25s}.switch span{display:block;width:17px;height:17px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .25s var(--ease)}.switch.on{background:#8fb866}.switch.on span{transform:translateX(17px)}.permission-explanation{display:flex;gap:8px;padding:12px;background:var(--soft);border-radius:10px}.permission-explanation>[data-icon]{align-self:flex-start;color:var(--muted);margin-top:2px}.permission-explanation .icon{height:14px;width:14px}.permission-explanation p{margin:0;font-size:12px;line-height:1.7;color:var(--muted)}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:22px}.stat-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);min-height:88px;padding:18px;display:flex;align-items:center;gap:14px;text-align:left;transition:transform .25s var(--ease),box-shadow .25s,border-color .2s}.stat-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#cddcb7}.stat-icon{width:42px;height:42px;border-radius:12px}.stat-icon .icon{width:19px;height:19px}.lavender{background:#f0edfa;color:#8a73b8}.green{background:#e9f2de;color:#6f9448}.peach{background:#faefe5;color:#c0905f}.blue{background:#e8f0f6;color:#6f9bb8}.stat-copy{display:flex;flex-direction:column;gap:8px}.stat-copy>span{font-size:12px;color:var(--muted)}.stat-copy strong{font-size:24px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}.stat-copy small{font-size:12px;font-weight:400;color:var(--muted);margin-left:5px}.stat-caption{display:none}

/* files */
.files-section{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}.files-heading{padding:20px 22px 14px;display:flex;align-items:center;justify-content:space-between}.files-title{display:flex;align-items:center;gap:10px}.files-title h2{font-size:16px;font-weight:600;margin:0}.files-title>span{border-radius:6px;background:var(--accent-soft);color:var(--accent);font-size:12px;padding:3px 8px}.files-actions{display:flex;gap:8px}.small-button{padding:8px 14px;font-size:12px;border-radius:9px}.small-button .icon{width:14px;height:14px}
.file-toolbar{display:flex;align-items:center;justify-content:space-between;padding:0 22px 14px;gap:14px;border-bottom:1px solid var(--line)}.type-filters{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.type-filter{display:flex;align-items:center;gap:6px;border-radius:8px;padding:7px 12px;font-size:12px;color:var(--muted);white-space:nowrap;transition:background .2s,color .2s}.type-filter .icon{width:13px;height:13px}.type-filter:hover{background:var(--soft);color:var(--ink2)}.type-filter.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.view-controls{display:flex;align-items:center;gap:6px}.sort-select{position:relative;display:flex;align-items:center;margin-right:6px}.sort-select select{appearance:none;font-size:12px;color:var(--ink2);border:0;background:transparent;padding:6px 20px 6px 6px;cursor:pointer;outline-offset:0}.sort-select select option{color:#222;background:#fff}.sort-select>[data-icon]{position:absolute;right:2px;pointer-events:none;color:var(--muted)}.sort-select .icon{width:12px;height:12px}.toolbar-divider{height:16px;width:1px;background:var(--line);margin-right:4px}.view-button{padding:7px;border-radius:8px;display:flex;color:var(--muted);transition:background .2s,color .2s}.view-button:hover{background:var(--soft)}.view-button.active{color:var(--accent);background:var(--accent-soft)}.view-button .icon{width:16px;height:16px}
.file-content{animation:fade-in .3s ease both}.file-table{width:100%;border-collapse:collapse;table-layout:fixed}.file-table th{font-weight:500;font-size:12px;color:var(--muted);text-align:left;height:38px;background:var(--soft);border-bottom:1px solid var(--line)}.file-table th:first-child,.file-table td:first-child{width:46px;text-align:center;padding-left:12px}.file-table th:nth-child(2){width:34%}.file-table th:nth-child(3){width:11%}.file-table th:nth-child(4){width:15%}.file-table th:nth-child(5){width:10%}.file-table th:nth-child(6){width:14%}.file-table th:last-child{width:92px}.file-table td{height:66px;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}.file-table tbody tr{transition:background .15s}.file-table tbody tr:last-child td{border-bottom:0}.file-table tbody tr:hover{background:var(--soft)}.file-table tbody tr.selected{background:var(--accent-soft)}.file-table input[type=checkbox]{appearance:none;width:16px;height:16px;border:1.5px solid var(--line);border-radius:5px;cursor:pointer;vertical-align:middle;background:var(--surface);display:inline-grid;place-content:center;transition:background .15s,border-color .15s}.file-table input[type=checkbox]:hover{border-color:var(--accent)}.file-table input[type=checkbox]:checked,.file-table input[type=checkbox]:indeterminate{background:var(--accent);border-color:var(--accent)}.file-table input[type=checkbox]:checked:after{content:'✓';font-size:11px;color:#fff;font-weight:700}.file-table input[type=checkbox]:indeterminate:after{content:'';width:8px;height:2px;background:#fff;border-radius:1px}
.file-name-cell{display:flex;align-items:center;gap:12px;min-width:0;padding-right:12px}.file-icon{height:36px;width:30px;border-radius:6px;position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.file-icon:before{position:absolute;top:0;right:0;content:'';border-top:7px solid #fff9;border-left:7px solid transparent}.file-icon>.icon{height:16px;width:16px;stroke-width:1.5}.file-icon.pdf{background:#fcefea;color:#d08868}.file-icon.image{background:#eaf2df;color:#86a85c}.file-icon.document{background:#e6eef9;color:#7a9bcb}.file-icon.sheet{background:#e5f2ea;color:#6aa583}.file-icon.other{background:#f0ebf8;color:#9c85bb}.file-icon.video{background:#f3e9f6;color:#a883b8}.file-icon.audio{background:#faeedf;color:#c1955f}.file-icon.folder{background:#f7efd7;color:#c2a548;width:36px;height:30px;border-radius:5px}.file-title{display:flex;flex-direction:column;gap:4px;overflow:hidden;align-items:flex-start}.file-title>button{font-size:13px;font-weight:500;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;max-width:100%;padding:0;line-height:1.5;color:var(--ink);text-align:left;transition:color .15s}.file-title>button:hover{color:var(--accent)}.file-title>span{font-size:11px;color:var(--muted)}.owner-label{display:flex;align-items:center;gap:6px}.owner-label:before{content:'';width:5px;height:5px;background:#b9c9a4;border-radius:50%}.file-date,.file-size{font-variant-numeric:tabular-nums;white-space:nowrap}
.share-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;padding:4px 8px;border-radius:6px;white-space:nowrap}.share-badge .icon{height:11px;width:11px}.share-badge.public{background:#e9f2de;color:#5f8a3c}.share-badge.protected{background:#f8f0dc;color:#a4812f}.share-badge.private{background:var(--soft);color:var(--muted)}.file-actions{display:flex;align-items:center;gap:6px}.file-actions button{display:flex;padding:6px;color:var(--muted);border-radius:7px;transition:background .15s,color .15s}.file-actions button:hover{background:var(--accent-soft);color:var(--accent)}.file-actions .icon{height:16px;width:16px}
.table-footer{padding:13px 22px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.table-footer>span:last-child,.page-footer{display:none}.loading-state,.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;min-height:280px;color:var(--muted);font-size:13px}.empty-state>span{display:flex;align-items:center;justify-content:center;background:var(--accent-soft);border-radius:22px;width:68px;height:68px;color:var(--accent)}.empty-state .icon{height:28px;width:28px;stroke-width:1.4}.empty-state h3{font-size:16px;margin:0;color:var(--ink);font-weight:600}.empty-state p{font-size:13px;margin:0 0 4px;color:var(--muted);text-align:center;line-height:1.7}
.file-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:20px}.grid-file{border:1px solid var(--line);border-radius:12px;padding:16px;position:relative;background:var(--surface);transition:transform .25s var(--ease),box-shadow .25s,border-color .2s}.grid-file:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#cddcb7}.grid-file .file-icon{height:56px;width:46px;margin:6px 0 18px}.grid-file .file-icon>.icon{height:26px;width:26px}.grid-file .file-title>button{font-size:13px}.grid-file>.grid-file-meta{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-top:14px}.grid-file .file-actions{position:absolute;right:8px;top:10px;gap:2px}.folder-path{padding:12px 22px;border-bottom:1px solid var(--line);display:flex;gap:8px;align-items:center;font-size:12px;color:var(--muted)}.folder-path button{color:var(--accent);padding:2px 4px;border-radius:5px}.folder-path button:hover{background:var(--accent-soft)}.selection-bar{display:flex;align-items:center;justify-content:space-between;background:var(--accent-soft);border-bottom:1px solid var(--line);padding:11px 22px;font-size:13px;color:var(--accent);animation:fade-in .2s ease}.selection-bar>div{display:flex;gap:16px}.selection-bar button{padding:0;font-size:12px;color:var(--accent);font-weight:500}.selection-bar button:hover{text-decoration:underline}

/* overlays */
.modal-backdrop{position:fixed;inset:0;z-index:100;background:#101a1280;backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:24px;animation:fade-in .2s ease}.modal{position:relative;width:min(100%,440px);border:1px solid var(--line);background:var(--surface);border-radius:18px;box-shadow:0 30px 90px #0a140533;padding:30px;animation:pop .28s var(--ease);max-height:90vh;overflow:auto}.modal-close{position:absolute;right:14px;top:14px;padding:7px;border-radius:8px;color:var(--muted);display:flex;transition:background .2s,color .2s}.modal-close:hover{background:var(--accent-soft);color:var(--accent)}.modal-close .icon{width:17px;height:17px}.modal-symbol{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--accent-soft);border-radius:13px;color:var(--accent);margin-bottom:16px}.modal-symbol .icon{width:21px;height:21px}.modal h2{font-size:20px;margin:0 0 8px;font-weight:650}.modal-description{font-size:13px;color:var(--muted);line-height:1.7;margin:0 0 22px}
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.field>label{font-size:13px;color:var(--ink2);display:flex;justify-content:space-between;gap:6px}.field>label>span{font-size:12px;color:var(--muted)}.field input,.field select{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:10px;color:var(--ink);background:var(--soft);outline:0;font-size:14px;transition:border-color .2s,box-shadow .2s}.field input::placeholder{color:var(--muted)}.field input:focus,.field select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:var(--surface)}.field-error{color:var(--danger);font-size:12px;line-height:1.6;min-height:0}.field-error:not(:empty){margin-bottom:14px}.modal .full-width{width:100%;padding:12px;font-size:14px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.modal-info{display:flex;align-items:center;gap:12px;border:1px solid var(--line);background:var(--soft);border-radius:12px;padding:14px;margin:16px 0}.modal-info>div{min-width:0}.modal-info strong{display:block;font-size:13px;color:var(--ink);overflow-wrap:anywhere;font-weight:500}.modal-info small{display:block;font-size:12px;color:var(--muted);margin-top:4px}.field-inline{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0}.field-inline label{font-size:14px;color:var(--ink)}.field-inline small{display:block;font-size:12px;color:var(--muted);margin-top:4px}.link-result{background:var(--accent-soft);border-radius:12px;padding:14px;margin-top:16px}.link-result p{font-size:12px;color:var(--ink2);line-height:1.7;overflow-wrap:anywhere;margin:0 0 12px}.danger{background:var(--danger-soft);color:var(--danger);border:1px solid transparent}.danger:hover:not(:disabled){filter:brightness(.97)}.help-content{color:var(--ink2);font-size:13px;line-height:1.9}.help-content strong{color:var(--ink);font-weight:600}.help-content ol{padding-left:18px;margin:0}.help-content p{margin:8px 0}.hint-box{border-radius:10px;background:var(--soft);padding:12px;color:var(--muted);font-size:12px;line-height:1.7;margin-top:16px}
.toast-stack{position:fixed;right:24px;bottom:24px;z-index:200;display:flex;flex-direction:column;gap:10px}.toast{display:flex;align-items:center;gap:10px;max-width:min(420px,calc(100vw - 40px));background:#2b3b26;color:#eef5e4;padding:13px 18px;border-radius:12px;box-shadow:0 10px 30px #0a140540;font-size:13px;line-height:1.6;animation:slide-in .3s var(--ease)}.toast .icon{height:17px;width:17px;flex-shrink:0;color:#c5df99}.toast.error{background:var(--danger-soft);color:var(--danger);border:1px solid #e9c9bb}.toast.error .icon{color:var(--danger)}
.drop-overlay{position:fixed;inset:12px;z-index:90;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(6px);border:2px dashed var(--accent);border-radius:22px;text-align:center;color:var(--accent);pointer-events:none;animation:fade-in .15s ease}.drop-overlay [data-icon]{padding:22px;background:var(--accent-soft);border-radius:24px;animation:float 3s ease-in-out infinite}.drop-overlay .icon{height:48px;width:48px;stroke-width:1.3}.drop-overlay h2{margin:22px 0 8px;font-size:26px;font-weight:600}.drop-overlay p{font-size:13px;color:var(--muted);margin:0}
.upload-panel{position:fixed;bottom:24px;right:24px;z-index:95;width:320px;border:1px solid var(--line);border-radius:14px;padding:18px;background:var(--surface);box-shadow:0 14px 50px #0a140533;animation:slide-in .3s var(--ease)}.upload-panel h3{margin:0 0 12px;font-size:14px;color:var(--ink);display:flex;align-items:center;gap:8px}.upload-panel h3 .icon{width:16px;height:16px;color:var(--accent)}.upload-panel p{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0 0 10px}.upload-progress{height:5px;border-radius:5px;background:var(--accent-soft);overflow:hidden}.upload-progress>span{display:block;height:100%;background:var(--accent);border-radius:5px;transition:width .2s}.upload-panel small{display:block;margin-top:10px;font-size:12px;color:var(--muted)}.spinner{width:24px;height:24px;display:inline-block;border:2.5px solid var(--accent-soft);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}.loader{width:40px;height:40px;border-radius:50%;background:conic-gradient(from 0deg,transparent 12%,var(--accent));-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));animation:spin .9s linear infinite}
.skeleton{padding:2px 0}.skeleton-row{display:flex;align-items:center;gap:14px;height:66px;padding:0 22px;border-bottom:1px solid var(--line);animation:rise .45s var(--ease) both}.skeleton-row:last-child{border-bottom:0}.skeleton-row:nth-child(2){animation-delay:.04s}.skeleton-row:nth-child(3){animation-delay:.08s}.skeleton-row:nth-child(4){animation-delay:.12s}.skeleton-row:nth-child(5){animation-delay:.16s}.skeleton-row:nth-child(6){animation-delay:.2s}.sk{display:block;flex-shrink:0;border-radius:6px;background:linear-gradient(90deg,var(--line) 25%,var(--sk-hi) 37%,var(--line) 63%);background-size:400% 100%;animation:shimmer 1.5s ease-in-out infinite}.sk-check{width:16px;height:16px;border-radius:5px}.sk-icon{width:30px;height:36px}.sk-lines{display:flex;flex:1;min-width:0;flex-direction:column;gap:7px}.sk-title{width:46%;height:10px;border-radius:4px}.sk-sub{width:24%;height:8px;border-radius:4px;opacity:.65}.sk-col{width:58px;height:9px;border-radius:4px;opacity:.8}.sk-badge{width:66px;height:20px}.sk-dots{width:42px;height:14px;border-radius:5px}.skeleton-row:nth-child(2n) .sk-title{width:34%}.skeleton-row:nth-child(3n) .sk-title{width:56%}.skeleton-row:nth-child(2n) .sk-sub{width:16%}.skeleton-row:nth-child(3n) .sk-sub{width:30%}@media(max-width:1000px){.skeleton-row .sk-col:nth-of-type(4){display:none}}@media(max-width:620px){.sk-col,.sk-badge{display:none}.skeleton-row{padding:0 14px;gap:10px}}
.file-menu{position:fixed;z-index:80;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:5px;box-shadow:0 14px 40px #0a14052e;min-width:156px;animation:pop .18s var(--ease);transform-origin:top right}.file-menu button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:9px 12px;border-radius:8px;color:var(--ink2);font-size:13px;transition:background .15s}.file-menu button:hover{background:var(--accent-soft);color:var(--accent)}.file-menu button .icon{height:15px;width:15px}.file-menu button.danger-text{color:var(--danger)}.file-menu button.danger-text:hover{background:var(--danger-soft);color:var(--danger)}
.shared-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:30px;background:radial-gradient(ellipse at 50% 25%,color-mix(in srgb,var(--accent-soft) 90%,var(--bg)),var(--bg) 72%)}.shared-shell{width:min(100%,420px);text-align:center;animation:rise .5s var(--ease) both}.shared-shell>.brand{color:var(--ink);justify-content:center;margin:0 0 32px}.shared-shell .brand-mark i{background:#8fb866}.shared-card{padding:34px 30px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:var(--shadow)}.shared-card>.file-icon{width:54px;height:64px;margin-bottom:18px}.shared-card>.file-icon>.icon{width:26px;height:26px}.shared-card h1{font-size:19px;line-height:1.6;overflow-wrap:anywhere}.shared-card>p{font-size:13px;color:var(--muted);line-height:1.8;margin:10px 0 24px}.shared-card .field{text-align:left}.shared-shell>.shared-footer{display:none}.back-home{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--muted);margin-top:20px;transition:color .2s}.back-home:hover{color:var(--accent)}.back-home .icon{width:14px;height:14px}.download-success{padding:12px;font-size:13px;line-height:1.7;color:var(--accent);background:var(--accent-soft);border-radius:10px;margin-top:14px}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes slide-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes shimmer{0%{background-position:100% 50%}100%{background-position:0 50%}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* responsive */
@media(max-width:1200px){:root{--sidebar:212px}.topbar{padding-inline:28px}main{padding:28px 28px 24px}.overview{grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);gap:14px}.hero-copy{padding-left:28px}.hero-copy h2{font-size:30px}.hero-art{right:-14px;width:50%}.stat-card{padding:15px;gap:11px}.file-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.search-box{min-width:230px}}
@media(max-width:1000px){:root{--sidebar:196px}.brand{font-size:20px;gap:10px}.nav-item{padding:0 11px;gap:10px;font-size:13px}.topbar{padding-inline:22px}.search-box{min-width:190px}.search-box kbd{display:none}main{padding:24px 22px 20px}.overview{grid-template-columns:minmax(0,1fr)}.hero-card{min-height:220px}.stats-grid{gap:10px}.stat-icon{width:36px;height:36px;border-radius:10px}.stat-card{padding:14px;min-height:80px}.stat-copy strong{font-size:21px}.file-table th:nth-child(3),.file-table td:nth-child(3){display:none}.file-table th:nth-child(2){width:40%}.file-table th:nth-child(4){width:19%}.file-table th:nth-child(5){width:13%}.file-table th:nth-child(6){width:17%}.type-filter .icon{display:none}}
@media(max-width:800px){:root{--sidebar:0px}.sidebar{width:240px;transform:translateX(-100%);transition:transform .3s var(--ease);box-shadow:12px 0 50px #0a140540}.sidebar.open{transform:none}.mobile-menu{display:inline-flex;margin-left:-6px}.topbar-left{display:flex;align-items:center;gap:10px}.topbar{padding-inline:18px;height:62px}.topbar-separator{display:none}main{padding:22px 18px 18px}h1{font-size:25px}.stat-card{gap:10px}.file-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.workspace-path{display:none}.topbar-right{flex:1;justify-content:flex-end;gap:8px}.search-box{margin-right:auto;min-width:0;flex:1;max-width:260px}.topbar-right>.icon-button{display:none}.role-button{font-size:12px;padding:7px 8px}main{padding:18px 14px 16px}.page-heading{margin-bottom:18px}h1{font-size:23px}.date-label{display:none}.hero-card{min-height:210px}.hero-copy{padding:24px 0 22px 22px;min-width:0}.hero-copy h2{font-size:26px;margin-bottom:20px}.hero-art{width:44%;right:-24px;opacity:.55}.hero-actions{flex-wrap:wrap}.hero-actions .button{padding:10px 14px}.permission-card{padding:18px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:18px}.stat-card{padding:14px;min-height:76px}.stat-icon{width:34px;height:34px}.stat-copy strong{font-size:20px}.files-heading{padding:16px 14px 12px}.files-actions .outline{padding:8px}.files-actions .outline>span:last-child{display:none}.file-toolbar{padding:0 12px 12px;flex-wrap:wrap;gap:8px}.type-filters{gap:2px;flex:1}.type-filter{padding:7px 9px}.view-controls{margin-left:auto}.file-table th:nth-child(4),.file-table td:nth-child(4),.file-table th:nth-child(5),.file-table td:nth-child(5){display:none}.file-table th:first-child,.file-table td:first-child{width:36px;padding-left:8px}.file-table th:nth-child(2){width:56%}.file-table th:nth-child(6){width:24%}.file-table th:last-child{width:70px}.file-name-cell{gap:9px;padding-right:4px}.file-actions{gap:2px}.file-actions button{padding:5px}.share-badge{padding:4px 6px}.table-footer{padding:12px 14px}.file-grid{padding:12px;gap:10px}.grid-file{padding:12px}.selection-bar{padding:11px 14px;gap:8px}.selection-bar>div{gap:10px}.modal-backdrop{padding:14px}.modal{padding:26px 22px;border-radius:16px}.toast-stack{right:14px;bottom:14px}.upload-panel{bottom:14px;right:14px;width:calc(100% - 28px);max-width:320px}.shared-page{padding:20px}.shared-card{padding:28px 22px}}


/* Download tasks stay visible on both the workspace and standalone share pages. */
.download-panel{position:fixed;right:24px;top:94px;z-index:150;width:360px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 120px);display:flex;flex-direction:column;background:#fff;border:1px solid #dce7cf;border-radius:14px;box-shadow:0 12px 48px #283b1b24;padding:18px;text-align:left;color:var(--ink)}
.download-panel>header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px}.download-panel h3{display:flex;align-items:center;gap:8px;font-size:13px;margin:0;font-weight:600}.download-panel h3 .icon{width:17px;height:17px;color:#7b965b}.download-task-count{font-size:10px;color:#91a180}.download-tasks{overflow:auto;overscroll-behavior:contain}.download-task{padding:15px 0;border-bottom:1px solid #edf1e7}.download-task-heading{display:flex;align-items:center;gap:10px}.download-task-heading strong{font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;font-weight:500}.download-cancel{padding:4px;border-radius:5px;color:#98a68b;display:flex}.download-cancel:hover{background:#f0f5e7;color:#617c46}.download-cancel .icon{width:14px;height:14px}.download-task-meta,.download-task-details{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;font-variant-numeric:tabular-nums}.download-task-meta{margin:9px 0;color:#82956e}.download-state{line-height:1.6;overflow-wrap:anywhere}.download-percent{flex-shrink:0}.download-meter{height:5px;border-radius:6px;background:#edf2e5;overflow:hidden}.download-meter>span{display:block;width:0;height:100%;border-radius:6px;background:#9cba76;transition:width .1s linear}.download-meter.indeterminate>span{width:35%;animation:download-indeterminate 1.3s ease-in-out infinite}.download-task-details{color:#9aa88c;margin-top:9px;font-size:9px}.download-task[data-status=error] .download-state{color:#b87861}.download-task[data-status=error] .download-meter>span{background:#d3a28f}.download-task[data-status=cancelled] .download-state{color:#929b88}.download-task[data-status=cancelled] .download-meter>span{background:#bfc8b5}.download-panel-note{font-size:9px;line-height:1.8;margin:12px 0 0;color:#a0ac93}@keyframes download-indeterminate{from{transform:translateX(-100%)}to{transform:translateX(390%)}}
@media(max-width:620px){.download-panel{top:auto;bottom:14px;right:14px;width:calc(100% - 28px);max-height:52dvh;padding:16px}.download-task{padding:12px 0}}
@media(prefers-reduced-motion:reduce){.download-meter.indeterminate>span{animation:none}.download-meter>span{transition:none}}