@media screen {
  /* Keep the selected-projects section on the same page surface as its neighbours. */
  body.matrix-world main > #projects { background:#070708!important; }
  body.matrix-world.theme-light main > #projects { background:#f1f2f4!important; }
  /* Keep the animated code above the page background and behind every reading panel. */
  body.matrix-world .matrix-world-canvas { display:block!important; z-index:1; }
  body.matrix-world .matrix-neo { z-index:3; }
  body.cv-reading-layout .hero-with-cover::before {
    background:linear-gradient(90deg,#07090daf 0%,#080a0d73 38%,#080a0d33 70%,#080a0d14 100%),
               linear-gradient(0deg,#08090db3 0%,transparent 48%);
  }
  body.matrix-world.cv-reading-layout.theme-light main { background:#f1f2f4!important; }
  body.matrix-world.cv-reading-layout:not(.theme-light) main { background:#09090b!important; }
  body.matrix-world.cv-reading-layout main > .section.container,
  body.matrix-world.cv-reading-layout main > .section > .container { box-shadow:none!important; }
  /* A visible, text-labelled language choice in both themes. */
  .hero .lang-switch { display:flex; align-items:center; gap:7px; }
  .hero .lang-switch a,.hero .lang-switch strong {
    display:inline-flex!important; align-items:center; gap:6px; width:auto!important; height:auto!important;
    padding:8px 11px!important; margin:0!important; background-image:none!important;
    font:600 12px/1.2 ui-sans-serif,system-ui,sans-serif!important;
    border:1px solid #cbd5d355!important; border-radius:7px!important;
    text-decoration:none; white-space:nowrap;
  }
  .hero .lang-switch a[lang],.hero .lang-switch strong[lang] { background-image:none!important; background-size:auto!important; }
  .hero .lang-switch img { display:block; width:21px; height:15px; object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px #0003; }
  .hero .lang-switch strong { background:#86ddc4!important; color:#0d2824!important; border-color:#86ddc4!important; box-shadow:0 0 0 2px #86ddc433; }
  .hero .lang-switch strong::after { content:'✓'; font-size:13px; }
  .hero .lang-switch a { background:#071719bb!important; color:#f0f7f4!important; }
  .hero .lang-switch a:hover,.hero .lang-switch a:focus-visible { border-color:#86ddc4!important; background:#17322d!important; }

  /* The top menu must remain readable when the page is in its light theme. */
  body.cv-reading-layout.theme-light > .cv-section-nav { background:#f8faf9f7!important; border-color:#cbd7d2!important; color:#1d3030!important; }
  body.cv-reading-layout.theme-light > .cv-section-nav a,
  body.cv-reading-layout.theme-light > .cv-section-nav .cv-nav-more > summary,
  body.cv-reading-layout.theme-light > .cv-section-nav button { color:#1d3030!important; }
  body.cv-reading-layout.theme-light > .cv-section-nav a[aria-current] { color:#13725c!important; font-weight:800; }
  body.cv-reading-layout.theme-light > .cv-section-nav button { border-color:#aebdb7!important; background:#fff!important; }
  body.cv-reading-layout.theme-light > .cv-section-nav .cv-nav-more > div { background:#fff!important; }

  .cv-track-card { display:flex; align-items:center; gap:11px; padding:12px 14px; margin-top:17px; border:1px solid var(--line); border-radius:10px; background:var(--bg-soft); }
  .cv-track-card img { width:44px; height:44px; object-fit:cover; border-radius:6px; }
  .cv-track-card-main { min-width:0; flex:1; }
  .cv-track-card-title { display:block; font-size:13px; font-weight:700; color:var(--text); }
  .cv-track-card-meta { display:block; color:var(--muted); font-size:11px; margin-top:2px; }
  .cv-track-card input[type=range] { display:block; width:100%; margin-top:8px; accent-color:#86ddc4; }
  .cv-track-card button { width:34px; height:34px; flex:0 0 34px; border:0; border-radius:50%; background:#e8e8ed; color:#19191d; cursor:pointer; }
  .cv-track-card button:focus-visible { outline:2px solid #86ddc4; outline-offset:2px; }
  .cv-track-card-time { color:var(--muted); font:11px ui-monospace,monospace; }
  body.theme-light .cv-track-card { background:#fff; }

  /* SVG tech marks are dark; invert only when the cards are dark. */
  body.matrix-world.theme-light #tech-stack .cv-tech-icons img { filter:none!important; opacity:1!important; }
  #tech-stack .cv-tech-icons { height:34px; gap:13px; align-items:center; }
  #tech-stack .cv-tech-icons img { width:32px; height:32px; }
  #tech-stack .cv-tech-node { min-height:108px; }
  body.matrix-world.theme-light #tech-stack .cv-tech-node { background:#fff!important; }

  #beyond-web .music-card > .cv-playlist { width:min(760px,calc(100% - 48px)); margin:0 auto 24px; padding:0; display:grid; gap:10px; }
  #beyond-web .cv-track-row { display:grid; grid-template-columns:54px minmax(0,1fr) 40px 84px; grid-template-rows:54px 14px; align-items:center; gap:5px 12px; padding:12px; border:1px solid var(--line); border-radius:12px; background:var(--bg-soft); }
  #beyond-web .cv-track-row > img { width:54px; height:54px; object-fit:cover; border-radius:7px; grid-column:1; grid-row:1; }
  #beyond-web .cv-track-name { padding:0; min-width:0; grid-column:2; grid-row:1; }
  #beyond-web .cv-track-name strong,#beyond-web .cv-track-name span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #beyond-web .cv-track-name strong { font-size:14px; color:var(--text); }
  #beyond-web .cv-track-name span { font-size:12px; margin-top:3px; color:var(--muted); }
  #beyond-web .cv-track-play { grid-column:3; grid-row:1; width:38px; height:38px; border:0; border-radius:50%; background:#86ddc4; color:#12352b; font-size:16px; cursor:pointer; }
  #beyond-web .cv-track-play:focus-visible,#beyond-web .cv-track-seek:focus-visible { outline:2px solid #267d72; outline-offset:3px; }
  #beyond-web .cv-track-duration { grid-column:4; grid-row:1; justify-self:end; white-space:nowrap; color:var(--muted); font:11px ui-monospace,monospace; }
  #beyond-web .cv-track-seek { grid-column:1/-1; grid-row:2; width:100%; height:14px; margin:0; padding:0!important; background:transparent; accent-color:#39aa91; cursor:pointer; }
  #beyond-web .cv-track-row audio[hidden] { display:none!important; }
  body.theme-light #beyond-web .cv-track-row { background:#fff; }
  #beyond-web .music-card > .cv-youtube-embeds { display:grid; grid-template-columns:1fr; gap:12px; padding:0 25px 25px; }
  #beyond-web .cv-youtube-embeds iframe,#beyond-web .cv-youtube-launch { display:block; width:100%; aspect-ratio:16/9; height:auto; border:0; border-radius:9px; background:#08090b; }
  #beyond-web .cv-youtube-launch { position:relative; overflow:hidden; padding:0; color:#fff; cursor:pointer; }
  #beyond-web .cv-youtube-launch img { display:block; width:100%; height:100%; object-fit:cover; opacity:.76; transition:transform .2s,opacity .2s; }
  #beyond-web .cv-youtube-launch span { position:absolute; inset:auto 0 0; display:flex; align-items:center; gap:9px; padding:12px; text-align:left; background:linear-gradient(transparent,#08090be8); font-size:13px; font-weight:700; }
  #beyond-web .cv-youtube-launch b { display:grid; place-items:center; width:32px; height:32px; flex:0 0 32px; border-radius:50%; background:#86ddc4; color:#12352b; font-size:12px; }
  #beyond-web .cv-youtube-launch:hover img { opacity:1; transform:scale(1.04); }
  #beyond-web .cv-youtube-launch:focus-visible { outline:3px solid #86ddc4; outline-offset:2px; }
  #beyond-web .music-card > .cv-youtube-direct { display:flex; flex-wrap:wrap; gap:5px 16px; margin:0; padding:0 25px 22px; font-size:12px; }
  .cv-floating-track { position:fixed; left:16px; bottom:16px; z-index:35; display:flex; align-items:center; gap:8px; width:214px; padding:8px; border:1px solid var(--line); border-radius:12px; background:var(--bg-soft); box-shadow:0 6px 24px #0002; color:var(--text); }
  .cv-floating-track[hidden] { display:none!important; }
  .cv-floating-track img { width:36px; height:36px; object-fit:cover; border-radius:5px; }
  .cv-floating-track .cv-floating-name { min-width:0; flex:1; }
  .cv-floating-track strong,.cv-floating-track small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .cv-floating-track strong { font-size:11px; }
  .cv-floating-track small { color:var(--muted); font-size:10px; }
  .cv-floating-track button { flex:0 0 30px; width:30px; height:30px; border:0; border-radius:50%; background:#86ddc4; color:#12352b; cursor:pointer; }
  .cv-youtube-float { text-decoration:none; }
  button.cv-youtube-float { font:inherit; text-align:left; cursor:pointer; }
  .cv-youtube-float:hover,.cv-youtube-float:focus-visible { border-color:#86ddc4; outline:2px solid #86ddc4; outline-offset:2px; }
  .cv-floating-icon { display:grid; place-items:center; flex:0 0 30px; width:30px; height:30px; border-radius:50%; background:#86ddc4; color:#12352b; font-size:12px; }
  body.theme-light .cv-floating-track { background:#fff; }
  .cv-video-dialog { width:min(900px,calc(100vw - 32px)); max-width:none; max-height:calc(100vh - 32px); padding:16px; border:1px solid #86ddc477; border-radius:14px; background:#151518; color:#eeeef0; box-shadow:0 24px 80px #000b; }
  .cv-video-dialog::backdrop { background:#050608cc; }
  .cv-video-dialog-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; font-weight:700; }
  .cv-video-dialog-head button { width:34px; height:34px; border:1px solid #74747f; border-radius:50%; background:#24242a; color:#fff; font-size:20px; cursor:pointer; }
  .cv-video-dialog iframe { display:block; width:100%; aspect-ratio:16/9; border:0; border-radius:8px; background:#08090b; }
  .cv-video-dialog > a { display:inline-block; margin-top:12px; color:#86ddc4; font-size:13px; }
}
@media screen and (max-width:650px) {
  body.cv-reading-layout .hero-with-cover::before { background:linear-gradient(0deg,#08090de6 0%,#08090dad 48%,#08090d26 100%); }
  .cv-reading-layout .cv-section-nav > .container { flex-wrap:nowrap!important; gap:3px!important; padding-left:8px; padding-right:8px; }
  .cv-section-nav .cv-nav-tools { margin-left:auto!important; }
  .cv-section-nav a,.cv-nav-more > summary { white-space:nowrap; font-size:10px!important; padding:6px 2px!important; }
  .cv-section-nav button { white-space:nowrap; font-size:10px; padding:5px!important; }
  .hero .lang-switch a,.hero .lang-switch strong { padding:7px 8px!important; font-size:11px!important; }
  .cv-track-card { flex-wrap:wrap; }
  .cv-track-card-main { flex-basis:calc(100% - 90px); }
  #beyond-web .music-card > .cv-playlist { width:calc(100% - 24px); }
  #beyond-web .music-card > .cv-youtube-embeds { grid-template-columns:1fr; gap:10px; padding:0 16px 16px; }
  #beyond-web .cv-track-row { grid-template-columns:46px minmax(0,1fr) 36px; gap:5px 9px; }
  #beyond-web .cv-track-row > img { width:46px; height:46px; }
  #beyond-web .cv-track-duration { grid-column:2; grid-row:2; justify-self:start; }
  #beyond-web .cv-track-seek { grid-row:3; }
}