.md-size-guide-link { display: block; width: fit-content; margin: 10px 0 4px auto; font-family: var(--font-body); font-size: 12px; font-weight: 500; color: var(--text-primary); text-underline-offset: 4px; }
.md-size-guide-link:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
dialog.md-size-guide { box-sizing: border-box; position: fixed; inset: 0 0 0 auto; margin: 0; border: 0; padding: 0; width: min(560px, 100%); max-width: 100%; height: 100vh; height: 100dvh; max-height: 100%; background: var(--bg-primary, #faf8f5); color: var(--text-primary, #2c2520); box-shadow: -12px 0 50px #0002; }
dialog.md-size-guide:not([open]) { display: none; }
dialog.md-size-guide[open] { display: flex; flex-direction: column; }
.md-size-guide::backdrop { background: rgba(25,22,19,.48); }
dialog.md-size-guide[open] { animation: md-size-guide-in 320ms cubic-bezier(.22,1,.36,1) both; }
.md-size-guide[open]::backdrop { animation: md-size-guide-backdrop-in 320ms ease both; }
dialog.md-size-guide.is-closing { animation: md-size-guide-out 220ms ease-in both; }
.md-size-guide.is-closing::backdrop { animation: md-size-guide-backdrop-out 220ms ease-in both; }
@keyframes md-size-guide-in { from { transform: translateX(100%); } to { transform: translateX(0); } }
@keyframes md-size-guide-out { from { transform: translateX(0); } to { transform: translateX(100%); } }
@keyframes md-size-guide-backdrop-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes md-size-guide-backdrop-out { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
    dialog.md-size-guide[open], .md-size-guide[open]::backdrop { animation: none; }
}
.md-size-guide__header { flex: 0 0 auto; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: max(18px, env(safe-area-inset-top)) 24px 18px; border-bottom: 1px solid var(--border, #e6dfd5); }
.md-size-guide__header h2 { font-family: var(--font-heading); font-size: 25px; font-weight: 400; margin: 0; }
.md-size-guide__close { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; background: transparent; color: inherit; border: 0; cursor: pointer; }
.md-size-guide__close:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.md-size-guide__body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 16px 16px max(24px, env(safe-area-inset-bottom)); }
.md-size-guide__body img { display: block; width: 100%; height: auto; }
.md-size-guide__body p { font-family: var(--font-body); font-size: 12px; line-height: 1.6; color: var(--text-secondary); margin: 16px 8px 0; }
@media (max-width: 600px) { .md-size-guide__header { padding-left: 16px; padding-right: 12px; } .md-size-guide__body { padding-left: 8px; padding-right: 8px; } }