/* ===== 独立页面专属侧栏 #page-sidebar ===== */
/* 放到主题 style.css 末尾，或后台「设置外观」的自定义 CSS 里 */



.postnote{
    margin:auto 1000px;
    width: 300px;
    min-height: 700px;
    padding: 10px;
    position:relative;
    /*background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#f3f3f3), to(#fff), color-stop(.1,#f3f3f3));*/
    /*border-top: 1px solid #cccccc;*/
    /*border-right: 1px solid #cccccc;*/
    /*-webkit-border-bottom-right-radius: 60px 60px;*/
    /*-webkit-border-bottom-left-radius: 60px 60px;*/
    /*-webkit-box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);*/

}
/*hidden some codes 2026.10.03*/
.postnote:before{
    content:'';
    width: 25px;
    height: 20px;
    /*background: white;*/
    position: absolute;
    bottom:0; right:0;
    /*background: -webkit-gradient(linear, 0% 20%, 50% 40%, from(#fff), to( #eee), color-stop(.1,#fff));*/
    /*-webkit-border-bottom-right-radius: 30px;*/
    /*-webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);*/
    /*-webkit-transform: rotate(-20deg)*/
    /*skew(-40deg,-3deg)*/
    /*translate(-13px,-13px);*/

}

.postnote:after{
    content: '';
    z-index: -10;
    width: 100px;
    height: 100px;
    position:absolute;
    bottom:0;
    right:0;
    /*background: rgba(0, 0, 0, 0.2);*/
    display: inline-block;
    /*-webkit-box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);*/
    /*-webkit-transform: rotate(0deg)*/
    /*translate(-45px,-20px)*/
    /*skew(20deg);*/
}
.fold_postnote{
    z-index: -10;
    width: 50px;
    height: 50px;
    position:absolute;
    bottom:0; left:0;
    /*-webkit-box-shadow: -20px 20px 8px rgba(0, 0, 0, 0.2);*/
    /*-webkit-transform: rotate(0deg)*/
    /*translate(40px,-20px)*/
    /*skew(-20deg);*/
}
.fold2_postnote{
    width: 25px;
    height: 20px;
    z-index:20;
    /*background: white;*/
    position: absolute;
    bottom:0; left:0;
    /*background: -webkit-gradient(linear, 0% 20%, 50% 80%, from(#fff), to( #eee), color-stop(.1,#fff));*/
    /*-webkit-border-bottom-right-radius: 30px;*/
    /*-webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);*/
    /*-webkit-transform: rotate(103deg)*/
    /*skew(-3deg,-40deg)*/
    /*translate(-13px,-15px);*/
}

.postnote_ribbon{
    content: '';
    position:absolute;
    top:-25px; left: 30%;
    width: 130px;
    height: 40px;
    /*background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2)));*/
    /*border-left: 1px dashed rgba(0, 0, 0, 0.1);*/
    /*border-right: 1px dashed rgba(0, 0, 0, 0.1);*/
    /*-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);*/
}
#post-sidebar{
    width:100%;
    box-sizing:border-box;
}

/* 兜底样式：如果主题里 .boxnote 的规则是 #secondary .boxnote 这类带前缀的，
   下面这段能保证它在 #page-sidebar 里也有正常宽高和排版 */
/*#post-sidebar .boxnote{*/
/*    position:relative;      !* .water 用了 absolute，父级必须 relative *!*/
/*    width:100%;*/
/*    margin-bottom:20px;*/
/*    padding:15px;*/
/*    background:#fff;*/
/*    border-radius:6px;*/
/*    box-shadow:0 1px 4px rgba(0,0,0,.08);*/
/*    overflow:visible;*/
/*}*/

/*#post-sidebar .box{*/
/*    width:100%;*/
/*    text-align:center;*/
/*}*/

/*!* 水球动画在窄侧栏里居中 *!*/
/*#post-sidebar .water{*/
/*    position:relative;*/
/*    top:auto; left:auto;*/
/*    transform:none;*/
/*    margin:10px auto;*/
/*}*/

