/* 后来加的彩蛋的样式（style.css 之后加载）：极昼极夜、南极圈的提示、测试日期的小牌子。
   生日的蜡烛、风筝、敲窗、南极放到最大的企鹅、手机上的纬度和长按太阳也都在这里，按彩蛋分段 */

/* ── 不落的太阳不用鼠标也能转：极昼里走到 90°S、手机上长按（theme.js 的 Theme.endless） ── */
:root:not([data-theme="dark"]) nav.top .sun.endless { filter: none; box-shadow: 0 0 0 3px var(--sun-soft), 0 0 16px 4px rgba(255, 194, 75, .55); }
:root:not([data-theme="dark"]) nav.top .sun.endless::after { opacity: 1; transition-delay: 0s; animation: endless 9s linear infinite; }

/* ── 手机上：长按太阳（theme.js），别弹出系统的长按菜单、别选中 ── */
nav.top .sun { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; touch-action: manipulation; }

/* ── 手机上的纬度（app.js）：顶栏放不下，放在页底雪线左边、站在雪面上，点它也往南走。电脑上用右上角那个 ── */
.snow-lat { display: none; }
@media (max-width: 640px) {
  .snow-lat { display: block; position: absolute; left: 12px; bottom: 54px; z-index: 3; padding: 6px 4px; border: 0; background: none;
    color: var(--ink-3); font-size: 11px; letter-spacing: .04em; text-transform: none; cursor: s-resize; }
  .snow-lat::before { content: ''; position: absolute; inset: -10px -8px; } /* 字不动，能点的范围有手指大 */
  .snow-lat:disabled { opacity: .45; cursor: default; }
  .snow-lat:focus-visible { outline: 2px solid var(--sea); outline-offset: 2px; border-radius: 6px; }
}

/* ── 南极圈的小提示（polar.js）：一张小卡片，挂在纬度旁边，四秒半后淡掉 ── */
.polar-hint { position: fixed; z-index: 30; left: 0; top: 0; max-width: min(300px, calc(100vw - 16px)); margin: 0; padding: 9px 13px;
  border: 1.5px solid var(--ink); border-radius: 12px; background: var(--card); box-shadow: 3px 3px 0 var(--shadow); color: var(--ink);
  font-size: 13px; line-height: 1.6; pointer-events: none; opacity: 0; transform: translateY(-4px); transition: opacity .35s ease, transform .35s ease; }
.polar-hint.show { opacity: 1; transform: none; }
.polar-hint small { display: block; font: 11px var(--mono); letter-spacing: .06em; color: var(--ink-3); }

