/* =====================================================
   TouDY 个人化增强样式（收藏 / 观影记录 / 今日上新 / 浮動鈕 / 留言浮層 / 个人中心）
   配色沿用站点主色：青绿 #25FEB3 / #12c98c，深色底 #14171b
   ===================================================== */

/* ---------- 首页：继续观看 / 今日上新 区块 ---------- */
.home-block .block-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.home-block .block-title { font-size: 17px; font-weight: 700; color: #f1f3f5; margin: 0; display: flex; align-items: center; gap: 8px; }
.home-block .badge-count {
    font-size: 12px; font-weight: 600; color: #0c1411;
    background: linear-gradient(135deg, #25FEB3, #12c98c);
    border-radius: 999px; padding: 2px 9px; line-height: 1.6;
}
.home-block .list .img-grid { position: relative; border-radius: 8px; overflow: hidden; }

/* ---------- 详情页：收藏按钮 ---------- */
.fav-row { margin: 10px 0 4px; }
.fav-btn {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 8px 16px; border-radius: 999px; cursor: pointer;
    background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.16);
    color: #e9eaec; font-size: 14px; font-family: inherit;
    transition: background .15s, border-color .15s, color .15s, transform .12s;
}
.fav-btn:hover { border-color: rgba(37,254,179,.5); color: #fff; }
.fav-btn:active { transform: scale(.96); }
.fav-btn svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; }
.fav-btn.active {
    background: rgba(37,254,179,.14); border-color: rgba(37,254,179,.6); color: #25FEB3;
}
.fav-btn.active svg { fill: #25FEB3; stroke: #25FEB3; }

/* ---------- 浮动按钮：留言求片 + 回到顶部 ---------- */
.fab {
    position: fixed; z-index: 2147482990; width: 52px; height: 52px;
    border-radius: 50%; border: none; cursor: pointer; display: flex;
    align-items: center; justify-content: center; color: #0c1411;
    background: linear-gradient(135deg, #25FEB3, #12c98c);
    box-shadow: 0 8px 22px rgba(37,254,179,.32);
    transition: transform .18s ease, box-shadow .18s ease, opacity .2s ease;
}
.fab:hover { transform: translateY(-3px) scale(1.04); box-shadow: 0 12px 30px rgba(37,254,179,.42); }
.fab:active { transform: translateY(-1px) scale(.97); }
.fab:focus-visible { outline: 2px solid rgba(37,254,179,.9); outline-offset: 3px; }
.fab svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* 留言求片：右下竖向轨道，置于 AI 球上方（AI 球移动端 bottom:72px） */
.fab-request { right: 16px; left: auto; bottom: calc(138px + env(safe-area-inset-bottom, 0px)); }
/* 回到顶部：右下轨道最上方，滚动时出现 */
.fab-totop {
    right: 16px; bottom: calc(204px + env(safe-area-inset-bottom, 0px));
    background: #1b1f24; color: #cfd4da; border: 1px solid #2a2f34;
    box-shadow: 0 8px 22px rgba(0,0,0,.4); opacity: 0; pointer-events: none;
}
.fab-totop.show { opacity: 1; pointer-events: auto; }
.fab-totop:hover { color: #fff; background: #20262b; }

@media (min-width: 769px) {
    /* 桌面端：三条浮钮统一右对齐竖向轨道（AI 球 right:24 bottom:24） */
    .fab-request { right: 24px; left: auto; bottom: 90px; }
    .fab-totop { right: 24px; bottom: 156px; }
}

/* ---------- 留言求片浮層 ---------- */
.request-modal {
    position: fixed; inset: 0; z-index: 2147482995; display: none;
    align-items: center; justify-content: center; padding: 20px;
}
.request-modal.open { display: flex; }
.request-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.66); backdrop-filter: blur(2px); }
.request-dialog {
    position: relative; width: 100%; max-width: 420px; background: #16191d;
    border: 1px solid #26292d; border-radius: 16px; padding: 22px 20px 20px;
    box-shadow: 0 20px 60px rgba(0,0,0,.6); font-family: inherit; color: #e9eaec;
    animation: request-pop .26s cubic-bezier(.22,.61,.36,1) both;
}
@keyframes request-pop { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
.request-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.request-head h3 { margin: 0; font-size: 17px; color: #f1f3f5; }
.request-close { width: 32px; height: 32px; border-radius: 9px; background: transparent; border: none; color: #9aa0a6; cursor: pointer; font-size: 18px; line-height: 1; }
.request-close:hover { background: #23272b; color: #ff6b6b; }
.request-field { margin-bottom: 13px; }
.request-field label { display: block; font-size: 13px; color: #9aa0a6; margin-bottom: 6px; }
.request-field input, .request-field textarea {
    width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid #2a2f34;
    background: #0f1216; color: #e9eaec; font-size: 14px; font-family: inherit; outline: none;
    transition: border-color .15s, box-shadow .15s;
}
.request-field input:focus, .request-field textarea:focus { border-color: rgba(37,254,179,.6); box-shadow: 0 0 0 3px rgba(37,254,179,.12); }
.request-field textarea { resize: vertical; min-height: 64px; }
.request-submit {
    width: 100%; padding: 12px 0; margin-top: 4px; border: none; border-radius: 10px; cursor: pointer;
    background: linear-gradient(135deg, #25FEB3, #12c98c); color: #0c1411; font-weight: 700; font-size: 15px; font-family: inherit;
    transition: transform .15s, opacity .15s;
}
.request-submit:hover { transform: translateY(-2px); }
.request-submit:disabled { opacity: .6; cursor: default; transform: none; }

/* ---------- 轻提示 toast ---------- */
.toudy-toast {
    position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%) translateY(10px);
    background: #23272b; border: 1px solid #353b41; color: #e9eaec; font-size: 13px;
    padding: 9px 16px; border-radius: 10px; opacity: 0; pointer-events: none;
    transition: opacity .2s, transform .2s; z-index: 2147482999; white-space: nowrap;
}
.toudy-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ---------- 个人中心页 ---------- */
.my-page { max-width: 1100px; margin: 0 auto; padding: 18px 12px 60px; }
.my-head { margin-bottom: 16px; }
.my-title { font-size: 22px; font-weight: 700; color: #f1f3f5; margin: 0 0 4px; }
.my-sub { font-size: 13px; color: #9aa0a6; margin: 0; }
.my-tabs { display: flex; gap: 8px; margin-bottom: 16px; border-bottom: 1px solid #26292d; }
.my-tab {
    padding: 10px 4px; margin-right: 18px; background: none; border: none; cursor: pointer;
    color: #9aa0a6; font-size: 15px; font-family: inherit; position: relative;
    transition: color .15s;
}
.my-tab.active { color: #25FEB3; }
.my-tab.active::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
    background: linear-gradient(90deg, #25FEB3, #12c98c); border-radius: 2px;
}
.my-empty { text-align: center; padding: 48px 0; color: #9aa0a6; }
.my-empty p { margin: 0 0 12px; font-size: 14px; }
.my-empty-link { display: inline-block; padding: 8px 18px; border-radius: 999px; background: rgba(37,254,179,.14); color: #25FEB3; border: 1px solid rgba(37,254,179,.5); text-decoration: none; font-size: 14px; }
.my-empty-link:hover { background: rgba(37,254,179,.22); }