/* ============================================================================
   site-contract.css — OLD-SITE VISUAL CONTRACT (clean rebaseline).
   Enqueued LAST (functions.php, dep on parent style) so equal/higher-specificity
   rules win by cascade ORDER + SPECIFICITY. Goal: ZERO !important.

   Every block cites its source line in the old-site (prod) theme:
     PROD = www_wuweixin_art/index/wp-content/themes/Fioritura/style.css
   Only the DELTA vs clean parent Sakura v3.3.9 is migrated here; anything the
   clean parent already provides (.focusinfo base, .center-text, .glitch,
   .header-info, .top-social_v2, .site-header/.site-top/.lower layout, the 1200px
   nav slide, the 860px openNav mobile mode) is INHERITED and intentionally NOT
   duplicated.  No clamp/vw on the logo; no self-invented 1180/920/1320 breakpoints.
   ============================================================================ */

/* ---------------------------------------------------------------- LOGO ------
   Source: PROD style.css 8882-8941 ("文字 LOGO 样式" / .moe-mashiro skin).
   The clean parent ships ONLY ".logolink a" (20px); the whole moe-mashiro pill
   skin below is a prod customization that must be reproduced here.
   Specificity 0,2,0 / 0,3,0 + last-load => wins over parent's ".logolink a"
   (0,2,0 earlier) with NO !important. */

/* base fioritura-logofont pill (PROD 8895) — translucent white rounded box behind 巫偉鑫 */
.logolink .fioritura-logofont {
    background-color: transparent;   /* 默认无白底,任何主题下都不冒白盖;蓝 pill 只在 hover 浮现 */
    border-radius: 5px;
    color: #464646;
    height: auto;
    line-height: 25px;
    margin-right: 0;
    padding-top: 1px;
    padding-bottom: 0;
    text-size-adjust: 100%;
    width: auto;
}
/* hover: pill -> 雾霭蓝 #A4B5D5 底 + 轻风 #EEE9E7 近白字(蓝底压白字,可读)。英文 "Wu Weixin" 贴
   在 header 上无底,#EEE9E7 会隐形,所以用蓝 #A4B5D5(白 header 上可读)。橙色源头已在 decorate.php 去除。 */
