{"id":3635,"date":"2025-10-17T03:46:15","date_gmt":"2025-10-16T20:46:15","guid":{"rendered":"https:\/\/cellbio.site\/?page_id=3635"},"modified":"2025-10-17T03:46:58","modified_gmt":"2025-10-16T20:46:58","slug":"mcdi-gpt5","status":"publish","type":"page","link":"https:\/\/cellbio.site\/vi\/mcdi-gpt5\/","title":{"rendered":"mcdi-gpt5"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"3635\" class=\"elementor elementor-3635\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e2180f5 e-flex e-con-boxed e-con e-parent\" data-id=\"e2180f5\" data-element_type=\"container\" data-e-type=\"container\">\r\n\t\t\t\t\t<div class=\"e-con-inner\">\r\n\t\t\t\t<div class=\"elementor-element elementor-element-fa25681 elementor-widget elementor-widget-html\" data-id=\"fa25681\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\tD\u01b0\u1edbi \u0111\u00e2y l\u00e0 m\u00e3 HTML \u0111\u1ea7y \u0111\u1ee7 c\u1ee7a trang \u0111\u00edch l\u1eddi m\u1eddi s\u1ef1 ki\u1ec7n, \u0111\u01b0\u1ee3c t\u1ed1i \u01b0u h\u00f3a cho thi\u1ebft b\u1ecb di \u0111\u1ed9ng. Sao ch\u00e9p v\u00e0 d\u00e1n m\u00e3 HTML \u0111\u1ec3 xem ho\u1ea1t \u0111\u1ed9ng. M\u00e3 HTML \u0111\u01b0\u1ee3c l\u01b0u trong b\u1ed9 nh\u1edb c\u1ee5c b\u1ed9 c\u1ee7a tr\u00ecnh duy\u1ec7t. \u0110\u1ec3 bi\u1ebft c\u00e1ch s\u1eed d\u1ee5ng th\u1ef1c t\u1ebf, h\u00e3y tham kh\u1ea3o ph\u1ea7n t\u00edch h\u1ee3p API trong ph\u1ea7n b\u00ecnh lu\u1eadn v\u00e0 \u0111\u1ed5i th\u00e0nh b\u1ed9 nh\u1edb m\u00e1y ch\u1ee7. ```html\r\n<!DOCTYPE html>\r\n<html lang=\"ko\">\r\n<head>\r\n  <meta charset=\"utf-8\" \/>\r\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, user-scalable=no\" \/>\r\n  <title>\ubbf8\ub798\ub97c \uc5ec\ub294 MCDI | \ub77c\uc624\uae4c\uc774 \uc2dc\ubc94\uc124\uce58 \ucd08\uccad<\/title>\r\n  <meta name=\"description\" content=\"\ud55c\uad6d\uc815\ubd80 \uae30\uc220\uc9c0\uc6d0 \uc0ac\uc5c5 | \ubca0\ud2b8\ub0a8 \ucd5c\uc801\ud654 MCDI | 1\uc77c 100\ud1a4 \uc815\uc218 \uc2dc\uc2a4\ud15c | \ub77c\uc624\uae4c\uc774 \uc2dc\ubc94\uc124\uce58 | 2025\ub144 11\uc6d4 3\uc77c 17:00~20:00 | \uc138\ubbf8\ub098\u00b7\ub9cc\ucc2c \ud3ec\ud568 | \uc120\ucc29\uc21c 50\uba85 \ucd08\uccad\" \/>\r\n  <meta property=\"og:title\" content=\"\ubbf8\ub798\ub97c \uc5ec\ub294 MCDI | \ub77c\uc624\uae4c\uc774 \uc2dc\ubc94\uc124\uce58 \ucd08\uccad\" \/>\r\n  <meta property=\"og:description\" content=\"1\uc77c 100\ud1a4 \uc815\uc218 \uc2dc\uc2a4\ud15c \u00b7 O2&B \ubb34\uc0c1 \uc2dc\uc2a4\ud15c \u00b7 \uc138\ubbf8\ub098\uc640 \ub9cc\ucc2c \ud3ec\ud568 \u00b7 \uc120\ucc29\uc21c 50\uba85\" \/>\r\n  <meta property=\"og:type\" content=\"website\" \/>\r\n  <meta name=\"format-detection\" content=\"telephone=no\" \/>\r\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Noto+Sans+KR:wght@400;600;700;800&display=swap\" rel=\"stylesheet\" \/>\r\n  <style>\r\n    :root{\r\n      --bg:#0b1220;\r\n      --card:#0f1a2e;\r\n      --muted:#98a3b8;\r\n      --text:#e6edf7;\r\n      --primary:#22d3ee;\r\n      --accent:#4f46e5;\r\n      --ok:#10b981;\r\n      --warn:#f59e0b;\r\n      --danger:#ef4444;\r\n      --glass: rgba(255,255,255,.06);\r\n      --border: rgba(255,255,255,.12);\r\n      --shadow: 0 10px 40px rgba(0,0,0,.35);\r\n      --radius:16px;\r\n    }\r\n    *{box-sizing:border-box}\r\n    html,body{height:100%}\r\n    body{\r\n      margin:0;\r\n      font-family:\"Noto Sans KR\", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;\r\n      color:var(--text);\r\n      background:\r\n        radial-gradient(1200px 600px at 80% -10%, #1b2a46 0%, transparent 60%),\r\n        radial-gradient(800px 600px at -10% 30%, #0e2a35 0%, transparent 60%),\r\n        linear-gradient(180deg, #06101f, #0b1220 40%, #0b1220 100%);\r\n    }\r\n    a{color:inherit;text-decoration:none}\r\n    .container{max-width:840px;margin:0 auto;padding:18px}\r\n    header{\r\n      position:sticky;top:0;z-index:30;\r\n      backdrop-filter:saturate(140%) blur(10px);\r\n      background:linear-gradient(180deg, rgba(8,12,24,.85), rgba(8,12,24,.4));\r\n      border-bottom:1px solid var(--border);\r\n    }\r\n    .topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px}\r\n    .brand{display:flex;align-items:center;gap:10px}\r\n    .logo{\r\n      width:36px;height:36px;border-radius:10px;\r\n      background: radial-gradient(circle at 30% 30%, #22d3ee, #4f46e5 60%, #0ea5e9 100%);\r\n      box-shadow: 0 6px 20px rgba(34,211,238,.35);\r\n    }\r\n    .brand h1{font-size:16px;margin:0;font-weight:800;letter-spacing:.2px}\r\n    .brand .sub{font-size:12px;color:var(--muted)}\r\n    .cta-top{\r\n      display:inline-flex;align-items:center;gap:8px;\r\n      background:linear-gradient(135deg,var(--primary),#60a5fa);\r\n      color:#041018;padding:10px 14px;border-radius:12px;font-weight:700;\r\n      box-shadow: 0 8px 24px rgba(34,211,238,.35);\r\n      border:0;cursor:pointer\r\n    }\r\n    .cta-top:disabled{filter:grayscale(1);opacity:.6;cursor:not-allowed}\r\n\r\n    .hero{\r\n      padding:22px 18px 8px 18px;\r\n    }\r\n    .headline{\r\n      background:linear-gradient(135deg,#9ae6ff 0%, #e0e7ff 100%);\r\n      -webkit-background-clip:text;background-clip:text;color:transparent;\r\n      font-size:28px;line-height:1.2;font-weight:800;margin:6px 0 8px;\r\n      letter-spacing:-.2px;\r\n    }\r\n    .eyebrow{\r\n      display:inline-flex;gap:8px;align-items:center;\r\n      padding:6px 10px;border:1px solid var(--border);\r\n      border-radius:999px;background:var(--glass);\r\n      color:#b7c3d9;font-size:12px\r\n    }\r\n    .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}\r\n    .chip{\r\n      font-size:12px;color:#c3cfe6;border:1px dashed var(--border);\r\n      background:rgba(255,255,255,.04);padding:6px 10px;border-radius:999px\r\n    }\r\n\r\n    .panel{\r\n      background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));\r\n      border:1px solid var(--border);\r\n      border-radius:var(--radius);\r\n      box-shadow:var(--shadow);\r\n      padding:16px;\r\n      margin:16px 0;\r\n    }\r\n\r\n    .stats{\r\n      display:grid;grid-template-columns:1fr;gap:12px;\r\n    }\r\n    .countdown{\r\n      display:flex;align-items:center;justify-content:center;gap:10px;\r\n      padding:12px;border-radius:12px;background:rgba(15,26,46,.65);border:1px solid var(--border)\r\n    }\r\n    .cd-item{display:flex;flex-direction:column;align-items:center;min-width:62px}\r\n    .cd-num{\r\n      font-variant-numeric:tabular-nums;\r\n      font-size:22px;font-weight:800;padding:10px 12px;border-radius:12px;\r\n      background:linear-gradient(180deg,#0e203c, #0a1a30);\r\n      border:1px solid var(--border);box-shadow: inset 0 1px 0 rgba(255,255,255,.06);\r\n    }\r\n    .cd-label{font-size:11px;color:var(--muted);margin-top:6px}\r\n\r\n    .capacity{margin-top:8px}\r\n    .cap-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}\r\n    .cap-row .left{font-size:13px;color:#cfe3ff}\r\n    .cap-row .right{font-size:12px;color:var(--muted)}\r\n    .bar{\r\n      position:relative;height:10px;border-radius:999px;background:#0c1b2e;border:1px solid var(--border);overflow:hidden\r\n    }\r\n    .bar .fill{\r\n      position:absolute;top:0;left:0;height:100%;width:0%;\r\n      background:linear-gradient(90deg,#22d3ee,#60a5fa,#4f46e5);\r\n      transition:width .35s ease;\r\n    }\r\n\r\n    .video, .gallery, .about{margin:16px 0}\r\n    .section-title{font-weight:800;font-size:16px;margin:2px 0 10px;color:#d9e4ff}\r\n    .video-embed{\r\n      position:relative;width:100%;aspect-ratio:16\/9;border-radius:14px;\r\n      overflow:hidden;border:1px solid var(--border);background:#000\r\n    }\r\n    .video-embed iframe{position:absolute;inset:0;width:100%;height:100%}\r\n\r\n    .gallery-wrap{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--border);background:#071423}\r\n    .slides{display:flex;transition:transform .5s ease}\r\n    .slide{min-width:100%;height:220px;background-size:cover;background-position:center}\r\n    .g-nav{\r\n      position:absolute;inset:auto 0 8px 0;display:flex;justify-content:center;gap:6px;z-index:2\r\n    }\r\n    .dot{width:8px;height:8px;border-radius:999px;background:rgba(255,255,255,.35)}\r\n    .dot.active{background:#fff}\r\n\r\n    .details{\r\n      display:grid;grid-template-columns:1fr;gap:10px;margin-top:8px\r\n    }\r\n    .detail{\r\n      display:flex;gap:10px;align-items:flex-start;background:rgba(255,255,255,.04);\r\n      padding:12px;border-radius:12px;border:1px dashed var(--border)\r\n    }\r\n    .detail .icon{width:22px;height:22px;flex:0 0 22px;opacity:.9}\r\n    .detail .txt .t{font-weight:700;font-size:14px}\r\n    .detail .txt .d{font-size:13px;color:#c2cce2;margin-top:2px}\r\n\r\n    .cta-sticky{\r\n      position:sticky;bottom:0;z-index:25;padding:10px 12px;\r\n      background:linear-gradient(180deg, rgba(7,12,24,0), rgba(7,12,24,.9));\r\n      backdrop-filter:saturate(140%) blur(6px);\r\n      border-top:1px solid var(--border);\r\n    }\r\n    .cta-btn{\r\n      width:100%;display:flex;align-items:center;justify-content:center;gap:10px;\r\n      background:linear-gradient(135deg,var(--primary),#60a5fa);\r\n      color:#06121a;border:0;border-radius:14px;padding:14px 16px;font-weight:800;font-size:16px;\r\n      box-shadow:0 12px 28px rgba(34,211,238,.28);\r\n      cursor:pointer\r\n    }\r\n    .cta-btn:disabled{filter:grayscale(1);opacity:.6;cursor:not-allowed}\r\n\r\n    \/* Modal *\/\r\n    .modal{\r\n      position:fixed;inset:0;display:none;align-items:flex-end;justify-content:center;z-index:60;\r\n      background:rgba(3,6,12,.6);backdrop-filter:blur(4px)\r\n    }\r\n    .modal[open]{display:flex}\r\n    .sheet{\r\n      width:100%;max-width:840px;background:linear-gradient(180deg,#0c1730,#0b1326);\r\n      border-radius:18px 18px 0 0;border-top:1px solid var(--border);\r\n      box-shadow:var(--shadow);padding:16px\r\n    }\r\n    .sheet header{position:relative;background:none;border:0}\r\n    .sheet .title{font-weight:800;font-size:18px;margin:8px 0 10px}\r\n    .close{\r\n      position:absolute;right:6px;top:6px;background:transparent;border:0;color:#c9d6f2;font-size:22px\r\n    }\r\n\r\n    form .row{display:flex;flex-direction:column;gap:6px;margin:8px 0}\r\n    label{font-size:13px;color:#cfe3ff}\r\n    input{\r\n      width:100%;padding:12px 12px;border-radius:12px;background:#0a1a30;border:1px solid var(--border);\r\n      color:#eaf2ff;font-size:15px;outline:none\r\n    }\r\n    input::placeholder{color:#99a7c2}\r\n    input:focus{border-color:#60a5fa;box-shadow:0 0 0 3px rgba(96,165,250,.18)}\r\n    .agree{display:flex;gap:8px;align-items:flex-start;margin-top:6px;color:#b9c7e6;font-size:12px}\r\n    .submit{\r\n      margin-top:12px;width:100%;padding:14px;border-radius:14px;border:0;\r\n      background:linear-gradient(135deg,#22d3ee,#60a5fa);color:#071626;font-weight:800;font-size:16px;\r\n      cursor:pointer\r\n    }\r\n    .submit:disabled{opacity:.6;cursor:not-allowed}\r\n    .helper{font-size:12px;color:#9eb3d8;margin-top:6px}\r\n\r\n    .toast{\r\n      position:fixed;left:50%;bottom:90px;transform:translateX(-50%) translateY(20px);\r\n      background:#0f1a2e;border:1px solid var(--border);padding:12px 16px;border-radius:12px;\r\n      opacity:0;pointer-events:none;transition:all .25s ease;z-index:70\r\n    }\r\n    .toast.show{opacity:1;transform:translateX(-50%) translateY(0)}\r\n    footer{color:#8fa3c6;font-size:12px;padding:18px;text-align:center}\r\n    \/* Desktop enhancements *\/\r\n    @media(min-width:768px){\r\n      .headline{font-size:36px}\r\n      .slides .slide{height:300px}\r\n      .stats{grid-template-columns:1fr 1fr;gap:16px}\r\n      .hero{padding-top:28px}\r\n    }\r\n  <\/style>\r\n<\/head>\r\n<body>\r\n  <header>\r\n    <div class=\"topbar\">\r\n      <div class=\"brand\">\r\n        <div class=\"logo\" aria-hidden=\"true\"><\/div>\r\n        <div>\r\n          <h1>MCDI m\u1edf ra t\u01b0\u01a1ng lai<\/h1>\r\n          <div class=\"sub\">H\u1ed7 tr\u1ee3 k\u1ef9 thu\u1eadt c\u1ee7a ch\u00ednh ph\u1ee7 H\u00e0n Qu\u1ed1c \u00b7 T\u1ed1i \u01b0u h\u00f3a Vi\u1ec7t Nam<\/div>\r\n        <\/div>\r\n      <\/div>\r\n      <button class=\"cta-top\" id=\"openRegTop\">\r\n        <span>\u0110\u0103ng k\u00fd tham gia<\/span>\r\n        <span style=\"display:inline-flex;width:8px;height:8px;border-radius:999px;background:var(--ok);box-shadow:0 0 0 4px rgba(16,185,129,.18)\"><\/span>\r\n      <\/button>\r\n    <\/div>\r\n  <\/header>\r\n\r\n  <main class=\"container\">\r\n    <section class=\"hero\">\r\n      <span class=\"eyebrow\">L\u1eafp \u0111\u1eb7t th\u00ed \u0111i\u1ec3m t\u1ea1i L\u00e0o Cai \u00b7 H\u1ec7 th\u1ed1ng l\u1ecdc n\u01b0\u1edbc 100 t\u1ea5n\/ng\u00e0y<\/span>\r\n      <h2 class=\"headline\">Tr\u00ecnh di\u1ec5n c\u00f4ng ngh\u1ec7 l\u1ecdc n\u01b0\u1edbc t\u1ed1i \u01b0u t\u1ea1i Vi\u1ec7t Nam &amp; H\u1ec7 th\u1ed1ng O2&amp;B mi\u1ec5n ph\u00ed<\/h2>\r\n      <div class=\"chips\">\r\n        <div class=\"chip\">Th\u1ee9 Hai, ng\u00e0y 3 th\u00e1ng 11 n\u0103m 2025, 5:00 chi\u1ec1u\u20138:00 t\u1ed1i<\/div>\r\n        <div class=\"chip\">Bao g\u1ed3m h\u1ed9i th\u1ea3o v\u00e0 b\u1eefa t\u1ed1i<\/div>\r\n        <div class=\"chip\">L\u1eddi m\u1eddi d\u00e0nh cho 50 ng\u01b0\u1eddi \u0111\u1ea7u ti\u00ean<\/div>\r\n      <\/div>\r\n\r\n      <div class=\"panel\">\r\n        <div class=\"stats\">\r\n          <div>\r\n            <div class=\"section-title\">Cho \u0111\u1ebfn khi s\u1ef1 ki\u1ec7n b\u1eaft \u0111\u1ea7u<\/div>\r\n            <div class=\"countdown\" aria-live=\"polite\" aria-label=\"\u0110\u1ebfm ng\u01b0\u1ee3c s\u1ef1 ki\u1ec7n\">\r\n              <div class=\"cd-item\"><div class=\"cd-num\" id=\"d\">--<\/div><div class=\"cd-label\">Ng\u00e0y<\/div><\/div>\r\n              <div class=\"cd-item\"><div class=\"cd-num\" id=\"h\">--<\/div><div class=\"cd-label\">gi\u1edd<\/div><\/div>\r\n              <div class=\"cd-item\"><div class=\"cd-num\" id=\"m\">--<\/div><div class=\"cd-label\">ph\u00fat<\/div><\/div>\r\n              <div class=\"cd-item\"><div class=\"cd-num\" id=\"s\">--<\/div><div class=\"cd-label\">n\u1ebfn<\/div><\/div>\r\n            <\/div>\r\n            <div class=\"helper\">T\u00ednh \u0111\u1ebfn: 2025-11-03 17:00 (c\u00f3 th\u1ec3 thay \u0111\u1ed5i trong m\u00e3 c\u00e0i \u0111\u1eb7t m\u00fai gi\u1edd)<\/div>\r\n          <\/div>\r\n          <div>\r\n            <div class=\"section-title\">Tr\u1ea1ng th\u00e1i \u1ee9ng d\u1ee5ng<\/div>\r\n            <div class=\"capacity\">\r\n              <div class=\"cap-row\">\r\n                <div class=\"left\">\r\n                  <strong id=\"countLabel\">0<\/strong> \/ <span id=\"capLabel\">50<\/span> Ti\u1ebfp nh\u1eadn t\u00ean\r\n                <\/div>\r\n                <div class=\"right\" id=\"remainingLabel\">C\u00f2n 50 ch\u1ed7<\/div>\r\n              <\/div>\r\n              <div class=\"bar\" aria-hidden=\"true\">\r\n                <div class=\"fill\" id=\"capFill\" style=\"width:0%\"><\/div>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <button class=\"cta-btn\" id=\"openRegHero\" aria-label=\"\u0110\u0103ng k\u00fd tham gia\">\r\n        \ud83d\udce9 \u0110\u0103ng k\u00fd\r\n      <\/button>\r\n    <\/section>\r\n\r\n    <section class=\"video\">\r\n      <div class=\"section-title\">Video Thi\u1ebft b\u1ecb v\u00e0 C\u00f4ng ngh\u1ec7<\/div>\r\n      <div class=\"video-embed\" id=\"videoBox\" data-video-id=\"VIDEO_ID_\uc5ec\uae30\uc5d0_\uc785\ub825\">\r\n        <!-- \uc2e4\uc81c \uc601\uc0c1 ID\ub85c \uad50\uccb4\ud558\uc138\uc694. \uc608: data-video-id=\"PLeXAMPLE123\" -->\r\n        <iframe id=\"ytFrame\" src=\"about:blank\" title=\"Video tr\u00ean YouTube\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen referrerpolicy=\"strict-origin-when-cross-origin\"><\/iframe>\r\n      <\/div>\r\n      <div class=\"helper\">Ch\u1ec9 c\u1ea7n nh\u1eadp ID video YouTube v\u00e0o data-video-id v\u00e0 n\u00f3 s\u1ebd t\u1ef1 \u0111\u1ed9ng \u0111\u01b0\u1ee3c t\u1ea3i.<\/div>\r\n    <\/section>\r\n\r\n    <section class=\"gallery\">\r\n      <div class=\"section-title\">Duy\u1ec7t \u1ea3nh<\/div>\r\n      <div class=\"gallery-wrap\">\r\n        <div class=\"slides\" id=\"slides\">\r\n          <div class=\"slide\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1528821154947-1aa3d1b7491a?q=80&w=1400&auto=format&fit=crop');\" role=\"img\" aria-label=\"T\u1ed5ng quan v\u1ec1 nh\u00e0 m\u00e1y l\u1ecdc n\u01b0\u1edbc\"><\/div>\r\n          <div class=\"slide\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1564865878688-9a2444440429?q=80&w=1400&auto=format&fit=crop');\" role=\"img\" aria-label=\"Thi\u1ebft b\u1ecb l\u1ecdc m\u00e0ng v\u00e0 lo\u1ea1i b\u1ecf ion\"><\/div>\r\n          <div class=\"slide\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1542326237-94b1c5a538b2?q=80&w=1400&auto=format&fit=crop');\" role=\"img\" aria-label=\"L\u1eafp \u0111\u1eb7t v\u00e0 v\u1eadn h\u00e0nh t\u1ea1i ch\u1ed7\"><\/div>\r\n        <\/div>\r\n        <div class=\"g-nav\" id=\"dots\" aria-hidden=\"true\"><\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"about\">\r\n      <div class=\"section-title\">Th\u00f4ng tin s\u1ef1 ki\u1ec7n<\/div>\r\n      <div class=\"details\">\r\n        <div class=\"detail\">\r\n          <svg class=\"icon\" viewbox=\"0 0 24 24\" fill=\"none\"><path d=\"M7 10h10M7 14h6\" stroke=\"#a5b4fc\" stroke-width=\"1.6\" stroke-linecap=\"round\"\/><rect x=\"3\" y=\"4\" width=\"18\" height=\"16\" rx=\"3\" stroke=\"#60a5fa\" stroke-width=\"1.6\"\/><\/svg>\r\n          <div class=\"txt\">\r\n            <div class=\"t\">ch\u01b0\u01a1ng tr\u00ecnh<\/div>\r\n            <div class=\"d\">H\u1ed9i th\u1ea3o (gi\u1edbi thi\u1ec7u c\u00f4ng ngh\u1ec7\/H\u1ecfi &amp; \u0110\u00e1p) + tr\u00ecnh di\u1ec5n thi\u1ebft b\u1ecb + ti\u1ec7c t\u1ed1i giao l\u01b0u<\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"detail\">\r\n          <svg class=\"icon\" viewbox=\"0 0 24 24\" fill=\"none\"><path d=\"M12 6v6l4 2\" stroke=\"#34d399\" stroke-width=\"1.8\" stroke-linecap=\"round\"\/><circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"#93c5fd\" stroke-width=\"1.6\"\/><\/svg>\r\n          <div class=\"txt\">\r\n            <div class=\"t\">gi\u1edd<\/div>\r\n            <div class=\"d\">Th\u1ee9 Hai, ng\u00e0y 3 th\u00e1ng 11 n\u0103m 2025, 5:00 chi\u1ec1u\u20138:00 t\u1ed1i<\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"detail\">\r\n          <svg class=\"icon\" viewbox=\"0 0 24 24\" fill=\"none\"><path d=\"M4 7h16M4 12h16M4 17h10\" stroke=\"#22d3ee\" stroke-width=\"1.6\" stroke-linecap=\"round\"\/><\/svg>\r\n          <div class=\"txt\">\r\n            <div class=\"t\">l\u00f5i<\/div>\r\n            <div class=\"d\">Gi\u1edbi thi\u1ec7u h\u1ec7 th\u1ed1ng l\u1ecdc n\u01b0\u1edbc c\u00f4ng su\u1ea5t 100 t\u1ea5n\/ng\u00e0y, t\u1ed1i \u01b0u h\u00f3a ch\u1ea5t l\u01b0\u1ee3ng n\u01b0\u1edbc t\u1ea1i Vi\u1ec7t Nam v\u00e0 h\u1ec7 th\u1ed1ng O2&amp;B mi\u1ec5n ph\u00ed.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"detail\">\r\n          <svg class=\"icon\" viewbox=\"0 0 24 24\" fill=\"none\"><path d=\"M20 7l-8 10-4-5-4 6\" stroke=\"#fbbf24\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n          <div class=\"txt\">\r\n            <div class=\"t\">v\u01b0\u1eddn<\/div>\r\n            <div class=\"d\">50 ng\u01b0\u1eddi \u0111\u1ea7u ti\u00ean (s\u1ed1 l\u01b0\u1ee3ng theo th\u1eddi gian th\u1ef1c tr\u00ean trang n\u00e0y)<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"panel\">\r\n      <div class=\"section-title\">Ng\u01b0\u1eddi \u0111\u01b0\u1ee3c m\u1eddi<\/div>\r\n      <ul style=\"margin:6px 0 0 16px; color:#c8d6f5; font-size:14px; line-height:1.6\">\r\n        <li>C\u00e1c c\u01a1 quan ch\u00ednh quy\u1ec1n trung \u01b0\u01a1ng v\u00e0 \u0111\u1ecba ph\u01b0\u01a1ng v\u00e0 c\u00e1c t\u1eadp \u0111o\u00e0n c\u00f4ng<\/li>\r\n        <li>C\u00e1c c\u00f4ng ty li\u00ean quan \u0111\u1ebfn ng\u00e0nh c\u1ea5p tho\u00e1t n\u01b0\u1edbc, x\u1eed l\u00fd n\u01b0\u1edbc th\u1ea3i, x\u1eed l\u00fd n\u01b0\u1edbc v\u00e0 m\u00f4i tr\u01b0\u1eddng<\/li>\r\n        <li>C\u00e1c vi\u1ec7n nghi\u00ean c\u1ee9u, tr\u01b0\u1eddng \u0111\u1ea1i h\u1ecdc, t\u1ed5 ch\u1ee9c h\u1ee3p t\u00e1c ph\u00e1t tri\u1ec3n, v.v.<\/li>\r\n      <\/ul>\r\n    <\/section>\r\n\r\n    <div class=\"cta-sticky\">\r\n      <button class=\"cta-btn\" id=\"openRegSticky\">\ud83d\udce9 \u0110\u0103ng k\u00fd<\/button>\r\n    <\/div>\r\n  <\/main>\r\n\r\n  <dialog class=\"modal\" id=\"regModal\" aria-labelledby=\"regTitle\" aria-modal=\"true\">\r\n    <div class=\"sheet\">\r\n      <header>\r\n        <div class=\"title\" id=\"regTitle\">\u0110\u0103ng k\u00fd tham gia<\/div>\r\n        <button class=\"close\" id=\"closeReg\" aria-label=\"\u0111\u00f3ng\">\u2715<\/button>\r\n      <\/header>\r\n      <form id=\"regForm\" autocomplete=\"on\" action=\"\">\r\n        <div class=\"row\">\r\n          <label for=\"org\">T\u00ean c\u00f4ng ty\/t\u1ed5 ch\u1ee9c<\/label>\r\n          <input id=\"org\" name=\"org\" type=\"text\" placeholder=\"V\u00ed d\u1ee5) O2&amp;B, \u25cb\u25cb Tr\u1ee5 s\u1edf kinh doanh c\u1ee7a C\u00f4ng ty c\u1ea5p n\u01b0\u1edbc th\u00e0nh ph\u1ed1\" required \/>\r\n        <\/div>\r\n        <div class=\"row\">\r\n          <label for=\"title\">ti\u00eau \u0111\u1ec1<\/label>\r\n          <input id=\"title\" name=\"title\" type=\"text\" placeholder=\"V\u00ed d\u1ee5) Tr\u01b0\u1edfng nh\u00f3m, nh\u00e0 nghi\u00ean c\u1ee9u, gi\u00e1m \u0111\u1ed1c\" required \/>\r\n        <\/div>\r\n        <div class=\"row\">\r\n          <label for=\"name\">t\u00ean<\/label>\r\n          <input id=\"name\" name=\"name\" type=\"text\" placeholder=\"Hong Gil-dong\" required \/>\r\n        <\/div>\r\n        <div class=\"row\">\r\n          <label for=\"contact\">Th\u00f4ng tin li\u00ean l\u1ea1c (\u0111i\u1ec7n tho\u1ea1i di \u0111\u1ed9ng ho\u1eb7c email)<\/label>\r\n          <input id=\"contact\" name=\"contact\" type=\"text\" inputmode=\"email\" placeholder=\"010-1234-5678 ho\u1eb7c name@example.com\" required \/>\r\n        <\/div>\r\n        <div class=\"agree\">\r\n          <input id=\"agree\" type=\"checkbox\" required \/>\r\n          <label for=\"agree\">Th\u00f4ng tin c\u00e1 nh\u00e2n (t\u00ean, th\u00f4ng tin li\u00ean l\u1ea1c, \u0111\u01a1n v\u1ecb\/ch\u1ee9c danh) s\u1ebd ch\u1ec9 \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng cho m\u1ee5c \u0111\u00edch t\u1ed5 ch\u1ee9c s\u1ef1 ki\u1ec7n v\u00e0 s\u1ebd b\u1ecb h\u1ee7y sau khi s\u1ef1 ki\u1ec7n k\u1ebft th\u00fac.<\/label>\r\n        <\/div>\r\n        <button class=\"submit\" id=\"submitBtn\" type=\"submit\">\u00c1p d\u1ee5ng<\/button>\r\n        <div class=\"helper\">\u0110\u01a1n \u0111\u0103ng k\u00fd s\u1ebd t\u1ef1 \u0111\u1ed9ng \u0111\u00f3ng khi s\u1ed1 l\u01b0\u1ee3ng ng\u01b0\u1eddi tham gia v\u01b0\u1ee3t qu\u00e1 50.<\/div>\r\n      <input type=\"hidden\" name=\"trp-form-language\" value=\"vi\"\/><\/form>\r\n    <\/div>\r\n  <\/dialog>\r\n\r\n  <div class=\"toast\" id=\"toast\" role=\"status\" aria-live=\"polite\">B\u00e0i vi\u1ebft c\u1ee7a b\u1ea1n \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u1eadn. C\u1ea3m \u01a1n b\u1ea1n!<\/div>\r\n\r\n  <footer>\r\n    \u00a9 2025 MCDI, M\u1edf ra T\u01b0\u01a1ng lai \u00b7 Trang n\u00e0y l\u00e0 b\u1ea3n demo, \u0111\u01b0\u1ee3c l\u01b0u tr\u1eef c\u1ee5c b\u1ed9 (trong tr\u00ecnh duy\u1ec7t). C\u1ea7n t\u00edch h\u1ee3p m\u00e1y ch\u1ee7 \u0111\u1ec3 v\u1eadn h\u00e0nh th\u1ef1c t\u1ebf.\r\n  <\/footer>\r\n\r\n  <script>\r\n    \/\/ ===== \uc124\uc815 =====\r\n    const CAPACITY = 50;\r\n    \/\/ \ud589\uc0ac \uc2dc\uc791 \uc2dc\uac01: \ud55c\uad6d\uc2dc\uac04(KST, UTC+9). \ubca0\ud2b8\ub0a8\uc2dc\uac04(UTC+7)\uc73c\ub85c \ubc14\uafb8\ub824\uba74 +07:00\ub85c \ubcc0\uacbd.\r\n    const EVENT_ISO = '2025-11-03T17:00:00+09:00';\r\n\r\n    \/\/ ===== \uc800\uc7a5\uc18c \ud0a4 =====\r\n    const STORE_KEY = 'mcdi_registrations_v1';\r\n\r\n    \/\/ ===== \uc720\ud2f8 =====\r\n    const $ = (s) => document.querySelector(s);\r\n    const $$ = (s) => document.querySelectorAll(s);\r\n\r\n    function loadRegs(){\r\n      try{\r\n        const v = JSON.parse(localStorage.getItem(STORE_KEY) || '[]');\r\n        return Array.isArray(v) ? v : [];\r\n      }catch(e){ return []; }\r\n    }\r\n    function saveRegs(list){\r\n      localStorage.setItem(STORE_KEY, JSON.stringify(list));\r\n    }\r\n    function showToast(msg='\ucc98\ub9ac\ub418\uc5c8\uc2b5\ub2c8\ub2e4.'){\r\n      const t = $('#toast'); t.textContent = msg;\r\n      t.classList.add('show');\r\n      setTimeout(()=>t.classList.remove('show'), 2200);\r\n    }\r\n\r\n    \/\/ ===== \uce74\uc6b4\ud2b8\ub2e4\uc6b4 =====\r\n    function startCountdown(){\r\n      const target = new Date(EVENT_ISO).getTime();\r\n      function tick(){\r\n        const now = Date.now();\r\n        let diff = Math.max(0, target - now);\r\n        const d = Math.floor(diff \/ (1000*60*60*24)); diff -= d*24*60*60*1000;\r\n        const h = Math.floor(diff \/ (1000*60*60)); diff -= h*60*60*1000;\r\n        const m = Math.floor(diff \/ (1000*60)); diff -= m*60*1000;\r\n        const s = Math.floor(diff \/ 1000);\r\n        $('#d').textContent = String(d).padStart(2,'0');\r\n        $('#h').textContent = String(h).padStart(2,'0');\r\n        $('#m').textContent = String(m).padStart(2,'0');\r\n        $('#s').textContent = String(s).padStart(2,'0');\r\n      }\r\n      tick();\r\n      setInterval(tick, 1000);\r\n    }\r\n\r\n    \/\/ ===== \uc6a9\ub7c9 \ud45c\uc2dc =====\r\n    function updateCapacityUI(){\r\n      const regs = loadRegs();\r\n      const count = regs.length;\r\n      const remaining = Math.max(0, CAPACITY - count);\r\n      $('#countLabel').textContent = count;\r\n      $('#capLabel').textContent = CAPACITY;\r\n      $('#remainingLabel').textContent = remaining === 0 ? '\ub9c8\uac10' : `\ub0a8\uc740 \uc88c\uc11d ${remaining}`;\r\n      const fill = Math.min(100, Math.round((count \/ CAPACITY) * 100));\r\n      $('#capFill').style.width = fill + '%';\r\n\r\n      const disabled = count >= CAPACITY;\r\n      ['#openRegTop','#openRegHero','#openRegSticky','#submitBtn'].forEach(sel=>{\r\n        const el = $(sel); if(!el) return;\r\n        el.disabled = disabled;\r\n      });\r\n      if(disabled){\r\n        $('#submitBtn') && ($('#submitBtn').textContent = '\ub9c8\uac10\ub418\uc5c8\uc2b5\ub2c8\ub2e4');\r\n      }else{\r\n        $('#submitBtn') && ($('#submitBtn').textContent = '\uc811\uc218\ud558\uae30');\r\n      }\r\n    }\r\n\r\n    \/\/ ===== \uc911\ubcf5 \uccb4\ud06c: \uc5f0\ub77d\ucc98 \uae30\uc900 =====\r\n    function isDuplicateContact(contact){\r\n      const regs = loadRegs();\r\n      return regs.some(r => (r.contact || '').trim().toLowerCase() === contact.trim().toLowerCase());\r\n    }\r\n\r\n    \/\/ ===== \uac04\ub2e8\ud55c \uc720\ud6a8\uc131 \uac80\uc0ac =====\r\n    function validContact(v){\r\n      const s = v.trim();\r\n      const email = \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/i.test(s);\r\n      const phone = \/^(0\\d{1,2}-?\\d{3,4}-?\\d{4}|0\\d{8,10}|\\+?\\d{7,15})$\/.test(s.replace(\/\\s\/g,''));\r\n      return email || phone;\r\n    }\r\n\r\n    \/\/ ===== \ub4f1\ub85d \uc800\uc7a5 (\ub85c\uceec \uc800\uc7a5) =====\r\n    function saveRegistration(data){\r\n      const regs = loadRegs();\r\n      regs.push({\r\n        ...data,\r\n        ts: Date.now()\r\n      });\r\n      saveRegs(regs);\r\n      updateCapacityUI();\r\n      return true;\r\n    }\r\n\r\n    \/* ===== \uc11c\ubc84 \uc5f0\ub3d9 \uc608\uc2dc (\uc6b4\uc601 \uad8c\uc7a5) =====\r\n    async function saveRegistrationToServer(data){\r\n      const res = await fetch('https:\/\/YOUR_API_ENDPOINT\/registrations', {\r\n        method:'POST',\r\n        headers:{'Content-Type':'application\/json'},\r\n        body:JSON.stringify(data)\r\n      });\r\n      if(!res.ok) throw new Error('\uc11c\ubc84 \uc800\uc7a5 \uc2e4\ud328');\r\n      const { total } = await res.json(); \/\/ \uc11c\ubc84\uac00 \ucd1d \uc778\uc6d0 \ubc18\ud658\ud55c\ub2e4\uace0 \uac00\uc815\r\n      return total; \/\/ total\uc744 UI\uc5d0 \ubc18\uc601\ud558\ub3c4\ub85d updateCapacityUI\ub300\uc2e0 \uc0ac\uc6a9\r\n    }\r\n    *\/\r\n\r\n    \/\/ ===== \ubaa8\ub2ec =====\r\n    const regModal = $('#regModal');\r\n    function openModal(){\r\n      regModal.setAttribute('open','');\r\n      document.body.style.overflow='hidden';\r\n      $('#org').focus();\r\n    }\r\n    function closeModal(){\r\n      regModal.removeAttribute('open');\r\n      document.body.style.overflow='';\r\n      $('#regForm').reset();\r\n    }\r\n\r\n    \/\/ ===== YouTube ID \ub85c\ub529 =====\r\n    function loadYouTube(){\r\n      const box = $('#videoBox');\r\n      const vid = (box.getAttribute('data-video-id') || '').trim();\r\n      const frame = $('#ytFrame');\r\n      if(vid && vid !== 'VIDEO_ID_\uc5ec\uae30\uc5d0_\uc785\ub825'){\r\n        const src = `https:\/\/www.youtube.com\/embed\/${encodeURIComponent(vid)}?rel=0&modestbranding=1&playsinline=1`;\r\n        frame.src = src;\r\n      }else{\r\n        frame.src = 'https:\/\/www.youtube.com\/embed\/1La4QzGeaaQ?rel=0&modestbranding=1&playsinline=1';\r\n        \/\/ \uc704\ub294 \uc0d8\ud50c \uc601\uc0c1\uc785\ub2c8\ub2e4. data-video-id\ub85c \uad50\uccb4\ud558\uc138\uc694.\r\n      }\r\n    }\r\n\r\n    \/\/ ===== \uc2ac\ub77c\uc774\ub354 =====\r\n    let slideIndex = 0, slideCount = 0, sliderTimer = null, touchStartX = 0, touchEndX = 0;\r\n    function initSlider(){\r\n      const slides = $('#slides');\r\n      slideCount = slides.children.length;\r\n      const dots = $('#dots');\r\n      dots.innerHTML = '';\r\n      for(let i=0;i<slideCount;i++){\r\n        const d = document.createElement('div');\r\n        d.className = 'dot' + (i===0 ? ' active':'');\r\n        d.dataset.index = i;\r\n        d.addEventListener('click', ()=>goSlide(i,true));\r\n        dots.appendChild(d);\r\n      }\r\n      const wrap = slides.parentElement;\r\n      wrap.addEventListener('touchstart', e=>{ touchStartX = e.changedTouches[0].screenX; });\r\n      wrap.addEventListener('touchend', e=>{\r\n        touchEndX = e.changedTouches[0].screenX;\r\n        const dx = touchEndX - touchStartX;\r\n        if(Math.abs(dx) > 40){\r\n          if(dx < 0) goSlide(Math.min(slideIndex+1, slideCount-1), true);\r\n          else goSlide(Math.max(slideIndex-1, 0), true);\r\n        }\r\n      });\r\n      autoSlide();\r\n      window.addEventListener('visibilitychange', ()=>{\r\n        if(document.hidden){ clearInterval(sliderTimer); }\r\n        else autoSlide();\r\n      });\r\n    }\r\n    function goSlide(i, stopAuto=false){\r\n      slideIndex = i;\r\n      const slides = $('#slides');\r\n      slides.style.transform = `translateX(-${i*100}%)`;\r\n      $$('#dots .dot').forEach((d,idx)=>d.classList.toggle('active', idx===i));\r\n      if(stopAuto){ clearInterval(sliderTimer); autoSlide(); }\r\n    }\r\n    function autoSlide(){\r\n      clearInterval(sliderTimer);\r\n      sliderTimer = setInterval(()=>{\r\n        slideIndex = (slideIndex + 1) % slideCount;\r\n        goSlide(slideIndex,false);\r\n      }, 3500);\r\n    }\r\n\r\n    \/\/ ===== \ucd08\uae30\ud654 =====\r\n    document.addEventListener('DOMContentLoaded', ()=>{\r\n      \/\/ \ubc84\ud2bc \ubc14\uc778\ub529\r\n      ['#openRegTop','#openRegHero','#openRegSticky'].forEach(sel=>{\r\n        const el = $(sel); el && el.addEventListener('click', openModal);\r\n      });\r\n      $('#closeReg').addEventListener('click', closeModal);\r\n      $('#regModal').addEventListener('click', (e)=>{ if(e.target.id==='regModal') closeModal(); });\r\n\r\n      \/\/ \ud3fc \uc81c\ucd9c\r\n      $('#regForm').addEventListener('submit', async (e)=>{\r\n        e.preventDefault();\r\n        const count = loadRegs().length;\r\n        if(count >= CAPACITY){\r\n          showToast('\uc815\uc6d0\uc774 \ub9c8\uac10\ub418\uc5c8\uc2b5\ub2c8\ub2e4.');\r\n          updateCapacityUI();\r\n          return;\r\n        }\r\n        const org = $('#org').value.trim();\r\n        const title = $('#title').value.trim();\r\n        const name = $('#name').value.trim();\r\n        const contact = $('#contact').value.trim();\r\n        const agree = $('#agree').checked;\r\n\r\n        if(!org || !title || !name || !contact || !agree){\r\n          showToast('\ud544\uc218 \ud56d\ubaa9\uc744 \ud655\uc778\ud574\uc8fc\uc138\uc694.');\r\n          return;\r\n        }\r\n        if(!validContact(contact)){\r\n          showToast('\uc5f0\ub77d\ucc98 \ud615\uc2dd\uc744 \ud655\uc778\ud574\uc8fc\uc138\uc694.');\r\n          $('#contact').focus();\r\n          return;\r\n        }\r\n        if(isDuplicateContact(contact)){\r\n          showToast('\uc774\ubbf8 \uc811\uc218\ub41c \uc5f0\ub77d\ucc98\uc785\ub2c8\ub2e4.');\r\n          return;\r\n        }\r\n\r\n        const data = { org, title, name, contact };\r\n        \/\/ \ub85c\uceec \uc800\uc7a5\r\n        const ok = saveRegistration(data);\r\n        if(ok){\r\n          closeModal();\r\n          showToast('\uc811\uc218\ub418\uc5c8\uc2b5\ub2c8\ub2e4. \uac10\uc0ac\ud569\ub2c8\ub2e4!');\r\n        }\r\n\r\n        \/* \uc11c\ubc84 \uc800\uc7a5(\uc6b4\uc601) \uc0ac\uc6a9 \uc2dc:\r\n        try{\r\n          const total = await saveRegistrationToServer(data);\r\n          closeModal();\r\n          showToast('\uc811\uc218\ub418\uc5c8\uc2b5\ub2c8\ub2e4. \uac10\uc0ac\ud569\ub2c8\ub2e4!');\r\n          \/\/ \uc11c\ubc84 total\uc744 \uc0ac\uc6a9\ud558\uc5ec UI \uac31\uc2e0\r\n          \/\/ \ucee4\uc2a4\ud140: updateCapacityUIFromServer(total);\r\n        }catch(err){\r\n          console.error(err);\r\n          showToast('\uc11c\ubc84 \uc624\ub958\ub85c \uc811\uc218\uc5d0 \uc2e4\ud328\ud588\uc2b5\ub2c8\ub2e4.');\r\n        }\r\n        *\/\r\n      });\r\n\r\n      \/\/ UI \ucd08\uae30 \uc0c1\ud0dc\r\n      updateCapacityUI();\r\n      startCountdown();\r\n      loadYouTube();\r\n      initSlider();\r\n    });\r\n  <\/script>\r\n<\/body>\r\n<\/html>\r\n``` T\u00f3m t\u1eaft m\u00f4 t\u1ea3 - L\u01b0u \u0111\u0103ng k\u00fd: \u0110\u0103ng k\u00fd \u0111\u01b0\u1ee3c l\u01b0u trong localStorage c\u1ee7a tr\u00ecnh duy\u1ec7t v\u00e0 b\u1ed9 \u0111\u1ebfm \u0111\u01b0\u1ee3c c\u1eadp nh\u1eadt theo th\u1eddi gian th\u1ef1c. Khi \u0111\u1ea1t \u0111\u1ebfn 50 ng\u01b0\u1eddi, n\u00fat s\u1ebd t\u1ef1 \u0111\u1ed9ng b\u1ecb v\u00f4 hi\u1ec7u h\u00f3a v\u00e0 \u0111\u01b0\u1ee3c \u0111\u00e1nh d\u1ea5u l\u00e0 &quot;\u0110\u00e3 \u0111\u00f3ng&quot;. - B\u1ed9 \u0111\u1ebfm th\u1eddi gian: \u0110\u1ebfm ng\u01b0\u1ee3c d\u1ef1a tr\u00ean 17:00 ng\u00e0y 03\/11\/2025. \u0110\u1ec3 chuy\u1ec3n sang gi\u1edd Vi\u1ec7t Nam, h\u00e3y \u0111\u1ed5i +09:00 trong EVENT_ISO th\u00e0nh +07:00. - Video YouTube: Video s\u1ebd t\u1ef1 \u0111\u1ed9ng t\u1ea3i n\u1ebfu b\u1ea1n ch\u1ec9 c\u1ea7n nh\u1eadp ID video th\u1ef1c t\u1ebf v\u00e0o thu\u1ed9c t\u00ednh data-video-id. - Tr\u00ecnh chi\u1ebfu \u1ea3nh: H\u1ed7 tr\u1ee3 t\u1ef1 \u0111\u1ed9ng ph\u00e1t v\u00e0 vu\u1ed1t ch\u1ea1m. M\u1eb9o v\u1eadn h\u00e0nh - Hi\u1ec7n t\u1ea1i, video \u0111\u01b0\u1ee3c l\u01b0u c\u1ee5c b\u1ed9, do \u0111\u00f3 \u0111\u01b0\u1ee3c l\u01b0u ri\u00eang cho t\u1eebng tr\u00ecnh duy\u1ec7t c\u1ee7a ng\u01b0\u1eddi d\u00f9ng. N\u1ebfu b\u1ea1n c\u1ea7n s\u1ed1 li\u1ec7u th\u1ed1ng k\u00ea th\u1ef1c t\u1ebf, h\u00e3y k\u1ebft n\u1ed1i API m\u00e1y ch\u1ee7 nh\u01b0 trong v\u00ed d\u1ee5 saveRegistrationToServer trong ph\u1ea7n b\u00ecnh lu\u1eadn \u0111\u1ec3 qu\u1ea3n l\u00fd t\u1ed5ng s\u1ed1 ng\u01b0\u1eddi \u0111\u0103ng k\u00fd.\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>\uc544\ub798\ub294 \ubaa8\ubc14\uc77c\uc5d0 \ucd5c\uc801\ud654\ub41c \ud589\uc0ac \ucd08\uccad \ub79c\ub529\ud398\uc774\uc9c0 \uc804\uccb4 HTML\uc785\ub2c8\ub2e4. \uadf8\ub300\ub85c \ubcf5\uc0ac\ud574 \ubd99\uc5ec\ub123\uc73c\uba74 \ub3d9\uc791\ud569\ub2c8\ub2e4. \uc800\uc7a5\uc740 \ube0c\ub77c\uc6b0\uc800\uc758 \ub85c\uceec \uc800\uc7a5\uc18c(localStorage)\uc5d0 \uc800\uc7a5\ub418\uba70, \uc2e4\uc81c \uc6b4\uc601 \uc2dc\uc5d0\ub294 \uc8fc\uc11d\uc758 API \uc5f0\ub3d9 \ubd80\ubd84\uc744 \ucc38\uace0\ud574 \uc11c\ubc84 \uc800\uc7a5\uc73c\ub85c \ubc14\uafd4\uc8fc\uc138\uc694. &#8220;`html \ubbf8\ub798\ub97c \uc5ec\ub294 MCDI | \ub77c\uc624\uae4c\uc774 \uc2dc\ubc94\uc124\uce58 \ucd08\uccad \ubbf8\ub798\ub97c \uc5ec\ub294 MCDI \ud55c\uad6d\uc815\ubd80 \uae30\uc220\uc9c0\uc6d0 \u00b7 \ubca0\ud2b8\ub0a8 \ucd5c\uc801\ud654 \ucc38\uac00\ub4f1\ub85d \ub77c\uc624\uae4c\uc774 \uc2dc\ubc94\uc124\uce58 \u00b7 1\uc77c 100\ud1a4 \uc815\uc218 \uc2dc\uc2a4\ud15c \ubca0\ud2b8\ub0a8 \ud604\uc9c0 \ucd5c\uc801\ud654 [&hellip;]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"wf_page_folders":[],"class_list":["post-3635","page","type-page","status-publish","format-standard","hentry"],"acf":[],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/cellbio.site\/vi\/wp-json\/wp\/v2\/pages\/3635","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cellbio.site\/vi\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cellbio.site\/vi\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cellbio.site\/vi\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cellbio.site\/vi\/wp-json\/wp\/v2\/comments?post=3635"}],"version-history":[{"count":0,"href":"https:\/\/cellbio.site\/vi\/wp-json\/wp\/v2\/pages\/3635\/revisions"}],"wp:attachment":[{"href":"https:\/\/cellbio.site\/vi\/wp-json\/wp\/v2\/media?parent=3635"}],"wp:term":[{"taxonomy":"wf_page_folders","embeddable":true,"href":"https:\/\/cellbio.site\/vi\/wp-json\/wp\/v2\/wf_page_folders?post=3635"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}