 <div class="front-end">
        <div class="menu">
            <nav>
                <ul>
                    <li>
                        <a href="https://inpost.jp/home">
                            <img src="img/menu/on/home.gif" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="https://inpost.jp/search">
                            <img src="img/menu/off/search.gif" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="https://inpost.jp/user-announcement">
                            <img src="img/menu/off/notification-off.gif" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="https://inpost.jp/<?php echo htmlspecialchars($id); ?>">
                            <img src="img/menu/off/user.gif" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="https://inpost.jp/library">
                            <img src="img/menu/off/library.gif" alt="">
                        </a>
                    </li>
                </ul>
                <ul>
                    <li>
                        <a href="https://inpost.jp/settings">
                            <img src="img/menu/off/settings.gif" alt="">
                        </a>
                    </li>
                </ul>
            </nav>
        </div>
        <iframe class="iframe" src="futures"></iframe>
        <div class="main">
            <div class="now-loading">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                    <path fill="#f5f5f5"
                        d="M12,0C5.4,0,0,5.4,0,12s5.4,12,12,12,12-5.4,12-12S18.6,0,12,0m0,3c5,0,9,4,9,9s-4,9-9,9S3,17,3,12,7,3,12,3" />
                    <path fill="#aaaaaa" d="M12,0c6.6,0,12,5.4,12,12h-3c0-5-4-9-9-9V0Z">
                        <animateTransform attributeName="transform" type="rotate" repeatCount="indefinite"
                            from="0 12 12" to="360 12 12" dur="1s" />
                    </path>
                </svg>
            </div>
            <div class="screen">
                <div class="tab">
                    <a href="" class="current-page">
                        ホーム
                    </a>
                    <a href="https://inpost.jp/follows-home" class="open-page">
                        フォロー
                    </a>
                </div>
                <form action="index" method="GET">
                    <div class="search">
                        <img src="img/common/search.gif" alt="">
                        <input type="text" id="input" name="search"
                            value="<?php echo htmlspecialchars(isset($_GET['search']) ? $_GET['search'] : '', ENT_QUOTES); ?>"
                            oninput="toggleDeleteIcon(this)" placeholder="チャンネルを検索..">
                        <p id="reset-text" onclick="clearInput()" style="display: none;">
                            <img src="img/common/reset-text.gif" alt="">
                        </p>
                    </div>
                </form>
                <form method="GET">
                    <div class="spots">
                        <button name="tag" value="トーク">
                            <img src="img/common/talks.gif" alt="">
                            <h2>
                                トーク
                            </h2>
                        </button>
                        <button name="tag" value="イベント">
                            <img src="img/common/events.gif" alt="">
                            <h2>
                                イベント
                            </h2>
                        </button>
                        <button name="tag" value="チャンネル">
                            <img src="img/common/channels.gif" alt="">
                            <h2>
                                チャンネル
                            </h2>
                        </button>
                    </div>
                </form>
                <form method="GET">
                    <div class="tags">
                        <button name="tag" value="しよう">
                            <img src="img/common/lets.gif" alt="">
                            <p>
                                しよう
                            </p>
                        </button>
                        <button name="tag" value="手伝って">
                            <img src="img/common/help.gif" alt="">
                            <p>
                                手伝って
                            </p>
                        </button>
                        <button name="tag" value="支援">
                            <img src="img/common/aid.gif" alt="">
                            <p>
                                支援
                            </p>
                        </button>
                        <button name="tag" value="連携">
                            <img src="img/common/collaboration.gif" alt="">
                            <p>
                                連携
                            </p>
                        </button>
                        <button name="tag" value="相談">
                            <img src="img/common/discussion.gif" alt="">
                            <p>
                                相談
                            </p>
                        </button>
                    </div>
                </form>
                <div class="user-count">
                    <span>
                        <p></p>
                        <h3>
                            <img src="img/common/user-count.gif" alt="">
                            <p>
                                Join : <?php echo htmlspecialchars($online_users); ?>
                            </p>
                        </h3>
                    </span>
                </div>
                <div class="related-user">
                    <?php foreach ($followed_users_info as $followed_user): ?>
                        <a href="https://inpost.jp/selected?user_id=<?= htmlspecialchars($followed_user['id']); ?>">
                            <label>
                                <img src="<?= $followed_user['account_image'] ?: 'img/common/default-img.gif'; ?>" alt="">
                            </label>
                            <p>
                                <?php echo htmlspecialchars($followed_user['name'] ?? '未設定'); ?>
                            </p>
                        </a>
                    <?php endforeach; ?>
                </div>
                <?php if (!empty($channels)): ?>
                    <?php foreach ($channels as $channel): ?>
                        <div class="post">
                            <label onclick="window.location.href='<?php echo htmlspecialchars($channel['id']); ?>';">
                                <img src="<?php echo htmlspecialchars($channel['account_image'] ?: 'img/common/default-img.gif'); ?>"
                                    alt="">
                            </label>
                            <div class="post-contents">
                                <span>
                                    <a class="post-user" href="<?php echo htmlspecialchars($channel['id']); ?>">
                                        <h2>
                                            <p>
                                                <?php echo htmlspecialchars($channel['name'] ?? '未設定'); ?>
                                            </p>
                                            <?php if ($channel['official'] == 1): ?>
                                                <img src="img/common/official.gif" alt="">
                                            <?php endif; ?>
                                        </h2>
                                        <p>
                                            <img src="img/common/id.gif" alt="">
                                            <?php echo htmlspecialchars($channel['id']); ?>
                                        </p>
                                    </a>
                                    <p>
                                        <?php if (!empty($channel['select_user_id'])): ?>
                                            <a class="selected-user"
                                                href="<?php echo htmlspecialchars($channel['select_user_id']); ?>">
                                                <img src="<?php echo htmlspecialchars($accounts[$channel['select_user_id']]['account_image'] ?? 'img/common/default-img.gif'); ?>"
                                                    alt="">
                                                関連
                                            </a>
                                        <?php endif; ?>
                                        <?php if ($channel['user_id'] === $_SESSION['id']): ?>
                                            <button class="option-button"
                                                onclick="openDeleteModal('<?php echo htmlspecialchars($channel['channel_id']); ?>')">
                                                <img src="img/common/option.gif" alt="">
                                            </button>
                                        <?php endif; ?>
                                    </p>
                                </span>
                                <h3>
                                    <?php echo nl2br(htmlspecialchars($channel['channel_text'])); ?>
                                    <?php if (!empty($channel['channel_image'])): ?>
                                        <img src="<?php echo htmlspecialchars($channel['channel_image']); ?>" alt="">
                                    <?php endif; ?>
                                </h3>
                                <?php if (!empty($channel['channel_message'])): ?>
                                    <h4 class="channel-message">
                                        <span>
                                            <p>
                                                <img src="img/common/channel-message.gif" alt="">
                                                <?php echo htmlspecialchars($channel['channel_message']); ?>
                                            </p>
                                            <?php if ($channel['user_id'] !== $_SESSION['id']): ?>
                                                <a href="https://inpost.jp/message?id=<?php echo htmlspecialchars($channel['id']); ?>">
                                                    <img src="img/common/message.gif" alt="">
                                                </a>
                                            <?php endif; ?>
                                        </span>
                                    </h4>
                                <?php endif; ?>
                                <?php if (!empty($channel['channel_url'])): ?>
                                    <?php
                                    $display_url = str_replace(['https://', 'http://'], '', $channel['channel_url']);
                                    $url_parts = parse_url($channel['channel_url']);
                                    $host_only = $url_parts['host'];
                                    $favicon_url = 'https://' . $host_only . '/favicon.ico';
                                    ?>
                                    <a class="url" href="<?php echo htmlspecialchars($channel['channel_url']); ?>"
                                        data-url="<?php echo htmlspecialchars($channel['channel_url']); ?>">
                                        <label>
                                            <img src="<?php echo htmlspecialchars($favicon_url); ?>" alt="">
                                        </label>
                                        <h5>
                                            <span>
                                                タイトルを読み込み中...
                                            </span>
                                            <p>
                                                <?php echo htmlspecialchars($host_only); ?>
                                            </p>
                                        </h5>
                                    </a>
                                <?php endif; ?>
                                <h6>
                                    <img src="<?php echo htmlspecialchars($channel['purpose_image']); ?>" alt="">
                                    <?php echo htmlspecialchars($channel['channel_purpose']); ?>
                                    <p>
                                        <?php echo htmlspecialchars($channel['channel_tag']); ?>
                                    </p>
                                </h6>
                                <form method="POST" action="https://inpost.jp/favorite">
                                    <span>
                                        <p>
                                            <button class="view-count">
                                                <img src="img/common/view-count.gif" alt="">
                                                <p>
                                                    <?php echo htmlspecialchars($channel['view_count']); ?>
                                                </p>
                                            </button>
                                            <button class="favorite" name="favorite_channel_id"
                                                value="<?php echo htmlspecialchars($channel['channel_id']); ?>">
                                                <img src="img/common/favorite.gif" alt="">
                                            </button>
                                            <button class="copy-url" type="button"
                                                onclick="copyChannelUrl('<?php echo htmlspecialchars($channel['channel_id']); ?>')">
                                                <img src="img/common/copy-url.gif" alt="">
                                                <p>
                                                    <?php echo htmlspecialchars($channel['created_at']); ?>
                                                </p>
                                            </button>
                                        </p>
                                        <a href="https://inpost.jp/comments?channel_id=<?php echo htmlspecialchars($channel['channel_id']); ?>"
                                            class="comment-count">
                                            <img src="img/common/comment-count.gif" alt="">
                                            <p>
                                                <?php echo $channel['comment_count']; ?>
                                            </p>
                                        </a>
                                    </span>
                                </form>
                                <?php if (!empty($first_comments[$channel['channel_id']])): ?>
                                    <div class="view-first-comment">
                                        <label>
                                            <img src="<?php echo htmlspecialchars($first_comment_images[$channel['channel_id']] ?? 'img/common/default-img.gif'); ?>"
                                                alt="">
                                        </label>
                                        <p>
                                            <?php
                                            $comment_text = htmlspecialchars($first_comments[$channel['channel_id']]);
                                            echo mb_strlen($comment_text) > 21 ? mb_substr($comment_text, 0, 21) . '...' : $comment_text;
                                            ?>
                                        </p>
                                    </div>
                                <?php endif; ?>
                            </div>
                        </div>
                        <h3 class="copying" style="opacity: 0; visibility: hidden;">
                            チャンネルリンクをコピーする
                        </h3>
                    <?php endforeach; ?>
                <?php else: ?>
                    <div class="content-not-found">
                        <h3>
                            <p>
                                コンテンツが存在しません
                            </p>
                        </h3>
                    </div>
                <?php endif; ?>
                <div class="overlay" id="delete" style="display: none;">
                    <div class="modal">
                        <img src="img/common/close-modal.gif" alt="">
                        <h3>
                            チャンネルを削除しますか？
                        </h3>
                        <form method="POST">
                            <input type="hidden" id="channel_id" name="channel_id">
                            <button class="delete-button" id="confirm-delete">
                                <font color="red">
                                    はい
                                </font>
                            </button>
                            <button type="button" class="cansel-button" id="cancel-delete" onclick="closeDeleteModal()">
                                キャンセル
                            </button>
                        </form>
                    </div>
                </div>
                <br>
                <br>
                <br>
                <br>
                <br>
                <br>
            </div>
            <a href="https://inpost.jp/messages" class="open-message-page">
                <img src="img/common/open-message-page.gif" alt="">
                <?php if ($unread_count > 0): ?>
                    <div class="new-message-icon"></div>
                <?php endif; ?>
            </a>
            <nav class="menu-bar">
                <ul>
                    <li>
                        <a href="https://inpost.jp/home">
                            <img src="img/menu/on/home.gif" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="https://inpost.jp/search">
                            <img src="img/menu/off/search.gif" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="https://inpost.jp/user-announcement">
                            <img src="<?php echo $notification_icon; ?>" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="https://inpost.jp/<?php echo htmlspecialchars($id); ?>">
                            <img src="img/menu/off/user.gif" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="https://inpost.jp/library">
                            <img src="img/menu/off/library.gif" alt="">
                        </a>
                    </li>
                </ul>
            </nav>
        </div>
    </div>