.logolink a:hover .fioritura-logofont { background-color: #A4B5D5; color: #2e3a5e; }
.logolink a:hover .shironeko,
.logolink a:hover rt          { color: #6d80bf; }

/* moe-mashiro anchor (PROD 8918) — FIXED 28px (per owner: no clamp, no vw) */
.logolink.moe-mashiro a {
    color: #464646;
    float: none;
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    font-size: 24px;
    font-weight: 800;
    height: auto;
    line-height: 1.12;
    padding: 2px 58px 2px 4px;   /* 右侧留给竖章 */
    text-shadow: 0 0 2px rgba(255,255,255,.95), 0 0 5px rgba(255,255,255,.8), 0 0 10px rgba(255,255,255,.55), 0 1px 3px rgba(0,0,0,.5);   /* 强白光晕=给字描白边:深色壁纸上也读得清,浅背景不碍事 */
    text-decoration: none;
}
/* moe-mashiro pill overrides (PROD 8930) — 25px, rounder 9px corner */
.logolink.moe-mashiro .fioritura-logofont {
    display: inline-block;
    font-size: 26px;
    border-radius: 9px;
    padding-top: 5px;
    padding-bottom: 2px;
    /* OWNER-APPROVED MICRO-TWEAK (Stage 2F-RESET 4C.1): +3px each side so the
       rounded "巫偉鑫" box fully wraps the glyphs. Only horizontal padding added;
       all other values are verbatim prod. */
    padding-left: 3px;
    padding-right: 3px;
}
/* english part sits tight to the pill (PROD 8936) */
.logolink.moe-mashiro .shironeko { margin-top: 3px; font-size: 16px; }
/* logo font (PROD 8941 ".moe-mashiro{font-family:FZYouMaoZaiK...}"). Set DIRECTLY
   on each span (0,3,0) so inheritance can't be defeated by a later parent rule.
   @font-face is declared in style.css; files self-hosted in assets/fonts/. */
.logolink.moe-mashiro a,
.logolink.moe-mashiro .fioritura-logofont,
.logolink.moe-mashiro .shironeko,
.logolink.moe-mashiro rt {
    font-family: 'FZYouMaoZaiK', 'Merriweather Sans', Helvetica, Tahoma, Arial,
                 'PingFang SC', 'Hiragino Sans GB', 'Microsoft Yahei',
                 'WenQuanYi Micro Hei', sans-serif;
}

/* ---------------------------------------------------------- 落款印章(名章) -
   在 logo 文末(Wu Weixin 之后)盖一枚朱印:既是主人的身份印记,又正好填掉 logo
   承托右侧的留白。默认圆印(印-5);想换方印/竖印,把 url 改成 yin-square / yin-tall 即可。
   纯 ::after,不动 header.php,不动导航。 */
.logolink.moe-mashiro a::after {
    content: "";
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 56px;
    background: url("../img/seal/yin-tall.png") no-repeat center center;
    background-size: contain;
    /* 一点点印泥的软投影,别生硬 */
    filter: drop-shadow(0 1px 1.5px rgba(120, 24, 12, 0.18));
    transition: transform .3s ease;
}
/* 悬停轻轻一歪、微放大,像刚落下的印 */
.logolink.moe-mashiro a:hover::after {
    transform: translateY(-50%) rotate(-4deg) scale(1.05);
}
/* ---------------------------------------------------- HERO COVER (#centerbg) -
   Source: PROD style.css 3896 (#centerbg height:100vh). Clean parent ships 550px.
   We scope the 100vh to the HOME ONLY (body.ww-home-locked, a class managed by
   home-scroll-lock.js) so non-home pages keep the parent's normal cover height
   and DO scroll (this avoids the 2F-9/2F-11 regression where a global 100vh
   in-flow cover pushed every page's content off-screen). Specificity 1,1,0 > the
   parent's #centerbg (1,0,0) => wins with NO !important. */
body.ww-home-locked #centerbg { height: 100vh; }

/* ------------------------------------------------- HOME ONE-SCREEN LOCK ------
   Owner requirement (B.4): home is non-scrollable, non-home scrolls. The lock is
   driven ENTIRELY by classes that home-scroll-lock.js adds/removes by pathname
   (NOT by a server body_class, which would persist across Sakura's PJAX swaps and
   leak the lock into section pages — the exact bug being fixed here).
     html.ww-home-locked + body.ww-home-locked => locked (home, pathname '/').
   Genuinely short viewports may still scroll so content is never cut off. */
html.ww-home-locked,
html.ww-home-locked body.ww-home-locked {
    overflow: hidden;
    height: 100%;
}
@media (max-height: 520px) {
    html.ww-home-locked,
    html.ww-home-locked body.ww-home-locked { overflow-y: auto; height: auto; }
}

/* ------------------------------------------- HERO VISIBLE ON MOBILE ----------
   Old site shows the cover greeting (HI MUSICIAN + avatar + name + social) on
   phones: PROD style.css COMMENTS OUT the "@media(max-width:480px){.focusinfo
   {display:none}}" hide. The clean parent (v3.3.9) instead HIDES .focusinfo at
   <=860px. Restore old-site visibility, scaled to fit. Equal specificity (0,1,0)
   + last-load beats the parent's hide => NO !important. */
@media (max-width: 860px) {
    .focusinfo { display: block; }
    .focusinfo .header-tou img,
    .focusinfo > img { width: 92px; height: 92px; }
    .header-info  { transform: scale(.92); }
    .top-social, .top-social_v2 { transform: scale(.95); }
}


/* 导航栏视觉已在 style.css 源头重写(居中双承托·暖宣纸磨砂),此处不再叠加。 */

/* ============================================================================
 * 首页导航「骰子」换封面(取代原 hero 上那对箭头)。同款暖磨砂圆,点击转一圈。
 * 元素只在首页由 header.php 渲染(is_front_page/is_home),其它页不出现。
 * ========================================================================== */
.ww-bg-dice {
    order: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    cursor: pointer;
    color: #3c414c;
    background-color: rgba(247, 243, 235, .45);
    -webkit-backdrop-filter: blur(16px) saturate(150%);
    backdrop-filter: blur(16px) saturate(150%);
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: 50%;
    box-shadow: 0 8px 26px -15px rgba(60, 50, 30, .5), inset 0 1px 0 rgba(255, 255, 255, .45);
    transition: background-color .35s ease, color .25s ease;
    animation: searchbox 1s;   /* 和搜索/菜单承托同款入场(从右滑入+淡入)*/
}
.ww-bg-dice svg { width: 25px; height: 25px; display: block; }
.ww-bg-dice:hover { color: #5b6bc0; }
.ww-bg-dice.ww-dice-roll svg { animation: ww-dice-roll .5s ease; }
@keyframes ww-dice-roll { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .ww-bg-dice.ww-dice-roll svg { animation: none; } }

/* ============================================================================
 * 首页 hero 社交:一套定制彩色圆徽章,直接浮在封面上(去掉原来那条灰塑料底),
 * 居中一行、悬停轻轻抬起。徽章本身就是彩色圆,不再垫任何底 -> 不塑料。
 * ========================================================================== */
.ww-social {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
}
.ww-social a {
    display: inline-flex;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 6px 16px -6px rgba(0, 0, 0, .45);
    transition: transform .25s ease, box-shadow .25s ease;
    -webkit-tap-highlight-color: transparent;
}
.ww-social a:hover,
.ww-social a:focus-visible {
    transform: translateY(-5px) scale(1.06);
    box-shadow: 0 13px 24px -8px rgba(0, 0, 0, .5);
}
.ww-social img {
    width: 100%;
    height: 100%;
    display: block;
}
@media (prefers-reduced-motion: reduce) {
    .ww-social a:hover, .ww-social a:focus-visible { transform: none; }
}


/* ============================================================================
 * hero 名字用的自托管开源字体(子集,跨平台一致):
 *   Cormorant Garamond(拉丁·优雅高对比衬线)+ 霞鹜文楷 LXGW WenKai(中文·文人楷书)。
 * 中文只子集了"巫偉鑫"等几个用到的字 -> 3.4KB;拉丁 Basic Latin -> 12KB。均 OFL 开源。
 * ========================================================================== */
@font-face {
    font-family: 'Cormorant Garamond';
    src: url('../fonts/CormorantGaramond-SemiBold.subset.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'LXGW WenKai';
    src: url('../fonts/LXGWWenKai.subset.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* ============================================================================
 * 2G-06D  文章底部 CC 协议徽章 —— 内联官方 CC 图标(BY-NC-SA 四枚,FA Free/CC BY 4.0)。
 * 本地内联 SVG,fill:currentColor 跟随 .post-lincenses 原有淡灰(#B3B3B3 -> hover #888);
 * 零远程、零新字体依赖(主题是 FontAwesome4,本就没有 CC 品牌字形)。
 * ========================================================================== */
.post-lincenses a { display:inline-flex; align-items:center; justify-content:center; gap:.5em; text-decoration:none; flex-wrap:wrap; }
.post-lincenses .cc-badges { display:inline-flex; align-items:center; gap:5px; }
.post-lincenses .cc-badges svg { width:1.05em; height:1.05em; fill:currentColor; vertical-align:middle; opacity:.85; transition:opacity .25s ease, transform .25s ease; }
.post-lincenses a:hover .cc-badges svg { opacity:1; transform:translateY(-1px); }


/* ============================================================================
 * 2G-06E  文章手写摘要盒 —— 用 WordPress 原生 Excerpt(has_excerpt() 为真才渲染)。
 * 手写、存本站库、零外部接口/零 key。只在单篇文章标题下方出现。玻璃卡,配全站蓝调,夜间适配。
 * ========================================================================== */
.ww-excerpt {
    margin: 2px 0 26px;
    padding: 15px 20px;
    border-radius: 14px;
    background: rgba(247, 243, 235, .55);
    -webkit-backdrop-filter: saturate(140%) blur(8px);
    backdrop-filter: saturate(140%) blur(8px);
    border: 1px solid rgba(150, 160, 190, .18);
    box-shadow: 0 6px 22px -12px rgba(60, 70, 100, .28);
}
.ww-excerpt-head {
    display: flex; align-items: center; gap: 7px;
    font-size: 15px; font-weight: 600;
    color: #5b6bc0;
    margin-bottom: 7px;
    letter-spacing: .04em;
}
.ww-excerpt-head svg { width: 18px; height: 18px; flex: 0 0 auto; }
.ww-excerpt-body {
    font-size: 14.5px; line-height: 1.85;
    color: #4a5060;
    text-align: justify;
    margin: 0;
}
body.dark .ww-excerpt { background: rgba(49, 54, 59, .6); border-color: rgba(255,255,255,.08); box-shadow:0 6px 22px -12px rgba(0,0,0,.5); }
body.dark .ww-excerpt-head { color: #7f9cff; }
body.dark .ww-excerpt-body { color: #bebebe; }

.ww-excerpt-en { color:#7a8194; font-size:13.5px; margin-top:7px; font-style:italic; }
body.dark .ww-excerpt-en { color:#9aa0b0; }

/* 2G-06F  CC 徽章加大(20px)+ 中英双排。中文用官方全角破折号「—」(不是半角 -,后者夹中文里发怪)。 */
.post-lincenses a { display:inline-flex; align-items:center; justify-content:center; gap:.6em; flex-wrap:nowrap; max-width:100%; text-decoration:none; }
.post-lincenses .cc-badges { display:inline-flex; align-items:center; gap:6px; flex:0 0 auto; }
.post-lincenses .cc-badges svg { width:20px; height:20px; }
.post-lincenses .cc-text { display:inline-flex; flex-direction:column; align-items:center; text-align:center; line-height:1.32; }
.post-lincenses .cc-zh { font-size:13.5px; }
.post-lincenses .cc-en { font-size:11.5px; opacity:.66; letter-spacing:.01em; }

/* 2G-06G  手机端(<=860px)恢复显示 CC 协议栏 + 点赞栏(桌面把 .post-footer 隐藏了)。
   浮动改居中竖排,避免排版错乱。.post-share 已从根移除,无需处理。 */
@media (max-width: 860px) {
    .post-footer { display:block !important; height:auto !important; padding:16px 0 !important; }
    .post-footer .post-lincenses { display:block; text-align:center; margin:0 0 12px; }
    .post-footer .post-tags { float:none; display:block; text-align:center; margin:0 0 12px; }
    .post-footer .post-like { display:block !important; float:none !important; text-align:center; margin:0; }
}

/* ============================================================================
 * 2G-06H  点赞「已赞」态修复 —— 点完变【实心红心】。
 * 原 .post-like a.done 只设了 cursor:not-allowed,颜色/图标都没改,所以点完还是青色空心。
 * 已赞:青→红 + 空心 like(\f00a) 换成实心 heart(\f20a);悬停也预告红色。
 * ========================================================================== */
.post-like a:hover { color: #ff5876; }
.post-like a.done { color: #ff5876 !important; cursor: default; }
.post-like a.done i.icon-like:before { content: "\2665"; font-family: "Arial","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif; }

/* ============================================================================
 * 2G-06I  上/下篇缩略图显示修复(根因:.post-squares{background:#000}+.background{opacity:.4}
 * 把"黑线透明 PNG"叠黑底又压 40% -> 全黑看不见)。只改 .nextprev:
 *   浅色底(透明线稿的黑线能显出来)+ 图片满不透明度 + 轻遮罩 + 文字阴影(白标题仍可读)。
 * 照片(不透明)会盖住浅底、且比原来更亮;不影响首页/相关文章等其它 .post-squares。
 * ========================================================================== */
.post-squares.nextprev { background: #e9ecf2; }
.post-squares.nextprev .background,
.post-squares.nextprev a:hover > .background,
.post-squares.nextprev article:hover > .background { opacity: 1; }
.post-squares.nextprev a::after,
.post-squares.nextprev article::after {
    content: ""; position: absolute; inset: 0; z-index: 70;
    background: rgba(0, 0, 0, .30); pointer-events: none;
}
.post-squares.nextprev a:hover::after,
.post-squares.nextprev article:hover::after { background: rgba(0, 0, 0, .18); }
.post-squares.nextprev .info { z-index: 98; }   /* 2G-06J 修正:保留原 absolute 定位(误设 relative 导致标签/标题重叠),仅提 z-index 盖过遮罩 */
.post-squares.nextprev .label,
.post-squares.nextprev h3,
.post-squares.nextprev h3 a {
    text-shadow: 0 1px 6px rgba(0, 0, 0, .75), 0 0 2px rgba(0, 0, 0, .55);
}

/* ============================================================================
 * 2G-06J  封面透明 PNG 泄漏修复 —— 单篇 #centerbg 随机封面(那张黑胶)+ .pattern-attachment-img
 * 的橙色 lazyload 占位,会透过"透明背景特色图"显出来。给封面图层一个实色底即可挡住,
 * 不透明封面照片照常盖住此底,不受影响。橙 loader/随机封面本身是主题正常功能,无需删除。
 * ========================================================================== */
.pattern-attachment-img { background-color: #f2e9d8; }   /* 2G-06K: 暖纸底,配黑胶 loader 米底;透明特色图加载完落此色,不透出随机封面 */