/* ── 极昼的太阳（polar.js 按真实的时间摆位置，颜色、明暗写进变量）：一个圆，低的时候头顶一根日柱 ── */
.ps-orb { position: absolute; left: -23px; top: -23px; width: 46px; height: 46px; border-radius: 50%;
  background: radial-gradient(circle, var(--core, #fffbee) 0 32%, var(--mid, #ffe09a) 58%, transparent 72%); box-shadow: 0 0 70px 28px var(--glow, rgba(255, 220, 150, .4)); }
/* 日柱：低太阳头顶一根竖的光，往上渐渐淡掉；太阳高了就没有（冰晶反光，南极常见） */
.ps-pillar { position: absolute; left: -6px; bottom: -16px; width: 12px; height: 200px; border-radius: 6px; opacity: var(--pillar, 0); filter: blur(5px);
  background: linear-gradient(to top, transparent 0, var(--mid, #ffe09a) 10%, var(--mid, #ffe09a) 22%, transparent 100%); }

/* ── 极昼里走到 90°S（polar.js 的 midnightSun）：页面上缘垫一层，太阳在此刻真实的位置上亮起来、停十秒、淡掉；底下一道暖光是远处的地平线 ── */
.midnight-sun { position: fixed; left: 0; right: 0; top: 0; height: 46vh; z-index: -1; overflow: hidden; pointer-events: none; opacity: 0; transition: opacity 1.4s ease; }
.midnight-sun.up { opacity: 1; }
.midnight-sun .ps { position: absolute; left: 0; top: 0; width: 0; height: 0; }
/* 地平线那道暖光上下、左右都慢慢淡掉，不能一边齐齐切开 */
.midnight-sun::before { content: ''; position: absolute; left: 0; right: 0; top: 52%; height: 48%;
  background: linear-gradient(180deg, rgba(255, 214, 140, 0), rgba(255, 214, 140, .26) 50%, rgba(255, 214, 140, 0));
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent); mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent); }

/* ── 「下一站」按此刻南极点是极昼还是极夜换天色（<html data-polar>，polar.js 定）。极夜就是原来那一页，不用改 ──
   极昼：淡蓝的天往下渐渐暖起来，一片雪地，太阳按真实的时间绕着地平线转（polar.js 一秒摆一次，一秒的过渡接上）：前面高、大、亮，
   后面贴着雪线、小、淡，一截被雪挡住；雪面上一道反光跟着它。没有极光，船的窗不亮。深色模式下是同一片极昼，只是暗一点 */
:root { --pd-sky: linear-gradient(180deg, #d1e4ef 0%, #e6eff5 42%, #f7efe0 76%, #fdf8ee 100%); --pd-snow: #fff; --pd-snow-edge: rgba(120, 150, 170, .35);
  --pd-mono: #5d7181; --pd-line: rgba(21, 23, 27, .22); }
:root[data-theme="dark"] { --pd-sky: linear-gradient(180deg, #132230 0%, #1d2f3d 44%, #38404a 76%, #4b4334 100%); --pd-snow: #22384a; --pd-snow-edge: rgba(150, 190, 215, .25);
  --pd-mono: #93a6b4; --pd-line: rgba(207, 224, 242, .25); }
.polar-sun, .polar-glare, .polar-snow { display: none; }
:root[data-polar="day"] body[data-page="next"] { background: #e6eff5; }
:root[data-polar="day"][data-theme="dark"] body[data-page="next"] { background: #132230; }
:root[data-polar="day"] .next { background: var(--pd-sky); color: var(--ink); }
:root[data-polar="day"] .next .aurora { display: none; }
:root[data-polar="day"] .polar-snow { display: block; position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; height: 20%; background: var(--pd-snow); border-top: 1.5px solid var(--pd-snow-edge); }
:root[data-polar="day"] .next-inner { z-index: 2; } /* 太阳垫在字下面，雪地挡住绕到后面的那一截 */
:root[data-polar="day"] .polar-sun { display: block; position: absolute; z-index: 0; left: 0; top: 0; width: 0; height: 0; pointer-events: none; opacity: 0; }
:root[data-polar="day"] .polar-glare { display: block; position: absolute; z-index: 1; left: 0; top: 0; width: 260px; height: 26px; margin: -13px 0 0 -130px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, var(--glare, rgba(255, 196, 120, .55)), transparent); opacity: 0; }
/* 摆好第一次以后，一秒的过渡把每秒一次的挪动接上 */
:root[data-polar="day"] .polar-sun.placed, :root[data-polar="day"] .polar-glare.placed { transition: transform 1s linear, opacity 1s linear; }
:root[data-polar="day"] .cabin { color: var(--ink-2); }
:root[data-polar="day"] .cabin .window { fill: var(--hut-glass, #a6bdc7); filter: none; }
:root[data-polar="day"] .next .mono, :root[data-polar="day"] .next blockquote cite { color: var(--pd-mono); }
:root[data-polar="day"] .contact { border-color: var(--pd-line); background: color-mix(in srgb, var(--card) 55%, transparent); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); } /* 太阳从后面经过时，字不被光晕冲淡 */
:root[data-polar="day"] .contact .copy-link { color: var(--pd-mono); }
:root[data-polar="day"] .contact .copy-link:hover, :root[data-polar="day"] .contact .copy-link:focus-visible { color: var(--sun); background: var(--hover); }
:root[data-polar="day"] body[data-page="next"] nav.top { background: var(--nav-bg); color: var(--ink); }
:root[data-polar="day"] body[data-page="next"] nav.top ul a { color: var(--ink-2); }
:root[data-polar="day"] body[data-page="next"] nav.top ul a:hover { background: var(--hover); color: var(--ink); }
:root[data-polar="day"] body[data-page="next"] nav.top ul a[aria-current] { background: var(--ink); color: var(--on-ink); }
.polar-state { margin: -10px 0 0; }

/* ── 生日（birthday.js）。日期旁边插着蜡烛的小蛋糕是网站加的标记，不是原文：只挂在日期前面，读屏不念 ── */
.bday { display: inline-block; width: .95em; height: 1.04em; margin: 0 .22em 0 .06em; vertical-align: -.14em; } /* 挂在日期前面：后面紧跟着的可能是朋友圈原文开头的表情 */
time .bday { width: .74em; margin: 0 .14em 0 0; } /* 文字页短句的日期列 44px，「12·20」占 34px：蛋糕连间距不到 10px，不出这一列 */
.cake-body { fill: #f29bb5; }
.cake-icing { fill: #fffaf2; }
.cake-candle { fill: #7cc0f2; }
.bday svg, .day-sign svg, .da-sign svg { display: block; width: 100%; height: 100%; overflow: visible; }
.bday .flame, .day-sign .flame, .da-sign .flame { fill: #ff9a3d; }
.day-sign .stick, .da-sign .stick { fill: #ee8fa8; }
.cdl.c2 .stick { fill: #7cc0f2; }
.cdl.c3 .stick { fill: #ffcf5a; }
.cdl .stripe { fill: none; stroke: #fff; stroke-width: .9; stroke-linecap: round; opacity: .9; } /* 生日蜡烛的螺纹 */
:root[data-theme="dark"] .bday .flame { fill: #ffc24b; filter: drop-shadow(0 0 2px rgba(255, 194, 75, .8)); }
/* ── 那年今日和节日（days.js）：往年的今天有东西，页底小屋旁就有一个记号，点开是一本相册 ── */
.day-sign { padding: 0; border: 0; background: none; cursor: pointer; }
.day-sign:focus-visible { outline: 2px solid var(--sea); outline-offset: 4px; border-radius: 4px; }
/* 生日：小屋屋顶插三支彩色螺纹的生日蜡烛，小屋像个蛋糕；火苗各晃各的 */
.bday-candle { position: absolute; z-index: 3; left: calc(38% - 6px); top: calc(29% - 19px); width: 22px; height: 20px; }
.bday-candle::before { content: ''; position: absolute; inset: -12px; }
.bday-candle .flame { transform-box: fill-box; transform-origin: 50% 95%; filter: drop-shadow(0 0 3px rgba(255, 170, 60, .9)); animation: flicker 1.6s ease-in-out infinite alternate; }
.bday-candle .c2 .flame { animation-delay: -.6s; }
.bday-candle .c3 .flame { animation-delay: -1.1s; }
.bday-candle:hover .flame, .bday-candle:focus-visible .flame { filter: drop-shadow(0 0 8px rgba(255, 170, 60, 1)); }
@keyframes flicker { 0% { transform: rotate(-4deg) scale(1, 1); } 55% { transform: rotate(3deg) scale(.9, 1.1); } 100% { transform: rotate(-1deg) scale(1.05, .94); } }
/* 那年今日：一个绿邮筒立在雪里、梯子左边（位置由 days.js 按雪面算），投信口斜插着一张红蓝边的航空明信片；走到页底时明信片晃一晃 */
.sign-postcard { position: absolute; left: 0; top: 0; z-index: 2; width: 22px; height: 33px; }
.sign-postcard::before { content: ''; position: absolute; inset: -8px -10px; }
@media (max-width: 640px) { .sign-postcard { width: 18px; height: 27px; } }
.mb-body { fill: #3e8b5c; stroke: var(--ink); stroke-width: 1.8; stroke-linejoin: round; }
:root[data-theme="dark"] .mb-body { fill: #2d6a49; }
.mb-band { fill: none; stroke: var(--ink); stroke-width: 1.1; }
.mb-slot, .mb-foot { fill: var(--ink); }
.mb-card > rect:first-child { fill: #fffdf7; stroke: var(--ink); stroke-width: 1.1; }
.mb-air { fill: none; stroke: #e3312d; stroke-width: 1.3; stroke-dasharray: 1.5 1.5; }
.mb-air-2 { stroke: #2f6fd1; stroke-dashoffset: 1.5; }
.mb-stamp { fill: var(--sun); }
.mb-card { transform-box: fill-box; transform-origin: 50% 100%; transition: transform .25s cubic-bezier(.3, 1.6, .5, 1); }
.sign-postcard:hover .mb-card, .sign-postcard:focus-visible .mb-card { transform: translateY(-1.6px) rotate(-3deg); }
.sign-postcard.arrive .mb-card { animation: mail-wiggle 1.1s ease .3s; }
@keyframes mail-wiggle { 0%, 100% { transform: none; } 20% { transform: translateY(-1.5px) rotate(-7deg); } 45% { transform: translateY(-1px) rotate(5deg); } 70% { transform: rotate(-2deg); } }
/* 跨年：屋顶上空两朵烟花轮着开；白天是橙和蓝，夜里是金和粉、带一点光 */
:root { --fw-a: #f2621f; --fw-b: #2f6fd1; }
:root[data-theme="dark"] { --fw-a: #ffc24b; --fw-b: #ff8fb1; }
.sign-firework { position: absolute; z-index: 3; left: calc(50% - 18px); top: -16px; width: 36px; height: 33px; } /* 留在页底里面，不压到上一节的字 */
:root[data-theme="dark"] .sign-firework svg { filter: drop-shadow(0 0 3px rgba(255, 214, 140, .55)); }
.fw-rays, .fw-dots { fill: none; stroke-linecap: round; }
.fw-rays { stroke-width: 1.6; }
.fw-dots { stroke-width: 2.4; }
.fw-a { stroke: var(--fw-a); }
.fw-b { stroke: var(--fw-b); }
.fw { transform-box: fill-box; transform-origin: center; animation: bloom 2.8s ease-out infinite; }
.fw-b { animation-delay: -1.4s; }
@keyframes bloom { 0% { transform: scale(.25); opacity: 0; } 12% { opacity: 1; } 60% { transform: scale(1); opacity: 1; } 100% { transform: scale(1.06); opacity: 0; } }
/* 圣诞：屋檐下一串小灯，红黄绿蓝，一闪一闪 */
.sign-lights { position: absolute; z-index: 3; left: 17.333%; top: 32.29%; width: 68%; height: 10.417%; }
.sign-lights::before { content: ''; position: absolute; inset: -14px -4px 0; } /* 能点的范围往屋顶上长，不往下盖住窗（夜里敲窗） */
.lt-wire { fill: none; stroke: var(--ink); stroke-width: .8; }
.lt { animation: twinkle 2.4s ease-in-out infinite; }
.lt:nth-of-type(2) { animation-delay: -.8s; } .lt:nth-of-type(3) { animation-delay: -1.6s; } .lt:nth-of-type(4) { animation-delay: -.4s; } .lt:nth-of-type(5) { animation-delay: -1.2s; } .lt:nth-of-type(6) { animation-delay: -2s; }
.b1 { fill: #e3312d; } .b2 { fill: #ffc24b; } .b3 { fill: #3e8b5c; } .b4 { fill: #2f6fd1; }
:root[data-theme="dark"] .sign-lights svg, :root[data-theme="dark"] .da-sign-lights svg { filter: drop-shadow(0 0 1.5px rgba(255, 220, 150, .9)); }
@keyframes twinkle { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }
/* 春节：门右边一盏红灯笼，轻轻晃；夜里亮着 */
.sign-lantern { position: absolute; z-index: 3; left: 77.333%; top: 33.333%; width: 9.333%; height: 25%; }
.sign-lantern::before { content: ''; position: absolute; inset: -6px -10px -3px 0; } /* 往右、往上放大，不往左盖住门（门照旧去下一站） */
.ln-swing { transform-box: fill-box; transform-origin: 50% 0; animation: swing 3.2s ease-in-out infinite alternate; }
@keyframes swing { from { transform: rotate(-6deg); } to { transform: rotate(6deg); } }
.ln-string { fill: none; stroke: var(--ink); stroke-width: .8; }
.ln-body { fill: #d8342b; stroke: var(--ink); stroke-width: .7; }
.ln-rib { fill: none; stroke: #a5231c; stroke-width: .6; }
.ln-cap { fill: #e0a63a; }
.ln-tassel { fill: none; stroke: #e0a63a; stroke-width: .7; stroke-linecap: round; }
:root[data-theme="dark"] .sign-lantern svg, :root[data-theme="dark"] .da-sign-lantern svg { filter: drop-shadow(0 0 3px rgba(255, 110, 70, .75)); }
:root[data-theme="dark"] .ln-body { fill: #ef4a36; }
/* 相册：一页一年，后面垫着两张像一叠相片；翻页是这一张往旁边滑开、下一张转过来 */
.days-album { position: fixed; inset: 0; z-index: 45; display: grid; place-items: center; padding: 20px; background: rgba(9, 22, 38, .55); backdrop-filter: blur(4px); }
.da-stage { width: min(440px, 100%); display: grid; gap: 12px; }
.da-head { display: flex; align-items: center; gap: 9px; color: #fff; }
.da-head b { font-size: 17px; letter-spacing: .04em; }
.da-sign { display: block; flex: none; width: 12px; height: 22px; }
.da-sign-postcard { width: 15px; }
.da-sign-candle { width: 22px; height: 20px; }
.da-sign-firework { width: 24px; height: 22px; }
.da-sign-lights { width: 60px; height: 6px; }
.da-sign-lantern { width: 12px; height: 17px; }
.da-close { margin-left: auto; width: 38px; height: 38px; border-radius: 50%; border: 0; background: #fff; color: #15171b; font-size: 20px; }
.da-deck { position: relative; height: min(70vh, 600px); max-height: min(70vh, 600px); touch-action: pan-y; } /* 高度按最长那页定（days.js）；竖着滚归浏览器，横着划留给翻页 */
.days-album.single .da-deck::before, .days-album.single .da-deck::after, .days-album.single .da-nav { display: none; }
.da-deck::before, .da-deck::after { content: ''; position: absolute; inset: 0; border: 2px solid var(--ink); border-radius: 20px; background: var(--card); }
.da-deck::before { transform: rotate(-2.6deg) translate(-5px, 7px); opacity: .7; }
.da-deck::after { transform: rotate(1.8deg) translate(5px, 3px); opacity: .85; }
.da-page { position: absolute; inset: 0; z-index: 1; overflow-y: auto; padding: 22px 22px 20px; border: 2px solid var(--ink); border-radius: 20px;
  background: var(--card); box-shadow: 5px 5px 0 var(--shadow); color: var(--ink); transition: transform .45s cubic-bezier(.3, .7, .2, 1), opacity .35s ease; }
.da-page.is-left { transform: translateX(-55%) rotate(-7deg); opacity: 0; pointer-events: none; }
.da-page.is-right { transform: translateX(55%) rotate(7deg); opacity: 0; pointer-events: none; }
.da-in { min-height: 100%; display: flex; flex-direction: column; justify-content: center; } /* 比卡片短的那页，字放在中间 */
.days-album.measure .da-in { min-height: 0; }
.da-year { margin: 0 0 14px; font-size: 34px; font-weight: 800; letter-spacing: -.02em; line-height: 1; }
.da-item + .da-item { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.da-said { margin: 0 0 12px; font-size: 16px; line-height: 1.8; white-space: pre-line; overflow-wrap: anywhere; }
.da-photos { margin: 0 0 10px; }
.da-src { margin: 0; font-size: 11px; text-transform: none; }
.da-title { font-size: 16px; font-weight: 700; color: var(--ink); }
.da-title:hover, .da-title:focus-visible { color: var(--sea); }
.da-x { margin: 6px 0 8px; font-size: 14px; line-height: 1.75; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.da-quote { margin: 0; }
.da-quote blockquote { margin: 0; padding-left: 12px; border-left: 3px solid var(--sun); font-size: 15px; line-height: 1.85; color: var(--ink-2); }
.da-quote figcaption { margin-top: 8px; font-size: 11px; text-transform: none; }
.da-quote a { color: var(--sea); border-bottom: 1px solid var(--ice); }
.da-nav { display: flex; align-items: center; justify-content: center; gap: 18px; }
.da-nav button { width: 42px; height: 42px; border-radius: 50%; border: 1.5px solid rgba(255, 255, 255, .6); background: rgba(255, 255, 255, .12); color: #fff; font-size: 22px; line-height: 1; }
.da-nav button:disabled { opacity: .3; cursor: default; }
.da-count { color: #dfe7ee; font-size: 12px; }

/* ── 风筝（kite.js）：白天停着不动十来秒，一只北京沙燕从左下往右上斜着升过去，颜色很淡；点它浮出她两条朋友圈 ── */
.kite { position: fixed; left: 0; top: 0; z-index: 15; width: 64px; height: 59px; padding: 0; border: 0; background: none; color: var(--ink); cursor: pointer; will-change: transform; }
.kite svg { display: block; width: 100%; height: 100%; overflow: visible; }
.kite:focus-visible { outline: 2px solid var(--sea); outline-offset: 4px; border-radius: 8px; }
.kite-note { position: fixed; z-index: 16; left: 0; top: 0; max-width: min(280px, calc(100vw - 20px)); padding: 10px 14px; border: 1.5px solid var(--ink); border-radius: 12px;
  background: var(--card); box-shadow: 3px 3px 0 var(--shadow); color: var(--ink); font-size: 13px; line-height: 1.6; }
.kite-note p { margin: 0; white-space: pre-line; }
.kite-note p + p { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line); }
.kite-note small { display: block; font: 11px var(--mono); letter-spacing: .04em; color: var(--ink-3); }

/* ── 敲窗（knock.js）：夜里点小屋亮着的窗，灯晃一下，小屋上方浮出屋里的一个人。两扇窗外面垫着看不见的点击区；指上去，那扇窗亮一点 ── */
.snow-cabin .knock { fill: none; pointer-events: all; }
:root[data-theme="dark"] .snow-cabin .window.knock-hover { fill: #fff1c9; filter: drop-shadow(0 0 3px rgba(255, 225, 160, .95)) drop-shadow(0 0 10px rgba(255, 181, 85, .7)); }
:root[data-theme="dark"] .snow-cabin .window.knocked { animation: knock .7s ease; }
@keyframes knock { 0% { fill: #ffe6aa; } 18% { fill: #b88d4c; } 42% { fill: #fff6d8; } 100% { fill: #ffe6aa; } }

/* ── 南极放到最大（pole-penguin.js）：小屋左边走来一只企鹅，页底那队企鹅的图集（6×6 格）；深色模式换夜里那套 ── */
.pole-penguin { position: absolute; left: 0; top: 0; pointer-events: none; background: url(../assets/penguins/walk-day.webp) 0 0 / 600% 600% no-repeat;
  opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility 0s linear .3s; }
.pole-penguin.on { opacity: 1; visibility: visible; transition: opacity .3s ease; }
:root[data-theme="dark"] .pole-penguin { background-image: url(../assets/penguins/walk-night.webp); filter: drop-shadow(0 0 .8px rgba(255, 255, 255, .85)); } /* 夜里描一圈白边，像地球仪上的贴纸点，不跟冰面的点混在一起 */

/* ── 那年今天去过的地方（globe.js 的 .pin.today）：贴纸点外面一圈太阳色的光，一圈一圈往外散；选中时那圈（::after）照旧 ── */
.pin.today::before { content: ''; position: absolute; inset: 3px; border-radius: 50%; border: 2px solid var(--sun); pointer-events: none; animation: today-ring 2.6s ease-out infinite; }
@keyframes today-ring { from { transform: scale(.6); opacity: .95; } to { transform: scale(2.1); opacity: 0; } }

/* ── 彩蛋找到了几个（eggs.js）：页底雪地左边一颗企鹅蛋 + 「7/11」，裂纹按比例长；集齐了上半壳掀开、站着一只小企鹅。
   左下角的小胶囊是刚找到时的提示；点蛋是一张小卡 ── */
.egg-count { position: absolute; left: 0; top: 0; z-index: 2; display: flex; align-items: flex-end; gap: 5px; padding: 0; border: 0; background: none; color: var(--ink-3); cursor: pointer; }
.egg-count[hidden] { display: none; }
.egg-count::before { content: ''; position: absolute; inset: -10px -8px; }
.egg-count:focus-visible { outline: 2px solid var(--sea); outline-offset: 5px; border-radius: 6px; }
.egg-count .egg { position: relative; display: block; width: 15px; height: 20px; transform-origin: 50% 100%; }
.egg-count .egg svg, .egg-toast svg { display: block; width: 100%; height: 100%; overflow: visible; }
.egg-count .egg svg { position: relative; } /* 盖在小企鹅前面：孵出来时它站在下半壳里，只露上半身 */
.egg-shell { fill: #fffaf0; stroke: var(--ink); stroke-width: 1.6; }
:root[data-theme="dark"] .egg-shell { fill: #e8eef2; stroke: #e8eef2; } /* 夜里墨色是浅的：蛋就是一颗浅色的蛋，裂纹用深色才看得见 */
:root[data-theme="dark"] .egg-crack { stroke: #30404c; }
.egg-crack { fill: none; stroke: var(--ink); stroke-width: 1.1; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: var(--p, 0) 1; transition: stroke-dasharray .7s ease; }
.egg-top { transform-origin: 2px 11.8px; transition: transform .6s cubic-bezier(.3, 1.4, .5, 1); }
.egg-num { font-size: 11px; line-height: 1; letter-spacing: .02em; padding-bottom: 4px; }
.egg-plus { color: var(--sun); }
.egg-count:hover .egg-num, .egg-count:focus-visible .egg-num { color: var(--ink); }
/* 孵出来：上半壳掀到左边，一只小企鹅（页底那队企鹅的图集）站在下半壳里 */
.egg-chick { position: absolute; left: 50%; bottom: 4px; width: 16px; height: 19px; margin-left: -8px; display: none;
  background: url(../assets/penguins/walk-day.webp) 0 0 / 600% 600% no-repeat; }
:root[data-theme="dark"] .egg-chick { background-image: url(../assets/penguins/walk-night.webp); }
.egg-count.hatched .egg-chick { display: block; }
.egg-count.hatched .egg-top { transform: translate(-6px, 3px) rotate(-62deg); }
.egg-count.bump .egg { animation: egg-bump .7s ease; }
@keyframes egg-bump { 0%, 100% { transform: none; } 25% { transform: rotate(-12deg); } 55% { transform: rotate(9deg); } 80% { transform: rotate(-4deg); } }
.egg-toast { position: fixed; z-index: 61; left: 12px; bottom: 12px; display: flex; align-items: center; gap: 8px; margin: 0; padding: 6px 13px 6px 10px;
  border: 1.5px solid var(--ink); border-radius: 999px; background: var(--card); box-shadow: 3px 3px 0 var(--shadow); color: var(--ink); font-size: 13px; line-height: 1.4;
  pointer-events: none; opacity: 0; transform: translateY(8px); transition: opacity .3s ease, transform .3s ease; }
.egg-toast.show { opacity: 1; transform: none; }
.egg-toast svg { width: 12px; height: 16px; flex: none; transform-origin: 50% 100%; }
.egg-toast.show svg { animation: egg-bump .7s ease .2s; }
.egg-toast small { color: var(--ink-3); font-size: 12px; }
.test-date ~ .egg-toast { bottom: 52px; } /* 测试日期的小牌子也在左下角 */
.egg-card { position: absolute; z-index: 6; left: 0; top: 0; width: min(272px, calc(100vw - 20px)); padding: 13px 15px 12px; border: 1.5px solid var(--ink); border-radius: 14px;
  background: var(--card); box-shadow: 3px 3px 0 var(--shadow); color: var(--ink); }
.egg-card:focus { outline: none; }
.egg-card { scroll-margin: calc(var(--nav-h, 56px) + 10px) 0 10px; }
.egg-card-head { display: flex; align-items: baseline; gap: 8px; margin: 0 0 9px; }
.egg-card-head b { font-size: 15px; }
.egg-card-head .mono { font-size: 12px; color: var(--ink-3); }
.egg-card-sub { margin: 11px 0 6px; padding-top: 9px; border-top: 1px dashed var(--line); font-size: 10px; letter-spacing: .08em; color: var(--ink-3); }
.egg-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 3px 12px; font-size: 13px; line-height: 1.45; }
.egg-list li { display: flex; align-items: baseline; gap: 6px; min-width: 0; color: var(--ink-3); }
.egg-list li.got { color: var(--ink); }
.egg-list small { font: 10px var(--mono); color: var(--ink-3); }
.egg-list.limited .mono { font-size: 11px; }
/* 白天 / 夜里才有的：和名字旁边那个开关一样的太阳、月亮；现在不是那个时候就能点，点了换过去 */
.egg-mode { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; margin: -5px 0 -5px -3px; padding: 0; border: 0; border-radius: 50%; background: none; color: inherit; align-self: center; }
.egg-mode svg { width: 12px; height: 12px; overflow: visible; }
.egg-mode.is-dark svg { fill: var(--ink-2); }
:root[data-theme="dark"] .egg-mode.is-dark svg { fill: #efe6c8; }
.egg-mode.is-light svg { fill: var(--sun); }
.egg-mode.is-light .halo { fill: var(--sun-soft); }
button.egg-mode { cursor: pointer; }
button.egg-mode:hover, button.egg-mode:focus-visible { background: var(--hover); outline: none; }

/* ── 极夜的天（sky.js 末尾）：深色模式下页面上缘一层很淡的天色和稀稀拉拉的冷白星星，钉在视口上，垫在结霜、极光后面 ──
   天色：左上角名字旁的月亮那儿透一点月光，整片上缘比底色亮一点、偏一点蓝，往下六成处回到底色；浅色模式下整层淡出 */
.night-sky { position: fixed; left: 0; right: 0; top: 0; height: 100vh; z-index: -3; pointer-events: none; opacity: 0; transition: opacity .8s ease;
  background: radial-gradient(ellipse 44% 32% at 9% 0%, rgba(239, 230, 200, .075), transparent 72%), linear-gradient(180deg, #132a3f 0%, rgba(19, 42, 63, .45) 30%, rgba(19, 42, 63, 0) 62%); }
:root[data-theme="dark"] .night-sky { opacity: 1; }
body[data-page="next"] .night-sky { display: none; }
.night-sky svg { position: absolute; left: 0; top: 0; width: 100%; height: min(55vh, 560px); overflow: visible;
  -webkit-mask-image: linear-gradient(#000 45%, transparent); mask-image: linear-gradient(#000 45%, transparent); }
.night-sky circle { fill: #e4eff6; }
.night-sky use { fill: #f3f8fb; filter: drop-shadow(0 0 2.5px rgba(196, 226, 246, .75)); opacity: var(--o, .85); }
.night-sky .tw { animation: star-twinkle 6s ease-in-out infinite; }
@keyframes star-twinkle { 0%, 100% { opacity: var(--o, .85); } 50% { opacity: calc(var(--o, .85) * .3); } }

/* ── 流星（sky.js 末尾）：深色模式下偶尔从右上往左下划过上半截天；点到它，停下亮一下，浮出她许过的一个愿 ──
   按钮本身是个点（转好方向），里面的 <i> 是能点的一截（28px 高，好点），亮的那道线和流星头是它的前后两个伪元素 */
.meteor { position: fixed; left: 0; top: 0; z-index: 14; width: 0; height: 0; padding: 0; border: 0; background: none; pointer-events: none; }
.meteor[hidden] { display: none; }
.meteor i { position: absolute; left: -140px; top: -14px; width: 140px; height: 28px; pointer-events: auto; cursor: pointer; }
.meteor i::before { content: ''; position: absolute; left: 0; right: 3px; top: 13px; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, rgba(214, 236, 255, 0), rgba(214, 236, 255, .5) 70%, #fff); }
.meteor i::after { content: ''; position: absolute; right: 0; top: 11px; width: 6px; height: 6px; border-radius: 50%; background: #fff; box-shadow: 0 0 8px 3px rgba(200, 228, 255, .85); }
.meteor.caught i::after { box-shadow: 0 0 16px 7px rgba(220, 238, 255, .95); }
.meteor-note { position: fixed; z-index: 16; left: 0; top: 0; max-width: min(280px, calc(100vw - 24px)); margin: 0; padding: 10px 14px; border: 1.5px solid var(--ink); border-radius: 12px;
  background: var(--card); box-shadow: 3px 3px 0 var(--shadow); color: var(--ink); font-size: 13px; line-height: 1.6; }
.meteor-note small { display: block; font: 11px var(--mono); letter-spacing: .04em; color: var(--ink-3); }

/* ── 测试日期的小牌子（today.js）：只在地址里带了 ?date= 时出现 ── */
.test-date { position: fixed; left: 12px; bottom: 12px; z-index: 60; padding: 5px 10px; border: 1px dashed var(--ink-3); border-radius: 999px;
  background: var(--glass-strong); color: var(--ink-2); font-size: 11px; letter-spacing: .04em; text-transform: none; }
.test-date:hover { color: var(--ink); border-color: var(--ink); }

@media (prefers-reduced-motion: reduce) {
  :root[data-polar="day"] .polar-sun.placed, :root[data-polar="day"] .polar-glare.placed { transition: none; }
  :root:not([data-theme="dark"]) nav.top .sun.endless::after { animation: none; }
  .da-page { transition: none; }
  .sign-postcard.arrive .mb-card, .fw, .lt, .ln-swing { animation: none; }
  .pin.today::before { animation: none; transform: scale(1.35); opacity: .75; }
  .night-sky .tw { animation: none; }
  .egg-count.bump .egg, .egg-toast.show svg { animation: none; }
  .egg-crack, .egg-top, .egg-toast { transition: none; }
  .bday-candle .flame { animation: none; }
  :root[data-theme="dark"] .snow-cabin .window.knocked { animation: none; }
}