/* ============================================================
   dash-v3.css — 首页 V3「檐下」+ 介绍页
   2026-10-18

   只服务两个新页面：index.php（工作台）/ welcome.php（介绍页）。
   经典的旧首页是 index-classic.php，一根 CSS 都不引用本文件。
   配色全部走 theme.css 的 --tc-* 变量，版式与配色互不绑定。
   ============================================================ */

.v3 {
    --v3-ink: var(--tc-text-strong, #241f33);
    --v3-ink2: var(--tc-text, #4a4361);
    --v3-mute: var(--tc-text-mute, #6f6885);
    --v3-line: var(--tc-border-soft, rgba(106, 79, 163, .16));
    --v3-violet: var(--tc-accent-ink, #6a4fa3);
    --v3-tint: var(--tc-accent-soft, rgba(106, 79, 163, .07));
    --v3-lamp: #c9803f;
    --v3-ease: cubic-bezier(.22, .61, .36, 1);
    font-family: hy5, 'Microsoft YaHei', sans-serif;
    color: var(--v3-ink2);
    position: relative;
    z-index: 2;
}

/* 顶栏占位 + 纸张 */
body.v3-page {
    background: var(--tc-page-bg);
    min-height: 100vh;
    overflow-x: hidden;
}
body.v3-page::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(1100px 720px at 6% -10%, var(--tc-accent-soft, rgba(106, 79, 163, .12)), transparent 62%),
        radial-gradient(900px 620px at 98% 2%, var(--tc-accent-soft, rgba(209, 116, 143, .08)), transparent 58%);
    opacity: .9;
}

.v3-wrap { width: min(1180px, 100%); margin: 0 auto; padding: 0 28px; }

/* ---------- 通用小件 ---------- */
.v3-kicker {
    font-size: 12px;
    letter-spacing: .18em;
    color: var(--v3-mute);
}
.v3-label {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 11.5px;
    letter-spacing: .2em;
    color: var(--v3-mute);
    margin-bottom: 18px;
}
.v3-label::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--v3-line);
}
.v3-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
    letter-spacing: .04em;
    padding: 11px 20px;
    border-radius: 999px;
    border: 1px solid var(--v3-line);
    color: var(--v3-ink2);
    background: transparent;
    transition: border-color .22s, color .22s, background .22s, transform .22s var(--v3-ease);
    cursor: pointer;
    font-family: inherit;
}
.v3-btn:hover { border-color: var(--v3-violet); color: var(--v3-violet); background: var(--v3-tint); transform: translateY(-1px); }
.v3-btn.solid {
    background: linear-gradient(135deg, var(--tc-accent, #6a4fa3), var(--tc-accent-2, #9a7fd1));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 14px 30px -18px var(--v3-violet);
}
.v3-btn.solid:hover { color: #fff; filter: brightness(1.05); }

/* ============================================================
   介绍页
   ============================================================ */
.v3-welcome { min-height: 100vh; display: flex; align-items: center; padding: 120px 0 96px; }
.v3-welcome .v3-grid {
    display: grid;
    grid-template-columns: 1.3fr .7fr;
    gap: 72px;
    align-items: start;
    width: 100%;
}
.v3-wordmark {
    font-family: hy, 'Microsoft YaHei', sans-serif;
    font-weight: 400;
    font-size: clamp(58px, 8.6vw, 108px);
    line-height: .94;
    letter-spacing: -.02em;
    color: var(--v3-ink);
}
.v3-wordmark em { font-style: normal; color: var(--v3-violet); }
.v3-wordmark-cn {
    font-family: hy, 'Microsoft YaHei', sans-serif;
    font-size: clamp(20px, 2.4vw, 28px);
    letter-spacing: .5em;
    color: var(--v3-mute);
    margin-top: 18px;
}
.v3-slogan {
    font-size: 16px;
    line-height: 2.05;
    color: var(--v3-ink2);
    margin-top: 30px;
    max-width: 26em;
}
.v3-slogan b { font-weight: 400; color: var(--v3-ink); box-shadow: inset 0 -.55em 0 var(--v3-tint); }
.v3-welcome .v3-actions { display: flex; gap: 12px; margin-top: 40px; flex-wrap: wrap; }

.v3-side { border-left: 1px solid var(--v3-line); padding-left: 40px; display: flex; flex-direction: column; gap: 34px; }
.v3-quote-sm {
    font-family: hy, 'Microsoft YaHei', sans-serif;
    font-size: 19px;
    line-height: 1.95;
    color: var(--v3-ink);
}
.v3-quote-sm .a { display: block; margin-top: 14px; font-family: hy5, sans-serif; font-size: 11.5px; letter-spacing: .14em; color: var(--v3-mute); }

.v3-who-line { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.v3-avatars { display: flex; }
.v3-avatars i {
    width: 30px; height: 30px; border-radius: 50%; margin-right: -9px;
    display: flex; align-items: center; justify-content: center;
    font-style: normal; font-size: 11px; color: #fff;
    border: 2px solid var(--tc-card-bg, #f7f4fb);
    background: linear-gradient(135deg, var(--tc-accent, #8f74c9), var(--tc-accent-2, #b79ad6));
}
.v3-who-line .n { font-size: 13px; color: var(--v3-ink2); letter-spacing: .02em; }
.v3-who-line .n b { font-family: hy, sans-serif; font-weight: 400; font-size: 17px; color: var(--v3-ink); }

.v3-doors-list { border-top: 1px solid var(--v3-line); }
.v3-door-row {
    display: flex; align-items: center; gap: 14px;
    padding: 16px 0; border-bottom: 1px solid var(--v3-line);
    position: relative; transition: padding-left .28s var(--v3-ease);
}
.v3-door-row::after {
    content: ''; position: absolute; left: 0; bottom: -1px; height: 1px; width: 0;
    background: var(--v3-violet); transition: width .36s var(--v3-ease);
}
.v3-door-row:hover { padding-left: 10px; }
.v3-door-row:hover::after { width: 100%; }
.v3-door-row .ico {
    width: 32px; height: 32px; border-radius: 10px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    background: var(--v3-tint); color: var(--v3-violet); font-size: 13px;
}
.v3-door-row .nm { font-family: hy, sans-serif; font-size: 17px; letter-spacing: .04em; color: var(--v3-ink); }
.v3-door-row .ds { font-size: 12px; color: var(--v3-mute); letter-spacing: .02em; }
.v3-door-row .ar { margin-left: auto; color: var(--v3-line); transition: color .2s, transform .28s; }
.v3-door-row:hover .ar { color: var(--v3-violet); transform: translateX(3px); }

/* ============================================================
   工作台「檐下」
   ============================================================ */
.v3-hall { padding-top: 0; padding-bottom: 90px; }

/* 主视觉带：整幅淡紫 + 巨大的「芋」水印 */
.v3-hero {
    position: relative;
    overflow: hidden;
    padding: 104px 0 56px;
    border-bottom: 1px solid var(--v3-line);
    background: linear-gradient(180deg, var(--v3-tint), transparent 92%);
}
.v3-hero .v3-hero-inner { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; gap: 56px; align-items: center; }

.v3-greet { font-size: 13px; letter-spacing: .16em; color: var(--v3-mute); }
.v3-clock {
    font-family: hy, 'Segoe UI', monospace;
    font-size: clamp(68px, 9.2vw, 122px);
    line-height: .88;
    letter-spacing: -.035em;
    color: var(--v3-ink);
    font-variant-numeric: tabular-nums;
    margin-top: 12px;
}
.v3-clock .sep { color: var(--v3-violet); opacity: .45; animation: v3blink 2.4s steps(1) infinite; }
@keyframes v3blink { 50% { opacity: .12; } }
.v3-date { margin-top: 16px; font-size: 12.5px; letter-spacing: .18em; color: var(--v3-mute); }

.v3-say { border-left: 2px solid var(--v3-violet); padding-left: 22px; }
.v3-say .q {
    font-family: hy, 'Microsoft YaHei', sans-serif;
    font-size: clamp(19px, 1.9vw, 23px);
    line-height: 1.85;
    color: var(--v3-ink);
}
.v3-say .s { margin-top: 12px; font-size: 11.5px; letter-spacing: .12em; color: var(--v3-mute); display: flex; align-items: center; gap: 10px; }
.v3-say .s .say-refresh { margin-left: 0; }

/* 三栏信息区 */
.v3-body {
    display: grid;
    grid-template-columns: 1fr 1.15fr .85fr;
    padding: 40px 0 44px;
}
.v3-col { padding: 0 34px; border-right: 1px solid var(--v3-line); min-width: 0; }
.v3-col:first-child { padding-left: 0; }
.v3-col:last-child { border-right: 0; padding-right: 0; }

.v3-people { display: flex; flex-direction: column; gap: 0; }
.v3-person { display: flex; align-items: center; gap: 11px; padding: 9px 0; border-bottom: 1px solid var(--v3-line); }
.v3-person:last-child { border-bottom: 0; }
.v3-person i {
    width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0;
    font-style: normal; font-size: 10px; color: #fff;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--tc-accent, #8f74c9), var(--tc-accent-2, #b79ad6));
}
.v3-person .nm { font-size: 13px; color: var(--v3-ink2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v3-person .st { margin-left: auto; font-size: 11px; letter-spacing: .04em; color: var(--v3-mute); flex-shrink: 0; }
.v3-person .st.live { color: var(--v3-lamp); }
.v3-person .st.live::before {
    content: ''; display: inline-block; width: 5px; height: 5px; border-radius: 50%;
    background: var(--v3-lamp); margin-right: 6px; vertical-align: middle;
}
.v3-empty { font-size: 12.5px; color: var(--v3-mute); padding: 10px 0; }

.v3-feed { display: flex; flex-direction: column; }
.v3-feed-item { display: block; padding: 11px 0; border-bottom: 1px solid var(--v3-line); transition: padding-left .24s var(--v3-ease); }
.v3-feed-item:first-child { padding-top: 0; }
.v3-feed-item:hover { padding-left: 6px; }
.v3-feed-item .t { font-size: 13.5px; line-height: 1.65; color: var(--v3-ink2); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.v3-feed-item .m { margin-top: 4px; font-size: 11px; letter-spacing: .04em; color: var(--v3-mute); }

.v3-more {
    margin-top: 14px; border: 0; background: none; padding: 0; cursor: pointer;
    font-family: inherit; font-size: 12px; letter-spacing: .08em; color: var(--v3-violet);
    display: inline-flex; align-items: center; gap: 6px;
}
.v3-more:hover { text-decoration: underline; }

/* 今天：积分 + 签到 */
.v3-today .v3-points {
    font-family: hy, sans-serif; font-size: 54px; line-height: 1; color: var(--v3-violet);
    font-variant-numeric: tabular-nums;
}
.v3-today .v3-unit { font-size: 11px; letter-spacing: .18em; color: var(--v3-mute); margin-top: 8px; }
.v3-today .v3-streak { margin-top: 16px; font-size: 12px; color: var(--v3-ink2); }
.v3-today .v3-ckbtn {
    margin-top: 20px; width: 100%; max-width: 210px; border: 0; border-radius: 999px; padding: 13px 0;
    font-family: inherit; font-size: 13px; letter-spacing: .3em; text-indent: .3em; color: #fff;
    background: linear-gradient(135deg, var(--tc-accent, #6a4fa3), var(--tc-accent-2, #9a7fd1));
    cursor: pointer; transition: filter .2s, transform .2s var(--v3-ease);
    box-shadow: 0 14px 28px -18px var(--v3-violet);
}
.v3-today .v3-ckbtn:hover { filter: brightness(1.05); transform: translateY(-1px); }
.v3-today .v3-ckbtn:disabled { background: var(--v3-tint); color: var(--v3-mute); box-shadow: none; cursor: default; transform: none; }
.v3-today .fortune { margin-top: 16px; }
.v3-today .ft-top { display: flex; align-items: baseline; gap: 10px; }
.v3-today .ft-level { font-family: hy, sans-serif; font-size: 20px; }
.v3-today .ft-line { margin-top: 6px; font-size: 11.5px; color: var(--v3-mute); line-height: 1.5; }
.v3-today .ft-line .tag { display: inline-block; border-radius: 999px; padding: 1px 7px; margin-right: 6px; color: #fff; font-size: 10px; }
.v3-today .ft-line .tag.yi { background: #43b58c; }
.v3-today .ft-line .tag.ji { background: #c9647f; }

/* 四扇门 */
.v3-doors {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-top: 1px solid var(--v3-line);
    border-bottom: 1px solid var(--v3-line);
}
.v3-door {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 26px 24px 24px;
    border-right: 1px solid var(--v3-line);
    transition: background .3s var(--v3-ease);
}
.v3-door:last-child { border-right: 0; }
.v3-door::after {
    content: ''; position: absolute; left: 0; top: -1px; height: 2px; width: 0;
    background: var(--v3-violet); transition: width .42s var(--v3-ease);
}
.v3-door:hover { background: var(--v3-tint); }
.v3-door:hover::after { width: 100%; }
.v3-door .ico {
    width: 42px; height: 42px; border-radius: 13px;
    display: flex; align-items: center; justify-content: center;
    background: var(--v3-tint); color: var(--v3-violet); font-size: 16px;
    transition: background .3s, color .3s, transform .3s var(--v3-ease);
}
.v3-door:hover .ico { background: var(--v3-violet); color: #fff; transform: translateY(-2px); }
.v3-door .nm { font-family: hy, sans-serif; font-size: 20px; letter-spacing: .05em; color: var(--v3-ink); }
.v3-door .ds { font-size: 12px; line-height: 1.6; color: var(--v3-mute); letter-spacing: .02em; }
.v3-door .ar { margin-top: 14px; font-size: 11px; color: var(--v3-mute); transition: color .2s; }
.v3-door:hover .ar { color: var(--v3-violet); }

/* 页脚 */
.v3-foot { padding: 26px 0 0; font-size: 11px; letter-spacing: .1em; color: var(--v3-mute); display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.v3-foot a { border-bottom: 1px solid var(--v3-line); }
.v3-foot a:hover { color: var(--v3-violet); border-color: var(--v3-violet); }

/* ============================================================
   状态抽屉
   ============================================================ */
.v3-drawer {
    position: fixed; top: 0; right: 0; bottom: 0; width: min(440px, 94vw);
    z-index: 2147483001;
    background: var(--tc-panel-bg, #fff);
    border-left: 1px solid var(--v3-line);
    transform: translateX(103%);
    transition: transform .46s var(--v3-ease);
    padding: 84px 30px 30px;
    overflow-y: auto;
    box-shadow: -30px 0 60px -40px rgba(36, 31, 51, .5);
}
.v3-drawer.open { transform: none; }
.v3-drawer .v3-drawer-close {
    position: absolute; top: 26px; right: 26px; border: 0; background: none;
    cursor: pointer; font-size: 17px; color: var(--v3-mute);
}
.v3-drawer .v3-label { margin-bottom: 22px; }
.v3-drawer .w { background: transparent; border: 0; box-shadow: none; padding: 0; overflow: visible; }
.v3-drawer .w > h3 { border-bottom-color: var(--v3-line); }
.v3-drawer .w-server,
.v3-drawer .w-charts { display: block; }
.v3-drawer .w-server { padding-bottom: 26px; }
.v3-drawer .w-charts { padding-top: 26px; border-top: 1px solid var(--v3-line); }
.v3-drawer .chart-box { height: 160px; }

/* ============================================================
   响应式
   ============================================================ */
@media (max-width: 960px) {
    .v3-wrap { padding: 0 18px; }
    .v3-welcome .v3-grid { grid-template-columns: 1fr; gap: 44px; }
    .v3-side { border-left: 0; padding-left: 0; border-top: 1px solid var(--v3-line); padding-top: 34px; }
    .v3-hero { padding: 48px 0 38px; }
    .v3-hero .v3-hero-inner { grid-template-columns: 1fr; gap: 30px; align-items: start; }
    .v3-clock { font-size: clamp(58px, 15vw, 88px); }
    .v3-body { grid-template-columns: 1fr; padding: 30px 0 26px; }
    .v3-col { padding: 26px 0; border-right: 0; border-bottom: 1px solid var(--v3-line); }
    .v3-col:first-child { padding-top: 0; }
    .v3-col:last-child { border-bottom: 0; padding-bottom: 0; }
    .v3-doors { grid-template-columns: 1fr 1fr; }
    .v3-door { border-bottom: 1px solid var(--v3-line); padding: 24px 18px 26px; }
    .v3-door:nth-child(2n) { border-right: 0; }
    .v3-door:nth-child(n+3) { border-bottom: 0; }
    .v3-welcome { padding: 100px 0 70px; }
    .v3-foot { padding-bottom: 90px; }
}

/* 入场：一次性，克制 */
@media (prefers-reduced-motion: no-preference) {
    .v3-rise { animation: v3rise .68s var(--v3-ease) backwards; }
    @keyframes v3rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
    .v3-clock { animation: v3clock .9s var(--v3-ease) backwards; }
    @keyframes v3clock { from { opacity: 0; filter: blur(7px); transform: scale(.985); } to { opacity: 1; filter: none; transform: none; } }
    .v3-d1 { animation-delay: .07s; }
    .v3-d2 { animation-delay: .14s; }
    .v3-d3 { animation-delay: .21s; }
    .v3-d4 { animation-delay: .28s; }
}
@media (prefers-reduced-motion: reduce) {
    .v3 *, .v3 *::before, .v3 *::after { animation: none !important; transition: none !important; }
}

/* 时钟沿用 dash.js 的 .clock / .ck-compass 类名，这里只覆盖尺寸与配色 */
.v3 .w-time {
    display: flex; flex-direction: column; align-items: flex-start;
    grid-area: auto; padding: 0; background: none; border: 0; box-shadow: none;
}
.v3 .w-time.clock-compass { flex-direction: row; align-items: center; gap: 14px; width: 100%; }
.v3 .clock { font-family: hy, 'Segoe UI', monospace; color: var(--v3-ink); }
.v3 .clock.ck-compass { font-size: 0; line-height: 0; height: 132px; width: 100%; }
.v3 .w-time.clock-compass .cdate { width: auto; text-align: left; font-size: 12.5px; }
/* dash.js 渲染的动态条目用的是 .act-item 结构，这里按「最近发生」的编辑风格重排 */
.v3-feed .act-item {
    display: block; padding: 11px 0; border-bottom: 1px solid var(--v3-line);
    border-radius: 0; transition: padding-left .24s var(--v3-ease);
}
.v3-feed .act-item:first-child { padding-top: 0; }
.v3-feed .act-item:last-child { border-bottom: 0; }
.v3-feed .act-item:hover { background: none; padding-left: 6px; }
.v3-feed .act-item .ai { display: none; }
.v3-feed .act-item .act-t {
    font-size: 13.5px; line-height: 1.62; color: var(--v3-ink2);
    white-space: normal; overflow: hidden; display: -webkit-box;
    -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.v3-feed .act-item .act-m { margin-top: 4px; font-size: 11px; letter-spacing: .04em; color: var(--v3-mute); }
/* 介绍页：右栏做成一块「纸」，是整页唯一的容器，用来压住层次 */
.v3-side {
    background: linear-gradient(180deg, rgba(255, 255, 255, .58), rgba(255, 255, 255, .22));
    border: 1px solid var(--v3-line);
    border-radius: 20px;
    padding: 34px 30px;
    box-shadow: 0 26px 60px -46px rgba(36, 31, 51, .45);
}
.v3-welcome { padding: 116px 0 78px; }
.v3-welcome .v3-grid { align-items: center; }

/* V3 页面：顶栏那条横贯视口的渐变线收掉（它在旧首页是设计，在这里是杂讯） */
.v3-page .capsule::before { display: none; }

@media (max-width: 960px) {
    .v3-side { padding: 26px 20px; border-radius: 18px; }
    .v3-hall .v3-hero { padding-top: 84px; }
}

/* theme.css 的 alt 皮肤给 .post 加了卡片底色（博客卡片复用这个类），
   动态条目也带 .post，这里把它按回透明 */
.v3-feed .act-item,
.v3-feed .act-item.post,
.v3-feed .act-item.announce,
.v3-feed .act-item.login { background: none !important; border-radius: 0 !important; }
/* 盒模型与溢出：V3 页面自己兜底，避免 padding 撑破 390px 视口 */
.v3, .v3 *, .v3 *::before, .v3 *::after { box-sizing: border-box; }
.v3-drawer, .v3-drawer * { box-sizing: border-box; }
.v3-wrap { width: 100%; max-width: 1180px; }
body.v3-page { overflow-x: hidden; }
@media (max-width: 560px) {
    #statusBtn { display: none !important; }
}
/* 高特异性兜底：theme.css 的 html[data-tc-skin=alt] .post 会给动态条目刷白底 */
html[data-tc-skin] body .v3-feed a.act-item,
html[data-tc-skin] body .v3-feed a.act-item.post,
html[data-tc-skin] body .v3-feed a.act-item.announce,
html[data-tc-skin] body .v3-feed a.act-item.login {
    background: none !important;
    border-radius: 0 !important;
}