:root {
        --bg: #0b0f15;
        --panel: #0f1520;
        --muted: #9fb0c0;
        --text: #e7edf3;
        --brand: #3aa9ff;
        --brand-2: #68e0cf;
        --ok: #5dd39e;
        --warn: #ffb86b;
        --danger: #ff7b7b;
        --border: #203044;
        --shadow: rgba(0, 0, 0, 0.4);
        --radius: 18px;
      }
      * {
        box-sizing: border-box;
      }
      html,
      body {
        height: 100%;
      }
      body {
        margin: 0;
        background: radial-gradient(
            1200px 800px at 80% -200px,
            rgba(58, 169, 255, 0.15),
            transparent 60%
          ),
          radial-gradient(
            800px 600px at -10% 20%,
            rgba(104, 224, 207, 0.12),
            transparent 60%
          ),
          var(--bg);
        color: var(--text);
        font: 16px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu,
          Cantarell, "Helvetica Neue", Arial;
        -webkit-font-smoothing: antialiased;
        text-rendering: optimizeLegibility;
      }
      a {
        color: var(--brand);
        text-decoration: none;
      }
      a:hover {
        text-decoration: underline;
      }
      .container {
        width: min(1120px, 92vw);
        margin-inline: auto;
      }
      .section {
        padding: 64px 0;
      }
      .grid {
        display: grid;
        gap: 24px;
      }
      .grid-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .grid-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
      @media (max-width: 900px) {
        .grid-2,
        .grid-3 {
          grid-template-columns: 1fr;
        }
      }
      .topbar {
        position: relative;
        top: 0;
        z-index: 30;
        backdrop-filter: blur(8px);
        background: rgba(11, 15, 21, 0.6);
        border-bottom: 1px solid var(--border);
      }
      .topbar-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 0;
      }
      .brand {
        display: flex;
        gap: 12px;
        align-items: center;
      }
      .main_logo {
        flex: 0 0 auto;
        width: 220px;
        height: 120px;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .main_logo img {
        width: 100%;
        height: 100%;
        object-fit: contain;
      }
      .brand strong {
        letter-spacing: 0.2px;
      }
      nav a {
        margin: 0 10px;
        color: var(--text);
        opacity: 0.85;
        font-size: 20px;
      }
      nav a:hover {
        opacity: 1;
      }
      .nav-actions {
        display: flex;
        gap: 10px;
        align-items: center;
      }
      .btn {
        appearance: none;
        border: 1px solid var(--border);
        background: linear-gradient(180deg, #121a26, #0e141d);
        color: var(--text);
        padding: 10px 14px;
        border-radius: 12px;
        box-shadow: 0 6px 18px -12px var(--shadow);
        cursor: pointer;
      }
      .btn:hover {
        border-color: #2b3d55;
      }
      .btn.primary {
        border: none;
        background: linear-gradient(135deg, var(--brand), var(--brand-2));
        color: #0b1220;
        font-weight: 700;
      }
      .hero {
        position: relative;
        padding: 80px 0 60px;
        overflow: hidden;
      }
      .hero h1 {
        font-size: clamp(28px, 4.4vw, 52px);
        line-height: 1.08;
        margin: 0 0 12px;
      }
      .hero p {
        margin: 8px 0 0;
        color: var(--muted);
        font-size: clamp(16px, 1.6vw, 18px);
      }
      .hero .meta {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 14px;
        margin-top: 16px;
        color: var(--text);
      }
      .pill {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        border: 1px solid var(--border);
        background: rgba(255, 255, 255, 0.03);
        padding: 8px 12px;
        border-radius: 999px;
      }
      .kbd {
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
          "Liberation Mono", "Courier New", monospace;
        font-size: 0.92em;
      }
      .card {
        background: linear-gradient(180deg, #0f1520, #0c121b);
        border: 1px solid var(--border);
        border-radius: var(--radius);
        padding: 20px;
        box-shadow: 0 16px 28px -24px var(--shadow);
      }
      .card h3 {
        margin: 0 0 8px;
      }
      .timeline {
        position: relative;
        padding-left: 20px;
      }
      .timeline:before {
        content: "";
        position: absolute;
        left: 6px;
        top: 0;
        bottom: 0;
        width: 2px;
        background: #1c2838;
      }
      .t-item {
        position: relative;
        margin: 16px 0;
        padding-left: 12px;
      }
      .t-item:before {
        content: "";
        position: absolute;
        left: -4px;
        top: 6px;
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background: linear-gradient(135deg, var(--brand), var(--brand-2));
        box-shadow: 0 0 0 3px #0d1724;
      }
      .t-item small {
        color: var(--muted);
      }
      .schedule {
        border-collapse: collapse;
        width: 100%;
        font-size: 15px;
      }
      .schedule th,
      .schedule td {
        border: 1px solid var(--border);
        padding: 10px 12px;
        vertical-align: top;
      }
      .schedule th {
        background: #101828;
        text-align: left;
      }
      .badge {
        display: inline-block;
        font-size: 12px;
        padding: 4px 8px;
        border-radius: 999px;
        border: 1px solid var(--border);
        color: var(--muted);
      }
      footer {
        border-top: 1px solid var(--border);
        padding: 24px 0 64px;
        color: var(--muted);
      }
      .muted {
        color: var(--muted);
      }
      .center {
        text-align: center;
      }
      .mt-8 {
        margin-top: 8px;
      }
      .mt-12 {
        margin-top: 12px;
      }
      .mt-16 {
        margin-top: 16px;
      }
      .mt-24 {
        margin-top: 24px;
      }
      .mt-32 {
        margin-top: 32px;
      }
      .mb-0 {
        margin-bottom: 0;
      }
      .hide {
        display: none;
      }
      .hamburger {
        display: none;
      }
      .drawer {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: 50;
      }
      .drawer.open {
        display: block;
      }
      .drawer .panel {
        position: absolute;
        right: 0;
        top: 0;
        height: 100%;
        width: min(360px, 85vw);
        background: #0e141e;
        border-left: 1px solid var(--border);
        padding: 16px;
        transform: translateX(100%);
        transition: transform 0.25s ease;
      }
      .drawer.open .panel {
        transform: translateX(0);
      }
      .drawer a {
        display: block;
        padding: 12px 10px;
        border-radius: 10px;
      }
      .close-btn {
        position: absolute;
        top: 10px;
        right: 10px;
        font-size: 20px;
        line-height: 1;
        border-radius: 999px;
        width: 38px;
        height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
      }
      @media (max-width: 900px) {
        nav {
          display: none;
        }
        .hamburger {
          display: inline-flex;
          align-items: center;
          justify-content: center;
          width: 38px;
          height: 38px;
          border-radius: 10px;
          border: 1px solid var(--border);
        }
      }
      @media (min-width: 901px) {
        .drawer {
          display: none !important;
        }
      }
      .link-card {
        display: flex;
        flex-direction: column;
        min-height: 160px;
      }
      .link-card .btn {
        margin-top: auto;
      }
      .notice {
        margin-top: 8px;
        padding: 8px 10px;
        border: 1px solid var(--border);
        border-radius: 10px;
        background: rgba(255, 255, 255, 0.03);
        font-size: 14px;
        color: var(--muted);
        display: none;
      }
      .notice.show {
        display: block;
      }
      .notice.success {
        border-color: rgba(93, 211, 158, 0.4);
        color: var(--ok);
      }
      .notice.error {
        border-color: rgba(255, 123, 123, 0.4);
        color: var(--danger);
      }
      /* Keynotes */
      .speaker {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-bottom: 8px;
      }
      .avatar {
        width: 150px;
        height: 150px;
        border-radius: 50%;
        object-fit: cover;
        border: 1px solid var(--border);
        box-shadow: 0 6px 18px -12px var(--shadow);
      }
      /* Lang switch */
      .lang-switch {
        display: inline-flex;
        gap: 6px;
        padding: 4px;
        border: 1px solid var(--border);
        border-radius: 999px;
        background: linear-gradient(180deg, #121a26, #0e141d);
      }
      .lang-switch button {
        border: 0;
        background: transparent;
        color: var(--muted);
        padding: 6px 10px;
        border-radius: 999px;
        cursor: pointer;
      }
      .lang-switch button.active {
        background: rgba(255, 255, 255, 0.1);
        color: var(--text);
      }

      /* Partners carousel */
      .partners-wrap {
        position: relative;
        overflow: hidden;
        border: 1px solid var(--border);
        border-radius: var(--radius);
        background: linear-gradient(180deg, #0f1520, #0c121b);
      }
      .logo-marquee {
        position: relative;
        overflow: hidden;
        padding: 16px;
      }
      .logo-marquee::before,
      .logo-marquee::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        width: 60px;
        z-index: 1;
        pointer-events: none;
        background: linear-gradient(to right, var(--bg), rgba(11, 15, 21, 0));
      }
      .logo-marquee::after {
        right: 0;
        transform: scaleX(-1);
      }
      .logo-track {
        display: flex;
        gap: 28px;
        align-items: center;
        will-change: transform;
      }
      .logo {
        flex: 0 0 auto;
        width: 220px;
        height: 110px;
        border: 1px solid var(--border);
        border-radius: 14px;
        background: #0e141e;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .logo img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        border-radius: 12px;
        padding: 8px;
      }
      .logo-marquee {
        overflow: hidden;
        -webkit-mask-image: linear-gradient(
          to right,
          transparent 0,
          #000 60px,
          #000 calc(100% - 60px),
          transparent 100%
        );
        mask-image: linear-gradient(
          to right,
          transparent 0,
          #000 60px,
          #000 calc(100% - 60px),
          transparent 100%
        );
      }
      /* Disclaimer */
      .disclaimer {
        margin-top: 16px;
        padding: 16px;
        border: 1px solid var(--border);
        border-radius: 14px;
        background: rgba(255, 255, 255, 0.03);
      }
      .disclaimer .disclaimer-header {
        display: flex;
        gap: 16px;
        align-items: center;
      }
      .disclaimer img {
        width: 250px;
        height: auto;
        border-radius: 10px;
        border: 1px solid var(--border);
        background: #0e141e;
        object-fit: contain;
      }
      .disclaimer p {
        margin: 8px 0;
      }

      /* === Responsive: Partners & Disclaimer === */
      @media (max-width: 900px) {
        .logo-marquee {
          padding: 12px;
        }
        .logo-marquee::before,
        .logo-marquee::after {
          width: 36px;
        }
        .logo-track {
          gap: 16px;
        }
        .logo {
          width: 180px;
          height: 90px;
          border-radius: 12px;
        }
        .logo img {
          border-radius: 10px;
        }
        .disclaimer {
          padding: 14px;
        }
        .disclaimer .disclaimer-header {
          align-items: flex-start;
        }
        .disclaimer img {
          width: 130px;
        }
      }
      @media (max-width: 700px) {
        .disclaimer {
          padding: 12px;
        }
        .disclaimer .disclaimer-header {
          flex-direction: column;
          align-items: flex-start;
          gap: 10px;
        }
        .disclaimer img {
          width: 120px;
        }
      }
      @media (max-width: 600px) {
        .logo-marquee {
          -webkit-mask-image: linear-gradient(
            to right,
            transparent 0,
            #000 28px,
            #000 calc(100% - 28px),
            transparent 100%
          );
          mask-image: linear-gradient(
            to right,
            transparent 0,
            #000 28px,
            #000 calc(100% - 28px),
            transparent 100%
          );
        }
        .card {
          padding: 16px;
        }
        .grid {
          gap: 16px;
        }
      }
      @media (max-width: 520px) {
        .topbar-inner {
          display: flex;
          flex-direction: column;
          align-items: center;
          gap: 8px;
        }
        .brand {
          width: 100%;
          display: flex;
          justify-content: center;
          min-width: 0;
        }
        .nav-actions {
          width: 100%;
          display: flex;
          justify-content: center;
        }
        .nav-actions .btn {
          width: 100%;
          max-width: 420px;
          text-align: center;
        }
      }

      /* No horizontal scroll, safe wraps */
      html,
      body {
        max-width: 100%;
        overflow-x: hidden;
      }
      p,
      li,
      .card,
      .muted {
        overflow-wrap: anywhere;
      }
      code {
        word-break: break-word;
      }

      /* Button rows wrap nicely */
      .btn-row {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
      }
      .btn-row .btn {
        flex: 1 1 220px;
      }

      /* Abstract modal */
      .topic-heading {
        margin: 12px 0 6px;
      }
      .topic-link {
        all: unset;
        cursor: pointer;
        display: inline-flex;
        gap: 6px;
        border-radius: 8px;
        padding: 4px 6px;
      }
      .topic-link:hover,
      .topic-link:focus {
        background: rgba(255, 255, 255, 0.04);
        outline: 1px dashed #2b3d55;
        outline-offset: 2px;
      }
      .modal {
        position: fixed;
        inset: 0;
        display: none;
        align-items: center;
        justify-content: center;
        background: rgba(0, 0, 0, 0.6);
        z-index: 120;
      }
      .modal.open {
        display: flex;
      }
      .modal-dialog {
        width: min(720px, 92vw);
        background: linear-gradient(180deg, #0f1520, #0c121b);
        border: 1px solid var(--border);
        border-radius: var(--radius);
        box-shadow: 0 24px 64px -20px var(--shadow);
        padding: 20px;
        color: var(--text);
        max-height: 86vh;
        overflow: auto;
      }
      .modal-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 8px;
      }
      .modal-title {
        font-size: 18px;
        margin: 0;
      }
      .icon-btn {
        appearance: none;
        border: 1px solid var(--border);
        background: #0e141e;
        color: var(--text);
        width: 36px;
        height: 36px;
        border-radius: 10px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
      }
      .icon-btn:hover {
        border-color: #2b3d55;
      }
      @media (max-width: 600px) {
        .modal-dialog {
          padding: 16px;
        }
      }