/* GSF04 V19: 2-state snap sheet; summary shows circle and idol. */
@media (max-width:760px) {
 .detailCard {height:var(--gsf-sheet-height,112px)!important}
 .detailCard .gsfSheetDragArea {
   height:112px!important;flex:0 0 112px!important;
   padding:29px 65px 13px 20px!important;align-items:center!important;
 }
 .detailCard .gsfSheetSummary {display:flex;flex-direction:column;justify-content:center;min-width:0;width:100%;gap:4px;pointer-events:none}
 .detailCard .gsfSheetTitle {display:block;font-size:20px!important;font-weight:650!important;line-height:1.32!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .detailCard .gsfSheetIdol {font-size:14px;line-height:1.45;letter-spacing:.01em;color:#627185;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .detailCard .sheetClose {top:38px!important}
 /* The fixed header owns both summary lines. No duplicated metadata below. */
 .detailCard .detailBody #detailCircle {display:none!important}
 .detailCard .detailBody>.detailHead {margin-bottom:9px}
 .detailCard:not(.gsfSheetAtMax) .detailBody {overflow:hidden!important}
 .detailCard.gsfSheetAtMax:not(.gsfSheetDragging) .detailBody {overflow-y:auto!important}
}
/* GSF04 V20: compact two-state sheet and later-supplied idol portrait slots. */
@media(max-width:760px){
  .detailCard .sheetClose{display:none!important}
  .detailCard .gsfSheetDragArea{
    height:112px!important;flex:0 0 112px!important;padding:24px 64px 11px 18px!important;
  }
  .detailCard .gsfSheetSummary{display:flex!important;flex-direction:column;align-items:flex-start;gap:7px;min-width:0;width:100%;justify-content:center}
  .detailCard .gsfSheetLocation{font-size:11px;font-weight:600;color:#7b8895;line-height:1;white-space:nowrap}
  .detailCard .gsfSheetMainLine{display:flex;align-items:center;max-width:100%;width:100%;min-width:0;gap:5px}
  .detailCard .gsfSheetNameGroup{display:flex;align-items:baseline;max-width:100%;flex:0 1 auto;min-width:0;overflow:hidden;white-space:nowrap}
  .detailCard .gsfSheetTitle{width:auto!important;flex:0 1 auto;max-width:100%;min-width:0;font-size:17px!important;font-weight:650!important;line-height:1.36!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .detailCard .gsfSheetPen{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:#6b7785;font-weight:450}
  .detailCard .gsfSheetSlash{font-size:17px;color:#b1bac3;flex:0 0 auto}
  .detailCard .gsfSheetIdols{display:flex;align-items:center;flex:0 0 auto;gap:2px;min-width:0}
  .detailCard .gsfIdolIcon{display:grid;place-items:center;object-fit:cover;overflow:hidden;border-radius:50%;border:1px solid #dfe4ea;box-shadow:0 1px 4px #00000011}
  .detailCard .gsfIdolMain{width:39px;height:39px;font-size:15px}
  .detailCard .gsfIdolSecondary{width:30px;height:30px;font-size:13px}
  .detailCard .gsfIdolPlaceholder{background:#e9ecf2;color:#68778a;font-weight:650}
  .detailCard .gsfQuickFavorite{position:absolute;right:12px;top:39px;z-index:15;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:#f0f2f4;color:#8a929c;font-size:28px;line-height:1;cursor:pointer;touch-action:manipulation;padding:0;box-shadow:none}
  /* Keep a comfortable 44px tap area; reduce only the star glyph. */
  .detailCard .gsfQuickFavorite[data-style=star]{font-size:22px}
  .detailCard .gsfQuickFavorite[data-style=star].isActive{color:#dca400;background:#fff6ce;text-shadow:0 0 8px #ffdf5188}
  .detailCard .gsfQuickFavorite[data-style=heart].isActive{color:#ed5b92;background:#ffe9f0;text-shadow:0 0 8px #ff9bbf99}
  .detailCard .gsfQuickFavorite:focus-visible{outline:2px solid #3e90bb;outline-offset:2px}
  .detailCard.gsfSheetDismissing{transition:transform 180ms ease-in,opacity 180ms ease-in!important}
}
@media(min-width:761px){.gsfQuickFavorite{display:none!important}}
@media(max-width:350px){.detailCard .gsfSheetTitle{font-size:16px!important}.detailCard .gsfIdolMain{width:35px;height:35px}}

/* V21: never split circle(author) / idol into several lines.
   Prefer truncating an excessively long circle title to moving the slash/icon. */
@media (max-width:760px){
  .detailCard .gsfSheetSummary {
    flex-wrap:nowrap!important;
    overflow:hidden;
    width:100%;
  }
  .detailCard .gsfSheetMainLine {
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    gap:5px!important;
    white-space:nowrap!important;
  }
  .detailCard .gsfSheetNameGroup {
    display:inline-flex!important;
    flex-direction:row!important;
    align-items:baseline!important;
    flex-wrap:nowrap!important;
    flex:0 1 auto!important;
    min-width:0!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    gap:0!important;
  }
  .detailCard .gsfSheetTitle {
    display:inline-block!important;
    flex:0 1 auto!important;
    width:auto!important;
    min-width:0!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }
  .detailCard .gsfSheetPen {
    display:inline-block!important;
    flex:0 0 auto!important;
    width:auto!important;
    max-width:none!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    line-height:1.3;
    margin:0!important;
    padding:0!important;
  }
  .detailCard .gsfSheetSlash {
    display:inline-block!important;
    flex:0 0 auto!important;
    margin:0 1px!important;
    font-size:16px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .detailCard .gsfSheetIdols {
    display:inline-flex!important;
    flex:0 0 auto!important;
    align-items:center!important;
    white-space:nowrap!important;
  }
}

/* V22: white-backed original portraits, with the lead idol larger. */
@media (max-width:760px) {
  .detailCard .gsfIdolIcon:not(.gsfIdolPlaceholder) {
    background: #fff;
    border-color: #f0f0f0;
    object-fit: contain;
    padding: 0;
  }
  .detailCard .gsfIdolPlaceholder { background: #fff; }
}


/* Ver.24: inverse star palette — white disc, subdued gray outline when off,
   filled golden star when on. Tap target stays 44 x 44 px. */
@media(max-width:760px){
  .detailCard .gsfQuickFavorite[data-style="star"] {
    width:44px;height:44px;
    display:grid;place-items:center;
    background:#fff;
    color:#8b949e;
    border:1px solid #e3e7eb;
    box-shadow:0 1px 3px rgba(21,37,51,.045);
    text-shadow:none;
    padding:0;
  }
  .detailCard .gsfQuickFavorite[data-style="star"] .gsfFavoriteSvg {
    display:block;
    width:22px;height:22px;
    fill:none;
    stroke:currentColor;
    transition:fill .16s ease,stroke .16s ease;
  }
  .detailCard .gsfQuickFavorite[data-style="star"].isActive {
    background:#fff;
    color:#f2b900;
    border-color:#eedca2;
    text-shadow:none;
    box-shadow:0 0 0 2px rgba(255,202,38,.09),0 0 9px rgba(243,187,12,.18);
  }
  .detailCard .gsfQuickFavorite[data-style="star"].isActive .gsfFavoriteSvg {
    fill:#ffc400;
    stroke:#e8ad00;
    filter:drop-shadow(0 0 1.5px rgba(237,185,14,.32));
  }
}
@media(prefers-reduced-motion:reduce){
  .detailCard .gsfQuickFavorite .gsfFavoriteSvg{transition:none!important}
}


/* Ver.25: creator credit moves UNDER circle title; 26px favorite star. */
@media (max-width:760px) {
  .detailCard .gsfSheetMainLine {
    align-items:center!important;
    gap:6px!important;
  }
  .detailCard .gsfSheetNameGroup {
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    flex:1 1 0%!important;
    width:0!important;
    max-width:none!important;
    min-width:0!important;
    gap:1px!important;
    white-space:normal!important;
    overflow:hidden!important;
  }
  .detailCard .gsfSheetTitle {
    display:block!important;
    flex:0 0 auto!important;
    width:100%!important;
    max-width:100%!important;
    line-height:1.25!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .detailCard .gsfSheetPen {
    display:block!important;
    flex:0 0 auto!important;
    width:100%!important;
    max-width:100%!important;
    font-size:12px!important;
    line-height:1.3!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .detailCard .gsfQuickFavorite[data-style="star"] .gsfFavoriteSvg {
    width:26px!important;
    height:26px!important;
  }
}

/* Ver.26: Keep the creator name below the circle name, but align the
   separator and portrait immediately after the name block.
   Do NOT stretch the name group into the empty space before favorites. */
@media (max-width:760px) {
  .detailCard .gsfSheetMainLine {
    justify-content:flex-start!important;
    gap:6px!important;
  }
  .detailCard .gsfSheetNameGroup {
    flex:0 1 auto!important;
    width:max-content!important;
    max-width:calc(100% - 60px)!important;
    min-width:0!important;
  }
  .detailCard .gsfSheetSlash,
  .detailCard .gsfSheetIdols { flex-shrink:0!important; }
}