/* AiKey pages (home, sign-in, sign-up, people admin): the platform's orange on the shared look.
   The cloud browser's own pages keep their blue. */
:root {
  --primary: #ea5a17;
  --primary-2: #d24d10;
  --primary-soft: #fff0e7;
  --ring: 0 0 0 3px rgba(234, 90, 23, .25);
  --bg-grad: radial-gradient(1200px 500px at 50% -200px, #ffe6d8 0%, rgba(255, 230, 216, 0) 70%);
}
@media (prefers-color-scheme: dark) {
  :root {
    --primary: #ff7a3d;
    --primary-2: #ff8d57;
    --primary-soft: #3a2418;
    --ring: 0 0 0 3px rgba(255, 122, 61, .3);
    --bg-grad: radial-gradient(1200px 500px at 50% -200px, #3a2216 0%, rgba(58, 34, 22, 0) 70%);
  }
}
.ak-logo { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; font-size: 20px; letter-spacing: -.02em; color: var(--text); text-decoration: none; }
.ak-logo img { width: 30px; height: 30px; border-radius: 8px; }
.ak-logo b { color: var(--primary); font-weight: 800; }
.ak-links { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 14px; font-size: 14px; }
.ak-links a { color: var(--primary); text-decoration: none; font-weight: 600; }
.ak-links a:hover { text-decoration: underline; }

/* Top bar and "me" menu shared by the AiKey pages (aikey-shell.js). */
.ak-nav { display: flex; gap: 4px; }
.ak-nav a { padding: 7px 12px; border-radius: 9px; color: var(--muted); font-weight: 600; font-size: 14px; text-decoration: none; white-space: nowrap; }
.ak-nav a:hover { color: var(--text); background: var(--card-2); }
.ak-nav a.on { color: var(--primary); background: var(--primary-soft); }
.me-btn { display: flex; align-items: center; gap: 8px; padding: 0 6px 0 4px; min-height: 40px; border-radius: 99px; border: 1px solid transparent; background: transparent; }
.me-btn:hover { background: var(--card-2); border-color: transparent; }
.me-btn .nm { max-width: 120px; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.me-btn .avatar { background: linear-gradient(135deg, #ff9a66, #ea5a17); }
.menu-pop { position: absolute; right: 16px; top: calc(100% + 6px); min-width: 220px; background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-lg); padding: 6px; animation: pop .15s ease-out; z-index: 30; }
.menu-pop .who { padding: 10px 12px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.menu-pop .who b { display: block; }
.menu-pop button { width: 100%; justify-content: flex-start; border: 0; background: transparent; min-height: 42px; color: var(--text); }
.menu-pop button:hover { background: var(--card-2); }
.menu-pop button.danger { color: var(--danger); }
@media (max-width: 600px) { .me-btn .nm { display: none; } .ak-logo span { display: none; } .ak-nav a { padding: 7px 9px; } }