.app{height:100%;display:flex;flex-direction:column;min-width: 1040px}
.topbar{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;background:var(--surface);
  border-bottom:1px solid var(--border);
}
.brand{
  display:flex;align-items:center;gap:10px;
  font-weight:800;font-size:18px;margin-right:auto;
}
.brandmark{
  width:34px;height:34px;border-radius:12px;
  background: var(--primary);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-weight:900;
}
.search{width: 380px; max-width: 45vw}
.layout{display:flex;flex:1;min-height:0}
.sidebar{
  width: 320px;
  background: var(--surface);
  border-right:1px solid var(--border);
  padding:12px;
  overflow:auto;
}
.sidehead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.sidehead .title{font-weight:800}
.tree{display:flex;flex-direction:column;gap:4px}
.tnode{
  display:flex;align-items:center;gap:10px;
  padding:8px 10px;
  border-radius:12px;
  cursor:pointer;
  border: 1px solid transparent;
  user-select:none;
}
.tnode:hover{background:#f0f2f5}
.tnode.active{background: rgba(37,99,235,.10); border-color: rgba(37,99,235,.22)}
.tnode .twist{width:18px;display:flex;align-items:center;justify-content:center;color:var(--muted)}
.tmeta{display:flex;flex-direction:column;min-width:0;flex:1}
.ttitle{font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tsub{font-size:12px;color:var(--muted)}
.tactions{display:flex;gap:6px}
.iconbtn{
  width:32px;height:32px;border-radius:12px;
  padding:0;display:flex;align-items:center;justify-content:center;
}
.dropHint{
  outline: 2px dashed rgba(37,99,235,.35);
  outline-offset: 2px;
}
.content{flex:1;padding: 18px 18px;overflow:auto;min-height:0}
.card{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: var(--shadow);
  overflow:hidden;
}
.pagehead{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
}
.pagetitle{font-size: 22px;font-weight: 900;margin:0}
.pagedesc{font-size:12px;color:var(--muted);margin-top:6px}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.body{padding: 0}
.errorbar{
  background: rgba(180,35,24,.08);
  border-bottom: 1px solid rgba(180,35,24,.18);
  padding: 10px 14px;
  color: #7a1c12;
}
.breadcrumbs{font-size:12px;color:var(--muted)}
.breadcrumbs a{color:var(--muted)}
.foot{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding: 10px 14px;
  border-top: 1px solid var(--border);
  color: var(--muted);
  font-size: 12px;
  background: var(--surface2);
}
.notice{
  border:1px solid rgba(217,106,0,.25);
  background: rgba(217,106,0,.08);
  color:#7a3d00;
  padding:10px 12px;
  border-radius: 14px;
}

.contentInner{
  max-width: var(--contentMax);
  margin: 0 auto;
}
.sidebar .section{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}
.sidebar .hint{
  font-size: 12px;
  color: var(--muted);
  line-height: 1.3;
}

.siteSelect{
  height: 38px;
  padding: 0 10px;
  min-width: 180px;
}