:root {
  --ink: #111315;
  --surface: #171a1d;
  --surface-2: #1d2225;
  --gold: #c39155;
  --ivory: #f2eadc;
  --muted: #aaa69d;
  --sage: #778c82;
  --clay: #b96c48;
  --turquoise: #81998a;
  --line: rgba(242, 234, 220, .16);
  --line-warm: rgba(210, 154, 75, .42);
}

html { scroll-padding-top: 82px; }
body {
  background-color: var(--ink);
  background-image:
    radial-gradient(ellipse at 52% 0, rgba(123, 82, 50, .17), transparent 54%),
    linear-gradient(rgba(242, 234, 220, .018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242, 234, 220, .018) 1px, transparent 1px);
  background-size: auto, 36px 36px, 36px 36px;
}

.site-header {
  height: 66px;
  background: rgba(17, 19, 21, .94);
  border-bottom-color: var(--line);
}
.wordmark-mark {
  border-color: var(--gold);
  color: var(--gold);
  background: repeating-linear-gradient(135deg, transparent 0 5px, rgba(210, 154, 75, .12) 6px 7px);
}
.wordmark small { color: #c4a06f; }
.desktop-nav a { color: #d4d0c6; }
.desktop-nav a:hover, .back-link:hover, .text-link:hover { color: var(--gold); }
.command-trigger { border-color: var(--line); background: var(--surface); color: #d6d0c4; }
.command-trigger kbd { border-color: var(--line); }
.header-tools { display: flex; align-items: center; gap: 9px; }

#contenido {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 17px;
  width: min(1240px, calc(100% - 48px));
  margin-inline: auto;
}
#contenido > .section-wrap { width: auto; margin: 0; min-width: 0; }
.hero {
  grid-column: 1 / -1;
  width: auto;
  min-height: 0;
  display: block;
  padding: 30px 0 0;
}
.id-dashboard {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(250px, .95fr) minmax(112px, .32fr);
  min-height: 350px;
  overflow: hidden;
  border: 1px solid var(--line-warm);
  border-radius: 12px;
  background:
    linear-gradient(112deg, rgba(185, 108, 72, .09), transparent 36%),
    linear-gradient(180deg, #171a1d, #111416);
  box-shadow: 0 20px 55px rgba(0, 0, 0, .32), inset 0 1px rgba(242, 234, 220, .045);
}
.id-dashboard::before {
  position: absolute;
  z-index: 3;
  inset: 0 auto 0 0;
  width: 10px;
  background-color: #755035;
  background-image:
    repeating-linear-gradient(45deg, transparent 0 5px, rgba(229, 169, 95, .75) 5px 7px, transparent 7px 12px),
    repeating-linear-gradient(-45deg, transparent 0 5px, rgba(173, 92, 58, .8) 5px 7px, transparent 7px 12px);
  content: "";
  opacity: .58;
  pointer-events: none;
}
.id-card {
  grid-column: 2;
  grid-row: 1;
  min-height: 350px;
  padding: 16px 18px 13px;
  border-left: 1px solid var(--line);
  background:
    repeating-linear-gradient(135deg, transparent 0 10px, rgba(185, 108, 72, .045) 11px 12px),
    linear-gradient(150deg, rgba(210, 154, 75, .08), transparent 48%), #141719;
}
.id-card-top, .id-card-bottom { color: #c5baaa; font-size: 8px; letter-spacing: .1em; }
.id-card-portrait {
  width: min(100%, 162px);
  margin: 24px auto 18px;
  border: 1px solid rgba(210, 154, 75, .64);
  border-radius: 4px;
  background:
    linear-gradient(45deg, transparent 48.5%, rgba(185, 108, 72, .22) 49%, transparent 50.5%),
    linear-gradient(-45deg, transparent 48.5%, rgba(210, 154, 75, .20) 49%, transparent 50.5%),
    repeating-linear-gradient(0deg, transparent 0 15px, rgba(242, 234, 220, .045) 16px),
    #1a1e20;
  color: #dfc99f;
  box-shadow: 0 0 0 5px rgba(210, 154, 75, .045), 0 12px 28px rgba(0, 0, 0, .24);
}
.id-card-portrait:before, .id-card-portrait:after {
  border-color: rgba(210, 154, 75, .4);
  transform: rotate(45deg) scale(.78);
}
.id-card-portrait:after { border-color: rgba(185, 108, 72, .5); }
.id-card-portrait i { border-color: var(--turquoise); width: 6px; height: 6px; }
.id-card-portrait b { color: #d5a861; font-size: 7px; }
.id-card-portrait.has-photo { padding: 0; }
.id-card-portrait.has-photo:before, .id-card-portrait.has-photo:after,
.id-card-portrait.has-photo > i, .id-card-portrait.has-photo > b { display: none; }
.id-card-portrait img { display: block; width: 100%; height: 100%; object-fit: cover; }
.id-card-name { padding: 12px 0 13px; border-color: var(--line); }
.id-card-name > p { color: #c5a36e; }
.hero .id-card-name h1 { color: var(--ivory); font-size: clamp(23px, 2.15vw, 33px); line-height: 1.06; }
.id-card-name > span { color: #c4b9a9; font: 9px var(--mono); letter-spacing: .08em; }
.profile-facts { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 7px; padding-top: 11px; }
.profile-facts div { display: grid; gap: 1px; min-width: 82px; }
.profile-facts span { color: #99938a; font: 7px var(--mono); letter-spacing: .1em; }
.profile-facts strong { color: #e1d7c7; font-size: 9px; font-weight: 500; }
.id-card-bottom { margin-top: auto; padding-top: 10px; }
.id-card-code { color: #d4a75d; }
.id-overview { grid-column: 1; grid-row: 1; min-width: 0; padding: 25px clamp(22px, 4vw, 46px) 20px; }
.id-overview-head .eyebrow { color: var(--turquoise); font-size: 8px; }
.eyebrow-line { background: var(--turquoise); }
.id-index { color: #b7a48b; }
.id-overview h2 {
  margin: 36px 0 12px;
  font-size: clamp(32px, 4vw, 51px);
  line-height: 1.02;
  letter-spacing: -.055em;
}
.id-overview h2 em { color: #d5a45c; font-style: normal; }
.id-overview .hero-intro { max-width: 580px; color: #d0c9bc; font-size: 12px; line-height: 1.7; }
.profile-focus { display: grid; gap: 4px; margin-top: 19px; padding: 11px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.profile-focus > span { color: #99958b; font: 7px var(--mono); letter-spacing: .13em; }
.profile-focus strong { color: #e3d8c6; font-size: 10px; font-weight: 500; }
.profile-focus i { color: var(--turquoise); font-style: normal; }
.id-overview .hero-actions { margin-top: 16px; gap: 20px; }
.id-overview .button { min-height: 35px; gap: 14px; padding-inline: 12px; font-size: 8px; }
.button-primary { border-color: var(--gold); background: linear-gradient(135deg, #e0b363, #bd793f); color: #1a1711; }
.button-primary:hover { background: var(--ivory); border-color: var(--ivory); }
.id-overview .text-link { border-color: rgba(67, 184, 188, .6); font-size: 10px; }
.id-section-index { justify-content: flex-start; gap: clamp(13px, 2.6vw, 32px); color: #a19a8e; font-size: 7px; }
.profile-socials { grid-column: 3; grid-row: 1; display: flex; flex-direction: column; align-items: stretch; padding: 17px 12px 12px; border-left: 1px solid var(--line); background: rgba(8, 10, 11, .18); }
.profile-socials > p { margin: 2px 0 13px; color: #c6a673; font: 9px var(--mono); letter-spacing: .1em; }
#social-list { display: grid; justify-items: center; gap: 8px; }
.profile-social-link { display: grid; place-items: center; width: 33px; height: 33px; border: 1px solid var(--line); border-radius: 8px; background: #171c1e; color: var(--turquoise); font: 10px var(--mono); transition: border-color .18s, color .18s, transform .18s; }
.profile-social-link:hover { border-color: var(--gold); color: var(--gold); transform: translateY(-2px); }
.social-empty { max-width: 110px; color: #777168; font-size: 10px; line-height: 1.4; text-align: left; }
.profile-contact { display: flex; align-items: center; justify-content: space-between; gap: 5px; margin-top: auto; padding: 9px 8px; border: 1px solid var(--line); border-radius: 5px; color: #d5b174; font-size: 10px; }
.profile-contact:hover { color: var(--turquoise); }

.hero-footnote { display: none; }

.module-panel {
  position: relative;
  min-width: 0;
  overflow: hidden;
  padding: 22px 20px 21px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background:
    linear-gradient(145deg, rgba(210, 154, 75, .025), transparent 40%),
    rgba(20, 23, 25, .94);
  box-shadow: inset 0 1px rgba(242, 234, 220, .025);
}
.module-panel::after {
  position: absolute;
  top: 0;
  right: 0;
  width: 64px;
  height: 54px;
  background:
    repeating-linear-gradient(45deg, transparent 0 7px, rgba(185, 108, 72, .19) 8px 9px),
    repeating-linear-gradient(-45deg, transparent 0 7px, rgba(210, 154, 75, .13) 8px 9px);
  content: "";
  opacity: .7;
  pointer-events: none;
  mask-image: linear-gradient(135deg, transparent 8%, #000 88%);
}
.module-panel > * { position: relative; z-index: 1; }
#proyectos { grid-column: span 12; border-top: 2px solid var(--clay); }
#identidad { grid-column: span 5; border-top: 2px solid var(--clay); }
#enfoque { grid-column: span 7; border-top: 2px solid var(--turquoise); }
#trayectoria { grid-column: span 6; border-top: 2px solid var(--gold); }
#laboratorio { grid-column: span 6; border-top: 2px solid var(--turquoise); }
#actividad { grid-column: 1 / -1; border-top: 2px solid var(--turquoise); }
#gaming { grid-column: span 6; border: 1px solid rgba(119, 140, 130, .3); border-top: 2px solid var(--turquoise); background: linear-gradient(145deg, rgba(119, 140, 130, .12), transparent 70%), #121719; }
#personal { grid-column: span 6; }
#publicaciones { grid-column: span 8; }
#galerias { grid-column: span 4; }
#redes { grid-column: span 4; }
#contacto { grid-column: span 8; border-top: 2px solid var(--gold); }
#proyectos .project-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.module-panel .section-heading, .module-panel .lab-heading, .module-panel .gaming-header { margin-bottom: 21px; }
.module-panel .section-heading { align-items: end; gap: 14px; }
.module-panel .section-heading h2, .module-panel .lab-heading h2, .module-panel .gaming-header h2 { margin-top: 12px; font-size: clamp(23px, 2.8vw, 35px); line-height: 1.03; }
.module-panel .section-kicker { gap: 9px; font-size: 8px; }
.module-panel .section-note, .module-panel .lab-heading > p { max-width: 250px; margin: 0; font-size: 12px; line-height: 1.55; }
.module-panel .intro-grid { grid-template-columns: 1fr; gap: 12px; margin-top: 17px; }
.module-panel .intro-grid h2 { font-size: clamp(24px, 3vw, 35px); }
.module-panel .lead { margin: 0 0 8px; font-size: 13px; }
.module-panel .intro-grid p:not(.lead) { margin-bottom: 10px; font-size: 12px; }
.module-panel .focus-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); border: 0; }
.module-panel .focus-card, .module-panel .focus-card:not(:first-child) { min-height: 0; padding: 10px; border: 1px solid var(--line); background: rgba(10, 12, 13, .24); }
.module-panel .focus-icon { margin: 10px 0 6px; color: var(--turquoise); font-size: 20px; }
.module-panel .focus-card h3 { margin-bottom: 4px; font-size: 11px; }
.module-panel .focus-card p { font-size: 11px; }
.module-panel .trajectory-grid { grid-template-columns: 1fr; border: 0; }
.module-panel .trajectory-grid article, .module-panel .trajectory-grid article:not(:first-child) { min-height: 0; padding: 11px 0; border: 0; border-bottom: 1px solid var(--line); }
.module-panel .trajectory-grid article:last-child { border-bottom: 0; }
.module-panel .trajectory-grid h3 { margin: 6px 0; font-size: 12px; }
.module-panel .trajectory-grid p { font-size: 11px; }
.module-panel .profile-subgrid { grid-template-columns: 1fr; gap: 13px; margin-top: 17px; }
.module-panel .profile-subgrid h3 { margin-bottom: 8px; font-size: 13px; }
.module-panel .content-card { padding: 11px; }
.module-panel .content-card h4 { font-size: 11px; }
.module-panel .content-card p, .module-panel .empty-note { font-size: 11px; }
.module-panel .project-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 11px; }
.module-panel .project-controls label { min-width: 0; font-size: 9px; }
.module-panel .project-controls select, .module-panel .project-search input { width: 100%; min-width: 0; height: 36px; font-size: 11px; }
.module-panel .clear-filters { height: 36px; grid-column: 1 / -1; font-size: 10px; }
.module-panel .project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.module-panel .project-card { min-width: 0; overflow: hidden; border-radius: 6px; background: #181b1d; }
.module-panel .project-card:hover { transform: translateY(-2px); border-color: var(--line-warm); }
.module-panel .project-visual { height: 105px; background: linear-gradient(145deg, rgba(67, 184, 188, .12), transparent 52%), #1b2021; }
.module-panel .project-visual.gold { background: linear-gradient(145deg, rgba(210, 154, 75, .20), transparent 52%), #201e1a; }
.module-panel .project-visual.rust { background: linear-gradient(145deg, rgba(185, 108, 72, .20), transparent 52%), #211b19; }
.module-panel .project-visual.sage { background: linear-gradient(145deg, rgba(119, 140, 130, .19), transparent 52%), #191f1e; }
.module-panel .project-visual:before { z-index: 1; background: repeating-linear-gradient(135deg, transparent 0 12px, rgba(242, 234, 220, .04) 13px 14px); }
.project-type-cover { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: center; padding: 12px; }
.project-type-cover .cover-index { color: #c5b8a5; font: 7px var(--mono); }
.project-type-cover strong { max-width: 95%; margin-top: 8px; color: var(--ivory); font-size: 14px; line-height: 1.1; }
.project-type-cover small { margin-top: 5px; color: #d4a65f; font: 7px var(--mono); text-transform: uppercase; }
.module-panel .project-card-body { padding: 11px; }
.module-panel .project-meta { font-size: 7px; }
.module-panel .project-card h3 { margin: 8px 0 5px; font-size: 12px; }
.module-panel .project-card-body > p { min-height: 0; margin-bottom: 8px; font-size: 11px; line-height: 1.5; }
.module-panel .project-tags { gap: 4px; }
.module-panel .project-tags span { padding: 3px 5px; font-size: 8px; }
.module-panel .project-search { grid-column: auto; }
.module-panel .filter-note { margin: 5px 0 9px; font-size: 10px; }
.project-theme-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 12px; padding: 9px 11px; border: 1px solid var(--line); background: rgba(18, 22, 23, .5); }
.project-theme-controls[hidden] { display: none; }
.project-theme-arrow { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; border: 1px solid var(--line-warm); border-radius: 4px; background: transparent; color: var(--gold); font-size: 17px; cursor: pointer; }
.project-theme-arrow:hover, .project-theme-arrow:focus-visible { background: rgba(194, 160, 106, .14); }
.project-theme-arrow:disabled { opacity: .35; cursor: default; }
.project-theme-progress { margin: 0; color: var(--ivory); text-align: center; font: 10px var(--mono); letter-spacing: .04em; }
.project-theme-track { display: flex; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; border: 1px solid var(--line); border-radius: 5px; background: rgba(20, 24, 25, .45); }
.project-theme-track::-webkit-scrollbar { display: none; }
.project-theme-track:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.project-theme-slide { flex: 0 0 100%; min-width: 0; padding: 17px; scroll-snap-align: start; scroll-snap-stop: always; }
.project-theme-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(160px, .8fr); align-items: end; gap: 12px; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.project-theme-intro .small-label { grid-column: 1 / -1; }
.project-theme-intro h3 { margin: 0; color: var(--ivory); font-size: clamp(21px, 2.7vw, 32px); line-height: 1.1; letter-spacing: -.04em; }
.project-theme-intro p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.project-theme-empty { width: 100%; min-height: 175px; display: flex; flex-direction: column; justify-content: center; padding: 25px; }
.project-theme-empty h3 { margin: 9px 0 5px; color: var(--ivory); font-size: clamp(18px, 2.5vw, 25px); font-weight: 500; }
.project-theme-empty p, .project-theme-no-projects { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.project-theme-no-projects { grid-column: 1 / -1; padding: 20px 0; }
:root[data-theme="light"] .project-theme-controls, :root[data-theme="light"] .project-theme-track { background: #e9e2d7; }
:root[data-theme="light"] .project-theme-intro p, :root[data-theme="light"] .project-theme-empty p, :root[data-theme="light"] .project-theme-no-projects { color: #52564f; }
.module-panel .button-outline { margin-top: 15px; min-height: 34px; font-size: 8px; }
.module-panel .lab-heading { grid-template-columns: 1fr; gap: 8px; }
.module-panel .empty-state { grid-template-columns: 37px 1fr; gap: 11px; padding: 14px 0; }
.module-panel .empty-mark { width: 32px; height: 32px; font-size: 18px; }
.module-panel .empty-state h3, .module-panel .publication-empty h3 { font-size: 12px; }
.module-panel .empty-state p:not(.eyebrow), .module-panel .publication-empty p:not(.eyebrow) { font-size: 11px; }
.module-panel .empty-index { display: none; }
.gaming-header { display: flex; align-items: center; justify-content: space-between; }
.gaming-header h2 { color: #d9e5df; }
.gaming-mark { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid rgba(67, 184, 188, .55); border-radius: 11px; color: var(--turquoise); font-size: 23px; }
.gaming-grid { display: grid; gap: 9px; }
.gaming-empty, .gaming-entry { display: flex; align-items: center; gap: 12px; min-height: 57px; padding: 10px 12px; border: 1px solid rgba(67, 184, 188, .17); border-radius: 6px; background: rgba(8, 14, 16, .45); }
.gaming-empty > span, .gaming-entry-mark { display: grid; place-items: center; flex: 0 0 30px; height: 30px; border: 1px solid rgba(67, 184, 188, .48); border-radius: 8px; color: var(--turquoise); font: 12px var(--mono); }
.gaming-empty p, .gaming-entry p { margin: 0; color: #afbcb7; font-size: 11px; }
.gaming-entry .small-label { margin-bottom: 4px; color: var(--turquoise); font-size: 7px; }
.gaming-entry h3 { margin: 0 0 4px; color: #e4e9e5; font-size: 11px; }
.gaming-entry > div > p:last-child { color: #a8b2ae; }
.module-panel .personal-links { gap: 6px; margin: 12px 0 0; }
.module-panel .personal-links a { min-width: 0; flex: 1 1 100%; padding: 8px 10px; font-size: 9px; }
.module-panel .publication-list, .module-panel .gallery-list { gap: 10px; }
.module-panel .publication-grid { grid-template-columns: 1fr; gap: 8px; }
.module-panel .publication-card { grid-template-columns: 38px 1fr; gap: 10px; padding: 11px; }
.module-panel .publication-card > img { width: 38px; height: 38px; }
.module-panel .publication-card .publication-symbol { width: 36px; height: 36px; font-size: 18px; }
.module-panel .publication-card h3 { margin: 0 0 4px; font-size: 11px; }
.module-panel .publication-card p:not(.eyebrow) { margin: 0 0 4px; font-size: 11px; line-height: 1.5; }
.module-panel .publication-card .eyebrow { margin-bottom: 4px; font-size: 7px; }
.module-panel .publication-card.has-video { grid-template-columns: 1fr; }
.publication-video { display: grid; gap: 7px; margin: 12px 0; }
.publication-video iframe { display: block; width: 100%; aspect-ratio: 16 / 9; height: auto; border: 1px solid var(--line); border-radius: 4px; background: #111; }
.publication-video a { width: fit-content; color: var(--gold); font-size: 11px; text-underline-offset: 3px; }
.module-panel .publication-empty { grid-template-columns: 37px 1fr; gap: 11px; min-height: 100px; padding: 13px 0; }
.module-panel .archive-count { display: none; }
.module-panel .gallery-album { padding: 11px; }
.module-panel .gallery-album h3 { font-size: 12px; }
.module-panel .gallery-album > p { font-size: 9px; }
.module-panel .gallery-item { flex-basis: 210px; }
.module-panel .gallery-item img { height: 135px; }
.module-panel .social-rail-note { color: var(--muted); font-size: 10px; }
.module-panel .contact-decoration { position: relative; grid-column: 1; inset: auto; display: grid; place-items: center; width: 96px; height: 96px; margin: auto; border-color: rgba(210, 154, 75, .27); color: rgba(210, 154, 75, .42); font-size: 19px; opacity: .8; }
.module-panel .contact-decoration:before, .module-panel .contact-decoration:after { inset: 12px; border-color: rgba(210, 154, 75, .2); }
.module-panel .contact-decoration:after { inset: 24px; }
.module-panel .contact-decoration { display: none; }
.module-panel .contact-copy { grid-column: 1; min-width: 0; }
.module-panel .contact-card { grid-column: 2; width: 100%; max-width: none; margin: 0; }
.module-panel .contact-copy h2 { font-size: clamp(25px, 3vw, 38px); }
.module-panel .contact-copy p, .module-panel .contact-card p { font-size: 12px; }
.module-panel .contact-card { padding: 16px; background: #181b1d; }
.module-panel .contact-card .small-label { font-size: 8px; }
.module-panel .terminal-section { padding-bottom: 0; }
.section-kicker { color: #d5a35b; }
.section-kicker span:first-child { color: var(--turquoise); }
.section-note, .empty-note { color: #b4aea3; }
.text-link { border-color: rgba(67, 184, 188, .55); }
.contact-status { color: #d3a663; }
.contact-status i { background: var(--turquoise); }
.project-visual .project-cover { z-index: 0; }
.project-visual:has(.project-cover):before { z-index: 1; background: linear-gradient(145deg, rgba(17, 19, 21, .02), rgba(17, 19, 21, .74)); }
.project-visual:has(.project-cover) > *:not(.project-cover) { z-index: 2; }
.command-dialog { border-color: var(--line-warm); border-radius: 10px; background: #15191b; }
.command-dialog nav a:hover, .command-dialog nav a:focus-visible { border-color: var(--line-warm); background: #202528; }
.command-search input:focus { border-color: var(--turquoise); }
.skip-link { background: var(--gold); }

:root[data-theme="light"] {
  --ink: #eee8dc;
  --surface: #e4ddd0;
  --surface-2: #d9d0c1;
  --gold: #80572e;
  --ivory: #242723;
  --muted: #5e625c;
  --clay: #985438;
  --turquoise: #476b58;
  --line: rgba(36, 39, 35, .18);
  --line-warm: rgba(144, 99, 47, .4);
}
:root[data-theme="light"] body { background-color: var(--ink); }
:root[data-theme="light"] .site-header { background: rgba(238, 232, 220, .95); }
:root[data-theme="light"] .id-dashboard { background: linear-gradient(112deg, rgba(152, 84, 56, .08), transparent 36%), #e9e2d6; }
:root[data-theme="light"] .id-dashboard::before { background-color: #9a6c46; opacity: .5; }
:root[data-theme="light"] .id-card { background: repeating-linear-gradient(135deg, transparent 0 10px, rgba(185, 108, 72, .045) 11px 12px), #e2dbcf; }
:root[data-theme="light"] .id-card-name > p, :root[data-theme="light"] .id-card-top, :root[data-theme="light"] .id-card-bottom { color: #56574f; }
:root[data-theme="light"] .hero .id-card-name h1, :root[data-theme="light"] .id-overview h2 { color: #242723; }
:root[data-theme="light"] .id-card-portrait { background-color: #d7d0c3; color: #59462c; }
:root[data-theme="light"] .id-card-name > span, :root[data-theme="light"] .profile-facts strong, :root[data-theme="light"] .profile-focus strong { color: #454841; }
:root[data-theme="light"] .id-overview .hero-intro { color: #50534d; }
:root[data-theme="light"] .profile-facts span, :root[data-theme="light"] .profile-focus > span { color: #66675e; }
:root[data-theme="light"] .module-panel { background: rgba(255, 252, 245, .8); }
:root[data-theme="light"] #gaming { background: linear-gradient(145deg, rgba(71, 107, 88, .1), transparent 70%), #e5e9e2; }
:root[data-theme="light"] .section-map { background: #e4ddd0; }
:root[data-theme="light"] .section-map a, :root[data-theme="light"] .desktop-nav a { color: #393c36; }
:root[data-theme="light"] .profile-social-link, :root[data-theme="light"] .module-panel .project-card, :root[data-theme="light"] .module-panel .contact-card { background: #e5ded2; }
:root[data-theme="light"] .module-panel .project-card-body > p, :root[data-theme="light"] .module-panel .project-tags span { color: #52564f; }
:root[data-theme="light"] .module-panel .project-type-cover strong, :root[data-theme="light"] .gaming-header h2 { color: #282c27; }
:root[data-theme="light"] .module-panel .project-visual { background-color: #d4d0c5; }
:root[data-theme="light"] .command-dialog { background: #f1ebdf; color: #242723; }
:root[data-theme="light"] .command-dialog nav a { color: #242723; }
:root[data-theme="light"] .command-search input { color: #242723; }
:root[data-theme="light"] .profile-socials { background: rgba(255, 252, 245, .45); }
:root[data-theme="light"] .profile-contact { color: #765020; }
:root[data-theme="light"] .id-overview h2 em { color: #855626; }
:root[data-theme="light"] .section-note, :root[data-theme="light"] .empty-note { color: #50564e; }
:root[data-theme="light"] .gaming-empty, :root[data-theme="light"] .gaming-entry { border-color: rgba(71, 107, 88, .28); background: #eff0e8; }
:root[data-theme="light"] .gaming-empty p, :root[data-theme="light"] .gaming-entry p { color: #454d46; }
:root[data-theme="light"] .gaming-empty > span, :root[data-theme="light"] .gaming-entry-mark { border-color: rgba(71, 107, 88, .48); color: #476b58; }

@media (max-width: 1050px) {
  #contenido { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .hero { grid-column: 1 / -1; }
  #identidad, #enfoque, #trayectoria, #proyectos, #laboratorio, #actividad, #gaming,
  #personal, #publicaciones, #galerias, #redes { grid-column: span 3; }
  #contacto, #proyectos, #actividad { grid-column: 1 / -1; }
  .id-dashboard { grid-template-columns: minmax(0, 1.1fr) minmax(210px, .9fr) minmax(102px, .34fr); }
  .id-overview { padding-inline: 23px; }
  .id-overview h2 { margin-top: 27px; }
}
@media (max-width: 680px) {
  html { scroll-padding-top: 70px; }
  #contenido { width: calc(100% - 28px); grid-template-columns: minmax(0, 1fr); gap: 11px; }
  #contenido > .section-wrap { grid-column: 1; }
  .site-header { height: 60px; padding-inline: 14px; }
  .wordmark { gap: 8px; font-size: 9px; }
  .wordmark-mark { width: 32px; height: 32px; }
  .wordmark small { font-size: 7px; }
  .desktop-nav { display: none; }
  .header-tools { margin-left: auto; gap: 6px; }
  .command-trigger { flex: 0 0 32px; width: 32px; min-height: 32px; margin-left: 0; justify-content: center; gap: 0; padding: 0; border-radius: 6px; }
  .command-trigger > span:nth-child(2), .command-trigger kbd { display: none; }
  .mobile-nav { display: block; position: relative; flex: 0 0 32px; }
  .mobile-nav summary { display: grid; place-content: center; gap: 5px; width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; list-style: none; }
  .mobile-nav summary::-webkit-details-marker { display: none; }
  .mobile-nav summary span { display: block; width: 13px; height: 1px; background: var(--ivory); }
  .theme-toggle { width: 32px; height: 32px; flex: 0 0 32px; border: 1px solid var(--line); border-radius: 6px; }
  .mobile-nav nav { max-height: calc(100vh - 78px); overflow: auto; }
  .hero { padding-top: 15px; }
  .id-dashboard { grid-template-columns: minmax(0, 1fr); min-height: 0; border-radius: 9px; }
  .id-card, .id-overview, .profile-socials { grid-column: 1; grid-row: auto; }
  .id-card {
    min-height: 0;
    display: grid;
    grid-template-columns: 106px minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    column-gap: 13px;
    padding: 12px;
    border-right: 0;
    border-left: 0;
    border-bottom: 1px solid var(--line);
  }
  .id-card-top { grid-column: 1 / -1; font-size: 7px; }
  .id-card-portrait { grid-column: 1; grid-row: 2; width: 96px; margin: 11px 0; }
  .id-card-portrait > span { font-size: 40px; }
  .id-card-name { grid-column: 2; grid-row: 2; align-self: center; padding: 7px 0; border: 0; }
  .hero .id-card-name h1 { font-size: clamp(20px, 6vw, 29px); }
  .id-card-name > p { margin-bottom: 4px; font-size: 7px; }
  .id-card-name > span { font-size: 7px; }
  .profile-facts { grid-column: 1 / -1; padding-top: 8px; border-top: 1px solid var(--line); }
  .profile-facts div { min-width: 74px; }
  .id-card-bottom { grid-column: 1 / -1; padding-top: 8px; font-size: 7px; }
  .id-overview { padding: 15px 14px 12px; }
  .id-overview-head .eyebrow { font-size: 7px; }
  .id-overview-head { display: block; }
  .id-overview-head .id-index { display: none !important; }
  .id-overview h2 { margin: 21px 0 9px; font-size: clamp(30px, 8vw, 39px); }
  .id-overview .hero-intro { font-size: 12px; }
  .profile-focus { margin-top: 13px; padding: 8px 0; }
  .profile-focus strong { font-size: 9px; }
  .id-overview .hero-actions { gap: 13px; margin-top: 13px; }
  .id-overview .button { min-height: 36px; gap: 8px; padding-inline: 9px; font-size: 9px; }
  .id-overview .text-link { font-size: 9px; }
  .id-section-index { flex-wrap: wrap; gap: 8px 13px; padding-top: 13px; font-size: 7px; }
  .profile-socials { flex-direction: row; justify-content: space-between; gap: 10px; padding: 10px 13px; border-top: 1px solid var(--line); border-left: 0; }
  .profile-socials > p { margin: 0; font-size: 7px; }
  .profile-socials > p, .social-empty, .profile-contact { font-size: 10px; }
  #social-list { display: flex; flex-wrap: wrap; gap: 6px; }
  .profile-social-link { width: 29px; height: 29px; }
  .social-empty { max-width: none; }
  .profile-contact { margin: 0; padding: 0; border: 0; }
  .module-panel { padding: 17px 14px; border-radius: 7px; }
  .module-panel .section-heading, .module-panel .lab-heading, .module-panel .gaming-header { margin-bottom: 15px; }
  .module-panel .section-heading h2, .module-panel .lab-heading h2, .module-panel .gaming-header h2 { font-size: clamp(25px, 7vw, 33px); }
  .module-panel .section-note { font-size: 11px; }
  #identidad .intro-grid { grid-template-columns: 1fr; gap: 12px; }
  #identidad .intro-grid > * { min-width: 0; }
  #identidad .intro-grid h2 { font-size: 25px; }
  #identidad .lead { font-size: 12px; }
  #identidad .intro-grid p:not(.lead) { font-size: 11px; }
  #enfoque .focus-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #trayectoria .profile-subgrid { grid-template-columns: 1fr; }
  #proyectos .project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-theme-slide { padding: 12px; }
  .project-theme-intro { grid-template-columns: 1fr; gap: 7px; margin-bottom: 13px; }
  .project-theme-intro .small-label { grid-column: 1; }
  .project-theme-controls { padding: 7px; }
  .project-theme-progress { font-size: 9px; }
  #laboratorio .lab-heading { grid-template-columns: 1fr; }
  #gaming .gaming-grid { grid-template-columns: 1fr; }
  #personal .section-heading { display: block; }
  #personal .personal-links { flex-wrap: wrap; }
  #personal .personal-links a { flex-basis: calc(50% - 4px); }
  #publicaciones .section-heading, #galerias .section-heading, #redes .section-heading { display: block; }
  #publicaciones .section-note, #galerias .section-note, #redes .section-note { margin-top: 9px; }
  #contacto { display: grid; grid-template-columns: 1fr; gap: 16px; }
  #contacto .contact-decoration { display: none; }
  #contacto .contact-copy, #contacto .contact-card { grid-column: 1; }
  #contacto .contact-copy h2 { font-size: 32px; }
  #contacto .contact-copy p, #contacto .contact-card p { font-size: 11px; }
}

@media (max-width: 430px) {
  #proyectos .project-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* La cartilla se recorre por zonas visibles, sin menús de secciones. */
[hidden] { display: none !important; }
.id-dashboard.without-socials { grid-template-columns: minmax(0, 1.2fr) minmax(250px, .95fr); }
#laboratorio { grid-column: 1 / -1; }
#laboratorio .lab-game { grid-template-columns: minmax(0, 1.6fr) minmax(210px, .55fr); align-items: start; gap: 22px; margin-top: 17px; }
#laboratorio .lab-game .instructions { padding-top: 8px; }
#laboratorio .lab-game .instructions h3 { font-size: 17px; }
#laboratorio .lab-game .instructions p { color: var(--muted); }
#laboratorio .lab-game .touch-controls { flex-wrap: wrap; }
#laboratorio .publication-list:not(:empty) { margin-top: 19px; }
#contacto.no-contact { grid-template-columns: minmax(0, 1fr); }
#contacto.no-contact .contact-copy { grid-column: 1; }
#contenido .project-theme-track:empty, #contenido .publication-list:empty,
#contenido .gaming-grid:empty, #contenido .gallery-list:empty,
#contenido .trajectory-grid:empty, #contenido .social-zone-links:empty { display: none; }
.social-zone-links { display: grid; gap: 8px; }
.social-zone-links a { display: block; padding: 10px 12px; border: 1px solid var(--line); color: var(--ivory); font-size: 11px; }
.social-zone-links a:hover { border-color: var(--gold); color: var(--gold); }

@media (max-width: 800px) {
  #laboratorio .lab-game { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 680px) {
  .id-dashboard.without-socials { grid-template-columns: minmax(0, 1fr); }
  #laboratorio { grid-column: 1; }
  #laboratorio .lab-game { gap: 13px; }
}

#laboratorio .publication-grid { grid-template-columns: minmax(0, 1fr); }
/* Tema 01 presenta una cartilla breve y enlaza a su página técnica completa. */
.module-panel .project-card-body { padding: 15px; }
.module-panel .project-visual { height: clamp(120px, 16vw, 180px); }
.module-panel .project-card-facts { display: grid; gap: 7px; margin: 11px 0; }
.module-panel .project-card-facts > div { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 8px; align-items: start; }
.module-panel .project-card-facts span { color: var(--gold); font: 8px/1.5 var(--mono); text-transform: uppercase; }
.module-panel .project-card-facts strong { color: var(--ivory); font-size: 10px; font-weight: 500; line-height: 1.45; }
.module-panel .project-card-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 13px; }
.module-panel .project-card-actions .text-link:first-child { color: var(--gold); }
:root[data-theme="light"] .module-panel .project-card-facts strong { color: #343831; }

/* Laboratorio presenta demos en fichas verticales; la cartilla vive en Proyectos. */
#laboratorio .publication-list:not(:empty) { margin-top: 20px; }
#laboratorio .lab-demo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 280px)); gap: 14px; }
#laboratorio .lab-demo-card { min-width: 0; overflow: hidden; border: 1px solid var(--line-warm); border-radius: 5px; background: var(--surface); }
.lab-demo-cover { position: relative; display: flex; aspect-ratio: 16 / 10; align-items: end; overflow: hidden; background: #171b1d; }
.lab-demo-cover:after { position: absolute; inset: 35% 0 0; background: linear-gradient(transparent, rgba(9, 10, 12, .76)); content: ""; }
.lab-demo-cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lab-demo-cover-label { position: relative; z-index: 1; padding: 10px 12px; color: #f1e7d2; font: 8px var(--mono); letter-spacing: .1em; }
.lab-demo-copy { padding: 13px; }
.lab-demo-copy .eyebrow { margin: 0 0 6px; color: var(--sage); font: 8px/1.5 var(--mono); }
.lab-demo-copy h3 { margin: 0 0 7px; font-size: 17px; line-height: 1.2; }
.lab-demo-copy > p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.lab-demo-actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 11px; }
.lab-demo-actions .text-link { font-size: 10px; }
:root[data-theme="light"] .lab-demo-card { background: #e5ded2; }
:root[data-theme="light"] .lab-demo-copy > p:not(.eyebrow) { color: #50564e; }
@media (max-width: 680px) {
  .module-panel .project-visual { height: clamp(130px, 45vw, 190px); }
  #laboratorio .lab-demo-grid { grid-template-columns: minmax(0, 1fr); }
  #laboratorio .lab-demo-card { max-width: 420px; }
}

/* Mapa mensual: el tono comunica volumen relativo de avances de cada día. */
.calendar-day { display: flex; align-items: flex-start; justify-content: space-between; padding: 9px; transition: background-color .25s ease, border-color .25s ease, transform .25s ease; }
.calendar-day.has-activity { border-color: rgba(119, 140, 130, .72); color: var(--ivory); }
.calendar-day.has-activity:hover { transform: translateY(-2px); }
.calendar-day[data-level="1"] { background-color: rgba(71, 107, 88, .24); }
.calendar-day[data-level="2"] { background-color: rgba(71, 107, 88, .42); }
.calendar-day[data-level="3"] { background-color: rgba(71, 107, 88, .64); }
.calendar-day[data-level="4"] { background-color: rgba(71, 107, 88, .88); }
.calendar-day[data-level="1"] i, .calendar-day[data-level="2"] i,
.calendar-day[data-level="3"] i, .calendar-day[data-level="4"] i { position: static; flex: 0 0 6px; width: 6px; height: 6px; margin-top: 5px; background: #b3d0ba; }
.calendar-day[aria-selected="true"] { outline: 2px solid var(--gold); outline-offset: 1px; }
.activity-legend { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin: 12px 0 2px; color: var(--muted); font: 9px var(--mono); }
.activity-legend i { width: 13px; height: 13px; border: 1px solid rgba(119, 140, 130, .72); background: rgba(71, 107, 88, .24); }
.activity-legend i[data-level="2"] { background: rgba(71, 107, 88, .42); }
.activity-legend i[data-level="3"] { background: rgba(71, 107, 88, .64); }
.activity-legend i[data-level="4"] { background: rgba(71, 107, 88, .88); }
.activity-legend span:first-child { margin-right: 3px; }
.activity-legend span:last-child { margin-left: 3px; }
:root[data-theme="light"] .calendar-day.has-activity { color: #243128; }
:root[data-theme="light"] .calendar-day[data-level="1"] { background-color: #d9e2d8; }
:root[data-theme="light"] .calendar-day[data-level="2"] { background-color: #bdcfbd; }
:root[data-theme="light"] .calendar-day[data-level="3"] { background-color: #9eb69f; }
:root[data-theme="light"] .calendar-day[data-level="4"] { background-color: #7f9b82; }
:root[data-theme="light"] .calendar-day[data-level="1"] i, :root[data-theme="light"] .calendar-day[data-level="2"] i,
:root[data-theme="light"] .calendar-day[data-level="3"] i, :root[data-theme="light"] .calendar-day[data-level="4"] i { background: #38533d; }
:root[data-theme="light"] .activity-legend i[data-level="1"] { background: #d9e2d8; }
:root[data-theme="light"] .activity-legend i[data-level="2"] { background: #bdcfbd; }
:root[data-theme="light"] .activity-legend i[data-level="3"] { background: #9eb69f; }
:root[data-theme="light"] .activity-legend i[data-level="4"] { background: #7f9b82; }
@media (max-width: 680px) {
  .calendar-day { min-height: 39px; padding: 6px; }
  .activity-legend { gap: 4px; font-size: 8px; }
  .activity-legend i { width: 11px; height: 11px; }
}
