:root{
  --bg:#f3f7fb;
  --paper:#ffffff;
  --line:#b8c7d9;
  --head:#eef5fb;
  --side:#0f172a;
  --side2:#172033;
  --text:#172033;
  --muted:#64748b;
  --accent:#0f766e;
  --accent2:#115e59;
  --ok:#15803d;
  --bad:#b91c1c;
  --warn:#a16207;
  --soft:#f8fafc;
}
*{box-sizing:border-box;min-width:0}
html,body{margin:0;width:100%;max-width:100%;overflow-x:hidden}
html{scroll-behavior:smooth}
body{
  background:linear-gradient(90deg,var(--side) 0 280px,var(--bg) 280px);
  color:var(--text);
  font-family:Arial,Helvetica,sans-serif;
  font-size:14px;
  line-height:1.45;
}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent2);text-decoration:underline}
button,input,select{font:inherit}
.shell{
  min-height:100vh;
  display:grid;
  grid-template-columns:280px minmax(0,1fr);
  align-items:stretch;
  background:linear-gradient(90deg,var(--side) 0 280px,var(--bg) 280px);
}
.sidebar{
  min-height:100vh;
  height:100%;
  align-self:stretch;
  padding:16px 13px;
  color:#e5edf6;
  background:var(--side);
  border-right:1px solid #26354f;
}
.brand{
  margin-bottom:12px;
  color:#cbd5e1;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.module-title{
  margin:0 0 8px;
  color:#ffffff;
  font-size:25px;
  font-weight:700;
  line-height:1.1;
}
.module-sub{
  margin-bottom:14px;
  color:#cbd5e1;
  font-size:12px;
  line-height:1.35;
}
.status-box{
  margin-bottom:12px;
  padding:12px;
  color:#e5edf6;
  background:var(--side2);
  border:1px solid #26354f;
}
.status-label{
  margin-bottom:5px;
  color:#cbd5e1;
  font-size:11px;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.status-main{
  color:#ffffff;
  font-size:24px;
  font-weight:700;
}
.status-small{
  margin-top:4px;
  color:#cbd5e1;
  font-size:12px;
}
.side-section{margin-top:16px}
.side-title{
  margin-bottom:6px;
  color:#cbd5e1;
  font-size:11px;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.folder-link,.filter-link,.backend-link{
  display:block;
  margin-bottom:4px;
  padding:7px 8px;
  overflow-wrap:anywhere;
  color:#dbeafe;
  background:#111c31;
  border:1px solid #26354f;
  font-size:12px;
  line-height:1.25;
}
.folder-link:hover,.filter-link:hover,.backend-link:hover{
  color:#ffffff;
  background:#172a46;
  border-color:#2dd4bf;
  text-decoration:none;
}
.folder-link.active,.filter-link.active{
  color:#0f172a;
  background:#e0f2fe;
  border-color:#7dd3fc;
  font-weight:700;
}
.folder-link .all-icon{
  min-width:30px;
  margin-right:6px;
  padding:1px 5px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#ffffff;
  background:var(--accent);
  border:1px solid #14b8a6;
  font-size:10px;
  font-weight:700;
}
.folder-link .folder-icon{
  display:inline-block;
  min-width:18px;
  margin-right:7px;
  color:#d97706;
  font-size:13px;
  vertical-align:-1px;
}
.backend-link{
  margin-top:12px;
  text-align:center;
  font-weight:700;
}
.author-box{
  margin-top:16px;
  padding:10px;
  color:#cbd5e1;
  background:var(--side2);
  border:1px solid #26354f;
  font-size:12px;
  line-height:1.45;
}
.author-box strong{color:#ffffff}
.main{padding:14px}
.paper{
  min-height:calc(100vh - 28px);
  color:var(--text);
  background:var(--paper);
  border:1px solid var(--line);
  box-shadow:0 1px 2px rgba(0,0,0,.08);
}
.topbar{
  padding:16px 18px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  background:var(--head);
  border-bottom:1px solid var(--line);
}
.topbar h1{
  margin:0 0 4px;
  color:#0f172a;
  font-size:24px;
}
.meta{
  color:var(--muted);
  font-size:13px;
  overflow-wrap:anywhere;
}
.top-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}
.btn,button{
  appearance:none;
  padding:7px 11px;
  display:inline-block;
  color:var(--text);
  background:#ffffff;
  border:1px solid #9fb4ca;
  border-radius:2px;
  cursor:pointer;
}
.btn:hover,button:hover{
  color:#0f172a;
  background:#e0f2fe;
  border-color:#38bdf8;
  text-decoration:none;
}
.primary{
  color:#ffffff!important;
  background:var(--accent)!important;
  border-color:var(--accent2)!important;
}
.primary:hover{
  color:#ffffff!important;
  background:var(--accent2)!important;
}
.content{padding:14px}
.searchbar{
  margin-bottom:14px;
  padding:12px;
  display:grid;
  grid-template-columns:minmax(220px,1fr) 190px 160px 150px auto auto;
  gap:8px;
  background:#ffffff;
  border:1px solid var(--line);
}
.searchbar input,.searchbar select{
  width:100%;
  padding:8px;
  color:var(--text);
  background:#ffffff;
  border:1px solid #9fb4ca;
}
.searchbar input:focus,.searchbar select:focus{
  border-color:#38bdf8;
  outline:2px solid rgba(56,189,248,.18);
}
.searchbar .btn{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.search-summary{
  margin:0 0 14px;
  padding:10px 12px;
  color:var(--muted);
  background:#ffffff;
  border:1px solid var(--line);
}
.search-summary strong{color:#0f172a}
.query-pill{
  margin:0 3px;
  padding:2px 7px;
  display:inline-block;
  color:var(--text);
  background:var(--soft);
  border:1px solid var(--line);
  font-size:12px;
}
.metric-grid{
  margin:0 0 14px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}
.metric-card{
  padding:10px;
  color:var(--text);
  background:var(--soft);
  border:1px solid var(--line);
}
.metric-card span{
  display:block;
  margin-bottom:5px;
  color:var(--muted);
  font-size:11px;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.metric-card strong{
  display:block;
  color:#0f172a;
  font-size:24px;
}
.section-block{
  margin:0 0 14px;
  background:#ffffff;
  border:1px solid var(--line);
}
.section-head{
  padding:9px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  background:var(--head);
  border-bottom:1px solid var(--line);
}
.section-head h2{
  margin:0;
  color:#0f172a;
  font-size:14px;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.section-meta{
  color:var(--muted);
  font-size:12px;
}
.folder-main-list{
  display:block;
  padding:8px;
}
.folder-card{
  min-height:0;
  margin-bottom:6px;
  display:grid;
  grid-template-columns:minmax(235px,1.05fr) minmax(330px,2.4fr) minmax(190px,.9fr);
  align-items:stretch;
  color:var(--text);
  background:#ffffff;
  border:1px solid var(--line);
}
.folder-card:last-child{margin-bottom:0}
.folder-card:hover{background:#f0f9ff}
.folder-card-head{
  padding:7px 12px;
  display:flex;
  align-items:center;
  gap:8px;
  background:var(--head);
  border-right:1px solid #d6e1ee;
}
.folder-card-icon{
  color:#d97706;
  font-size:16px;
}
.folder-card-title{
  color:#0f172a;
  font-size:14px;
  font-weight:700;
}
.folder-card-body{
  padding:7px 10px;
  display:flex;
  align-items:center;
}
.folder-stats{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:5px;
}
.folder-stat{
  padding:1px 5px;
  color:var(--text);
  background:var(--soft);
  border:1px solid var(--line);
  font-size:10px;
}
.folder-card-foot{
  padding:7px 9px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  white-space:nowrap;
  border-left:1px solid #d6e1ee;
}
.path{
  color:var(--muted);
  font-size:12px;
  overflow-wrap:anywhere;
}
.openlink{font-weight:700}
.file-list{display:block}
.file-row{
  display:grid;
  grid-template-columns:minmax(260px,1.25fr) minmax(320px,2.2fr) minmax(155px,.75fr);
  align-items:stretch;
  color:var(--text);
  background:#ffffff;
  border-bottom:1px solid #d6e1ee;
}
.file-row:nth-child(even){background:#f8fafc}
.file-row:hover{background:#f0f9ff}
.file-row:last-child{border-bottom:0}
.file-row-head{
  color:var(--text);
  background:var(--head);
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.file-row-head>div{padding:7px 10px}
.file-title-cell{
  padding:7px 10px;
  display:flex;
  align-items:flex-start;
  gap:8px;
  border-right:1px solid #d6e1ee;
}
.file-meta-cell{
  padding:7px 10px;
  border-right:1px solid #d6e1ee;
}
.file-action-cell{
  padding:7px 9px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  text-align:right;
  white-space:nowrap;
}
.type-badge{
  min-width:52px;
  padding:4px 6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--text);
  background:var(--soft);
  border:1px solid var(--line);
  font-size:11px;
  font-weight:700;
}
.file-title{
  color:#0f172a;
  font-size:13px;
  font-weight:700;
  line-height:1.25;
}
.file-title a{color:#0f172a}
.file-title a:hover{color:var(--accent2)}
.file-formula{
  margin:0 0 3px;
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  color:#153e63;
  font-family:Georgia,"Times New Roman",serif;
  font-size:14px;
  line-height:1.3;
}
.file-formula mjx-container{
  margin:0!important;
  max-width:100%;
}
.file-desc{
  max-height:2.7em;
  margin-bottom:4px;
  overflow:hidden;
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
}
.badges{
  margin:4px 0;
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}
.badge{
  padding:1px 5px;
  color:var(--text);
  background:var(--soft);
  border:1px solid var(--line);
  font-size:10px;
}
.badge.ok{
  color:#166534;
  background:#ecfdf5;
  border-color:#86efac;
}
.badge.warn{
  color:#92400e;
  background:#fffbeb;
  border-color:#fcd34d;
}
.pagination{
  padding:9px 10px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:5px;
  background:var(--head);
  border-top:1px solid var(--line);
}
.pagination .page-info{
  margin-right:auto;
  color:var(--muted);
  font-size:12px;
}
.pagination a,.pagination .page-current{
  min-width:30px;
  padding:5px 8px;
  color:var(--accent);
  background:#ffffff;
  border:1px solid var(--line);
  text-align:center;
}
.pagination a:hover{
  color:var(--accent2);
  background:#e0f2fe;
  text-decoration:none;
}
.pagination .page-current{
  color:#ffffff;
  background:var(--accent);
  border-color:var(--accent2);
  font-weight:700;
}
.empty{
  padding:28px;
  color:var(--muted);
  background:var(--soft);
  border:1px dashed var(--line);
  text-align:center;
}
.footer{
  padding:14px 18px;
  color:#4f5963;
  background:#ffffff;
  border-top:1px solid var(--line);
  font-size:12px;
  line-height:1.5;
}
.footer-grid{
  margin-bottom:12px;
  display:grid;
  grid-template-columns:1.2fr 1fr 1.2fr;
  gap:10px;
}
.footer-box{
  min-height:104px;
  padding:10px 12px;
  background:#ffffff;
  border:1px solid var(--line);
}
.footer-box h2{
  margin:0 0 7px;
  color:#0f172a;
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.footer-box p{margin:0 0 7px}
.footer-box p:last-child{margin-bottom:0}
.footer-box ul{margin:7px 0 0 18px;padding:0}
.footer-bottom{
  padding-top:10px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:.35rem;
  color:var(--muted);
  border-top:1px solid #dfe3e7;
}
.footer-sep{color:#9aa3ac}
@media(max-width:980px){
  .folder-card,.file-row{display:block}
  .folder-card-head,.file-title-cell,.file-meta-cell{
    border-right:0;
    border-bottom:1px solid #d6e1ee;
  }
  .folder-card-foot,.file-action-cell{
    justify-content:flex-start;
    text-align:left;
    border-left:0;
  }
  .file-row-head{display:none}
  .searchbar{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  body{background:var(--bg)}
  .shell{grid-template-columns:1fr;background:var(--bg)}
  .sidebar{min-height:auto;height:auto}
  .metric-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .searchbar{grid-template-columns:1fr}
  .metric-grid{grid-template-columns:1fr}
  .topbar{display:block}
  .top-actions{
    margin-top:10px;
    justify-content:flex-start;
  }
}
@media print{
  .sidebar,.searchbar,.top-actions,.pagination{display:none!important}
  .shell{display:block}
  .main{padding:0}
  .paper{border:0;box-shadow:none}
}