/*
Theme Name: Djtube
Description: 日本語ラップのメディア Djtube 専用の独立テーマ。
Version: 1.0.45
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: djtube
*/
:root { --site-red: var(--dj-c-red, #f00); --site-ink: var(--dj-c-black, #0a0a0a); --site-muted: var(--dj-c-mute, #666); --site-line: #dedede; --site-paper: var(--dj-c-white, #fff); --site-soft: var(--dj-c-bg-soft, #f5f5f5); --site-width: 1200px; --site-gutter: clamp(20px, 4vw, 56px); --site-nav-inset: 12px; --site-sans: var(--dj-font-interface, 'Inter','Noto Sans JP',sans-serif); --site-mono: var(--dj-font-label, 'JetBrains Mono',monospace); }
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--site-header-offset, 0px) + 24px); }
body { margin: 0; background: var(--site-paper); color: var(--site-ink); font: 16px/1.8 var(--site-sans); overflow-wrap: break-word; }
a { color: inherit; text-underline-offset: .22em; }
button, input, textarea, select { font: inherit; }
button, summary { cursor: pointer; }
img { max-width: 100%; height: auto; vertical-align: middle; }
iframe, video { max-width: 100%; }
/* Public-page copy/save deterrence; keep visitor input and editor tools usable. */
body, body * { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
body img { -webkit-user-drag: none; }
body input, body textarea, body select, body [contenteditable]:not([contenteditable="false"]), body [contenteditable]:not([contenteditable="false"]) *, #wpadminbar, #wpadminbar * { -webkit-user-select: text; user-select: text; -webkit-touch-callout: default; }
/* Keep reCAPTCHA running; the required disclosure is in the site footer. */
.grecaptcha-badge { visibility: hidden; }
:focus-visible { outline: 2px solid var(--site-red); outline-offset: 5px; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link:focus { position: fixed; z-index: 10000; top: 12px; left: 12px; padding: 12px 20px; background: #fff; color: #000; width: auto; height: auto; clip-path: none; }
.site-wrap { width: min(var(--site-width), calc(100% - var(--site-gutter) * 2)); margin-inline: auto; }
.site-header { border-top: 5px solid var(--site-red); border-bottom: 1px solid var(--site-ink); }
.site-header.is-scroll-aware { position: sticky; top: 0; z-index: 100; background: var(--site-paper); transform: translateY(0); transition: transform 520ms cubic-bezier(.22, 1, .36, 1); }
.site-header.is-hidden { transform: translateY(calc(-100% - 1px)); transition-duration: 420ms; transition-timing-function: cubic-bezier(.4, 0, .2, 1); }
.admin-bar .site-header.is-scroll-aware { top: 32px; }
.site-masthead { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding-block: 24px; }
.site-brand { display: inline-block; width: 101px; max-width: 100%; line-height: 1; vertical-align: middle; text-decoration: none; }
.site-brand img { display: block; width: 100%; height: auto; }
.site-tagline { margin: 8px 0 0; color: var(--site-muted); font-size: 11px; font-weight: 500; letter-spacing: .1em; }
.site-nav-row { display: flex; justify-content: space-between; align-items: stretch; gap: 20px; border-top: 1px solid var(--site-line); min-height: 54px; }
.site-nav-row > .site-eyebrow { align-self: center; }
.site-desktop-nav { margin-inline-start: calc(-1 * var(--site-nav-inset)); }
.site-desktop-nav > ul { height: 100%; }
.site-nav ul { display: flex; align-items: stretch; flex-wrap: wrap; gap: 0 4px; list-style: none; margin: 0; padding: 0; }
.site-nav li { position: relative; }
.site-nav a { display: block; padding: 13px var(--site-nav-inset); font-size: 13px; font-weight: 700; text-decoration: none; }
.site-nav > ul > li > a { display: flex; align-items: center; height: 100%; }
.site-nav a:hover, .site-term-link:hover, .site-breadcrumb a:hover { background: var(--site-soft); color: var(--site-ink); }
.site-button, .site-post-nav a, .site-comments .comment-reply-link { display: inline-flex; align-items: center; justify-content: center; min-height: var(--dj-control-size, 44px); max-width: 100%; padding: 10px 20px; border: 1px solid var(--site-ink); border-radius: 0; background: var(--site-paper); color: var(--site-ink); font: 700 13px/1.6 var(--site-sans); text-decoration: none; text-align: center; overflow-wrap: anywhere; box-shadow: none; cursor: pointer; }
.site-button:enabled:hover, a.site-button:hover, .site-post-nav a:hover, .site-comments .comment-reply-link:hover { background: var(--site-soft); color: var(--site-ink); }
.site-nav .sub-menu { display: none; position: absolute; z-index: 20; top: 100%; left: 0; min-width: 230px; padding: 10px 20px; border: 1px solid var(--site-line); background: #fff; }
.site-nav li:hover > .sub-menu, .site-nav li:focus-within > .sub-menu { display: block; }
.site-mobile-menu { display: none; }
.site-mobile-menu[open] { max-height: calc(100dvh - 130px); overflow-y: auto; }
.site-search { display: flex; width: min(280px, 100%); border: 1px solid var(--site-line); }
.site-search:focus-within { border-color: var(--site-muted); }
.site-search input { min-width: 0; width: 100%; border: 0; border-radius: 0; padding: 9px 12px; background: transparent; color: inherit; font-size: 16px; }
.site-search input:focus { outline: none; }
.site-search button { border: 0; border-left: 1px solid var(--site-line); border-radius: 0; background: transparent; color: inherit; padding: 8px 14px; font-size: 12px; white-space: nowrap; }
.site-search button:focus-visible { outline-color: var(--site-muted); outline-offset: -2px; }
.site-search button:enabled:hover { background: var(--site-soft); color: var(--site-ink); }
.site-main { min-height: 50vh; padding-block: 36px 80px; }
.site-eyebrow { display: block; font: 700 11px/1.5 var(--site-mono); letter-spacing: .14em; color: var(--site-red); }
.site-intro { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 48px; align-items: center; padding-block: 12px 40px; margin-bottom: 40px; border-bottom: 3px solid var(--site-ink); }
.site-intro h1 { font-size: clamp(26px, 3.2vw, 44px); letter-spacing: -.04em; line-height: 1.45; margin: 14px 0; font-weight: 900; }
.site-intro p { margin: 0; font-size: 14px; color: var(--site-muted); max-width: 620px; }
.site-chart-feature { display: flex; flex-direction: column; gap: 10px; padding: 26px; border: 1px solid var(--site-ink); background: var(--site-ink); color: white; }
.site-chart-feature strong { font: 900 34px/1.1 'Jost',var(--site-sans); letter-spacing: -.02em; }
.site-chart-feature .site-chart-label { font-size: 13px; }
.site-chart-feature .site-chart-action { align-self: flex-start; margin-top: 8px; }
.site-section { margin-block: 48px; }
.site-chart-more { margin: 22px 0 0; font-size: 13px; font-weight: 700; text-align: right; }
.site-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; border-bottom: 2px solid var(--site-ink); margin-bottom: 24px; padding-bottom: 14px; }
.site-section-heading h2 { font-size: 20px; margin: 0; font-weight: 900; }
.site-section-heading span { font: 500 10px var(--site-mono); color: var(--site-muted); letter-spacing: .12em; }
.site-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 40px; align-items: start; }
.site-layout > *, .site-sidebar > * { min-width: 0; }
.site-home-layout { grid-template-areas: 'daily promotion' 'latest discover'; }
.site-home-layout--no-chart { grid-template-areas: 'latest promotion' 'latest discover'; grid-template-rows: auto 1fr; }
.site-home-layout > .site-section { margin: 0; }
.site-home-daily { grid-area: daily; }
.site-home-daily .site-section-heading { border-bottom: 0; margin-bottom: 0; }
.site-home-latest { grid-area: latest; }
.site-home-layout > .site-promotion { grid-area: promotion; }
.site-home-layout > .site-discover { grid-area: discover; }
.site-sidebar, .site-discover { display: grid; gap: 36px; }
.site-ad-label { margin: 0 0 10px; color: var(--site-muted); font: 10px/1.5 var(--site-sans); }
.site-banner-stack { display: grid; gap: 16px; }
.site-banner-stack .custom-html-widget { display: grid; gap: 16px; }
.site-banner-link, .site-banner-stack img { display: block; }
.site-banner-stack img { width: 100%; height: auto; }
.site-widget { min-width: 0; max-width: 100%; }
.site-widget-title { margin: 0 0 16px; font-size: 17px; line-height: 1.6; }
.site-discover .site-section { margin: 0; }
.site-discover .site-section-heading { gap: 8px; margin-bottom: 16px; padding-bottom: 12px; }
.site-discover .site-section-heading h2 { font-size: 17px; }
.site-discover .site-section-heading span { font-size: 9px; }
.site-sidebar-categories .site-terms { display: grid; gap: 0; }
.site-sidebar-categories .site-term-link { justify-content: space-between; border: 0; border-bottom: 1px solid var(--site-line); padding: 12px; }
.site-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px 28px; }
.site-layout .site-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.site-card { min-width: 0; border-bottom: 1px solid var(--site-line); padding-bottom: 22px; }
.site-card-image { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--site-soft); text-decoration: none; }
.site-card-image img { width: 100%; height: 100%; object-fit: cover; }
/* Keep the diagonal hover treatment within article thumbnails. */
:is(.site-card-image, .dj-related__thumb, .dj-pickup__photo, a.dj-lineup__photo) { position: relative; isolation: isolate; }
:is(.site-card-image, .dj-related__thumb, .dj-pickup__photo, a.dj-lineup__photo)::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: 0; background-image: linear-gradient(135deg, #0a0a0a 25%, #fff 25%, #fff 50%, #0a0a0a 50%, #0a0a0a 75%, #fff 75%); background-size: 56px 56px; transition: opacity 280ms cubic-bezier(.22, 1, .36, 1); }
@media (hover: hover) and (pointer: fine) {
  :is(.site-card-image, .dj-related__thumb, .dj-pickup__photo, a.dj-lineup__photo):hover::after { opacity: 1; animation: site-thumbnail-stripes 3s linear infinite; }
}
.site-card-image:focus-visible::after, .dj-related__card:focus-visible .dj-related__thumb::after, a.dj-pickup:focus-visible .dj-pickup__photo::after, a.dj-lineup__photo:focus-visible::after { opacity: 1; animation: site-thumbnail-stripes 3s linear infinite; }
@keyframes site-thumbnail-stripes { to { background-position: 56px 0; } }
@media (prefers-reduced-motion: reduce) {
  :is(.site-card-image, .dj-related__thumb, .dj-pickup__photo, a.dj-lineup__photo)::after { transition: none; animation: none; }
  :is(.site-card-image, .dj-related__thumb, .dj-pickup__photo, a.dj-lineup__photo):hover::after, .site-card-image:focus-visible::after, .dj-related__card:focus-visible .dj-related__thumb::after, a.dj-pickup:focus-visible .dj-pickup__photo::after, a.dj-lineup__photo:focus-visible::after { animation: none; }
}
.site-card-placeholder { display: grid; place-content: center; height: 100%; color: #ccc; font-size: 32px; font-weight: 900; letter-spacing: -.06em; }
.site-card-meta { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-block: 14px 8px; font-size: 10px; }
.site-card-meta a { color: var(--site-red); text-decoration: none; font-weight: 700; }
.site-card-meta time { font-family: var(--site-mono); color: var(--site-muted); }
.site-card h2, .site-card h3 { margin: 0; font-size: 16px; font-weight: 800; line-height: 1.65; }
.site-card h2 a, .site-card h3 a { text-decoration: none; }
.site-card p { font-size: 12px; color: var(--site-muted); margin: 10px 0 0; }
.site-terms { display: flex; flex-wrap: wrap; gap: 10px; }
.site-term-link { display: inline-flex; align-items: baseline; gap: 12px; border: 1px solid var(--site-line); padding: 10px 15px; font-size: 13px; text-decoration: none; }
.site-term-link small { color: var(--site-muted); font: 10px var(--site-mono); }
.site-archive-header { margin: 0 0 32px; padding-block: 10px 28px; border-bottom: 3px solid var(--site-ink); }
.site-archive-header h1 { margin: 12px 0; font-size: clamp(26px, 4vw, 42px); font-weight: 900; line-height: 1.5; letter-spacing: -.03em; }
.site-archive-header p, .site-archive-header .archive-description { max-width: 760px; margin: 12px 0 0; color: var(--site-muted); font-size: 14px; }
.site-data-table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 14px; line-height: 1.75; text-align: left; }
.site-data-table caption { padding-bottom: 16px; text-align: left; font-weight: 700; }
.site-data-table caption span { display: block; margin-top: 4px; color: var(--site-muted); font-size: 12px; font-weight: 400; }
.site-data-table th, .site-data-table td { padding: 10px 14px; border: 1px solid var(--site-line); vertical-align: top; overflow-wrap: anywhere; }
.site-data-table thead th { background: var(--site-ink); color: var(--site-paper); border-bottom: 2px solid var(--site-red); font: 700 12px/1.6 var(--site-mono); letter-spacing: .08em; }
.site-data-table tbody th { font-weight: 700; }
.site-data-table a { text-decoration: underline; text-underline-offset: .2em; }
.site-data-table tbody tr:nth-child(even), .site-data-table:not(.site-glossary) tbody tr:hover { background: var(--site-soft); }
.site-glossary-name, .site-glossary-english { width: 24%; }
.site-glossary tbody tr:has(.site-glossary-link) { cursor: pointer; }
.site-glossary .site-glossary-link { text-decoration: none; }
.site-glossary tbody tr:has(.site-glossary-link):hover { background: var(--site-line); }
.site-glossary-form label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 700; }
.site-glossary-form .site-search { width: min(460px, 100%); }
.site-glossary-form .site-search input, .site-glossary-form .site-search button { min-height: 44px; }
.site-glossary-status { margin: 12px 0 24px; color: var(--site-muted); font-size: 13px; }
.site-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 24px; color: var(--site-muted); font-size: 11px; }
.site-breadcrumb a { text-decoration: none; }
.site-breadcrumb span[aria-hidden] { color: #aaa; }
.site-pagination { margin-top: 48px; }
.site-pagination .nav-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.site-pagination .page-numbers { display: inline-grid; min-width: 44px; min-height: 44px; padding: 8px 14px; place-items: center; border: 1px solid var(--site-line); text-decoration: none; font: 12px/1.8 var(--site-mono); }
.site-pagination .current { color: white; background: var(--site-ink); border-color: var(--site-ink); }
.site-pagination a:hover { color: var(--site-ink); background: var(--site-soft); border-color: var(--site-line); }
.site-reading { max-width: 880px; margin-inline: auto; }
.site-reading.site-reading--wide { max-width: none; }
.site-entry-header { margin-bottom: 28px; }
.site-entry-header h1 { margin: 12px 0 20px; font-size: clamp(24px, 3.5vw, 36px); line-height: 1.6; letter-spacing: -.02em; }
.site-entry-meta { display: flex; gap: 20px; flex-wrap: wrap; font-size: 11px; color: var(--site-muted); margin-block: 16px 24px; }
.site-featured { margin-bottom: 28px; width: 100%; }
.entry-content { font-size: 16px; line-height: 2; }
.entry-content :where(p, ul, ol, blockquote, table, figure) { margin-block: 0 24px; }
:is(.entry-content, .entry-content > .djtube-content) > :is(.rll-youtube-player, iframe[src*="youtube.com/embed/"], iframe[src*="youtube-nocookie.com/embed/"]) { display: block; margin-block: 0 24px; }
.entry-content :where(h2, h3, h4) { line-height: 1.6; margin: 48px 0 20px; }
.entry-content :where(h2) { font-size: 24px; border-bottom: 2px solid var(--site-ink); padding-bottom: 12px; }
.entry-content :where(h3) { font-size: 20px; }
.entry-content :where(h4) { font-size: 17px; }
.entry-content :where(a) { text-decoration: underline; }
.entry-content :where(blockquote) { margin-inline: 0; padding: 16px 24px; border-left: 3px solid var(--site-line); color: var(--site-muted); }
.entry-content :where(table) { max-width: 100%; border-collapse: collapse; font-size: 14px; }
.entry-content :where(th, td) { padding: 10px 14px; border: 1px solid var(--site-line); }
.entry-content :where(pre) { max-width: 100%; overflow: auto; padding: 16px; background: var(--site-soft); }
.entry-content :where(input, textarea, select) { max-width: 100%; padding: 10px; border: 1px solid #aaa; background: white; color: black; }
.entry-content :where(input[type=submit], button) { padding: 12px 24px; border: 1px solid var(--site-ink); background: var(--site-ink); color: white; }
.entry-content :where(input[type=submit]:enabled:hover, button:enabled:hover) { background: var(--site-soft); color: var(--site-ink); }
.entry-content :where(.aligncenter) { display: block; margin-inline: auto; }
.entry-content :where(figcaption) { margin-top: 8px; font-size: 12px; color: var(--site-muted); }
.site-entry-footer { margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--site-line); }
.site-post-nav { margin-block: 40px; }
.site-post-nav .nav-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.site-post-nav .nav-previous { grid-column: 1; }
.site-post-nav .nav-next { grid-column: 2; }
.site-post-nav a { width: 100%; height: 100%; }
.site-empty { padding: 60px 0; }
.site-empty h1 { font-size: 30px; line-height: 1.5; }
.site-empty p { color: var(--site-muted); }
.site-footer { padding: 48px 0 24px; background: var(--site-ink); color: #fff; border-top: 4px solid var(--site-red); }
.site-footer-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 32px; padding-bottom: 36px; border-bottom: 1px solid #333; }
.site-footer-about { max-width: 600px; }
.site-footer-top > .site-button { flex-shrink: 0; }
.site-footer .site-brand { width: 90px; }
.site-footer-description { margin: 16px 0 0; color: #ccc; font-size: 13px; line-height: 1.9; }
.site-footer-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; padding-block: 24px; border-bottom: 1px solid #333; }
.site-footer-nav { min-width: 0; }
.site-footer-title { margin: 0 0 8px; font-size: 13px; font-weight: 800; line-height: 1.6; }
.site-footer-nav ul { list-style: none; margin: 0; padding: 0; }
.site-footer-nav li + li { border-top: 1px solid #252525; }
.site-footer-nav li a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 42px; padding: 9px 12px; color: #ddd; font-size: 13px; line-height: 1.6; text-decoration: none; overflow-wrap: anywhere; }
.site-footer-nav li a::after { content: ''; flex: 0 0 6px; width: 6px; height: 6px; margin-right: 4px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg); }
.site-footer-nav li a:hover, .site-footer-nav li a:focus-visible { color: #fff; background: #171717; }
.site-footer-nav .sub-menu { margin-left: 12px; padding-left: 12px; border-left: 1px solid #444; }
.site-social-links { display: flex; flex-wrap: wrap; gap: var(--dj-space-2, 8px); margin-top: 20px; }
.site-social-links a { display: inline-flex; align-items: center; justify-content: center; width: var(--dj-control-size, 44px); height: var(--dj-control-size, 44px); border: 1px solid #333; color: #ddd; text-decoration: none; transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease; }
.site-social-links a:hover, .site-social-links a:focus-visible { color: #fff; background: #171717; border-color: #666; }
.site-social-links svg { display: block; flex-shrink: 0; }
.site-footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 24px; }
.site-copyright, .site-footer-notice { margin: 0; color: #aaa; }
.site-copyright { font: 10px var(--site-mono); }
.site-footer-notice { font-size: 11px; }
/* Shared comment and native contact form controls. */
.site-form { font-size: 14px; line-height: 1.8; }
.site-form p { margin: 0 0 24px; }
.site-form label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 700; }
.site-form label + br { display: none; }
.site-form :where(input:not([type=hidden]):not([type=submit]):not([type=button]):not([type=reset]):not([type=checkbox]):not([type=radio]), textarea, select) { display: block; width: 100%; max-width: 100%; min-width: 0; min-height: 48px; margin-top: 8px; padding: 12px 14px; border: 1px solid #999; border-radius: 0; background: var(--site-paper); color: var(--site-ink); font-size: 16px; font-weight: 400; line-height: 1.6; box-shadow: none; }
.site-form textarea { min-height: 192px; resize: vertical; }
.site-form :where(input[type=checkbox], input[type=radio]) { width: 20px; height: 20px; margin: 3px 10px 0 0; padding: 0; vertical-align: top; accent-color: var(--site-ink); }
.site-form :where(input, textarea, select)[aria-invalid=true] { border-color: var(--site-red); border-left-width: 3px; }
.site-form :where(input, textarea, select, button):disabled { cursor: not-allowed; opacity: .55; }
.site-form :where(.comment-notes, .logged-in-as, .must-log-in) { color: var(--site-muted); font-size: 13px; line-height: 1.9; }
.site-form .required { color: var(--site-ink); font-weight: 700; }
.site-form input[type=text] { max-width: 240px; }
.site-form .comment-form-author input { max-width: 100%; }
.site-form .comment-form-cookies-consent { display: flex; align-items: flex-start; gap: 0; }
.site-form .comment-form-cookies-consent input { flex: none; }
.site-form .comment-form-cookies-consent label { margin: 0; font-size: 13px; font-weight: 400; }
.site-form .form-submit { margin-bottom: 0; }
.site-contact { max-width: 640px; margin: 40px auto; padding-top: 28px; border-top: 3px solid var(--site-ink); }
.site-contact .site-form input[type=text] { max-width: 100%; }
.site-form .site-form-actions { display: flex; justify-content: flex-end; }
.site-contact-submit { min-width: 120px; background: var(--site-ink); color: var(--site-paper); }
.site-contact-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.site-form-status { margin: 24px 0; padding: 16px 20px; border: 1px solid var(--site-line); border-left: 3px solid var(--site-ink); font-size: 14px; }
.site-form-status.is-error { border-left-color: var(--site-red); }
.site-contact-notice { color: var(--site-muted); font-size: 13px; }
.site-comments { margin-top: 48px; border-top: 3px solid var(--site-ink); padding-top: 28px; }
.site-comments h2 { margin: 0 0 24px; font-size: 22px; font-weight: 900; line-height: 1.6; }
.site-comments .comment-reply-title small { display: inline-block; margin-left: 16px; font-size: 12px; font-weight: 400; }
.site-comments .comment-list, .site-comments .children { list-style: none; margin: 0; padding: 0; }
.site-comments .children { margin-left: 20px; padding-left: 20px; border-left: 1px solid var(--site-line); }
.site-comments .comment-body { border-bottom: 1px solid var(--site-line); padding-block: 24px; font-size: 14px; }
.site-comments .comment-author { font-weight: 700; }
.site-comments .avatar { margin-right: 10px; border-radius: 50%; }
.site-comments .comment-metadata { margin-top: 8px; color: var(--site-muted); font-size: 12px; }
.site-comments .comment-content { margin-block: 16px; overflow-wrap: anywhere; }
.site-comments .comment-content > :last-child { margin-bottom: 0; }
.site-comments .comment-awaiting-moderation { padding-left: 12px; border-left: 3px solid var(--site-red); }
.site-comments .comment-list ~ .comment-respond { margin-top: 32px; }
.site-comments .navigation { margin-block: 24px; font-size: 13px; }
.site-comments .nav-links { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.site-comments .nav-links a, .site-comments .nav-links .page-numbers { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 1024px) {
  .site-layout { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .site-home-layout { grid-template-areas: 'daily' 'promotion' 'latest' 'discover'; }
  .site-home-layout--no-chart { grid-template-areas: 'promotion' 'latest' 'discover'; grid-template-rows: none; }
  .site-banner-stack { width: min(400px, 100%); margin-inline: auto; }
  .site-discover { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
}
@media (max-width: 900px) { .site-intro { grid-template-columns: minmax(0, 1fr) 260px; gap: 24px; } .site-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .site-header-search { width: 220px; } }
@media (max-width: 782px) { .admin-bar .site-header.is-scroll-aware { top: 46px; } }
@media (max-width: 600px) { .admin-bar .site-header.is-scroll-aware { top: 0; } }
@media (max-width: 640px) {
  .site-masthead { padding-block: 20px; gap: 12px; } .site-brand { width: 90px; } .site-tagline { font-size: 9px; letter-spacing: .03em; }
  .site-header-search { display: none; } .site-desktop-nav { display: none; } .site-nav-row { display: block; min-height: auto; }
  .site-mobile-menu { display: block; } .site-mobile-menu summary { padding-block: 14px; font: 700 12px var(--site-mono); } .site-mobile-menu summary::after { content: '+'; float: right; } .site-mobile-menu[open] summary::after { content: '−'; }
  .site-mobile-menu .site-nav ul { display: block; } .site-mobile-menu .site-nav a { border-top: 1px solid var(--site-line); padding-block: 12px; }
  .site-mobile-menu .site-nav .sub-menu { display: block; position: static; padding: 0 0 0 16px; border: 0; min-width: 0; } .site-mobile-menu .site-search { margin: 14px 0; width: 100%; }
  .site-main { padding-block: 24px 56px; } .site-intro { grid-template-columns: 1fr; gap: 24px; margin-bottom: 32px; padding-block: 4px 30px; }
  .site-intro h1 { font-size: 28px; } .site-intro p { font-size: 13px; }
  .site-chart-feature { gap: 8px; padding: 16px 20px; }
  .site-chart-feature strong { font-size: 20px; }
  .site-chart-feature .site-chart-label { font-size: 12px; }
  .site-post-nav .nav-links { grid-template-columns: minmax(0, 1fr); }
  .site-post-nav .nav-previous, .site-post-nav .nav-next { grid-column: 1; }
  .site-section { margin-block: 32px; } .site-section-heading { margin-bottom: 20px; } .site-section-heading h2 { font-size: 18px; }
  .site-discover { grid-template-columns: minmax(0, 1fr); }
  .site-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 16px; } .site-card { padding-bottom: 16px; }
  .site-card h2, .site-card h3 { font-size: 13px; line-height: 1.65; } .site-card p { display: none; } .site-card-meta { font-size: 9px; margin-block: 10px 6px; } .site-card-meta time { font-size: 9px; }
  .site-term-link { font-size: 12px; padding: 8px 12px; } .site-archive-header { padding-block: 4px 20px; } .site-archive-header h1 { font-size: 26px; }
  .site-breadcrumb { font-size: 10px; margin-bottom: 20px; } .entry-content { font-size: 15px; }
  .entry-content :where(h2) { font-size: 21px; } .entry-content :where(h3) { font-size: 18px; }
  .site-comments h2 { font-size: 20px; }
  .site-comments .children { margin-left: 10px; padding-left: 10px; }
  .site-comments .children .children { margin-left: 0; padding-left: 0; border-left: 0; }
  .site-contact { margin-block: 32px; padding-top: 24px; }
  .site-footer { padding-top: 32px; }
  .site-footer-top { flex-direction: column; gap: 24px; padding-bottom: 24px; }
  .site-footer-top > .site-button { align-self: flex-end; }
  .site-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 16px; padding-block: 24px; }
  .site-footer-info { grid-column: 1 / -1; }
  .site-footer-info > ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
  .site-footer-info > ul > li:nth-child(2) { border-top: 0; }
  .site-footer-bottom { flex-wrap: wrap; gap: 16px; }
}
@media (max-width: 600px) { .site-data-table { font-size: 13px; } .site-data-table th, .site-data-table td { padding: 10px 8px; } .site-data-table thead th { font-size: 12px; } }
@media (max-width: 359px) { .site-grid, .site-layout .site-grid { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }