`-dedup note below). * - No SWELL breadcrumb duplication: taxonomy-series.php no longer * renders a custom breadcrumb, so there is no .hd-master-breadcrumb * markup or CSS in this file. (This theme does not yet have a * breadcrumb implementation of its own; see * release-records/theme-independent-1.0.0-phase3-master-page.md.) * - `

`-dedup: this theme's header.php already opens the page's one * `

` landmark (closed by footer.php), so * taxonomy-series.php wraps its content in `

` instead of the source's * `

` — * same classes, same content, no second `

`. Every selector below * that targeted `#main_content.hd-master-page` in the source now targets * `#hd-master` instead; nothing else about those rules changed. * - Two SWELL-only rules from the source are dropped entirely (not scope- * adjusted): the empty `.l-sidebar` hide and the * `#content.l-content.l-container` reset. Both existed only to fight * SWELL's own DOM/CSS, which this theme does not have. */ #hd-master { --c-main: #5FA98A; --c-dark: #2C5E47; --c-light: #E7F1EB; --c-light2: #EFF6F1; --c-border: #BBD9C8; --c-border-strong: #9FC7B0; --violet: #6B3FA0; --violet-bg: #F4EEF7; --violet-border: #CBB0DD; --fanza: #F97316; --sale: #E24B4A; --amber: #8A6512; } /* Page chrome: shared page-outer background (--hd-page-bg) + white flat card, no outer rounding/shadow (1.0.29 -- see release-records/ theme-independent-1.0.29-*.md). .hd-entity-series matches directly in this theme (see the header comment above) — no SWELL #body_wrap indirection to work around. */ .hd-entity-series { background: var(--hd-page-bg); } /* * The two SWELL-only rules the source file had here — a * `.tax-series .l-sidebar { display:none !important; }` hide for SWELL's * empty sidebar, and a `.hd-entity-series #content.l-content.l-container` * width/margin/padding reset for SWELL's parent-theme archive wrapper — * are both dropped. This theme has no `.l-sidebar` and no * `#content.l-content.l-container` element at all, so there is nothing * for either rule to fight. */ #hd-master { width: 100%; max-width: none; margin: 0; padding: 20px 14px 28px; } .hd-master-shell { width: min(880px, 100%); margin-inline: auto; padding: 24px 22px 30px; background: #fff; } .hd-master-main { padding: 0; } .hd-master-h1 { font-size: 22px; font-weight: 700; color: #333; line-height: 1.4; margin: 0 0 4px; } .hd-master-h1-sub { font-size: 12.5px; font-weight: 700; color: #555; margin-bottom: 18px; } .hd-master-h1-sub a { color: var(--c-dark); text-decoration: none; } .hd-master-h1-sub a:hover { text-decoration: underline; } /* どんなシリーズ？ */ .hd-master-summary { display: flex; align-items: center; gap: 14px; border-top: 1px solid var(--violet-border); border-bottom: 1px solid var(--violet-border); padding: 14px 18px; margin: 0 0 1.4rem; } .hd-master-summary-icon { width: 34px; height: 34px; flex: 0 0 34px; display: flex; align-items: center; justify-content: center; background: var(--violet-bg); border-radius: 50%; color: var(--violet); } .hd-master-summary-label { font-size: 13px; font-weight: 700; color: var(--violet); letter-spacing: .04em; margin-bottom: 4px; } .hd-master-summary-text { margin: 0; font-size: 17px; font-weight: 700; color: #333; line-height: 1.6; } /* 読み方 */ .hd-master-reading { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--c-light2); border: 1px solid var(--c-border-strong); border-radius: 10px; padding: 11px 14px; margin: 1.3rem 0; font-size: 13px; } .hd-master-reading-options { display: inline-flex; gap: 6px; flex-shrink: 0; } .hd-master-reading-option { display: inline-flex; align-items: center; gap: 4px; padding: 5px 12px; font-size: 13px; font-weight: 700; white-space: nowrap; border-radius: 20px; line-height: 1.5; } .hd-master-reading-option.is-active { background: var(--c-main); color: #fff; } .hd-master-reading-option.is-inactive { background: #fff; color: #999; border: 1px solid #ddd; } .hd-master-reading-check { width: 12px; height: 12px; flex-shrink: 0; } .hd-master-reading-description { color: #333; font-weight: 400; line-height: 1.6; } .hd-master-reading-description b { font-weight: 700; color: #333; } /* Shared inline accents (rich-row titles and quicknav cards both use these). */ #hd-master .ep-inline { color: var(--c-main); } #hd-master .compil-inline { color: var(--violet); } #hd-master .ep-sep { color: var(--c-border); font-weight: 400; margin: 0 2px; } /* * .trend-box/.trend-box-h/.quicknav-body: shared box chrome for シリーズ * 内作品 (quicknav) and ヒロイン人数の推移. Issue #146 production-QA fix: * moved verbatim to the shared assets/css/work-card-grid.css (this * stylesheet's own dependency, functions.php) so post content's 作品一覧 * card list can wrap itself in the identical box chrome instead of a * separate, visually-drifting design. Nothing about ヒロイン人数の推移's * own markup/usage of these classes changed -- see work-card-grid.css's * own docblock. */ /* * シリーズ内作品 (quicknav). Issue #145: the base, non-.compil grid/card * ruleset (.quicknav-grid, .quicknav-card, .qn-thumb, .qn-thumb img, * .qn-foot, .qn-text, .qn-jump, .qn-jump svg, and the SP grid-column * override) moved verbatim to the shared assets/css/work-card-grid.css so * post content's 作品一覧 card list can reuse the identical rules. Only * what is specific to this page -- the omnibus/.compil color variant and * the explanatory note text below the grid -- stays here, unchanged. */ .quicknav-grid-compil { margin-bottom: 10px; } .quicknav-card.compil .qn-thumb { background: linear-gradient(135deg, var(--violet), #4E2D78); } .quicknav-card.compil .qn-jump { background: var(--violet); } .quicknav-note { font-size: 12px; color: #999; margin-top: 12px; } /* シリーズ基本データ */ .hd-master-data-box { margin: 1.7rem 0; border: 1px solid var(--c-border-strong); border-radius: 12px; overflow: hidden; background: #fff; } .hd-master-data-box .data-box-header { min-height: 43px; padding: 8px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; background: var(--c-light); border-bottom: 1px solid #e0e0e0; } .hd-master-data-box .data-box-header-label { font-size: 14px; font-weight: bold; color: #333; letter-spacing: .06em; } .hd-master-data-box .data-box-header-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; } .hd-master-data-box .data-box-header-meta { display: flex; align-items: center; gap: 5px; } .hd-master-data-box .data-box-header-meta-label { font-size: 13px; color: #555; } .hd-master-data-box .data-box-header-meta-value::after { content: ""; flex: 0 0 auto; width: 5.5px; height: 5.5px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); } /* * Shared pill spec (also .hd-master-data-box .tag-chip below; duplicated * from assets/work-pages.css's .data-box-header-meta-value / .tag-chip, * since this page loads its own stylesheet, not that one): font-size 13px, * weight 700, min-height 30px via align-items:center (not a fixed height), * 10px left/right padding, 1px border, 20px radius, 3px gap, 5.5x5.5px * chevron. Keep both copies in sync if this spec changes. */ .hd-master-data-box .data-box-header-meta-value { min-height: 30px; padding: 2px 10px; font-size: 13px; font-weight: bold; color: var(--c-dark); background: var(--c-light); border: 1px solid var(--c-border-strong); border-radius: 20px; text-decoration: none; display: inline-flex; align-items: center; gap: 3px; } .hd-master-data-box .data-box-header-divider { width: 1px; height: 14px; background: var(--c-border); } .hd-master-data-box .data-box-list { display: flex; flex-direction: column; } .hd-master-data-box .data-box-item { display: flex; align-items: center; padding: 11px 16px; border-bottom: 1px solid var(--c-border-strong); gap: 15px; } .hd-master-data-box .data-box-item-label { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 7.5em; font-size: 13px; color: #555; white-space: nowrap; } /* PC and SP both use the label:value row layout (unlike the work page, which only uses rows at SP and a label-above-value grid at PC) — so the "：" separator applies at every width, not just SP. */ .hd-master-data-box .data-box-item-label::after { content: "\FF1A"; color: #999; } .hd-master-data-box .dbi-icon { color: var(--c-main); flex-shrink: 0; } .hd-master-data-box .data-box-item-value { display: flex; align-items: baseline; gap: 6px; font-size: 18px; font-weight: 700; } .hd-master-data-box .data-box-item-value.sm { font-size: 15px; } .hd-master-data-box .data-box-item-value.gap-lg { gap: 10px; flex-wrap: wrap; } .hd-master-data-box .data-box-item-unit { font-size: 12px; color: #999; } .hd-master-data-box .data-box-color-badge { display: inline-flex; align-items: center; font-size: 12.5px; color: var(--amber); background: #FFF6E0; border: 1px solid #E9CE8C; border-radius: 20px; padding: 2px 10px; } .hd-master-data-box .data-box-compil-tag { display: inline-flex; align-items: center; font-size: 11px; color: var(--violet); background: var(--violet-bg); border: 1px solid var(--violet-border); border-radius: 4px; padding: 2px 7px; } .hd-master-data-box .data-box-tags { padding: 10px 16px 12px; } .hd-master-data-box .data-box-tags-label { display: flex; align-items: center; gap: 5px; font-size: 13px; color: #555; margin-bottom: 14px; } .hd-master-data-box .tag-group { display: flex; align-items: flex-start; gap: 14px; } .hd-master-data-box .tag-group + .tag-group { margin-top: 10px; } .hd-master-data-box .tag-group-label { flex: 0 0 108px; padding-top: 4px; text-align: right; font-size: 12.5px; color: #555; white-space: nowrap; } .hd-master-data-box .tag-group-chips { display: flex; flex-wrap: wrap; gap: 6px; } /* Shared pill spec — see .hd-master-data-box .data-box-header-meta-value above. */ .hd-master-data-box .tag-chip { display: inline-flex; align-items: center; gap: 3px; font-size: 13px; font-weight: 700; min-height: 30px; color: var(--c-dark); background: var(--c-light); border: 1px solid var(--c-main); border-radius: 20px; padding: 2px 10px; text-decoration: none; } .hd-master-data-box .tag-chip::after { content: ""; flex: 0 0 auto; width: 5.5px; height: 5.5px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); } /* SP genre toggle: hidden by default, shown only under the 900px query. */ .hd-master-data-box .tag-groups-more { display: none; } /* ヒロイン人数の推移 */ .hd-master-heroine-trend .hc-body { padding: 18px 20px 14px; } .hd-master-heroine-trend .hc-chart { display: block; width: 100%; height: auto; overflow: visible; } .hd-master-heroine-trend .hc-chart text { font-size: 13px; font-weight: 700; fill: var(--c-dark); } .hd-master-heroine-trend .hc-chart .hc-axis-label { font-size: 12px; font-weight: 400; fill: #555; } .hd-master-heroine-trend .hc-note { text-align: center; margin-top: 5px; font-size: 13px; color: #555; } /* * Issue #153 (fix1: text corrected to the confirmed final wording): fixed * definitional note ("※その話に登場するヒロインの人数ではなく、Hシーンが * 描かれているヒロインの人数です。"), always present inside .hc-body, * directly below the chart -- distinct from .hc-note above (an optional, * per-series editor/auto-generated summary sentence written for the OLD * heroine_count metric; fix1 stops passing it to this new chart at all, * see inc/series-view.php's own docblock, so only .hc-fixed-note ever * renders here now). */ .hd-master-heroine-trend .hc-fixed-note { margin: 9px 0 0; font-size: 13px; color: #666; text-align: left; } /* * v43: SP-only vertical step chart for "ヒロイン人数の推移". Default/PC * (901px and up) keeps the existing .hc-chart-pc line chart and hides the * new .hc-chart-sp markup; the @media(max-width:900px) block below flips * this. Ported from haremdoujin_master_page_mock_v43.html's .hc-vrow rules, * with the mock's own breakpoint (it toggled via .pc/.sp preview classes) * mapped onto this site's confirmed 900px/901px boundary. */ .hd-master-heroine-trend .hc-chart-sp { display: none; } /* 総集編一覧・話数一覧 */ .hd-master-rich-section { margin: 2rem 0; } .hd-master-rich-section .sec-jp { display: block; font-size: 18px; font-weight: 700; color: #333; margin-bottom: 10px; } .omni-card-list, .episode-card-list { display: flex; flex-direction: column; gap: 12px; } .rich-row { position: relative; background: #fff; border: 1px solid var(--c-border-strong); border-radius: 10px; padding: 14px 16px; overflow: hidden; transition: box-shadow .15s ease, border-color .15s ease; } /* * Card hover feedback, position-stationary policy matching the vertical * .work-card cards: border + shadow only, no transform. Originally this * also translateY(-2px)'d on hover/focus-within (restored from the 1.3.36- * approved pass, the same commit that introduced the full-card-click * .rich-row-link pattern below) — removed to align with the vertical-card * hover policy. Split into @media(hover:hover) so touch devices, which * can't sustain a real :hover, don't get a stuck ("sticky") hover state * after a tap; :focus-within stays outside that query so keyboard focus * feedback doesn't depend on hover capability. */ @media (hover: hover) { .rich-row:hover { border-color: var(--c-main); box-shadow: 0 8px 22px rgba(44, 94, 71, .14); } .rich-row:hover .rich-row-title { color: var(--c-dark); } } .rich-row:focus-within { border-color: var(--c-main); box-shadow: 0 8px 22px rgba(44, 94, 71, .14); } .rich-row:focus-within .rich-row-title { color: var(--c-dark); } @media (prefers-reduced-motion: reduce) { .rich-row { transition: none; } } /* Full-card click: keep the explicit action buttons independently clickable. */ .rich-row-link { position: absolute; inset: 0; z-index: 1; border-radius: inherit; } .rich-row-title, .rich-row-grid, .rich-row-foot { position: relative; z-index: 2; pointer-events: none; } .rich-row-actions-v2, .rich-row-actions-v2 a { position: relative; z-index: 3; pointer-events: auto; } .rich-row-title { font-size: 16px; font-weight: 700; color: #333; line-height: 1.45; margin: 0 0 9px; } .rich-row-grid { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 18px; } .rich-row-cov-lg { width: 100%; aspect-ratio: 4 / 3; border-radius: 8px; overflow: hidden; background: linear-gradient(135deg, var(--c-main), var(--c-dark)); display: flex; align-items: center; justify-content: center; } .rich-row-cov-lg img { display: block; width: 100%; height: 100%; object-fit: contain; } .rich-row-content { display: flex; flex-direction: column; gap: 10px; min-width: 0; } .rrc-top { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; } .rich-pos-badge { display: inline-flex; align-items: center; font-size: 12.5px; font-weight: 700; color: var(--c-dark); background: #fff; border: 1.5px solid var(--c-main); padding: 3px 10px; border-radius: 4px; } .rich-row-hook { margin: 0; font-size: 14px; font-weight: 700; color: #333; line-height: 1.55; } .rich-row-pick { background: var(--c-light2); border-radius: 9px; padding: 10px 12px; } .rich-row-pick-label { display: flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 700; color: var(--c-dark); margin-bottom: 5px; } .rich-row-pick-text { margin: 0; font-size: 13.5px; color: #333; line-height: 1.65; } .rich-row-benefit { display: flex; flex-direction: column; gap: 4px; } .rrb-item { display: flex; align-items: flex-start; gap: 6px; font-size: 13px; color: #333; line-height: 1.55; } .rrb-check { color: var(--c-main); font-weight: 700; } .rich-row-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; border-top: 1px solid #eef2ef; margin-top: 12px; padding-top: 11px; } .rich-row-data-wrap { display: flex; flex-direction: column; gap: 7px; min-width: 0; } .rich-row-data { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; font-size: 12.5px; color: #555; } .rich-row-data b { color: #333; } .rich-row-price { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; font-size: 12.5px; color: #555; } .rich-row-price .rrp-main { display: flex; align-items: baseline; gap: 6px; } .rich-row-price .reg { font-size: 11px; color: #999; text-decoration: line-through; } .rich-row-price .now { font-size: 18px; font-weight: 700; color: #333; } .rich-row-price .now.sale { color: var(--sale); } .rich-row-price .off-rate { font-size: 10.5px; font-weight: 700; color: #fff; background: var(--sale); padding: 2px 7px; border-radius: 4px; } .rich-row-actions-v2 { display: flex; align-items: center; gap: 9px; flex-shrink: 0; } .ep-row-detail, .ep-row-fanza { display: inline-flex; align-items: center; justify-content: center; gap: 6px; border-radius: 8px; padding: 8px 16px; font-size: 13px; font-weight: 700; text-decoration: none; white-space: nowrap; min-height: 42px; border: 0; } /* FANZA CTA: filled orange, matches the episode purchase-link standard. */ .ep-row-detail { background: var(--c-main); color: #fff; } .ep-row-detail:hover, .ep-row-detail:focus-visible { background: var(--c-dark); color: #fff; } .ep-row-fanza { background: var(--fanza); color: #fff; } .ep-row-fanza:hover, .ep-row-fanza:focus-visible { background: #c95d0f; color: #fff; } /* hdchild_external_icon() renders an unclassed