Template:MainTemplateModern

   <main class="hf-center" role="main">
     

   </main>

/* MainTemplateModern — responsive grid + modern cards */

root {

 --hf-bg: #0e1116;
 --hf-card-bg: #161b22;
 --hf-border: #2a2f36;
 --hf-text: #e6edf3;
 --hf-muted: #9aa4b2;
 --hf-accent: #3da9fc;
 --hf-radius: 14px;
 --hf-shadow: 0 8px 24px rgba(0,0,0,.35);

}

/* Light mode (auto) */ @media (prefers-color-scheme: light) {

 :root {
   --hf-bg: #f6f7f9;
   --hf-card-bg: #ffffff;
   --hf-border: #e6e8eb;
   --hf-text: #111418;
   --hf-muted: #5b6472;
   --hf-accent: #1b74e4;
 }

}

.hf-main {

 background: var(--hf-bg);
 margin: 0;
 padding: 0.5rem 0 1.5rem 0;

}

.hf-grid {

 display: grid;
 grid-template-columns: 300px minmax(0, 1fr) 360px;
 gap: 1rem;
 align-items: start;

}

/* Breakpoints */ @media (max-width: 1280px) {

 .hf-grid { grid-template-columns: 280px minmax(0,1fr); }
 .hf-right { display:none; }

}

@media (max-width: 980px) {

 .hf-grid { grid-template-columns: 1fr; }
 .hf-left { order: -1; position: static; }

}

.hf-left {

 position: sticky;
 top: 0.75rem; /* keeps the section nav visible while scrolling */

}

.hf-center { min-width: 0; }

.hf-right { min-width: 0; }

.hf-card {

 background: var(--hf-card-bg);
 color: var(--hf-text);
 border: 1px solid var(--hf-border);
 border-radius: var(--hf-radius);
 box-shadow: var(--hf-shadow);
 padding: 0; /* SectionTemplate supplies its own padding; keep container clean */
 overflow: hidden;

}

/* Optional: tighten spacing between stacked cards */ .hf-center .hf-card + .hf-card { margin-top: 0.75rem; }

/* Right panel image/content tweaks */ .hf-right-card { position: sticky; top: 0.75rem; } .hf-right-card img { max-width: 100%; height: auto; display: block; }

/* SectionTemplate-specific (safe enhancements) */ .hf-card #mf-content { padding: .5rem .8rem .8rem .8rem; } .hf-card h2#mf-content {

 margin: 0;
 border: none;
 background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.04));
 color: var(--hf-text);
 border: 1px solid var(--hf-border);
 border-bottom: none;
 font-variant: small-caps;
 font-weight: 700;
 letter-spacing: .02em;
 text-shadow: 0 1px 0 rgba(0,0,0,.25);

}

/* Lists inside cards */ .hf-card ul { margin: .4rem 0 .4rem 1.2rem; } .hf-card li { margin: .15rem 0; }

/* Link accents */ .hf-card a { color: var(--hf-accent); text-decoration: none; } .hf-card a:hover { text-decoration: underline; }

/* Smooth edges for images and tables within cards */ .hf-card img, .hf-card table { border-radius: 10px; }

/* Table polish inside cards */ .hf-card table.wikitable { border-color: var(--hf-border); } .hf-card table.wikitable th, .hf-card table.wikitable td { border-color: var(--hf-border); }

/* Optional chips row (if you use them inside content) */ .hf-chiprow { display:flex; flex-wrap:wrap; gap:.4rem; margin:.25rem 0 .5rem; } .hf-chip { border:1px solid var(--hf-border); padding:.2rem .5rem; border-radius:999px; font-size:.9em; color:var(--hf-muted); }