@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=DM+Mono:wght@400;500;600;700&display=swap');

:root {
  --shell-night: #09101d;
  --shell-panel: #111e31;
  --shell-ink: #f6f2ea;
  --shell-muted: #b6c0cd;
  --shell-line: #536070;
  --shell-hot: #ed563e;
  --shell-acid: #d4ff4f;
}

body { background:var(--shell-night); overflow-x:hidden; }
.shell-skip-link { position:fixed; z-index:100; top:-64px; left:12px; padding:10px; background:var(--shell-acid); color:#08101c; font:700 12px/1.2 "DM Mono",monospace; }
.shell-skip-link:focus { top:12px; }
.community-shell { display:grid; grid-template-columns:300px minmax(0,1fr); grid-template-rows:102px 1fr; min-height:100vh; background:var(--shell-night); color:var(--shell-ink); }
.community-brandbar { position:sticky; z-index:30; top:0; grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:102px; padding:0 38px; border-bottom:1px solid var(--shell-line); background:#0c1627; }
.community-identity { display:flex; flex:0 0 auto; align-items:center; gap:18px; color:var(--shell-ink); font:28px/.84 "Archivo Black",sans-serif; letter-spacing:-.05em; text-decoration:none; }
.community-identity img { width:74px; height:76px; object-fit:contain; }
.community-identity:focus-visible { outline:3px solid var(--shell-acid); outline-offset:4px; }
.community-brandbar-actions { display:flex; flex:1 1 auto; flex-wrap:wrap; justify-content:flex-end; gap:9px; }
.community-brandbar-actions a, .community-menu-toggle { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:9px 11px; border:1px solid var(--shell-line); background:transparent; color:var(--shell-ink); font:700 10px/1.15 "DM Mono",monospace; letter-spacing:.055em; text-align:center; text-decoration:none; }
.community-brandbar-actions a:hover, .community-brandbar-actions a:focus-visible, .community-menu-toggle:hover, .community-menu-toggle:focus-visible { border-color:var(--shell-acid); background:var(--shell-acid); color:#101929; outline:3px solid var(--shell-acid); outline-offset:3px; }
.community-menu-toggle { display:none; cursor:pointer; gap:6px; }
.community-rail { position:sticky; top:102px; align-self:start; display:flex; height:calc(100vh - 102px); flex-direction:column; gap:7px; overflow-y:auto; padding:30px 18px; border-right:1px solid var(--shell-line); background:#0c1627; }
.community-rail-label { margin:0 0 8px; color:var(--shell-acid); font:10px/1.35 "DM Mono",monospace; letter-spacing:.09em; }
.community-mode { display:flex; align-items:center; gap:12px; min-height:68px; padding:11px 9px; border:1px solid transparent; color:var(--shell-ink); font:700 14px/.95 "Archivo Black",sans-serif; letter-spacing:-.03em; text-decoration:none; }
.community-mode b { color:#78879a; font:12px "DM Mono",monospace; }
.community-mode:hover, .community-mode:focus-visible { border-color:var(--shell-line); outline:none; }
.community-mode.is-active { background:var(--shell-hot); color:#161c26; }
.community-mode.is-active b { color:#161c26; }
.community-rail-terminal { margin-top:auto; padding:24px 6px 6px; border-top:1px solid var(--shell-line); color:var(--shell-muted); font:12px/1.55 "DM Mono",monospace; }
.community-rail-terminal p { margin:0 0 10px; }
.community-rail-terminal > a { display:block; overflow-wrap:anywhere; color:var(--shell-ink); text-decoration:none; }
.community-rail-terminal > div { display:grid; gap:10px; margin-top:16px; }
.community-rail-support { display:flex; align-items:center; justify-content:center; min-height:46px; padding:10px 12px; border:1px solid var(--shell-ink); color:var(--shell-ink); font:700 11px/1.15 "DM Mono",monospace; letter-spacing:.05em; text-align:center; text-decoration:none; }
.community-rail-support:hover, .community-rail-support:focus-visible { border-color:var(--shell-acid); background:var(--shell-acid); color:#101929; outline:3px solid var(--shell-acid); outline-offset:3px; }
.community-rail-feedback, .community-rail-auxiliary { justify-self:start; color:var(--shell-muted); font:10px/1.4 "DM Mono",monospace; letter-spacing:.04em; text-decoration:none; }
.community-rail-feedback { border-bottom:1px solid var(--shell-line); }
.community-rail-terminal > a:hover, .community-rail-terminal > a:focus-visible, .community-rail-feedback:hover, .community-rail-feedback:focus-visible, .community-rail-auxiliary:hover, .community-rail-auxiliary:focus-visible { color:var(--shell-acid); outline:none; }
.community-workspace { min-width:0; overflow:visible; padding:clamp(30px,4vw,64px); background:linear-gradient(115deg,#111e31 0 58%,#0b1423 58%); }
.community-workspace > .app-shell { max-width:none; padding:0; }
.community-workspace > .app-shell > .topbar { border-color:var(--shell-line); }
.community-purpose { display:grid; grid-template-columns:minmax(180px,.45fr) minmax(0,1fr); gap:28px; margin-top:28px; padding:22px 0; border-top:1px solid var(--shell-line); border-bottom:1px solid var(--shell-line); }
.community-purpose h2 { margin:0; font-family:"Archivo Black",Inter,sans-serif; font-size:clamp(22px,3vw,34px); line-height:.98; letter-spacing:-.055em; text-transform:uppercase; }
.community-purpose-copy { display:grid; grid-template-columns:minmax(0,1fr) minmax(230px,.7fr); gap:28px; align-items:start; color:#d7e0ea; font-size:15px; }
.community-purpose-copy p { margin:0; }
.community-purpose-copy ol { display:grid; gap:7px; margin:0; padding-left:24px; color:var(--shell-ink); font:12px/1.4 "DM Mono",monospace; }
.community-purpose-copy li::marker { color:var(--shell-acid); font-weight:700; }
.community-workspace .footer { border-color:var(--shell-line); }
.community-workspace a:focus-visible, .community-workspace button:focus-visible, .community-workspace input:focus-visible, .community-workspace select:focus-visible { outline:3px solid var(--shell-acid); outline-offset:3px; }

@media (max-width:1080px) {
  .community-brandbar { padding:0 24px; }
  .community-identity { font-size:23px; }
  .community-identity img { width:62px; height:64px; }
  .community-brandbar-actions a { font-size:9px; }
  .community-shell { grid-template-columns:252px minmax(0,1fr); }
  .community-rail { padding:24px 14px; }
  .community-workspace { padding:clamp(26px,4vw,42px); }
}
@media (max-width:760px) {
  .community-shell { display:block; }
  .community-brandbar { position:sticky; min-height:74px; padding:0 18px; gap:14px; }
  .community-identity { gap:10px; font-size:18px; }
  .community-identity img { width:48px; height:50px; }
  .community-brandbar-actions { display:none; }
  .community-menu-toggle { display:inline-flex; flex:0 0 auto; min-height:42px; }
  .community-rail { position:fixed; z-index:25; top:74px; right:0; left:0; display:none; height:auto; max-height:calc(100vh - 74px); padding:18px; border-right:0; border-bottom:1px solid var(--shell-line); box-shadow:0 18px 30px rgba(0,0,0,.42); }
  .community-rail.is-open { display:flex; }
  .community-mode { min-height:48px; }
  .community-rail-terminal { margin-top:10px; padding-top:17px; }
  .community-workspace { padding:18px 12px 28px; }
  .community-purpose { display:block; margin-top:22px; }
  .community-purpose-copy { display:block; margin-top:14px; }
  .community-purpose-copy ol { margin-top:14px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; } }
