/* ============================================================================
 * uw-winbox-profile.css
 * 《放置：宇宙大战》卡通风格双主题 —— WinBox子弹窗 + 个人资料/深空会员
 *
 * 本文件从 uw-theme.css 拆分而来（2026-11-03），原始单文件 5204 行。
 * 拆分后由 index.html 逐个 <link> 引入，加载顺序必须保持变量文件在最前。
 * 所有规则只引用 uw-variables.css 里定义的 CSS 变量，不硬编码颜色。
 * ==========================================================================*/

/* ============================================================================
 * WinBox 内的「子弹窗」定位修复（2026-10-10）
 * ----------------------------------------------------------------------------
 * 现象：页面被以 WinBox 浮动窗口打开时（如「造船」），页内弹窗（编辑蓝图 / 同步蓝图 /
 *   星球重命名…）会跟着页面滚动一起滚出窗口 —— 往下滚去看「仓库战舰」再点「同步蓝图」，
 *   弹窗就跑到窗口外面去了（实测 wb-body.scrollTop=310 时遮罩 y 由 95 → -215，
 *   弹窗 y 由 19 → -291，整个移出 980×640 的窗口）。
 *
 * 根因：winbox.min.css 给 .wb-body 设了 `contain: strict`（= size layout paint style）。
 *   contain 的 layout / paint 会让该元素成为 **fixed 后代的包含块**，而 .wb-body 又是滚动容器
 *   → `position: fixed` 的 .uw-modal-mask 实际被当成「相对 wb-body 的 absolute」，随内容一起滚。
 *   同时弹窗的 max-height 写的是 100vh（= 视口高度），于是「位置按窗口算、高度按视口算」，
 *   组件一多就顶穿窗口标题栏。
 *
 * 修法：摘掉 .wb-body 的 layout / paint 包含块（保留 size / style，不影响 WinBox 自身尺寸与滚动）。
 *   包含块随即上移到 .winbox（它自带 `contain: layout size`，且 overflow: hidden 不可滚动）
 *   → 遮罩恒贴住窗口、弹窗按窗口可视区居中、与页面滚动彻底无关；窗口拖动/最大化时自动跟随。
 *   本主题 css 早于 winbox.bundle.css 注入 → 必须 !important 才能压过库里的 contain: strict。
 *
 * 兼容：若日后 WinBox 不再设 contain，遮罩会退回「相对视口」的普通全屏遮罩 ——
 *   依旧不随页面滚动，只是遮罩范围变成整屏，不会退化回旧 bug。
 * ========================================================================== */
.winbox .wb-body {
    contain: size style !important;
}

/* 蓝图设计/编辑弹窗：高度按遮罩（= 宿主窗口可视区）收敛；头部与底部按钮固定，只有中间配置区滚动。
   universe-war.css 原本写的 max-height: calc(100vh - 48px) 在窗口里是按视口算的，会顶出窗口标题栏。 */
