/* 既存の紙と付箋の色・手書きフォントを継承する写真帳。 */
.folio-reference {--album-paper:#fff8ec;--album-ink:#514b3c;--album-rule:#b5a38188;--album-sage:#d8dcb9;--album-sky:#b9d7df}
.folio-reference #weatherTime {display:block;margin-top:2px;color:inherit;font:500 clamp(18px,2.8vw,30px)/1.25 var(--body);font-variant-numeric:tabular-nums;letter-spacing:.05em}
.folio-reference .ref-cover-shortcuts {display:grid;grid-row:5;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,.7fr) minmax(0,.7fr);gap:4px;min-height:44px;padding:0}
.folio-reference .ref-cover-shortcuts button {position:static;display:flex;align-items:center;justify-content:center;gap:3px;min-width:0;width:auto;height:auto;min-height:44px;margin:0;padding:4px 2px;border:1px solid var(--album-rule);border-radius:5px;background:linear-gradient(#f2c8b9aa,#f2c8b9aa),var(--ref-texture);color:var(--album-ink);font:clamp(11px,1.3vw,14px)/1.3 var(--body);white-space:nowrap;box-shadow:0 2px 3px #936e3e26}
.folio-reference .ref-cover-shortcuts button:nth-child(2) {background:linear-gradient(#dcdbb2aa,#dcdbb2aa),var(--ref-texture)}
.folio-reference .ref-cover-shortcuts button:nth-child(3) {background:linear-gradient(#b9d7dfaa,#b9d7dfaa),var(--ref-texture)}
.folio-reference .ref-cover-shortcuts button:nth-child(4) {background:var(--album-paper)}
.folio-reference .ref-cover-shortcuts button::after {display:none}
.folio-reference .ref-cover-shortcuts svg {width:17px!important;height:17px!important;flex-shrink:0}
.folio-reference .ref-left {padding-bottom:4px;grid-template-rows:minmax(120px,26%) minmax(150px,28%) minmax(80px,16%) minmax(100px,1fr) 44px;gap:1%}
.folio-reference .ref-right {padding-bottom:8px}
.folio-reference .detail-view>.detail-paper,.folio-reference .ref-book-view>.ref-spread-paper {padding-bottom:72px!important}
.folio-reference .folio-edge-tabs button {height:clamp(58px,11dvh,100px)!important}
.folio-reference .folio-edge-tabs [data-edge-target="photos"] {background-color:var(--album-sky)!important}
.folio-reference [data-view="photos"]>.detail-paper {height:calc(100dvh - 12px);min-height:0;overflow:auto;box-sizing:border-box}
.folio-reference .photo-page-guide {font:13px/1.7 var(--body);margin:0 0 14px;color:var(--album-ink)}
.photo-slot-previews {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:650px;margin:0 0 18px}
.photo-slot-previews button {display:grid;min-width:0;border:1px solid var(--album-rule);background:var(--album-paper);padding:5px;color:var(--album-ink);font:12px/1.6 var(--body);overflow:hidden}
.photo-slot-previews img {display:block;width:100%;height:85px;object-fit:contain;transform:translate(var(--photo-x,0),var(--photo-y,0)) rotate(var(--photo-rotation,0deg)) scale(var(--photo-scale,1))}
.photo-slot-previews span {position:relative;background:var(--album-paper)}
.photo-library-toolbar {display:flex;align-items:end;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 0;border-top:1px solid var(--album-rule)}
.photo-library-toolbar label {display:grid;gap:4px;font:12px/1.5 var(--body)}
.photo-library-toolbar select,.photo-library-toolbar button,.photo-library-pager button {min-height:44px;border:1px solid var(--album-rule);background:var(--album-paper);color:var(--album-ink);padding:7px 12px;font:13px/1.4 var(--body);border-radius:5px}
.photo-library-toolbar button {background:var(--album-sage)}
#photoLibraryStatus {font:13px/1.6 var(--body);color:var(--album-ink);min-height:1.6em;overflow-wrap:anywhere}
.photo-library-grid {display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:14px;padding:6px 2px 18px}
.photo-library-grid>button {display:block;min-width:0;aspect-ratio:1;padding:6px 6px 16px;border:1px solid var(--album-rule);background:var(--album-paper);box-shadow:0 3px 5px #806b4926;transition:transform .15s}
.photo-library-grid>button:hover {transform:translateY(-2px)}
.photo-library-grid img {display:block;width:100%;height:100%;object-fit:contain}
.photo-library-grid>p {grid-column:1/-1;font:14px/1.8 var(--body)}
.photo-library-pager {display:flex;align-items:center;justify-content:center;gap:16px;padding:8px 0;font:13px/1.5 var(--body)}
.photo-library-pager button:disabled {opacity:.4}
.photo-library-grid button:focus-visible,.photo-library-toolbar :focus-visible {outline:3px solid #46718b;outline-offset:3px}
.folio-reference.dark {--album-paper:#414638;--album-ink:#f3e6cd;--album-rule:#a99c7888;--album-sage:#515d42}
@media(width < 700px), (aspect-ratio < 4/5) {
 .folio-reference .ref-cover-shortcuts svg {width:15px!important;height:15px!important}
 .folio-reference .ref-cover-shortcuts button {font-size:10px}
 .photo-slot-previews {gap:6px}
 .photo-slot-previews span {font-size:10px}
 .photo-library-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .photo-library-toolbar {gap:8px}
 .photo-library-toolbar select,.photo-library-toolbar button {font-size:12px;padding:7px}
}
@media(prefers-reduced-motion:reduce) {.photo-library-grid>button {transition:none}}

/* 詳細ページでも同じ4操作を下部にまとめ、撮影を単独配置しない。 */
.folio-reference .app-shell>.ref-cover-shortcuts {position:fixed;bottom:max(8px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(520px,calc(100% - 64px));z-index:60;background:var(--album-paper);padding:4px;border-radius:7px;box-shadow:0 2px 8px #806b4944}
.folio-reference.contents-open .app-shell>.ref-cover-shortcuts {visibility:hidden}