/* Thinking Datacenters editorial system – STRATUM Support
   Shared brand palette and typography with the primary site.
   No external CSS frameworks, fonts, JavaScript, or image services. */
:root {
  color-scheme: light;
  --ink: #0a0a0a;
  --ink-soft: #242424;
  --muted: #555;
  --subtle: #707070;
  --line: #d8d8d8;
  --line-dark: #bdbdbd;
  --surface: #f7f7f7;
  --surface-soft: #fbfbfb;
  --paper: #fff;
  --red: #EC3A3A;
  --page: 1500px;
  --gutter: clamp(22px, 5vw, 80px);
  --shadow: 0 10px 38px rgba(0,0,0,.09);
}
* { box-sizing: border-box; }
html { background:var(--paper); color:var(--ink); font-family:Aptos,"Helvetica Neue",Arial,sans-serif; font-size:16px; -webkit-text-size-adjust:100%; }
body { margin:0; min-height:100vh; background:var(--paper); font-size:16px; line-height:1.44; letter-spacing:-.017em; }
button, input, textarea, select { font:inherit; }
button { cursor:pointer; }
button:disabled { cursor:default; opacity:.58; }
a { color:inherit; text-decoration:none; }
a:hover { color:var(--red); }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible { outline:2px solid var(--red); outline-offset:3px; }
.hidden { display:none !important; }

/* Black editorial site header: same logo, tone and geometry as thinkingdatacenters.com */
.site-header { background:#050505; color:#fff; border-bottom:1px solid #292929; min-height:70px; position:sticky; top:0; z-index:30; }
.header-inner { width:100%; max-width:1640px; min-height:70px; padding:9px clamp(20px,4vw,70px); margin:auto; display:flex; align-items:center; gap:32px; }
.site-brand { flex:none; display:flex; gap:12px; align-items:center; font-size:14px; line-height:.96; font-weight:850; letter-spacing:.08em; color:#fff; }
.site-brand img { display:block; width:46px; height:46px; object-fit:contain; }
.site-brand:hover { color:#fff; }
.site-nav { margin-left:auto; display:flex; align-items:center; gap:clamp(15px,1.65vw,30px); white-space:nowrap; }
.site-nav a { color:#d6d6d6; font-size:14px; font-weight:650; }
.site-nav a:hover,.site-nav a:focus-visible,.site-nav a.active { color:#fff; }
.site-nav a.active { border-bottom:1px solid var(--red); padding-bottom:5px; }
.site-exit { flex:none; color:#eee; font-size:14px; font-weight:750; border:1px solid #515151; padding:10px 13px; }
.site-exit span { color:var(--red); }
.site-exit:hover { color:#fff; border-color:#aaa; }

/* Page / hero */
.shell { max-width:var(--page); min-height:calc(100vh - 290px); margin:0 auto; padding:0 var(--gutter) 90px; }
.page-intro { padding:66px 0 49px; border-bottom:1px solid var(--line); }
.eyebrow { color:var(--red); font-size:14px; font-weight:850; letter-spacing:.055em; line-height:1.2; }
.intro-grid { display:flex; justify-content:space-between; gap:38px; align-items:end; }
h1,h2,h3,p { margin-top:0; }
h1 { margin:14px 0 15px; font-size:clamp(44px,5vw,72px); line-height:.97; letter-spacing:-.054em; font-weight:820; }
.page-intro p { max-width:660px; margin:0; font-size:18px; line-height:1.5; color:#303030; }
.account-wrap { flex:none; position:relative; display:flex; flex-direction:column; align-items:flex-end; gap:8px; padding-bottom:2px; }
.identity-label { font-size:14px; font-weight:780; letter-spacing:.055em; color:#606060; }
.identity { display:flex; align-items:center; gap:10px; background:#fff; color:#111; border:1px solid var(--line-dark); padding:11px 14px; min-height:47px; font-weight:750; font-size:14px; letter-spacing:.02em; }
.identity:hover { border-color:var(--ink); }
.status-dot { display:inline-block; width:8px; height:8px; border-radius:100%; background:#919191; flex:none; }
.status-dot.online { background:#198552; }
.account-caret { font-size:14px; color:#606060; margin-left:5px; }
.account-popover { position:absolute; top:100%; right:0; margin-top:6px; width:180px; z-index:80; background:#fff; border:1px solid var(--line); box-shadow:var(--shadow); padding:6px; }
.account-popover button { width:100%; border:0; background:#fff; padding:10px 14px; text-align:left; font-size:15px; font-weight:730; color:#111; }
.account-popover button:hover { background:var(--surface); }

/* Search / operations */
.toolbar { display:flex; align-items:end; justify-content:space-between; gap:24px; padding:34px 0 32px; }
.search-wrap { flex:1; max-width:780px; }
label { display:block; font-size:14px; font-weight:850; letter-spacing:.045em; color:var(--ink); margin:0 0 9px; }
.search-row { display:flex; gap:9px; align-items:stretch; }
input,textarea,select { border:1px solid #bcbcbc; background:#fff; color:#111; width:100%; padding:12px 14px; border-radius:0; outline:0; font-size:16px; transition:border-color .15s,box-shadow .15s; }
input:focus, textarea:focus, select:focus { border-color:var(--red); box-shadow:0 0 0 2px rgba(236,58,58,.12); }
input::placeholder,textarea::placeholder { color:#737373; }
textarea { resize:vertical; min-height:108px; line-height:1.55; }
select { appearance:auto; }
input[type=search] { min-width:0; }
.button,.back-link,.icon-button { border:1px solid #161616; border-radius:0; color:#111; background:#fff; transition:background .13s,color .13s,border-color .13s; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:9px; padding:10px 17px; min-height:48px; font-size:14px; font-weight:800; white-space:nowrap; }
.button:hover { color:#fff; background:#111; }
.button.primary { background:#111; color:#fff; }
.button.primary:hover { background:#333; border-color:#333; color:#fff; }
.button.secondary { background:#f6f6f6; color:#111; border-color:#aaa; }
.button.secondary:hover { background:#111; color:#fff; border-color:#111; }
.button.ghost { background:transparent; border-color:#c7c7c7; }
.button.ghost:hover { background:#f1f1f1; color:#111; border-color:#111; }
.button.danger { background:#fff; color:#b52121; border-color:#c44; }
.button.danger:hover { background:#b52121; color:#fff; }
.new-topic { flex:none; min-width:160px; }
.new-topic span { font-size:23px; font-weight:400; line-height:.5; }

/* Counters and forum rows */
.stats { display:grid; grid-template-columns:135px 135px 150px minmax(0,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); align-items:center; min-height:85px; }
.stats>div { min-height:83px; display:flex; flex-direction:column; justify-content:center; padding:12px 23px; }
.stats>div:not(:last-child) { border-right:1px solid var(--line); }
.stats span { font-size:29px; font-weight:820; line-height:1.1; letter-spacing:-.04em; }
.stats small { font-size:14px; font-weight:750; letter-spacing:.035em; margin-top:5px; color:#666; }
.stats .rule { text-align:right; align-items:flex-end; }
.rule>span { font-size:14px; font-weight:800; letter-spacing:.02em; color:#4c4c4c; line-height:1.4; }
.rule .rule-slash { font-size:14px; color:var(--red); font-weight:900; margin:0 5px; }
.view { display:none; }
.view.active { display:block; }
.list-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:42px 0 14px; }
.list-heading h2 { margin:0; font-size:33px; font-weight:790; letter-spacing:-.045em; line-height:1.05; }
.list-heading span { color:#777; font-size:14px; font-weight:800; letter-spacing:.045em; }
.topic-list { border-top:2px solid #151515; }
.topic-card { display:grid; grid-template-columns:4px minmax(0,1fr) 155px; gap:18px; align-items:center; padding:19px 13px 19px 0; border-bottom:1px solid var(--line); }
.topic-card:hover { background:#fafafa; }
.topic-card button.topic-hit { appearance:none; background:transparent; border:0; color:inherit; text-align:left; padding:0; min-width:0; }
.topic-card button.topic-hit:hover .topic-title { color:var(--red); }
.state-bar { background:var(--red); width:3px; min-height:55px; }
.state-bar.closed { background:#a5a5a5; }
.topic-title { font-size:21px; font-weight:780; line-height:1.15; letter-spacing:-.031em; margin:0 0 11px; overflow-wrap:anywhere; }
.topic-meta { display:flex; flex-wrap:wrap; align-items:center; gap:8px 13px; font-size:14px; color:#666; }
.topic-right { display:flex; flex-direction:column; gap:5px; text-align:right; align-items:flex-end; color:#666; font-size:14px; }
.topic-right b { font-size:21px; color:#111; margin-right:4px; font-weight:800; }
.badge { display:inline-flex; align-items:center; border:1px solid #cecece; color:#333; font-size:14px; font-weight:760; line-height:1.2; letter-spacing:0; padding:4px 7px; }
.badge.enterprise { border-color:#e2b7b7; color:#ac2626; }
.badge.community { border-color:#bdbdbd; color:#333; }
.badge.open { color:#23714b; border-color:#b6cdbf; }
.badge.closed { color:#676767; border-color:#ccc; }
.empty { text-align:center; padding:76px 18px 96px; color:#555; }
.empty-glyph { color:var(--red); font-size:32px; line-height:1; margin-bottom:12px; }
.empty h2 { margin:0 0 10px; font-size:27px; letter-spacing:-.04em; color:#111; }
.empty p { font-size:16px; margin:0 auto; }

/* Topic detail and private comment view */
.back-link { border:0; background:transparent; padding:0; margin:29px 0 23px; color:#333; font-size:15px; font-weight:780; }
.back-link:hover { color:var(--red); }
.detail-card { border-top:2px solid #111; border-bottom:1px solid var(--line); padding:30px 0 25px; background:#fff; }
.detail-top { display:flex; gap:20px; align-items:flex-start; justify-content:space-between; }
.detail-card h2 { font-size:clamp(28px,2.6vw,40px); line-height:1.08; letter-spacing:-.047em; margin:10px 0 13px; }
.author-line { color:#666; font-size:14px; letter-spacing:.015em; }
.message { font-size:16px; line-height:1.7; color:#262626; white-space:pre-wrap; overflow-wrap:anywhere; margin:28px 0 9px; max-width:950px; }
.detail-actions { display:flex; flex-wrap:wrap; gap:8px; }
.comments-section { margin-top:35px; }
.section-title { display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:2px solid #111; padding:0 0 13px; color:#353535; font-size:14px; font-weight:780; letter-spacing:.03em; }
.comment { display:grid; grid-template-columns:170px minmax(0,1fr); gap:22px; border-bottom:1px solid var(--line); padding:21px 0; }
.comment-author { font-size:16px; color:#111; font-weight:800; overflow-wrap:anywhere; }
.comment-time { color:#737373; font-size:14px; margin-top:5px; }
.comment-content { min-width:0; }
.comment-body { white-space:pre-wrap; overflow-wrap:anywhere; font-size:16px; color:#292929; line-height:1.65; }
.attachment-list { margin-top:16px; padding:10px 15px; border-left:3px solid var(--red); background:#f7f7f7; }
.attachment-label { color:#a92a2a; font-size:14px; font-weight:820; letter-spacing:.045em; margin-bottom:6px; }
.attachment-name { font-size:15px; color:#333; line-height:1.5; overflow-wrap:anywhere; }
.composer { background:var(--surface-soft); border:1px solid var(--line); padding:23px; margin-top:29px; }
.composer.compact.closed { opacity:.65; pointer-events:none; }
.upload-label { margin-top:21px !important; }
.optional { font-size:14px; font-weight:650; color:#777; margin-left:5px; }
.file-input { min-height:50px; font-size:15px; padding:9px 11px; background:#fff; }
.file-input::file-selector-button { border:1px solid #bbb; background:#f7f7f7; padding:8px 12px; font:inherit; font-size:14px; font-weight:750; margin-right:11px; cursor:pointer; }
.upload-hint { margin-top:9px; font-size:14px; color:#5b5b5b; line-height:1.55; }
.composer-foot { display:flex; justify-content:space-between; align-items:center; gap:18px; color:#666; margin-top:14px; font-size:14px; }
.actions,.modal-actions { display:flex; justify-content:flex-end; gap:9px; }

/* Native browser dialogs, consistent with the same editorial surface */
dialog { width:min(700px,calc(100% - 30px)); max-height:calc(100vh - 28px); overflow:auto; border:1px solid #bcbcbc; border-radius:0; color:#111; background:#fff; padding:0; box-shadow:0 30px 90px rgba(0,0,0,.24); }
dialog::backdrop { background:rgba(0,0,0,.54); }
.modal-card { padding:29px; }
.modal-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:22px; }
.modal-head h2 { font-size:36px; letter-spacing:-.055em; margin:7px 0 0; line-height:1.1; }
.modal-copy { margin:0 0 22px; color:#464646; font-size:16px; line-height:1.55; }
.modal-card label:not(:first-child) { margin-top:19px; }
.modal-actions { margin-top:22px; }
.icon-button { background:#fff; border:1px solid #ccc; color:#222; width:41px; height:41px; flex:none; font-size:24px; line-height:1; }
.icon-button:hover { background:#111; color:#fff; }
.toast { position:fixed; right:23px; bottom:23px; max-width:min(420px,calc(100% - 44px)); padding:14px 17px; background:#111; color:#fff; border-left:4px solid var(--red); box-shadow:var(--shadow); pointer-events:none; opacity:0; transform:translateY(12px); transition:opacity .2s, transform .2s; font-size:15px; z-index:120; }
.toast.show { opacity:1; transform:translateY(0); }
.toast.error { background:#a62929; border-left-color:#fff; }

/* Site footer uses precisely the five inline social SVGs from Thinking Datacenters */
.site-footer { background:#050505; color:#fff; }
.footer-inner { max-width:var(--page); margin:0 auto; padding:42px var(--gutter) 39px; display:grid; grid-template-columns:minmax(215px,1.1fr) minmax(0,2.3fr); gap:65px; }
.footer-brand { display:flex; align-items:center; gap:14px; color:#fff; }
.footer-brand:hover { color:#fff; }
.footer-brand img { display:block; width:55px; height:55px; object-fit:contain; }
.footer-brand strong { font-size:15px; font-weight:860; line-height:1; letter-spacing:.075em; }
.footer-socials { display:flex; align-items:center; flex-wrap:wrap; gap:21px; margin-top:28px; }
.footer-socials a { display:inline-flex; align-items:center; justify-content:center; color:#ddd; min-width:24px; min-height:29px; }
.footer-socials a:hover { color:var(--red); }
.footer-socials svg { fill:currentColor; display:block; width:24px; height:24px; }
.footer-socials .discord-social svg { width:27px; }
.footer-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.footer-links>div { display:flex; flex-direction:column; gap:8px; }
.footer-links h2 { margin:0 0 7px; font-size:14px; font-weight:840; letter-spacing:.075em; color:#e4b46d; }
.footer-links a { color:#ddd; font-size:14px; line-height:1.4; }
.footer-links a:hover { color:#fff; text-decoration:underline; text-decoration-color:var(--red); text-underline-offset:4px; }
.footer-bottom { border-top:1px solid #262626; max-width:var(--page); margin:0 auto; display:flex; justify-content:space-between; gap:20px; padding:16px var(--gutter); color:#999; font-size:14px; letter-spacing:.025em; }

@media (max-width:1200px) {
  .site-nav { gap:14px; }
  .site-exit { display:none; }
}
@media (max-width:980px) {
  .site-nav { display:none; }
  .site-exit { display:inline-flex; margin-left:auto; }
  .intro-grid { gap:23px; }
  .page-intro { padding-top:55px; }
  .footer-inner { gap:38px; }
}
@media (max-width:740px) {
  .shell { padding:0 22px 70px; }
  .page-intro { padding:36px 0 32px; }
  .intro-grid { display:block; }
  .intro-grid h1 { margin:10px 0 15px; font-size:clamp(40px,9vw,54px); }
  .page-intro p { font-size:17px; }
  .account-wrap { align-items:flex-start; margin-top:27px; }
  .account-popover { right:auto; left:0; }
  .toolbar { flex-direction:column; align-items:stretch; gap:16px; padding:26px 0; }
  .search-wrap { max-width:none; }
  .new-topic { align-self:stretch; }
  .stats { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .stats>div { padding:13px; min-height:78px; }
  .stats>div:nth-child(3) { border-right:0; }
  .stats .rule { display:none; }
  .stats span { font-size:25px; }
  .list-heading { margin-top:30px; }
  .list-heading h2 { font-size:28px; }
  .topic-card { grid-template-columns:3px minmax(0,1fr); gap:11px; padding:17px 3px 17px 0; }
  .topic-title { font-size:20px; }
  .topic-right { grid-column:2; align-items:center; text-align:left; flex-direction:row; gap:7px; }
  .topic-right b { font-size:17px; }
  .comment { grid-template-columns:1fr; gap:7px; }
  .detail-top { flex-direction:column; }
  .section-title { flex-wrap:wrap; }
  .footer-inner { padding:40px 22px; grid-template-columns:1fr; gap:36px; }
  .footer-bottom { padding:17px 22px; }
}
@media (max-width:480px) {
  .header-inner { padding:12px 19px; gap:10px; min-height:67px; }
  .site-brand { gap:9px; font-size:14px; }
  .site-brand img { width:39px; height:39px; }
  .site-exit { padding:8px 9px; font-size:14px; }
  .search-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .search-row input { grid-column:1/-1; }
  .stats small { font-size:14px; letter-spacing:0; }
  .list-heading span { display:none; }
  .footer-links { grid-template-columns:repeat(2,minmax(0,1fr)); gap:27px 16px; }
  .footer-bottom { flex-direction:column; gap:8px; }
  .modal-card { padding:21px; }
  .modal-head h2 { font-size:30px; }
  .modal-actions { flex-wrap:wrap; }
  .composer { padding:16px; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* Native sign-in fallback links to the themed support index. */
.auth-return { margin-top:26px; }