@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root { color-scheme:dark; --accent:#FF60D3; background:#101010; color:#f6f4ef; font-family:'DM Sans',sans-serif; }
* { box-sizing:border-box; } body { margin:0; } a { color:var(--accent); text-decoration:none; } button,input,select,textarea { font:inherit; } button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.topbar { min-height:64px; padding:10px clamp(20px,4vw,64px); display:flex; align-items:center; justify-content:space-between; gap:20px; background:#050505; border-bottom:1px solid #303030; font:11px 'DM Mono',monospace; }
.brand { display:flex; align-items:center; gap:12px; color:#fff; font-weight:500; letter-spacing:.7px; }.brand img { width:40px; height:40px; aspect-ratio:1; object-fit:contain; }.brand span { padding-left:12px; border-left:1px solid #555; }
main { max-width:1320px; margin:auto; padding:40px clamp(20px,4vw,64px) 24px; }.kicker,.badge { font:500 10px 'DM Mono',monospace; color:var(--accent); letter-spacing:1px; }.intro h1 { margin:16px 0 12px; font:600 clamp(36px,5vw,60px)/1.05 'Space Grotesk',sans-serif; letter-spacing:-.05em; }.intro>p { color:#aaa; margin:0 0 32px; font-size:16px; }
.support-grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:20px; }.panel { min-width:0; padding:clamp(20px,3vw,32px); background:#181818; border:1px solid #393939; border-top:2px solid var(--accent); }.panel-heading { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; } h2 { margin:0; font:600 25px/1.15 'Space Grotesk',sans-serif; letter-spacing:-.04em; }.muted { margin:14px 0 24px; color:#aaa; font-size:14px; line-height:1.6; }
label { display:block; margin:16px 0 8px; font-size:12px; color:#ccc; } input,select,textarea { width:100%; min-width:0; padding:12px; border:1px solid #4b4b4b; border-radius:4px; background:#101010; color:#f6f4ef; } textarea { resize:vertical; } button { min-height:44px; padding:10px 14px; border:1px solid #555; border-radius:4px; color:#f6f4ef; background:#202020; cursor:pointer; } button:hover { border-color:var(--accent); } button.primary { width:100%; color:#101010; background:var(--accent); border-color:var(--accent); font-weight:700; }
.search-row { display:flex; gap:8px; }.search-row input { flex:1; }.search-row button { flex:none; }.topics { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; }.topics button { font-size:12px; color:#bbb; }
#help-status,#report-status { font-size:12px; color:var(--accent); line-height:1.6; } details { border-top:1px solid #393939; padding:14px 0; } summary { cursor:pointer; font-weight:600; font-size:14px; line-height:1.5; } details p,.notice p { color:#bbb; font-size:13px; line-height:1.7; margin:12px 0 0; overflow-wrap:anywhere; }
.notice { margin-top:24px; padding:18px; border:1px solid #493041; background:#241b22; }.notice strong { font-size:12px; color:var(--accent); }.small { font-size:11px; color:#999; line-height:1.6; } footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; margin-top:28px; padding-top:20px; border-top:1px solid #333; color:#888; font:10px 'DM Mono',monospace; }
@media(max-width:760px) { .support-grid { grid-template-columns:1fr; } main { padding-top:30px; } }
@media(max-width:360px) { .search-row { flex-direction:column; } .topbar { gap:12px; }.topbar>a:last-child { font-size:10px; } }
