/*
Theme Name: COOL+ Kuxinwen
Theme URI: https://kuxinwen.com/
Author: MEOW MEDIA
Description: Premium independent newsroom theme for COOL+ 酷新聞.
Version: 1.0.0
Text Domain: kuxinwen
*/

:root {
  --kx-ink: #071a33;
  --kx-ink-2: #102947;
  --kx-blue: #075bff;
  --kx-cyan: #19d5e8;
  --kx-red: #ef3f3f;
  --kx-paper: #f6f8fb;
  --kx-white: #fff;
  --kx-muted: #66758a;
  --kx-line: #dce3ec;
  --kx-serif: "Noto Serif TC", "Songti TC", serif;
  --kx-sans: "Noto Sans TC", "PingFang TC", system-ui, sans-serif;
  --kx-shadow: 0 24px 70px rgba(7, 26, 51, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--kx-ink); background: var(--kx-paper); font-family: var(--kx-sans); line-height: 1.7; }
body.is-menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
.kx-shell { width: min(1320px, calc(100% - 48px)); margin-inline: auto; }
.kx-skip { position: fixed; z-index: 999; top: 12px; left: 12px; transform: translateY(-180%); padding: 10px 16px; background: #fff; }
.kx-skip:focus { transform: none; }

.kx-utility { color: #c5d2e2; background: var(--kx-ink); font-size: 12px; letter-spacing: .06em; }
.kx-utility-inner { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.kx-utility strong { color: #fff; }
.kx-utility-nav { display: flex; gap: 22px; }
.kx-utility-nav a:hover { color: var(--kx-cyan); }
.kx-brandbar { background: rgba(255,255,255,.97); border-bottom: 1px solid var(--kx-line); }
.kx-brandbar-inner { min-height: 112px; display: grid; grid-template-columns: 300px 1fr auto; align-items: center; gap: 34px; }
.kx-logo img { width: 250px; max-height: 78px; object-fit: contain; object-position: left center; }
.kx-brand-note { max-width: 430px; color: var(--kx-muted); font-size: 14px; }
.kx-brand-note strong { display: block; color: var(--kx-ink); font-family: var(--kx-serif); font-size: 18px; }
.kx-header-actions { display: flex; align-items: center; gap: 10px; }
.kx-button { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; gap: 9px; padding: 0 20px; border: 1px solid var(--kx-ink); background: var(--kx-ink); color: #fff; font-weight: 700; transition: .22s ease; cursor: pointer; }
.kx-button:hover { transform: translateY(-2px); box-shadow: 0 10px 30px rgba(7,26,51,.17); }
.kx-button-blue { border-color: var(--kx-blue); background: var(--kx-blue); }
.kx-button-light { border-color: rgba(255,255,255,.32); background: #fff; color: var(--kx-ink); }
.kx-icon-button { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid var(--kx-line); background: #fff; cursor: pointer; }
.kx-menu-toggle { display: none; }
.kx-menu-toggle span { display: block; width: 20px; height: 2px; margin: 5px auto; background: currentColor; }
.kx-nav { position: sticky; z-index: 30; top: 0; color: #fff; background: var(--kx-ink); border-bottom: 3px solid var(--kx-blue); }
.kx-nav.is-scrolled { box-shadow: 0 12px 30px rgba(7,26,51,.2); }
.kx-nav-inner { min-height: 56px; display: flex; align-items: stretch; justify-content: space-between; }
.kx-nav-list { display: flex; align-items: stretch; margin: 0; padding: 0; list-style: none; }
.kx-nav-list a { min-width: 82px; height: 56px; display: grid; place-items: center; padding: 0 18px; font-weight: 700; letter-spacing: .04em; }
.kx-nav-list a:hover, .kx-nav-list .current-menu-item a { background: var(--kx-blue); }
.kx-nav-stamp { display: flex; align-items: center; gap: 9px; color: #b9c8dc; font-size: 12px; letter-spacing: .12em; }
.kx-nav-stamp::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--kx-red); box-shadow: 0 0 0 5px rgba(239,63,63,.15); animation: kx-pulse 1.8s infinite; }

.kx-search-panel { position: fixed; z-index: 90; inset: 0; display: grid; place-items: start center; padding-top: 140px; background: rgba(7,26,51,.92); opacity: 0; pointer-events: none; transition: .2s ease; }
.kx-search-panel.is-open { opacity: 1; pointer-events: auto; }
.kx-search-box { width: min(760px, calc(100% - 36px)); color: #fff; }
.kx-search-box form { display: flex; }
.kx-search-box input { width: 100%; min-height: 70px; padding: 0 24px; border: 0; outline: 0; font-size: 22px; }
.kx-search-box button { min-width: 110px; border: 0; background: var(--kx-cyan); color: var(--kx-ink); font-weight: 800; }
.kx-search-close { position: absolute; top: 30px; right: 34px; color: #fff; border: 0; background: none; font-size: 34px; cursor: pointer; }

.kx-breaking { background: #fff; border-bottom: 1px solid var(--kx-line); }
.kx-breaking-inner { min-height: 52px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 20px; }
.kx-breaking-label { padding: 6px 10px; color: #fff; background: var(--kx-red); font-size: 12px; font-weight: 800; letter-spacing: .12em; }
.kx-breaking-track { position: relative; min-height: 24px; overflow: hidden; }
.kx-breaking-item { position: absolute; inset: 0; display: flex; align-items: center; opacity: 0; transform: translateY(10px); transition: .35s ease; font-weight: 700; }
.kx-breaking-item.is-active { opacity: 1; transform: none; }
.kx-breaking time { color: var(--kx-muted); font-size: 12px; }

.kx-main, body.single-post main { overflow: hidden; }
.kx-hero { position: relative; padding: 52px 0 58px; background: radial-gradient(circle at 84% 10%, rgba(25,213,232,.16), transparent 25%), #f6f8fb; }
.kx-hero::after { content: "COOL+"; position: absolute; z-index: 0; right: -30px; top: -65px; color: rgba(7,91,255,.035); font-size: clamp(150px, 25vw, 360px); font-weight: 900; letter-spacing: -.1em; line-height: 1; pointer-events: none; }
.kx-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(260px,.75fr) minmax(280px,.72fr); gap: 22px; }
.kx-lead, .kx-side-story, .kx-live { background: #fff; border: 1px solid var(--kx-line); }
.kx-lead { min-height: 570px; display: flex; flex-direction: column; }
.kx-story-visual { position: relative; min-height: 330px; display: flex; align-items: flex-end; overflow: hidden; padding: 30px; color: #fff; background: linear-gradient(135deg, #091d37, #075bff 62%, #19d5e8); }
.kx-story-visual::before, .kx-card-visual::before { content: ""; position: absolute; inset: 0; opacity: .28; background-image: linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px); background-size: 34px 34px; }
.kx-story-visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.kx-story-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 40%, rgba(7,26,51,.82)); }
.kx-story-code { position: relative; z-index: 2; font-size: 12px; letter-spacing: .2em; }
.kx-lead-copy { padding: 28px 30px 32px; }
.kx-eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; color: var(--kx-blue); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.kx-eyebrow::before { content: ""; width: 28px; height: 2px; background: currentColor; }
.kx-lead h1 { max-width: 780px; margin: 0; font-family: var(--kx-serif); font-size: clamp(34px, 4.2vw, 61px); line-height: 1.16; letter-spacing: -.035em; }
.kx-lead p { color: var(--kx-muted); font-size: 16px; }
.kx-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; color: var(--kx-muted); font-size: 12px; }
.kx-meta span + span::before, .kx-meta time + span::before { content: "•"; margin-right: 12px; color: var(--kx-blue); }
.kx-side-column { display: grid; gap: 22px; }
.kx-side-story { min-height: 274px; display: flex; flex-direction: column; }
.kx-card-visual { position: relative; min-height: 116px; overflow: hidden; background: linear-gradient(145deg, #0d2746, #0870ff); }
.kx-card-visual.alt { background: linear-gradient(145deg, #102947, #1f6a71); }
.kx-card-visual img { width: 100%; height: 100%; min-height: 116px; object-fit: cover; }
.kx-side-copy { padding: 18px 20px 20px; }
.kx-side-story h2 { margin: 0 0 13px; font-family: var(--kx-serif); font-size: 23px; line-height: 1.35; }
.kx-live { min-height: 570px; padding: 24px; }
.kx-panel-title { display: flex; align-items: center; justify-content: space-between; padding-bottom: 14px; border-bottom: 3px solid var(--kx-ink); }
.kx-panel-title h2 { margin: 0; font-family: var(--kx-serif); font-size: 24px; }
.kx-panel-title span { color: var(--kx-red); font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.kx-live-list { list-style: none; margin: 0; padding: 0; }
.kx-live-list li { display: grid; grid-template-columns: 48px 1fr; gap: 12px; padding: 17px 0; border-bottom: 1px solid var(--kx-line); }
.kx-live-list time { color: var(--kx-blue); font-size: 12px; font-weight: 800; }
.kx-live-list a { font-family: var(--kx-serif); font-size: 16px; font-weight: 700; line-height: 1.45; }
.kx-live-list a:hover { color: var(--kx-blue); }

.kx-topics { padding: 18px 0; color: #fff; background: var(--kx-ink); }
.kx-topic-row { display: flex; align-items: center; gap: 12px; overflow-x: auto; scrollbar-width: none; }
.kx-topic-row::-webkit-scrollbar { display: none; }
.kx-topic-label { flex: none; color: var(--kx-cyan); font-size: 11px; font-weight: 900; letter-spacing: .15em; }
.kx-topic-chip { flex: none; padding: 6px 12px; border: 1px solid rgba(255,255,255,.22); border-radius: 99px; color: #dfe9f5; font-size: 13px; }
.kx-topic-chip:hover { border-color: var(--kx-cyan); color: var(--kx-cyan); }

.kx-mascot { --kx-mascot-x: 0px; --kx-mascot-y: 0px; --kx-glow-x: 18%; --kx-glow-y: 40%; position: relative; overflow: hidden; color: #fff; background: radial-gradient(circle at var(--kx-glow-x) var(--kx-glow-y), rgba(25,213,232,.25), transparent 25%), linear-gradient(120deg, #071a33, #0a3167 72%, #075bff); }
.kx-mascot::after { content: "LANLAN"; position: absolute; right: -20px; bottom: -74px; color: rgba(255,255,255,.045); font-size: clamp(110px, 18vw, 250px); font-weight: 900; letter-spacing: -.07em; line-height: 1; pointer-events: none; }
.kx-mascot-inner { position: relative; z-index: 1; min-height: 390px; display: grid; grid-template-columns: minmax(220px,.72fr) minmax(420px,1.35fr) minmax(230px,.62fr); align-items: center; gap: 54px; }
.kx-mascot-visual { align-self: end; height: 360px; display: flex; align-items: flex-end; justify-content: center; }
.kx-mascot-visual img { width: auto; height: 390px; max-width: none; filter: drop-shadow(0 24px 34px rgba(0,0,0,.23)); transform: translate3d(var(--kx-mascot-x), calc(18px + var(--kx-mascot-y)), 0); transition: transform .2s cubic-bezier(.2,.8,.2,1); animation: kx-lanlan-breathe 4.8s ease-in-out infinite; }
.kx-mascot-copy { padding: 58px 0; }
.kx-mascot-copy .kx-eyebrow { color: var(--kx-cyan); }
.kx-mascot-copy h2 { margin: 0 0 18px; font-family: var(--kx-serif); font-size: clamp(34px, 4vw, 58px); line-height: 1.18; letter-spacing: -.025em; }
.kx-mascot-copy > p:not(.kx-eyebrow) { max-width: 670px; margin: 0; color: #c9daed; font-size: 16px; }
.kx-mascot-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: 26px; }
.kx-mascot-link { color: #fff; border-bottom: 1px solid rgba(255,255,255,.55); font-size: 13px; font-weight: 800; }
.kx-mascot-link:hover { color: var(--kx-cyan); border-color: var(--kx-cyan); }
.kx-mascot-note { display: grid; gap: 12px; padding: 24px; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.07); backdrop-filter: blur(10px); }
.kx-mascot-note strong { color: var(--kx-cyan); font-size: 13px; letter-spacing: .08em; }
.kx-mascot-note span { position: relative; padding-left: 19px; color: #e4eef9; font-size: 13px; }
.kx-mascot-note span::before { content: ""; position: absolute; left: 0; top: .72em; width: 7px; height: 7px; border-radius: 50%; background: var(--kx-cyan); }

.kx-section { padding: 74px 0; }
.kx-section-white { background: #fff; }
.kx-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 28px; }
.kx-heading small { display: block; margin-bottom: 6px; color: var(--kx-blue); font-size: 11px; font-weight: 900; letter-spacing: .18em; }
.kx-heading h2 { margin: 0; font-family: var(--kx-serif); font-size: clamp(30px, 3.5vw, 48px); line-height: 1.2; }
.kx-heading p { max-width: 480px; margin: 0; color: var(--kx-muted); }
.kx-article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.kx-article-card { min-width: 0; background: #fff; border: 1px solid var(--kx-line); transition: .22s ease; }
.kx-article-card:hover { transform: translateY(-5px); box-shadow: var(--kx-shadow); }
.kx-article-card .kx-card-visual { min-height: 190px; }
.kx-article-body { padding: 22px; }
.kx-article-card h3 { margin: 10px 0 12px; font-family: var(--kx-serif); font-size: 24px; line-height: 1.35; }
.kx-article-card p { margin: 0 0 18px; color: var(--kx-muted); }
.kx-read { color: var(--kx-blue); font-size: 13px; font-weight: 800; }
.kx-category-layout { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(280px,.55fr); gap: 36px; }
.kx-stream { border-top: 3px solid var(--kx-ink); }
.kx-stream-item { display: grid; grid-template-columns: 130px 1fr; gap: 24px; padding: 24px 0; border-bottom: 1px solid var(--kx-line); }
.kx-stream-item .kx-card-visual { min-height: 94px; }
.kx-stream h3 { margin: 0 0 8px; font-family: var(--kx-serif); font-size: 22px; line-height: 1.4; }
.kx-stream p { margin: 0; color: var(--kx-muted); font-size: 14px; }
.kx-rank { color: #fff; background: var(--kx-ink); padding: 26px; }
.kx-rank ol { list-style: none; margin: 0; padding: 0; counter-reset: rank; }
.kx-rank li { counter-increment: rank; display: grid; grid-template-columns: 38px 1fr; gap: 12px; padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.14); }
.kx-rank li::before { content: "0" counter(rank); color: var(--kx-cyan); font-size: 12px; font-weight: 900; }
.kx-rank h2 { margin: 0 0 14px; font-family: var(--kx-serif); }
.kx-rank a { font-family: var(--kx-serif); font-weight: 700; }

.kx-submit-banner { position: relative; overflow: hidden; padding: 70px; color: #fff; background: linear-gradient(120deg, #071a33, #075bff 70%, #19d5e8); }
.kx-submit-banner::after { content: "+"; position: absolute; right: 4%; top: 50%; transform: translateY(-55%); color: rgba(255,255,255,.12); font-size: 280px; font-weight: 200; line-height: 1; }
.kx-submit-banner-inner { position: relative; z-index: 1; max-width: 790px; }
.kx-submit-banner h2 { margin: 0 0 16px; font-family: var(--kx-serif); font-size: clamp(38px, 5vw, 68px); line-height: 1.15; }
.kx-submit-banner p { max-width: 640px; color: #d5e4f5; }
.kx-process { display: flex; flex-wrap: wrap; gap: 9px; margin: 24px 0; }
.kx-process span { padding: 7px 11px; border: 1px solid rgba(255,255,255,.25); font-size: 12px; }

.kx-page-hero { padding: 64px 0; color: #fff; background: radial-gradient(circle at 80% 0, rgba(25,213,232,.22), transparent 30%), var(--kx-ink); }
.kx-page-hero .kx-eyebrow { color: var(--kx-cyan); }
.kx-page-hero h1 { max-width: 900px; margin: 0 0 18px; font-family: var(--kx-serif); font-size: clamp(42px, 7vw, 82px); line-height: 1.08; }
.kx-page-hero p { max-width: 760px; color: #c8d6e7; font-size: 18px; }
.kx-content-wrap { display: grid; grid-template-columns: minmax(0,780px) minmax(260px,1fr); gap: 70px; padding: 70px 0; }
.kx-article-content { min-width: 0; color: #24354b; font-size: 18px; }
.kx-article-content > figure:first-child { margin: 0 0 38px; overflow: hidden; border: 1px solid var(--kx-line); background: #071a33; box-shadow: var(--kx-shadow); }
.kx-article-content > figure:first-child img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.kx-article-content h2, .kx-article-content h3 { margin-top: 2em; color: var(--kx-ink); font-family: var(--kx-serif); line-height: 1.35; }
.kx-article-content h2 { font-size: 32px; }
.kx-article-content a { color: var(--kx-blue); text-decoration: underline; text-underline-offset: 3px; }
.kx-article-content blockquote { margin: 36px 0; padding: 22px 26px; border-left: 4px solid var(--kx-cyan); background: #edf4fb; font-family: var(--kx-serif); font-size: 21px; }
.kx-table-wrap { width: 100%; max-width: 100%; margin: 28px 0; overflow-x: auto; border: 1px solid var(--kx-line); background: #fff; -webkit-overflow-scrolling: touch; overscroll-behavior-inline: contain; touch-action: pan-x pan-y; }
.kx-article-content table { width: 100%; min-width: 560px; border-collapse: collapse; background: #fff; }
.kx-article-content th, .kx-article-content td { padding: 13px 15px; border-bottom: 1px solid var(--kx-line); text-align: left; vertical-align: top; }
.kx-article-content th { color: #fff; background: var(--kx-ink); white-space: nowrap; }
.kx-article-content tr:last-child td { border-bottom: 0; }
.kx-article-content iframe, .kx-article-content video, .kx-article-content pre { max-width: 100%; }
.kx-article-content pre { overflow-x: auto; }
.kx-article-aside { align-self: start; position: sticky; top: 86px; padding: 24px; border: 1px solid var(--kx-line); background: #fff; }
.kx-editorial-label { display: inline-block; margin-bottom: 14px; padding: 4px 8px; color: #fff; background: var(--kx-blue); font-size: 11px; font-weight: 900; }

.kx-form { padding: 32px; background: #fff; border: 1px solid var(--kx-line); box-shadow: var(--kx-shadow); }
.kx-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px; }
.kx-field { display: grid; gap: 8px; }
.kx-field-full { grid-column: 1 / -1; }
.kx-field label { font-weight: 800; }
.kx-field small { color: var(--kx-muted); }
.kx-field input, .kx-field select, .kx-field textarea { width: 100%; padding: 13px 14px; border: 1px solid #cbd5e2; background: #fff; outline: 0; }
.kx-field input:focus, .kx-field select:focus, .kx-field textarea:focus { border-color: var(--kx-blue); box-shadow: 0 0 0 3px rgba(7,91,255,.1); }
.kx-check { display: flex; align-items: start; gap: 10px; }
.kx-alert { margin-bottom: 20px; padding: 14px 16px; border-left: 4px solid var(--kx-red); background: #fff1f1; }
.kx-alert-success { border-color: #18a875; background: #eaf9f2; }
.kx-honeypot { position: absolute !important; left: -9999px !important; }

.kx-pagination { margin-top: 34px; }
.kx-pagination .page-numbers { display: inline-grid; place-items: center; min-width: 40px; min-height: 40px; margin-right: 6px; border: 1px solid var(--kx-line); background: #fff; }
.kx-pagination .current { color: #fff; border-color: var(--kx-blue); background: var(--kx-blue); }
.kx-empty { padding: 40px; border: 1px solid var(--kx-line); background: #fff; }

.kx-footer { color: #c2d0e1; background: #051426; }
.kx-footer-main { display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 50px; padding: 60px 0; }
.kx-footer-logo img { width: 225px; filter: brightness(0) invert(1); }
.kx-footer h3 { color: #fff; font-family: var(--kx-serif); }
.kx-footer a:hover { color: var(--kx-cyan); }
.kx-footer-links { display: grid; gap: 8px; }
.kx-footer-bottom { padding: 18px 0; border-top: 1px solid rgba(255,255,255,.12); color: #718198; font-size: 12px; }

.kx-reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s cubic-bezier(.2,.7,.2,1) var(--kx-reveal-delay, 0ms), transform .7s cubic-bezier(.2,.7,.2,1) var(--kx-reveal-delay, 0ms); }
.kx-reveal.is-visible { opacity: 1; transform: none; }
@keyframes kx-pulse { 50% { opacity: .35; } }
@keyframes kx-lanlan-breathe { 0%, 100% { filter: drop-shadow(0 24px 34px rgba(0,0,0,.23)); } 50% { filter: drop-shadow(0 31px 40px rgba(0,0,0,.3)); } }
.kx-reading-progress { position: fixed; z-index: 120; top: 0; left: 0; width: 100%; height: 4px; background: rgba(7,26,51,.08); pointer-events: none; }
.kx-reading-progress span { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, var(--kx-blue), var(--kx-cyan)); transform: scaleX(0); transform-origin: left center; will-change: transform; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } .kx-reveal { opacity: 1; transform: none; } .kx-reading-progress span { transition: none; } }

@media (max-width: 1080px) {
  .kx-brandbar-inner { grid-template-columns: 250px 1fr auto; }
  .kx-brand-note { display: none; }
  .kx-hero-grid { grid-template-columns: 1.35fr .75fr; }
  .kx-live { grid-column: 1 / -1; min-height: 0; }
  .kx-live-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 0 24px; }
  .kx-article-grid { grid-template-columns: repeat(2,1fr); }
  .kx-mascot-inner { grid-template-columns: 230px 1fr; gap: 34px; }
  .kx-mascot-note { display: none; }
}

@media (max-width: 780px) {
  .kx-shell { width: min(100% - 30px, 1320px); }
  .kx-utility-inner { min-height: 38px; }
  .kx-utility-motto { display: none; }
  .kx-utility-nav, .kx-nav-stamp, .kx-header-actions .kx-button { display: none; }
  .kx-brandbar-inner { min-height: 78px; grid-template-columns: 1fr auto; gap: 14px; }
  .kx-logo img { width: min(190px, 58vw); }
  .kx-menu-toggle { display: block; }
  .kx-nav { position: fixed; z-index: 80; inset: 116px 0 auto; max-height: calc(100dvh - 116px); overflow-y: auto; border: 0; transform: translateY(-130%); transition: .25s ease; }
  .kx-nav.is-open { transform: none; }
  .kx-nav-inner, .kx-nav-list { display: block; }
  .kx-nav-list a { min-width: 0; justify-content: start; border-bottom: 1px solid rgba(255,255,255,.12); }
  .kx-breaking-inner { grid-template-columns: auto 1fr; }
  .kx-breaking time { display: none; }
  .kx-hero { padding-top: 28px; }
  .kx-hero-grid, .kx-article-grid, .kx-category-layout, .kx-content-wrap, .kx-footer-main { grid-template-columns: 1fr; }
  .kx-lead { min-height: 0; }
  .kx-story-visual { min-height: 230px; }
  .kx-live { grid-column: auto; }
  .kx-live-list { display: block; }
  .kx-heading { align-items: start; flex-direction: column; }
  .kx-stream-item { grid-template-columns: 95px 1fr; gap: 15px; }
  .kx-submit-banner { padding: 42px 24px; }
  .kx-mascot-inner { min-height: 0; grid-template-columns: 1fr; gap: 0; text-align: center; }
  .kx-mascot-visual { order: 2; height: 260px; }
  .kx-mascot-visual img { height: 290px; transform: translate3d(0, 24px, 0); }
  .kx-mascot-copy { padding: 46px 0 0; }
  .kx-mascot-copy .kx-eyebrow, .kx-mascot-actions { justify-content: center; }
  .kx-mascot-copy > p:not(.kx-eyebrow) { margin-inline: auto; }
  .kx-page-hero { padding: 44px 0 46px; }
  .kx-page-hero h1 { margin-bottom: 16px; font-size: clamp(34px, 10.2vw, 42px); line-height: 1.12; overflow-wrap: anywhere; }
  .kx-page-hero p { font-size: 16px; line-height: 1.75; }
  .kx-page-hero .kx-meta { display: grid; gap: 3px; line-height: 1.5; }
  .kx-page-hero .kx-meta span::before { display: none; }
  .kx-content-wrap { gap: 28px; padding: 36px 0 50px; }
  .kx-article-content { font-size: 17px; line-height: 1.82; overflow-wrap: anywhere; }
  .kx-article-content > figure:first-child { margin-bottom: 30px; border-radius: 10px; box-shadow: 0 15px 38px rgba(7,26,51,.11); }
  .kx-article-content h2 { font-size: 27px; line-height: 1.38; }
  .kx-article-content h3 { font-size: 22px; }
  .kx-article-content blockquote { margin: 28px 0; padding: 18px 20px; font-size: 18px; }
  .kx-article-content table { font-size: 15px; }
  .kx-article-aside { position: static; padding: 22px; }
  .kx-article-aside .kx-button { width: 100%; }
  .kx-form { padding: 22px; }
  .kx-form-grid { grid-template-columns: 1fr; }
  .kx-field-full { grid-column: auto; }
}

@media (max-width: 430px) {
  .kx-shell { width: min(100% - 24px, 1320px); }
  .kx-page-hero h1 { font-size: clamp(32px, 9.6vw, 38px); }
  .kx-icon-button { width: 44px; height: 44px; }
}