.journal-open { overflow:hidden; }
.journal-dialog { border:1px solid #d7ccb6; border-radius:12px; padding:0; width:min(1040px,calc(100% - 56px)); max-width:none; max-height:calc(100dvh - 56px); color:var(--ink); background:var(--paper); box-shadow:0 30px 100px #23291955; overscroll-behavior:contain; }
.journal-dialog::backdrop { background:#28342980; backdrop-filter:blur(5px); }
.journal-sheet { position:relative; }
.journal-header { display:flex; align-items:center; justify-content:space-between; padding:19px 34px; border-bottom:1px solid var(--line); gap:15px; }
.journal-back { font-size:11px; text-decoration:none; color:var(--ink); display:flex; align-items:center; gap:12px; }
.journal-back>span { font-size:21px; }
.journal-edition { font-size:8px; letter-spacing:2px; color:#838472; }
.journal-edition>span { padding:0 8px; opacity:.6; }
.journal-close { font-size:26px; width:36px; height:36px; border-radius:50%; color:#797d67; }
.journal-close:hover { background:#e9e5d7; }
.journal-location { padding:28px 40px 24px; background:radial-gradient(ellipse at 80% 25%,#e8e1ca66,transparent 65%); border-bottom:1px solid var(--line); }
.journal-location .eyebrow { font-size:8px; color:#8b866d; letter-spacing:1.8px; }
.journal-location h2 { font:50px/1.1 var(--serif); letter-spacing:-1px; margin:10px 0; overflow-wrap:anywhere; }
.journal-location h2>span { color:var(--rust); }
.journal-location p { display:flex; gap:9px; align-items:center; font-size:10px; color:#8a8977; margin:12px 0 0; }
.journal-location .icon { width:13px; height:13px; color:var(--rust); }
.journal-loading,.journal-load-error { padding:55px 40px; font-size:13px; line-height:1.8; }
.journal-loading { display:flex; gap:15px; align-items:center; }
.journal-load-error h3 { font:32px var(--serif); }
.journal-form fieldset { margin:0; border:0; padding:0; min-width:0; }
.journal-edit-grid { display:grid; grid-template-columns:minmax(0,1fr) 350px; }
.journal-writing { padding:30px 38px; min-width:0; }
.journal-field-label { display:block; font-size:8px; font-weight:600; letter-spacing:1.4px; color:#8c886e; margin:0 0 12px; }
.journal-dialog input,.journal-dialog textarea { color:var(--ink); font-family:var(--sans); }
.journal-date { display:block; background:#ece8dc; border:1px solid #dcd7c8; border-radius:5px; padding:10px 12px; font-size:12px; margin-bottom:30px; min-height:42px; }
.journal-title-input { display:block; width:100%; border:0; border-bottom:1px solid #d5cbb7; background:transparent; padding:0 0 17px; font:32px var(--serif)!important; border-radius:0; margin:0 0 28px; }
.journal-title-input::placeholder { color:#a7a28f; }
.journal-body-input { display:block; resize:vertical; width:100%; min-height:245px; border:0; padding:0; border-radius:0; background:transparent; font-size:14px; line-height:1.95; }
.journal-body-input::placeholder { color:#aaa58e; font-style:italic; }
.journal-title-input:focus,.journal-body-input:focus { outline:1px solid #8a927866; outline-offset:6px; }
.journal-word-note { display:flex; align-items:center; justify-content:space-between; gap:15px; color:#9b9580; font-size:9px; border-top:1px solid var(--line); padding-top:15px; margin-top:20px; }
.journal-word-note>span { font:italic 12px Georgia,serif; text-align:right; }
.journal-photos { background:#eeebdf; border-left:1px solid var(--line); padding:30px 24px; }
.journal-photo-heading { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:22px; }
.journal-photo-heading .eyebrow { font-size:6px; letter-spacing:1.3px; color:#958d73; }
.journal-photo-heading h3 { font:25px/1.2 var(--serif); margin:7px 0 0; }
.journal-photo-heading>span { font-size:9px; color:#96947f; white-space:nowrap; }
.journal-upload { position:relative; display:flex; flex-direction:column; gap:8px; align-items:center; text-align:center; padding:20px 10px; border:1px dashed #b5b899; border-radius:7px; background:#f7f5ec88; cursor:pointer; }
.journal-upload:hover,.journal-upload:focus-within { background:#f9f7ee; border-color:#6e7b57; }
.journal-upload input { position:absolute; inset:0; opacity:0; width:100%; height:100%; cursor:pointer; }
.journal-upload:has(input:disabled) { opacity:.5; }
.journal-upload strong { font-size:12px; font-weight:500; }
.journal-upload>span:last-of-type { font-size:8px; color:#93937c; }
.upload-symbol { font-size:24px; color:#8c9879; }
.journal-photo-empty { text-align:center; padding:30px 5px 0; color:#a5a087; }
.journal-photo-empty>span { font:36px var(--serif); }
.journal-photo-empty p { font:italic 14px/1.8 Georgia,serif; }
.journal-photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px 12px; margin-top:22px; }
.journal-photo-card { padding:7px; background:#fcfaf4; border:1px solid #e2ddce; box-shadow:0 2px 5px #6d624515; min-width:0; }
.journal-photo-image { position:relative; }
.journal-photo-image img { display:block; width:100%; aspect-ratio:1; object-fit:cover; }
.photo-index { position:absolute; left:5px; bottom:5px; color:#fffdf5; text-shadow:0 1px 5px #000; font-size:7px; letter-spacing:1px; }
.photo-remove { position:absolute; right:4px; top:4px; display:grid; place-items:center; width:27px; height:27px; border-radius:50%; background:#f9f6eced; color:#5e614f; font-size:20px; }
.journal-photo-card input { min-width:0; width:100%; font-size:10px; padding:12px 2px 5px; background:transparent; border:0; border-bottom:1px solid #eeeadf; }
.photo-cover { font-size:8px; color:#a57d56; text-align:left; padding:9px 2px 2px; }
.journal-upload-status { font-size:11px; line-height:1.6; color:#7d8866; }
.journal-actions { display:flex; justify-content:space-between; align-items:center; gap:15px; border-top:1px solid var(--line); padding:21px 34px; }
.journal-actions>span { font-size:10px; color:#93907b; }
.journal-actions>div { display:flex; gap:12px; align-items:center; }
.journal-primary { display:inline-flex; align-items:center; justify-content:center; gap:14px; padding:13px 21px; border-radius:5px; background:#354934; color:#fbf8ec; font-size:11px; min-height:44px; }
.journal-primary:hover { background:#466143; }
.journal-primary>span:last-child:not(.spinner) { font-size:17px; }
.journal-secondary { color:#8a816b; font-size:11px; padding:13px 15px; min-height:44px; }
.journal-feedback { margin:0; padding:15px 38px; line-height:1.7; font-size:12px; }
.journal-error { color:#9b4f37; background:#f0e1d655; }
.journal-saved { padding:13px 40px; font-size:11px; color:#64784e; background:#e8eedd; }
.journal-cover { display:block; width:100%; position:relative; padding:0; text-align:left; }
.journal-cover img { display:block; width:100%; max-height:360px; aspect-ratio:2.3; object-fit:cover; }
.journal-cover>span { display:flex; align-items:center; gap:7px; position:absolute; bottom:0; left:0; right:0; padding:35px 35px 20px; background:linear-gradient(transparent,#18221b99); color:#fff8e7; font-size:12px; }
.journal-cover i { font-size:9px; opacity:.7; font-style:normal; }
.journal-cover>span>span { margin-left:auto; font-size:10px; }
.journal-story-heading { text-align:center; padding:38px 38px 18px; }
.journal-story-heading .eyebrow { font-size:8px; color:#959078; }
.journal-story-heading h3 { font:46px/1.12 var(--serif); letter-spacing:-.5px; margin:18px auto; max-width:740px; overflow-wrap:anywhere; }
.journal-story-rule { display:flex; align-items:center; justify-content:center; gap:15px; color:#b5a17b; font-size:20px; }
.journal-story-rule:before,.journal-story-rule:after { content:""; width:55px; height:1px; background:#dacfba; }
.journal-prose { white-space:pre-wrap; overflow-wrap:anywhere; max-width:690px; margin:10px auto 38px; padding:0 35px; font:15px/2 var(--sans); color:#62684f; }
.journal-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; padding:0 40px 38px; }
.journal-gallery figure { margin:0; background:#fdfbf5; padding:9px 9px 12px; box-shadow:0 4px 14px #3d382214; border:1px solid #e7dfcd; }
.journal-gallery figure:nth-child(3n+1) { transform:rotate(-1deg); }
.journal-gallery figure:nth-child(3n+3) { transform:rotate(1deg); }
.journal-gallery button { display:block; width:100%; padding:0; }
.journal-gallery img { width:100%; aspect-ratio:1.2; object-fit:cover; display:block; }
.journal-gallery figcaption { font:italic 12px/1.6 Georgia,serif; color:#8b8169; padding:10px 3px 0; overflow-wrap:anywhere; }
.journal-gallery figcaption>span { font:8px var(--sans); color:#aaa18b; margin-right:7px; }
.journal-confirm,.journal-lightbox { position:fixed; inset:0; z-index:5; display:grid; place-content:center; background:#f5f1e6f5; border-radius:12px; padding:30px; }
.journal-confirm>div { max-width:370px; text-align:center; }
.journal-confirm h3 { font:40px var(--serif); margin:20px 0; }
.journal-confirm p { font-size:13px; line-height:1.9; color:#868570; }
.journal-confirm .journal-primary { display:flex; margin:24px auto 0; }
.journal-lightbox { background:#252d24f7; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; }
.journal-lightbox>img { object-fit:contain; min-height:0; max-width:100%; max-height:calc(100dvh - 200px); }
.lightbox-close { position:absolute; right:20px; top:14px; color:#f5f1e6; width:40px; height:40px; font-size:30px; }
.journal-lightbox>div { width:100%; max-width:650px; display:flex; align-items:center; justify-content:space-between; gap:20px; color:#e9e2cd; }
.journal-lightbox p { margin:0; text-align:center; font:italic 15px/1.7 Georgia,serif; }
.journal-lightbox p>span { display:block; font:9px var(--sans); margin-bottom:8px; color:#afb79e; }
.journal-lightbox>div>button { width:44px; height:44px; flex-shrink:0; border:1px solid #596450; border-radius:50%; color:#eee8d7; }
.story-button { display:flex; align-items:center; justify-content:space-between; gap:20px; background:#344834; color:#f9f5e9; font-size:11px; border-radius:4px; padding:12px 15px; margin-top:15px; min-height:42px; width:100%; }
.story-button>span { font-size:17px; }
.detail-content .save-button { background:transparent; color:#8e8b72; border:0; padding:8px 0; margin-top:5px; min-height:30px; font-size:10px; }
.detail-story-title { margin-top:12px; color:#8a795f; font:italic 15px/1.5 Georgia,serif; }
.detail-story-title>span { display:block; font:9px var(--sans); margin-top:5px; color:#96917c; }
.row-journal { width:36px; height:36px; color:#a9764d; font-size:20px; flex-shrink:0; }
.saved-story-label { color:#97845f!important; }
.number-pin.has-story { background:#e0e6d5; border-color:#bac6a9; color:#5c714b; }
.marker-has-story .pin-head:after { content:""; position:absolute; right:-3px; top:-3px; width:9px; height:9px; background:#c5aa73; border:2px solid #faf5e5; border-radius:50%; }
@media(max-width:850px) { .journal-edit-grid { grid-template-columns:minmax(0,1fr) 290px; } .journal-writing { padding:27px; } .journal-photos { padding:27px 18px; } .journal-word-note>span { display:none; } .journal-actions { padding:20px 25px; } .journal-actions>span { max-width:160px; line-height:1.6; } }
@media(max-width:700px) {
    .journal-dialog { width:100%; height:100dvh; max-height:100dvh; margin:0; border:0; border-radius:0; }
    .journal-header { padding:12px 20px; } .journal-edition { font-size:6px; letter-spacing:1px; } .journal-location { padding:25px; } .journal-location h2 { font-size:43px; }
    .journal-edit-grid { display:flex; flex-direction:column; } .journal-writing { padding:27px 25px; } .journal-photos { border-left:0; border-top:1px solid var(--line); padding:25px; }
    .journal-title-input { font-size:30px!important; } .journal-body-input { font-size:16px; min-height:220px; } .journal-date { font-size:16px; } .journal-photo-card input { font-size:16px; }
    .journal-photo-card { padding:9px; } .photo-remove { width:32px; height:32px; } .photo-cover { min-height:35px; font-size:10px; }
    .journal-actions { padding:20px 23px max(20px,env(safe-area-inset-bottom)); flex-wrap:wrap; } .journal-actions>span { max-width:none; width:100%; font-size:9px; } .journal-actions>div { width:100%; justify-content:space-between; } .journal-primary { min-height:46px; }
    .journal-cover img { aspect-ratio:1.5; } .journal-cover>span { padding:30px 22px 18px; } .journal-saved { padding:14px 25px; }
    .journal-story-heading { padding:30px 25px 10px; } .journal-story-heading h3 { font-size:37px; } .journal-prose { padding:0 27px; font-size:14px; }
    .journal-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); padding:0 23px 30px; gap:15px; } .journal-gallery figcaption { font-size:11px; }
    .journal-confirm,.journal-lightbox { border-radius:0; padding:25px; } .journal-lightbox>img { max-height:calc(100dvh - 170px); }
}