/* 窄屏时侧栏掉到正文下方 */
@media (max-width:767px){
    #post-sidebar{ margin-top:20px; }
}
:root {
    /* 完全透明 */
    --body-color: rgba(24, 28, 31, 0);
    --body-color: #181c1f00;
    /*--primary-color: #000000;*/
    /*hidden special effect 2026.10.03*/
}
.cloud::before {
    content: "";
    /* 左侧小云朵 */
    /*width: 110px;*/
    /*height: 110px;*/
    background-color: var(--primary-color);
    border-radius: 50%;
    position: absolute;
    top: -50px;
    left: 40px;

    /* 右侧大云朵 */
    /*box-shadow: 90px 0 0 30px var(--primary-color);*/
}

.cloud .text {
    position: absolute;
    top: 40px;
    height: 20px;
    line-height: 20px;

    text-transform: uppercase;
    color: var(--primary-color);
    /* 为文字添加阴影，看上去发光，增加视觉效果 */
    text-shadow: 0 0 5px var(--primary-color), 0 0 15px var(--primary-color), 0 0 30px var(--primary-color);
    transform-origin: bottom;
    animation: animate 2s linear forwards;
}

@keyframes animate {
    0% {
        transform: translateY(0);
    }

    70% {
        transform: translateY(610px);
    }

    100% {
        transform: translateY(640px);
    }
}
/* ==========================================================================
   小布丁 · 篆体印章按钮（乱码雨开关）  2026.10.03
   --------------------------------------------------------------------------
   用法：整段追加到  usr/themes/你的主题/style.css  末尾
   字体：把 zhuan.woff2 放到  usr/themes/你的主题/fonts/zhuan.woff2
        （若你改放在 css/ 目录下的样式表里，下面 @font-face 的
          url("fonts/zhuan.woff2") 要改成 url("../fonts/zhuan.woff2")）
   ========================================================================== */

/* 篆体：敬峰中山王篆 V3.0 · SIL OFL 1.1 免费商用
   已子集化为「小布丁」三字 → 6.5 KB */
@font-face {
    font-family: "Zhuan";
    src: url("../fonts/zhuan.woff2") format("woff2");

    font-display: block;
}

/* ══════════════════════════════════════════════════════════════
   印章按钮 · 88px · 朱文（白底红字红框）· 纯 CSS
   布局：右列「小布」+ 左列「丁」（末字独占一列并拉长）

   分层职责：
     button    → 尺寸 / padding / 纸面 / 外投影（唯一不会被 overflow 裁掉的层）
     ::before  → 印泥边框（四边浓淡不一）+ 边缘堆积内阴影
     ::after   → 内圈细线 + 斑驳白点（纸面没吃到印泥处）
     .col i    → 篆字
   ══════════════════════════════════════════════════════════════ */
