/* Stillnest's editorial layout, inspired by its original iPhone guide,
   uses the shared site's light palette and system fonts.
   Stillnest shares its header across all three page types. Only introductions opt into the editorial body layout; document content retains the shared theme. */
.stillnest-app, .stillnest-header {
  font-size: 16px;
  line-height: 1.85;
  letter-spacing: .01em;
}
.stillnest-header .site-title { font-size: 25px; line-height: 1.3; letter-spacing: .015em; }
.stillnest-header .header-inner { min-height: 88px; }
.stillnest-header .site-nav a { min-height: 44px; }
.stillnest-header .language-menu summary { border-radius: 24px; }
.stillnest-app .site-footer { padding-block: 40px; }
.stillnest-app .footer-heading { font-size: 24px; line-height: 1.4; }
.stillnest-app .site-footer p { font-size: 13px; }
.stillnest-app h1, .stillnest-app h2, .stillnest-app h3 { letter-spacing: 0; }
.stillnest-app figcaption { font-size: 13px; }
.stillnest-app figcaption strong { color: var(--text); font-weight: 500; }
.stillnest-app .screenshot-more summary { min-height: 44px; font-weight: 400; }
.stillnest-story .page-content { padding-block: 0; }
.stillnest-story .page-content > .wrapper { max-width: 1216px; }
.stillnest-story article h2 { margin: 0; padding: 0; border: 0; font-size: clamp(30px, 3vw, 38px); line-height: 1.45; }
.stillnest-story article h3 { margin: 0 0 12px; font-size: 23px; line-height: 1.5; }
.stillnest-hero { display: grid; grid-template-columns: 1.05fr .95fr; gap: 80px; align-items: center; padding-block: 72px 80px; }
.stillnest-eyebrow { margin-bottom: 26px; color: var(--accent); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; }
.stillnest-story h1 { margin: 0 0 28px; font-size: clamp(44px, 4.8vw, 66px); line-height: 1.22; letter-spacing: -.015em; }
.stillnest-story:lang(zh) h1, .stillnest-story:lang(ja) h1 { font-size: clamp(36px, 4.2vw, 54px); line-height: 1.5; letter-spacing: .02em; }
.stillnest-intro { max-width: 460px; color: var(--muted); font-size: 16px; }
.stillnest-badges { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.stillnest-badges span { padding: 6px 13px; border: 1px solid var(--border); border-radius: 28px; color: var(--muted); font-size: 12px; }
.stillnest-hero-links { margin: 26px 0 0; font-size: 13px; }
.stillnest-cover { position: relative; overflow: hidden; margin: 0; border-radius: 3px; background: #132025; }
.stillnest-cover img { display: block; width: 100%; height: auto; }
.stillnest-cover::after { position: absolute; inset: 35% 0 0; background: linear-gradient(transparent, #07100ee8); content: ""; pointer-events: none; }
.stillnest-cover figcaption { position: absolute; z-index: 1; inset: auto 32px 32px; margin: 0; color: #dce3dd; }
.stillnest-cover figcaption strong { margin-bottom: 8px; color: #eee6d5; font-size: 27px; line-height: 1.4; font-weight: 400; }
.stillnest-cover figcaption span { display: block; }
.stillnest-section-nav { display: flex; flex-wrap: wrap; gap: 8px 34px; padding-block: 12px; border-block: 1px solid var(--border); }
.stillnest-section-nav a { display: inline-flex; align-items: baseline; gap: 12px; padding-block: 10px; color: var(--muted); font-size: 13px; text-decoration: none; }
.stillnest-section-nav span { color: var(--accent); font-size: 12px; line-height: normal; }
.stillnest-section { margin: 0; padding-block: 76px; border-bottom: 1px solid var(--border); }
.stillnest-section-head { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; margin-bottom: 42px; align-items: start; }
.stillnest-section-head p { margin: 4px 0 0; color: var(--muted); font-size: 15px; }
.stillnest-feature-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 64px; }
.stillnest-feature { border-top: 1px solid var(--border); padding-top: 24px; }
.feature-number { display: block; margin-bottom: 17px; color: var(--accent); font-size: 26px; line-height: 1; font-weight: 400; }
.stillnest-feature p { max-width: 48ch; margin: 0; color: var(--muted); font-size: 15px; }
.stillnest-timer { display: grid; grid-template-columns: 1fr auto; gap: 56px; align-items: center; margin-top: 48px; padding: 40px 44px; border: 1px solid var(--border); background: linear-gradient(120deg, var(--surface), var(--background)); }
.stillnest-timer p { max-width: 57ch; margin: 0; color: var(--muted); font-size: 15px; }
.stillnest-timer .stillnest-timer-number { margin-bottom: 18px; color: var(--accent); font-size: 80px; line-height: 1; font-weight: 400; letter-spacing: -.04em; }
.stillnest-timer-number span { margin-left: 10px; font-size: 21px; letter-spacing: 0; }
.stillnest-durations { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.stillnest-durations span { min-width: 66px; padding: 9px 15px; border: 1px solid var(--border); border-radius: 30px; color: var(--accent); text-align: center; font-size: 21px; line-height: 1.5; font-weight: 400; }
.stillnest-story .screenshot-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
.stillnest-story .screenshot-grid figure { min-width: 0; margin: 0; }
.stillnest-story .screenshot-grid img { border-color: var(--border); border-radius: 8px; }
.stillnest-story .screenshot-grid figcaption { font-size: 12px; }
.stillnest-story .screenshot-more { margin-top: 34px; }
.stillnest-story .preview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; max-width: 600px; margin-inline: auto; }
.stillnest-story .preview-grid figure { min-width: 0; margin: 0; }
.stillnest-story .preview-grid video { display: block; width: 100%; height: auto; border: 1px solid var(--border); border-radius: 10px; background: #08100f; }
.stillnest-essentials { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; }
.stillnest-essentials p { margin: 18px 0 0; color: var(--muted); font-size: 15px; }
.stillnest-essentials .stillnest-price { margin: 0 0 16px; color: var(--accent); font-size: 44px; line-height: 1.3; font-weight: 400; letter-spacing: -.025em; }
.stillnest-help { display: grid; grid-template-columns: 1fr auto; gap: 64px; border: 0; }
.stillnest-help p { max-width: 51ch; margin: 20px 0 0; color: var(--muted); font-size: 15px; }
.stillnest-help ul { margin: 0; list-style: none; align-self: center; }
.stillnest-help li { margin: 0; padding: 0; }
.stillnest-help a { display: inline-block; padding-block: 10px; }
@media (max-width: 1050px) {
  .stillnest-hero { gap: 40px; }
  .stillnest-story .screenshot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
}
@media (max-width: 850px) {
  .stillnest-hero { grid-template-columns: 1fr; gap: 36px; padding-block: 48px 56px; }
  .stillnest-hero-copy { max-width: 600px; }
  .stillnest-cover { width: 100%; max-width: 580px; margin-inline: auto; }
  .stillnest-section { padding-block: 54px; }
  .stillnest-section-head, .stillnest-essentials { gap: 32px; }
  .stillnest-feature-grid { gap: 32px; }
  .stillnest-timer { gap: 30px; padding: 30px; }
}
@media (max-width: 600px) {
  .stillnest-header .site-title { font-size: 23px; }
  .stillnest-header .header-inner { min-height: 76px; }
  .stillnest-header .site-nav { gap: 4px 24px; }
  .stillnest-story h1 { font-size: 39px; }
  .stillnest-story:lang(zh) h1, .stillnest-story:lang(ja) h1 { font-size: clamp(28px, 8.7vw, 36px); }
  .stillnest-eyebrow { margin-bottom: 20px; font-size: 11px; }
  .stillnest-intro { font-size: 15px; }
  .stillnest-badges { gap: 8px; margin-top: 24px; }
  .stillnest-badges span { padding: 5px 10px; font-size: 11px; }
  .stillnest-cover figcaption { inset: auto 24px 24px; }
  .stillnest-cover figcaption strong { font-size: 24px; }
  .stillnest-section-nav { gap: 0 24px; }
  .stillnest-section-nav a { font-size: 12px; }
  .stillnest-section { padding-block: 44px; }
  .stillnest-section-head { grid-template-columns: 1fr; gap: 16px; margin-bottom: 30px; }
  .stillnest-story article h2 { font-size: 29px; }
  .stillnest-feature-grid, .stillnest-timer, .stillnest-essentials, .stillnest-help { grid-template-columns: 1fr; gap: 30px; }
  .stillnest-timer { margin-top: 34px; padding: 28px 24px; }
  .stillnest-timer .stillnest-timer-number { font-size: 70px; }
  .stillnest-durations { display: flex; flex-wrap: wrap; gap: 8px; }
  .stillnest-durations span { min-width: 56px; padding: 6px 10px; }
  .stillnest-story .screenshot-grid { display: flex; overflow-x: auto; gap: 18px; max-width: none; padding: 4px 4px 18px; scroll-snap-type: x proximity; }
  .stillnest-story .screenshot-grid figure { flex: 0 0 80%; scroll-snap-align: start; }
  .stillnest-story .screenshot-grid figcaption { font-size: 13px; }
  .stillnest-story .preview-grid { grid-template-columns: 1fr; gap: 30px; max-width: 320px; }
}