.uw-blueprint-modal {
    max-height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.uw-blueprint-modal .uw-modal-head {
    flex: none;
}

.uw-blueprint-modal .uw-blueprint-designer {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.uw-blueprint-modal .uw-modal-actions {
    flex: none;
}

/* 同步蓝图选船弹窗：遮罩补内边距，弹窗不贴窗口边缘 */
.uw-sync-mask {
    padding: 20px;
}

/* ==========================================================================
 * 个人资料 · 深空会员（2026-10-12）
 * 概况页展示会员卡型 / 到期时间 / 剩余天数，右侧挂「!」查看权益明细。
 * 浮层策略：桌面 hover「!」自动显示（position:absolute，锚定卡片下沿右对齐）；
 *           ≤768px 改为卡片内整行展开的静态块（触屏无 hover，靠点「!」切换 .open），
 *           这样窄屏既不会右侧出界、也不会被 overflow 裁掉。
 * 颜色全部走 --uw-* / 游戏化层变量 → 白天与夜间自动适配，不写死颜色。
 * ========================================================================== */
.uw-profile-membership {
    position: relative;                 /* 「!」浮层的定位基准 */
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    background-color: var(--uw-color-bg-tertiary);
    border: 2px solid var(--uw-ink-soft);
    border-left-color: var(--uw-color-warning);   /* 会员金左侧色条：本区块只在会员生效时渲染 */
    border-radius: var(--uw-r-md);
    box-shadow: 0 3px 0 var(--uw-shade);
    padding: 10px 12px;
    font-size: 12px;
    color: var(--uw-color-text-secondary);
}

.uw-membership-type {
    font-weight: 700;
    color: var(--uw-color-warning);
    border: 1px solid var(--uw-color-warning);
    border-radius: 999px;
    padding: 1px 10px;
}

.uw-membership-expire b,
.uw-membership-remain b { color: var(--uw-color-text-primary); }
.uw-membership-remain { color: var(--uw-color-warning); }

/* 「!」触发器 */
.uw-tip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border: 1px solid var(--uw-color-warning);
    border-radius: 50%;
    color: var(--uw-color-warning);
    font-size: 11px;
    line-height: 1;
    cursor: help;
    user-select: none;
}

.uw-tip:hover { background-color: var(--uw-color-bg-secondary); }

/* 权益浮层 */
.uw-tip-panel {
    display: none;
    position: absolute;
    z-index: 60;
    top: calc(100% + 8px);
    right: 12px;
    width: 320px;
    max-width: min(320px, 86vw);
    text-align: left;
    background-color: var(--uw-color-bg-secondary);
    color: var(--uw-color-text-secondary);
    border: 2px solid var(--uw-ink-soft);
    border-radius: var(--uw-r-md);
    padding: 10px 12px;
    font-size: 12px;
    line-height: 1.6;
    box-shadow: 0 6px 16px var(--uw-shade);
}

/* 显示规则：桌面（>768px）用 hover 自动弹；点「!」切换的 .open 两端通用。
   ⚠️ 浮层是 .uw-tip 的**相邻兄弟**（不是子元素）——必须用 `+` 相邻兄弟选择器；
   且在移动端必须彻底关掉 hover 分支：触屏 tap 会留下粘滞 :hover，
   与 .open 打架会出现「点一下反而收起」。 */
@media (min-width: 769px) {
    .uw-tip:hover + .uw-tip-panel { display: block; }
}

.uw-tip-panel.open { display: block; }

.uw-tip-title {
    display: block;
    margin-bottom: 6px;
    font-weight: 700;
    color: var(--uw-color-text-primary);
}

.uw-tip-row {
    display: block;
    position: relative;
    padding-left: 12px;
}

.uw-tip-row::before {
    content: "·";
    position: absolute;
    left: 2px;
    color: var(--uw-color-warning);
}

.uw-tip-row b { color: var(--uw-color-text-primary); }

.uw-tip-note {
    display: block;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px dashed var(--uw-ink-soft);
    color: var(--uw-color-text-muted);
    font-size: 11px;
}

/* 移动端：不出现「!」，权益直接常驻展开（占卡片内一整行）；
   浮层标题与区块标题重复，隐藏掉，只剩条目本身。
   ⚠️ hover 分支已被 min-width 媒体查询限制在桌面 —— 触屏的粘滞 :hover 不会来捣乱。 */
@media (max-width: 768px) {
    .uw-tip { display: none; }

    .uw-tip-panel {
        display: block;
        position: static;
        width: auto;
        max-width: none;
        flex-basis: 100%;
        margin-top: 2px;
        background-color: transparent;
        border: 0;
        padding: 0;
        box-shadow: none;
    }

    .uw-tip-title { display: none; }

    .uw-tip-row { padding-left: 0; }
    .uw-tip-row::before { content: none; }
}

/* ==========================================================================
 * 每日刷新倒计时（UwDailyReset 组件，2026-10-12）
 * 显示「距刷新 3 小时 12 分」，替掉"每天 00:00 / 次日重置"这类要玩家自己推算的口径
 * （海外玩家也不必把服务器时间换算成当地时间）。
 * 只给字号与文字色，弱化小字跟在主数值后面，不抢注意力。
 * ========================================================================== */
.uw-daily-reset {
    font-size: 11px;
    color: var(--uw-color-text-muted);
    white-space: nowrap;
}