/* ==========================================================================
   nagoyadev — console-style editorial theme
   Chrome (header/footer/overlays) is always dark; the content area follows
   body.theme-{dark|white|paper|mist|auto}. Values come from the Claude Design
   "Console" direction.
   ========================================================================== */

:root {
	--chrome-bg: #121412;
	--chrome-surface: #171a17;
	--chrome-line: #2a2e2a;
	--chrome-ink: #e6e8e3;
	--chrome-muted: #9aa096;
	--chrome-faint: #6f766b;
	--lime: #b6e35a;
	--amber: #e3c35a;
	--accentBg: #b6e35a;
	--prBg: #e3c35a;
	--font-sans: 'IBM Plex Sans JP', -apple-system, BlinkMacSystemFont, 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Noto Sans JP', 'Yu Gothic UI', Meiryo, sans-serif;
	--font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace;
	--font-head: 'Zen Kaku Gothic New', 'IBM Plex Sans JP', 'Hiragino Sans', 'Noto Sans JP', sans-serif;
	--max: 1280px;
	--pad: clamp(16px, 4vw, 32px);
	/* content palette: dark (default) */
	--bg: #121412; --surface: #171a17; --ph1: #1a1d1a; --ph2: #151815; --line: #2a2e2a; --line2: #3a3f3a;
	--ink: #e6e8e3; --ink2: #b8bdb3; --muted: #9aa096; --faint: #6f766b; --accent: #b6e35a; --codebg: #1f231f; --pr: #e3c35a;
}
body.theme-white { --bg: #ffffff; --surface: #f4f6f2; --ph1: #edf0ea; --ph2: #f6f8f4; --line: #e2e6df; --line2: #cfd4cb; --ink: #121412; --ink2: #33372f; --muted: #575d53; --faint: #7f857b; --accent: #3f6a00; --codebg: #edf3df; --pr: #8a6a00; }
body.theme-paper { --bg: #f5f3ec; --surface: #ebe8de; --ph1: #e7e3d8; --ph2: #efece4; --line: #dcd8cc; --line2: #c9c4b6; --ink: #161814; --ink2: #3b3e37; --muted: #5a5e55; --faint: #7d8176; --accent: #4a7300; --codebg: #e4ead3; --pr: #8a6a00; }
body.theme-mist { --bg: #e9eeeb; --surface: #ffffff; --ph1: #dde4e0; --ph2: #e5ebe7; --line: #d0d8d3; --line2: #b9c3bd; --ink: #0f1712; --ink2: #2f3a33; --muted: #526059; --faint: #7a8680; --accent: #2f6400; --codebg: #dfe8d6; --pr: #7d6000; }
@media (prefers-color-scheme: light) {
	body.theme-auto { --bg: #ffffff; --surface: #f4f6f2; --ph1: #edf0ea; --ph2: #f6f8f4; --line: #e2e6df; --line2: #cfd4cb; --ink: #121412; --ink2: #33372f; --muted: #575d53; --faint: #7f857b; --accent: #3f6a00; --codebg: #edf3df; --pr: #8a6a00; }
}

/* ---- base ---------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--chrome-bg); color: var(--chrome-ink); font-family: var(--font-sans); font-size: 15px; line-height: 1.8; -webkit-font-smoothing: antialiased; overflow-wrap: anywhere; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--accent); }
img { max-width: 100%; height: auto; display: block; }
button { font: inherit; }
::selection { background: #b6e35a; color: #121412; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); margin: -1px; padding: 0; border: 0; word-wrap: normal !important; }
.screen-reader-text:focus { clip: auto; clip-path: none; width: auto; height: auto; left: 8px; top: 8px; padding: 8px 12px; background: var(--lime); color: #121412; z-index: 100; font-family: var(--font-mono); }
.nd-wrap { max-width: var(--max); margin: 0 auto; padding-left: var(--pad); padding-right: var(--pad); }
.nd-content { background: var(--bg); color: var(--ink); }
.nd-main { max-width: var(--max); margin: 0 auto; padding: 28px var(--pad); }
.nd-main--narrow { max-width: 760px; padding-top: 48px; padding-bottom: 48px; }
.nd-main--search { max-width: 960px; padding-top: 40px; }
.nd-kicker { font-family: var(--font-mono); font-size: 13px; color: var(--muted); margin-bottom: 8px; }
.nd-kicker--accent { color: var(--accent); font-size: 12px; }
.nd-kicker--faint { color: var(--chrome-faint); font-size: 11px; padding: 8px 0; margin: 0; }
.nd-box { border: 1px solid var(--line); }
.nd-box--pad { padding: 16px 18px; }
.nd-box__head { padding: 10px 16px; border-bottom: 1px solid var(--line); font-family: var(--font-mono); font-size: 12px; color: var(--muted); }
.nd-ph { background: repeating-linear-gradient(135deg, var(--ph1) 0 10px, var(--ph2) 10px 20px); display: grid; place-items: center; font-family: var(--font-mono); font-size: 12px; color: var(--faint); width: 100%; }
.nd-imgbox { width: 100%; overflow: hidden; background: var(--ph1); }
.nd-imgbox .nd-img { width: 100%; height: 100%; object-fit: cover; }
.nd-btn { display: inline-block; background: var(--accentBg); color: #121412; padding: 8px 18px; font-family: var(--font-mono); font-size: 13px; font-weight: 700; border: 1px solid var(--accentBg); cursor: pointer; }
.nd-btn:hover { color: #121412; filter: brightness(1.05); }
.nd-btn--ghost { background: transparent; color: var(--ink); border-color: var(--line2); }
.nd-btn--ghost:hover { color: var(--accent); border-color: var(--accent); }

/* ---- header --------------------------------------------------------------- */
.nd-header { border-bottom: 1px solid var(--chrome-line); background: var(--chrome-bg); position: relative; z-index: 6; }
.nd-header__bar { padding-top: 8px; padding-bottom: 8px; min-height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; }
.nd-header__left { display: flex; align-items: center; gap: clamp(12px, 2.5vw, 36px); min-width: 0; }
.nd-header__right { display: flex; gap: 8px; align-items: center; flex-shrink: 0; font-family: var(--font-mono); font-size: 12px; }
.nd-logo { font-family: var(--font-mono); font-weight: 700; font-size: clamp(18px, 1.6vw, 20px); color: var(--chrome-ink); white-space: nowrap; }
.nd-logo:hover { color: var(--chrome-ink); }
.nd-logo__a, .nd-logo__cursor { color: var(--lime); }
.nd-logo__cursor { animation: nd-blink 1.2s steps(1) infinite; }
@keyframes nd-blink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .nd-logo__cursor { animation: none; } }
.nd-nav { display: flex; gap: 2px; font-family: var(--font-mono); font-size: clamp(12px, 1.1vw, 13px); color: var(--chrome-muted); }
.nd-nav a { padding: 4px clamp(6px, .8vw, 10px); white-space: nowrap; }
.nd-nav a:hover { color: var(--lime); }
.nd-nav a.is-active { color: #121412; background: var(--lime); }
.nd-iconbtn { border: 1px solid var(--chrome-line); background: none; color: var(--chrome-ink); width: 30px; height: 30px; display: grid; place-items: center; font-size: 16px; cursor: pointer; padding: 0; line-height: 1; }
.nd-iconbtn:hover { border-color: var(--lime); color: var(--lime); }
.nd-subscribe-btn { background: var(--lime); color: #121412; padding: 0 12px; height: 30px; display: flex; align-items: center; font-weight: 700; white-space: nowrap; }
.nd-subscribe-btn:hover { color: #121412; }
.nd-burger { display: none; border: 1px solid var(--chrome-line); background: none; width: 30px; height: 30px; flex-direction: column; align-items: center; justify-content: center; gap: 4px; cursor: pointer; padding: 0; }
.nd-burger span { display: block; width: 16px; height: 2px; background: var(--chrome-ink); transition: transform .2s, opacity .2s; }
.nd-burger[aria-expanded="true"] { border-color: var(--lime); }
.nd-burger[aria-expanded="true"] span { background: var(--lime); }
.nd-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nd-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nd-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.nd-mobile { position: absolute; left: 0; right: 0; top: 100%; background: var(--chrome-bg); border-bottom: 1px solid var(--chrome-line); box-shadow: 0 20px 40px rgba(0, 0, 0, .5); }
.nd-mobile[hidden] { display: none; }
.nd-mobile .nd-wrap { padding-top: 8px; padding-bottom: 20px; font-family: var(--font-mono); }
.nd-mobile__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1px; background: var(--chrome-line); border: 1px solid var(--chrome-line); }
.nd-mobile__grid a { background: var(--chrome-bg); padding: 14px 16px; font-size: 14px; display: flex; justify-content: space-between; color: var(--chrome-ink); }
.nd-mobile__grid a:hover, .nd-mobile__grid a.is-active { color: var(--lime); }
.nd-mobile__arrow { color: var(--chrome-faint); }
@media (max-width: 899px) { .nd-nav { display: none; } .nd-burger { display: flex; } }
@media (min-width: 900px) { .nd-mobile { display: none !important; } }

/* ---- search overlay ------------------------------------------------------- */
.nd-search { position: fixed; inset: 0; z-index: 20; background: rgba(8, 10, 8, .78); display: flex; justify-content: center; align-items: flex-start; padding: 12vh 16px 16px; }
.nd-search[hidden] { display: none; }
.nd-search__dialog { width: 100%; max-width: 640px; background: var(--chrome-bg); color: var(--chrome-ink); border: 1px solid var(--lime); box-shadow: 0 30px 80px rgba(0, 0, 0, .6); font-family: var(--font-mono); }
.nd-search__form { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--chrome-line); font-size: clamp(15px, 2.5vw, 18px); margin: 0; }
.nd-search__prompt { color: var(--lime); white-space: nowrap; }
.nd-search__input { flex: 1; min-width: 0; background: transparent; border: 0; outline: 0; color: var(--chrome-ink); font: inherit; font-family: var(--font-sans); }
.nd-search__input::placeholder { color: var(--chrome-faint); }
.nd-search__esc { font-size: 11px; color: var(--chrome-faint); border: 1px solid var(--chrome-line); background: none; padding: 0 6px; cursor: pointer; font-family: var(--font-mono); }
.nd-search__body { padding: 14px 18px 18px; }
.nd-search__body .nd-kicker--faint { padding: 0; margin-bottom: 8px; }
.nd-search__body .nd-chip { color: var(--chrome-muted); border-color: var(--chrome-line); }
.nd-search__body .nd-chip:hover { color: var(--lime); border-color: var(--lime); }
.nd-search__foot { display: flex; justify-content: space-between; padding: 8px 18px; border-top: 1px solid var(--chrome-line); font-size: 11px; color: var(--chrome-faint); }

/* ---- chips / meta ---------------------------------------------------------- */
.nd-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.nd-chip { font-family: var(--font-mono); font-size: 12.5px; border: 1px solid var(--line); color: var(--muted); padding: 3px 12px; white-space: nowrap; }
.nd-chip:hover { color: var(--accent); border-color: var(--accent); }
.nd-chip.is-active { border-color: var(--accent); color: var(--accent); }
.nd-chip--tag { font-size: 12px; padding: 1px 8px; }
.nd-chip--static { font-size: 11px; padding: 0 6px; }
.nd-filters { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 28px; }
.nd-meta { display: flex; gap: 10px; flex-wrap: wrap; font-family: var(--font-mono); font-size: 12px; align-items: baseline; }
.nd-meta--sm { font-size: 11.5px; }
.nd-meta__dot { color: var(--faint); margin: 0 -4px; }
.nd-meta__cat { color: var(--accent); }
.nd-meta__faint { color: var(--faint); }
.nd-meta__muted { color: var(--muted); }
.nd-kind { font-weight: 700; }
.nd-kind--news { color: var(--muted); }
.nd-kind--guide { color: var(--accent); }
.nd-kind--feature { color: var(--ink); }
.nd-kind--pr { color: var(--pr); }
.nd-badge { background: var(--accentBg); color: #121412; padding: 0 8px; font-weight: 700; }
.nd-crumbs { font-family: var(--font-mono); font-size: 12px; color: var(--faint); margin-bottom: 24px; }
.nd-crumbs a:hover { color: var(--accent); }
.nd-crumb__cur { color: var(--muted); }

/* ---- home ------------------------------------------------------------------ */
.nd-hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.nd-hero__main { grid-column: 1 / -1; background: var(--bg); padding: clamp(16px, 3vw, 24px); display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.nd-hero__main:hover { color: inherit; }
.nd-hero__main .nd-meta { color: var(--accent); }
.nd-hero__main .nd-meta__faint, .nd-hero__main .nd-kind { color: var(--accent); }
.nd-hero__title { margin: 0; font-family: var(--font-head); font-weight: 900; font-size: clamp(24px, 2.6vw, 34px); line-height: 1.4; text-wrap: pretty; }
.nd-hero__main:hover .nd-hero__title { color: var(--accent); }
.nd-hero__excerpt { margin: 0; color: var(--muted); text-wrap: pretty; }
.nd-hero__by { font-family: var(--font-mono); font-size: 12px; color: var(--muted); }
/* Newest article has no screenshot: centre the text and give the title and excerpt the room the image would take. */
.nd-hero__main--text { justify-content: center; gap: 16px; }
.nd-hero__main--text .nd-hero__title { font-size: clamp(26px, 3vw, 38px); }
.nd-hero__main--points { justify-content: flex-start; }
.nd-hero__points { border-top: 1px solid var(--line); padding-top: 16px; margin-top: auto; display: flex; flex-direction: column; gap: 10px; }
.nd-hero__pointshead { font-family: var(--font-mono); font-size: 12px; color: var(--accent); }
.nd-hero__points ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.nd-hero__points li { position: relative; padding-left: 18px; color: var(--ink2); font-size: 14.5px; line-height: 1.7; }
.nd-hero__points li::before { content: ">"; position: absolute; left: 0; color: var(--accent); font-family: var(--font-mono); }
@media (max-width: 639px) { .nd-hero__points li:nth-child(n+4) { display: none; } }
@media (min-width: 640px) { .nd-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .nd-hero { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); } .nd-hero__main { grid-column: auto; grid-row: span 2; } }
.nd-gcard { background: var(--bg); padding: 20px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.nd-gcard:hover { color: inherit; }
.nd-gcard__top { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 11.5px; }
.nd-gcard__cat { color: var(--accent); }
.nd-gcard__mins { color: var(--faint); }
.nd-gcard__title { font-family: var(--font-head); font-weight: 700; font-size: 16px; line-height: 1.55; flex: 1; }
.nd-gcard:hover .nd-gcard__title { color: var(--accent); }
.nd-gcard__badge { font-family: var(--font-mono); font-size: 11px; color: var(--muted); border: 1px solid var(--line); align-self: flex-start; padding: 0 6px; }
.nd-home2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 28px; margin-top: 28px; }
.nd-home2__main { grid-column: 1 / -2; min-width: 0; }
.nd-home2__side { display: flex; flex-direction: column; gap: 20px; }
.nd-secthead { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; }
.nd-secthead .nd-kicker { margin: 0; }
.nd-secthead__more { font-family: var(--font-mono); font-size: 13px; color: var(--accent); }
.nd-logrow { display: flex; flex-wrap: wrap; column-gap: 16px; row-gap: 2px; padding: 12px clamp(12px, 3vw, 18px); border-bottom: 1px solid var(--line); align-items: baseline; }
.nd-log .nd-logrow:last-child { border-bottom: 0; }
.nd-logrow:hover { color: inherit; }
.nd-logrow:hover .nd-logrow__title { color: var(--accent); }
.nd-logrow__time { font-family: var(--font-mono); font-size: 12px; color: var(--faint); flex: 0 0 44px; }
.nd-logrow__tag { font-family: var(--font-mono); font-size: 11.5px; color: var(--accent); flex: 0 0 96px; }
.nd-logrow__tag--muted { color: var(--muted); }
.nd-logrow__title { font-weight: 500; flex: 1 1 300px; min-width: 0; }
.nd-logrow--pr { background: var(--surface); }
.nd-logrow__pr { font-family: var(--font-mono); font-size: 11px; color: #121412; background: var(--prBg); text-align: center; font-weight: 700; flex: 0 0 44px; }
.nd-logrow__sponsor { color: var(--faint); font-size: 12px; }
.nd-cats { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 28px; }
.nd-cats__box { background: var(--bg); padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.nd-cats__head { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 13px; color: var(--accent); font-weight: 700; }
.nd-cats__arrow { color: var(--faint); font-weight: 400; }
.nd-cats__item { font-weight: 500; font-size: 14.5px; line-height: 1.6; padding-top: 10px; border-top: 1px solid var(--line); }
.nd-cats__item--empty { color: var(--faint); font-family: var(--font-mono); font-size: 12px; }
.nd-topics { margin-top: 28px; }
.nd-topics .nd-cats { margin-top: 0; }

/* ---- ads / sidebar ----------------------------------------------------------- */
/* An ad fills its slot: the column's full width at every viewport, and on the home page the full height beside the
   latest-articles list. The slot is a size container so the card can switch to a banner row when the slot is wide. */
.nd-ad { display: flex; flex-direction: column; container-type: inline-size; }
.nd-home2__side > .nd-ad { flex: 1 1 auto; }
/* Home: the label row takes the list's section-header height (13px kicker × body line-height 1.8, + 8px) so the card's
   top edge lines up with the list box. */
.nd-home2__side .nd-ad__label { line-height: calc(13px * 1.8); margin-bottom: 8px; }
.nd-ad__label { font-family: var(--font-mono); font-size: 10px; color: var(--faint); margin-bottom: 4px; }
.nd-ad__ph { flex: 1 1 auto; min-height: 250px; background: repeating-linear-gradient(135deg, var(--ph1) 0 8px, var(--ph2) 8px 16px); border: 1px solid var(--line); display: grid; place-items: center; font-family: var(--font-mono); font-size: 12px; color: var(--faint); }
/* Column flex: pasted ad code (e.g. a responsive <ins>) gets the slot's full width instead of shrinking to its content. */
.nd-ad__body { display: flex; flex-direction: column; flex: 1 1 auto; }
/* Ad card markup saved in Settings → nagoya.dev → 広告枠 (.nd-adb). A fixed dark card so it reads the same on every content palette.
   It is text, not an IAB image, so it takes the slot's size: full width, at least 250px tall; when the slot is taller
   (home), the text block sits centred between the logo row and the button row. */
.nd-adb { display: flex; flex-direction: column; flex: 1 1 auto; box-sizing: border-box; min-height: 250px; padding: 16px 18px; background: #101319; color: #fff; border: 1px solid #2a2f39; font-family: var(--font-sans); text-decoration: none; transition: border-color .15s; }
.nd-adb:hover, .nd-adb:focus-visible { color: #fff; border-color: #67aaed; }
.nd-adb__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 14px; }
.nd-adb__logo { display: block; height: 15px; width: auto; }
.nd-adb__tag { font-family: var(--font-mono); font-size: 10px; line-height: 1; color: #9aa0ac; border: 1px solid #3a3f49; padding: 3px 6px; }
.nd-adb__name { margin-top: auto; font-family: var(--font-head); font-size: 27px; font-weight: 700; line-height: 1.15; letter-spacing: -.01em; }
.nd-adb__lead { margin-top: 4px; font-size: 14px; font-weight: 700; line-height: 1.5; color: #86c3ff; }
.nd-adb__copy { margin-top: 6px; font-size: 12px; line-height: 1.65; color: #c6c9d0; }
.nd-adb__foot { margin-top: auto; padding-top: 14px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.nd-adb__cta { background: #2b7ec9; color: #fff; font-family: var(--font-mono); font-size: 12px; font-weight: 700; line-height: 1; padding: 9px 12px; white-space: nowrap; transition: background .15s; }
.nd-adb:hover .nd-adb__cta { background: #3d8fd8; }
.nd-adb__url { font-family: var(--font-mono); font-size: 10px; color: #636873; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Wide slot (the guide column stacks under the article below 1100px): one banner row, text left and button right,
   instead of a 250px-tall box that is mostly empty. */
@container (min-width: 520px) {
	.nd-adb { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "top top" "name foot" "lead foot" "copy foot"; align-content: center; column-gap: 32px; min-height: 0; padding: 18px 24px; }
	.nd-adb__top { grid-area: top; }
	.nd-adb__name { grid-area: name; margin-top: 0; }
	.nd-adb__lead { grid-area: lead; }
	.nd-adb__copy { grid-area: copy; }
	.nd-adb__foot { grid-area: foot; align-self: center; margin-top: 0; padding-top: 0; flex-direction: column; align-items: flex-end; }
}
.nd-aside { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.nd-ranking__row { display: grid; grid-template-columns: 28px 1fr; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.nd-ranking__row:last-child { border-bottom: 0; }
.nd-ranking__row:hover { color: inherit; }
.nd-ranking__row:hover .nd-ranking__title { color: var(--accent); }
.nd-ranking__n { font-family: var(--font-mono); font-weight: 700; color: var(--accent); }
.nd-ranking__title { font-size: 14px; font-weight: 500; line-height: 1.6; }
.nd-subbox { border: 1px solid var(--accent); padding: 20px; display: flex; flex-direction: column; gap: 10px; position: sticky; top: 24px; }
.nd-subbox .nd-kicker { margin: 0; }
.nd-subbox__title { font-family: var(--font-head); font-weight: 900; font-size: 18px; line-height: 1.5; }

/* ---- newsletter forms --------------------------------------------------------- */
.nd-nl { margin: 0; position: relative; }
.nd-nl__hp { position: absolute; left: -9999px; top: 0; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.nd-nl__row { display: flex; font-family: var(--font-mono); font-size: 13px; max-width: 100%; }
.nd-nl__input { border: 1px solid var(--line2); padding: 10px 14px; flex: 1 1 200px; width: 300px; min-width: 0; background: transparent; color: var(--ink); font: inherit; font-family: var(--font-mono); font-size: 13px; border-radius: 0; }
.nd-nl__input::placeholder { color: var(--faint); }
.nd-nl__input:focus { outline: 1px solid var(--accent); outline-offset: -1px; }
.nd-nl__btn { background: var(--accentBg); color: #121412; padding: 10px 20px; font-weight: 700; border: 0; cursor: pointer; font-family: var(--font-mono); font-size: 13px; white-space: nowrap; }
.nd-nl__msg { font-family: var(--font-mono); font-size: 12px; color: var(--accent); margin: 8px 0 0; }
.nd-nl--band { flex: 0 1 420px; }
.nd-nl--box .nd-nl__row { flex-direction: column; gap: 8px; }
.nd-nl--box .nd-nl__btn { flex: 0 0 auto; }
.nd-nl--box .nd-nl__input { flex: 0 0 auto; width: 100%; padding: 8px 12px; font-size: 12px; }
.nd-nl--box .nd-nl__btn { padding: 8px; text-align: center; }
.nd-band { border-top: 1px solid var(--line); margin-top: 28px; }
.nd-band__inner { padding-top: 36px; padding-bottom: 36px; display: flex; justify-content: space-between; align-items: center; gap: 32px; flex-wrap: wrap; }
.nd-band__inner .nd-kicker { margin-bottom: 4px; }
.nd-band__title { font-family: var(--font-head); font-weight: 900; font-size: 24px; line-height: 1.4; }

/* ---- footer ---------------------------------------------------------------------- */
.nd-footer { border-top: 1px solid var(--chrome-line); background: var(--chrome-bg); color: var(--chrome-muted); font-size: 13px; }
.nd-footer__grid { padding-top: 32px; padding-bottom: 32px; display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 24px; }
.nd-footer__brand { display: flex; flex-direction: column; gap: 8px; }
.nd-footer__logo { font-family: var(--font-mono); font-weight: 700; color: var(--chrome-ink); font-size: 16px; }
.nd-footer__tagline { font-size: 12px; }
.nd-footer__col { display: flex; flex-direction: column; gap: 4px; }
.nd-footer__col a:hover { color: var(--lime); }
.nd-footer__head { font-family: var(--font-mono); color: var(--chrome-faint); font-size: 11px; }
.nd-footer__bottom { padding-top: 14px; padding-bottom: 14px; border-top: 1px solid var(--chrome-line); display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; font-family: var(--font-mono); font-size: 11.5px; color: var(--chrome-faint); }
.nd-footer__legal a:hover { color: var(--lime); }

/* ---- listings -------------------------------------------------------------------- */
.nd-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 40px; }
.nd-cols__main { grid-column: 1 / -2; min-width: 0; }
.nd-cols--article { gap: 48px; }
.nd-ahead { border-bottom: 1px solid var(--line); padding-bottom: 24px; margin-bottom: 24px; display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.nd-ahead__text { max-width: 720px; }
.nd-ahead .nd-kicker { margin-bottom: 0; }
.nd-ahead__title { margin: 6px 0 8px; font-family: var(--font-mono); font-weight: 700; font-size: clamp(30px, 4vw, 48px); line-height: 1.2; letter-spacing: -.02em; }
.nd-ahead__desc { margin: 0; color: var(--muted); text-wrap: pretty; }
.nd-ahead__count { font-family: var(--font-mono); font-size: 13px; color: var(--muted); }
.nd-featured { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; padding-bottom: 28px; margin-bottom: 8px; border-bottom: 1px solid var(--line); }
.nd-featured:hover { color: inherit; }
.nd-featured:hover .nd-featured__title { color: var(--accent); }
.nd-featured__text { display: flex; flex-direction: column; gap: 10px; justify-content: center; }
.nd-featured__text .nd-kicker { margin: 0; }
.nd-featured__title { margin: 0; font-family: var(--font-head); font-weight: 900; font-size: 24px; line-height: 1.45; }
.nd-featured__excerpt { color: var(--muted); font-size: 14px; }
.nd-group { font-family: var(--font-mono); font-size: 12px; color: var(--accent); padding: 20px 0 4px; border-bottom: 1px solid var(--accent); }
.nd-item__link { display: grid; grid-template-columns: minmax(0, 1fr) clamp(96px, 20vw, 176px); gap: clamp(14px, 3vw, 24px); padding: 20px 0; border-bottom: 1px solid var(--line); align-items: start; }
.nd-item__link:hover { color: inherit; }
.nd-item__link:hover .nd-item__title { color: var(--accent); }
.nd-item__text { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.nd-item__title { margin: 0; font-family: var(--font-head); font-weight: 700; font-size: clamp(16px, 2vw, 18px); line-height: 1.55; }
.nd-item__excerpt { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.nd-item .nd-imgbox { border: 1px solid var(--line); }
.nd-item .nd-ph { border: 1px solid var(--line); }
.nd-item__link--text { grid-template-columns: minmax(0, 1fr); }
.nd-pagination { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; margin-top: 32px; font-family: var(--font-mono); font-size: 13px; }
.nd-pagination .nd-chip { padding: 4px 12px; color: var(--ink); }
.nd-pagination .nd-chip.current { background: var(--accentBg); color: #121412; font-weight: 700; border-color: var(--accentBg); }
.nd-pagination .nd-chip.dots { border: 0; padding: 4px 8px; color: var(--faint); }
.nd-pagination .prev, .nd-pagination .next { color: var(--muted); }
.nd-empty { padding: 48px 0; font-family: var(--font-mono); color: var(--muted); display: flex; flex-direction: column; gap: 12px; }
.nd-empty--pad { padding: 32px 18px; }
.nd-empty__err { color: var(--pr); }
.nd-empty__hint { font-size: 13px; }
.nd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.nd-card { background: var(--bg); padding: 20px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.nd-card:hover { color: inherit; }
.nd-card:hover .nd-card__title { color: var(--accent); }
.nd-card__title { font-family: var(--font-head); font-weight: 700; font-size: 16px; line-height: 1.55; }

/* ---- author page --------------------------------------------------------------------- */
.nd-profile { border: 1px solid var(--line); background: var(--surface); padding: clamp(20px, 4vw, 32px); display: flex; flex-wrap: wrap; gap: 24px 32px; align-items: flex-start; margin-bottom: 36px; }
.nd-profile__img { width: clamp(80px, 15vw, 120px); height: clamp(80px, 15vw, 120px); flex-shrink: 0; object-fit: cover; background: var(--ph1); }
.nd-profile__text { display: flex; flex-direction: column; gap: 8px; flex: 1 1 320px; min-width: 0; }
.nd-profile__text .nd-kicker { margin: 0; font-size: 13px; }
.nd-profile__name { margin: 0; font-family: var(--font-head); font-weight: 900; font-size: 32px; line-height: 1.3; }
.nd-profile__role { font-size: 14px; color: var(--muted); }
.nd-profile__bio { margin: 6px 0 0; max-width: 640px; color: var(--ink2); font-size: 14.5px; text-wrap: pretty; }
.nd-profile__dl { margin: 0; display: grid; grid-template-columns: auto auto; gap: 4px 16px; font-family: var(--font-mono); font-size: 12.5px; align-content: start; }
.nd-profile__dl dt { color: var(--faint); }
.nd-profile__dl dd { margin: 0; text-align: right; }
.nd-profile__dl dd a { color: var(--accent); }

/* ---- search page ---------------------------------------------------------------------- */
.nd-grep { border: 1px solid var(--accent); display: flex; align-items: center; gap: 12px; padding: 14px clamp(12px, 3vw, 18px); font-family: var(--font-mono); font-size: clamp(15px, 2.5vw, 18px); margin: 0; }
.nd-grep__prompt { color: var(--accent); white-space: nowrap; }
.nd-grep__input { flex: 1; background: transparent; border: 0; outline: 0; color: var(--ink); font: inherit; font-family: var(--font-sans); min-width: 0; }
.nd-grep__esc { font-size: 12px; color: var(--faint); }
.nd-grep__meta { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 18px 0 8px; font-family: var(--font-mono); font-size: 12.5px; }
.nd-grep__meta .nd-filters { margin: 0; }
.nd-grep__count { color: var(--muted); }
.nd-result { display: flex; flex-direction: column; gap: 6px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.nd-result:hover { color: inherit; }
.nd-result:hover .nd-result__title { color: var(--accent); }
.nd-result__title { font-family: var(--font-head); font-weight: 700; font-size: 18px; line-height: 1.55; }
.nd-result__excerpt { color: var(--muted); font-size: 14px; }
mark { background: var(--accentBg); color: #121412; padding: 0 2px; }

/* ---- article ---------------------------------------------------------------------------- */
.nd-article { grid-column: 1 / -2; max-width: 760px; min-width: 0; }
.nd-article__title { margin: 14px 0 18px; font-family: var(--font-head); font-weight: 900; font-size: clamp(26px, 3vw, 38px); line-height: 1.45; text-wrap: pretty; }
.nd-article__lead { margin: 0 0 24px; font-size: 17px; color: var(--ink2); text-wrap: pretty; }
.nd-prnote { margin: 0 0 16px; font-size: 12.5px; color: var(--pr); font-family: var(--font-mono); }
.nd-authorrow { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.nd-authorrow--guide { margin-top: 32px; }
.nd-author { display: flex; align-items: center; gap: 12px; padding: 14px 0; }
.nd-author:hover { color: inherit; }
.nd-author:hover b { color: var(--accent); }
.nd-author__img { width: 36px; height: 36px; object-fit: cover; background: repeating-linear-gradient(135deg, var(--line) 0 4px, var(--ph1) 4px 8px); flex-shrink: 0; }
.nd-author__text { display: flex; flex-direction: column; line-height: 1.4; }
.nd-author__text b { font-size: 14px; }
.nd-author__sub { font-family: var(--font-mono); font-size: 12px; color: var(--muted); }
.nd-figure { margin: 28px 0 28px; }
.nd-figure--guide { margin: 0 0 8px; }
.nd-figure__cap { font-size: 12px; color: var(--faint); margin-top: 8px; }
.nd-figure__cap a { color: var(--muted); border-bottom: 1px solid var(--line2); }
.nd-updated { font-family: var(--font-mono); font-size: 12px; color: var(--faint); margin-top: 24px; }
.nd-tags { margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--line); gap: 8px; }
.nd-tags .nd-chip { padding: 2px 10px; }
.nd-related { margin-top: 36px; }
.nd-related__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.nd-related__item { background: var(--bg); padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.nd-related__item:hover { color: inherit; }
.nd-related__item:hover .nd-related__title { color: var(--accent); }
.nd-related__cat { font-family: var(--font-mono); font-size: 11px; color: var(--accent); }
.nd-related__title { font-weight: 700; font-size: 14.5px; line-height: 1.6; }

/* ---- article body (core blocks) ------------------------------------------------------------ */
.nd-body { font-size: 16.5px; line-height: 2; }
.nd-body--guide { font-size: 16px; }
.nd-body > * { margin-top: 0; margin-bottom: 22px; }
.nd-body > *:last-child { margin-bottom: 0; }
.nd-body p { text-wrap: pretty; }
.nd-body a:not(.nd-btn) { color: var(--accent); border-bottom: 1px solid var(--accent); }
.nd-body h2 { margin: 30px 0 18px; font-family: var(--font-head); font-weight: 900; font-size: 24px; line-height: 1.5; scroll-margin-top: 24px; }
.nd-body h2::before { content: "## "; color: var(--accent); font-family: var(--font-mono); font-weight: 700; }
.nd-body--guide { counter-reset: nd-step; }
.nd-body--guide h2:not(.is-unnumbered) { counter-increment: nd-step; }
.nd-body--guide h2:not(.is-unnumbered)::before { content: counter(nd-step, decimal-leading-zero) " "; }
.nd-body--guide h2.is-unnumbered::before { content: "## "; color: var(--faint); }
.nd-body h3 { margin: 26px 0 12px; font-family: var(--font-head); font-weight: 700; font-size: 19px; line-height: 1.5; scroll-margin-top: 24px; }
.nd-body h3::before { content: "### "; color: var(--faint); font-family: var(--font-mono); font-size: 14px; font-weight: 500; }
.nd-body h4 { margin: 22px 0 10px; font-family: var(--font-head); font-weight: 700; font-size: 16.5px; }
.nd-body ul, .nd-body ol { padding-left: 1.6em; }
.nd-body li { margin: 4px 0; }
.nd-body li::marker { color: var(--accent); font-family: var(--font-mono); }
.nd-body strong { font-weight: 700; }
.nd-body code { font-family: var(--font-mono); font-size: .86em; background: var(--codebg); padding: 1px 6px; color: var(--accent); }
.nd-body pre code { background: none; padding: 0; color: inherit; font-size: inherit; }
.nd-body blockquote, .nd-body .wp-block-quote { margin: 0; border-left: 3px solid var(--accent); padding: 4px 0 4px 20px; font-family: var(--font-head); font-weight: 700; font-size: 19px; line-height: 1.7; }
.nd-body .wp-block-quote p { margin: 0; }
.nd-body .wp-block-quote cite { display: block; font-family: var(--font-sans); font-weight: 400; font-size: 13px; color: var(--muted); margin-top: 6px; font-style: normal; }
.nd-body figure { margin-left: 0; margin-right: 0; }
.nd-body .wp-block-image img { width: 100%; border: 1px solid var(--line); }
.nd-body figcaption { font-size: 12.5px; color: var(--faint); margin-top: 8px; text-align: left; }
.nd-body hr { border: 0; border-top: 1px solid var(--line); margin: 32px 0; }
.nd-body .nd-table { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.nd-body table { border-collapse: collapse; width: 100%; font-size: 14.5px; line-height: 1.7; }
.nd-body th, .nd-body td { border: 1px solid var(--line); padding: 8px 12px; text-align: left; vertical-align: top; }
.nd-body th { background: var(--surface); font-family: var(--font-mono); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.nd-body .wp-block-table figcaption { font-size: 12.5px; }
.nd-summary, .nd-prereq { border: 1px solid var(--line); padding: 18px 20px; }
.nd-summary h3, .nd-prereq__label { font-family: var(--font-mono); font-size: 12px; color: var(--accent); margin: 0 0 6px; font-weight: 400; }
.nd-summary h3::before { content: "// "; }
.nd-summary ul { margin: 0; padding-left: 1.3em; font-size: 14.5px; line-height: 1.9; color: var(--ink2); }
.nd-summary p { margin: 0; font-size: 14.5px; line-height: 1.9; color: var(--ink2); }
.nd-prereq { margin-bottom: 22px; }
.nd-prereq__body { font-size: 14.5px; line-height: 1.9; color: var(--ink2); }
.nd-note { border: 1px solid var(--pr); padding: 14px 18px; font-size: 14.5px; line-height: 1.9; }
.nd-note::before { content: "⚠ NOTE "; font-family: var(--font-mono); color: var(--pr); font-weight: 700; }
.nd-body .is-style-nd-lead { font-size: 17px; color: var(--ink2); }
.nd-body .wp-block-embed { max-width: 100%; }
.nd-body .wp-block-embed iframe { max-width: 100%; }
.nd-body .wp-block-embed__wrapper { position: relative; }
.nd-body .wp-embed-responsive .wp-has-aspect-ratio iframe { position: absolute; inset: 0; width: 100%; height: 100%; }
.nd-body .wp-block-buttons a { color: #121412; border: 0; }

/* code box (rendered by the core plugin) */
.nd-code { border: 1px solid #2a2e2a; background: #0d0f0d; color: #e6e8e3; max-width: 100%; }
.nd-code__bar { display: flex; justify-content: space-between; align-items: center; padding: 6px 14px; border-bottom: 1px solid #2a2e2a; font-family: var(--font-mono); font-size: 11.5px; color: #9aa096; }
.nd-code__copy { background: none; border: 0; color: #9aa096; font-family: var(--font-mono); font-size: 11.5px; cursor: pointer; padding: 0; }
.nd-code__copy:hover { color: #b6e35a; }
.nd-code__copy.is-done { color: #b6e35a; }
.nd-code pre { margin: 0; padding: 16px; font-family: var(--font-mono); font-size: 13px; line-height: 1.7; overflow-x: auto; color: #e6e8e3; background: none; border: 0; white-space: pre; tab-size: 2; }
.nd-code .tok-k { color: #c792ea; }
.nd-code .tok-s { color: #c3e88d; }
.nd-code .tok-n { color: #f78c6c; }
.nd-code .tok-t { color: #89ddff; }
.nd-code .tok-c { color: #6f766b; }
.nd-code .tok-p { color: #6f766b; }
.nd-body .wp-block-code:not(.nd-code pre) { background: #0d0f0d; color: #e6e8e3; border: 1px solid #2a2e2a; padding: 16px; font-family: var(--font-mono); font-size: 13px; overflow-x: auto; }
.nd-body .wp-block-preformatted { font-family: var(--font-mono); font-size: 13px; background: var(--codebg); padding: 12px 16px; overflow-x: auto; }

/* ---- guide ---------------------------------------------------------------------------------- */
.nd-progress { height: 2px; background: var(--line); position: sticky; top: 0; z-index: 4; }
.nd-progress__bar { width: 0; height: 2px; background: var(--accentBg); transition: width .1s linear; }
.nd-ghead { border: 1px solid var(--line); padding: clamp(20px, 4vw, 32px); margin-bottom: 36px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 32px; background: var(--surface); }
.nd-ghead__text { grid-column: 1 / -2; min-width: 0; }
.nd-ghead__title { margin: 14px 0 12px; font-family: var(--font-head); font-weight: 900; font-size: clamp(26px, 3vw, 36px); line-height: 1.45; text-wrap: pretty; }
.nd-ghead__lead { margin: 0; color: var(--ink2); }
.nd-ghead__dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 6px 18px; font-family: var(--font-mono); font-size: 12.5px; align-content: start; }
.nd-ghead__dl dt { color: var(--faint); }
.nd-ghead__dl dd { margin: 0; }
.nd-ghead__author { color: var(--accent); }
.nd-glayout { display: flex; flex-wrap: wrap; gap: 48px; align-items: flex-start; }
.nd-toc { position: sticky; top: 24px; font-size: 13.5px; flex: 1 1 200px; max-width: 240px; }
.nd-toc .nd-kicker { font-size: 12px; margin-bottom: 10px; }
.nd-toc__list { display: flex; flex-direction: column; border-left: 1px solid var(--line); }
.nd-toc__list a { padding: 6px 0 6px 14px; margin-left: -1px; border-left: 2px solid transparent; color: var(--muted); line-height: 1.5; }
.nd-toc__list a.is-passed { color: var(--ink); }
.nd-toc__list a.is-active { color: var(--accent); border-left-color: var(--accent); }
.nd-toc__list a:hover { color: var(--accent); }
.nd-garticle { flex: 100 1 480px; max-width: 720px; min-width: 0; }
.nd-gaside { display: flex; flex-direction: column; gap: 20px; flex: 1 1 260px; max-width: 300px; }
.nd-prevnext { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 32px; }
.nd-prevnext a, .nd-prevnext__empty { background: var(--bg); padding: 16px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nd-prevnext a:hover { color: inherit; }
.nd-prevnext a:hover .nd-prevnext__title { color: var(--accent); }
.nd-prevnext__next { text-align: right; }
.nd-prevnext__label { font-family: var(--font-mono); font-size: 11px; color: var(--faint); }
.nd-prevnext__title { font-weight: 700; font-size: 14px; line-height: 1.5; }
@media (max-width: 1099px) { .nd-toc { position: static; max-width: none; flex-basis: 100%; } .nd-gaside { max-width: none; flex-basis: 100%; } }

/* ---- messages (404, newsletter) ----------------------------------------------------------------- */
.nd-message { border: 1px solid var(--line); padding: clamp(24px, 5vw, 48px); background: var(--surface); }
.nd-message__title { margin: 8px 0 12px; font-family: var(--font-head); font-weight: 900; font-size: clamp(22px, 3vw, 30px); line-height: 1.4; }
.nd-message__actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 20px; }

/* ---- small screens ------------------------------------------------------------------------------ */
@media (max-width: 640px) {
	.nd-main { padding-top: 20px; }
	.nd-logrow__tag { flex-basis: auto; }
	.nd-logrow__time { flex-basis: 38px; }
	.nd-body { font-size: 16px; line-height: 1.95; }
	.nd-body h2 { font-size: 21px; }
	.nd-band__inner { padding-top: 28px; padding-bottom: 28px; }
	.nd-band__title { font-size: 20px; }
	.nd-ghead__title { font-size: 24px; }
	.nd-prevnext { grid-template-columns: 1fr; }
	.nd-prevnext__next { text-align: left; }
}
@media print {
	.nd-header, .nd-footer, .nd-band, .nd-aside, .nd-gaside, .nd-search, .nd-progress, .nd-ad { display: none !important; }
	body, .nd-content { background: #fff; color: #000; }
}