/* Loaded only on blog 4 / page 188. No theme/other-page overrides. */
body.ssh-app-page { margin:0; padding:0; background:#f2f5f1; color:#203c32; font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.ssh-app-shell, .ssh-app-shell * { box-sizing:border-box; }
.ssh-app-shell { width:100%; min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; overflow-wrap:anywhere; }
.admin-bar .ssh-app-shell { min-height:calc(100dvh - 32px); }
.ssh-app-header { display:flex; align-items:center; gap:24px; flex-wrap:wrap; padding:12px max(24px,env(safe-area-inset-right)) 12px max(24px,env(safe-area-inset-left)); background:#17392e; color:#fff; }
.ssh-app-header a { color:#fff; text-decoration:none; display:inline-flex; align-items:center; min-height:44px; }
.ssh-app-back { font-weight:700; }
.ssh-app-brand { border-left:1px solid #709385; padding-left:24px; font-weight:750; }
.ssh-app-brand span { font-size:.8rem; color:#d1e4d9; margin-left:8px; font-weight:400; }
.ssh-app-nav { margin-left:auto; display:flex; flex-wrap:wrap; gap:8px; }
.ssh-app-nav a { padding:8px 12px; border-radius:6px; }
.ssh-app-nav a:hover { background:#2b5142; }
.ssh-app-main { width:100%; flex:1; padding:28px clamp(16px,3.4vw,64px) 40px; }
.ssh-app-main .ssh-gongse { width:100%; max-width:none; }
.ssh-app-main .ssh-eyebrow { margin:0 0 8px; }
.ssh-app-main h1 { margin:0 0 8px; font-size:clamp(2rem,3.2vw,3.2rem); letter-spacing:-.045em; font-weight:780; line-height:1.2; color:#17392e; }
.ssh-app-main .ssh-tagline { font-size:1.08rem; margin-bottom:6px; }
.ssh-app-main .ssh-intro { font-size:.85rem; color:#4d6156; }
.ssh-app-main .ssh-notice { margin:18px 0; padding:14px 18px; font-size:.85rem; }
.ssh-app-main .ssh-notice p { margin-top:5px; }
.ssh-app-main .ssh-counts { margin-bottom:12px; }
.ssh-app-main .ssh-filters { grid-template-columns:minmax(220px,2fr) repeat(3,minmax(140px,1fr)) auto auto; gap:12px; padding:18px; background:#fff; margin:16px 0; box-shadow:0 4px 16px #17392e08; }
.ssh-app-main .ssh-filters label:first-child { grid-column:auto; }
.ssh-app-main .ssh-items { grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; align-items:stretch; }
.ssh-app-main .ssh-item { display:flex; flex-direction:column; border-radius:14px; box-shadow:0 3px 12px #17392e05; }
.ssh-app-main .ssh-item h3 { min-height:4.05em; }
.ssh-app-main .ssh-variant { min-height:4.95em; }
.ssh-app-main .ssh-price { min-height:3.3em; }
.ssh-app-main .ssh-discount { min-height:1.65em; }
.ssh-app-main .ssh-dates { min-height:3.3em; }
.ssh-app-main .ssh-dates span { display:inline-block; max-width:100%; }
.ssh-app-main .ssh-evidence { margin-top:auto; }
.ssh-app-main .ssh-thumbnail { position:relative; width:100%; min-height:36px; flex:none; background:#f5f7f4; border:1px solid #e0e8df; border-radius:8px; display:grid; place-items:center; overflow:hidden; color:#536658; font-size:.8rem; }
.ssh-app-main .ssh-thumbnail.has-photo { aspect-ratio:4/3; }
.ssh-app-main .ssh-thumbnail img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; background:#fff; visibility:hidden; }
.ssh-app-main .ssh-thumbnail img.is-loaded { visibility:visible; }
.ssh-app-main .ssh-image-source { min-height:44px; font-size:.8rem; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; margin:0 0 8px; }
.ssh-app-main .ssh-image-source a { display:inline-flex; align-items:center; min-height:44px; }
.ssh-app-main .ssh-photo-note { font-size:.75rem; }
@media (scripting:none) {
  .ssh-app-main .ssh-thumbnail > * { grid-area:1/1; }
  /* Without JS no load/error state is available: bound both photos and broken images. */
  .ssh-app-main .ssh-thumbnail img { position:static; visibility:visible; height:80px; }
}
.ssh-app-main .ssh-item[data-status="conflict"] { border-color:#b36247; }
.ssh-app-main .ssh-item[data-status="needs_confirmation"] .ssh-tag { background:#fff7e7; color:#765015; border-color:#d5bd89; }
.ssh-app-main .ssh-item[data-status="conflict"] .ssh-tag { background:#fcece6; color:#8b351b; border-color:#d4a18e; }
.ssh-app-main .ssh-csv { display:inline-flex; align-items:center; min-height:44px; font-weight:650; }
.ssh-app-main .ssh-sources { background:#fff; border:1px solid #cddbd2; border-radius:12px; padding:12px 18px; }
.ssh-app-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px 24px; border-top:1px solid #cddbd2; padding:18px clamp(16px,3.4vw,64px); font-size:.85rem; background:#e9eee8; }
.ssh-app-footer a { color:#155b43; display:inline-flex; align-items:center; min-height:44px; }
.ssh-app-shell :is(a,button,input,select,summary):focus-visible, .ssh-app-skip:focus { outline:3px solid #d09223; outline-offset:3px; }
.ssh-app-skip { position:absolute; top:8px; left:8px; z-index:100001; transform:translateY(-200%); background:#fff; color:#17392e; padding:12px; }
.ssh-app-skip:focus { transform:none; }
.ssh-app-main .ssh-app-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.admin-bar .ssh-app-skip { top:40px; }
.ssh-app-shell :is(#ssh-main,#ssh-search,#ssh-results,#ssh-sources) { scroll-margin-top:20px; }
@media (max-width:1100px) {
  .ssh-app-main .ssh-filters { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .ssh-app-main .ssh-filters label:first-child { grid-column:1/-1; }
  .ssh-app-main .ssh-items { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:782px) {
  .admin-bar .ssh-app-shell { min-height:calc(100dvh - 46px); }
  .admin-bar .ssh-app-skip { top:54px; }
}
@media (max-width:600px) {
  .ssh-app-header { gap:4px 16px; padding:8px 16px; }
  .ssh-app-brand { margin-left:auto; padding:0; border:0; font-size:.85rem; }
  .ssh-app-brand span { display:none; }
  .ssh-app-nav { margin:0; width:100%; gap:8px; }
  .ssh-app-nav a { padding:8px 12px; background:#25493b; }
  .ssh-app-main { padding-top:22px; }
  .ssh-app-main .ssh-filters { grid-template-columns:repeat(2,minmax(0,1fr)); padding:14px; }
  .ssh-app-main .ssh-filters label { grid-column:1/-1; }
  .ssh-app-main .ssh-items { grid-template-columns:1fr; }
}