.seal-btn {
    /* —— 尺寸 —— */
    --size: 88px;        /* 印面边长 */
    --bd: 4px;           /* 印泥边框粗细，约为边长 4.5% */
    --gap: 2px;          /* 边框到内圈细线的间距 */
    --cols: 2;           /* 列数 */

    /* —— 字形推导（换字体必须重测） —— */
    --fill: 0.84;        /* 0.030em 描边会把字撑大约 6%，取 0.84 后每边留约 3px 留红 */
    --ink-w: 0.477;      /* 篆书墨迹宽 ÷ em */
    --ar: 0.48;          /* 篆书墨迹 宽 ÷ 高 */
    --st: 0.030em;       /* 笔画描边：篆书线条极细，靠它补厚重感 */
    --dy: -0.36;         /* 居中补偿：本字体 fontBoundingBox 与真实墨迹错位 0.36em */

    /* —— 颜色 —— */
    --ink: #c1272d;      /* 印泥主色 */
    --ink-hi: #d93a33;   /* 悬停：印泥转亮 */
    --ink-lo: #961c19;   /* 按下：用力钤下去，印泥洇开变深 */
    --paper: #fdf9f1;    /* 纸面，比纯白略暖 */

    /* —— 推导量，不用改 —— */
    --inner: calc(var(--size) - var(--bd) * 2);
    --cell-w: calc(var(--inner) / var(--cols) * var(--fill));
    --fs: calc(var(--cell-w) / var(--ink-w));

    /* —— button 默认样式重置 —— */
    appearance: none;
    -webkit-appearance: none;
    border: none;
    font: inherit;
    line-height: 1;
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;

    /* —— 盒模型 —— */
    position: relative;
    z-index: 5;                      /* 压过乱码雨的字符，保证能点到 */
    display: flex;
    flex-direction: row-reverse;     /* 列从右往左：右「小布」→ 左「丁」 */
    width: var(--size);
    height: var(--size);
    padding: var(--bd);              /* 内容避开印泥边框 */
    overflow: hidden;                /* 字号远大于格高，必须裁 */
    margin: 12px auto 0;             /* 在 note_link 里居中 */
    background: var(--paper);

    /* 外投影：近处实影定形 + 远处虚影托起
       必须放在 button 自身 —— 放伪元素上会被 overflow:hidden 裁掉 */
    box-shadow:
        0 1px 2px rgba(0, 0, 0, .16),
        0 8px 20px -8px rgba(120, 20, 18, .48);

    transition:
        transform 150ms cubic-bezier(.2, .9, .3, 1),
        box-shadow 150ms cubic-bezier(.2, .9, .3, 1),
        filter 200ms ease;
}

/* ── ::before = 印泥边框 + 边缘堆积 ───────────────────── */
.seal-btn::before {
    content: "";
    position: absolute;              /* 关键：不加会变成 flex item，挤掉字的位置 */
    inset: 0;                        /* 基准是 padding box = 整个印面 */
    border: var(--bd) solid var(--ink);
    /* 四边浓淡不一，真实钤印不会均匀 */
    border-top-color: #b52420;
    border-right-color: #c1272d;
    border-bottom-color: #a9201d;
    border-left-color: #c9332b;
    /* 内侧极淡反光 + 印泥向内的堆积感 */
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .5),
        inset 0 2px 5px rgba(120, 20, 18, .16);
    pointer-events: none;            /* 不挡点击 */
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

/* ── ::after = 内圈细线 + 斑驳 ────────────────────────── */
.seal-btn::after {
    content: "";
    position: absolute;
    inset: calc(var(--bd) + var(--gap));
    border: 1px solid rgba(193, 39, 45, .20);
    /* 斑驳：纸面没吃到印泥的白点 */
    background:
        radial-gradient(circle at 16% 22%, rgba(253, 249, 241, .95) 0 1.2px, transparent 1.8px),
        radial-gradient(circle at 58% 12%, rgba(253, 249, 241, .80) 0 1.0px, transparent 1.6px),
        radial-gradient(circle at 88% 40%, rgba(253, 249, 241, .90) 0 1.2px, transparent 1.8px),
        radial-gradient(circle at 34% 74%, rgba(253, 249, 241, .75) 0 1.0px, transparent 1.6px),
        radial-gradient(circle at 72% 86%, rgba(253, 249, 241, .85) 0 1.2px, transparent 1.8px),
        radial-gradient(circle at 8%  58%, rgba(253, 249, 241, .70) 0 1.0px, transparent 1.6px);
    pointer-events: none;
    transition: border-color 150ms ease;
}

/* ── 字层：必须压在伪元素之上 ─────────────────────────── */
.seal-btn .col {
    position: relative;
    z-index: 1;                      /* 压过 ::before / ::after */
    flex: 1;
    display: flex;
    flex-direction: column;          /* 列内从上到下 */
    min-width: 0;
    /* 纵向缩放：该列字越少 → 格子越高 → 字拉得越长 */
    --sy: calc(var(--cols) / var(--n) * var(--ar));
}

