:root{
  color-scheme: light;
  --surface-1:#fcfcfb;
  --page:#f9f9f7;
  --text-primary:#0b0b0b;
  --text-secondary:#52514e;
  --text-muted:#898781;
  --border:rgba(11,11,11,0.10);
  --series-1:#2a78d6;
  --hover-wash:rgba(11,11,11,0.04);
}
@media (prefers-color-scheme: dark){
  :root:where(:not([data-theme="light"])){
    color-scheme: dark;
    --surface-1:#1a1a19;
    --page:#0d0d0d;
    --text-primary:#ffffff;
    --text-secondary:#c3c2b7;
    --text-muted:#898781;
    --border:rgba(255,255,255,0.10);
    --series-1:#3987e5;
    --hover-wash:rgba(255,255,255,0.06);
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --surface-1:#1a1a19;
  --page:#0d0d0d;
  --text-primary:#ffffff;
  --text-secondary:#c3c2b7;
  --text-muted:#898781;
  --border:rgba(255,255,255,0.10);
  --series-1:#3987e5;
  --hover-wash:rgba(255,255,255,0.06);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--page);
  color:var(--text-primary);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  line-height:1.4;
}

.layout{display:flex;align-items:flex-start;}

.sidebar{
  width:220px;flex-shrink:0;min-height:100vh;
  background:var(--surface-1);border-right:1px solid var(--border);
  padding:20px 14px;position:sticky;top:0;
}
.sidebar-brand{display:flex;align-items:center;gap:10px;margin-bottom:24px;padding:0 6px;}
.sidebar-blason{width:36px;height:36px;object-fit:cover;border-radius:6px;border:1px solid var(--border);}
.sidebar-title{font-size:16px;font-weight:600;}
.sidebar-nav{display:flex;flex-direction:column;gap:2px;}
.sidebar-link{
  display:block;padding:9px 10px;border-radius:8px;font-size:14px;
  color:var(--text-secondary);text-decoration:none;
}
.sidebar-link:hover{background:var(--hover-wash);color:var(--text-primary);}
.sidebar-link.active{background:var(--hover-wash);color:var(--text-primary);font-weight:600;}
.sidebar-link.disabled{color:var(--text-muted);cursor:default;}
.sidebar-chapter{font-weight:600;padding-left:24px;}

.sidebar-group{margin:0;}
.sidebar-group-title{
  display:block;padding:9px 10px;border-radius:8px;font-size:14px;font-weight:600;
  color:var(--text-primary);cursor:pointer;list-style:none;user-select:none;
}
.sidebar-group-title::-webkit-details-marker{display:none;}
.sidebar-group-title::before{content:"›";display:inline-block;width:12px;margin-right:2px;transition:transform 0.15s ease;color:var(--text-muted);}
.sidebar-group[open] > .sidebar-group-title::before{transform:rotate(90deg);}
.sidebar-group-title:hover{background:var(--hover-wash);}
.sidebar-group-items{display:flex;flex-direction:column;gap:2px;padding:2px 0 4px;}
.sidebar-sublink{padding-left:26px;font-size:13px;}

.main{flex:1;min-width:0;}

@media (max-width: 720px){
  .layout{flex-direction:column;}
  .sidebar{
    width:auto;min-height:auto;position:static;border-right:none;border-bottom:1px solid var(--border);
    padding:14px 16px;
  }
  .sidebar-nav{flex-direction:column;gap:2px;}
  .sidebar-brand{margin-bottom:12px;}
}