/* =========================================================
   全站统一 UI 组件样式 (ui-kit.css) 【2026-10-11】
   - 由 app.py UI组件注入() 自动挂到所有 HTML 页面
   - 统一两种导航图标钮（杜绝五花八门的返回按钮）：
     · .ui-ico-btn[data-nav="home"]  → ⌂ 返回主页
     · .ui-ico-btn[data-nav="back"]  → ← 返回上一级
   - 40px 圆角方钮（手机 38px，满足 ≥27px 触控底线）；悬停金边高亮
   - 配合 悬停提示.js：鼠标悬停显示大字功能说明，触屏点按 toast 说明
   ========================================================== */
/* 【隐藏契约 2026-10-11】display 绝不能带 !important：
   本文件由 app.py 注入在页面内联样式之后，同特异度下本文件本就后到先胜，
   无需 !important；而 !important 会压过页面 .hidden{display:none!important}
   （同important、注入在后者胜）和内联 style="display:none"（样式表important>内联非important）
   → 隐形按钮"幽灵显示"（评测对弈页退出观战/结束后返回两钮永显挤占时钟、
   陪练页目录钮/返回主页钮显隐失灵、人机页全局返回钮藏不住）。 */
.ui-ico-btn {
    -webkit-appearance: none; appearance: none;
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; min-width: 40px; min-height: 40px;
    border-radius: 12px; padding: 0 !important; margin: 0;
    border: 1.5px solid rgba(255, 255, 255, .18);
    background: rgba(30, 41, 59, .85);
    color: #f1f5f9;
    font-size: 21px; font-weight: 700; line-height: 1;
    cursor: pointer; text-decoration: none;
    user-select: none; -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    flex: 0 0 auto;
    transition: border-color .15s ease, background .15s ease;
    box-sizing: border-box;
}
.ui-ico-btn:hover { border-color: #f8d17a; background: #334155; color: #fff; }
/* 用 filter 而非 transform 做按压反馈：不干扰页面自身对按钮的绝对定位 transform */
.ui-ico-btn:active { filter: brightness(1.35); }
.ui-ico-btn svg { width: 20px; height: 20px; display: block; }
/* 触屏/手机：38px 恒定（视觉≥27px 底线远超），禁长按系统菜单 */
@media (max-width: 640px), (hover: none) {
    .ui-ico-btn { width: 38px !important; height: 38px !important; min-width: 38px; min-height: 38px; font-size: 20px; }
    .ui-ico-btn svg { width: 19px; height: 19px; }
}

/* 【隐藏契约兜底 2026-10-11】双类特异度(0,2,0)确保压过 .ui-ico-btn 自身：
   页面用 .hidden 类隐藏图标钮时必须真的隐藏（部分页面未定义 .hidden 规则，
   仅靠页面样式不可靠 → 组件自带兜底）。 */
.ui-ico-btn.hidden { display: none !important; }