:root {
  --gvc-bg: #101713;
  --gvc-panel: #15231b;
  --gvc-panel-2: #0d1f17;
  --gvc-border: rgba(129, 212, 168, .26);
  --gvc-text: #f2f8f4;
  --gvc-muted: #a8c2b3;
  --gvc-green: #39da91;
  --gvc-green-2: #18b974;
  --gvc-warm: #e6cb86;
  --gvc-shadow: 0 22px 70px rgba(0, 0, 0, .26);
}

.gaki-video-page, .gaki-video-page *, .gaki-video-center-home, .gaki-video-center-home * { box-sizing: border-box; }
.gaki-video-page { margin: 0; background: var(--gvc-bg); color: var(--gvc-text); font-family: Inter, "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif; color-scheme: dark; }
.gaki-video-page a { color: inherit; }
.gaki-video-page img, .gaki-video-page video, .gaki-video-center-home img, .gaki-video-center-home video { max-width: 100%; }
.gaki-video-skip { position: fixed; left: 1rem; top: -5rem; z-index: 100; padding: .75rem 1rem; border-radius: 999px; background: var(--gvc-green); color: #062015; font-weight: 800; }
.gaki-video-skip:focus { top: 1rem; }

.gaki-video-site-header { min-height: 86px; padding: 14px max(24px, calc((100vw - 1480px) / 2)); display: grid; grid-template-columns: minmax(280px, 1fr) auto auto; gap: 26px; align-items: center; border-bottom: 1px solid var(--gvc-border); background: rgba(8, 25, 18, .96); position: sticky; top: 0; z-index: 30; backdrop-filter: blur(16px); }
.gaki-video-brand { display: grid; grid-template-columns: 54px auto; grid-template-rows: auto auto; column-gap: 14px; align-items: center; text-decoration: none; }
.gaki-video-brand > span { grid-row: 1 / 3; width: 54px; height: 54px; border-radius: 18px; display: grid; place-items: center; background: linear-gradient(145deg, #48de99, #1da767); color: #052519; font-size: 1.2rem; font-weight: 900; }
.gaki-video-brand strong { align-self: end; font-size: 1.05rem; letter-spacing: .02em; }
.gaki-video-brand small { color: var(--gvc-muted); white-space: nowrap; }
.gaki-video-site-header nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; }
.gaki-video-site-header nav a, .gaki-video-account a { padding: .72rem .82rem; border-radius: 999px; color: #c7d9cf; text-decoration: none; font-size: .94rem; }
.gaki-video-site-header nav a:hover, .gaki-video-site-header nav a[aria-current="page"], .gaki-video-account a:hover { background: rgba(57, 218, 145, .12); color: #7bf1b7; }
.gaki-video-account { display: flex; gap: 6px; }
.gaki-video-account a:last-child { border: 1px solid var(--gvc-border); }

.gaki-video-kicker { margin: 0 0 .55rem; color: #72e8ac; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; font-size: .82rem; }
.gaki-video-section-head { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 1.35rem; }
.gaki-video-section-head h2 { margin: 0; font-size: clamp(1.85rem, 4vw, 3.1rem); letter-spacing: -.04em; }
.gaki-video-section-head p:not(.gaki-video-kicker) { max-width: 780px; margin: .65rem 0 0; color: var(--gvc-muted); line-height: 1.8; }
.gaki-video-section-head > a { flex: 0 0 auto; text-decoration: none; color: #7eeeb7; font-weight: 800; }

.gaki-video-center-home { position: relative; isolation: isolate; overflow: hidden; }
.gaki-video-center-home::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(circle at 85% 15%, rgba(38, 192, 120, .18), transparent 34%), linear-gradient(140deg, rgba(129, 212, 168, .055), transparent 52%); pointer-events: none; }
.gaki-video-center-home .gaki-video-feature-card { margin-top: .5rem; }
.gaki-video-home-note { margin: 1rem 0 0; padding-top: 1rem; border-top: 1px solid var(--gvc-border); color: var(--gvc-muted); font-size: .92rem; line-height: 1.65; }

.gaki-video-feature-card { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(310px, .85fr); gap: 0; overflow: hidden; border: 1px solid var(--gvc-border); border-radius: 28px; background: linear-gradient(145deg, rgba(19, 48, 34, .98), rgba(10, 30, 22, .98)); box-shadow: var(--gvc-shadow); }
.gaki-video-player-wrap { background: #020604; min-height: 100%; display: grid; align-items: center; }
.gaki-video-player-wrap video { display: block; width: 100%; aspect-ratio: 16 / 9; background: #020604; }
.gaki-video-copy { padding: clamp(24px, 4vw, 48px); display: flex; flex-direction: column; justify-content: center; }
.gaki-video-copy h3 { margin: 0 0 .9rem; font-size: clamp(1.7rem, 3vw, 2.7rem); line-height: 1.15; letter-spacing: -.035em; }
.gaki-video-copy > p:not(.gaki-video-kicker) { margin: 0; color: #bed2c7; line-height: 1.82; }
.gaki-video-copy ul { display: grid; gap: .55rem; margin: 1.25rem 0; padding: 0; list-style: none; color: #d9e9e0; }
.gaki-video-copy li { position: relative; padding-left: 1.4rem; }
.gaki-video-copy li::before { content: ""; position: absolute; left: .1rem; top: .55rem; width: .52rem; height: .52rem; border-radius: 50%; background: var(--gvc-green); box-shadow: 0 0 0 5px rgba(57, 218, 145, .1); }
.gaki-video-card-actions, .gaki-video-article-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.35rem; }
.gaki-video-card-actions a, .gaki-video-article-actions a { padding: .82rem 1.15rem; border: 1px solid var(--gvc-border); border-radius: 999px; text-decoration: none; font-weight: 800; }
.gaki-video-card-actions a.primary, .gaki-video-article-actions a.primary { background: linear-gradient(135deg, #48e1a0, #1ec57c); color: #052117; border-color: transparent; }

.gaki-video-index-page, .gaki-video-article-page { width: min(1480px, calc(100% - 48px)); margin: 0 auto; }
.gaki-video-index-hero { padding: clamp(70px, 9vw, 132px) 0 clamp(52px, 7vw, 90px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, .5fr); gap: 2rem; align-items: end; }
.gaki-video-index-hero h1 { grid-column: 1; margin: 0; max-width: 900px; font-size: clamp(3.2rem, 9vw, 8.5rem); line-height: .9; letter-spacing: -.075em; }
.gaki-video-index-hero > p:not(.gaki-video-kicker) { grid-column: 1; max-width: 800px; margin: 1.5rem 0 0; color: var(--gvc-muted); font-size: clamp(1.05rem, 2vw, 1.35rem); line-height: 1.8; }
.gaki-video-series-stats { grid-column: 2; grid-row: 1 / 4; display: grid; gap: .75rem; }
.gaki-video-series-stats span { display: flex; justify-content: space-between; align-items: baseline; padding: 1.1rem 1.2rem; border: 1px solid var(--gvc-border); border-radius: 18px; color: var(--gvc-muted); }
.gaki-video-series-stats b { color: var(--gvc-text); font-size: 1.6rem; }
.gaki-video-index-content { padding: 0 0 80px; }
.gaki-video-roadmap { padding: clamp(50px, 8vw, 96px) 0 120px; border-top: 1px solid var(--gvc-border); }
.gaki-video-roadmap h2 { margin: 0 0 2rem; font-size: clamp(2rem, 4vw, 3.4rem); }
.gaki-video-roadmap > div { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.gaki-video-roadmap article { min-height: 190px; padding: 1.45rem; border: 1px solid var(--gvc-border); border-radius: 22px; background: var(--gvc-panel); }
.gaki-video-roadmap article span { color: #74eab0; font-weight: 850; }
.gaki-video-roadmap article p { margin-top: 3.5rem; color: var(--gvc-muted); line-height: 1.7; }

.gaki-video-article-hero { padding: clamp(65px, 8vw, 118px) 0 50px; border-bottom: 1px solid var(--gvc-border); }
.gaki-video-article-hero h1 { max-width: 1120px; margin: 0; font-size: clamp(2.7rem, 7vw, 6.3rem); line-height: 1; letter-spacing: -.065em; }
.gaki-video-deck { max-width: 900px; margin: 1.3rem 0 0; color: var(--gvc-muted); font-size: clamp(1.05rem, 2vw, 1.35rem); line-height: 1.8; }
.gaki-video-meta { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.5rem; }
.gaki-video-meta span { padding: .55rem .78rem; border: 1px solid var(--gvc-border); border-radius: 999px; color: #b8d1c3; font-size: .85rem; }
.gaki-video-editor-note { max-width: 980px; margin: 42px auto; padding: 1.25rem 1.4rem; border: 1px solid rgba(230, 203, 134, .36); border-radius: 20px; background: rgba(230, 203, 134, .075); }
.gaki-video-editor-note strong { color: var(--gvc-warm); }
.gaki-video-editor-note p { margin: .45rem 0 0; color: #d7d2be; line-height: 1.75; }
.gaki-video-article-body { width: min(980px, 100%); margin: 0 auto; padding: 0 0 110px; }
.gaki-video-article-body > h1 { margin: 4rem 0 1.15rem; font-size: clamp(1.9rem, 4vw, 3rem); line-height: 1.2; letter-spacing: -.035em; }
.gaki-video-article-body > h2 { margin: 2.3rem 0 .75rem; color: #cfe6d9; font-size: 1.35rem; }
.gaki-video-article-body > p { margin: .9rem 0; color: #c8d9cf; font-size: 1.05rem; line-height: 1.92; }
.gaki-video-article-body > p > img { display: block; width: 100%; margin: 2.3rem auto .75rem; border: 1px solid var(--gvc-border); border-radius: 22px; background: #eaf3ed; }
.gaki-video-article-body table { width: 100%; border-collapse: collapse; margin: 1.7rem 0; overflow: hidden; border: 1px solid var(--gvc-border); border-radius: 18px; display: table; }
.gaki-video-article-body th, .gaki-video-article-body td { padding: .9rem 1rem; border: 1px solid var(--gvc-border); text-align: left; vertical-align: top; color: #c9dbd0; line-height: 1.65; }
.gaki-video-article-body th { background: rgba(57, 218, 145, .09); color: #e7f6ed; }
.gaki-video-article-body a { color: #73e9ad; text-underline-offset: .2em; }
.gaki-video-copyright-note { margin-top: 4rem; padding: 1.5rem; border: 1px solid var(--gvc-border); border-radius: 22px; background: var(--gvc-panel); }
.gaki-video-copyright-note h2 { margin: 0 0 .65rem; }
.gaki-video-copyright-note p { color: var(--gvc-muted); line-height: 1.75; }

.gaki-video-site-footer { padding: 42px max(24px, calc((100vw - 1480px) / 2)); display: flex; justify-content: space-between; gap: 2rem; border-top: 1px solid var(--gvc-border); background: #081912; }
.gaki-video-site-footer > div { display: grid; grid-template-columns: 42px auto; column-gap: .8rem; align-items: center; }
.gaki-video-site-footer > div > span { grid-row: 1 / 3; width: 42px; height: 42px; border-radius: 14px; display: grid; place-items: center; background: var(--gvc-green); color: #052117; font-weight: 900; }
.gaki-video-site-footer p { margin: 0; color: var(--gvc-muted); }
.gaki-video-site-footer nav { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.gaki-video-site-footer nav a { color: #bed0c6; text-decoration: none; }

@media (max-width: 1050px) {
  .gaki-video-site-header { grid-template-columns: 1fr auto; }
  .gaki-video-site-header nav { grid-column: 1 / -1; justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding-bottom: .25rem; }
  .gaki-video-site-header nav a { white-space: nowrap; }
  .gaki-video-feature-card { grid-template-columns: 1fr; }
  .gaki-video-index-hero { grid-template-columns: 1fr; }
  .gaki-video-series-stats { grid-column: 1; grid-row: auto; grid-template-columns: repeat(3, 1fr); }
  .gaki-video-roadmap > div { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 680px) {
  .gaki-video-site-header { min-height: auto; padding: 12px 16px; gap: 12px; }
  .gaki-video-brand { grid-template-columns: 44px auto; column-gap: 10px; }
  .gaki-video-brand > span { width: 44px; height: 44px; border-radius: 14px; }
  .gaki-video-brand small { display: none; }
  .gaki-video-account a:first-child { display: none; }
  .gaki-video-site-header nav { margin: 0 -4px; }
  .gaki-video-site-header nav a { padding: .55rem .65rem; font-size: .86rem; }
  .gaki-video-index-page, .gaki-video-article-page { width: min(100% - 28px, 1480px); }
  .gaki-video-section-head { align-items: flex-start; flex-direction: column; gap: .75rem; }
  .gaki-video-feature-card { border-radius: 20px; }
  .gaki-video-copy { padding: 22px 18px 24px; }
  .gaki-video-copy h3 { font-size: 1.8rem; }
  .gaki-video-series-stats { grid-template-columns: 1fr; }
  .gaki-video-roadmap > div { grid-template-columns: 1fr; }
  .gaki-video-roadmap article { min-height: 150px; }
  .gaki-video-roadmap article p { margin-top: 2rem; }
  .gaki-video-article-body { overflow-wrap: anywhere; }
  .gaki-video-article-body table { display: block; overflow-x: auto; white-space: normal; }
  .gaki-video-site-footer { padding: 34px 18px; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .gaki-video-page { scroll-behavior: auto; }
}
