.sample-shell { max-width: 1200px; }
.sample-shell h1 { font-size: 36px; }
.sample-nav { display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 32px; }
.sample-meta { color: var(--muted); margin: 16px 0; }
.sample-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 16px 0; }
.sample-controls button, .sample-unlock button { min-height: 44px; border: 1px solid var(--line); border-radius: 4px; padding: 8px 14px; background: white; color: var(--ink); font: inherit; cursor: pointer; }
.sample-controls button:disabled { opacity: .45; cursor: default; }
.sample-controls button[aria-pressed="true"] { border-color: var(--accent); color: var(--accent); }
.sample-controls .page-counter { min-width: 100px; font-variant-numeric: tabular-nums; }
.sample-frame { display: block; width: 100%; aspect-ratio: 16 / 9; border: 1px solid var(--line); background: var(--soft); }
.sample-frame.pdf { aspect-ratio: 4 / 3; }
.sample-reading { margin-top: 32px; }
.sample-reading > section { padding: 28px 0; border-top: 1px solid var(--line); overflow-wrap: anywhere; }
.sample-reading h2, .sample-reading h3 { margin-top: 20px; font-size: 22px; }
.sample-reading p, .sample-reading li { line-height: 1.8; }
.sample-reading img { display: block; max-width: 100%; max-height: 360px; object-fit: contain; margin: 16px 0; }
.sample-reading table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; font-size: 14px; }
.sample-reading th, .sample-reading td { padding: 10px; border: 1px solid var(--line); min-width: 100px; vertical-align: top; text-align: left; }
.sample-reading small { color: var(--muted); }
.sample-unlock { margin-top: 48px; padding: 32px 0; border-top: 3px solid var(--accent); }
.sample-unlock .wechat { font-size: 24px; font-weight: 700; }
.sample-unlock a { display: inline-block; margin-top: 16px; }
.sample-shell[data-mode="slides"] .sample-reading { display: none; }
.sample-shell[data-mode="text"] .sample-frame, .sample-shell[data-mode="text"] .page-controls { display: none; }
[hidden] { display: none !important; }
@media (max-width: 760px) {
  .sample-shell h1 { font-size: 28px; }
  .sample-shell { padding-top: 32px; }
}
