.short-page .short-hero { display: grid; grid-template-columns: minmax(220px, 360px) minmax(0, 1fr); gap: clamp(30px, 6vw, 80px); align-items: center; padding: 8px 0 30px; }
.short-page .short-watch { width: 100%; max-width: min(360px, 42.75svh); justify-self: center; }
.short-page .short-copy h1 { max-width: 18ch; }
.short-page .short-copy h1 em { color: #84652a; }
.short-page .short-copy > p:not(.eyebrow) { max-width: 53ch; color: var(--subtle); }
.short-page .short-points { margin: 25px 0; border-top: 1px solid var(--rule); }
.short-page .short-points p { font-size: 17px; margin: 0; padding: 13px 0; border-bottom: 1px solid var(--rule); color: var(--subtle); }
.short-page .short-points strong { color: var(--ink); }
.short-page .local-video-preview { padding: 22px; }
.short-page .local-video-preview strong { font-size: clamp(24px, 3vw, 34px); line-height: 1.25; }
.short-page .local-video-preview p { font-size: 14px; }
.short-page .pair-symbol { display: flex; gap: 18px; margin: 24px 0; }
.short-page .pair-symbol span { display: grid; place-items: center; width: 58px; height: 58px; border: 1px solid #8cc4b9; border-radius: 50%; font-size: 36px; font-weight: 400; letter-spacing: 0; }
.short-page .particle-figure { margin: 0 0 25px; background: #e9ede3; border-radius: 10px; padding: 32px 20px 20px; }
.short-page .particle-diagram { display: flex; justify-content: center; align-items: center; gap: clamp(12px, 5vw, 70px); }
.short-page .particle-diagram > div { display: grid; justify-items: center; gap: 8px; }
.short-page .particle { display: grid; place-items: center; width: 100px; height: 100px; border-radius: 50%; font-size: 58px; line-height: 1; margin-bottom: 8px; }
.short-page .electron { background: #234d44; color: #f6f4ed; }
.short-page .positron { background: #ecd193; color: #203b35; }
.short-page .pair-bridge { border-block: 1px solid #bccab6; padding: 10px 0; font-size: 15px; }
.short-page .particle-diagram small, .short-page .particle-figure figcaption { font-size: 13px; color: var(--subtle); }
.short-page .particle-figure figcaption { text-align: center; margin-top: 25px; }
@media (max-width: 760px) { .short-page .short-hero { grid-template-columns: 1fr; gap: 24px; } .short-page .short-watch { max-width: min(330px, 39.375svh); } .short-page .short-copy h1 { max-width: 100%; } .short-page .short-watch #chapter-status { font-size: 12px; } }
@media (max-width: 400px) { .short-page .particle { width: 68px; height: 68px; font-size: 42px; } .short-page .particle-diagram { gap: 12px; } .short-page .pair-bridge { font-size: 12px; } .short-page .particle-diagram small { font-size: 11px; } }
