/* 2026-10-11 · 下午三点四十分。它是一张午后小票，不是实时钟表。 */
.afternoon-page{margin:6px auto 56px}
.afternoon-page-paper{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(170px,.34fr) minmax(0,.66fr);background:var(--paper);border:1px solid var(--line);box-shadow:4px 5px 0 var(--paper-alt),0 15px 27px -22px var(--shadow)}
.afternoon-page-paper::after{content:"";position:absolute;inset:13px;border:1px solid var(--line);opacity:.28;pointer-events:none}
.afternoon-page-time{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:350px;padding:25px 16px;background:radial-gradient(circle at 28% 12%,rgba(255,222,178,.31),transparent 53%),linear-gradient(155deg,var(--paper-alt),var(--paper));border-right:1px dashed var(--line)}
.afternoon-page-stamp{font:11px/1.5 var(--sans);letter-spacing:.15em;color:var(--muted);text-align:center}
.afternoon-page-clock{position:relative;width:143px;height:143px;margin:8px 0 2px;border:2px solid var(--rose);border-radius:50%;background:var(--paper);box-shadow:0 6px 12px -12px var(--shadow),inset 0 0 0 6px var(--paper-alt);color:var(--muted);font:12px/1 Georgia,serif}
.afternoon-page-clock>span{position:absolute;display:block}
.afternoon-page-twelve{top:14px;left:50%;transform:translateX(-50%)}.afternoon-page-three{right:16px;top:50%;transform:translateY(-50%)}.afternoon-page-six{bottom:14px;left:50%;transform:translateX(-50%)}.afternoon-page-nine{left:16px;top:50%;transform:translateY(-50%)}
.afternoon-page-clock i{position:absolute;display:block;left:50%;bottom:50%;border-radius:8px;transform-origin:center bottom}
.afternoon-page-hour{width:4px;height:37px;background:var(--heading);transform:translateX(-50%) rotate(110deg)}
.afternoon-page-minute{width:2px;height:52px;background:var(--accent);transform:translateX(-50%) rotate(240deg)}
.afternoon-page-clock i.afternoon-page-pin{left:50%;top:50%;bottom:auto;width:8px;height:8px;background:var(--rose);border:2px solid var(--paper);border-radius:50%;transform:translate(-50%,-50%)}
.afternoon-page-digit{font:italic 28px/1.25 Georgia,serif;letter-spacing:.07em;color:var(--heading)}.afternoon-page-digit small{font:10px var(--sans);color:var(--muted);letter-spacing:.1em}.afternoon-page-caption{font:13px/1.65 var(--serif);color:var(--muted);letter-spacing:.12em}
.afternoon-page-copy{position:relative;padding:clamp(28px,4.5vw,54px) clamp(24px,4.3vw,62px) 37px}
.afternoon-page-eyebrow{font:11px/1.8 var(--sans);letter-spacing:.15em;color:var(--muted)}
.afternoon-page-copy h2{font:500 clamp(28px,3.45vw,46px)/1.49 var(--serif);color:var(--heading);margin:13px 0 17px}
.afternoon-page-copy>p{max-width:38em;font:16px/2.05 var(--serif);color:var(--ink)}
.afternoon-page-secret{max-width:520px;margin-top:24px;border-top:1px dashed var(--line);border-bottom:1px dashed var(--line)}
.afternoon-page-secret summary{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px 0;min-height:44px;cursor:pointer;list-style:none;font:14px/1.7 var(--serif);color:var(--heading)}
.afternoon-page-secret summary::-webkit-details-marker{display:none}.afternoon-page-secret summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.afternoon-page-secret summary span{font:18px Georgia,serif;transition:transform .2s}.afternoon-page-secret[open] summary span{transform:rotate(45deg)}
.afternoon-page-secret>div{padding:14px 20px 17px;margin:1px 0 17px;background:var(--paper-alt);border-left:2px solid var(--rose)}
.afternoon-page-secret>div p{margin:0 0 5px;font:15px/1.85 var(--serif)}.afternoon-page-secret>div small{display:block;margin-top:7px;font:12px/1.7 var(--serif);color:var(--muted)}
.afternoon-page-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 26px;margin-top:22px}
.afternoon-page-primary{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 0;border-bottom:1px solid var(--accent);font:15px/1.7 var(--serif);color:var(--heading)}
.afternoon-page-primary span{transition:transform .2s}.afternoon-page-primary:hover span{transform:translate(3px,-3px)}
.afternoon-page-secondary{padding:10px 0;font:13px/1.6 var(--serif);color:var(--muted);text-decoration:underline;text-decoration-color:var(--rose);text-underline-offset:5px}
@media(max-width:720px){.afternoon-page{margin-bottom:42px}.afternoon-page-paper{grid-template-columns:1fr}.afternoon-page-time{min-height:132px;display:grid;grid-template-columns:78px 1fr;grid-template-rows:repeat(3,auto);justify-items:start;align-content:center;column-gap:17px;row-gap:2px;padding:16px 25px;border-right:0;border-bottom:1px dashed var(--line)}.afternoon-page-clock{grid-row:1 / span 3;grid-column:1;width:76px;height:76px;margin:0}.afternoon-page-clock>span{font-size:9px}.afternoon-page-twelve{top:5px}.afternoon-page-three{right:7px}.afternoon-page-six{bottom:5px}.afternoon-page-nine{left:7px}.afternoon-page-hour{height:21px;width:3px}.afternoon-page-minute{height:29px}.afternoon-page-digit{font-size:21px}.afternoon-page-stamp,.afternoon-page-caption{font-size:10px;letter-spacing:.06em}.afternoon-page-copy{padding:27px 26px 31px}.afternoon-page-copy h2{font-size:29px}.afternoon-page-copy>p{font-size:15px}}
@media(prefers-reduced-motion:reduce){.afternoon-page-secret summary span,.afternoon-page-primary span{transition:none}}
