.media-modal{overscroll-behavior:contain;background:var(--ink-modal);width:100%;max-width:none;height:100dvh;max-height:none;color:var(--text-on-dark);--focus:#ff8a1f;border:0;margin:0;padding:0;position:fixed;inset:0}.media-modal[open]{flex-direction:column;display:flex}.media-modal::backdrop{background:#000}.media-modal__bar{padding:max(12px, var(--safe-t)) max(clamp(12px, 3vw, 24px), var(--safe-r)) 12px max(clamp(12px, 3vw, 24px), var(--safe-l));flex:none;justify-content:space-between;align-items:center;gap:16px;display:flex}.media-modal__title{font-family:var(--font-mono);letter-spacing:.08em;color:var(--faint-on-dark);white-space:nowrap;text-overflow:ellipsis;font-size:.7812rem;overflow:hidden}.media-modal__btn{width:52px;height:52px;color:var(--text-on-dark);cursor:pointer;transition:background var(--dur-base), border-color var(--dur-base), transform var(--dur-fast);background:#ffffff0a;border:1px solid #ffffff38;border-radius:50%;flex:none;justify-content:center;align-items:center;display:flex}@media (hover:hover){.media-modal__btn:hover{background:#ffffff1a;border-color:#ffffff73}}.media-modal__btn:active{transform:scale(.94)}.media-modal__stage{min-height:0;padding:0 max(12px, var(--safe-r)) 0 max(12px, var(--safe-l));touch-action:pan-y;flex:1;justify-content:center;align-items:center;display:flex;position:relative}.media-modal__stage.is-loading .media-modal__img{opacity:.55;transition:opacity var(--dur-base)}.media-modal__img{object-fit:contain;user-select:none;width:auto;max-width:100%;height:auto;max-height:100%;display:block}.media-modal__video{aspect-ratio:9/16;object-fit:contain;background:#000;border-radius:8px;width:auto;max-width:100%;height:100%;max-height:100%;display:block}.media-modal__img[hidden],.media-modal__video[hidden]{display:none}.media-modal__foot{padding:12px max(clamp(12px, 3vw, 24px), var(--safe-r)) max(16px, var(--safe-b)) max(clamp(12px, 3vw, 24px), var(--safe-l));flex-direction:column;flex:none;align-items:center;gap:10px;display:flex}.media-modal__caption{text-align:center;max-width:640px;color:var(--muted-on-dark);text-wrap:pretty;font-size:.875rem;line-height:1.5}.media-modal__controls{align-items:center;gap:20px;display:flex}.media-modal__controls[hidden]{display:none}.media-modal__counter{text-align:center;min-width:56px;font-family:var(--font-mono);font-size:.875rem}.media-modal__sound{color:#fff;cursor:pointer;height:48px;transition:background var(--dur-base), transform var(--dur-fast);background:#ffffff0f;border:1px solid #ffffff47;border-radius:999px;align-items:center;gap:10px;padding:0 20px;font-size:.9375rem;font-weight:600;display:inline-flex}.media-modal__sound[hidden]{display:none}@media (hover:hover){.media-modal__sound:hover{background:#ffffff1f}}.media-modal__sound:active{transform:scale(.96)}@media (prefers-reduced-motion:no-preference){.media-modal[open]{animation:modal-in var(--dur-base) ease-out}.media-modal__img.is-swapping{animation:img-in var(--dur-base) ease-out}}@keyframes modal-out{to{opacity:0}}@media (prefers-reduced-motion:no-preference){.media-modal.is-closing{animation:modal-out var(--dur-fast) ease-in forwards}}@media (orientation:landscape) and (height<=520px){.media-modal__bar{padding-top:max(6px, var(--safe-t));padding-bottom:6px}.media-modal__bar .media-modal__btn{width:44px;height:44px}.media-modal__title{max-width:calc(50% - 56px);font-size:.75rem}.media-modal__stage{padding-bottom:max(8px, var(--safe-b))}.media-modal__foot{gap:0;padding:0}.media-modal__caption,.media-modal__sound{display:none}.media-modal__controls{padding:0 max(8px, var(--safe-r)) 0 max(8px, var(--safe-l));pointer-events:none;justify-content:space-between;align-items:center;gap:0;position:absolute;inset:0}.media-modal__controls .media-modal__btn{pointer-events:auto;width:44px;height:44px}.media-modal__counter{top:max(6px, var(--safe-t));min-width:0;line-height:44px;position:absolute;left:50%;transform:translate(-50%)}}@keyframes modal-in{0%{opacity:0}}@keyframes img-in{0%{opacity:.25}}.doc-btn svg,.doc-btn--close{flex:none}.doc-btn{min-height:2.75rem;color:var(--text-on-dark);white-space:nowrap;cursor:pointer;transition:background var(--dur-base), border-color var(--dur-base), transform var(--dur-fast), opacity var(--dur-base);background:#ffffff0a;border:1px solid #ffffff38;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:.25rem 1rem;font-size:.9375rem;font-weight:600;line-height:1.2;display:inline-flex}@media (hover:hover){.doc-btn:hover{color:#fff;background:#ffffff1a;border-color:#ffffff73}}.doc-btn:active{transform:scale(.96)}.doc-btn[aria-disabled=true]{opacity:.4;cursor:default}.doc-btn[aria-disabled=true]:active{transform:none}.doc-btn--link{color:var(--orange-soft)}.doc-viewer__stage{min-height:0;margin:0 max(12px, var(--safe-r)) 0 max(12px, var(--safe-l));touch-action:none;-webkit-user-select:none;user-select:none;background:#0b0a09;border-radius:10px;flex:1;position:relative;overflow:hidden}.doc-viewer__stage.is-zoomed{cursor:grab}.doc-viewer__stage.is-dragging.is-zoomed{cursor:grabbing}.doc-viewer__img{object-fit:contain;transform-origin:50%;will-change:transform;width:100%;height:100%;display:block;position:absolute;inset:0}.doc-viewer__img.is-animating{transition:transform var(--dur-base) var(--ease-out)}.doc-viewer__stage.is-loading .doc-viewer__img{opacity:.5}.doc-viewer__foot{padding:12px max(clamp(12px, 3vw, 24px), var(--safe-r)) max(16px, var(--safe-b)) max(clamp(12px, 3vw, 24px), var(--safe-l));flex-wrap:wrap;flex:none;justify-content:center;align-items:center;gap:10px 14px;display:flex}.doc-viewer__tools{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.doc-viewer__level{text-align:center;min-width:3.5rem;font-family:var(--font-mono);font-size:.875rem}.doc-viewer__note{border-left:3px solid var(--orange);text-align:left;max-width:46rem;color:var(--muted-on-dark);background:#ffffff0f;border-radius:0 8px 8px 0;flex-basis:100%;margin:0 auto;padding:8px 12px;font-size:.875rem;line-height:1.45}.doc-viewer__hint{text-align:center;color:var(--faint-on-dark);flex-basis:100%;font-size:.8125rem;line-height:1.45}@media (orientation:landscape) and (height<=520px){.doc-viewer__foot{padding-top:6px;padding-bottom:max(8px, var(--safe-b));gap:8px 12px}.doc-viewer__hint{display:none}.doc-viewer__note{padding:4px 10px;font-size:.8125rem}.doc-viewer .media-modal__bar .doc-btn{min-height:2.5rem}}
