/* 極簡版面：讓搜尋、篩選與文檔成為視覺主體。 */
:root{--paper:#fff;--ink:#303630;--muted:#8a9088;--line:#eceee9;--green:#294b3b;--shadow:none;background:#fff}
[hidden]{display:none!important}
.demo-banner{height:30px;background:#f7f8f5;border-color:var(--line);color:#8a9184;font-size:10px;padding:0 24px;position:sticky;top:0;z-index:30}
.demo-banner button{font-size:10px;text-decoration:none;color:#66755f}
.demo-banner svg{width:12px;height:12px}
.sidebar{width:200px;top:30px;padding:28px 15px 19px;border-color:var(--line)}
.brand{gap:8px;padding:0 10px 30px}
.brandmark{width:27px;height:34px;color:var(--green);background:none;border-radius:0}
.brandmark svg{width:25px;height:25px}
.brand strong{font-size:17px;letter-spacing:1px}
.brand small{font-size:10px;letter-spacing:0;color:#a1a79b;margin-top:5px}
.nav-item{font-size:12px;padding:11px 13px;border-radius:5px;gap:10px;margin-bottom:4px}
.nav-item.active{background:#f1f4ed;color:var(--green);font-weight:500}
.nav-item .count{background:none;padding:0;color:#8c9984;font-size:10px}
.nav-item svg{width:17px;height:17px}
.profile{padding:16px 5px 0;border-color:var(--line)}
.profile strong{font-size:11px}
.profile small{font-size:10px}
.avatar{background:#eef1e8;color:#68775a}
.main{margin-left:200px;min-height:calc(100vh - 30px)}
.topbar{height:66px;padding:0 40px;border:0;background:#fff;gap:12px}
.topbar-name{font-size:11px;color:#a0a79a}
.topbar-actions{margin-left:auto;gap:12px}
.topbar-actions .avatar-button{width:30px;height:30px;font-size:11px}
.content{max-width:1100px;margin:0 auto;padding:16px 40px 50px}
.page-heading{align-items:center;margin:0 0 25px;gap:15px;min-height:37px}
.page-heading h1{font-size:24px;font-weight:500;letter-spacing:0;line-height:1.5;margin:0}
.page-heading .text-button{font-size:11px;color:#929b88;padding-right:0}
.page-heading .text-button svg{width:12px;height:12px}
.primary,.secondary,.danger{border-radius:6px;font-weight:500}
.primary.small{padding:9px 12px;font-size:11px}
.primary.small svg{width:15px;height:15px}
.text-button{font-size:11px;font-weight:400}
.library-search{display:flex;align-items:center;gap:11px;padding:13px 15px;border:1px solid #e5e9df;border-radius:6px;color:#9ba592;background:#fff}
.library-search:focus-within{border-color:#a3b594;box-shadow:0 0 0 2px #dce5d32b}
.library-search>svg{width:17px;height:17px}
.library-search input{border:0;border-radius:0;background:none;padding:0;outline:none;font-size:13px;line-height:1.7;width:100%}
.library-search input:focus{outline:none}
.subject-tabs{margin:23px 0 0;gap:26px;border-bottom:1px solid var(--line);padding:0;overflow-x:auto}
.subject-tab{border:0;border-bottom:2px solid transparent;border-radius:0;background:none;font-size:12px;padding:11px 1px;color:#939b8d;gap:5px;line-height:1.7}
.subject-tab:hover{color:var(--ink)}
.subject-tab.active{background:none;color:var(--green);border-color:var(--green);font-weight:500}
.subject-tab svg{width:11px;height:11px;opacity:.6}
.filter-row{gap:10px;flex-wrap:nowrap;margin:0;padding:13px 0;border-bottom:1px solid var(--line);font-size:10px}
.filter-row select{font-size:10px;border:0;border-radius:4px;padding:5px 4px;background:#fff;color:#78836e;max-width:118px;cursor:pointer}
.filter-row .results-count{font-size:10px;color:#a1a895}
.clear-filters{font-size:10px;padding:5px 2px;color:#88957a}
.document-list{display:flex;flex-direction:column}
.document-row{display:flex;align-items:center;gap:15px;padding:22px 0;border-bottom:1px solid var(--line);min-width:0;min-height:91px}
.document-icon{display:grid;place-items:center;flex-shrink:0;width:37px;height:43px;background:#f8f9f6;color:#9aa68e;border:1px solid #eef0e8;border-radius:4px}
.document-icon svg{width:19px;height:19px;stroke-width:1.4}
.document-icon:hover{color:var(--green);background:#f1f5eb}
.document-info{flex:1;min-width:0}
.document-title{display:block;font-size:14px;font-weight:450;padding:0;text-align:left;line-height:1.7;overflow-wrap:anywhere}
.document-title:hover{color:#688251}
.document-title:focus-visible{outline-offset:3px}
.document-meta{display:flex;align-items:center;flex-wrap:wrap;gap:7px;font-size:10px;color:#737e6a;line-height:1.8;margin-top:5px}
.document-meta span+span::before{content:'·';color:#c1c8b8;padding-right:7px}
.document-date{font-size:10px;color:#7c8871;flex-shrink:0}
.document-row>.icon-button{width:30px;height:32px;color:#a7b09c;border-radius:4px}
.document-row>.icon-button svg{width:15px;height:15px;stroke-width:1.5}
.document-row>.icon-button:hover{background:#f5f7ef}
.is-favorite{color:#738956!important}
.is-favorite svg{fill:#edf2e3}
.empty-state{border:0;background:#fff;padding:65px 20px;border-radius:0}
.empty-state>svg{width:29px;height:29px;color:#b8c0ab}
.empty-state h3{font-size:14px;font-weight:400}
.empty-state p{font-size:11px;line-height:1.9}
.upload-panel{display:flex;align-items:center;gap:10px;border:1px dashed #d8dfce;background:#fbfcf9;border-radius:6px;margin:0 0 24px;padding:15px;line-height:1.8}
.upload-panel>svg{width:17px;height:17px;color:#94a383}
.upload-panel>span{font-size:12px;color:#75856a}
.upload-panel>small{font-size:10px;color:#a0aa93;margin-left:auto}
.panel{border:0;border-radius:0;box-shadow:none}
.panel-header{padding:0 0 15px;border-bottom:1px solid var(--line)}
.panel-summary{font-size:11px;color:#929c86;line-height:1.9}
.panel-header input{font-size:11px;padding:9px 11px;border-radius:5px}
th{background:#fafbf8;color:#a2aa97;font-size:10px;padding:12px 14px}
td{padding:17px 14px;border-color:var(--line);font-size:11px}
td strong{font-size:12px;font-weight:400}
.table-title{gap:10px}
.table-title .subject-symbol{background:#f5f7f0;color:#8c9c7c;border-radius:4px;width:30px;height:36px}
.table-title .subject-symbol svg{width:17px;height:17px}
.table-title .avatar{width:30px;height:30px;border-radius:50%}
.pill{background:#f2f5eb;border-radius:4px;font-size:9px;font-weight:400;padding:4px 7px}
.preview-note{font-size:10px;color:#a7ad9c;line-height:1.8;margin:20px 0 0}
.modal{border-radius:10px;box-shadow:0 14px 60px #193e321a}
.modal-header h2{font-size:16px;font-weight:500}
.modal-backdrop{background:#20332145;backdrop-filter:blur(2px)}
.avatar-storage-note{background:#f8faf4}
.login-page{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 30px);padding:50px 24px;background:#fff}
.login-form-wrap{display:flex;justify-content:center;padding:0;width:100%}
.login-form{width:340px;max-width:100%}
.login-form>.brand{padding:0;margin:0 0 38px;justify-content:flex-start}
.login-form h2{font-size:23px;font-weight:500;margin:0 0 10px}
.login-form>p{font-size:12px;line-height:1.8;margin-bottom:27px}
.demo-accounts{font-size:10px;color:#a4ad98}
.demo-accounts button{font-size:10px;border-radius:5px}
.login-help{font-size:10px}
@media(max-width:950px){.content{padding:16px 28px 40px}.topbar{padding:0 28px}.upload-panel{flex-wrap:wrap}.upload-panel>small{margin-left:27px;flex-basis:100%}}
@media(max-width:650px){
  .demo-banner{padding:0 20px;height:30px;font-size:9px}
  .demo-banner button{font-size:9px}
  .sidebar{width:214px;top:30px;padding-top:26px}
  .main{margin-left:0}
  .topbar{height:59px;padding:0 20px;gap:8px}
  .topbar .mobile-menu{margin-left:-6px}
  .topbar-name{font-size:11px;color:#8e9982}
  .topbar-actions .avatar-button{width:29px;height:29px}
  .content{padding:18px 22px 35px}
  .page-heading{margin-bottom:22px;min-height:32px}
  .page-heading h1{font-size:22px}
  .page-heading .text-button{font-size:10px}
  .library-search{padding:12px}
  .library-search input{font-size:12px}
  .subject-tabs{margin:19px 0 0;gap:22px}
  .subject-tab{font-size:11px;padding:10px 0}
  .filter-row{padding:11px 0;gap:9px}
  .filter-row select{font-size:10px;max-width:100px}
  .document-row{padding:20px 0;gap:12px;min-height:87px}
  .document-title{font-size:12px;line-height:1.8}
  .document-icon{width:31px;height:38px}
  .document-icon svg{width:17px;height:17px}
  .document-meta{font-size:9px;gap:5px;line-height:1.9;margin-top:4px}
  .document-meta span+span::before{padding-right:5px}
  .document-date{font-size:9px}
  .document-row>.icon-button{width:25px;height:30px}
  .document-row>.icon-button svg{width:14px;height:14px}
  .primary.small{font-size:10px;padding:8px 11px}
  .upload-panel{padding:13px;gap:8px;margin-bottom:22px}
  .upload-panel>span{font-size:11px}
  .upload-panel>small{font-size:9px;margin-left:25px}
  .panel-header{gap:12px;align-items:center}
  .panel-summary{font-size:10px}
  .panel-header input{max-width:155px;font-size:10px}
  th{padding:12px}
  td{padding:15px 12px}
  .login-page{padding:40px 26px}
  .login-form>.brand{margin-bottom:34px}
  .login-form h2{font-size:22px}
}
@media(max-width:380px){.subject-tabs{gap:18px}.document-row{gap:9px}.document-date{display:none}.clear-filters{font-size:9px}.filter-row{gap:7px}}
