『안녕』 당신은 말하고 있다 <div id="click-counter" style="text-align:center; font-size:1em; padding:50px;"> <br> <span id="count">0</span> / 2 </div> [[안녕.]] <script> setTimeout(function() { var clickCount = 0; var countDisplay = document.getElementById('count'); var link = document.querySelector('tw-link'); // 링크 숨기기 if (link) { link.style.display = 'none'; } // 화면 아무데나 클릭 감지 document.addEventListener('click', function() { clickCount++; countDisplay.textContent = clickCount; if (clickCount >= 2) { if (link) { link.click(); } } }); }, 100); </script> 누가 듣는다고 [[계속]] 말하는지? 당신은 하고 싶은 [[말]] 이 있어 보인다당신의 앞에 [[의사]] 가 놓일 것이다의사는 [[흰]] 가운을 입었고 모든 의사를 [[대표]] 한다<style> ::selection { background-color: #ffffff; /* 흰색 배경 */ color: #ffffff; /* 검은 글자 */ text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } ::-moz-selection { background-color: #ffffff; color: #ffffff; } ::-webkit-selection { background-color: #ffffff; color: #ffffff; text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } </style> 나아가 전 <b>인류</b>를······ <div id="drag-text">◥████◣ │田│▤╠╣▤│ ╱◥████◣ ╱◥◣ ╱◥◣║ ▤∩▤║║田│║ │田│◥███◣╱◥███◣ ╱◥◣ ◥███◣ 田 ∩│▤║ ╱◥◣│╱◥█◣║∩∩∩║◥███◣ ║田 ││田│∩║ 田∩田 ║田∩田 ║</div> <div style="display:none;">[[인류]]</div> <script> setTimeout(function() { var link = document.querySelector('tw-link'); if (link) { document.getElementById('drag-text').addEventListener('mouseup', function() { if (window.getSelection().toString().length > 0) { link.click(); } }); } }, 200); </script> <div class="footnote">//*drag//</div> 오늘 아침 당신은······ 『[[걷는다]]』 『[[운다]]』 『[[고통]]』 <div id="jong-text"></div> <script> setTimeout(function() { animateJongseonWithMove("당신", "jong-text"); }, 100); </script> [[>]]<div class="simple-rain"> <span style="--i:0">당</span><span style="--i:1">신</span><span style="--i:2">당</span><span style="--i:3">신</span><span style="--i:4"> </span><span style="--i:5">당</span><span style="--i:6">신</span> </div> [[>>]]<style> ::selection { background-color: #ffffff; /* 흰색 배경 */ color: #ffffff; /* 검은 글자 */ text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } ::-moz-selection { background-color: #ffffff; color: #ffffff; } ::-webkit-selection { background-color: #ffffff; color: #ffffff; text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } </style> 당신은 <div id="drag-text">류마티즘 </div><span id="hidden-link">[[류마티즘]]</span> <script> setTimeout(function() { document.getElementById('hidden-link').style.display = 'none'; var link = document.querySelector('#hidden-link tw-link'); if (link) { document.getElementById('drag-text').addEventListener('mouseup', function() { if (window.getSelection().toString().length > 0) { link.click(); } }); }}, 200);</script> 이 된다 <div class="footnote">//*drag//</div><div id="jong-text"></div> <script> setTimeout(function() { animateJongseonWithMove("당신", "jong-text"); }, 100); </script> <!-- 링크로 만들기 --> <span class="badge-icon">[[병원]]</span><style> ::selection { background-color: #ffffff; /* 흰색 배경 */ color: #ffffff; /* 검은 글자 */ text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } ::-moz-selection { background-color: #ffffff; color: #ffffff; } ::-webkit-selection { background-color: #ffffff; color: #ffffff; text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } </style> 당신이 원하는 것은 <div id="drag-text">■┃■■■┃■■■┃■■■┃■■■┃■■■┃■■ ┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻ </div> <div style="display:none;">[[.]]</div> <script> setTimeout(function() { var link = document.querySelector('tw-link'); if (link) { document.getElementById('drag-text').addEventListener('mouseup', function() { if (window.getSelection().toString().length > 0) { link.click(); } }); } }, 200); </script> <div class="footnote">//*drag//</div><style> ::selection { background-color: #ffffff; /* 흰색 배경 */ color: #ffffff; /* 검은 글자 */ text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } ::-moz-selection { background-color: #ffffff; color: #ffffff; } ::-webkit-selection { background-color: #ffffff; color: #ffffff; text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } </style> 그러니까 오늘 아침에 눈을 떴을 때, 당신은 스스로가 <div id="drag-text">기압계 </div> <div style="display:none;">[[기압계]]</div> <script> setTimeout(function() { var link = document.querySelector('tw-link'); if (link) { document.getElementById('drag-text').addEventListener('mouseup', function() { if (window.getSelection().toString().length > 0) { link.click(); } }); } }, 200); </script> 가 되었다는 사실을 알아차린 것이다거꾸로 매달린 온습도 기압계의 형상 <div id="drag-container" style=" position:relative; margin:100px auto 0 auto; /* 위쪽 여백 100px, 좌우 auto로 가로 중앙 */ width: 200px; /* 글자 4개 들어갈 만큼만 폭 고정 */ white-space:nowrap; "> <span id="char1" style="position:absolute; left:0; top:0; cursor:move; font-size:20px;">V</span> <span id="char2" style="position:absolute; left:40px; top:0; cursor:move; font-size:20px;">|</span> <span id="char3" style="position:absolute; left:80px; top:0; cursor:move; font-size:20px;"> ̄</span> <span id="char4" style="position:absolute; left:120px; top:0; cursor:move; font-size:20px;">O</span> </div> <div style="position:absolute; left:50%; transform:translateX(-50%); top:250px; line-height:0;"> <div id="target1" style="width:20px; height:20px; border:1px dashed lightgray; margin:0 auto; line-height:20px;"></div> <div id="target2" style="width:20px; height:20px; border:1px dashed lightgray; margin:0 auto; line-height:20px;"></div> <div id="target3" style="width:20px; height:20px; border:1px dashed lightgray; margin:0 auto; line-height:20px;"></div> <div id="target4" style="width:20px; height:20px; border:1px dashed lightgray; margin:0 auto; line-height:20px;"></div> </div> <span style="display:none;">[[O]]</span> <script> window.setupDragGame([ {draggableId: 'char1', targetId: 'target1'}, {draggableId: 'char2', targetId: 'target2'}, {draggableId: 'char3', targetId: 'target3'}, {draggableId: 'char4', targetId: 'target4'} ]); </script> 그 안의 바늘이 어디를 향하고 있는지 <div class="tiny-clock" style="position:relative;"> <div class="tiny-hand tiny-hour"></div> <div class="tiny-hand tiny-minute"></div> <div class="tiny-hand tiny-second"></div> <span id="center-text">●</span> </div> <div id="target-area"></div> [[바늘]] <script> (function() { var attempts = 0; var checkInterval = setInterval(function() { var centerText = document.getElementById('center-text'); var clock = document.querySelector('.tiny-clock'); var link = document.querySelector('tw-link'); if (centerText && clock && link) { clearInterval(checkInterval); link.style.display = 'none'; // 1. 시작 위치: 시계 바깥 (예: 화면 왼쪽 위 근처) centerText.style.position = 'fixed'; centerText.style.left = '20%'; centerText.style.top = '20%'; centerText.style.transform = 'none'; centerText.style.color = 'white'; centerText.style.fontSize = '0.5em'; centerText.style.zIndex = '100'; centerText.style.cursor = 'move'; var isDragging = false; var offsetX = 0; var offsetY = 0; centerText.addEventListener('mousedown', function(e) { isDragging = true; e.preventDefault(); var rect = centerText.getBoundingClientRect(); offsetX = e.clientX - rect.left; offsetY = e.clientY - rect.top; }); document.addEventListener('mousemove', function(e) { if (!isDragging) return; var x = e.clientX - offsetX; var y = e.clientY - offsetY; centerText.style.left = x + 'px'; centerText.style.top = y + 'px'; }); document.addEventListener('mouseup', function(e) { if (!isDragging) return; isDragging = false; var clockRect = clock.getBoundingClientRect(); var textRect = centerText.getBoundingClientRect(); // 2. ●이 시계 위에 들어왔는지 확인 var insideClock = textRect.left < clockRect.right && textRect.right > clockRect.left && textRect.top < clockRect.bottom && textRect.bottom > clockRect.top; if (insideClock) { // 3. 시계 정중앙으로 스냅 centerText.style.position = 'absolute'; centerText.style.left = '50%'; centerText.style.top = '50%'; centerText.style.transform = 'translate(-50%, -50%)'; // 4. 그리고 페이지 이동 link.click(); } }); } attempts++; if (attempts > 20) { clearInterval(checkInterval); } }, 100); })(); </script> 정지한 바늘을 관찰하기 위해 당신은 바늘을 [[적는다]]<div id="rain1" class="text-rain"></div> <script> makeTextRain("당신당신당신", "rain1"); </script> 당신은 [[고통]]의사는 당신에게 물을 것이다 당신의 고통이 여느때처럼 콕콕 쑤시는 형태인지 <div id="click-counter" style="text-align:center; font-size:1em; padding:50px;"> <br> <span id="count">0</span> / 10 </div> [[.....]] <script> setTimeout(function() { var clickCount = 0; var countDisplay = document.getElementById('count'); var link = document.querySelector('tw-link'); // 링크 숨기기 if (link) { link.style.display = 'none'; } // 화면 아무데나 클릭 감지 document.addEventListener('click', function() { clickCount++; countDisplay.textContent = clickCount; if (clickCount >= 10) { if (link) { link.click(); } } }); }, 100); </script> <style> ::selection { background-color: #ffffff; /* 흰색 배경 */ color: #ffffff; /* 검은 글자 */ text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } ::-moz-selection { background-color: #ffffff; color: #ffffff; } ::-webkit-selection { background-color: #ffffff; color: #ffffff; text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } </style> 단지 <div id="drag-text">●▅▇█▇▆▅▄▇ </div> <div style="display:none;">[[..]]</div> <script> setTimeout(function() { var link = document.querySelector('tw-link'); if (link) { document.getElementById('drag-text').addEventListener('mouseup', function() { if (window.getSelection().toString().length > 0) { link.click(); } }); } }, 200); </script> <div class="footnote">//*drag//</div><style> ::selection { background-color: #ffffff; /* 흰색 배경 */ color: #ffffff; /* 검은 글자 */ text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } ::-moz-selection { background-color: #ffffff; color: #ffffff; } ::-webkit-selection { background-color: #ffffff; color: #ffffff; text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } </style> 단지 <div id="drag-text">당신을 읽어주는 것 </div> <div style="display:none;">[[...]]</div> <script> setTimeout(function() { var link = document.querySelector('tw-link'); if (link) { document.getElementById('drag-text').addEventListener('mouseup', function() { if (window.getSelection().toString().length > 0) { link.click(); } }); } }, 200); </script> <div class="footnote">//*drag//</div><style> ::selection { background-color: #ffffff; /* 흰색 배경 */ color: #ffffff; /* 검은 글자 */ text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } ::-moz-selection { background-color: #ffffff; color: #ffffff; } ::-webkit-selection { background-color: #ffffff; color: #ffffff; text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } </style> <div id="drag-text">·················· </div> <div style="display:none;">[[....]]</div> <script> setTimeout(function() { var link = document.querySelector('tw-link'); if (link) { document.getElementById('drag-text').addEventListener('mouseup', function() { if (window.getSelection().toString().length > 0) { link.click(); } }); } }, 200); </script> <div class="footnote">//*drag//</div><style> ::selection { background-color: #ffffff; /* 흰색 배경 */ color: #ffffff; /* 검은 글자 */ text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } ::-moz-selection { background-color: #ffffff; color: #ffffff; } ::-webkit-selection { background-color: #ffffff; color: #ffffff; text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } </style> <div id="catch-area" style="position:relative; width:100%; height:400px; overflow:hidden;"> </div> 당신은 고통을 잡아보려고 한다 </div> [[병원]] <script> setTimeout(function() { var area = document.getElementById('catch-area'); var link = document.querySelector('tw-link'); link.style.display = 'none'; var words = ['콕', '콕', '콕', '콕', '콕']; var caught = 0; var needed = words.length; words.forEach(function(word, index) { setTimeout(function() { var letter = document.createElement('div'); letter.textContent = word; letter.style.position = 'absolute'; letter.style.left = (20 + index * 15) + '%'; letter.style.top = '0'; letter.style.fontSize = '1em'; letter.style.cursor = 'pointer'; letter.style.animation = 'fall-down ' + (3 + Math.random() * 2) + 's linear infinite'; area.appendChild(letter); letter.addEventListener('click', function() { this.remove(); caught++; if (caught >= needed) { link.click(); } }); }, index * 500); }); }, 100); </script> <style> ::selection { background-color: #ffffff; /* 흰색 배경 */ color: #ffffff; /* 검은 글자 */ text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } ::-moz-selection { background-color: #ffffff; color: #ffffff; } ::-webkit-selection { background-color: #ffffff; color: #ffffff; text-shadow: 0 0 15px rgba(0, 0, 0, 0.8), 0 0 30px rgba(0, 0, 0, 0.6), 0 0 45px rgba(0, 0, 0, 0.4); } </style> <div id="catch-area" style="position:relative; width:100%; height:400px; overflow:hidden;"> </div> 플레이어는 당신을 알게 될까 [[......]] <script> setTimeout(function() { var area = document.getElementById('catch-area'); var link = document.querySelector('tw-link'); link.style.display = 'none'; var words = ['당신', '당신','당신','당신','당신']; var caught = 0; var needed = words.length; words.forEach(function(word, index) { setTimeout(function() { var letter = document.createElement('div'); letter.textContent = word; letter.style.position = 'absolute'; letter.style.left = (20 + index * 15) + '%'; letter.style.top = '0'; letter.style.fontSize = '1em'; letter.style.cursor = 'pointer'; letter.style.animation = 'fall-down ' + (3 + Math.random() * 2) + 's linear infinite'; area.appendChild(letter); letter.addEventListener('click', function() { this.textContent = '*'; this.style.cursor = 'default'; this.onclick = null; caught++; if (caught >= needed) { link.click(); } }); }, index * 500); }); }, 100); </script> <script> if (window.pageSound) { window.pageSound.pause(); window.pageSound.currentTime = 0; } if (window.bgmAudio) { window.bgmAudio.pause(); window.bgmAudio.currentTime = 0; } if (window.pageSoundObserver) { window.pageSoundObserver.disconnect(); // ★ 이후로는 자동 재생 자체를 막기 } </script> <div id="rain1" style="position:fixed; top:0; left:0; width:100%; height:100vh; overflow:hidden; z-index:1000; pointer-events:none;"></div> <script> setTimeout(function() { if (window.fillScreenWithStars) { window.fillScreenWithStars("rain1"); } }, 100); </script>