/* Inherit site/src + D03 v6: paper, serif reading, enlarged complete scene. */
@font-face { font-family: "Harugalpi Local Reader"; src: url("./reader-body.woff2") format("woff2"); font-weight: 400; font-display: swap; }
:root { color-scheme: light; background: #f7f3e8; color: #252a27; }
* { box-sizing: border-box; }
body { margin: 0; font: 400 20px/1.75 "Harugalpi Local Reader", serif; }
.sheet { width: calc(100% - 48px); max-width: 480px; margin: 32px auto 64px; }
.date { margin: 0 0 16px; color: #526058; font: 400 14px/1.6 system-ui, sans-serif; }
h1 { margin: 0 0 16px; font-size: 24px; font-weight: 400; line-height: 1.45; word-break: keep-all; overflow-wrap: anywhere; }
.art-frame { position: relative; width: 100%; aspect-ratio: 3 / 2; overflow: hidden; margin-bottom: 16px; }
.art { display: block; width: 100%; height: auto; }
.d03-zoom { aspect-ratio: 1097.142857 / 709; }
.d03-zoom .art { position: absolute; width: 140%; max-width: none; left: -20%; top: -24.8236953%; }
.reading { font-size: 20px; line-height: 1.75; word-break: keep-all; overflow-wrap: anywhere; }
.reading p { margin: 0; white-space: pre-line; }
.reading p + p { margin-top: 24px; }
a { color: #314f43; text-underline-offset: .2em; }
a:hover { color: #252a27; text-decoration-thickness: 2px; }
a:focus-visible { outline: 2px solid #314f43; outline-offset: 4px; }
::selection { background: #314f43; color: #fff; }
nav, .description, .message p, .empty, .archive-list, footer { font-family: system-ui, sans-serif; }
.description, .message p, .empty { font-size: 16px; line-height: 1.75; color: #526058; margin: 0; }
.archive-list { list-style: none; padding: 0; margin: 28px 0 0; }
.archive-list li { border-top: 1px solid #ced4ca; }
.archive-row { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 16px; padding: 20px 0; text-decoration: none; }
.archive-row img { width: 104px; height: auto; align-self: center; }
.archive-row time { display: block; font-size: 13px; line-height: 1.6; color: #526058; }
.archive-row strong { display: block; font-size: 17px; line-height: 1.6; font-weight: 400; margin-top: 6px; word-break: keep-all; overflow-wrap: anywhere; }
.empty { margin-top: 32px; }
.day-movement { display: flex; justify-content: space-between; gap: 24px; margin-top: 32px; padding-top: 20px; border-top: 1px solid #ced4ca; font-size: 14px; line-height: 1.6; }
.day-movement a { min-height: 44px; padding: 8px 0; }
.day-movement span { display: block; font-size: 12px; color: #526058; margin-top: 2px; }
footer { margin-top: 40px; padding-top: 20px; border-top: 1px solid #ced4ca; color: #526058; font-size: 13px; line-height: 1.7; }
footer nav { display: flex; flex-wrap: wrap; gap: 8px 28px; }
footer a { display: inline-block; min-height: 44px; padding: 10px 0; font-size: 15px; }
footer a[aria-current="page"] { color: #252a27; text-decoration-thickness: 2px; }
.brand { margin: 20px 0 0; font-size: 16px; }
.local-note { margin: 12px 0 0; }
.information { font: 400 18px/1.8 system-ui, sans-serif; }
.information h1 { font-family: "Harugalpi Local Reader", serif; }
.information p { margin: 0 0 20px; }
.return-reading { display: inline-block; min-height: 44px; padding: 8px 0; font-size: 16px; }

.private-sheet { overflow-wrap: anywhere; }
.private-sheet fieldset { min-inline-size: 0; }
.editor label,.editor a,.editor output{display:block;margin:.5rem 0}
.editor input:not([type=checkbox]),.editor textarea{width:100%;min-width:0;padding:.65rem;font:inherit;color:inherit;border:1px solid #737e72;border-radius:.25rem;background:#fffdf6}
.editor input:not([type=checkbox]), .editor textarea, .user-text, .user-label, #preview-name, #current-name, #claim-target, #thought-list > li > p:nth-child(2) { font-family: system-ui, sans-serif; }
.editor textarea{resize:vertical}
.editor button,.write-entry{font:inherit;padding:.5rem .8rem;min-height:44px}
.editor .primary,.write-entry{display:inline-block;background:#314f43;color:white;border:0;border-radius:.2rem;text-decoration:none}
.editor .user-text{white-space:pre-wrap;overflow-wrap:anywhere}
.guest-access #status, .guest-access noscript { font-family: system-ui, sans-serif; }
.guest-access button { font: inherit; min-height: 44px; }
.editor [hidden]{display:none!important}
.editor fieldset{margin:1rem 0}

#poem-preview { width: min(90vw, 26rem); max-height: 90vh; border: 1px solid #ced4ca; background: #f7f3e8; color: #252a27; }
#poem-preview img { display: block; width: 100%; height: min(48vh, 32rem); object-fit: contain; }
#poem-preview button { min-height: 44px; }
#poem-preview [role=status] { min-height: 1.75em; margin: .25em 0; }
