/* Afina design system — single stylesheet for the whole application.
   Tokens first, then shell, shared components, and one section per page. */

/* ---------- Tokens ---------- */
:root {
  color-scheme: light;
  --bg: #f4f5f8;
  --surface: #ffffff;
  --surface-2: #f6f7f9;
  --surface-3: #eceef2;
  --border: #e4e7ec;
  --border-strong: #d2d6de;
  --text: #111827;
  --text-2: #4b5563;
  --text-3: #8a919e;
  --accent: #3d5afe;
  --accent-hover: #2f4ae6;
  --accent-soft: #eef1ff;
  --accent-text: #2f47d6;
  --on-accent: #ffffff;
  --pos: #12a150;
  --pos-soft: #e7f6ee;
  --neu: #e0a106;
  --neu-soft: #fdf5e1;
  --neg: #e5484d;
  --neg-soft: #fdecec;
  --tg: #229ed9;
  --ig: #d6336c;
  --site: #6366f1;
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, .05);
  --shadow: 0 1px 3px rgba(16, 24, 40, .06), 0 4px 12px rgba(16, 24, 40, .04);
  --shadow-lg: 0 12px 40px rgba(16, 24, 40, .16);
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
  --sidebar-w: 248px;
  --header-h: 60px;
  --font: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --ease: cubic-bezier(.2, .7, .3, 1);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0d1015;
  --surface: #151920;
  --surface-2: #1a1f27;
  --surface-3: #222833;
  --border: #252b35;
  --border-strong: #323a46;
  --text: #e9ecf1;
  --text-2: #a9b1bd;
  --text-3: #6e7785;
  --accent: #7088ff;
  --accent-hover: #8599ff;
  --accent-soft: rgba(112, 136, 255, .14);
  --accent-text: #9aabff;
  --on-accent: #0d1015;
  --pos: #3ccf83;
  --pos-soft: rgba(60, 207, 131, .13);
  --neu: #f5b83d;
  --neu-soft: rgba(245, 184, 61, .13);
  --neg: #ff6b6f;
  --neg-soft: rgba(255, 107, 111, .13);
  --tg: #3cb2ea;
  --ig: #f0679a;
  --site: #8b8ef8;
  --shadow-sm: none;
  --shadow: 0 0 0 1px rgba(0, 0, 0, .1);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, .5);
}


/* Adapt Afina's existing tokens to the research application's components. */
:root,body.afina-view,:root[data-theme="dark"] body.afina-view {
 --panel:var(--surface);--muted:var(--text-2);--line:var(--border);
 --primary:var(--accent);--primary-hover:var(--accent-hover);--soft:var(--accent-soft);
 --sidebar:var(--surface);--sidebar-text:var(--text-2);
 --positive:var(--pos);--positive-bg:var(--pos-soft);--negative:var(--neg);--negative-bg:var(--neg-soft);
 --neutral:var(--neu);--neutral-bg:var(--neu-soft);
 font-family:var(--font);
}

