*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --green: #12A5FF;
      --bg: #0a0a0a;
      --card: #111;
      --border: rgba(18,165,255,0.18);
      --text: rgba(255,255,255,0.85);
      --muted: rgba(255,255,255,0.32);
      --input-bg: rgba(18,165,255,0.03);
    }

    body {
      background: var(--bg);
      color: var(--text);
      font-family: 'Inter', sans-serif;
      min-height: 100vh;
      padding: 40px 16px 100px;
      max-width: 560px;
      margin: 0 auto;
    }

    /* HEADER */
    .logo-wrap {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-bottom: 44px;
    }

    .brand {
      font-size: 22px;
      font-weight: 900;
      letter-spacing: 10px;
      text-transform: uppercase;
      text-align: center;
    }

    .txt-doctor {
      color: #12A5FF;
      text-shadow: 0 0 10px #12A5FF, 0 0 20px #12A5FF;
    }

    .txt-qr {
      color: #ffffff;
      text-shadow: 0 0 10px #ffffff, 0 0 20px #ffffff, 0 0 40px #ffffff;
    }

    .tagline {
      font-size: 9px;
      letter-spacing: 4px;
      color: #12A5FF;
      text-transform: uppercase;
      text-align: center;
      text-shadow: 0 0 10px #12A5FF;
      opacity: 0.8;
    }

    .trial-expired-banner {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 9999;
      background: rgba(0,0,0,0.88);
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 16px;
      padding: 32px 24px;
      text-align: center;
    }
    .trial-expired-banner .teb-icon { font-size: 40px; }
    .trial-expired-banner .teb-title {
      font-size: 16px; font-weight: 800; letter-spacing: 2px;
      color: #12A5FF; text-shadow: 0 0 12px rgba(18,165,255,0.6);
    }
    .trial-expired-banner .teb-body {
      font-size: 13px; font-weight: 300; color: rgba(255,255,255,0.7);
      line-height: 1.7; max-width: 340px;
    }
    .trial-expired-banner .teb-sub {
      font-size: 11px; color: rgba(255,255,255,0.35); letter-spacing: 1px;
    }

    .brand-slogan {
      max-width: 700px;
      margin: 20px auto 0;
      padding: 0 20px;
      text-align: center;
      font-size: 13px;
      font-weight: 400;
      color: rgba(255,255,255,0.45);
      letter-spacing: 0.3px;
      line-height: 1.6;
    }

    /* SECCIONES */
    .form-section {
      background: var(--card);
      border: 1px solid rgba(18,165,255,0.4);
      border-radius: 16px;
      margin-bottom: 10px;
      overflow: hidden;
      transition: border-color 0.2s, box-shadow 0.2s;
    }

    .form-section:hover {
      border-color: #12A5FF;
      box-shadow: 0 0 15px rgba(18,165,255,0.3);
    }

    .form-section.open {
      border-color: rgba(18,165,255,0.35);
    }

    .section-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 18px 20px;
      cursor: pointer;
      user-select: none;
      -webkit-tap-highlight-color: transparent;
    }

    .section-title {
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 3px;
      color: var(--green);
      text-transform: uppercase;
    }

    .section-chevron {
      font-size: 18px;
      color: rgba(18,165,255,0.7);
      transition: transform 0.25s;
      line-height: 1;
    }

    .form-section.open .section-chevron {
      transform: rotate(90deg);
    }

    .section-body {
      display: none;
      padding: 4px 20px 22px;
    }

    .form-section.open .section-body {
      display: block;
    }

    /* CAMPOS */
    .field {
      margin-bottom: 18px;
    }

    .field:last-child { margin-bottom: 0; }

    .field-label {
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 2px;
      color: #12A5FF;
      text-transform: uppercase;
      margin-bottom: 8px;
      text-shadow: 0 0 8px #12A5FF;
    }

    .field input[type="text"],
    .field input[type="date"],
    .field input[type="email"],
    .field input[type="tel"],
    .field input[type="number"],
    .field select {
      width: 100%;
      padding: 12px 14px;
      background: rgba(18,165,255,0.05);
      border: 1px solid #12A5FF;
      border-radius: 10px;
      color: #fff;
      font-family: 'Inter', sans-serif;
      font-size: 16px;
      outline: none;
      transition: border-color 0.15s, box-shadow 0.15s;
      -webkit-appearance: none;
      appearance: none;
    }

    .field input:focus,
    .field select:focus {
      border-color: #12A5FF;
      box-shadow: 0 0 8px rgba(18,165,255,0.3);
    }

    .field input::placeholder {
      color: rgba(18,165,255,0.7);
    }

    .field select {
      cursor: pointer;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2300ff41' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 14px center;
      padding-right: 38px;
    }

    .field select option {
      background: #1a1a1a;
      color: var(--text);
    }

    .field input[type="date"] {
      color-scheme: dark;
    }

    /* CHIPS */
    .chips {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .chip {
      padding: 7px 14px;
      border-radius: 20px;
      border: 1px solid #12A5FF;
      background: transparent;
      color: #12A5FF;
      opacity: 0.88;
      font-family: 'Inter', sans-serif;
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.3px;
      cursor: pointer;
      transition: all 0.15s;
      user-select: none;
      -webkit-tap-highlight-color: transparent;
    }

    .chip.active {
      border-color: #12A5FF;
      background: #12A5FF;
      color: #000000;
      font-weight: 700;
      opacity: 1;
      box-shadow: 0 0 12px #12A5FF;
    }

    .chip-danger {
      border-color: #ff0000;
      color: #ff0000;
      opacity: 0.9;
    }

    .chip-danger.active {
      border-color: #ff0000;
      background: rgba(255,0,0,0.12);
      color: #ff0000;
      font-weight: 700;
      opacity: 1;
      box-shadow: 0 0 16px #ff0000, 0 0 32px rgba(255,0,0,0.4);
    }

    .critical-warning {
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 1.5px;
      color: #ff0000;
      text-transform: uppercase;
      text-shadow: 0 0 8px #ff0000;
      margin-top: 10px;
      padding: 8px 12px;
      border: 1px solid rgba(255,0,0,0.3);
      border-radius: 8px;
      background: rgba(255,0,0,0.05);
    }

    #lang-levels-container { margin-top: 12px; }

    .lang-level-row {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 8px;
    }

    .lang-level-row:last-child { margin-bottom: 0; }

    .lang-level-label {
      font-size: 10px;
      color: #12A5FF;
      white-space: nowrap;
      min-width: 90px;
      opacity: 0.95;
    }

    .lang-level-row select {
      flex: 1;
      padding: 8px 30px 8px 12px;
      background: rgba(18,165,255,0.05);
      border: 1px solid #12A5FF;
      border-radius: 8px;
      color: #12A5FF;
      font-family: 'Inter', sans-serif;
      font-size: 13px;
      outline: none;
      -webkit-appearance: none;
      appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2300ff41' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 10px center;
      cursor: pointer;
    }

    .lang-level-row select option {
      background: #1a1a1a;
      color: #fff;
    }

    #allergy-severity-container { margin-top: 12px; }

    .allergy-severity-row {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 8px;
    }

    .allergy-severity-row:last-child { margin-bottom: 0; }

    .allergy-severity-label {
      font-size: 10px;
      color: #12A5FF;
      white-space: nowrap;
      min-width: 90px;
      opacity: 0.95;
    }

    .allergy-severity-row select {
      flex: 1;
      padding: 8px 30px 8px 12px;
      background: rgba(18,165,255,0.05);
      border: 1px solid #12A5FF;
      border-radius: 8px;
      color: #12A5FF;
      font-family: 'Inter', sans-serif;
      font-size: 13px;
      outline: none;
      -webkit-appearance: none;
      appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2300ff41' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 10px center;
      cursor: pointer;
    }

    .allergy-severity-row select option {
      background: #1a1a1a;
      color: #fff;
    }

    /* CAMPOS DE TELÉFONO CON PREFIJO */
    .phone-field {
      display: grid;
      grid-template-columns: 148px 1fr;
      gap: 6px 8px;
      align-items: start;
    }

    .phone-field select.phone-prefix {
      grid-column: 1;
      grid-row: 1;
      font-size: 13px;
      padding: 12px 30px 12px 10px;
      background-position: right 8px center;
    }

    .phone-field input.phone-number {
      grid-column: 2;
      grid-row: 1;
      font-size: 15px;
    }

    .phone-hint {
      grid-column: 1 / -1;
      grid-row: 2;
      font-size: 11px;
      color: rgba(18,165,255,0.58);
      letter-spacing: 0.4px;
      min-height: 16px;
    }

    .phone-warning {
      grid-column: 1 / -1;
      grid-row: 3;
    }

    /* CAMPO TARJETA SANITARIA CON PAÍS */
    .health-card-field {
      display: grid;
      grid-template-columns: 148px 1fr;
      gap: 6px 8px;
      align-items: start;
    }

    .health-card-field select {
      grid-column: 1;
      grid-row: 1;
      font-size: 13px;
      padding: 12px 30px 12px 10px;
      background-position: right 8px center;
    }

    .health-card-field input {
      grid-column: 2;
      grid-row: 1;
      font-size: 15px;
    }

    .health-card-hint {
      grid-column: 1 / -1;
      grid-row: 2;
      font-size: 11px;
      color: rgba(18,165,255,0.4);
      letter-spacing: 0.4px;
      min-height: 16px;
    }

    .health-card-warning {
      grid-column: 1 / -1;
      grid-row: 3;
      font-size: 11px;
      color: #ff4444;
    }

    /* GRUPOS CONTACTO */
    .contact-group {
      background: rgba(18,165,255,0.02);
      border: 1px solid rgba(18,165,255,0.1);
      border-radius: 12px;
      padding: 16px;
      margin-bottom: 14px;
    }

    .contact-group:last-child { margin-bottom: 0; }

    .contact-label {
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 2px;
      color: rgba(18,165,255,0.62);
      text-transform: uppercase;
      margin-bottom: 14px;
    }

    .contact-group .field:last-child { margin-bottom: 0; }

    /* BOTÓN FINAL */
    .btn-generate {
      width: 100%;
      padding: 18px;
      border-radius: 14px;
      border: none;
      background: var(--green);
      color: #000;
      font-family: 'Inter', sans-serif;
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 4px;
      text-transform: uppercase;
      cursor: pointer;
      margin-top: 24px;
      transition: opacity 0.15s, box-shadow 0.15s;
    }

    .btn-generate:hover {
      opacity: 0.9;
      box-shadow: 0 0 24px rgba(18,165,255,0.35);
    }

    .btn-generate:active { opacity: 0.8; }

    .save-indicator {
      text-align: center;
      font-size: 11px;
      letter-spacing: 1px;
      color: var(--green, #00f064);
      margin-top: 10px;
      opacity: 0;
      transform: translateY(-4px);
      transition: opacity 0.3s ease, transform 0.3s ease;
      pointer-events: none;
    }

    .save-indicator.show {
      opacity: 1;
      transform: translateY(0);
    }

    .chips.chips-disabled {
      opacity: 0.35;
      pointer-events: none;
    }

    .qr-reminder-banner {
      background: rgba(18,165,255,0.08);
      border: 2px solid #12A5FF;
      border-radius: 12px;
      padding: 20px 24px;
      margin: 16px 0;
      font-size: 1.05em;
      font-weight: 600;
      line-height: 1.5;
      color: rgba(255,255,255,0.75);
      letter-spacing: 0.2px;
    }

    .qr-reminder-banner.pulse {
      animation: qr-reminder-pulse 0.9s ease;
    }

    @keyframes qr-reminder-pulse {
      0%   { box-shadow: 0 0 0 rgba(18,165,255,0); }
      30%  { box-shadow: 0 0 20px rgba(18,165,255,0.6); }
      100% { box-shadow: 0 0 0 rgba(18,165,255,0); }
    }

    .btn-add-med {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      margin-top: 10px;
      padding: 7px 14px;
      border-radius: 8px;
      border: 1px dashed rgba(18,165,255,0.4);
      background: transparent;
      color: #12A5FF;
      font-family: 'Inter', sans-serif;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 1.5px;
      cursor: pointer;
      transition: border-color 0.15s, background 0.15s;
    }
    .btn-add-med:hover {
      border-color: #12A5FF;
      background: rgba(18,165,255,0.06);
    }

    /* ICONOS SVG */
    .ico {
      width: 1em; height: 1em;
      vertical-align: -0.15em;
      fill: currentColor;
      display: inline-block;
      flex-shrink: 0;
      pointer-events: none;
    }
    .ico-crit { filter: drop-shadow(0 0 4px currentColor); }
    .section-icon {
      width: 15px; height: 15px;
      vertical-align: -3px;
      margin-right: 5px;
      flex-shrink: 0;
      pointer-events: none;
      display: inline-block;
    }
    .sect-norm { color: #12A5FF; }
    .sect-crit { color: #ff2222; filter: drop-shadow(0 0 6px #ff2222); }
    .sect-high { color: #ff6600; filter: drop-shadow(0 0 5px #ff6600); }
    .chip-ico {
      width: 0.78em; height: 0.78em;
      vertical-align: -0.1em;
      margin-left: 3px;
      flex-shrink: 0;
      pointer-events: none;
      display: inline-block;
    }
    @keyframes pulse-ico {
      0%, 100% { filter: drop-shadow(0 0 5px #ff2222); }
      50%       { filter: drop-shadow(0 0 14px #ff2222) drop-shadow(0 0 22px rgba(255,34,34,0.35)); }
    }
    .ico-pulse { animation: pulse-ico 1.8s ease-in-out infinite; }

    /* TOAST */
    .toast {
      position: fixed;
      bottom: 32px;
      left: 50%;
      transform: translateX(-50%) translateY(120px);
      background: var(--green);
      color: #000;
      font-family: 'Inter', sans-serif;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 2px;
      text-transform: uppercase;
      padding: 12px 28px;
      border-radius: 30px;
      transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
      z-index: 999;
      white-space: nowrap;
    }

    .toast.show {
      transform: translateX(-50%) translateY(0);
    }

    .toast-sync {
      bottom: 80px;
      background: #00aaff;
      color: #fff;
    }

    .toast-conflict {
      bottom: 80px;
      background: #cc4400;
      color: #fff;
      max-width: 88vw;
      white-space: normal;
      text-align: center;
      line-height: 1.5;
      font-size: 10px;
      padding: 14px 22px;
    }

    @keyframes parpadeo {
      0%, 100% { opacity: 1; }
      50%       { opacity: 0.15; }
    }

    @keyframes ecg-draw {
      0%   { stroke-dashoffset: 250; }
      70%  { stroke-dashoffset: 0; }
      85%  { stroke-dashoffset: 0; }
      100% { stroke-dashoffset: 250; }
    }

    .logo-container { perspective: 800px; margin-bottom: -101px; }

    .logo-rotate {
      animation: logo3d 8s ease-in-out infinite;
      transform-style: preserve-3d;
      display: inline-block;
      will-change: transform;
    }

    @media (prefers-reduced-motion: reduce) {
      .logo-rotate { animation: none !important; }
    }

    @keyframes logo3d {
      0%   { transform: rotateY(0deg); }
      25%  { transform: rotateY(180deg); }
      50%  { transform: rotateY(360deg); }
      75%  {
        transform: rotateY(180deg);
        filter: drop-shadow(0 0 18px #ff0000)
                drop-shadow(0 0 35px #ff0000);
      }
      100% { transform: rotateY(360deg); }
    }

    .bombilla {
      fill: #12A5FF;
      animation: parpadeo 0.4s ease-in-out infinite;
      filter: drop-shadow(0 0 4px #12A5FF) drop-shadow(0 0 8px #12A5FF);
    }

    @keyframes destello-rojo {
      0%   { filter: drop-shadow(0 0 1px #ff0000); }
      24%  { filter: drop-shadow(0 0 1px #ff0000); }
      25%  { filter: drop-shadow(0 0 20px #ff0000) drop-shadow(0 0 40px #ff0000); }
      26%  { filter: drop-shadow(0 0 1px #ff0000); }
      74%  { filter: drop-shadow(0 0 1px #ff0000); }
      75%  { filter: drop-shadow(0 0 20px #ff0000) drop-shadow(0 0 40px #ff0000); }
      76%  { filter: drop-shadow(0 0 1px #ff0000); }
      100% { filter: drop-shadow(0 0 1px #ff0000); }
    }

    .corazon-svg { animation: destello-rojo 5s infinite ease-in-out; }

    .form-group { margin-bottom: 18px; }
    .form-group:last-child { margin-bottom: 0; }
    .chips-group { display: flex; flex-wrap: wrap; gap: 8px; }

    .field-hint {
      font-size: 11px;
      color: rgba(18,165,255,0.58);
      margin-top: 4px;
      letter-spacing: 0.5px;
    }
    .field-warning {
      font-size: 11px;
      color: #ff4444;
      margin-top: 4px;
      letter-spacing: 0.5px;
    }

    #input-dni, #input-nie, #input-pasaporte,
    #email-alias, #email-custom-domain,
    #passport-country, #email-domain {
      background: #0d0d0d;
      border: 1px solid #12A5FF;
      border-radius: 10px;
      color: #12A5FF;
      font-family: inherit;
      font-size: 14px;
      padding: 12px 16px;
      width: 100%;
      box-sizing: border-box;
      outline: none;
      letter-spacing: 1px;
    }

    #input-dni:focus, #input-nie:focus,
    #input-pasaporte:focus, #email-alias:focus,
    #email-custom-domain:focus {
      border-color: #12A5FF;
      box-shadow: 0 0 8px rgba(18,165,255,0.3);
    }

    #passport-country, #email-domain {
      cursor: pointer;
      appearance: none;
      -webkit-appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2300ff41' stroke-width='2' fill='none'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 14px center;
      padding-right: 36px;
    }

    #passport-country option, #email-domain option {
      background: #0d0d0d;
      color: #12A5FF;
    }

    .email-field {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .email-field #email-alias {
      flex: 1;
      min-width: 0;
    }

    .email-field #email-domain {
      flex: 1.2;
      min-width: 0;
    }

    .form-label {
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 2px;
      color: #12A5FF;
      text-transform: uppercase;
      margin-bottom: 8px;
      display: block;
      text-shadow: 0 0 8px #12A5FF;
    }
    .form-sublabel {
      font-size: 9px;
      font-weight: 500;
      letter-spacing: 1.5px;
      color: rgba(18,165,255,0.55);
      text-transform: uppercase;
      margin-bottom: 6px;
      display: block;
    }
    .form-select {
      width: 100%;
      padding: 11px 36px 11px 14px;
      background: rgba(18,165,255,0.05);
      border: 1px solid #12A5FF;
      border-radius: 10px;
      color: #12A5FF;
      font-family: 'Inter', sans-serif;
      font-size: 14px;
      outline: none;
      cursor: pointer;
      appearance: none;
      -webkit-appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2300ff41' stroke-width='2' fill='none'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 12px center;
      box-sizing: border-box;
    }
    .form-select option { background: #1a1a1a; color: #fff; }
    #year-visit-1, #year-visit-2, #year-visit-3 {
      padding: 11px 14px;
      background: rgba(18,165,255,0.05);
      border: 1px solid #12A5FF;
      border-radius: 10px;
      color: #12A5FF;
      font-family: 'Inter', sans-serif;
      font-size: 14px;
      outline: none;
      box-sizing: border-box;
      width: 90px;
      flex-shrink: 0;
    }
    #year-visit-1::-webkit-inner-spin-button,
    #year-visit-2::-webkit-inner-spin-button,
    #year-visit-3::-webkit-inner-spin-button { -webkit-appearance: none; }

    #last-surgery-date {
      background: #0d0d0d;
      border: 1px solid #12A5FF;
      border-radius: 10px;
      color: #12A5FF;
      font-family: inherit;
      font-size: 13px;
      padding: 10px 14px;
      width: 100%;
      box-sizing: border-box;
      outline: none;
      appearance: none;
      -webkit-appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2300ff41' stroke-width='2' fill='none'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 12px center;
    }
    #last-surgery-date option { background: #1a1a1a; color: #fff; }

    #pregnancy-weeks {
      background: #0d0d0d;
      border: 1px solid #12A5FF;
      border-radius: 10px;
      color: #12A5FF;
      font-family: inherit;
      font-size: 13px;
      padding: 10px 14px;
      width: 100%;
      box-sizing: border-box;
      outline: none;
      appearance: none;
      -webkit-appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2300ff41' stroke-width='2' fill='none'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 12px center;
    }
    #pregnancy-weeks option { background: #1a1a1a; color: #fff; }

    .chips-search-wrap {
      margin-bottom: 10px;
    }

    .chips-search {
      width: 100%;
      background: #0d0d0d;
      border: 1px solid rgba(18,165,255,0.4);
      border-radius: 8px;
      color: #12A5FF;
      font-family: inherit;
      font-size: 12px;
      padding: 8px 14px;
      box-sizing: border-box;
      outline: none;
      letter-spacing: 1px;
      transition: border-color 0.2s;
    }

    .chips-search:focus {
      border-color: #12A5FF;
      box-shadow: 0 0 6px rgba(18,165,255,0.3);
    }

    .chips-search::placeholder {
      color: rgba(18,165,255,0.65);
    }

    /* MODAL VALIDACIÓN SECCIONES VACÍAS */
    #modal-validacion {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.72);
      z-index: 1200;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }
    #modal-validacion.open {
      display: flex;
    }
    #modal-tutor-legal {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.72);
      z-index: 1200;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }
    #modal-tutor-legal.open {
      display: flex;
    }
    .modal-validacion-card {
      background: var(--card);
      border: 1px solid var(--border);
      border-radius: 16px;
      padding: 28px 24px 24px;
      max-width: 420px;
      width: 100%;
    }
    .modal-validacion-card h3 {
      color: var(--green);
      font-size: 13px;
      letter-spacing: 2px;
      text-transform: uppercase;
      margin-bottom: 12px;
    }
    .modal-validacion-card p {
      color: var(--text);
      font-size: 14px;
      line-height: 1.6;
      margin-bottom: 22px;
    }
    .modal-validacion-card p strong {
      color: #fff;
    }
    .modal-validacion-btns {
      display: flex;
      gap: 10px;
      flex-direction: column;
    }
    .btn-continuar-igual {
      background: transparent;
      border: 1px solid var(--border);
      color: var(--muted);
      padding: 12px 20px;
      border-radius: 10px;
      font-size: 13px;
      cursor: pointer;
      transition: border-color 0.2s, color 0.2s;
    }
    .btn-continuar-igual:hover {
      border-color: rgba(18,165,255,0.45);
      color: var(--text);
    }
    .btn-volver-revisar {
      background: var(--green);
      border: none;
      color: #000;
      padding: 13px 20px;
      border-radius: 10px;
      font-size: 13px;
      font-weight: 700;
      cursor: pointer;
      letter-spacing: 1px;
    }

.form-search-bar {
  position: sticky;
  top: 0;
  z-index: 500;
  background: #0a0a0a;
  border-bottom: 1px solid rgba(18,165,255,0.15);
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.form-search-icon { color: rgba(18,165,255,0.5); flex-shrink: 0; }
.form-search-input {
  flex: 1;
  background: rgba(18,165,255,0.06);
  border: 1px solid rgba(18,165,255,0.25);
  border-radius: 8px;
  padding: 8px 12px;
  color: #12A5FF;
  font-family: inherit;
  font-size: 14px;
}
.form-search-input::placeholder { color: rgba(18,165,255,0.4); }
.form-search-counter { font-size: 11px; color: rgba(18,165,255,0.5); white-space: nowrap; }
.form-search-nav { display: flex; gap: 4px; }
.form-search-navbtn {
  background: transparent;
  border: 1px solid rgba(18,165,255,0.25);
  color: #12A5FF;
  width: 30px; height: 30px;
  border-radius: 4px;
  cursor: pointer;
}
.form-search-navbtn:disabled { opacity: 0.3; cursor: default; }
mark.form-search-mark { background: #ffd700; color: #000; }
mark.form-search-mark.current { background: #ff6600; color: #fff; }