/* 外壳页账号层：顶栏最右的「登录」标签 + 居中弹窗（登录 / 注册 / 忘记密码）。
   样式只用 index.css 里已有的设计变量（--panel/--card/--line/--fg/--mut/--accent/--bone/--ff-*），
   不引入新色板 —— 顶栏与弹窗必须跟全站同一套皮肤（深浅色切换靠变量自动跟随）。 */

/* ── 顶栏那个标签 ──────────────────────────────────────────────────
   未登录：描边小控件（与「中文 / 浅色」同族，但用 --fg 提亮，一眼能找到）
   已登录：**圆形头像**（用户名只留在 title / 个人主页，不再铺在顶栏） */
/* 论坛 Tab 现在是**内嵌**的普通 `.tab` 按钮（走 index.nav.js 的 EXTERNAL_TABS），
   下面这条 `a.tab` 只是保险：万一以后又放回外链形态，`<a>` 需要补这两条按钮自带的属性。 */
a.tab{display:inline-flex;align-items:center;text-decoration:none}
.shell-actions{position:relative}

.auth-entry{min-width:44px;min-height:44px;color:var(--fg);border-color:var(--line);background:var(--card);font-weight:800}
.auth-entry:hover{color:#0a0a0b;background:var(--accent);border-color:var(--accent)}
/* 已登录：按钮里是圆形头像。**去掉**实心底色与 accent 实心 hover ——
   底色会在头像后面留一个方块，hover 的实心橙更会直接把头像糊没。 */
.auth-entry.on{display:inline-flex;align-items:center;justify-content:center;
  color:var(--fg);background:transparent;border-color:transparent;padding:0 5px}
.auth-entry.on:hover{background:var(--card);border-color:var(--line)}
.auth-avatar{flex:0 0 auto;width:26px;height:26px;border-radius:50%;object-fit:cover;display:block;
  border:1px solid var(--line);background:var(--card)}
/* 没上传头像时的兜底：用户名首字圆片（同 Flarum 默认头像的意思） */
.auth-avatar--initial{display:flex;align-items:center;justify-content:center;
  font:700 12px var(--ff-europa);color:var(--fg);letter-spacing:0}
#auth-out{color:var(--mut)}
#auth-out[hidden]{display:none}
.auth-popover{display:none;position:absolute;right:0;top:calc(100% + 8px);width:min(270px,calc(100vw - 24px));padding:16px;z-index:40;
  background:var(--panel);border:1px solid var(--line);border-radius:12px;
  color:var(--fg)}
.auth-popover[hidden]{display:none}
.auth-popover.on{display:block}
.auth-popover::before{content:"";position:absolute;right:18px;top:-6px;width:10px;height:10px;
  background:var(--panel);border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg)}
.auth-popover-head{display:flex;align-items:center;gap:10px}
.auth-popover-avatar{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border-radius:50%;
  background:var(--card);color:var(--fg);font:800 17px var(--ff-display);overflow:hidden}
.auth-popover-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.auth-popover-head strong{display:block;font:800 15px var(--ff-display);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:185px}
.auth-popover-head small{display:block;margin-top:4px;color:var(--mut);font:400 12px var(--ff-body);font-variant-numeric:tabular-nums}
.auth-popover-actions{display:grid;gap:8px;margin-top:16px}
.auth-popover-actions button,.auth-popover-actions a{display:flex;align-items:center;justify-content:center;min-height:44px;border:1px solid var(--line);border-radius:7px;background:var(--card);color:var(--fg);text-decoration:none;
  font:700 12px var(--ff-europa);cursor:var(--cur-hover)}
.auth-popover-actions button:first-child{border-color:var(--accent);color:var(--accent)}
.auth-popover-actions button:hover,.auth-popover-actions a:hover{background:var(--hover);border-color:var(--accent)}
.auth-popover-actions [hidden]{display:none}

@media (hover:none), (pointer:coarse), (max-width:560px){
  .auth-popover{position:fixed;top:62px;right:12px;max-height:calc(100dvh - 80px);overflow:auto}
}
/* The account summary reads the same live XP state as daily check-in. */
.auth-popover-xp{margin:0 14px 12px;color:var(--fg)}
.auth-popover-xp-head{display:flex;justify-content:space-between;gap:12px;font-size:13px;font-variant-numeric:tabular-nums}
.auth-popover-xp strong{color:var(--accent)}
.auth-popover-xp progress{display:block;width:100%;height:6px;margin:8px 0;appearance:none;border:0;border-radius:6px;overflow:hidden;background:var(--line)}
.auth-popover-xp progress::-webkit-progress-bar{background:var(--line)}
.auth-popover-xp progress::-webkit-progress-value{background:var(--accent);border-radius:6px}
.auth-popover-xp progress::-moz-progress-bar{background:var(--accent)}
.auth-popover-xp small{color:var(--mut);font-size:12px}
