/* Pit Stop — Remmy's garage look (drops/remmy/village-garage-posters/notes.md). All classes are ps- prefixed. */
.ps-body{margin:0;background:#0f172a;color:#f8fafc;font-family:Inter,system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;-webkit-text-size-adjust:100%;min-height:100vh}
.ps-body *{box-sizing:border-box}
.ps-bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;padding:calc(10px + env(safe-area-inset-top)) 16px 10px;background:rgba(15,23,42,.94);backdrop-filter:blur(8px);border-bottom:1px solid #1e293b}
.ps-back-life{color:#cbd5e1;text-decoration:none;font-weight:700;font-size:15px;min-height:44px;display:inline-flex;align-items:center;padding:0 4px}
.ps-brand{flex:1;margin:0;font-size:20px;font-weight:900;display:flex;align-items:center;gap:8px;letter-spacing:.01em}
.ps-brand img{border-radius:8px}
.ps-gate-note{margin:16px;color:#cbd5e1}
.ps-app{max-width:1280px;margin:0 auto;padding:16px 20px calc(32px + env(safe-area-inset-bottom))}
.ps-msg{padding:28px 8px;color:#cbd5e1;font-size:17px;text-align:center}
.ps-msg-err p{color:#fecaca}
.ps-warn{background:#1e293b;border-left:4px solid #fbbf24;border-radius:8px;padding:10px 12px;color:#fde68a;font-size:15px;margin:10px 0}
.ps-head{display:flex;align-items:baseline;gap:12px;margin:4px 2px 12px}
.ps-head h2{margin:0;font-size:24px;font-weight:900}
.ps-head p{margin:0;color:#94a3b8;font-weight:700;font-size:15px}

/* wall */
.ps-wall{display:flex;align-items:flex-end;gap:24px;padding:36px 28px 32px;border-radius:16px;background:repeating-linear-gradient(90deg,#9aa3ad 0 78px,#8f98a3 78px 80px);box-shadow:inset 0 -10px 0 #7d8590}
.ps-strip{flex:1;display:flex;flex-wrap:wrap;gap:28px 26px;align-items:flex-start;min-width:0}
.ps-poster{position:relative;width:200px;aspect-ratio:3/4;background:#f4ead7;border-radius:6px;padding:26px 14px 14px;box-shadow:0 6px 0 #c9b99a,0 10px 24px rgba(0,0,0,.35);color:#1f2a44;display:flex;flex-direction:column;align-items:center;gap:8px;transform:rotate(var(--ps-r,0deg));text-decoration:none;transition:transform .15s ease}
.ps-poster:hover,.ps-poster:focus-visible{transform:rotate(0deg) translateY(-3px)}
.ps-poster:focus-visible,.ps-cab:focus-visible,.ps-card:focus-visible{outline:3px solid #fbbf24;outline-offset:4px}
.ps-pin{position:absolute;top:9px;left:50%;margin-left:-7px;width:14px;height:14px;border-radius:50%;background:#c0463a;box-shadow:0 2px 0 #7a2a22}
.ps-sil{display:block;width:100%;background:#e7dcc4;border-radius:6px;padding:8px 14px 4px}
.ps-sil svg{display:block;width:100%;height:auto}
/* vehicle tiles: Remmy's real side views sit on poster cream #efe3c8; same 944:360 box for the wrench so posters line up */
.ps-sil.ps-sil-art,.ps-sil.ps-sil-wrench{aspect-ratio:944/360;overflow:hidden}
.ps-sil.ps-sil-art{padding:0;background:#efe3c8;box-shadow:inset 0 0 0 1px rgba(31,42,68,.08)}
.ps-sil-art picture,.ps-sil-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:left bottom}
/* the Sedona file's cream runs lighter/yellower (~#feedd3) than #efe3c8; a 4.5% dim brings it onto the poster cream */
.ps-sil.ps-sil-wrench{display:flex;align-items:center;justify-content:center;padding:6px 10px}
.ps-sil-wrench svg{width:auto;height:100%;max-width:100%}
.ps-ptitle{flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:19px;font-weight:800;line-height:1.15;text-align:center;margin-top:4px;max-height:3.45em;overflow-wrap:anywhere}
.ps-pveh{font-size:12px;font-weight:800;color:#64748b;text-transform:uppercase;letter-spacing:.09em;text-align:center}
.ps-stamp{display:inline-block;font-size:13px;font-weight:900;letter-spacing:.12em;padding:5px 13px;border-radius:999px;transform:rotate(-4deg)}
.ps-st-open{background:#f59e0b;color:#1f2a44}
.ps-st-watching{background:#bfdbfe;color:#1e3a8a}
.ps-st-fixed{background:#22c55e;color:#052e16}
.ps-empty-wall{background:#f4ead7;color:#1f2a44;border-radius:8px;padding:18px 20px;font-weight:800;box-shadow:0 6px 0 #c9b99a}
.ps-cab-slot{flex:0 0 auto;align-self:flex-end}
.ps-cab{width:150px;display:flex;flex-direction:column;gap:6px;background:#5f7f6e;padding:10px;border-radius:8px;box-shadow:0 6px 0 #3e5648,0 10px 22px rgba(0,0,0,.3);text-decoration:none}
.ps-cab-lab{background:#f4ead7;color:#1f2a44;font-size:12px;font-weight:900;text-align:center;border-radius:3px;padding:4px;letter-spacing:.06em}
.ps-dr{height:50px;background:#6f917f;border-radius:4px;display:flex;align-items:center;justify-content:center}
.ps-dr i{width:44px;height:10px;background:#efe6d2;border-radius:3px}
.ps-cab-n{color:#f4ead7;font-size:13px;font-weight:800;text-align:center}

/* detail */
.ps-detail{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:0 24px;align-items:start}
.ps-top{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.ps-pill-back{display:inline-flex;align-items:center;min-height:44px;border:1px solid #334155;border-radius:999px;padding:0 16px;font-weight:800;font-size:15px;color:#f8fafc;text-decoration:none}
.ps-chip{font-size:12px;font-weight:900;padding:5px 11px;border-radius:999px;letter-spacing:.1em}
.ps-h1{font-size:28px;line-height:1.15;margin:6px 0 4px;font-weight:900}
.ps-sub{color:#94a3b8;font-size:15px;margin:0 0 12px;font-weight:600}
.ps-stage{background:radial-gradient(ellipse at 50% 60%,#1e293b,#0b1222);border-radius:16px;padding:12px;overflow:hidden}
.ps-stage img{display:block;width:100%;height:auto}
.ps-stage-none{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:220px;color:#94a3b8;font-weight:800}
.ps-stage-none p{margin:0}
.ps-sil-lg{max-width:440px;border-radius:12px}
.ps-sil-lg.ps-sil-wrench{max-width:260px;background:#1e293b}
.ps-legend{display:none;grid-template-columns:1fr 1fr;gap:6px 14px;margin:10px 0 0;padding-left:24px;font-size:15px;font-weight:700;color:#e2e8f0}
.ps-legend .ps-hl{color:#fbbf24}
.ps-hint{font-size:14px;color:#fbbf24;margin:8px 2px 0;font-weight:700}
.ps-d-head{grid-column:1 / -1}
.ps-d-side{padding-top:0}
.ps-what{background:#1e293b;border-radius:14px;padding:14px 16px;margin:0 0 12px;font-size:17px;line-height:1.45}
.ps-what p{margin:0 0 8px}.ps-what p:last-child{margin:0}
.ps-what b{color:#fbbf24}
.ps-3d-link{display:flex;align-items:center;gap:12px;background:#fbbf24;border-radius:12px;padding:12px 14px;margin:0 0 12px;color:#1f2a44;text-decoration:none;font-weight:900;font-size:17px;min-height:56px;box-shadow:0 3px 0 #b45309}
.ps-3d-link:hover{background:#fcd34d}
.ps-3d-link:focus-visible{outline:3px solid #f8fafc;outline-offset:2px}
.ps-3d-link>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}
.ps-3d-link small{font-size:13px;font-weight:700;color:#3b3220}
.ps-3d-ic{flex:0 0 40px;width:40px;height:40px;border-radius:10px;background:#1f2a44;color:#fbbf24;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:900}
.ps-3d-link>span:last-child{font-size:24px;line-height:1}
.ps-links a{display:flex;align-items:center;gap:12px;background:#1e293b;border-radius:12px;padding:12px 14px;margin-bottom:8px;color:#f8fafc;text-decoration:none;font-weight:800;font-size:15px;min-height:48px}
.ps-links a:hover{background:#273449}
.ps-yt{flex:0 0 28px;width:28px;height:20px;border-radius:5px;background:#e11d48;display:flex;align-items:center;justify-content:center;font-size:10px;color:#fff}
.ps-nolinks{border:2px dashed #334155;border-radius:12px;padding:12px 14px;color:#94a3b8;font-weight:800;font-size:15px;min-height:48px;display:flex;align-items:center}
.ps-dates{color:#94a3b8;font-size:13px;font-weight:700;margin:10px 2px}
.ps-btn{display:block;width:100%;margin-top:12px;border-radius:999px;padding:14px;min-height:50px;font:inherit;font-size:16px;font-weight:900;cursor:pointer;border:2px solid #22c55e}
.ps-btn:disabled{opacity:.6;cursor:wait}
.ps-btn-go{background:#22c55e;color:#052e16}
.ps-btn-ghost{background:transparent;color:#86efac}
.ps-only{font-size:12px;color:#64748b;margin:6px 2px 0;text-align:center}

/* cabinet */
.ps-cabinet{background:#5f7f6e;border-radius:16px;padding:16px 18px 22px;box-shadow:0 8px 0 #3e5648}
.ps-cab-top{margin-bottom:4px}
.ps-cabinet .ps-pill-back{border-color:#a7c0b2;background:rgba(15,23,42,.18)}
.ps-head-cab h2{color:#f4ead7}.ps-head-cab p{color:#dfe9e2}
.ps-cabinet .ps-msg{color:#f4ead7}
.ps-drawer{background:#6f917f;border-radius:8px;padding:12px 14px 14px;margin-top:14px;box-shadow:inset 0 -4px 0 #57766a}
.ps-drawer h3{display:flex;align-items:center;gap:10px;margin:0 0 10px;color:#f4ead7;font-size:15px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.ps-sil.ps-sil-sm{flex:0 0 96px;width:96px;border-radius:4px}
.ps-sil.ps-sil-sm.ps-sil-wrench{padding:3px 6px;background:#e7dcc4}
.ps-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.ps-card{display:flex;flex-direction:column;justify-content:space-between;gap:10px;min-height:96px;background:#f4ead7;color:#1f2a44;border-radius:6px;padding:12px 14px;text-decoration:none;box-shadow:0 4px 0 #c9b99a}
.ps-card-t{font-weight:800;font-size:16px;line-height:1.2}
.ps-card-f{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ps-card .ps-stamp{font-size:11px;padding:4px 10px}
.ps-card-d{font-size:13px;color:#64748b;font-weight:700}

/* tablet portrait: 2-column poster grid, cabinet strip full width underneath */
@media (max-width: 900px){
  .ps-detail{grid-template-columns:1fr;gap:6px}
  .ps-d-side{padding-top:8px}
  .ps-wall{flex-direction:column;align-items:stretch;padding:30px 28px 26px;gap:28px}
  .ps-strip{flex:0 0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 36px;justify-items:center}
  .ps-poster{width:100%;max-width:300px;aspect-ratio:auto;align-self:stretch;padding:30px 18px 18px;gap:10px}
  .ps-ptitle{flex:0 0 auto;font-size:22px;height:3.45em;max-height:none}
  .ps-pveh{margin-top:auto}
  .ps-pveh{font-size:13px}
  .ps-stamp{font-size:14px;padding:6px 15px}
  .ps-empty-wall{grid-column:1 / -1}
  .ps-cab-slot{align-self:stretch}
  .ps-cab{flex-direction:row;align-items:center;width:100%;min-height:60px;justify-content:space-between}
  .ps-cab-lab{order:-1;padding:6px 10px}
  .ps-dr{flex:1;height:40px}
  .ps-cab-n{padding:0 6px}
}
/* phone: same 2-column grid, ~170px posters */
@media (max-width: 600px){
  .ps-app{padding:12px 10px calc(28px + env(safe-area-inset-bottom))}
  .ps-wall{padding:22px 12px 18px;gap:22px}
  .ps-strip{gap:20px 12px}
  .ps-poster{max-width:none;aspect-ratio:auto;min-height:236px;padding:22px 10px 12px;gap:7px}
  .ps-sil{padding:6px 10px 3px}
  .ps-sil.ps-sil-wrench{padding:5px 8px}
  .ps-ptitle{flex:1 0 auto;height:auto;max-height:none;font-size:16px;-webkit-line-clamp:3}
  .ps-pveh{font-size:11px}
  .ps-stamp{font-size:12px;padding:4px 11px}
  .ps-cab{min-height:56px}
  .ps-dr{height:36px}
  .ps-h1{font-size:24px}
  .ps-legend{display:grid}
  .ps-what{font-size:16px}
  .ps-cards{grid-template-columns:1fr}
  .ps-cabinet{padding:12px 12px 18px}
}