@font-face {
  font-family: "DM Sans"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url('/fonts/dm-sans-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: "DM Sans"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url('/fonts/dm-sans-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
:root {
  --bg:#060606; --panel:#0f0f0f; --panel-soft:#151515; --line:#242424;
  --text:#f5f5f5; --muted:#929292; --accent:#e3e3e3; --green:#a7d8bb; --red:#ff8585;
  font-family:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:14px; font-weight:400; line-height:1.5; font-optical-sizing:auto;
  font-variant-numeric:tabular-nums; scrollbar-color:#353535 var(--bg);
}
body { min-width:320px; }
html { scrollbar-gutter:stable; }
html:has(dialog[open]),body:has(dialog[open]) { overflow:hidden; overscroll-behavior:none; }
dialog { overscroll-behavior:contain; }
button,input,select { border-radius:11px; }
button { background:#1b1b1b; font-weight:500; transition:background .18s,border-color .18s,color .18s,box-shadow .18s; }
button:hover { background:#272727; border-color:#404040; }
button:active:not(:disabled) { background:#303030; }
button.primary { color:#080808; background:#efefef; border-color:#efefef; }
button.primary:hover { background:#fff; border-color:#fff; box-shadow:0 0 0 3px #ffffff0a; }
button.ghost:hover { background:#181818; }
input,select { background:#0b0b0b; padding:11px 14px; }
input::placeholder { color:#737373; }
input:focus,select:focus { border-color:#777; }
label { color:#c9c9c9; font-size:13px; }
h1 { font-size:27px; letter-spacing:-.9px; font-weight:600; }
h2 { font-size:16px; font-weight:600; }
.tiny { font-size:12px; }
.icon,.nav-icon,.lock-icon { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; flex:none; vertical-align:middle; }
button .icon,.text-link .icon { width:15px; height:15px; margin-right:5px; }
.sidebar {
  position:sticky; inset:0 0 auto; z-index:3; width:100%; height:73px;
  padding:0 max(28px,calc((100vw - 1200px)/2)); flex-direction:row; align-items:center; gap:28px;
  background:#060606f5; border-right:0; border-bottom:1px solid #171717;
}
.brand { gap:10px; font-size:13px; font-weight:600; letter-spacing:-.3px; }
.brand-mark { width:auto; height:auto; padding:0; border:0; border-radius:0; background:transparent; color:#fff; font-size:27px; line-height:1; letter-spacing:-2px; }
.brand-mark>span { color:#fff; }
.brand small,.nav-label { display:none; }
nav { display:flex; align-items:center; gap:3px; margin:0; }
nav a { gap:8px; padding:9px 13px; color:#929292; font-size:14px; white-space:nowrap; border-radius:30px; transition:background .2s,color .2s; }
nav a:hover { background:#111; }
nav a.active { color:#fff; background:#202020; }
.nav-icon { width:17px; height:17px; }
.nav-count { background:#333; color:#ddd; border-radius:12px; font-size:10px; padding:1px 6px; }
.sidebar-bottom { border:0; padding:0; margin:0 0 0 auto; font-size:12px; color:#aaa; gap:9px; white-space:nowrap; }
.sidebar-bottom small,.sidebar-bottom>.status-dot { display:none; }
.lock-icon { color:#aaa; width:16px; height:16px; }
.workspace { margin:0; min-height:calc(100vh - 73px); }
.topbar { width:100%; max-width:1256px; margin:0 auto; height:57px; padding:0 28px; border:0; }
.breadcrumb,.connection { font-size:12px; }
.breadcrumb span { color:#444; }
.breadcrumb strong { color:#c4c4c4; }
.connection { color:#999; }
.status-dot { width:5px; height:5px; box-shadow:none; }
main { max-width:1256px; padding:26px 28px 56px; }
main.page-enter { animation:page-enter .22s cubic-bezier(.2,.7,.2,1) both; }
.profile-content.tab-enter { animation:page-enter .16s ease-out both; }
@keyframes page-enter { from { opacity:.2; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }
.page-heading { margin-bottom:28px; }
.eyebrow { display:none; }
.page-heading p { font-size:14px; margin-top:5px; }
.pill { color:#aaa; background:#151515; border-color:#292929; font-size:11px; padding:6px 10px; }
.pill.live { color:var(--green); border-color:#283b30; background:#111c15; }
.hero-stat { background:#101010; border:1px solid #2c2c2c; border-radius:17px; padding:27px 29px; margin-bottom:16px; }
.hero-stat .label { color:#aaa; font-size:11px; letter-spacing:1px; }
.hero-number { font-size:49px; font-weight:500; letter-spacing:-2px; margin:9px 0 6px; }
.hero-stat p,.hero-meta small { color:#888; font-size:12px; }
.hero-meta { font-size:14px; gap:30px; }
.metric-grid { gap:12px; margin-bottom:24px; }
.metric { border-radius:14px; min-height:133px; padding:18px 20px; }
.metric-header { font-size:12px; color:#b2b2b2; }
.metric-symbol { background:#1c1c1c; color:#999; border-radius:8px; width:29px; height:29px; }
.metric-symbol .icon { width:16px; height:16px; }
.metric-value { font-size:31px; font-weight:500; letter-spacing:-1px; }
.metric small { color:#777; font-size:11px; }
.panel { border-radius:16px; }
.tracking-health-panel { margin-bottom:24px; }
.health-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:1px; background:#252525; }
.health-item { background:#101010; padding:20px 23px; min-width:0; }
.health-item h3 { color:#999; font-size:12px; font-weight:400; margin:0 0 10px; }
.health-item strong { font-size:16px; font-weight:500; }
.health-item p { color:#888; font-size:11px; line-height:1.7; margin:8px 0 0; }
.health-warning strong { color:#e9c58c; }
.health-item .discovery-count { font-size:12px; color:#ddd; }
.health-item .discovery-previous { border-top:1px solid #282828; padding-top:10px; margin-top:12px; }
.health-item .discovery-timing { color:#aaa; }
.health-note { padding:0 23px 18px; }
.server-toolbar { align-items:center; }
.server-card .social-header { min-width:0; }
.server-card .user-copy strong { overflow-wrap:anywhere; }
.panel-header { padding:21px 23px; }
.panel-header h2 { font-size:14px; }
.panel-header p { color:#888; font-size:12px; }
.text-link { color:#bdbdbd; font-size:12px; transition:color .18s; }
.text-link:hover { color:#fff; }
.activity-row { padding:16px 23px; border-color:#222; }
.activity-symbol { border-color:#2c2c2c; color:#999; border-radius:9px; }
.activity-symbol .icon { width:16px; height:16px; }
.activity-avatar { width:36px; height:36px; flex:0 0 36px; }
.activity-avatar .avatar-launch { display:block; width:36px; height:36px; border-radius:9px; overflow:hidden; }
.activity-avatar .avatar { width:36px; height:36px; object-fit:cover; border-radius:9px; }
.activity-avatar .activity-symbol { width:36px; height:36px; }
.activity-copy strong { font-size:12px; }
.activity-copy p,.activity-row time { font-size:11px; }
.activity-row time { color:#777; }
.access-permissions { display:grid; gap:12px; }
.access-option { display:flex; align-items:flex-start; gap:11px; line-height:1.5; }
.access-option input { width:17px; height:17px; margin-top:3px; flex:none; }
.access-option strong { display:block; font-size:13px; }
.access-option small { display:block; font-size:12px; color:var(--muted); margin-top:3px; }
.access-scope-note { margin-top:0; padding:12px 15px; background:#151515; border:1px solid var(--line); border-radius:10px; }
.access-profile-mode { margin:12px 0 4px 28px; max-width:340px; }
.access-profile-mode small { display:block; margin-top:7px; color:var(--muted); line-height:1.6; }
.access-row { display:flex; align-items:center; gap:12px; padding:20px 23px; border-top:1px solid var(--line); }
.user-card:has(>button) { flex-wrap:wrap; }
.user-card>button[data-action="profile"] { display:flex; align-items:center; gap:12px; text-align:left; padding:0; border:0; flex:1; min-width:0; }
@media(max-width:620px) { .access-row { flex-wrap:wrap; } .access-row .user-copy { flex-basis:100%; } }
.message-setting-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.message-settings form { padding-top:14px; gap:12px; }
.message-setting-fields label { min-width:0; line-height:1.5; }
.message-setting-fields input { width:100%; }
@media(max-width:620px) { .message-setting-fields { grid-template-columns:1fr; } }
.breakdown-label { color:#aaa; font-size:12px; }
.breakdown-label strong { color:#eee; }
progress,progress::-webkit-progress-bar { background:#252525; }
progress::-webkit-progress-value { background:#a3a3a3; }
progress::-moz-progress-bar { background:#a3a3a3; }
.system-top { font-size:13px; }
.system-row { font-size:11px; }
.system-row span:last-child { color:#ccc; }
.note { color:#888; font-size:12px; line-height:1.65; }
.section-heading { margin:32px 0 16px; }
.section-heading p { font-size:12px; margin-top:5px; max-width:690px; }
.form-grid { gap:12px; }
.toolbar input { border-radius:25px; }
.user-card { padding:18px; border-radius:14px; transition:background .18s,border-color .18s; }
.user-card:hover { background:#151515; border-color:#424242; }
.avatar { background:#242424; border-radius:11px; }
.avatar-placeholder { color:#ccc; }
.user-copy strong { font-size:14px; font-weight:500; }
.user-copy p { font-size:12px; }
.user-copy small { color:#787878; font-size:10px; }
.card-chevron { color:#777; }
.card-chevron .icon { width:16px; height:16px; margin:0; }
.empty { color:#888; }
.empty strong { color:#ddd; }
.empty-symbol { color:#777; }
.empty-symbol .icon { width:28px; height:28px; }
.social-card { padding:21px; border-radius:16px; align-self:start; }
.social-header { margin-bottom:16px; }
.social-stats { gap:27px; padding:18px 0 0; margin-top:19px; }
.social-stats strong { font-size:17px; font-weight:500; }
.social-stats small { font-size:10px; letter-spacing:.2px; }
.button-row button { font-size:12px; padding:9px 12px; }
.social-card summary { color:#bcbcbc; font-size:12px; padding:3px 0; }
.social-card details { padding-top:15px; margin-top:20px; }
.social-card details[open] summary { color:#f1f1f1; margin-bottom:6px; }
.history-row { font-size:14px; padding:15px 0; }
.history-row small { font-family:"DM Sans",sans-serif; color:#929292; font-size:11px; }
.history-row time { font-size:11px; }
.avatar-tile img { border-radius:11px; background:#1d1d1d; }
.avatar-tile small { font-size:10px; }
.job { border-radius:16px; }
.job h3 { font-size:14px; }
.download-file { background:#080808; }
.download-file img,.download-file video { background:#050505; }
.download-file a.file-save { color:#ddd; background:#232323; font-size:12px; border-radius:9px; }
.download-file a.file-save:hover { background:#303030; }
.download-file small { font-size:10px; overflow-wrap:anywhere; }
.pill.running { color:#ccc; }
.check-error { color:#d4b88b; }
footer { width:100%; max-width:1200px; padding:21px 0; margin:0 auto; border-color:#1c1c1c; font-size:11px; color:#686868; }
#toast { left:50%; border-color:#454545; background:#202020; color:#f1f1f1; box-shadow:0 12px 45px #0009; border-radius:13px; }
#toast.error { background:#281b1b; }
#update-banner { left:50%; right:auto; transform:translateX(-50%); width:min(700px,calc(100% - 40px)); background:#202020; border-color:#494949; color:#eee; border-radius:14px; }
dialog { background:#0f0f0f; border-color:#353535; border-radius:18px; scrollbar-gutter:stable; }
dialog::backdrop { background:#000b; backdrop-filter:none; -webkit-backdrop-filter:none; }
dialog[open] { animation:dialog-enter .12s ease-out; }
@keyframes dialog-enter { from { opacity:0; } to { opacity:1; } }
.profile-top h2 { font-size:22px; font-weight:500; }
.profile-top p { font-size:12px; }
.profile-tabs { gap:4px; padding:15px 0; border-bottom:1px solid #222; margin-bottom:10px; }
.profile-tabs button { border:0; border-radius:25px; padding:9px 13px; font-size:12px; }
.profile-tabs button.active { color:#fff; background:#242424; }
.profile-tabs button:hover { background:#1b1b1b; }
.profile-description { font-size:12px; margin-top:7px; }
.voice-visit { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; padding:16px 0; border-bottom:1px solid #222; }
.voice-visit>div { min-width:0; max-width:100%; overflow-wrap:anywhere; }
.voice-visit p { margin:5px 0; }
.voice-visit small { font-size:11px; color:#929292; }
.voice-visit .pill { white-space:normal; }
.preview-banner { background:#121a16; border-color:#304237; color:#b7c9bf; border-radius:12px; font-size:12px; }
.error-panel { border-color:#4a3333; background:#181111; }
.token-card .pill { font-size:10px; }
.avatar-launch { display:block; border:0; background:transparent; padding:0; border-radius:12px; flex:none; cursor:zoom-in; }
.avatar-launch:hover { background:transparent; box-shadow:0 0 0 3px #ffffff16; }
.avatar-tile { cursor:zoom-in; }
.avatar-tile img { transition:filter .18s; }
.avatar-tile:hover img { filter:brightness(1.12); }
#avatar-dialog { width:min(760px,94vw); }
.avatar-preview-header { display:flex; align-items:center; justify-content:space-between; padding:20px 23px; gap:16px; border-bottom:1px solid var(--line); }
.avatar-preview-header h2 { font-size:17px; font-weight:500; overflow-wrap:anywhere; }
.avatar-preview-header p { font-size:12px; margin-top:4px; }
.avatar-preview-header .close { border:0; padding:3px 10px; background:transparent; font-size:25px; color:#aaa; }
.avatar-preview-image { background:#080808; text-align:center; padding:16px; }
.avatar-preview-image img { display:block; width:100%; max-height:59vh; object-fit:contain; border-radius:9px; }
.avatar-preview-image .note { margin:12px; }
.avatar-preview-actions { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:19px 23px 0; }
.avatar-preview-actions .danger { border-color:#543131; background:#211414; }
.avatar-preview-actions .danger:hover { background:#331c1c; }
.avatar-preview-note { margin:14px 23px 22px; }
.updated-flash { animation:counter-flash .7s ease; }
@keyframes counter-flash { 0% { color:#b1dfc2; } 100% { color:var(--text); } }
@media(min-width:1600px) { main { padding-top:30px; } }
@media(max-width:1150px) {
  .sidebar { padding:0 24px; gap:23px; }
  .sidebar-bottom { display:none; }
  .workspace { margin:0; }
  nav a { padding:9px 12px; }
  footer { width:calc(100% - 56px); }
}
@media(max-width:850px) {
  .sidebar { height:auto; min-height:73px; padding:13px 20px; gap:20px; }
  .brand>span:last-child { display:block; }
  .brand small { display:none; }
  nav { margin:0; flex:1; overflow-x:auto; scrollbar-width:none; }
  nav a { font-size:12px; padding:9px 11px; }
  nav a .nav-icon { width:16px; height:16px; }
  nav a>.nav-count { display:none; }
  .workspace { margin:0; }
  .overview-side { grid-template-columns:1fr 1fr; }
  .topbar { padding:0 24px; }
  main { padding:24px 24px 45px; }
  .hero-meta { gap:14px; }
  .social-grid { grid-template-columns:1fr; }
  #toast { left:50%; }
  #update-banner { left:50%; right:auto; }
}
@media(max-width:620px) {
  .sidebar { position:sticky; flex-wrap:wrap; padding:14px 16px 9px; gap:12px; }
  .brand { width:100%; justify-content:flex-start; gap:9px; }
  .brand-mark { width:auto; height:auto; line-height:1; font-size:25px; }
  nav { width:100%; gap:3px; }
  nav a { padding:8px 10px; font-size:12px; gap:6px; }
  .topbar { height:47px; padding:0 18px; }
  .breadcrumb,.connection { font-size:10px; }
  main { padding:22px 18px 38px; }
  h1 { font-size:26px; }
  .page-heading p { font-size:12px; max-width:290px; }
  .page-actions button { font-size:11px; }
  .hero-stat { padding:21px; }
  .hero-number { font-size:42px; }
  .hero-stat p,.hero-meta small { font-size:11px; }
  .hero-meta { font-size:12px; }
  .metric { min-height:128px; padding:16px; }
  .metric-header { font-size:11px; }
  .metric-value { font-size:28px; }
  .metric small { font-size:10px; }
  .overview-side { grid-template-columns:1fr; }
  .panel-header,.panel-body,.social-card { padding:19px; }
  .panel-header p { font-size:11px; }
  .social-stats { gap:22px; }
  .social-stats small { font-size:9px; }
  .avatar-grid { gap:10px; }
  .profile-top { padding:21px; }
  .profile-top h2 { font-size:18px; }
  .profile-top p { font-size:11px; }
  .profile-tabs button { padding:9px 11px; font-size:11px; }
  .profile-body { padding:0 20px 23px; }
  footer { width:calc(100% - 36px); font-size:10px; flex-wrap:wrap; gap:6px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}
.config-panel { margin:20px 0; }
.config-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(180px,.7fr); gap:24px; padding:17px 0; border-bottom:1px solid var(--line); }
.config-row:first-child { padding-top:0; }
.config-row:last-child { border-bottom:0; padding-bottom:0; }
.config-row label { display:grid; gap:9px; }
.config-row code { color:#888; font-size:11px; overflow-wrap:anywhere; }
.config-row input,.config-row select,.config-row textarea { width:100%; }
.config-row textarea { resize:vertical; background:#111; color:var(--text); border:1px solid var(--line); border-radius:9px; padding:11px; font:inherit; }
.config-help { align-self:center; }
.config-help p { color:#999; font-size:12px; margin:9px 0; }
.config-help button { margin:3px 6px 0 0; font-size:11px; }
.config-savebar { display:flex; gap:16px; align-items:center; margin:20px 0; flex-wrap:wrap; }
.config-advanced summary { padding:20px; cursor:pointer; }
@media(max-width:650px) { .config-row { grid-template-columns:1fr; gap:10px; } }
.message-server-controls { border-top:1px solid var(--line); margin-top:15px; padding-top:8px; }
.server-scan-controls { border-top:1px solid var(--line); margin-top:15px; padding-top:8px; }
.message-toolbar { align-items:center; flex-wrap:wrap; margin:22px 0; }
.message-toolbar label { display:flex; align-items:center; gap:12px; }
.message-toolbar select { max-width:320px; }
.message-profile { margin:24px 0; }
.message-profile h2 { margin:0 0 4px; }
.message-profile .social-header { align-items:center; gap:14px; }
.message-profile .social-header button { margin-left:auto; }
.message-card { padding:22px; margin:14px 0; }
.message-card header { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.message-card header .avatar { width:32px; height:32px; }
.message-card header p { margin:3px 0 0; color:#999; font-size:12px; }
.message-card header time { margin-left:auto; color:#888; font-size:12px; }
.message-text { white-space:pre-wrap; overflow-wrap:anywhere; font-size:14px; line-height:1.65; }
.custom-emoji { display:inline; white-space:nowrap; }
.custom-emoji img { display:inline; object-fit:contain; vertical-align:-5px; }
.custom-emoji img[hidden] { display:none; }
.emoji-fallback { font-size:inherit; color:inherit; }
.message-mention { display:inline; padding:1px 4px; border:0; border-radius:4px; background:#202027; color:#dedeea; font:inherit; line-height:inherit; text-align:left; white-space:normal; vertical-align:baseline; }
.message-mention span { color:#aaaab8; }
.message-mention:hover,.message-mention:focus-visible { background:#32323d; color:#fff; }
.server-accounts { border-top:1px solid var(--line); padding-top:14px; margin-top:14px; }
.server-accounts summary { cursor:pointer; font-size:12px; }
.server-account { display:flex; align-items:center; gap:11px; padding:13px 0; border-bottom:1px solid var(--line); }
.server-account:last-child { border-bottom:0; }
.server-account .avatar { width:34px; height:34px; flex-shrink:0; }
.server-account p { margin:4px 0; font-size:11px; }
.server-account small { color:#888; font-size:10px; line-height:1.6; }
.server-account button { margin-left:auto; padding:6px 8px; font-size:11px; }
.server-account-actions { display:flex; flex-direction:column; align-items:flex-end; gap:7px; }
.message-reply { margin:12px 0; border-left:2px solid #444; padding:8px 14px; background:#111; color:#aaa; font-size:12px; }
.message-reply p { margin:4px 0; max-height:120px; overflow:auto; }
.message-meta { display:flex; gap:15px; flex-wrap:wrap; color:#888; font-size:11px; margin-top:18px; }
.message-files { display:flex; flex-wrap:wrap; gap:8px; }
.message-media { display:flex; flex-wrap:wrap; gap:12px; }
.message-media-item { display:flex; flex-direction:column; align-items:flex-start; gap:9px; margin:10px 0; padding:12px; border:1px solid var(--line); border-radius:12px; max-width:min(100%,480px); min-width:0; overflow:hidden; }
.message-media-item img,.message-media-item video { display:block; max-width:100%; max-height:360px; width:auto; height:auto; object-fit:contain; background:#080808; border-radius:7px; }
.message-media-item video { width:420px; }
.message-media-item [hidden] { display:none; }
.message-media-item figcaption,.message-media-item small { font-size:11px; color:#999; overflow-wrap:anywhere; }
.message-media-item button { max-width:100%; white-space:normal; }
.message-reply .message-media-item { max-width:280px; }
.message-reply .message-media-item img,.message-reply .message-media-item video { max-height:180px; }
.message-stickers { display:flex; flex-wrap:wrap; gap:12px; }
.message-sticker { display:inline-flex; flex-direction:column; align-items:center; gap:8px; padding:10px; margin:10px 8px 10px 0; border:1px solid var(--line); border-radius:12px; max-width:200px; font-size:12px; overflow-wrap:anywhere; }
.message-sticker img { width:160px; height:160px; object-fit:contain; }
.message-sticker img[hidden],.sticker-fallback[hidden] { display:none; }
.message-sticker small { color:#999; font-size:10px; display:block; }
.sticker-fallback { line-height:1.7; padding:12px; }
.message-file { display:inline-flex; align-items:center; gap:8px; background:#171717; border:1px solid var(--line); border-radius:8px; padding:8px 11px; font-size:12px; overflow-wrap:anywhere; }
.message-file small { color:#888; }
.message-versions { margin-top:18px; border-top:1px solid var(--line); padding-top:12px; }
.message-versions summary { cursor:pointer; font-size:12px; }
.message-edit { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:18px 0; border-bottom:1px solid var(--line); }
.message-edit time { grid-column:1/-1; color:#888; font-size:11px; }
.message-edit small { color:#888; font-size:10px; }
.message-edit p { margin:8px 0; }
.message-pagination { display:flex; align-items:center; justify-content:center; gap:20px; padding:22px 0; }
.message-pagination span { color:#888; font-size:12px; }
.media-hub-nav { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:24px; }
.media-hub-nav a { display:flex; align-items:center; gap:13px; padding:18px; border:1px solid #292929; border-radius:13px; background:#101010; text-decoration:none; color:#aaa; }
.media-hub-nav a:hover { background:#1a1a1a; color:#eee; }.media-hub-nav a[aria-current="page"] { border-color:#777; color:#fff; background:#1b1b1b; }
.media-hub-nav strong,.media-hub-nav small { display:block; }.media-hub-nav strong { font-size:13px; font-weight:600; }.media-hub-nav small { margin-top:5px; color:#888; font-size:11px; }
.media-hub-nav .icon { width:22px; height:22px; flex:none; }
.media-results-heading { margin-top:30px; }.media-files-filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.media-files-filters button[aria-pressed="true"] { background:#272727; color:#fff; border-color:#777; }
.media-files-filters[hidden],#media-download-section[hidden],#media-edit-section[hidden] { display:none; }
@media(max-width:650px) { .media-hub-nav { gap:7px; }.media-hub-nav a { padding:13px 9px; gap:7px; flex-direction:column; align-items:flex-start; }.media-hub-nav strong { font-size:11px; }.media-hub-nav small { font-size:9px; line-height:1.5; } }
.media-layout { display:grid; grid-template-columns:minmax(300px,.9fr) minmax(360px,1.1fr); gap:20px; align-items:start; }
.media-effect-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; padding:18px; }
.media-effect { display:flex; flex-direction:column; align-items:stretch; gap:7px; padding:8px; text-align:left; border-radius:12px; background:#101010; min-width:0; }
.media-effect canvas { width:100%; aspect-ratio:8/5; border-radius:7px; }
.media-effect strong { font-size:12px; padding:0 2px; }
.media-effect small { font-size:9px; line-height:1.5; color:#929292; padding:0 2px; }
.media-effect[aria-pressed="true"],.media-shapes button[aria-pressed="true"],.media-segments button[aria-pressed="true"] { border-color:#ddd; background:#242424; }
.media-upload { display:grid; gap:12px; border:1px dashed #454545; background:#131313; padding:20px; border-radius:12px; }
.media-upload input { width:100%; font-size:12px; }
.media-link { margin-top:16px; }.media-link summary { cursor:pointer; color:#aaa; font-size:12px; margin-bottom:14px; }
.media-link label { display:grid; gap:8px; margin-bottom:10px; }
.media-preview { display:flex; justify-content:center; overflow:hidden; border-radius:12px; border:1px solid #292929; }
.checkerboard { background-color:#1d1d1d; background-image:linear-gradient(45deg,#303030 25%,transparent 25%),linear-gradient(-45deg,#303030 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#303030 75%),linear-gradient(-45deg,transparent 75%,#303030 75%); background-size:24px 24px; background-position:0 0,0 12px,12px -12px,-12px 0; }
.media-preview canvas { display:block; width:100%; max-height:460px; object-fit:contain; }
#media-source-video video { display:block; width:100%; max-height:280px; margin-top:12px; border-radius:10px; background:#090909; }
#media-controls { display:grid; gap:15px; margin:22px 0; }#media-controls label { display:grid; gap:8px; font-size:12px; }
#media-controls fieldset { border:0; padding:0; margin:0; min-width:0; }#media-controls legend { color:#aaa; font-size:11px; margin-bottom:9px; }
.media-shapes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.media-shapes button { display:grid; gap:8px; padding:12px 8px; font-size:11px; text-transform:capitalize; }.media-shapes img { width:100%; height:48px; object-fit:fill; background:#434343; border-radius:4px; }
.media-segments { display:flex; gap:8px; }.media-segments button { flex:1; text-transform:capitalize; }
#media-controls .media-check { display:flex; align-items:center; gap:9px; }.media-check input { width:auto; }
.media-number-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media(max-width:1000px) { .media-layout { grid-template-columns:1fr; }.media-effect-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media(max-width:550px) { .media-effect-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; padding:12px; }.media-effect { padding:5px; }.media-effect small { font-size:8px; }.media-effect strong { font-size:10px; }.media-number-grid { grid-template-columns:1fr; } }
@media(max-width:650px) { .message-card { padding:15px; } .message-card header { flex-wrap:wrap; } .message-edit { grid-template-columns:1fr; } .message-toolbar select { max-width:230px; } }