body{font-family:var(--font);-webkit-font-smoothing:antialiased}
.sidebar{width:248px;background:var(--surface);border-right:1px solid var(--border);padding:24px 14px 18px;color:var(--text-2)}
.brand{color:var(--text);padding:0 12px 30px;gap:10px}.brand strong{font-size:21px;font-weight:800}.brand small{color:var(--text-3);font-size:9px;letter-spacing:.6px}
.nav-caption{color:var(--text-3);letter-spacing:.06em}.nav a{color:var(--text-2);font-weight:500;border-radius:10px;min-height:42px;font-size:13px}
.nav a:hover{background:var(--surface-2);color:var(--text)}
.nav a.active,body.afina-view .nav a.active{background:var(--accent-soft);color:var(--accent-text);font-weight:600}
.nav a.active:before,body.afina-view .nav a.active:before{display:none}
.nav-divider{background:var(--border);margin:20px 10px}.sidebar-bottom{border-top:1px solid var(--border)}.local-indicator,.sidebar-bottom p{color:var(--text-3)}.dot{background:var(--pos)}
.shell{margin-left:248px}.topbar{height:60px;padding:0 32px;background:var(--surface)}
.main,body.afina-view .main{max-width:1480px;padding:28px 32px 48px}.page-heading h1{font-size:26px;font-weight:700;letter-spacing:-.02em}.eyebrow{color:var(--text-3)}
.btn{border-radius:10px;font-size:13px;min-height:38px;padding:8px 16px}.btn.primary,:root[data-theme="dark"] .btn.primary{color:var(--on-accent)}
.btn:hover{border-color:var(--border-strong)}.icon-button{border:0;border-radius:10px;color:var(--text-2)}
.icon{width:18px;height:18px;stroke:none;fill:currentColor}.icon[fill="none"]{fill:none;stroke:currentColor}
.au-page{--au-accent:var(--accent-text);--au-soft:var(--accent-soft)}
.au-toolbar{border-radius:16px;box-shadow:var(--shadow-sm)}.au-toolbar-head h1>svg{color:var(--accent)}
.au-user-row{border-radius:12px;box-shadow:var(--shadow-sm);min-height:80px}.au-user-row:hover{border-color:var(--accent);box-shadow:none}
.au-primary{background:var(--accent);color:var(--on-accent)}.au-chips button.active{color:var(--accent-text);background:var(--accent-soft);border-color:var(--accent-soft)}
.au-search:focus-within{border-color:var(--accent)}.au-profile,.au-comment-filters,.au-comments{border-radius:16px}
.au-demo{background:var(--surface-2);border-color:var(--border);color:var(--text-2)}
.au-page :is(button,a,input,select,summary):focus-visible,:focus-visible{outline-color:var(--accent)}
.login-branding{background:var(--accent);color:var(--on-accent)}
@media(max-width:1024px){.sidebar{transform:translateX(-100%)}body.nav-open .sidebar{transform:translateX(0)}.shell{margin-left:0}.mobile-menu{display:inline-flex}.topbar{padding:0 16px}.main,body.afina-view .main{padding:24px 20px 40px}body.nav-open .nav-overlay{display:block}}
@media(max-width:720px){.main,body.afina-view .main{padding:20px 16px 40px}.btn,.icon-button{min-height:44px}.au-toolbar{padding:16px}.topbar{height:60px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.au-page .au-primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}

/* Login panel uses a fixed contrasting palette in both themes. */
.login-branding{background:#3d5afe;color:#fff}
.login-branding .brand,.login-branding .brand strong,.login-description h1{color:#fff}
.login-branding .brand small,.login-description p,.login-description .eyebrow,.login-footer{color:#edf0ff}
.login-emblem{color:#c8d1ff}
.login-form-wrap,.login-branding{min-width:0}
@media(max-width:720px){.login-screen{grid-template-columns:minmax(0,1fr)}.login-form{width:100%;max-width:420px}}

.login-emblem{width:112px;height:112px;margin:32px 0}.login-emblem img{display:block;width:100%;height:100%}

.au-avatar{position:relative;overflow:hidden}.au-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.au-user-count{font-variant-numeric:tabular-nums}

/* Numbered pagination keeps search and platform selection intact. */
.au-pagination{flex-wrap:wrap;gap:12px}.au-page-controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.au-page-controls button{min-width:42px;font-variant-numeric:tabular-nums}.au-page-controls button[aria-current=page]{background:var(--accent);border-color:var(--accent);color:#fff;opacity:1}.au-page-gap{padding:0 2px}.au-page-jump,.au-page-jump label{display:flex;align-items:center;gap:8px}.au-page-jump input{width:80px;min-width:0}.au-page-jump button{min-width:44px}
@media(max-width:720px){.au-pagination{align-items:flex-start}.au-pagination>span{width:100%}.au-pagination .au-page-controls{gap:4px}.au-page-controls button{min-width:36px;padding:8px}.au-page-jump{width:100%;justify-content:flex-end}}

.au-user-detail .au-detail-heading h1{font-size:22px;line-height:1.45}.au-user-detail .au-detail-heading h1>span{color:var(--accent);overflow-wrap:anywhere}.au-user-detail .au-profile{border-radius:12px;padding:22px;gap:20px}.au-user-detail .au-profile>.au-avatar{width:72px;height:72px;font-size:22px}.au-user-detail .au-profile-title h2{font-size:20px;overflow-wrap:anywhere}.au-detail-stats{margin-left:auto;display:flex;gap:28px;flex-shrink:0}.au-detail-stats>div{display:flex;flex-direction:column;gap:5px}.au-detail-stats strong{font-size:23px;font-variant-numeric:tabular-nums}.au-detail-stats span{font-size:12px;color:var(--muted)}.au-detail-sources{margin:24px 0}.au-detail-sources h2{font-size:14px;margin:0 0 12px}.au-detail-sources>div{display:flex;flex-wrap:wrap;gap:10px}.au-source-summary{display:flex;flex-direction:column;gap:7px;max-width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}.au-source-summary strong{font-size:12px;overflow-wrap:anywhere}.au-source-summary span{font-size:11px;color:var(--muted)}.au-user-detail .au-post-context p{font-size:14px;line-height:1.75;margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.au-comment-label{font-size:11px;color:var(--muted);margin-top:18px}.au-user-detail .au-comment>.au-avatar{width:32px;height:32px;font-size:11px}.au-user-detail .au-comment-content p{font-size:14px;white-space:pre-wrap}.au-user-detail .au-comment-group>header{flex-wrap:wrap}.au-user-detail .au-comment-group>header>strong{overflow-wrap:anywhere}.au-user-detail .au-comment-group>header>a{margin-left:auto;font-size:12px}
@media(max-width:720px){.au-user-detail .au-detail-heading h1{font-size:20px}.au-user-detail .au-profile{padding:16px;gap:12px}.au-user-detail .au-profile>.au-avatar{width:56px;height:56px}.au-detail-stats{width:100%;margin:4px 0 0;padding-top:14px;border-top:1px solid var(--line);gap:28px}.au-detail-stats strong{font-size:20px}.au-source-summary{width:100%}.au-user-detail .au-comment>.au-avatar{display:inline-flex}.au-user-detail .au-comment{gap:9px}.au-user-detail .au-comment-group>header>a{margin-left:0}}

.au-search-empty p{overflow-wrap:anywhere}.au-search-empty button{margin-top:8px}.au-search-empty .au-request-status{margin:16px auto 0;max-width:480px;line-height:1.6}