.pdf-card { --attribution-secondary: #dcc5cd; --card-footer-color: #c7b0ba; position: relative; width: 100%; height: 100%; color: #fff9f6; background: radial-gradient(ellipse at 20% 25%, #91616e66, transparent 65%), radial-gradient(ellipse at 90% 90%, #79485344, transparent 55%), #442a34; }
.pdf-card__viewer { position: absolute; top: var(--format-top); bottom: calc(var(--content-bottom) + 210px); left: max(var(--edge), env(safe-area-inset-left)); right: max(var(--edge), env(safe-area-inset-right)); display: flex; flex-direction: column; align-items: center; gap: 10px; }
.pdf-card__toolbar { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 44px; flex: none; }
.pdf-card__label { margin: 0; font-size: 9px; font-weight: 650; letter-spacing: .12em; }
.pdf-card__download { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: #ffffff10; color: inherit; text-decoration: none; }
.pdf-card__download svg { width: 22px; height: 22px; }
.pdf-card__preview { position: relative; flex: 1; min-height: 0; width: 100%; display: flex; justify-content: center; padding: 7px 0; pointer-events: none; }
.pdf-card__paper { position: relative; height: 100%; max-height: 460px; aspect-ratio: 3 / 4; max-width: calc(100% - 44px); border-radius: 4px 10px 10px 4px; background: #fffaf3; box-shadow: 0 16px 32px -12px #1c0e2299; }
.pdf-card__paper::before, .pdf-card__paper::after { content: ''; position: absolute; inset: 2px; border-radius: inherit; background: #dbcbd0; transform: rotate(3deg); }
.pdf-card__paper::after { background: #ebdce0; transform: rotate(-2deg); }
.pdf-card__cover { position: relative; z-index: 1; display: block; height: 100%; width: 100%; object-fit: contain; border-radius: inherit; }
.pdf-card__fallback { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; height: 100%; padding: 12px; color: #8c4a54; background: #fffaf3; border-radius: inherit; font-size: 12px; text-align: center; }
.pdf-card__fallback p { margin: 0; }
.pdf-card__file-icon svg { display: block; width: 48px; height: 48px; }
.pdf-card__meta { flex: none; margin: 0; font-size: 10px; color: #e2ced5; }
.pdf-card__read { flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 28px; min-height: 44px; padding: 0 22px; border: 1px solid #fff3; border-radius: 24px; background: #fff8f2; color: #583b46; font: inherit; font-size: 13px; font-weight: 650; cursor: pointer; }
.pdf-card__read::after { content: '↗'; font-size: 18px; }
.pdf-card__info { position: absolute; bottom: calc(var(--content-bottom) + 62px); left: max(var(--edge), env(safe-area-inset-left)); right: calc(max(var(--edge), env(safe-area-inset-right)) + var(--social-reserve)); }
.pdf-card__info .card-attribution__name, .pdf-card__info .card-attribution__description { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
.pdf-card__info .card-attribution__name { -webkit-line-clamp: 2; max-width: 26ch; }
.pdf-card__info .card-attribution__description { -webkit-line-clamp: 3; max-width: 38ch; }
.pdf-card__footer { position: absolute; bottom: var(--content-bottom); left: max(var(--edge), env(safe-area-inset-left)); right: max(var(--edge), env(safe-area-inset-right)); }
.pdf-card__notice { position: absolute; z-index: 2; top: var(--format-top); left: var(--edge); right: var(--edge); }
.pdf-card button:focus-visible, .pdf-card a:focus-visible { outline: 2px solid #fff1cc; outline-offset: 3px; }
.pdf-reader-sheet { touch-action: pan-x pan-y pinch-zoom; --sheet-surface: #faf5f5; --sheet-ink: #442a34; --sheet-control: #f0e3e5; --sheet-control-ink: #8c4a54; --sheet-border: #e7d6da; --sheet-muted: #765d66; --sheet-focus: #8c4a54; --sheet-handle: #d8c3ca; --sheet-backdrop: #21151e88; height: 92dvh; max-height: calc(100dvh - env(safe-area-inset-top) - 8px); }
.pdf-reader-sheet .sheet__header { padding-block: 12px; }
.pdf-reader { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.pdf-reader__controls { display: flex; flex: none; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px; padding: 4px 8px; border-bottom: 1px solid var(--sheet-border); }
.pdf-reader__pages, .pdf-reader__reading { display: flex; align-items: center; gap: 4px; }
.pdf-reader__reading { margin-inline-start: auto; }
.pdf-reader__controls button, .pdf-reader__controls select { min-height: 44px; min-width: 44px; border: 0; border-radius: 10px; color: #633e4b; background: transparent; font: inherit; font-size: 12px; }
.pdf-reader__controls button:disabled { opacity: .4; cursor: default; }
.pdf-reader__controls .pdf-reader__previous, .pdf-reader__controls .pdf-reader__next { font-size: 21px; }
.pdf-reader__count { font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; min-width: 42px; text-align: center; }
.pdf-reader__controls select { padding: 0 2px; max-width: 82px; font-size: 16px; }
.pdf-reader__controls .pdf-reader__fit { padding-inline: 8px; font-weight: 650; background: #e8d6dd; }
.pdf-reader__text-toggle[aria-pressed="true"] { background: #e8d6dd; }
.pdf-reader__controls select:focus-visible { outline: 2px solid var(--sheet-focus); }
.pdf-reader__viewport { touch-action: pan-x pan-y pinch-zoom; position: relative; flex: 1; overflow: auto; padding: 12px; background: #e9e1e4; user-select: text; -webkit-user-select: text; }
.pdf-reader__page { width: max-content; min-width: 100%; }
.pdf-reader__canvas { display: block; margin: 0 auto; background: white; box-shadow: 0 4px 16px #38232b1a; }
.pdf-reader__text { max-width: 68ch; margin: 0 auto; padding: 20px; border-radius: 10px; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 16px; line-height: 1.65; color: #38232b; background: #fffaf7; }
.pdf-reader__status { margin: 30px auto 12px; max-width: 34ch; font-size: 13px; text-align: center; line-height: 1.5; color: #633e4b; }
.pdf-reader .pdf-reader__retry { display: block; margin: 12px auto; min-height: 44px; padding: 0 24px; border-radius: 24px; color: #fff; background: #8c4a54; font-size: 13px; }
.pdf-reader-sheet__links { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex: none; padding: 0 max(12px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(12px, env(safe-area-inset-left)); border-top: 1px solid var(--sheet-border); }
.pdf-reader-sheet__links a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; font-size: 11px; text-decoration: none; color: #633e4b; }
.pdf-reader-sheet__links a:focus-visible { outline: 2px solid var(--sheet-focus); outline-offset: -2px; }
@media (max-width: 359px) {
  .pdf-reader__pages, .pdf-reader__reading { flex-basis: 100%; justify-content: center; margin-inline: 0; }
}
@media (max-height: 650px) and (max-width: 699px) {
  .pdf-card__viewer { bottom: calc(var(--content-bottom) + 172px); gap: 6px; }
  .pdf-card__info { bottom: calc(var(--content-bottom) + 34px); }
  .pdf-card__info .card-attribution__description { font-size: 12px; margin-top: 8px; }
  .pdf-card__preview { padding-block: 4px; }
}
@media (min-width: 700px) {
  .pdf-card__viewer { left: 36%; right: calc(var(--edge) + var(--social-reserve)); bottom: calc(var(--content-bottom) + 34px); }
  .pdf-card__info { right: auto; width: 28%; }
  .pdf-reader-sheet { inset: 16px; margin: auto; width: min(940px, calc(100vw - 32px)); height: calc(100dvh - 32px); max-height: none; }
  .pdf-reader__controls { padding-inline: 20px; gap: 12px; }
  .pdf-reader__pages, .pdf-reader__reading { gap: 12px; }
  .pdf-reader__reading { margin-inline-start: 30px; }
}
@media (min-width: 560px) and (max-height: 480px) {
  .pdf-card__viewer { left: 37%; right: calc(var(--edge) + var(--social-reserve)); bottom: calc(var(--content-bottom) + 24px); display: grid; grid-template-columns: 40% 1fr; grid-template-rows: 44px 1fr auto; gap: 6px 12px; }
  .pdf-card__toolbar { grid-column: 1 / -1; }
  .pdf-card__preview { grid-row: 2 / 4; height: 100%; padding: 0; }
  .pdf-card__paper { max-width: 100%; }
  .pdf-card__meta { align-self: end; text-align: center; }
  .pdf-card__read { align-self: start; font-size: 11px; padding-inline: 10px; gap: 8px; }
  .pdf-card__info { top: calc(var(--format-top) + 34px); bottom: auto; right: auto; width: 32%; }
  .pdf-card__info .card-attribution__name { font-size: 22px; }
  .pdf-card__info .card-attribution__description { font-size: 11px; margin-top: 8px; }
  .pdf-reader-sheet { height: calc(100dvh - 8px); }
  .pdf-reader-sheet .sheet__handle, .pdf-reader-sheet .sheet__heading p { display: none; }
  .pdf-reader-sheet .sheet__header { padding-block: 4px; }
}
