{"id":5431,"date":"2026-04-23T23:44:32","date_gmt":"2026-04-23T23:44:32","guid":{"rendered":"https:\/\/keisho.biz\/?page_id=5431"},"modified":"2026-05-02T09:16:39","modified_gmt":"2026-05-02T09:16:39","slug":"time-for-meeting","status":"publish","type":"page","link":"https:\/\/keisho.biz\/ja\/time-for-meeting\/","title":{"rendered":"Time for meeting"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"5431\" class=\"elementor elementor-5431\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4db6563 e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-parent\" data-id=\"4db6563\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ceb78f0 e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-parent\" data-id=\"ceb78f0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f76249c elementor-widget elementor-widget-html\" data-id=\"f76249c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"echo-time-planner\" id=\"echoTimePlanner\">\n  <div class=\"etp-shell\">\n    <div class=\"etp-hero\">\n      <div>\n        <div class=\"etp-kicker\">Meeting Time Planner<\/div>\n        <h2>Schedule across Tokyo, London, and San Francisco<\/h2>\n        <p>Pick one time, generate a share link, and instantly see how it looks across the three main timezones.<\/p>\n      <\/div>\n    <\/div>\n\n    <div class=\"etp-controls\">\n      <div class=\"etp-control-block\">\n        <label for=\"etpMeetingInput\">Choose meeting time<\/label>\n        <input type=\"datetime-local\" id=\"etpMeetingInput\">\n      <\/div>\n\n      <div class=\"etp-control-buttons\">\n        <button id=\"etpGenerateBtn\" class=\"etp-btn etp-btn-primary\">Generate Share Link<\/button>\n        <button id=\"etpClearBtn\" class=\"etp-btn etp-btn-secondary\" type=\"button\">Clear<\/button>\n      <\/div>\n    <\/div>\n\n    <div class=\"etp-share\">\n      <div class=\"etp-share-title\">Shareable link<\/div>\n      <div class=\"etp-share-row\">\n        <input id=\"etpShareLink\" readonly placeholder=\"Generate a link to share the selected meeting time\">\n        <button id=\"etpCopyBtn\" class=\"etp-btn etp-btn-primary\" type=\"button\">Copy<\/button>\n      <\/div>\n      <div class=\"etp-copy-status\" id=\"etpCopyStatus\"><\/div>\n    <\/div>\n\n    <div class=\"etp-selected\">\n      <div class=\"etp-section-title\">Selected meeting time<\/div>\n      <div class=\"etp-selected-grid\" id=\"etpSelectedGrid\"><\/div>\n    <\/div>\n\n    <div class=\"etp-live-section\">\n      <div class=\"etp-section-title\">Live clocks<\/div>\n      <div class=\"etp-cards\" id=\"etpCards\"><\/div>\n    <\/div>\n\n    <div class=\"etp-footer-note\">\n      Day means 06:00 to 17:59. Working hours means 09:00 to 17:59.\n    <\/div>\n  <\/div>\n<\/div>\n\n<style>\n  .echo-time-planner * {\n    box-sizing: border-box;\n  }\n\n  .echo-time-planner {\n    font-family: Inter, Arial, sans-serif;\n    color: #1f2937;\n  }\n\n  .echo-time-planner .etp-shell {\n    max-width: 980px;\n    margin: 0 auto;\n    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);\n    border: 1px solid #e5e7eb;\n    border-radius: 24px;\n    padding: 24px;\n    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.08);\n  }\n\n  .echo-time-planner .etp-hero {\n    padding: 24px;\n    border-radius: 20px;\n    background: linear-gradient(135deg, #111827 0%, #1f2937 100%);\n    color: #fff;\n  }\n\n  .echo-time-planner .etp-kicker {\n    display: inline-flex;\n    padding: 6px 10px;\n    border-radius: 999px;\n    background: rgba(255,255,255,0.12);\n    font-size: 12px;\n    font-weight: 700;\n    letter-spacing: 0.04em;\n    text-transform: uppercase;\n    margin-bottom: 12px;\n  }\n\n  .echo-time-planner .etp-hero h2 {\n    margin: 0 0 8px 0;\n    font-size: 30px;\n    line-height: 1.15;\n  }\n\n  .echo-time-planner .etp-hero p {\n    margin: 0;\n    color: rgba(255,255,255,0.8);\n    line-height: 1.55;\n    max-width: 680px;\n  }\n\n  .echo-time-planner .etp-controls {\n    display: flex;\n    justify-content: space-between;\n    align-items: end;\n    gap: 16px;\n    margin-top: 22px;\n    padding: 18px;\n    border-radius: 18px;\n    background: #ffffff;\n    border: 1px solid #e5e7eb;\n  }\n\n  .echo-time-planner .etp-control-block {\n    flex: 1;\n  }\n\n  .echo-time-planner .etp-control-block label {\n    display: block;\n    font-size: 13px;\n    font-weight: 700;\n    margin-bottom: 8px;\n    color: #374151;\n  }\n\n  .echo-time-planner input[type=\"datetime-local\"],\n  .echo-time-planner input[readonly] {\n    width: 100%;\n    padding: 14px 14px;\n    font-size: 14px;\n    border-radius: 12px;\n    border: 1px solid #d1d5db;\n    background: #fff;\n    color: #111827;\n    outline: none;\n  }\n\n  .echo-time-planner input[type=\"datetime-local\"]:focus,\n  .echo-time-planner input[readonly]:focus {\n    border-color: #111827;\n  }\n\n  .echo-time-planner .etp-control-buttons {\n    display: flex;\n    gap: 10px;\n    flex-wrap: wrap;\n  }\n\n  .echo-time-planner .etp-btn {\n    border: 0;\n    border-radius: 12px;\n    padding: 14px 16px;\n    font-weight: 700;\n    cursor: pointer;\n    transition: 0.2s ease;\n  }\n\n  .echo-time-planner .etp-btn:hover {\n    transform: translateY(-1px);\n  }\n\n  .echo-time-planner .etp-btn-primary {\n    background: #111827;\n    color: #fff;\n  }\n\n  .echo-time-planner .etp-btn-secondary {\n    background: #eef2f7;\n    color: #111827;\n  }\n\n  .echo-time-planner .etp-share,\n  .echo-time-planner .etp-selected,\n  .echo-time-planner .etp-live-section {\n    margin-top: 18px;\n    padding: 18px;\n    border-radius: 18px;\n    background: #ffffff;\n    border: 1px solid #e5e7eb;\n  }\n\n  .echo-time-planner .etp-share-title,\n  .echo-time-planner .etp-section-title {\n    font-size: 16px;\n    font-weight: 800;\n    margin-bottom: 12px;\n    color: #111827;\n  }\n\n  .echo-time-planner .etp-share-row {\n    display: grid;\n    grid-template-columns: 1fr auto;\n    gap: 10px;\n  }\n\n  .echo-time-planner .etp-copy-status {\n    margin-top: 8px;\n    font-size: 13px;\n    color: #6b7280;\n    min-height: 18px;\n  }\n\n  .echo-time-planner .etp-selected-grid {\n    display: grid;\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    gap: 12px;\n  }\n\n  .echo-time-planner .etp-selected-item {\n    padding: 16px;\n    border-radius: 16px;\n    background: #f8fafc;\n    border: 1px solid #e5e7eb;\n  }\n\n  .echo-time-planner .etp-selected-item .city {\n    font-weight: 800;\n    margin-bottom: 6px;\n  }\n\n  .echo-time-planner .etp-selected-item .meta {\n    font-size: 13px;\n    color: #6b7280;\n  }\n\n  .echo-time-planner .etp-selected-item .time {\n    margin-top: 8px;\n    font-size: 24px;\n    font-weight: 800;\n    color: #111827;\n    letter-spacing: -0.03em;\n  }\n\n  .echo-time-planner .etp-cards {\n    display: grid;\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    gap: 14px;\n  }\n\n  .echo-time-planner .etp-card {\n    position: relative;\n    overflow: hidden;\n    padding: 16px;\n    border-radius: 18px;\n    border: 1px solid #e5e7eb;\n    background: #fff;\n    min-height: 230px;\n  }\n\n  .echo-time-planner .etp-card.day {\n    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);\n  }\n\n  .echo-time-planner .etp-card.night {\n    background: linear-gradient(180deg, #111827 0%, #1f2937 100%);\n    color: #fff;\n    border-color: rgba(255,255,255,0.08);\n  }\n\n  .echo-time-planner .etp-card.night .etp-card-sub,\n  .echo-time-planner .etp-card.night .etp-card-date,\n  .echo-time-planner .etp-card.night .etp-card-meeting,\n  .echo-time-planner .etp-card.night .etp-muted {\n    color: rgba(255,255,255,0.72);\n  }\n\n  .echo-time-planner .etp-card-top {\n    display: flex;\n    justify-content: space-between;\n    align-items: start;\n    gap: 8px;\n  }\n\n  .echo-time-planner .etp-city-name {\n    font-size: 18px;\n    font-weight: 800;\n    margin: 0;\n  }\n\n  .echo-time-planner .etp-card-sub {\n    font-size: 13px;\n    color: #6b7280;\n    margin-top: 3px;\n  }\n\n  .echo-time-planner .etp-chip-group {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: flex-end;\n    gap: 6px;\n  }\n\n  .echo-time-planner .etp-chip {\n    padding: 6px 10px;\n    border-radius: 999px;\n    font-size: 12px;\n    font-weight: 700;\n    white-space: nowrap;\n  }\n\n  .echo-time-planner .etp-chip-day {\n    background: #e0f2fe;\n    color: #075985;\n  }\n\n  .echo-time-planner .etp-chip-night {\n    background: rgba(255,255,255,0.12);\n    color: #fff;\n  }\n\n  .echo-time-planner .etp-chip-work {\n    background: #dcfce7;\n    color: #166534;\n  }\n\n  .echo-time-planner .etp-chip-off {\n    background: #f3f4f6;\n    color: #6b7280;\n  }\n\n  .echo-time-planner .etp-clock-wrap {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 12px;\n    margin-top: 16px;\n  }\n\n  .echo-time-planner .etp-clock-canvas {\n    width: 86px;\n    height: 86px;\n    flex: 0 0 86px;\n  }\n\n  .echo-time-planner .etp-time-block {\n    min-width: 0;\n  }\n\n  .echo-time-planner .etp-card-time {\n    font-size: 30px;\n    line-height: 1;\n    font-weight: 800;\n    letter-spacing: -0.03em;\n  }\n\n  .echo-time-planner .etp-card-date {\n    margin-top: 8px;\n    font-size: 13px;\n    color: #6b7280;\n  }\n\n  .echo-time-planner .etp-card-meeting {\n    margin-top: 16px;\n    padding-top: 14px;\n    border-top: 1px dashed rgba(107,114,128,0.28);\n    font-size: 13px;\n    color: #6b7280;\n  }\n\n  .echo-time-planner .etp-card-meeting strong {\n    display: block;\n    margin-bottom: 4px;\n    color: inherit;\n    font-size: 12px;\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n  }\n\n  .echo-time-planner .etp-footer-note {\n    margin-top: 14px;\n    font-size: 13px;\n    color: #6b7280;\n    text-align: center;\n  }\n\n  @media (max-width: 980px) {\n    .echo-time-planner .etp-controls {\n      flex-direction: column;\n      align-items: stretch;\n    }\n\n    .echo-time-planner .etp-selected-grid,\n    .echo-time-planner .etp-cards {\n      grid-template-columns: 1fr;\n    }\n  }\n\n  @media (max-width: 640px) {\n    .echo-time-planner .etp-shell {\n      padding: 14px;\n      border-radius: 18px;\n    }\n\n    .echo-time-planner .etp-hero h2 {\n      font-size: 24px;\n    }\n\n    .echo-time-planner .etp-share-row {\n      grid-template-columns: 1fr;\n    }\n\n    .echo-time-planner .etp-card-top {\n      flex-direction: column;\n    }\n\n    .echo-time-planner .etp-chip-group {\n      justify-content: flex-start;\n    }\n  }\n<\/style>\n\n<script>\n(function() {\n  const root = document.getElementById(\"echoTimePlanner\");\n  if (!root) return;\n\n  const cityConfigs = [\n    {\n      key: \"tokyo\",\n      label: \"Tokyo\",\n      timeZone: \"Asia\/Tokyo\"\n    },\n    {\n      key: \"london\",\n      label: \"London\",\n      timeZone: \"Europe\/London\"\n    },\n    {\n      key: \"sf\",\n      label: \"San Francisco\",\n      timeZone: \"America\/Los_Angeles\"\n    }\n  ];\n\n  const cardsWrap = root.querySelector(\"#etpCards\");\n  const selectedGrid = root.querySelector(\"#etpSelectedGrid\");\n  const meetingInput = root.querySelector(\"#etpMeetingInput\");\n  const generateBtn = root.querySelector(\"#etpGenerateBtn\");\n  const clearBtn = root.querySelector(\"#etpClearBtn\");\n  const shareLinkInput = root.querySelector(\"#etpShareLink\");\n  const copyBtn = root.querySelector(\"#etpCopyBtn\");\n  const copyStatus = root.querySelector(\"#etpCopyStatus\");\n\n  let selectedMeetingDate = null;\n\n  function buildCards() {\n    cardsWrap.innerHTML = cityConfigs.map(city => `\n      <div class=\"etp-card\" id=\"etp-card-${city.key}\">\n        <div class=\"etp-card-top\">\n          <div>\n            <h3 class=\"etp-city-name\">${city.label}<\/h3>\n            <div class=\"etp-card-sub\">${city.timeZone}<\/div>\n          <\/div>\n          <div class=\"etp-chip-group\">\n            <span class=\"etp-chip\" id=\"etp-daychip-${city.key}\">Status<\/span>\n            <span class=\"etp-chip\" id=\"etp-workchip-${city.key}\">Hours<\/span>\n          <\/div>\n        <\/div>\n\n        <div class=\"etp-clock-wrap\">\n          <canvas class=\"etp-clock-canvas\" id=\"etp-canvas-${city.key}\" width=\"86\" height=\"86\"><\/canvas>\n          <div class=\"etp-time-block\">\n            <div class=\"etp-card-time\" id=\"etp-time-${city.key}\">--:--<\/div>\n            <div class=\"etp-card-date\" id=\"etp-date-${city.key}\">Loading...<\/div>\n          <\/div>\n        <\/div>\n\n        <div class=\"etp-card-meeting\" id=\"etp-meeting-${city.key}\">\n          <strong>Selected meeting<\/strong>\n          <div class=\"etp-muted\">No meeting selected yet<\/div>\n        <\/div>\n      <\/div>\n    `).join(\"\");\n  }\n\n  function getTimeParts(date, timeZone) {\n    const parts = new Intl.DateTimeFormat(\"en-US\", {\n      timeZone,\n      year: \"numeric\",\n      month: \"numeric\",\n      day: \"numeric\",\n      weekday: \"short\",\n      hour: \"numeric\",\n      minute: \"numeric\",\n      second: \"numeric\",\n      hour12: false\n    }).formatToParts(date);\n\n    const obj = {};\n    parts.forEach(p => {\n      if (p.type !== \"literal\") obj[p.type] = p.value;\n    });\n\n    return {\n      hour: Number(obj.hour),\n      minute: Number(obj.minute),\n      second: Number(obj.second)\n    };\n  }\n\n  function formatMainTime(date, timeZone) {\n    return new Intl.DateTimeFormat(\"en-US\", {\n      timeZone,\n      hour: \"2-digit\",\n      minute: \"2-digit\",\n      hour12: true\n    }).format(date);\n  }\n\n  function formatDateLine(date, timeZone) {\n    return new Intl.DateTimeFormat(\"en-US\", {\n      timeZone,\n      weekday: \"long\",\n      month: \"short\",\n      day: \"numeric\"\n    }).format(date);\n  }\n\n  function formatMeetingLine(date, timeZone) {\n    return new Intl.DateTimeFormat(\"en-US\", {\n      timeZone,\n      weekday: \"short\",\n      month: \"short\",\n      day: \"numeric\",\n      hour: \"2-digit\",\n      minute: \"2-digit\",\n      hour12: true\n    }).format(date);\n  }\n\n  function getDayState(hour) {\n    return hour >= 6 && hour < 18 ? \"day\" : \"night\";\n  }\n\n  function isWorkHours(hour) {\n    return hour >= 9 && hour < 18;\n  }\n\n  function drawClock(canvasId, hour, minute, second, state) {\n    const canvas = root.querySelector(\"#\" + canvasId);\n    if (!canvas) return;\n\n    const ctx = canvas.getContext(\"2d\");\n    const w = canvas.width;\n    const h = canvas.height;\n    const r = w \/ 2;\n\n    ctx.clearRect(0, 0, w, h);\n    ctx.save();\n    ctx.translate(r, r);\n\n    const faceBg = state === \"night\" ? \"#0f172a\" : \"#ffffff\";\n    const border = state === \"night\" ? \"rgba(255,255,255,0.22)\" : \"#d1d5db\";\n    const tick = state === \"night\" ? \"rgba(255,255,255,0.45)\" : \"#94a3b8\";\n    const hand = state === \"night\" ? \"#ffffff\" : \"#111827\";\n    const secondHand = state === \"night\" ? \"#93c5fd\" : \"#1d4ed8\";\n    const centerDot = state === \"night\" ? \"#ffffff\" : \"#111827\";\n\n    ctx.beginPath();\n    ctx.arc(0, 0, r - 3, 0, Math.PI * 2);\n    ctx.fillStyle = faceBg;\n    ctx.fill();\n    ctx.lineWidth = 2;\n    ctx.strokeStyle = border;\n    ctx.stroke();\n\n    for (let i = 0; i < 12; i++) {\n      ctx.save();\n      ctx.rotate(i * Math.PI \/ 6);\n      ctx.beginPath();\n      ctx.moveTo(0, -(r - 10));\n      ctx.lineTo(0, -(r - 16));\n      ctx.lineWidth = 2;\n      ctx.strokeStyle = tick;\n      ctx.stroke();\n      ctx.restore();\n    }\n\n    const hr = hour % 12;\n    const hourAngle = (Math.PI \/ 6) * hr + (Math.PI \/ 360) * minute + (Math.PI \/ 21600) * second;\n    const minuteAngle = (Math.PI \/ 30) * minute + (Math.PI \/ 1800) * second;\n    const secondAngle = (Math.PI \/ 30) * second;\n\n    drawHand(ctx, hourAngle, r * 0.42, 4, hand);\n    drawHand(ctx, minuteAngle, r * 0.62, 3, hand);\n    drawHand(ctx, secondAngle, r * 0.68, 1.5, secondHand);\n\n    ctx.beginPath();\n    ctx.arc(0, 0, 3.5, 0, Math.PI * 2);\n    ctx.fillStyle = centerDot;\n    ctx.fill();\n\n    ctx.restore();\n  }\n\n  function drawHand(ctx, angle, length, width, color) {\n    ctx.save();\n    ctx.rotate(angle);\n    ctx.beginPath();\n    ctx.moveTo(0, 4);\n    ctx.lineTo(0, -length);\n    ctx.lineWidth = width;\n    ctx.lineCap = \"round\";\n    ctx.strokeStyle = color;\n    ctx.stroke();\n    ctx.restore();\n  }\n\n  function renderSelectedMeeting() {\n    if (!selectedMeetingDate) {\n      selectedGrid.innerHTML = `\n        <div class=\"etp-selected-item\">\n          <div class=\"city\">No meeting selected<\/div>\n          <div class=\"meta\">Choose a date and time to preview it across Tokyo, London, and San Francisco.<\/div>\n        <\/div>\n      `;\n      return;\n    }\n\n    selectedGrid.innerHTML = cityConfigs.map(city => `\n      <div class=\"etp-selected-item\">\n        <div class=\"city\">${city.label}<\/div>\n        <div class=\"meta\">${city.timeZone}<\/div>\n        <div class=\"time\">${formatMainTime(selectedMeetingDate, city.timeZone)}<\/div>\n        <div class=\"meta\">${formatDateLine(selectedMeetingDate, city.timeZone)}<\/div>\n      <\/div>\n    `).join(\"\");\n  }\n\n  function renderCards() {\n    const now = new Date();\n\n    cityConfigs.forEach(city => {\n      const parts = getTimeParts(now, city.timeZone);\n      const state = getDayState(parts.hour);\n      const working = isWorkHours(parts.hour);\n\n      const card = root.querySelector(\"#etp-card-\" + city.key);\n      const timeEl = root.querySelector(\"#etp-time-\" + city.key);\n      const dateEl = root.querySelector(\"#etp-date-\" + city.key);\n      const meetingEl = root.querySelector(\"#etp-meeting-\" + city.key);\n      const dayChip = root.querySelector(\"#etp-daychip-\" + city.key);\n      const workChip = root.querySelector(\"#etp-workchip-\" + city.key);\n\n      if (!card || !timeEl || !dateEl || !meetingEl || !dayChip || !workChip) return;\n\n      card.classList.remove(\"day\", \"night\");\n      card.classList.add(state);\n\n      dayChip.textContent = state === \"day\" ? \"\u2600 Day\" : \"\ud83c\udf19 Night\";\n      dayChip.className = \"etp-chip \" + (state === \"day\" ? \"etp-chip-day\" : \"etp-chip-night\");\n\n      workChip.textContent = working ? \"Working Hours\" : \"Off Hours\";\n      workChip.className = \"etp-chip \" + (working ? \"etp-chip-work\" : \"etp-chip-off\");\n\n      timeEl.textContent = formatMainTime(now, city.timeZone);\n      dateEl.textContent = formatDateLine(now, city.timeZone);\n\n      if (selectedMeetingDate) {\n        meetingEl.innerHTML = `\n          <strong>Selected meeting<\/strong>\n          <div>${formatMeetingLine(selectedMeetingDate, city.timeZone)}<\/div>\n        `;\n      } else {\n        meetingEl.innerHTML = `\n          <strong>Selected meeting<\/strong>\n          <div class=\"etp-muted\">No meeting selected yet<\/div>\n        `;\n      }\n\n      drawClock(\"etp-canvas-\" + city.key, parts.hour, parts.minute, parts.second, state);\n    });\n  }\n\n  function toLocalInputValue(date) {\n    const local = new Date(date.getTime() - date.getTimezoneOffset() * 60000);\n    return local.toISOString().slice(0, 16);\n  }\n\n  function createShareUrl(date) {\n    const utcIso = date.toISOString();\n    return window.location.origin + window.location.pathname + \"?t=\" + encodeURIComponent(utcIso);\n  }\n\n  function syncShareUI() {\n    shareLinkInput.value = selectedMeetingDate ? createShareUrl(selectedMeetingDate) : \"\";\n  }\n\n  function loadFromQuery() {\n    const params = new URLSearchParams(window.location.search);\n    const t = params.get(\"t\");\n    if (!t) return;\n\n    const parsed = new Date(t);\n    if (isNaN(parsed.getTime())) return;\n\n    selectedMeetingDate = parsed;\n    meetingInput.value = toLocalInputValue(parsed);\n  }\n\n  function updateAll() {\n    syncShareUI();\n    renderSelectedMeeting();\n    renderCards();\n  }\n\n  generateBtn.addEventListener(\"click\", function() {\n    const value = meetingInput.value;\n    if (!value) return;\n\n    const picked = new Date(value);\n    if (isNaN(picked.getTime())) return;\n\n    selectedMeetingDate = picked;\n\n    history.replaceState({}, \"\", \"?t=\" + encodeURIComponent(selectedMeetingDate.toISOString()));\n    shareLinkInput.value = createShareUrl(selectedMeetingDate);\n    copyStatus.textContent = \"Link generated.\";\n    updateAll();\n  });\n\n  clearBtn.addEventListener(\"click\", function() {\n    selectedMeetingDate = null;\n    meetingInput.value = \"\";\n    shareLinkInput.value = \"\";\n    copyStatus.textContent = \"\";\n    history.replaceState({}, \"\", window.location.pathname);\n    updateAll();\n  });\n\n  copyBtn.addEventListener(\"click\", async function() {\n    if (!shareLinkInput.value) return;\n\n    try {\n      await navigator.clipboard.writeText(shareLinkInput.value);\n      copyStatus.textContent = \"Copied to clipboard.\";\n    } catch (e) {\n      shareLinkInput.select();\n      copyStatus.textContent = \"Could not auto copy. Select and copy manually.\";\n    }\n  });\n\n  buildCards();\n  loadFromQuery();\n  updateAll();\n\n  setInterval(renderCards, 1000);\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6d8900c elementor-widget elementor-widget-spacer\" data-id=\"6d8900c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\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>Meeting Time Planner Schedule across Tokyo, London, and San Francisco Pick one time, generate a share link, and instantly see how it looks across the three main timezones. Choose meeting time Generate Share Link Clear Shareable link Copy Selected meeting time Live clocks Day means 06:00 to 17:59. Working hours means 09:00 to 17:59.<\/p>","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-5431","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/keisho.biz\/ja\/wp-json\/wp\/v2\/pages\/5431","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/keisho.biz\/ja\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/keisho.biz\/ja\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/keisho.biz\/ja\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/keisho.biz\/ja\/wp-json\/wp\/v2\/comments?post=5431"}],"version-history":[{"count":19,"href":"https:\/\/keisho.biz\/ja\/wp-json\/wp\/v2\/pages\/5431\/revisions"}],"predecessor-version":[{"id":5453,"href":"https:\/\/keisho.biz\/ja\/wp-json\/wp\/v2\/pages\/5431\/revisions\/5453"}],"wp:attachment":[{"href":"https:\/\/keisho.biz\/ja\/wp-json\/wp\/v2\/media?parent=5431"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}