/* Keep the plain desktop layout; make media and small screens flexible. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { overflow-wrap: anywhere; }
img, video { max-width: 100%; height: auto; }
iframe, input, textarea, select, button { box-sizing: border-box; max-width: 100%; }
pre { max-width: 100%; overflow-x: auto; }
:focus-visible { outline: 2px solid #355879; outline-offset: 3px; }

@media (max-width: 640px) {
    body { margin: 12px; font-size: 16px; line-height: 1.7; }
    h1 { font-size: 1.65em; line-height: 1.35; margin: .7em 0; }
    h2 { font-size: 1.25em; line-height: 1.5; }
    header nav a, footer nav a {
        display: inline-block; min-height: 44px; padding: 6px 3px; box-sizing: border-box;
    }
    nav[aria-label="現在の場所"] a {
        display: inline-block; max-width: 100%; padding: 6px 0; min-height: 44px; box-sizing: border-box;
    }
    .document-entries > a { padding: 7px 0; min-height: 44px; box-sizing: border-box; }
    section p > a[aria-label] { display: inline-block; min-width: 44px; min-height: 44px; padding: 6px; box-sizing: border-box; }
    input, textarea, select, button { font: inherit; }
    input:not([type]), input[type="text"], input[type="url"], input[type="password"],
    input[type="date"], input[type="email"], input[type="number"], textarea, select {
        width: 100%; max-width: 100%; min-width: 0; padding: 7px;
    }
    textarea { display: block; resize: vertical; }
    input[type="file"] { display: block; width: 100%; min-width: 0; }
    input[type="checkbox"], input[type="radio"] { width: 20px; height: 20px; vertical-align: middle; }
    button, input[type="submit"], input[type="reset"] { min-height: 44px; padding: 7px 12px; margin: 4px 0; white-space: normal; }
    input[type="color"] { width: 48px; height: 44px; padding: 2px; }
    form label { display: inline-block; max-width: 100%; }
    .bbs-post-fields, .bbs-post-fields tbody, .bbs-post-fields tr,
    .bbs-post-fields th, .bbs-post-fields td { display: block; width: 100%; box-sizing: border-box; }
    .bbs-post-fields { border-spacing: 0; }
    .bbs-post-fields th { padding: 8px 0 2px; text-align: left; }
    .bbs-post-fields td { padding: 0 0 8px; }
    #editor-toolbar > * { min-width: 0; max-width: 100%; }
    #document-editor { height: 60vh !important; min-height: 280px; max-height: 480px; }
    .category { padding: 12px !important; }
    form.inline { max-width: 100%; }
    main[data-document-body="true"] table { display: block; max-width: 100%; overflow-x: auto; }
}