.seal-btn .col i {
    flex: 1 1 0;
    min-height: 0;                   /* 不加会被 flex 的 min-height:auto 撑爆，字会被裁 */
    display: flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    font-family: "Zhuan", serif;
    font-size: var(--fs);
    line-height: 1;
    color: var(--ink);
    -webkit-text-stroke: var(--st) currentColor;
    text-shadow: 0 0 1px rgba(193, 39, 45, .35);   /* 印泥在纸纤维上洇开 */
    /* 先把「墨迹中心」平移回格子中心，再非等比缩放 */
    transform:
        translate(calc(var(--dx, 0) * 1em * var(--kx, 1)), calc(var(--dy) * 1em * var(--sy)))
        scale(var(--kx, 1), calc(var(--sy) * var(--ky, 1)));
    transition: color 150ms ease, text-shadow 150ms ease;
}

/* 三字浓淡微差，避免机械感 */
.seal-btn .col:nth-of-type(1) i:nth-of-type(1) { color: #bc2823; }  /* 小 */
.seal-btn .col:nth-of-type(1) i:nth-of-type(2) { color: #c1272d; }  /* 布 */
.seal-btn .col:nth-of-type(2) i:nth-of-type(1) { color: #b52420; }  /* 丁 */

/* ══════════ 悬停：把印章提起来 ══════════ */
.seal-btn:hover {
    transform: translateY(-3px);
    box-shadow:
        0 2px 4px rgba(0, 0, 0, .14),
        0 14px 28px -10px rgba(120, 20, 18, .52);
}
.seal-btn:hover::before {
    border-top-color: var(--ink-hi);
    border-right-color: #e0433c;
    border-bottom-color: #c9332b;
    border-left-color: #dd4039;
}
.seal-btn:hover::after { border-color: rgba(217, 58, 51, .26); }
.seal-btn:hover .col i {
    color: var(--ink-hi);
    text-shadow: 0 0 2px rgba(217, 58, 51, .40);
}

/* ══════════ 按下：钤下去 ══════════ */
.seal-btn:active {
    transform: translateY(2px) scale(.982);
    box-shadow:
        0 1px 1px rgba(0, 0, 0, .24),
        0 2px 5px -3px rgba(120, 20, 18, .40);
}
.seal-btn:active::before {
    /* 印泥被压开、向内洇，边框加深 */
    border-top-color: var(--ink-lo);
    border-right-color: #a9201d;
    border-bottom-color: #8a1916;
    border-left-color: #b52420;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .35),
        inset 0 3px 7px rgba(120, 20, 18, .30);
}
.seal-btn:active::after { border-color: rgba(150, 28, 25, .22); }
.seal-btn:active .col i {
    color: var(--ink-lo);
    text-shadow: 0 0 1px rgba(150, 28, 25, .45);
}

/* ══════════ 键盘可达 ══════════ */
.seal-btn:focus-visible {
    outline: 2px solid #2a2a2a;
    outline-offset: 4px;
}

/* ══════════ 关闭状态：雨停了，印章变灰 ══════════
   由 JS 加/去 .is-off，直观反馈当前开关状态            */
.seal-btn.is-off {
    filter: grayscale(1);
    opacity: .45;
}
.seal-btn.is-off:hover { opacity: .65; }

/* 小屏收窄一点，避免挤到侧栏外 */
@media (max-width: 767px) {
    .seal-btn { --size: 72px; --bd: 3px; }
}
/* ==========================================================================
   乱码雨「显 / 隐」开关样式   2026.10.03
   --------------------------------------------------------------------------
   追加到  usr/themes/minipudding/style.css  末尾即可
   JS 只负责给 .cloud 加/去 .rain-off，颜色切换全在这里完成
   ========================================================================== */

/* ── 核心：雨照下，只是字变透明 ─────────────────────────
   第 1 行：改掉字符继承的颜色变量（.text 用的是 var(--primary-color)）
   第 2 行：兜底保险。万一你的主题里 --primary-color 作用域不在这儿，
            这行直接压死 color 和发光，效果一样 */
.cloud.rain-off {
    --primary-color: transparent;
}
.cloud.rain-off .text {
    color: transparent;
    text-shadow: none;
}

/* 想要渐变消失而不是瞬间消失，就加这两行（可删） */
.cloud .text {
    transition: color .35s ease, text-shadow .35s ease;
}