@font-face { font-family:"Headings"; src:url("assets/fonts/Skranji-Regular.ttf"); }
@font-face { font-family:"Body"; font-weight:normal; font-style:normal; src:url("assets/fonts/Tw Cen MT-Regular.ttf"); }
@font-face { font-family:"Body"; font-weight:normal; font-style:italic; src:url("assets/fonts/Tw Cen MT-Italic.ttf"); }
@font-face { font-family:"Body"; font-weight:bold; font-style:normal; src:url("assets/fonts/Tw Cen MT-Bold.ttf"); }
@font-face { font-family:"Body"; font-weight:bold; font-style:italic; src:url("assets/fonts/Tw Cen MT-BoldItalic.ttf"); }

:root { --text:#111111; --bg:#fbfaf7; --sidebar-bg:#f4f1ea; --rule:#ddd; --box:#ececec;
        --table-header-bg:#111; --table-header-color:#fff;
        --ctrl-bg:#f4f1ea; --ctrl-border:#ddd; --ctrl-hover:#e0ddd4;
        --ctrl-active-bg:#111; --ctrl-active-color:#fff; }
[data-theme="dark"] {
  --text:#e0ddd4; --bg:#1a1a1a; --sidebar-bg:#222; --rule:#444; --box:#2a2a2a;
  --table-header-bg:#333; --table-header-color:#eee;
  --ctrl-bg:#2a2a2a; --ctrl-border:#555; --ctrl-hover:#3a3a3a;
  --ctrl-active-bg:#e0ddd4; --ctrl-active-color:#1a1a1a; }
* { box-sizing:border-box; }
body { margin:0; color:var(--text); font-family:"Body",Futura,"Century Gothic","Avant Garde",sans-serif;
       line-height:1.5; background:var(--bg); }
p { margin-block-start:.5em; margin-block-end:.5em; }
.layout { display:flex; align-items:flex-start; }
.sidebar { width:280px; min-width:280px; height:100vh; position:sticky; top:0; overflow-y:auto;
           border-right:1px solid var(--rule); padding:1rem; background:var(--sidebar-bg); }
.sidebar a { display:block; color:var(--text); text-decoration:none; padding:2px 0; }
.sidebar a[aria-current="page"] { font-weight:bold; }
.sidebar .sections a.lvl-2 { padding-left:1rem; font-size:.9em; }
.sidebar .sections a.lvl-3 { padding-left:2rem; font-size:.9em; }
.sidebar .sections a.lvl-4 { padding-left:2.8rem; font-size:.9em; }
.content { flex:1; max-width:52rem; margin:0 auto; padding:2rem 3rem; }
h1,h2,h3,h4 { font-family:"Skranji","Headings",fantasy; font-weight:400; text-transform:uppercase; line-height:1.1; scroll-margin-top:6rem; }
[id] { scroll-margin-top:6rem; }
h1 { text-align:center; font-size:2.6rem; }
h2 { font-size:1.5rem; } h3 { font-size:1.25rem; } h4 { font-size:1.05rem; margin-block-start:.65em; }
h2,h3,h4 { margin-bottom:0.5em; }
h2 + *, h3 + *, h4 + * { margin-top:0; }
a.term { color:inherit; text-decoration:none; border-bottom:1px dotted #999; font-style:italic; font-weight:bold; }
span.term { font-style:italic; font-weight:bold; }
.nowrap { white-space:nowrap; }
ul,ol { padding-left:1.5em; } li { margin:.15em 0; }
ul ul { list-style:circle; }
table.rules-table { border-collapse:collapse; width:100%; margin:1rem 0; }
table.rules-table th { background:var(--table-header-bg); color:var(--table-header-color); text-align:left; padding:.4em .6em; }
table.rules-table td { padding:.35em .6em; border-bottom:1px solid var(--rule); }
aside.textbox { background:var(--box); padding:.6rem .8rem; margin:1rem 0; }
img { max-width:100%; height:auto; display:block; margin:1rem auto; }
.menu-toggle { display:none; background:var(--ctrl-bg); border:1px solid var(--ctrl-border); border-radius:6px; padding:.3em .45em; cursor:pointer; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,.15); color:var(--text); }
.menu-toggle:hover { background:var(--ctrl-hover); }
.menu-toggle svg { width:18px; height:18px; }
.sidebar-overlay { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.5); z-index:998; }
.sidebar-overlay.open { display:block; }
.top-controls { position:fixed; top:1rem; right:1.5rem; z-index:100; display:flex; gap:.5rem; align-items:center; justify-content:flex-end; }
.top-controls-right { display:flex; gap:.5rem; align-items:center; }
.lang-switch { display:flex; border-radius:6px; overflow:hidden;
               box-shadow:0 2px 8px rgba(0,0,0,.15); font-size:.85rem; }
.lang-switch a { padding:.35em .7em; text-decoration:none; color:var(--text);
                 background:var(--ctrl-bg); border:1px solid var(--ctrl-border); transition:background .15s,color .15s; }
.lang-switch a:first-child { border-right:none; border-radius:6px 0 0 6px; }
.lang-switch a:last-child  { border-left:none;  border-radius:0 6px 6px 0; }
.lang-switch a:hover { background:var(--ctrl-hover); }
.lang-switch a.active { background:var(--ctrl-active-bg); color:var(--ctrl-active-color);
                        border-color:var(--ctrl-active-bg); pointer-events:none; }
.theme-toggle { background:var(--ctrl-bg); border:1px solid var(--ctrl-border); border-radius:6px;
                padding:.3em .45em; cursor:pointer; display:flex; align-items:center; justify-content:center;
                box-shadow:0 2px 8px rgba(0,0,0,.15); transition:background .15s; }
.theme-toggle:hover { background:var(--ctrl-hover); }
.theme-toggle svg { width:18px; height:18px; fill:var(--text); transition:fill .15s; }
.theme-toggle .icon-moon { display:none; }
[data-theme="dark"] .theme-toggle .icon-sun  { display:none; }
[data-theme="dark"] .theme-toggle .icon-moon { display:block; }
[data-theme="dark"] .sidebar-logo img { filter: invert(1) hue-rotate(180deg); transition: filter 0.3s ease; }
.mobile-header-title { display:none; font-family:"Skranji","Headings",fantasy; font-size:1.4rem; letter-spacing:1px; margin:0; line-height:1; position:relative; top:1px; }
@media (max-width:800px) {
  .menu-toggle { display:flex; }
  .mobile-header-title { display:block; }
  .layout { flex-direction:column; }
  .sidebar { position:fixed; top:0; left:0; width:280px; height:100vh; transform:translateX(-100%); transition:transform .3s ease; z-index:999; border-right:none; box-shadow:2px 0 8px rgba(0,0,0,.2); }
  .sidebar.open { transform:translateX(0); }
  .content { padding:4rem 1.2rem 1rem 1.2rem; }
  .top-controls { position:fixed; top:0; left:0; right:0; padding:.5rem .8rem; background:var(--bg); border-bottom:1px solid var(--rule); display:flex; justify-content:space-between; align-items:center; z-index:900; }
}