:root {
  --materials-navy: #0d1b30;
  --materials-navy-2: #142b4d;
  --materials-red: #e6424f;
  --materials-red-soft: #ff6670;
  --materials-ink: #15233a;
  --materials-muted: #6c7890;
  --materials-line: #dbe2ec;
  --materials-paper: #ffffff;
  --materials-highlight: #f7dc55;
  --materials-highlight-ink: #112849;
  --materials-shadow: 0 22px 60px rgba(17, 35, 61, .13);
}

body { background: #f4f7fb; color: var(--materials-ink); }
body.dark { background: #071321; color: #edf3fb; }
.materials-page { width: calc(100% - 28px); max-width: none; margin-inline: auto; }
.materials-heading { display:flex; justify-content:space-between; gap:28px; align-items:end; margin-bottom:24px; }
.materials-heading h1 { margin: 4px 0 8px; letter-spacing:-.035em; }
.materials-stat { min-width:170px; padding:16px 18px; border:1px solid rgba(230,66,79,.22); border-top:3px solid var(--materials-red); border-radius:16px; background:var(--materials-paper); box-shadow:0 10px 24px rgba(13,27,48,.07); text-align:right; }
.materials-stat strong { display:block; color:var(--materials-red); font-size:28px; line-height:1; }
.materials-stat span { display:block; margin-top:5px; color:var(--materials-muted); font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.materials-layout { display:grid; grid-template-columns:292px minmax(0,1fr); gap:16px; align-items:start; }
.materials-sidebar, .reader-panel { border:1px solid var(--materials-line); background:var(--materials-paper); border-radius:20px; box-shadow:var(--materials-shadow); }
.materials-sidebar { position:sticky; top:18px; min-height:calc(100vh - 160px); padding:18px 14px 16px; overflow:visible; }
.sidebar-title-row { display:flex; justify-content:space-between; align-items:start; padding:4px 6px 16px; }
.sidebar-title-row h2 { margin:4px 0 0; font-size:21px; letter-spacing:-.025em; }
.sidebar-dot { width:10px; height:10px; margin-top:9px; border-radius:50%; background:var(--materials-red); box-shadow:0 0 0 5px rgba(230,66,79,.12); }
.material-search { display:flex; align-items:center; gap:8px; height:42px; padding:0 12px; border:1px solid var(--materials-line); border-radius:12px; color:var(--materials-red); background:#f8fafc; }
.material-search span { font-size:23px; line-height:0; }
.material-search input { min-width:0; width:100%; border:0; outline:0; background:transparent; color:inherit; font:inherit; font-size:13px; }
.file-tree { margin-top:14px; max-height:none; overflow:visible; padding-right:2px; }
.file-tree details { margin:0; }
.file-tree summary { list-style:none; cursor:pointer; user-select:none; }
.file-tree summary::-webkit-details-marker { display:none; }
.folder-summary, .subject-summary { display:flex; align-items:center; gap:8px; min-height:40px; padding:8px 10px; border-radius:11px; color:var(--materials-navy); font-weight:900; }
.folder-summary:hover, .subject-summary:hover { background:#f4f7fb; }
.folder-summary .chevron, .subject-summary .chevron { width:15px; color:var(--materials-red); font-size:12px; transition:transform .18s ease; }
.file-tree details[open] > summary .chevron { transform:rotate(90deg); }
.folder-summary small, .subject-summary small { margin-left:auto; color:var(--materials-muted); font-size:11px; font-weight:800; }
.folder-summary { border-bottom:1px solid var(--materials-line); border-radius:0; padding-inline:10px; color:var(--materials-red); letter-spacing:.07em; font-size:12px; }
.folder-content { padding:5px 0 10px 8px; }
.subject-summary { min-height:36px; padding-block:6px; font-size:12px; }
.subject-content { padding:2px 0 8px 22px; }
.material-item { display:flex; width:100%; align-items:center; gap:8px; text-align:left; border:0; border-left:2px solid transparent; padding:9px 9px; border-radius:8px; background:transparent; color:var(--materials-ink); cursor:pointer; font:inherit; font-size:12px; line-height:1.25; }
.material-item:hover { border-left-color:var(--materials-red-soft); background:#fff5f5; }
.material-item.active { border-left-color:var(--materials-red); background:#fff0f1; color:var(--materials-red); font-weight:900; }
.material-item .file-icon { flex:0 0 auto; width:17px; height:19px; border:1.5px solid currentColor; border-radius:3px; font-size:8px; display:grid; place-items:center; opacity:.8; }
.material-item .article-count { margin-left:auto; flex:0 0 auto; color:var(--materials-muted); font-size:10px; font-weight:800; }
.reserved-folder { padding:12px 10px 14px 34px; color:var(--materials-muted); font-size:12px; line-height:1.55; }
.reserved-folder p { margin:0 0 10px; }
.reserved-subject-list { display:grid; gap:5px; }
.reserved-subject { display:flex; justify-content:space-between; gap:8px; padding:7px 8px; border:1px dashed var(--materials-line); border-radius:7px; font-size:11px; }
.reserved-subject small { color:var(--materials-red); font-weight:900; }
.sidebar-tip { margin:18px 6px 0; padding:13px 13px 14px; border-left:3px solid var(--materials-red); background:#fff7f7; color:var(--materials-muted); font-size:11px; line-height:1.55; }
.sidebar-tip strong { color:var(--materials-red); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.reader-panel { min-height:calc(100vh - 160px); overflow:hidden; }
.reader-empty { min-height:calc(100vh - 160px); display:grid; place-content:center; justify-items:center; padding:50px; text-align:center; }
.reader-empty-mark { width:60px; height:60px; display:grid; place-items:center; border-radius:50%; background:var(--materials-navy); color:#fff; font-weight:900; letter-spacing:.06em; box-shadow:0 12px 26px rgba(13,27,48,.2); }
.reader-empty h2 { margin:15px 0 8px; letter-spacing:-.025em; }
.reader-empty p:last-child { max-width:420px; }
.reader-content { min-height:calc(100vh - 160px); }
.reader-topline { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 28px 0; }
.reader-breadcrumb { color:var(--materials-muted); font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.source-link { color:var(--materials-red); font-size:11px; font-weight:900; text-decoration:none; }
.source-link:hover { text-decoration:underline; }
.reader-header { display:flex; justify-content:space-between; align-items:end; gap:24px; padding:16px 28px 22px; border-bottom:1px solid var(--materials-line); }
.reader-header h2 { max-width:800px; margin:4px 0 8px; font-size:30px; letter-spacing:-.04em; line-height:1.08; }
.reader-meta { margin:0; color:var(--materials-muted); font-size:12px; }
.reader-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px; }
.reader-actions button { white-space:nowrap; }
.reader-actions .ghost-button { border:0; padding:9px 8px; color:var(--materials-muted); background:transparent; cursor:pointer; font:inherit; font-size:11px; font-weight:800; }
.reader-actions .ghost-button:hover { color:var(--materials-red); }
.reader-status { min-height:24px; padding:10px 28px 0; color:var(--materials-red); font-size:12px; font-weight:800; }
.material-content { max-width:930px; margin:0 auto; padding:18px 46px 80px; }
.material-article { padding:20px 0 26px; border-bottom:1px solid #e8edf3; }
.material-article:last-child { border-bottom:0; }
.material-article-heading { display:flex; gap:12px; align-items:baseline; margin-bottom:12px; }
.material-article-number { color:var(--materials-red); font-size:13px; font-weight:950; letter-spacing:.08em; text-transform:uppercase; }
.material-article-index { margin-left:auto; color:var(--materials-muted); font-size:10px; font-weight:800; }
.material-article-text { margin:0; color:#24344b; font-family:Georgia, 'Times New Roman', serif; font-size:17px; line-height:1.82; text-align:justify; hyphens:auto; user-select:text; -webkit-user-select:text; -webkit-touch-callout:default; touch-action:pan-y; cursor:text; }
.material-legal-line { display:block; min-height:1.82em; }
.material-theme-divider { display:flex; align-items:center; gap:12px; margin:24px 0 10px; color:var(--materials-red); font-family:Inter, Arial, sans-serif; font-size:12px; font-weight:950; letter-spacing:.08em; line-height:1.35; text-align:left; text-transform:uppercase; }
.material-theme-divider::before, .material-theme-divider::after { content:""; height:1px; flex:1; background:linear-gradient(90deg, transparent, rgba(230,66,79,.62)); }
.material-theme-divider::after { background:linear-gradient(90deg, rgba(230,66,79,.62), transparent); }
.material-theme-divider span { max-width:82%; }
.material-article-text::selection { background:#a9dff2; color:#102a4c; }
.material-article-text strong { color:var(--materials-navy-2); font-weight:900; }
.material-highlight { background:var(--materials-highlight); color:var(--materials-highlight-ink); padding:0 .08em; border-radius:3px; box-shadow:0 0 0 2px rgba(247,220,85,.18); }
body.dark .materials-sidebar, body.dark .reader-panel { background:#0e1f36; border-color:#253b58; }
body.dark .materials-stat { background:#0e1f36; border-color:#3b2940; }
body.dark .materials-stat span, body.dark .reader-meta, body.dark .reader-breadcrumb, body.dark .sidebar-tip, body.dark .article-count { color:#a6b4c9; }
body.dark .material-search { background:#0a182b; border-color:#314766; }
body.dark .folder-summary, body.dark .subject-summary, body.dark .material-item { color:#eaf1fb; }
body.dark .folder-summary { color:#ff8b91; border-color:#253b58; }
body.dark .folder-summary:hover, body.dark .subject-summary:hover { background:#132a48; }
body.dark .material-item:hover, body.dark .material-item.active { background:#233b5e; color:#fff; }
body.dark .sidebar-tip { background:#17263a; }
body.dark .reader-header, body.dark .material-article { border-color:#253b58; }
body.dark .material-article-text { color:#e7eef8; }
body.dark .material-article-text strong { color:#fff; }
body.dark .material-theme-divider { color:#ff8290; }
body.dark .material-theme-divider::before { background:linear-gradient(90deg, transparent, rgba(255,130,144,.72)); }
body.dark .material-theme-divider::after { background:linear-gradient(90deg, rgba(255,130,144,.72), transparent); }
body.dark .material-highlight { background:var(--materials-highlight); color:var(--materials-highlight-ink); }
body.materials-focus-mode .materials-sidebar, body.materials-focus-mode .materials-heading, body.materials-focus-mode .reader-topline, body.materials-focus-mode .topbar { display:none; }
body.materials-focus-mode .reader-actions { display:flex; position:fixed; top:16px; right:18px; z-index:20; padding:8px; border:1px solid var(--materials-line); border-radius:12px; background:var(--materials-paper); box-shadow:0 10px 28px rgba(7,19,33,.18); }
body.materials-focus-mode .materials-layout { display:block; }
body.materials-focus-mode .reader-panel, body.materials-focus-mode .reader-content { min-height:100vh; border:0; border-radius:0; box-shadow:none; }
body.materials-focus-mode .reader-header { padding:40px 9vw 28px; }
body.materials-focus-mode .reader-status { padding-inline:9vw; }
body.materials-focus-mode .material-content { max-width:980px; padding-inline:9vw; }
body.materials-focus-mode .focus-only-control { display:inline-flex; }
@media (max-width: 1050px) {
  .materials-layout { grid-template-columns:280px minmax(0,1fr); }
  .reader-header { display:block; }
  .reader-actions { justify-content:flex-start; margin-top:16px; }
}
@media (max-width: 760px) {
  .materials-heading { display:block; }
  .materials-stat { margin-top:16px; text-align:left; }
  .materials-layout { display:block; }
  .materials-sidebar { position:relative; top:auto; min-height:0; margin-bottom:14px; }
  .file-tree { max-height:none; }
  .reader-panel, .reader-content, .reader-empty { min-height:0; }
  .reader-topline, .reader-header { padding-inline:18px; }
  .reader-topline { align-items:flex-start; flex-direction:column; gap:7px; }
  .reader-header h2 { font-size:25px; }
  .material-content { padding:10px 18px 50px; }
  .material-article-text { font-size:16px; line-height:1.72; }
  .reader-actions { gap:5px; }
  .reader-actions .secondary-button, .reader-actions .primary-button { padding:9px 11px; font-size:11px; }
}
.material-preamble{margin:0 0 14px;padding:4px 0 2px}.material-preamble .material-theme-divider{margin-top:12px}.material-preamble .material-theme-divider:first-child{margin-top:0}