/* Match the homepage's representative-project hierarchy without changing the
   configurator, mobile presentation, or print layouts. */
@media screen {
  #productHero { grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:0; padding:0; scroll-margin-top:90px; }
  #productHero .hero-img { grid-column:1; grid-row:1; margin:24px; min-height:0; aspect-ratio:4/3; border-radius:18px; }
  #productHero .hero-img img { object-fit:contain; }
  #productHero .product-intro-copy { grid-column:2; grid-row:1; min-width:0; padding:clamp(28px,4vw,52px); }
  #productHero h1 { font-size:clamp(30px,3.4vw,42px); font-weight:750; line-height:1.2; letter-spacing:-1px; margin:18px 0; }
  #productHero h1 span { display:block; font-size:.64em; line-height:1.5; letter-spacing:-.025em; margin-top:8px; }
  #productHero .lead { font-size:1rem; line-height:1.8; max-width:32ch; margin:0; }
  #productHero .pills { margin-top:22px; gap:7px; }
  #productHero .pill { font-size:.75rem; font-weight:550; padding:6px 10px; }
  .product-intro-action { display:inline-flex; align-items:center; justify-content:center; gap:16px; min-height:48px; padding:12px 20px; margin-top:28px; border-radius:var(--radius-action); background:var(--accent-fill); color:var(--on-accent); box-shadow:var(--accent-shadow); text-decoration:none; font-size:.875rem; font-weight:650; }
  .product-intro-action:active { filter:brightness(.96); }
  #productHero .product-gallery, #mobileProductContent .product-gallery { aspect-ratio:auto; overflow:visible; background:none; }
  .product-gallery-frame { position:relative; aspect-ratio:4/3; border-radius:18px; background:var(--pill); overflow:hidden; }
  .product-gallery-frame img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
  .product-gallery-caption { font-size:.75rem; color:var(--ink2); margin:10px 0; }
  .product-gallery-navigation { display:grid; grid-template-columns:44px minmax(0,1fr) 44px; gap:10px; align-items:center; }
  body.charger-guide .product-gallery .product-gallery-navigation > button { display:grid; place-items:center; width:44px; height:44px; padding:0; border:1px solid var(--line); border-radius:var(--radius-control); background:var(--pill); color:var(--ink); font-size:26px; cursor:pointer; }
  .gallery-navigation-icon { display:block; flex:none; }
  .product-gallery-navigation > button:disabled { opacity:.35; cursor:default; }
  .product-gallery-thumbs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
  body.charger-guide .product-gallery .product-gallery-thumb { padding:3px; min-height:44px; aspect-ratio:4/3; min-width:0; border:2px solid transparent; border-radius:12px; background:var(--pill); cursor:pointer; overflow:hidden; }
  body.charger-guide .product-gallery .product-gallery-thumb[aria-pressed=true] { border-color:var(--accent); }
  #productHero .product-gallery-thumb img, #mobileProductContent .product-gallery-thumb img { position:static; display:block; width:100%; height:100%; object-fit:cover; border-radius:7px; }
  .product-gallery .product-gallery-thumb img { position:static; display:block; width:100%; height:100%; object-fit:cover; border-radius:7px; }
  #charger-feedback .product-gallery { max-width:720px; margin:20px auto 0; }
  body.charger-guide .product-gallery button.product-gallery-thumb { border-radius:12px; }
  #chargerProductGallery.product-gallery button.product-gallery-thumb,
  #chargerFeedbackDialog .product-gallery button.product-gallery-thumb { border-radius:12px; }
  /* Use the same section surface, width and gutters as the other feature panels. */
  .product-gallery-groups { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
  body.charger-guide .product-gallery-groups button { min-height:44px; padding:9px 16px; background:var(--pill); color:var(--ink2); border:1px solid var(--line); font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
  body.charger-guide .product-gallery-groups button[aria-pressed=true] { color:var(--ink); border-color:var(--accent); }
  .product-gallery-groups span { margin-left:7px; color:var(--ink2); font-variant-numeric:tabular-nums; }
  .product-gallery-details { min-width:0; }
  .gallery-case-summary { margin:6px 0 12px; font-size:13px; color:var(--ink2); line-height:1.6; }
  .gallery-case-summary:empty { display:none; }
  .gallery-case-actions { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:10px; }
  .gallery-case-actions[hidden] { display:none; }
  .gallery-case-actions code { min-width:0; font-size:12px; line-height:1.6; overflow-wrap:anywhere; color:var(--ink); user-select:text; -webkit-user-select:text; }
  body.charger-guide .gallery-case-actions button, .gallery-case-actions a { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:44px; padding:10px 16px; border:1px solid var(--line); border-radius:var(--radius-action); font:inherit; font-size:13px; font-weight:600; text-decoration:none; cursor:pointer; white-space:nowrap; transition:transform 140ms cubic-bezier(.23,1,.32,1); }
  body.charger-guide .gallery-case-actions button { background:var(--pill); color:var(--ink); }
  .gallery-case-actions a { background:var(--accent-fill); color:var(--on-accent); border-color:transparent; box-shadow:var(--accent-shadow); }
  .product-gallery :is(button,a):focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
  .gallery-case-actions :is(button,a):active { transform:scale(.97); }
  .gallery-case-note, .gallery-case-status { font-size:12px; line-height:1.6; color:var(--ink2); margin:10px 0 0; }
  .gallery-case-status:empty { display:none; }
  .gallery-low-resolution .product-gallery-frame img { width:min(100%,240px); height:min(100%,135px); inset:50% auto auto 50%; transform:translate(-50%,-50%); }
  @media (min-width:701px) {
    #charger-feedback .product-gallery { display:grid; grid-template-columns:minmax(0,1fr) 150px; gap:12px 20px; max-width:none; margin-top:16px; }
    #charger-feedback .product-gallery-groups { grid-column:1 / -1; grid-row:1; margin:0; }
    #charger-feedback .product-gallery-frame { height:380px; aspect-ratio:auto; grid-column:1; grid-row:2; }
    #charger-feedback .product-gallery-details { grid-column:1 / -1; grid-row:3; }
    #charger-feedback .product-gallery-caption { margin:0; }
    #charger-feedback .product-gallery-navigation { grid-column:2; grid-row:2; grid-template-columns:1fr; justify-items:center; align-content:start; gap:8px; }
    #charger-feedback .gallery-navigation-icon { transform:rotate(90deg); }
    #charger-feedback .product-gallery-thumbs { grid-template-columns:1fr; gap:8px; width:100%; }
    #charger-feedback .product-gallery-thumb { aspect-ratio:16/9; width:100%; }
  }
  .feedback-pending { font-size:.875rem; color:var(--ink2); }
  /* Neither image proportions, captions, nor a one-item last thumbnail page
     may resize or recenter the dialog. Scroll content, not the outer shell. */
  #chargerFeedbackDialog { width:min(680px,calc(100% - 24px)); height:min(920px,90dvh); max-height:90dvh; margin:auto; padding:24px; overflow:hidden; color:var(--ink); background:var(--bg); border:1px solid var(--line); border-radius:var(--radius-panel); box-shadow:var(--glass-shadow); }
  #chargerFeedbackDialog[open] { display:flex; flex-direction:column; }
  #chargerFeedbackDialog:not([open]) { display:none; }
  #chargerFeedbackDialog::backdrop { background:rgba(12,16,30,.4); }
  .feedback-dialog-header { display:flex; flex:none; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
  body.charger-guide #closeChargerGallery { width:44px; min-height:44px; border:1px solid var(--line); background:var(--pill); color:var(--ink); cursor:pointer; }
  #chargerFeedbackDialog .feedback-pending { flex:none; margin-top:18px; }
  #chargerFeedbackDialogContent { flex:1; min-height:0; overflow:auto; scrollbar-gutter:stable; overscroll-behavior:contain; }
  #chargerFeedbackDialog .product-gallery { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:44px minmax(180px,1fr) 178px 130px; gap:12px; height:100%; min-height:580px; }
  #chargerFeedbackDialog .product-gallery-groups { margin:0; }
  #chargerFeedbackDialog .product-gallery-frame { height:100%; min-height:0; aspect-ratio:auto; }
  #chargerFeedbackDialog .product-gallery-details { min-height:0; margin:0; overflow:auto; overscroll-behavior:contain; }
  #openChargerGallery { white-space:nowrap; }
  #chargerFeedbackDialog .gallery-case-actions { grid-template-columns:1fr 1fr; }
  #chargerFeedbackDialog .gallery-case-actions code { grid-column:1 / -1; }
  #chargerFeedbackDialog .product-gallery-navigation { margin:0; min-height:0; align-self:center; }
  @media (prefers-reduced-motion:reduce) { .gallery-case-actions :is(button,a) { transition:none; } .gallery-case-actions :is(button,a):active { transform:none; } }
  @media (min-width:701px) {
    #productHero { grid-template-columns:200px minmax(0,1fr); }
    #productHero .hero-img { margin:20px; aspect-ratio:1; }
    #productHero .product-intro-copy { padding:22px 28px; }
    #productHero h1 { font-size:28px; margin:6px 0 8px; }
    #productHero h1 span { display:inline; font-size:.8em; margin:0 0 0 12px; }
    #productHero .lead { max-width:62ch; font-size:.875rem; line-height:1.7; }
    #productHero .pills { display:none; }
    #productHero .product-intro-action { margin-top:12px; min-height:44px; padding:10px 18px; }
    body.charger-guide main.wrap { padding-top:14px; }
    body.charger-guide .back { margin-bottom:12px; }
  }
  @media (min-width:701px) and (max-width:900px) {
    #productHero { grid-template-columns:160px minmax(0,1fr); }
    #productHero .hero-img { margin:16px; }
    #productHero .product-intro-copy { padding:18px 20px; }
  }
  @media (max-width:700px) {
    .gallery-case-actions { grid-template-columns:1fr 1fr; }
    .gallery-case-actions code { grid-column:1 / -1; }
    .product-gallery-details { margin:14px 0; }
    .product-gallery-navigation { gap:6px; }
    #chargerFeedbackDialog { padding:16px; height:calc(100dvh - 32px); max-height:calc(100dvh - 32px); }
    #chargerFeedbackDialog .product-gallery { grid-template-rows:44px minmax(180px,1fr) 184px 76px; min-height:560px; }
    .feedback-dialog-header h2 { font-size:20px; }
    .product-gallery-groups { gap:6px; }
    body.charger-guide .product-gallery-groups button { padding-inline:12px; }
    #productHero { grid-template-columns:1fr; }
    #productHero .product-intro-copy { grid-column:1; grid-row:2; padding:26px 24px; }
    #productHero .hero-img { margin:18px; }
    .mobile-entry-ready #productHero .product-intro-copy { padding:0; }
    .mobile-entry-ready #productHero .product-intro-action { display:none; }
    .mobile-entry-ready #productHero h1 span { font-size:inherit; line-height:inherit; margin-top:0; }
    #mobileProductContent .hero-img { margin:0; }
    #mobileProductContent #productOverview { font-size:1rem; line-height:1.8; }
    #openChargerGallery svg { display:none; }
    #openChargerGallery span { display:block!important; font-size:11px; }
    #openChargerGallery { padding:8px!important; min-width:64px; }
  }
}