/**
 * starsalt 官网首页 · 主题补充样式
 * demo 的 style.css / topbar.css 保持原样不动，这里只补主题接入后才需要的少量规则。
 */

/* 官网使用完整商标，不能沿用控制台 30px 的方形图标规格。 */
.topbar--site { height: 76px; }
.topbar-brand { text-decoration: none; }
.topbar--site .topbar-brand .brand-logo {
    display: block;
    height: 56px;
    width: auto;
    max-width: 160px;
    object-fit: contain;
}
.topbar-brand-text { display: flex; flex-direction: column; }

/* 锚点定位和移动导航菜单均为加高后的固定顶栏留出空间。 */
section[id] { scroll-margin-top: 76px; }
.topbar--site .topbar-mobile-menu { top: 76px; }

/* 滚动后由整个顶栏承接底色与阴影，Logo 区不再像一张独立的白色卡片。 */
.topbar--site.scrolled {
    background: var(--nav-bg);
    border-bottom: 1px solid var(--card-border);
    box-shadow: 0 4px 24px var(--shadow-soft);
}
.topbar--site.scrolled .topbar-logo,
.topbar--site.scrolled .topbar-body {
    background: transparent;
    border-bottom-color: transparent;
    box-shadow: none;
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}

@media (max-width: 900px) {
    /* 移动端默认状态同样合并左右两个容器，避免 Logo 区出现独立白块。 */
    .topbar--site {
        background: var(--nav-bg);
        border-bottom: 1px solid var(--card-border);
        box-shadow: 0 4px 24px var(--shadow-soft);
    }
    .topbar--site .topbar-logo,
    .topbar--site .topbar-body {
        background: transparent;
        border-bottom-color: transparent;
        box-shadow: none;
    }
}

@media (max-width: 700px) {
    .topbar--site { height: 64px; }
    .topbar--site .topbar-brand .brand-logo {
        height: 46px;
        max-width: 132px;
    }
    section[id] { scroll-margin-top: 64px; }
    .topbar--site .topbar-mobile-menu { top: 64px; }
}

/* 顶栏 LOGO：当前主题沿用 demo 的品牌标记（星 + 星盐云），
   若要改成后台「网站参数 → 官网LOGO」的图片，把 index.html 顶栏的
   .sidebar-brand-icon/.topbar-brand-text 换成
   <img class="brand-logo" src="{$data.config.official_website_logo}" alt=""> 即可。 */

/* 装饰性的侧边 HUD 代码块在 <=1400 会压到标题/立绘，窄屏直接隐藏 */
@media (max-width: 1400px) {
    .hud-code { display: none; }
}