.road-photo-hero {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px;
  margin: 0 0 28px; padding: 28px clamp(22px, 4vw, 44px);
  color: #fff8e9; border: 1px solid rgba(255,255,255,.18); border-radius: 14px;
  background: linear-gradient(125deg, rgba(42,65,48,.96), rgba(62,47,35,.9));
  box-shadow: var(--shadow-lift); overflow: hidden; position: relative;
}
.road-photo-hero::after { content:""; position:absolute; inset:auto -55px -85px auto; width:230px; height:230px; border:28px solid rgba(217,164,65,.13); border-radius:50%; }
.road-photo-hero > * { position:relative; z-index:1; }
.road-photo-hero h1 { margin:2px 0 4px; color:#fff8e9; font-size:clamp(2rem,5vw,3.7rem); line-height:1; }
.road-photo-hero p { max-width:680px; color:#eee2cc; line-height:1.5; }
.road-photo-kicker { display:block; color:#efc568; font:700 1.15rem var(--font-hand); letter-spacing:.04em; }
.road-photo-share { white-space:nowrap; }

.road-photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:22px; width:100%; max-width:960px; margin:0 auto; }
.road-photo-card { display:block; min-width:0; width:100%; margin:0; overflow:hidden; background:var(--paper); border:1px solid rgba(107,79,58,.24); border-radius:10px; box-shadow:0 4px 14px rgba(44,33,26,.2); transition:transform .2s ease, box-shadow .2s ease; }
.road-photo-card:hover { transform:translateY(-3px); box-shadow:0 10px 24px rgba(44,33,26,.3); }
.road-photo-frame { position:relative; overflow:hidden; background:#2c211a; }
.road-photo-frame img { display:block; width:100%; height:auto; }
.road-photo-place-badge { position:absolute; left:10px; right:10px; bottom:10px; width:max-content; max-width:calc(100% - 20px); padding:7px 10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#fff9e9; background:rgba(35,30,24,.82); border:1px solid rgba(255,255,255,.25); border-radius:999px; box-shadow:0 2px 8px rgba(0,0,0,.3); font-size:.83rem; line-height:1.2; text-decoration:none; backdrop-filter:blur(5px); }
.road-photo-place-badge:hover { color:#fff; background:rgba(42,65,48,.94); }
.road-photo-meta { padding:12px 13px 11px; }
.road-photo-meta p { margin:0 0 8px; color:var(--ink); line-height:1.4; overflow-wrap:anywhere; }
.road-photo-byline { display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--ink-soft); font-size:.78rem; line-height:1.3; }
.road-photo-remove { padding:0; border:0; color:#9a442b; background:none; font:inherit; text-decoration:underline; cursor:pointer; }
.road-photo-comments { padding:10px 13px 13px; border-top:1px solid rgba(107,79,58,.16); background:rgba(248,242,229,.65); }
.road-photo-comments h2 { margin:0 0 8px; color:var(--ink-soft); font:700 .8rem var(--font-body); }
.road-photo-comment-list { display:grid; gap:8px; margin-bottom:10px; }
.road-photo-comment { display:flex; align-items:flex-start; justify-content:space-between; gap:7px; padding-bottom:7px; border-bottom:1px solid rgba(107,79,58,.12); }
.road-photo-comment:last-child { padding-bottom:0; border-bottom:0; }
.road-photo-comment strong { color:var(--forest-deep); font-size:.78rem; }
.road-photo-comment p { margin:1px 0 0; color:var(--ink); font-size:.84rem; line-height:1.35; overflow-wrap:anywhere; white-space:pre-wrap; }
.road-photo-comment form { flex:0 0 auto; }
.road-photo-comment-remove { padding:0 2px; border:0; color:#9a442b; background:none; font-size:1.15rem; line-height:1; cursor:pointer; }
.road-photo-comment-form { display:flex; align-items:flex-end; gap:7px; }
.road-photo-comment-form textarea { min-width:0; flex:1; resize:vertical; padding:7px 8px; color:var(--ink); border:1px solid var(--stitch); border-radius:6px; background:#fffdf7; font:inherit; font-size:.82rem; line-height:1.3; }
.road-photo-comment-form textarea:focus { outline:3px solid rgba(217,164,65,.25); border-color:var(--amber); }
.road-photo-comment-form .btn { flex:0 0 auto; padding:7px 9px; font-size:.78rem; }
.road-photo-comment-login { display:inline-block; font-size:.82rem; font-weight:700; }
.road-photo-card:target { outline:3px solid var(--amber); outline-offset:3px; }
.road-photo-pages { display:flex; justify-content:center; gap:12px; margin:28px 0 6px; }
.road-photo-empty { padding:64px 24px; text-align:center; background:rgba(253,249,239,.94); border:2px dashed var(--stitch); border-radius:12px; box-shadow:var(--shadow); }
.road-photo-empty > span { display:block; margin-bottom:12px; font-size:3.5rem; }
.road-photo-empty h2 { margin-bottom:8px; }
.road-photo-empty p { margin:0 auto 20px; max-width:580px; }

.road-photo-form-page { max-width:980px; margin:0 auto; }
.road-photo-form-head { margin-bottom:20px; }
.road-photo-form-head h1 { margin:2px 0; font-size:clamp(2rem,5vw,3rem); }
.road-photo-back { display:inline-block; margin-bottom:18px; font-weight:700; text-decoration:none; }
.road-photo-form { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr); overflow:hidden; border:1px solid rgba(107,79,58,.28); border-radius:14px; background:rgba(253,249,239,.97); box-shadow:var(--shadow-lift); }
.road-photo-upload-panel { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:560px; padding:22px; background:linear-gradient(145deg,#30271f,#5b4636); }
.road-photo-drop { display:flex; align-items:center; justify-content:center; width:100%; min-height:450px; overflow:hidden; color:#f6f0e3; border:2px dashed rgba(239,197,104,.7); border-radius:10px; background:rgba(0,0,0,.14); cursor:pointer; }
.road-photo-drop:focus-within,.road-photo-drop:hover { border-color:#f4cf7e; background:rgba(0,0,0,.22); }
.road-photo-drop img { display:block; width:100%; max-height:610px; object-fit:contain; }
.road-photo-drop img[hidden] { display:none; }
.road-photo-drop span { padding:30px; text-align:center; }
.road-photo-drop strong,.road-photo-drop small,.road-photo-drop em { display:block; }
.road-photo-drop strong { font:700 1.55rem var(--font-head); }
.road-photo-drop small { margin-top:9px; color:#e9dbc0; }
.road-photo-drop em { margin-top:14px; color:#efc568; font-family:var(--font-hand); font-size:1.08rem; }
.road-photo-change { margin-top:14px; }
.road-photo-fields { display:flex; flex-direction:column; gap:20px; padding:clamp(24px,4vw,38px); }
.road-photo-field > label,.road-photo-field legend { display:block; margin-bottom:7px; color:var(--bark); font:700 1rem var(--font-head); }
.road-photo-field > label span { color:var(--ink-soft); font:400 .8rem var(--font-body); }
.road-photo-field textarea,.road-photo-field select { width:100%; padding:11px 12px; color:var(--ink); border:1px solid var(--stitch); border-radius:6px; background:#fffdf7; font:inherit; }
.road-photo-field textarea:focus,.road-photo-field select:focus { outline:3px solid rgba(217,164,65,.25); border-color:var(--amber); }
.road-photo-field > small { display:block; margin-top:5px; color:var(--ink-soft); font-size:.8rem; line-height:1.35; }
.road-photo-location { position:relative; }
.road-photo-location-input { display:flex; align-items:center; gap:7px; padding:0 9px; border:1px solid var(--stitch); border-radius:6px; background:#fffdf7; }
.road-photo-location-input:focus-within { outline:3px solid rgba(217,164,65,.25); border-color:var(--amber); }
.road-photo-location-input input { min-width:0; flex:1; padding:11px 0; border:0; outline:0; color:var(--ink); background:transparent; font:inherit; }
.road-photo-location-input button { border:0; padding:2px 5px; color:var(--ink-soft); background:transparent; font-size:1.4rem; cursor:pointer; }
.road-photo-use-location { display:flex; align-items:center; justify-content:center; gap:6px; width:100%; margin-top:8px; }
.road-photo-use-location:disabled { cursor:wait; opacity:.7; }
.road-photo-location-results { position:absolute; z-index:1200; top:158px; left:0; right:0; max-height:340px; overflow:auto; border:1px solid #d6cbb8; border-radius:8px; background:#fffdf8; box-shadow:0 10px 28px rgba(62,47,35,.28); }
.road-photo-location-result { display:grid; width:100%; padding:10px 12px; border:0; border-bottom:1px solid #eee5d6; color:var(--ink); background:transparent; text-align:left; cursor:pointer; }
.road-photo-location-result:hover,.road-photo-location-result:focus { outline:0; background:#f5ead8; }
.road-photo-location-result strong { font-family:var(--font-head); }
.road-photo-location-result small { margin-top:2px; color:var(--ink-soft); line-height:1.25; }
.road-photo-location-source { width:max-content; margin-bottom:3px; padding:2px 6px; border-radius:999px; color:var(--forest-deep); background:#e7eddf; font-size:.7rem; font-weight:700; }
.road-photo-location-empty { padding:15px; color:var(--ink-soft); text-align:center; }
.road-photo-location-status { min-height:21px; margin-top:5px; color:var(--ink-soft); font-size:.8rem; line-height:1.35; }
.road-photo-location-map { display:none; height:190px; margin-top:9px; overflow:hidden; border:1px solid var(--stitch); border-radius:7px; }
.road-photo-location-map.is-visible { display:block; }
.road-photo-attribution { padding:0; border:0; }
.road-photo-attribution label { display:flex; gap:10px; margin:0 0 9px; padding:11px; border:1px solid var(--paper-dark); border-radius:7px; background:#fffdf7; cursor:pointer; }
.road-photo-attribution input { margin-top:5px; accent-color:var(--forest); }
.road-photo-attribution strong,.road-photo-attribution small { display:block; }
.road-photo-attribution small { margin-top:2px; color:var(--ink-soft); line-height:1.3; }
.road-photo-privacy { padding:13px 14px; border-left:4px solid var(--forest); background:#e9efe4; border-radius:5px; }
.road-photo-privacy p { margin:3px 0 0; color:#42503c; font-size:.88rem; line-height:1.45; }
.road-photo-submit { width:100%; padding:13px 18px; }

/* The site rail is fixed rather than part of normal layout. Keep this feature's
   wide visual wall beside it on desktop so headings and tiles are never hidden. */
@media (min-width:961px) {
  body:not(.sidebar-collapsed) main:has(.road-photo-hero),
  body:not(.sidebar-collapsed) main:has(.road-photo-form-page) {
    width:calc(100% - 248px); max-width:none; margin-left:248px; margin-right:0;
  }
  body.sidebar-collapsed main:has(.road-photo-hero),
  body.sidebar-collapsed main:has(.road-photo-form-page) {
    width:calc(100% - 72px); max-width:none; margin-left:72px; margin-right:0;
  }
}

@media (max-width:760px) {
  .road-photo-hero { align-items:flex-start; flex-direction:column; }
  .road-photo-form { grid-template-columns:1fr; }
  .road-photo-upload-panel { min-height:390px; }
  .road-photo-drop { min-height:310px; }
  .road-photo-grid { grid-template-columns:1fr; gap:16px; max-width:560px; }
}
@media (max-width:420px) { .road-photo-grid { gap:12px; } }
@media (prefers-reduced-motion:reduce) { .road-photo-card { transition:none; } }

/* Modern social feed — scoped to the Road Shots gallery. */
.road-photo-page { max-width:760px; margin:0 auto; }
.road-photo-page .road-photo-hero { align-items:center; margin-bottom:22px; padding:26px 30px; border:0; border-radius:20px; background:linear-gradient(135deg,#183c31 0%,#2f624e 58%,#9b6a35 140%); box-shadow:0 18px 45px rgba(30,48,39,.22); }
.road-photo-page .road-photo-hero h1 { margin:4px 0 7px; font-size:clamp(2.1rem,6vw,3.35rem); letter-spacing:-.035em; }
.road-photo-page .road-photo-hero p { margin:0; max-width:470px; color:rgba(255,255,255,.82); }
.road-photo-hero-actions { display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
.road-photo-community-count { color:rgba(255,255,255,.76); font-size:.78rem; }
.road-photo-community-count strong { color:#fff; }
.road-photo-page .road-photo-share { border-radius:10px; box-shadow:none; }
.road-photo-feed { display:grid; grid-template-columns:1fr; gap:22px; }
.road-photo-page .road-photo-card { overflow:hidden; border:1px solid rgba(45,54,48,.12); border-radius:16px; background:#fff; box-shadow:0 8px 30px rgba(30,38,32,.11); transition:box-shadow .2s ease, transform .2s ease; }
.road-photo-page .road-photo-card:hover { transform:none; box-shadow:0 12px 36px rgba(30,38,32,.16); }
.road-photo-card-head { display:flex; align-items:center; min-height:68px; padding:12px 16px; gap:11px; }
.road-photo-avatar { display:grid; flex:0 0 42px; width:42px; height:42px; place-items:center; color:#fff; border:2px solid #fff; border-radius:50%; background:linear-gradient(145deg,#d59a4a,#315f4a); box-shadow:0 0 0 2px #d8a652; font:700 1rem var(--font-head); }
img.road-photo-avatar { object-fit:cover; padding:0; }
.road-photo-author { display:flex; flex:1; min-width:0; flex-direction:column; line-height:1.25; }
.road-photo-author strong { color:#202820; font-size:.94rem; }
.road-photo-author a,.road-photo-author span { margin-top:3px; overflow:hidden; color:#748078; font-size:.76rem; text-decoration:none; text-overflow:ellipsis; white-space:nowrap; }
.road-photo-meta-row { display:flex; align-items:baseline; min-width:0; margin-top:3px; gap:12px; color:#748078; font-size:.76rem; }
.road-photo-author .road-photo-meta-row > a,.road-photo-author .road-photo-meta-row > span { flex:1; min-width:0; margin-top:0; }
.road-photo-meta-row time { flex:0 0 auto; margin-left:auto; white-space:nowrap; }
.road-photo-author a:hover { color:var(--forest); text-decoration:underline; }
.road-photo-owner-menu button { padding:8px; border:0; color:#7b837d; background:transparent; font-weight:800; letter-spacing:1px; cursor:pointer; }
.road-photo-page .road-photo-frame { display:flex; align-items:center; justify-content:center; max-height:78vh; background:#101511; }
.road-photo-page .road-photo-frame img { width:100%; max-height:78vh; object-fit:contain; }
.road-photo-social { padding:10px 16px 15px; }
.road-photo-actions { display:flex; align-items:center; min-height:42px; gap:5px; border-bottom:1px solid #edf0ed; }
.road-photo-reaction,.road-photo-comment-jump { display:inline-flex; align-items:center; justify-content:center; min-height:36px; padding:7px 10px; gap:6px; border:0; border-radius:9px; color:#59635c; background:transparent; font:700 .82rem var(--font-body); text-decoration:none; cursor:pointer; transition:background .15s ease,color .15s ease,transform .15s ease; }
.road-photo-reaction:hover,.road-photo-comment-jump:hover { color:#254f3e; background:#f2f6f3; }
.road-photo-reaction:active { transform:scale(.95); }
.road-photo-reaction strong { min-width:1ch; color:inherit; font-size:.78rem; }
.road-photo-action-icon { font-size:1.05rem; filter:grayscale(1); }
.road-photo-reaction.is-active { color:#2463b6; background:#eef5ff; }
.road-photo-reaction.is-active .road-photo-action-icon { filter:none; }
.road-photo-reaction-heart .road-photo-action-icon,.road-photo-reaction-heart > span:first-child { color:#bf3850; font-size:1.2rem; }
.road-photo-reaction-heart.is-active { color:#b52e48; background:#fff0f3; }
.road-photo-comment-jump { margin-left:auto; }
.road-photo-appreciation { margin:10px 0 0; color:#515b53; font-size:.79rem; }
.road-photo-caption { margin:8px 0 0; color:#303731; font-size:.9rem; line-height:1.45; overflow-wrap:anywhere; }
.road-photo-caption strong { margin-right:4px; color:#1f2821; }
.road-photo-page .road-photo-comments { padding:0; border:0; background:transparent; }
.road-photo-page .road-photo-comment-list { margin:10px 0 2px; gap:7px; }
.road-photo-page .road-photo-comment { padding:0; border:0; font-size:.86rem; }
.road-photo-page .road-photo-comment strong { color:#273128; font-size:.84rem; }
.road-photo-page .road-photo-comment p { display:inline; margin-left:4px; color:#454e47; font-size:.85rem; white-space:pre-wrap; }
.road-photo-page .road-photo-comment-form { align-items:center; margin-top:12px; padding-top:10px; border-top:1px solid #edf0ed; }
.road-photo-page .road-photo-comment-form textarea { min-height:38px; max-height:110px; padding:9px 0; border:0; border-radius:0; background:transparent; resize:none; font-size:.87rem; }
.road-photo-page .road-photo-comment-form textarea:focus { outline:0; }
.road-photo-page .road-photo-comment-form button { padding:8px 4px 8px 10px; border:0; color:#2b6b50; background:transparent; font-weight:800; cursor:pointer; }
.road-photo-page .road-photo-comment-login { display:block; margin-top:10px; color:#47705d; font-size:.82rem; }
.road-photo-reaction.is-pending { opacity:.55; pointer-events:none; }
.road-photo-page .road-photo-pages { margin-top:26px; }
@media (min-width:961px) {
  body:not(.sidebar-collapsed) main:has(.road-photo-page) { width:calc(100% - 248px); max-width:none; margin-left:248px; margin-right:0; }
  body.sidebar-collapsed main:has(.road-photo-page) { width:calc(100% - 72px); max-width:none; margin-left:72px; margin-right:0; }
}
@media (max-width:640px) {
  .road-photo-page .road-photo-hero { align-items:flex-start; padding:23px 20px; border-radius:14px; }
  .road-photo-hero-actions { width:100%; align-items:flex-start; }
  .road-photo-page .road-photo-share { width:100%; text-align:center; }
  .road-photo-feed { gap:14px; }
  .road-photo-page .road-photo-card { border-radius:12px; }
  .road-photo-social { padding-inline:12px; }
  .road-photo-reaction { padding-inline:7px; }
}

/* ---- Home page Road Shots strip ---- */
.road-shots-home .section-header { align-items:flex-end; flex-wrap:wrap; gap:10px; }
.road-shots-home-actions { display:flex; gap:8px; flex-wrap:wrap; }
.road-shots-home-strip { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(240px,300px); gap:16px; overflow-x:auto; padding:6px 4px 14px; scroll-snap-type:x proximity; scrollbar-width:thin; }
.road-shots-home-card { display:flex; flex-direction:column; overflow:hidden; background:var(--paper); border:1px solid rgba(107,79,58,.24); border-radius:10px; box-shadow:0 4px 14px rgba(44,33,26,.18); scroll-snap-align:start; transition:transform .2s ease, box-shadow .2s ease; }
.road-shots-home-card:hover { transform:translateY(-3px); box-shadow:0 10px 24px rgba(44,33,26,.3); }
.road-shots-home-link { display:block; text-decoration:none; }
.road-shots-home-link img { display:block; width:100%; height:180px; object-fit:cover; background:#2c211a; }
.road-shots-home-caption { margin:0; padding:9px 12px 0; color:var(--ink); font-size:.86rem; line-height:1.4; overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.road-shots-home-meta { margin-top:auto; padding:8px 12px 11px; display:grid; gap:2px; }
.road-shots-home-place { color:var(--forest-deep); font-size:.8rem; font-weight:700; text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
a.road-shots-home-place:hover { text-decoration:underline; }
.road-shots-home-byline { color:var(--ink-soft); font-size:.75rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width:640px) {
  .road-shots-home-strip { grid-auto-columns:minmax(210px,72vw); gap:12px; }
}