feat: initialize IoT Standards Lab website project with MAM skills & onboarding guide

.env.example

@@ -0,0 +1,97 @@
+# ---------------------------------------------------------------------------
+# .env.example — committable template for the multi-agent-mux-* skills
+#
+# This file is tracked in git and contains NO secrets. To get a working local
+# config, copy it to `.env` (which is git-ignored) and edit as needed:
+#
+#     scripts/generate-env.sh        # creates .env from this template if absent
+#     # or manually:  cp .env.example .env
+#
+# Every variable below is OPTIONAL. The skills already resolve sane defaults
+# (shown after each `#default:` line), so an unset/commented variable just keeps
+# the built-in behaviour. Uncomment + edit only the ones you want to override.
+#
+# SECURITY: never put real secrets in this template. Secret-bearing vars use a
+# `replace_me` placeholder — fill them in only in your local `.env`.
+# ---------------------------------------------------------------------------
+
+# ===========================================================================
+# Workspace / runtime paths
+# ===========================================================================
+
+# Single source of truth for the agent session registry YAML.
+#default: <workspace>/.mam/agent-sessions.yaml
+# AGENT_SESSIONS_YAML=/path/to/workspace/.mam/agent-sessions.yaml
+
+# Where the monitor (reconcile.sh) keeps its drift-state cache.
+#default: <workspace>/.cache/multi-agent-mux-monitor
+# AGENT_SESSIONS_STATE_DIR=/path/to/workspace/.cache/multi-agent-mux-monitor
+
+# Root directory that holds Claude Code per-project conversation logs (*.jsonl).
+#default: $HOME/.claude/projects
+# CLAUDE_PROJECT_DIR=$HOME/.claude/projects
+
+# Directory scanned for per-session launcher wrappers (~/.local/bin/<session>).
+#default: $HOME/.local/bin
+# LOCAL_BIN=$HOME/.local/bin
+
+# tmux server socket name (`tmux -L <name>`). "default" = the normal tmux server
+# (no -L). Set this to opt into an isolated server for all skill tmux calls.
+#default: default
+# TMUX_SERVER_NAME=default
+
+# ===========================================================================
+# delegate-job / MQTT broker
+# ===========================================================================
+
+# MQTT broker host the delegate-job publisher/subscriber connects to.
+#default: broker.hivemq.com
+# MQTT_BROKER=broker.hivemq.com
+
+# Broker auth username. Leave unset for anonymous brokers.
+#default: (unset → anonymous)
+# MQTT_USERNAME=replace_me
+
+# Broker auth password. SECRET — fill in only in your local .env, never commit.
+#default: (unset → anonymous)
+# MQTT_PASSWORD=replace_me
+
+# Prefix for generated MQTT client ids (publisher/subscriber/monitor).
+#default: hermes
+# MQTT_CLIENT_ID_PREFIX=hermes
+
+# Path to a CA bundle for TLS broker verification (set MQTT_TLS=1 to use TLS).
+#default: (unset → no custom CA)
+# MQTT_CA_CERTS=/path/to/ca.crt
+
+# Client certificate for mutual-TLS brokers.
+#default: (unset → no client cert)
+# MQTT_CERTFILE=/path/to/client.crt
+
+# Client private key for mutual-TLS brokers. SECRET — keep the key file private.
+#default: (unset → no client key)
+# MQTT_KEYFILE=/path/to/client.key
+
+# Directory for delegate-job audit logs (sits beside .mam/jobs/).
+#default: <cwd>/.mam/delegate_job_logs
+# DELEGATE_JOB_LOGS_DIR=/path/to/workspace/.mam/delegate_job_logs
+
+# ==============================================================================
+# deploy / distribution source (for forks/mirrors)
+# ==============================================================================
+# Note: These variables are read from the execution environment by deployment scripts.
+# Since deploy/install.sh runs before .env exists, you must pass them via export
+# or prepended variables (e.g. MAM_REPO_URL=... bash deploy/install.sh).
+# If you run a private mirror, we strongly recommend configuring all three variables.
+
+# Distribution repository URL (cloned during recovery steps).
+#default: https://git.godopu.com/tmpl/multi-agent-mux.git
+# MAM_REPO_URL=https://git.godopu.com/tmpl/multi-agent-mux.git
+
+# Distribution archive download URL (used for bootstrap extraction).
+#default: https://git.godopu.com/tmpl/multi-agent-mux/archive/main.tar.gz
+# MAM_ARCHIVE_URL=https://git.godopu.com/tmpl/multi-agent-mux/archive/main.tar.gz
+
+# Distribution update/installer script URL.
+#default: https://git.godopu.com/tmpl/multi-agent-mux/raw/branch/main/deploy/install.sh
+# MAM_INSTALLER_URL=https://git.godopu.com/tmpl/multi-agent-mux/raw/branch/main/deploy/install.sh

.gitignore

@@ -0,0 +1,9 @@
+# Multi-Agent Mux (MAM) runtime databases and isolation cache
+/.mam/
+
+# Python virtual environment
+/.venv/
+.agents/
+
+# Binary zip archives
+*.zip

AGENTS.md

@@ -0,0 +1,70 @@
+# AGENTS.md
+
+Behavioral guidelines to reduce common LLM coding mistakes. Merge with project-specific instructions as needed.
+
+> [!NOTE]
+> This repository uses two separate guides: the general LLM behavioral guidelines ([AGENTS.md](AGENTS.md)) and the project-specific multi-agent orchestration guidelines ([.agents/MULTI_AGENT_RULES.md](.agents/MULTI_AGENT_RULES.md)).
+
+**Tradeoff:** These guidelines bias toward caution over speed. For trivial tasks, use judgment.
+
+## 1. Think Before Coding
+
+**Don't assume. Don't hide confusion. Surface tradeoffs.**
+
+Before implementing:
+- State your assumptions explicitly. If uncertain, ask.
+- If multiple interpretations exist, present them - don't pick silently.
+- If a simpler approach exists, say so. Push back when warranted.
+- If something is unclear, stop. Name what's confusing. Ask.
+
+## 2. Simplicity First
+
+**Minimum code that solves the problem. Nothing speculative.**
+
+- No features beyond what was asked.
+- No abstractions for single-use code.
+- No "flexibility" or "configurability" that wasn't requested.
+- No error handling for impossible scenarios.
+- If you write 200 lines and it could be 50, rewrite it.
+
+Ask yourself: "Would a senior engineer say this is overcomplicated?" If yes, simplify.
+
+## 3. Surgical Changes
+
+**Touch only what you must. Clean up only your own mess.**
+
+When editing existing code:
+- Don't "improve" adjacent code, comments, or formatting.
+- Don't refactor things that aren't broken.
+- Match existing style, even if you'd do it differently.
+- If you notice unrelated dead code, mention it - don't delete it.
+
+When your changes create orphans:
+- Remove imports/variables/functions that YOUR changes made unused.
+- Don't remove pre-existing dead code unless asked.
+
+The test: Every changed line should trace directly to the user's request.
+
+## 4. Goal-Driven Execution
+
+**Define success criteria. Loop until verified.**
+
+Transform tasks into verifiable goals:
+- "Add validation" → "Write tests for invalid inputs, then make them pass"
+- "Fix the bug" → "Write a test that reproduces it, then make it pass"
+- "Refactor X" → "Ensure tests pass before and after"
+
+For multi-step tasks, state a brief plan:
+```
+1. [Step] → verify: [check]
+2. [Step] → verify: [check]
+3. [Step] → verify: [check]
+```
+
+Strong success criteria let you loop independently. Weak criteria ("make it work") require constant clarification.
+
+---
+
+**These guidelines are working if:** fewer unnecessary changes in diffs, fewer rewrites due to overcomplication, and clarifying questions come before implementation rather than after mistakes.
+
+Read [MULTI_AGENT_RULES.md](.agents/MULTI_AGENT_RULES.md) (or [Korean version](.agents/MULTI_AGENT_RULES.ko.md)) and [multi-agent-mux-loop/SKILL.md](.agents/skills/multi-agent-mux-loop/SKILL.md) first before working and follow the instructions for orchestration and collaboration.

ISL-2026/assets/iotsbody/iotsbody.css

@@ -0,0 +1,24 @@
+.fixed-top{top:0}.fixed-bottom,.fixed-top{position:fixed;right:0;left:0;z-index:1030}.fixed-bottom{bottom:0}@supports ((position:-webkit-sticky) or (position:sticky)){.sticky-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.sr-only-focusable:active,.sr-only-focusable:focus{position:static;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal}.shadow-sm{box-shadow:0 .125rem .25rem rgba(0,0,0,.075)!important}.shadow{box-shadow:0 .5rem 1rem rgba(0,0,0,.15)!important}.shadow-lg{box-shadow:0 1rem 3rem rgba(0,0,0,.175)!important}.shadow-none{box-shadow:none!important}.w-25{width:25%!important}
+body {
+    background-color: #f2f4f7;
+}
+
+.iots-pannel {
+    width: 100%;
+    height:100%;
+    background-color: transparent;
+    border: none;
+}
+
+.iots-body{
+    margin-top : 50px;
+}
+
+@media(max-width:592px) {
+    .iots-body {
+        margin-top: 45px;
+    }
+}
+
+
+

ISL-2026/assets/main/css/Simple-Slider.css

@@ -0,0 +1,45 @@
+.simple-slider .swiper-slide {
+  height: auto;
+  background-repeat: no-repeat;
+  background-size: cover;
+  background-position: center;
+  margin-top: 84px;
+}
+
+.swiper-container {
+  width: auto;
+  max-width: 1500px;
+}
+
+.simple-slider .swiper-button-next, .simple-slider .swiper-button-prev {
+  width: 50px;
+  margin-left: 20px;
+  margin-right: 20px;
+}
+
+@media (max-width:1500px) {
+  .simple-slider .swiper-slide {
+    margin-top: 70px;
+  }
+}
+
+@media (max-width:767px) {
+  .simple-slider .swiper-button-next, .simple-slider .swiper-button-prev {
+    display: none;
+  }
+}
+
+@media (max-width:767px) {
+  .simple-slider .swiper-slide {
+    height: 270px;
+    margin-top: 50px;
+  }
+}
+
+.special-skill-item.border-0 {
+  box-shadow: 10px 5px 5px lightgray;
+}
+
+.navbar.navbar-dark.navbar-expand-lg.fixed-top.bg-white.portfolio-navbar.gradient {
+}
+

ISL-2026/assets/main/css/custom.css

@@ -0,0 +1,233 @@
+body {
+  background: #f2f4f7;
+  -webkit-overflow-scrolling: touch;
+}
+
+.st_org.card-body {
+  background: lightgray;
+}
+
+.row.st_org img {
+  max-height: 260px;
+}
+
+@media (max-width: 400px) {
+  .navbar-brand.logo {
+    font-size: 1.3rem;
+  }
+}
+
+.portfolio-block .heading h2 {
+  font-size: 1.9rem;
+}
+
+.page-footer {
+  background: #44475a;
+}
+
+.page-footer a:hover {
+  color: skyblue;
+}
+
+.page-footer a {
+  color: white;
+  text-decoration: underline;
+}
+
+.portfolio-block.ccis {
+  padding-top: 45px;
+  padding-bottom: 0px;
+}
+
+.vlc {
+  margin-top: 70px;
+  margin-bottom: 70px;
+}
+
+.organization {
+  margin-top: 100px;
+}
+
+.container img {
+  width: 100%;
+  transition: width 1s;
+  -webkit-transition: all .2s ease-out;
+  -moz-transition: all .2s ease-out;
+  -ms-transition: all .2s ease-out;
+  transition: all .2s ease-out;
+}
+
+.godopu_description {
+  padding-top: 60px;
+}
+
+.float {
+  position: fixed;
+  width: 80px;
+  height: 80px;
+  bottom: 50px;
+  right: 50px;
+  background-color: lightcoral;
+  color: #FFF;
+  border-radius: 50px;
+  text-align: center;
+  padding-top: 14px;
+  font-size: 50px;
+  box-shadow: 2px 2px 3px #999;
+}
+
+.float:hover {
+  background: lightblue;
+}
+
+@media (max-width: 1200px) and (min-width:992px) {
+  .research-area.card-body {
+    height: 332.8px;
+  }
+}
+
+@media (max-width: 992px) and (min-width:768px) {
+  .research-area.card-body {
+    height: 480px;
+  }
+}
+
+@media (max-width: 800px) {
+  .float {
+    bottom: 23px;
+    right: 23px;
+    padding-top: 10px;
+    width: 60px;
+    height: 60px;
+    font-size: 35px;
+  }
+}
+
+.gcontainer {
+  max-width: 1140px;
+  display: flex;
+  margin-right: auto;
+  margin-left: auto;
+  padding-left: 10px;
+  font-size: 1.3rem;
+  width:100%
+}
+
+.gcontainer .card-img-top {
+  display: flex;
+  position: absolute;
+  margin-top: auto;
+  margin-bottom: auto;
+  vertical-align: middle;
+  width: calc(100% - 40px);
+  top: 0;
+  bottom: 0;
+  justify-content: center;
+  padding:20px;
+}
+.gcontainer .card-img-top img{
+  margin-top:auto;
+  margin-bottom:auto;
+  width : 100%;
+}
+
+@media (max-width: 1200px) and (min-width:768px) {
+  .gcontainer {
+    width: 965px;
+    font-size: 1rem;
+  }
+}
+
+@media (max-width: 767px) {
+  .gcontainer {
+    max-width: 630px;
+    padding : 10px;
+    display: inline-block;
+    text-align: center;
+  }
+}
+
+@media (max-width: 767px) {
+  .godopu_description {
+    padding-top: 10px;
+    text-align: center;
+    padding-bottom: 10px;
+    position: relative;
+    top: auto;
+    bottom: auto;
+    font-size: 1.2rem;
+  }
+}
+
+@media (max-width: 767px) {
+  .gcontainer .col-sm-6 {
+    width: 100%;
+    padding : 0px;
+    position: relative;
+    max-width: 100%;
+    flex: inherit;
+  }
+}
+
+@media (max-width: 767px) {
+  .gcontainer .card-img-top {
+    position: relative;
+    padding:10px;
+    margin-right:auto;
+    margin-left:auto;
+    display:flex;
+    width: calc(100% - 20px);
+  }
+}
+
+.puscale-up-img{
+  transition: transform .5s ease;
+  border : none;
+}
+
+.puscale-up-img:hover{
+  box-shadow: 3px 3px 11px rgba(33,33,33,.2);
+  transform: scale(1.07);
+}
+
+.iots-frame-holder{
+  display : none;
+  width : 100%;
+  height : calc(100% - 60px);
+  position : fixed;
+  margin-top : 62px;
+  border : none;
+  -webkit-overflow-scrolling: touch;
+  overflow-y: auto;
+  border : none;
+}
+
+.iots-frame-holder iframe{
+  width: 100%;
+  height:100%;
+  display:flex;
+  border: none;
+}
+
+@media(min-width:592px) {
+  .iots-frame-holder {
+    display : none;
+    width : 100%;
+    height : calc(100% - 80px);
+    position : fixed;
+    margin-top : 83px;
+  }
+
+  .iots-frame-holder iframe{
+    width: 100%;
+    height:100%;
+    display:flex;
+  }
+}
+
+@media(max-width:592px) {
+  .iots-frame-holder iframe{
+    -webkit-overflow-scrolling: touch;
+    overflow-y : scroll;
+  }
+}

ISL-2026/assets/main/css/remodal/remodal-default-theme.css

@@ -0,0 +1,242 @@
+/* 
+ *  Remodal - v1.1.1
+ *  Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.
+ *  http://vodkabears.github.io/remodal/
+ *
+ *  Made by Ilya Makarov
+ *  Under MIT License
+  */
+
+/*  ==========================================================================
+   Remodal's default mobile first theme
+   ==========================================================================  */
+
+/*  Default theme styles for the background  */
+
+.remodal-bg.remodal-is-opening, .remodal-bg.remodal-is-opened {
+  -webkit-filter: blur(3px);
+  filter: blur(3px);
+}
+
+/*  Default theme styles of the overlay  */
+
+.remodal-overlay {
+  background: rgba(43, 46, 56, 0.9);
+}
+
+.remodal-overlay.remodal-is-opening, .remodal-overlay.remodal-is-closing {
+  -webkit-animation-duration: 0.3s;
+  animation-duration: 0.3s;
+  -webkit-animation-fill-mode: forwards;
+  animation-fill-mode: forwards;
+}
+
+.remodal-overlay.remodal-is-opening {
+  -webkit-animation-name: remodal-overlay-opening-keyframes;
+  animation-name: remodal-overlay-opening-keyframes;
+}
+
+.remodal-overlay.remodal-is-closing {
+  -webkit-animation-name: remodal-overlay-closing-keyframes;
+  animation-name: remodal-overlay-closing-keyframes;
+}
+
+/*  Default theme styles of the wrapper  */
+
+.remodal-wrapper {
+  padding: 10px 10px 0;
+}
+
+/*  Default theme styles of the modal dialog  */
+
+.remodal {
+  box-sizing: border-box;
+  width: 100%;
+  margin-bottom: 10px;
+  padding: 35px;
+  -webkit-transform: translate3d(0, 0, 0);
+  transform: translate3d(0, 0, 0);
+  color: #2b2e38;
+  background: #f2f4f7;
+}
+
+.remodal.remodal-is-opening, .remodal.remodal-is-closing {
+  -webkit-animation-duration: 0.3s;
+  animation-duration: 0.3s;
+  -webkit-animation-fill-mode: forwards;
+  animation-fill-mode: forwards;
+}
+
+.remodal.remodal-is-opening {
+  -webkit-animation-name: remodal-opening-keyframes;
+  animation-name: remodal-opening-keyframes;
+}
+
+.remodal.remodal-is-closing {
+  -webkit-animation-name: remodal-closing-keyframes;
+  animation-name: remodal-closing-keyframes;
+}
+
+/*  Vertical align of the modal dialog  */
+
+.remodal, .remodal-wrapper:after {
+  vertical-align: middle;
+}
+
+/*  Close button  */
+
+.remodal-close {
+  position: absolute;
+  top: 0;
+  left: 0;
+  display: block;
+  overflow: visible;
+  width: 35px;
+  height: 35px;
+  margin: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-transition: color 0.2s;
+  transition: color 0.2s;
+  text-decoration: none;
+  color: #95979c;
+  border: 0;
+  outline: 0;
+  background: transparent;
+}
+
+.remodal-close:hover, .remodal-close:focus {
+  color: #2b2e38;
+}
+
+.remodal-close:before {
+  font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif !important;
+  font-size: 25px;
+  line-height: 35px;
+  position: absolute;
+  top: 0;
+  left: 0;
+  display: block;
+  width: 35px;
+  content: "\00d7";
+  text-align: center;
+}
+
+/*  Dialog buttons  */
+
+.remodal-confirm, .remodal-cancel {
+  font: inherit;
+  font-size: 20px;
+  display: inline-block;
+  overflow: visible;
+  min-width: 150px;
+  margin: 0;
+  padding: 12px 0;
+  cursor: pointer;
+  -webkit-transition: background 0.2s;
+  transition: background 0.2s;
+  text-align: center;
+  vertical-align: middle;
+  text-decoration: none;
+  border: 0;
+  border-radius: 25px;
+  outline: 0;
+}
+
+.remodal-confirm {
+  color: #fff;
+  background: #81c784;
+  width: 40%;
+}
+
+.remodal-confirm:hover, .remodal-confirm:focus {
+  background: #66bb6a;
+}
+
+.remodal-cancel {
+  color: #fff;
+  background: #e57373;
+}
+
+.remodal-cancel:hover, .remodal-cancel:focus {
+  background: #ef5350;
+}
+
+/*  Remove inner padding and border in Firefox 4+ for the button tag.  */
+
+.remodal-confirm::-moz-focus-inner, .remodal-cancel::-moz-focus-inner, .remodal-close::-moz-focus-inner {
+  padding: 0;
+  border: 0;
+}
+
+/*  Keyframes
+   ==========================================================================  */
+
+@keyframes remodal-opening-keyframes {
+  from {
+    -webkit-transform: scale(1.05);
+    transform: scale(1.05);
+    opacity: 0;
+  }
+  to {
+    -webkit-transform: none;
+    transform: none;
+    opacity: 1;
+    -webkit-filter: blur(0);
+    filter: blur(0);
+  }
+}
+
+@keyframes remodal-closing-keyframes {
+  from {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+    opacity: 1;
+  }
+  to {
+    -webkit-transform: scale(0.95);
+    transform: scale(0.95);
+    opacity: 0;
+    -webkit-filter: blur(0);
+    filter: blur(0);
+  }
+}
+
+@keyframes remodal-overlay-opening-keyframes {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes remodal-overlay-closing-keyframes {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+
+/*  Media queries
+   ==========================================================================  */
+
+@media only screen and (min-width: 641px) {
+  .remodal {
+    max-width: 700px;
+  }
+}
+
+/*  IE8
+   ==========================================================================  */
+
+.lt-ie9 .remodal-overlay {
+  background: #2b2e38;
+}
+
+.lt-ie9 .remodal {
+  width: 700px;
+}
+

ISL-2026/assets/main/css/remodal/remodal.css

@@ -0,0 +1,101 @@
+/* 
+ *  Remodal - v1.1.1
+ *  Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.
+ *  http://vodkabears.github.io/remodal/
+ *
+ *  Made by Ilya Makarov
+ *  Under MIT License
+  */
+
+/*  ==========================================================================
+   Remodal's necessary styles
+   ==========================================================================  */
+
+/*  Hide scroll bar  */
+
+html.remodal-is-locked {
+  overflow: hidden;
+}
+
+/*  Anti FOUC  */
+
+.remodal, [data-remodal-id] {
+  display: none;
+}
+
+/*  Necessary styles of the overlay  */
+
+.remodal-overlay {
+  position: fixed;
+  z-index: 9999;
+  top: -5000px;
+  right: -5000px;
+  bottom: -5000px;
+  left: -5000px;
+  display: none;
+}
+
+/*  Necessary styles of the wrapper  */
+
+.remodal-wrapper {
+  position: fixed;
+  z-index: 10000;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  display: none;
+  overflow: auto;
+  text-align: center;
+  -webkit-overflow-scrolling: touch;
+}
+
+.remodal-wrapper:after {
+  display: inline-block;
+  height: 100%;
+  margin-left: -0.05em;
+  content: "";
+}
+
+/*  Fix iPad, iPhone glitches  */
+
+.remodal-overlay, .remodal-wrapper {
+  -webkit-backface-visibility: hidden;
+  backface-visibility: hidden;
+}
+
+/*  Necessary styles of the modal dialog  */
+
+.remodal {
+  position: relative;
+  outline: none;
+  -webkit-text-size-adjust: 100%;
+  -ms-text-size-adjust: 100%;
+  text-size-adjust: 100%;
+}
+
+.remodal-is-initialized {
+  display: inline-block;
+}
+
+.remodal-bg.with-red-theme.remodal-is-opening, .remodal-bg.with-red-theme.remodal-is-opened {
+  filter: none;
+}
+
+.remodal-overlay.with-red-theme {
+  background-color: #f44336;
+}
+
+.remodal.with-red-theme {
+  background: #fff;
+}
+
+#profile_img {
+  border-radius: 15%;
+  width: 160px;
+}
+
+.portfolio-laptop-mockup .screen {
+  border-width: 0px;
+}
+

ISL-2026/assets/main/js/Simple-Slider.js

@@ -0,0 +1,23 @@
+let mySwiper;
+let delay = 5000;
+
+function autoNext(){
+    mySwiper.slideNext();
+    setTimeout(autoNext, delay);
+}
+
+$(function(){
+
+    
+    mySwiper = new Swiper ('.swiper-container', {
+        loop: true,
+        pagination: '.swiper-pagination',
+        paginationClickable: true,
+        nextButton: '.swiper-button-next',
+        prevButton: '.swiper-button-prev',
+        
+    });
+                          
+    setTimeout(autoNext, delay);
+    
+});

ISL-2026/assets/main/js/remodal/listener.js

@@ -0,0 +1,28 @@
+// $(document).on('opening', '.remodal', function () {
+//     console.log('opening');
+//   });
+
+//   $(document).on('opened', '.remodal', function () {
+//     console.log('opened');
+//   });
+
+//   $(document).on('closing', '.remodal', function (e) {
+//     console.log('closing' + (e.reason ? ', reason: ' + e.reason : ''));
+//   });
+
+//   $(document).on('closed', '.remodal', function (e) {
+//     console.log('closed' + (e.reason ? ', reason: ' + e.reason : ''));
+//   });
+
+//   $(document).on('confirmation', '.remodal', function () {
+//     console.log('confirmation');
+//     console.log('godopu');
+//   });
+
+//   $(document).on('cancellation', '.remodal', function () {
+//     alert("godopu");
+//   });
+
+$(document).on('click', '.remodal-cancel', function () {
+  window.location.href="https://github.com/sjkoh12";
+});

ISL-2026/assets/main/js/remodal/remodal.js

@@ -0,0 +1,786 @@
+/*
+ *  Remodal - v1.1.1
+ *  Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.
+ *  http://vodkabears.github.io/remodal/
+ *
+ *  Made by Ilya Makarov
+ *  Under MIT License
+ */
+
+!(function(root, factory) {
+  if (typeof define === 'function' && define.amd) {
+    define(['jquery'], function($) {
+      return factory(root, $);
+    });
+  } else if (typeof exports === 'object') {
+    factory(root, require('jquery'));
+  } else {
+    factory(root, root.jQuery || root.Zepto);
+  }
+})(this, function(global, $) {
+
+  'use strict';
+
+  /**
+   * Name of the plugin
+   * @private
+   * @const
+   * @type {String}
+   */
+  var PLUGIN_NAME = 'remodal';
+
+  /**
+   * Namespace for CSS and events
+   * @private
+   * @const
+   * @type {String}
+   */
+  var NAMESPACE = global.REMODAL_GLOBALS && global.REMODAL_GLOBALS.NAMESPACE || PLUGIN_NAME;
+
+  /**
+   * Animationstart event with vendor prefixes
+   * @private
+   * @const
+   * @type {String}
+   */
+  var ANIMATIONSTART_EVENTS = $.map(
+    ['animationstart', 'webkitAnimationStart', 'MSAnimationStart', 'oAnimationStart'],
+
+    function(eventName) {
+      return eventName + '.' + NAMESPACE;
+    }
+
+  ).join(' ');
+
+  /**
+   * Animationend event with vendor prefixes
+   * @private
+   * @const
+   * @type {String}
+   */
+  var ANIMATIONEND_EVENTS = $.map(
+    ['animationend', 'webkitAnimationEnd', 'MSAnimationEnd', 'oAnimationEnd'],
+
+    function(eventName) {
+      return eventName + '.' + NAMESPACE;
+    }
+
+  ).join(' ');
+
+  /**
+   * Default settings
+   * @private
+   * @const
+   * @type {Object}
+   */
+  var DEFAULTS = $.extend({
+    hashTracking: true,
+    closeOnConfirm: true,
+    closeOnCancel: true,
+    closeOnEscape: true,
+    closeOnOutsideClick: true,
+    modifier: '',
+    appendTo: null
+  }, global.REMODAL_GLOBALS && global.REMODAL_GLOBALS.DEFAULTS);
+
+  /**
+   * States of the Remodal
+   * @private
+   * @const
+   * @enum {String}
+   */
+  var STATES = {
+    CLOSING: 'closing',
+    CLOSED: 'closed',
+    OPENING: 'opening',
+    OPENED: 'opened'
+  };
+
+  /**
+   * Reasons of the state change.
+   * @private
+   * @const
+   * @enum {String}
+   */
+  var STATE_CHANGE_REASONS = {
+    CONFIRMATION: 'confirmation',
+    CANCELLATION: 'cancellation'
+  };
+
+  /**
+   * Is animation supported?
+   * @private
+   * @const
+   * @type {Boolean}
+   */
+  var IS_ANIMATION = (function() {
+    var style = document.createElement('div').style;
+
+    return style.animationName !== undefined ||
+      style.WebkitAnimationName !== undefined ||
+      style.MozAnimationName !== undefined ||
+      style.msAnimationName !== undefined ||
+      style.OAnimationName !== undefined;
+  })();
+
+  /**
+   * Is iOS?
+   * @private
+   * @const
+   * @type {Boolean}
+   */
+  var IS_IOS = /iPad|iPhone|iPod/.test(navigator.platform);
+
+  /**
+   * Current modal
+   * @private
+   * @type {Remodal}
+   */
+  var current;
+
+  /**
+   * Scrollbar position
+   * @private
+   * @type {Number}
+   */
+  var scrollTop;
+
+  /**
+   * Returns an animation duration
+   * @private
+   * @param {jQuery} $elem
+   * @returns {Number}
+   */
+  function getAnimationDuration($elem) {
+    if (
+      IS_ANIMATION &&
+      $elem.css('animation-name') === 'none' &&
+      $elem.css('-webkit-animation-name') === 'none' &&
+      $elem.css('-moz-animation-name') === 'none' &&
+      $elem.css('-o-animation-name') === 'none' &&
+      $elem.css('-ms-animation-name') === 'none'
+    ) {
+      return 0;
+    }
+
+    var duration = $elem.css('animation-duration') ||
+      $elem.css('-webkit-animation-duration') ||
+      $elem.css('-moz-animation-duration') ||
+      $elem.css('-o-animation-duration') ||
+      $elem.css('-ms-animation-duration') ||
+      '0s';
+
+    var delay = $elem.css('animation-delay') ||
+      $elem.css('-webkit-animation-delay') ||
+      $elem.css('-moz-animation-delay') ||
+      $elem.css('-o-animation-delay') ||
+      $elem.css('-ms-animation-delay') ||
+      '0s';
+
+    var iterationCount = $elem.css('animation-iteration-count') ||
+      $elem.css('-webkit-animation-iteration-count') ||
+      $elem.css('-moz-animation-iteration-count') ||
+      $elem.css('-o-animation-iteration-count') ||
+      $elem.css('-ms-animation-iteration-count') ||
+      '1';
+
+    var max;
+    var len;
+    var num;
+    var i;
+
+    duration = duration.split(', ');
+    delay = delay.split(', ');
+    iterationCount = iterationCount.split(', ');
+
+    // The 'duration' size is the same as the 'delay' size
+    for (i = 0, len = duration.length, max = Number.NEGATIVE_INFINITY; i < len; i++) {
+      num = parseFloat(duration[i]) * parseInt(iterationCount[i], 10) + parseFloat(delay[i]);
+
+      if (num > max) {
+        max = num;
+      }
+    }
+
+    return max;
+  }
+
+  /**
+   * Returns a scrollbar width
+   * @private
+   * @returns {Number}
+   */
+  function getScrollbarWidth() {
+    if ($(document).height() <= $(window).height()) {
+      return 0;
+    }
+
+    var outer = document.createElement('div');
+    var inner = document.createElement('div');
+    var widthNoScroll;
+    var widthWithScroll;
+
+    outer.style.visibility = 'hidden';
+    outer.style.width = '100px';
+    document.body.appendChild(outer);
+
+    widthNoScroll = outer.offsetWidth;
+
+    // Force scrollbars
+    outer.style.overflow = 'scroll';
+
+    // Add inner div
+    inner.style.width = '100%';
+    outer.appendChild(inner);
+
+    widthWithScroll = inner.offsetWidth;
+
+    // Remove divs
+    outer.parentNode.removeChild(outer);
+
+    return widthNoScroll - widthWithScroll;
+  }
+
+  /**
+   * Locks the screen
+   * @private
+   */
+  function lockScreen() {
+    if (IS_IOS) {
+      return;
+    }
+
+    var $html = $('html');
+    var lockedClass = namespacify('is-locked');
+    var paddingRight;
+    var $body;
+
+    if (!$html.hasClass(lockedClass)) {
+      $body = $(document.body);
+
+      // Zepto does not support '-=', '+=' in the `css` method
+      paddingRight = parseInt($body.css('padding-right'), 10) + getScrollbarWidth();
+
+      $body.css('padding-right', paddingRight + 'px');
+      $html.addClass(lockedClass);
+    }
+  }
+
+  /**
+   * Unlocks the screen
+   * @private
+   */
+  function unlockScreen() {
+    if (IS_IOS) {
+      return;
+    }
+
+    var $html = $('html');
+    var lockedClass = namespacify('is-locked');
+    var paddingRight;
+    var $body;
+
+    if ($html.hasClass(lockedClass)) {
+      $body = $(document.body);
+
+      // Zepto does not support '-=', '+=' in the `css` method
+      paddingRight = parseInt($body.css('padding-right'), 10) - getScrollbarWidth();
+
+      $body.css('padding-right', paddingRight + 'px');
+      $html.removeClass(lockedClass);
+    }
+  }
+
+  /**
+   * Sets a state for an instance
+   * @private
+   * @param {Remodal} instance
+   * @param {STATES} state
+   * @param {Boolean} isSilent If true, Remodal does not trigger events
+   * @param {String} Reason of a state change.
+   */
+  function setState(instance, state, isSilent, reason) {
+
+    var newState = namespacify('is', state);
+    var allStates = [namespacify('is', STATES.CLOSING),
+                     namespacify('is', STATES.OPENING),
+                     namespacify('is', STATES.CLOSED),
+                     namespacify('is', STATES.OPENED)].join(' ');
+
+    instance.$bg
+      .removeClass(allStates)
+      .addClass(newState);
+
+    instance.$overlay
+      .removeClass(allStates)
+      .addClass(newState);
+
+    instance.$wrapper
+      .removeClass(allStates)
+      .addClass(newState);
+
+    instance.$modal
+      .removeClass(allStates)
+      .addClass(newState);
+
+    instance.state = state;
+    !isSilent && instance.$modal.trigger({
+      type: state,
+      reason: reason
+    }, [{ reason: reason }]);
+  }
+
+  /**
+   * Synchronizes with the animation
+   * @param {Function} doBeforeAnimation
+   * @param {Function} doAfterAnimation
+   * @param {Remodal} instance
+   */
+  function syncWithAnimation(doBeforeAnimation, doAfterAnimation, instance) {
+    var runningAnimationsCount = 0;
+
+    var handleAnimationStart = function(e) {
+      if (e.target !== this) {
+        return;
+      }
+
+      runningAnimationsCount++;
+    };
+
+    var handleAnimationEnd = function(e) {
+      if (e.target !== this) {
+        return;
+      }
+
+      if (--runningAnimationsCount === 0) {
+
+        // Remove event listeners
+        $.each(['$bg', '$overlay', '$wrapper', '$modal'], function(index, elemName) {
+          instance[elemName].off(ANIMATIONSTART_EVENTS + ' ' + ANIMATIONEND_EVENTS);
+        });
+
+        doAfterAnimation();
+      }
+    };
+
+    $.each(['$bg', '$overlay', '$wrapper', '$modal'], function(index, elemName) {
+      instance[elemName]
+        .on(ANIMATIONSTART_EVENTS, handleAnimationStart)
+        .on(ANIMATIONEND_EVENTS, handleAnimationEnd);
+    });
+
+    doBeforeAnimation();
+
+    // If the animation is not supported by a browser or its duration is 0
+    if (
+      getAnimationDuration(instance.$bg) === 0 &&
+      getAnimationDuration(instance.$overlay) === 0 &&
+      getAnimationDuration(instance.$wrapper) === 0 &&
+      getAnimationDuration(instance.$modal) === 0
+    ) {
+
+      // Remove event listeners
+      $.each(['$bg', '$overlay', '$wrapper', '$modal'], function(index, elemName) {
+        instance[elemName].off(ANIMATIONSTART_EVENTS + ' ' + ANIMATIONEND_EVENTS);
+      });
+
+      doAfterAnimation();
+    }
+  }
+
+  /**
+   * Closes immediately
+   * @private
+   * @param {Remodal} instance
+   */
+  function halt(instance) {
+    if (instance.state === STATES.CLOSED) {
+      return;
+    }
+
+    $.each(['$bg', '$overlay', '$wrapper', '$modal'], function(index, elemName) {
+      instance[elemName].off(ANIMATIONSTART_EVENTS + ' ' + ANIMATIONEND_EVENTS);
+    });
+
+    instance.$bg.removeClass(instance.settings.modifier);
+    instance.$overlay.removeClass(instance.settings.modifier).hide();
+    instance.$wrapper.hide();
+    unlockScreen();
+    setState(instance, STATES.CLOSED, true);
+  }
+
+  /**
+   * Parses a string with options
+   * @private
+   * @param str
+   * @returns {Object}
+   */
+  function parseOptions(str) {
+    var obj = {};
+    var arr;
+    var len;
+    var val;
+    var i;
+
+    // Remove spaces before and after delimiters
+    str = str.replace(/\s*:\s*/g, ':').replace(/\s*,\s*/g, ',');
+
+    // Parse a string
+    arr = str.split(',');
+    for (i = 0, len = arr.length; i < len; i++) {
+      arr[i] = arr[i].split(':');
+      val = arr[i][1];
+
+      // Convert a string value if it is like a boolean
+      if (typeof val === 'string' || val instanceof String) {
+        val = val === 'true' || (val === 'false' ? false : val);
+      }
+
+      // Convert a string value if it is like a number
+      if (typeof val === 'string' || val instanceof String) {
+        val = !isNaN(val) ? +val : val;
+      }
+
+      obj[arr[i][0]] = val;
+    }
+
+    return obj;
+  }
+
+  /**
+   * Generates a string separated by dashes and prefixed with NAMESPACE
+   * @private
+   * @param {...String}
+   * @returns {String}
+   */
+  function namespacify() {
+    var result = NAMESPACE;
+
+    for (var i = 0; i < arguments.length; ++i) {
+      result += '-' + arguments[i];
+    }
+
+    return result;
+  }
+
+  /**
+   * Handles the hashchange event
+   * @private
+   * @listens hashchange
+   */
+  function handleHashChangeEvent() {
+    var id = location.hash.replace('#', '');
+    var instance;
+    var $elem;
+
+    if (!id) {
+
+      // Check if we have currently opened modal and animation was completed
+      if (current && current.state === STATES.OPENED && current.settings.hashTracking) {
+        current.close();
+      }
+    } else {
+
+      // Catch syntax error if your hash is bad
+      try {
+        $elem = $(
+          '[data-' + PLUGIN_NAME + '-id="' + id + '"]'
+        );
+      } catch (err) {}
+
+      if ($elem && $elem.length) {
+        instance = $[PLUGIN_NAME].lookup[$elem.data(PLUGIN_NAME)];
+
+        if (instance && instance.settings.hashTracking) {
+          instance.open();
+        }
+      }
+
+    }
+  }
+
+  /**
+   * Remodal constructor
+   * @constructor
+   * @param {jQuery} $modal
+   * @param {Object} options
+   */
+  function Remodal($modal, options) {
+    var $body = $(document.body);
+    var $appendTo = $body;
+    var remodal = this;
+
+    remodal.settings = $.extend({}, DEFAULTS, options);
+    remodal.index = $[PLUGIN_NAME].lookup.push(remodal) - 1;
+    remodal.state = STATES.CLOSED;
+
+    remodal.$overlay = $('.' + namespacify('overlay'));
+
+    if (remodal.settings.appendTo !== null && remodal.settings.appendTo.length) {
+      $appendTo = $(remodal.settings.appendTo);
+    }
+
+    if (!remodal.$overlay.length) {
+      remodal.$overlay = $('<div>').addClass(namespacify('overlay') + ' ' + namespacify('is', STATES.CLOSED)).hide();
+      $appendTo.append(remodal.$overlay);
+    }
+
+    remodal.$bg = $('.' + namespacify('bg')).addClass(namespacify('is', STATES.CLOSED));
+
+    remodal.$modal = $modal
+      .addClass(
+        NAMESPACE + ' ' +
+        namespacify('is-initialized') + ' ' +
+        remodal.settings.modifier + ' ' +
+        namespacify('is', STATES.CLOSED))
+      .attr('tabindex', '-1');
+
+    remodal.$wrapper = $('<div>')
+      .addClass(
+        namespacify('wrapper') + ' ' +
+        remodal.settings.modifier + ' ' +
+        namespacify('is', STATES.CLOSED))
+      .hide()
+      .append(remodal.$modal);
+    $appendTo.append(remodal.$wrapper);
+
+    // Add the event listener for the close button
+    remodal.$wrapper.on('click.' + NAMESPACE, '[data-' + PLUGIN_NAME + '-action="close"]', function(e) {
+      e.preventDefault();
+
+      remodal.close();
+    });
+
+    // Add the event listener for the cancel button
+    remodal.$wrapper.on('click.' + NAMESPACE, '[data-' + PLUGIN_NAME + '-action="cancel"]', function(e) {
+      e.preventDefault();
+
+      remodal.$modal.trigger(STATE_CHANGE_REASONS.CANCELLATION);
+
+      if (remodal.settings.closeOnCancel) {
+        remodal.close(STATE_CHANGE_REASONS.CANCELLATION);
+      }
+    });
+
+    // Add the event listener for the confirm button
+    remodal.$wrapper.on('click.' + NAMESPACE, '[data-' + PLUGIN_NAME + '-action="confirm"]', function(e) {
+      e.preventDefault();
+
+      remodal.$modal.trigger(STATE_CHANGE_REASONS.CONFIRMATION);
+
+      if (remodal.settings.closeOnConfirm) {
+        remodal.close(STATE_CHANGE_REASONS.CONFIRMATION);
+      }
+    });
+
+    // Add the event listener for the overlay
+    remodal.$wrapper.on('click.' + NAMESPACE, function(e) {
+      var $target = $(e.target);
+
+      if (!$target.hasClass(namespacify('wrapper'))) {
+        return;
+      }
+
+      if (remodal.settings.closeOnOutsideClick) {
+        remodal.close();
+      }
+    });
+  }
+
+  /**
+   * Opens a modal window
+   * @public
+   */
+  Remodal.prototype.open = function() {
+    var remodal = this;
+    var id;
+
+    // Check if the animation was completed
+    if (remodal.state === STATES.OPENING || remodal.state === STATES.CLOSING) {
+      return;
+    }
+
+    id = remodal.$modal.attr('data-' + PLUGIN_NAME + '-id');
+
+    if (id && remodal.settings.hashTracking) {
+      scrollTop = $(window).scrollTop();
+      location.hash = id;
+    }
+
+    if (current && current !== remodal) {
+      halt(current);
+    }
+
+    current = remodal;
+    lockScreen();
+    remodal.$bg.addClass(remodal.settings.modifier);
+    remodal.$overlay.addClass(remodal.settings.modifier).show();
+    remodal.$wrapper.show().scrollTop(0);
+    remodal.$modal.focus();
+
+    syncWithAnimation(
+      function() {
+        setState(remodal, STATES.OPENING);
+      },
+
+      function() {
+        setState(remodal, STATES.OPENED);
+      },
+
+      remodal);
+  };
+
+  /**
+   * Closes a modal window
+   * @public
+   * @param {String} reason
+   */
+  Remodal.prototype.close = function(reason) {
+    var remodal = this;
+
+    // Check if the animation was completed
+    if (remodal.state === STATES.OPENING || remodal.state === STATES.CLOSING || remodal.state === STATES.CLOSED) {
+      return;
+    }
+
+    if (
+      remodal.settings.hashTracking &&
+      remodal.$modal.attr('data-' + PLUGIN_NAME + '-id') === location.hash.substr(1)
+    ) {
+      location.hash = '';
+      $(window).scrollTop(scrollTop);
+    }
+
+    syncWithAnimation(
+      function() {
+        setState(remodal, STATES.CLOSING, false, reason);
+      },
+
+      function() {
+        remodal.$bg.removeClass(remodal.settings.modifier);
+        remodal.$overlay.removeClass(remodal.settings.modifier).hide();
+        remodal.$wrapper.hide();
+        unlockScreen();
+
+        setState(remodal, STATES.CLOSED, false, reason);
+      },
+
+      remodal);
+  };
+
+  /**
+   * Returns a current state of a modal
+   * @public
+   * @returns {STATES}
+   */
+  Remodal.prototype.getState = function() {
+    return this.state;
+  };
+
+  /**
+   * Destroys a modal
+   * @public
+   */
+  Remodal.prototype.destroy = function() {
+    var lookup = $[PLUGIN_NAME].lookup;
+    var instanceCount;
+
+    halt(this);
+    this.$wrapper.remove();
+
+    delete lookup[this.index];
+    instanceCount = $.grep(lookup, function(instance) {
+      return !!instance;
+    }).length;
+
+    if (instanceCount === 0) {
+      this.$overlay.remove();
+      this.$bg.removeClass(
+        namespacify('is', STATES.CLOSING) + ' ' +
+        namespacify('is', STATES.OPENING) + ' ' +
+        namespacify('is', STATES.CLOSED) + ' ' +
+        namespacify('is', STATES.OPENED));
+    }
+  };
+
+  /**
+   * Special plugin object for instances
+   * @public
+   * @type {Object}
+   */
+  $[PLUGIN_NAME] = {
+    lookup: []
+  };
+
+  /**
+   * Plugin constructor
+   * @constructor
+   * @param {Object} options
+   * @returns {JQuery}
+   */
+  $.fn[PLUGIN_NAME] = function(opts) {
+    var instance;
+    var $elem;
+
+    this.each(function(index, elem) {
+      $elem = $(elem);
+
+      if ($elem.data(PLUGIN_NAME) == null) {
+        instance = new Remodal($elem, opts);
+        $elem.data(PLUGIN_NAME, instance.index);
+
+        if (
+          instance.settings.hashTracking &&
+          $elem.attr('data-' + PLUGIN_NAME + '-id') === location.hash.substr(1)
+        ) {
+          instance.open();
+        }
+      } else {
+        instance = $[PLUGIN_NAME].lookup[$elem.data(PLUGIN_NAME)];
+      }
+    });
+
+    return instance;
+  };
+
+  $(document).ready(function() {
+
+    // data-remodal-target opens a modal window with the special Id
+    $(document).on('click', '[data-' + PLUGIN_NAME + '-target]', function(e) {
+      e.preventDefault();
+
+      var elem = e.currentTarget;
+      var id = elem.getAttribute('data-' + PLUGIN_NAME + '-target');
+      var $target = $('[data-' + PLUGIN_NAME + '-id="' + id + '"]');
+
+      $[PLUGIN_NAME].lookup[$target.data(PLUGIN_NAME)].open();
+    });
+
+    // Auto initialization of modal windows
+    // They should have the 'remodal' class attribute
+    // Also you can write the `data-remodal-options` attribute to pass params into the modal
+    $(document).find('.' + NAMESPACE).each(function(i, container) {
+      var $container = $(container);
+      var options = $container.data(PLUGIN_NAME + '-options');
+
+      if (!options) {
+        options = {};
+      } else if (typeof options === 'string' || options instanceof String) {
+        options = parseOptions(options);
+      }
+
+      $container[PLUGIN_NAME](options);
+    });
+
+    // Handles the keydown event
+    $(document).on('keydown.' + NAMESPACE, function(e) {
+      if (current && current.settings.closeOnEscape && current.state === STATES.OPENED && e.keyCode === 27) {
+        current.close();
+      }
+    });
+
+    // Handles the hashchange event
+    $(window).on('hashchange.' + NAMESPACE, handleHashChangeEvent);
+  });
+});
+

ISL-2026/assets/pannel/html/pannel.html

@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html>
+
+<!-- <head>
+    <meta charset="utf-8">
+    <title>IoT Standards Laboratory</title>
+    <link rel="manifest" href="manifest.json">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+    <link rel="stylesheet" href="../css/bootstrap.min.css" />
+    <style>
+        html,
+        body {
+            background-color: transparent;
+        }
+    </style>
+</head> -->
+<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+<link rel="stylesheet" href="../css/bootstrap.min.css" />
+<body>
+    <nav class="navbar navbar-dark navbar-expand-lg fixed-top bg-white portfolio-navbar gradient" style="width: auto;">
+        <div class="container"><a class="navbar-brand logo" href="#">IoT Standards Laboratory</a><button
+                data-toggle="collapse" class="navbar-toggler" data-target="#navbarNav"><span class="sr-only">Toggle
+                    navigation</span><span class="navbar-toggler-icon"></span></button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="nav navbar-nav ml-auto">
+                    <li class="nav-item" role="presentation"><a class="nav-link" role="professor information"
+                            href="https://github.com/sjkoh12">Github</a></li>
+                    <li class="nav-item" role="presentation"><a class="nav-link" href="../../../member.html" target="iots-frame">Members</a></li>
+                    <li class="nav-item" role="presentation"><a class="nav-link" href="../../../publication.html" target="iots-frame">Publications</a></li>
+                    <li class="nav-item" role="presentation"><a class="nav-link" href="../../../lecture.html" target="iots-frame">Lectures</a></li>
+                    <li class="nav-item" role="presentation"><a class="nav-link" href="../../../report.html" target="iots-frame">Technical Reports</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+    <iframe name="iots-frame" src="../../../member.html" style="width : 100%; height : 100%;"></iframe>
+</body>
+
+<script src="../../../assets/main/js/jquery.min.js"></script>
+<script src="../../../assets/main/bootstrap/js/bootstrap.min.js"></script>
+
+</html>
+<!-- <script>
+    $(document).ready(function () {
+        let links = $("div a");
+        links.on("click", (event) => {
+            // alert(event.target.id);
+            let frame = document.getElementsByTagName("iframe");
+            
+            switch (event.target.id) {
+                case "members":
+                    alert("members");  
+                    break;
+                default:
+                   alert(frame.src);
+            }
+        })
+    });
+</script> -->

ISL-2026/index.html

@@ -0,0 +1,308 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+    <title>IoT Standards Laboratory</title>
+    <link rel="icon" type="image/png" sizes="2917x2918" href="assets/main/img/Lab_logo_color_transparent.png">
+    <link rel="icon" type="image/png" sizes="2917x2918" href="assets/main/img/KakaoTalk_20190723_171753647.png">
+    <link rel="stylesheet" href="assets/main/bootstrap/css/bootstrap.min.css">
+    <link rel="manifest" href="manifest.json">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:300,400,700">
+    <link rel="stylesheet" href="assets/main/fonts/font-awesome.min.css">
+    <link rel="stylesheet" href="assets/main/fonts/ionicons.min.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.6.1/css/pikaday.min.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.3.1/css/swiper.min.css">
+    <link rel="stylesheet" href="assets/main/css/remodal/remodal-default-theme.css">
+    <link rel="stylesheet" href="assets/main/css/remodal/remodal.css">
+    <link rel="stylesheet" href="assets/main/css/Simple-Slider.css">
+    <link rel="stylesheet" href="assets/main/css/custom.css">
+
+    <style>
+        html,
+        body {
+            background-color: #f2f4f7;
+            width: 100%;
+            height: 100%;
+        }
+    </style>
+
+</head>
+
+<body>
+    <nav class="navbar navbar-dark navbar-expand-lg fixed-top bg-white portfolio-navbar gradient" style="width: auto;">
+        <div class="container"><a id="navbar-brand" class="navbar-brand logo" href="http://iot.knu.ac.kr">IoT
+                Standards Laboratory</a><button data-toggle="collapse" class="navbar-toggler"
+                data-target="#navbarNav"><span class="sr-only">Toggle
+                    navigation</span><span class="navbar-toggler-icon"></span></button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="nav navbar-nav ml-auto">
+                    <li class="nav-item" role="presentation"><a class="nav-link" id="github"
+                            target = "_blank" href="https://github.com/iot-standards-laboratory">Github</a></li>
+                    <li class="nav-item" role="presentation"><a class="nav-link" href="member.html"
+                            target="iots-frame">Members</a></li>
+                    <li class="nav-item" role="presentation"><a class="nav-link" href="publication.html"
+                            target="iots-frame">Publications</a></li>
+                    <li class="nav-item" role="presentation"><a class="nav-link" href="lecture.html"
+                            target="iots-frame">Lectures</a></li>
+                    <li class="nav-item" role="presentation"><a class="nav-link" href="standard.html"
+                            target="iots-frame">Standardization
+</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <section id="iots-mainbody">
+        <div class="simple-slider">
+            <div class="swiper-container">
+                <div class="swiper-wrapper"><img class="swiper-slide" src="assets/main/img/iot-banner.png"><img
+                        class="swiper-slide" src="assets/main/img/ccis-banner.png"><img class="swiper-slide"
+                        src="assets/main/img/vlc-banner.png"></div>
+                <div class="swiper-pagination"></div>
+                <div class="swiper-button-prev"></div>
+                <div class="swiper-button-next"></div>
+            </div>
+        </div>
+        <hr style="margin-bottom: 0rem;">
+        <section class="portfolio-block skills" style="padding: 70px 0px;">
+            <div class="container">
+                <div class="heading">
+                    <h2>Research area &amp; works</h2>
+                </div>
+                <div class="row">
+                    <div class="col-md-4">
+                        <div class="card special-skill-item border-0">
+                            <div class="card-header bg-transparent border-0"><img src="assets/main/img/iot-icon.png"
+                                    style="width:70px; height:70px; border-radius : 50%; background : #7c8aff;"></div>
+                            <div class="card-body research-area">
+                                <h3 class="card-title">IoT Standards</h3>
+                                <p class="card-text" style="font-size: 1.05rem;">Internet of Things covers a huge range
+                                    of
+                                    industries and use cases that scale from a single constrained device up to massive
+                                    cross-platform deployments of embedded technologies and cloud systems connecting in
+                                    real-time.<br><br><br></p>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="col-md-4">
+                        <div class="card special-skill-item border-0">
+                            <div class="card-header bg-transparent border-0"><img src="assets/main/img/car-icon.png"
+                                    style="width: 70px;height: 70px;border-radius: 50%;background: #0ea0ff;background-color: #5768cd;">
+                            </div>
+                            <div class="card-body research-area">
+                                <h3 class="card-title">CCIS</h3>
+                                <p class="card-text" style="font-size: 1.05rem;">In-Vehicle Infotainment (IVI) refers to
+                                    vehicle systems that combine entertainment and information delivery to drivers and
+                                    passengers.&nbsp;<br>Configurable Car Infotainment Service (CCIS) is a service that
+                                    helps users to more
+                                    easily manage and control In-Vehicle infotainment devices and content.<br></p>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="col-md-4">
+                        <div class="card special-skill-item border-0">
+                            <div class="card-header bg-transparent border-0"><img src="assets/main/img/vlc-icon.png"
+                                    style="width: 70px;height: 70px;border-radius: 50%;background: #0ea0ff;background-color: #fbcd79;">
+                            </div>
+                            <div class="card-body research-area">
+                                <h3 class="card-title">VLC-IoT</h3>
+                                <p class="card-text" style="font-size: 1.05rem;">Visible-light communication (VLC)
+                                    transmits
+                                    data by intensity modulating optical sources, such as light-emitting diodes (LEDs)
+                                    and
+                                    laser diodes (LDs), faster than the persistence of the human eye. The goal of
+                                    IoT-VLC is
+                                    to
+                                    design a framework of IoT services based on VLC.&nbsp;<br><br></p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+        <section class="row" style="padding-right: 0;padding-left: 0;margin: 0px;">
+            <div class="gcontainer">
+                <div class="row"
+                    style="width : 100%;padding-right: 0;padding-left: 0;margin: 0;margin-top: 20px;margin-bottom: 10px;">
+                    <div class="godopu_description col-sm-6 portfolio-block" style="margin-top: 20px;">
+                        <h3 style="font-weight: 700;font-family: Lato,sans-serif;">CCIS&nbsp;</h3>
+                        <p style="margin-top: 0px;">In-Vehicle Infotainment (IVI) refers to vehicle systems that combine
+                            entertainment and information delivery to drivers and passengers. Configurable Car
+                            Infotainment
+                            Service (CCIS) is a service that helps users to more easily manage
+                            and control In-Vehicle infotainment devices and content.<br>This project is developing a
+                            series
+                            of standards in <br>IEC/TC 100/TA 17</p>
+                    </div>
+                    <div class="col-sm-6" style="padding: 0;"><a href="#show_image_ccis">
+                        <img class="puscale-up-img card-img-top" src="assets/main/img/picture.png" alt="Card Image"/>
+
+                        </a></div>
+                </div>
+            </div>
+        </section>
+        <hr>
+        <section class="row" style="padding-right: 0;padding-left: 0;margin: 0px;">
+            <div class="gcontainer">
+                <div class="row"
+                    style="width : 100% ;padding-right: 0;padding-left: 0;margin: 0;margin-top: 20px;margin-bottom: 10px;">
+                    <div class="col-sm-6" style="padding: 0;"><a href="#show_image_vlc">
+                            <img class="puscale-up-img card-img-top" src="assets/main/img/vlc.png" alt="Card Image" />
+                        </a></div>
+                    <div class="godopu_description col-sm-6 portfolio-block" style="margin-top: 20px;">
+                        <h3 style="font-weight: 700;font-family: Lato,sans-serif;">VLC-IoT</h3>
+                        <p style="margin-top: 0px;">Visible-light communication (VLC) transmits data by intensity
+                            modulating
+                            optical sources, such as light-emitting diodes (LEDs) and laser diodes (LDs), faster than
+                            the
+                            persistence of the human eye. The goal of IoT-VLC is to design a
+                            framework of IoT services based on VLC.<br>This project is purposed to develop a series of
+                            standards in ITU-T SG20.<br></p>
+                    </div>
+                </div>
+            </div>
+        </section>
+        <hr style="margin: 0px;margin-top: 16px;">
+        <section class="portfolio-block projects-cards" style="padding: 70px 0px;">
+            <div class="container">
+                <div class="heading">
+                    <h2>Standards organizations</h2>
+                </div>
+                <div class="row st_org">
+                    <div class="col-md-6 col-lg-4">
+                        <div class="card puscale-up-img"><a target="_blank" href="https://www.ietf.org/"><img class="card-img-top" src="assets/main/img/logo_ietf.png"></a>
+                            <div class="card-body st_org" style="padding-bottom: 10px; background : lightgray;">
+                                <h6><a target="_blank" href="https://www.ietf.org/">IETF</a></h6>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="col-md-6 col-lg-4">
+                        <div class="card border-0 puscale-up-img"><a target="_blank" href="https://www.iec.ch/"><img class="card-img-top"
+                                    src="assets/main/img/logo_iec.png" alt="Card Image"></a>
+                            <div class="card-body st_org" style="padding-bottom: 10px;">
+                                <h6><a target="_blank" href="https://www.iec.ch/">IEC</a></h6>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="col-md-6 col-lg-4">
+                        <div class="card border-0 puscale-up-img"><a target="_blank" href="https://www.itu.int/en/ITU-T/Pages/default.aspx"><img class="card-img-top"
+                                    src="assets/main/img/logo_itu-t.png" alt="Card Image"></a>
+                            <div class="card-body st_org" style="padding-bottom: 10px; color : blue;">
+                                <h6><a target="_blank" href="https://www.itu.int/en/ITU-T/Pages/default.aspx">ITU-T</a></h6>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+        <footer class="page-footer">
+            <div class="container">
+                <div class="links"><a target="_blank" href="http://cse.knu.ac.kr/">CSE</a><a target="_blank" href="http://it.knu.ac.kr/">CITE</a><a
+                       target="_blank" href="http://www.knu.ac.kr/">KNU</a></div>
+            </div>
+        </footer><a href="#modal"><i class="fa fa-envelope-o float"></i></a>
+
+        <div class="remodal gradient" data-remodal-id="show_image_ccis" role="dialog" aria-labelledby="modal1Title"
+            aria-describedby="modal1Desc" style="padding : 0; background-color:transparent">
+            <div>
+                <section class="portfolio-block mobile-app" style="padding-top:30px; padding-bottom:30px;">
+                    <div class="container align-items-center">
+                        <div class="row align-items-center">
+                            <img src="assets/main/img/picture.png" style="width:100%" />
+                        </div>
+                    </div>
+                </section>
+            </div>
+        </div>
+
+        <!-- style="background-color:transparent" -->
+        <div class="remodal gradient" data-remodal-id="show_image_vlc" role="dialog" aria-labelledby="modal1Title"
+            aria-describedby="modal1Desc" style="padding : 0; background-color:transparent">
+            <div>
+                <section class="portfolio-block mobile-app"
+                    style="padding-top:30px; padding-bottom:30px;background-color:white;">
+                    <div class="container align-items-center">
+                        <div class="row align-items-center">
+                            <img src="assets/main/img/vlc.png" style="width:100%;" />
+                        </div>
+                    </div>
+                </section>
+            </div>
+        </div>
+
+        <!-- style="background-color:transparent" -->
+        <div class="remodal gradient" data-remodal-id="modal" role="dialog" aria-labelledby="modal1Title"
+            aria-describedby="modal1Desc">
+            <button data-remodal-action="close" class="remodal-close" aria-label="Close"></button>
+            <div>
+                <h2 id="modal1Title">Professor Information</h2>
+                <section class="portfolio-block mobile-app" style="padding-top:30px; padding-bottom:30px;">
+                    <div class="container align-items-center">
+                        <div class="row align-items-center">
+                            <div class="col-md-12 col-lg-4 offset-lg-1">
+                                <img id="profile_img"
+                                    src='https://search.pstatic.net/common?type=a&size=120x150&quality=95&direct=true&src=http%3A%2F%2Fpeople.phinf.naver.net%2F20181026_30%2F1540539795199zR4V8_JPEG%2Fchosun_400263079.jpg'
+                                    alt="Avatar">
+                            </div>
+                            <div class="col-md-12 col-lg-6 text">
+                                                       <h3>Seok-Joo Koh</h3>
+                                <snap>School of Computer Science and Engineering,<br>Kyungpook National University<br>경북대학교 IT대학 5호관(415동) 527호</snap>
+                            </div>
+                        </div>
+                    </div>
+                    <!--             <hr /> -->
+                </section>
+                <div class="phone-screen" style="background-image:url('assets/main/img/tech/image7.png');"></div>
+            </div>
+            <br>
+            <a href="mailto:sjkoh@knu.ac.kr" class="remodal-confirm" style="color:white">Send E-Mail</a>
+            <a data-remodal-action="cancel" class="remodal-cancel" style="color:white;">Github</a>
+            <!-- <a target="_blank" href="https://github.com/sjkoh12" class="remodal-cancel" style="color:white">Github</a> -->
+        </div>
+
+    </section>
+    <div class="iots-frame-holder">
+        <iframe name="iots-frame"></iframe>
+    </div>
+    <script src="assets/main/js/jquery.min.js"></script>
+    <script src="assets/main/bootstrap/js/bootstrap.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.6.1/pikaday.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.3.1/js/swiper.jquery.min.js"></script>
+    <script src="assets/main/js/remodal/remodal.js"></script>
+    <script src="assets/main/js/remodal/listener.js"></script>
+    <script src="assets/main/js/Simple-Slider.js"></script>
+    <script src="assets/main/js/theme.js"></script>
+    <script>
+        let prelink = undefined;
+        document.addEventListener("DOMContentLoaded", function () {
+            let links = document.getElementsByClassName("nav-link");
+            
+            let click_listener = function (event) {
+                if (prelink !== undefined) {
+                    prelink.css("color", "white");
+                    prelink.css("text-decoration", "none");
+                }
+                if (event.target.id !== "github") {
+                    prelink = $(event.target);
+                    let btn = $(".navbar-toggler");
+                    if (btn.attr("aria-expanded") == "true")
+                        btn.click();
+                    $("#iots-mainbody").css("display", "none");
+                    $(".iots-frame-holder").css("display", "block");
+                    prelink.css("color", "#ded8e6");
+                    prelink.css("text-decoration", "underline");
+                }
+            }
+
+            for (var i = 0; i < links.length; i++) {
+                links[i].addEventListener('click', click_listener, false);
+            }
+
+        });
+    </script>
+</body>
+
+</html>
+

ISL-2026/introduction.html

@@ -0,0 +1,51 @@
+<HTML>
+<HEAD>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+<TITLE>ISL: Introduction</TITLE>
+</HEAD>
+
+<BODY>
+
+<P><HR SIZE=4><P><FONT FACE="TAHOMA">
+
+<H2>Research Areas</H2>
+We are focusing on the following research areas: <BR><BR>
+
+<UL>
+
+<LI>Quick UDP Internet Conenction (QUIC)</LI><BR><BR>
+<LI>QUIC-based Mobility and Multi-Streaming Support</LI><BR><BR>
+
+<LI>Services and Protocols for Internet-of-Things (IoT)</LI><BR><BR>
+<LI>Constrained Application Protocol (CoAP)</LI><BR><BR>
+<LI>In-Vehicle Infotainment (IVI)</LI><BR><BR>
+
+<LI>Optical Wireless or Visible Light Communications (OWC/VLC)</LI><BR><BR>
+<LI>Lighting Control Networks (PLASA E1.45) for LED-based VLC</LI><BR><BR>
+
+<LI>Mobility Management: Distributed Mobility Control</LI><BR><BR>
+<LI>Multicast Routing Protocols and Reliable Multicasting</LI><BR><BR>
+<LI>mobile SCTP (mSCTP): Soft Handover in Transport Layer</LI><BR><BR>
+<LI>Stream Control Transmission Protocol (SCTP)</LI><BR><BR>
+
+<LI>Telecommunication Optimization: Network Planning and Management</LI><BR><BR>
+<LI>TAC/TAL Configuration for Paging and Location Management</LI><BR><BR>
+<LI>Tabu Search and Genetic Algorithm</LI><BR><BR>
+</UL>
+
+<P><HR SIZE=4><P>
+<H2>International Standardizations</H2>
+Along with the research activities, we are also in pursuit of the International Standardization,<BR>
+from the market deployment perspective, in the following SDOs (Standard-Defining Organizations):<BR><BR>
+<UL>
+<LI><U>IEC TC100:</U> Multimedia Systems and Equipment<BR>
+<LI><U>ISO/IEC JTC1/SC41:</U> Internet-of-Things (IoT) Applications</U> 
+<LI><U>ITU-T SG20:</U> IoT Services<BR>
+<LI><U>ITU-T SG13:</U> Mobility Management <BR>
+<LI><U>ISO/IEC JTC1/SC6:</U> Reliable Multicasting</U> 
+</UL>
+
+Please refer to <A href="standard.html">here </A>for details of our works 
+on International Standardization so far. </B><BR><BR>
+<HR>
+</BODY></HTML>

ISL-2026/lecture.html

@@ -0,0 +1,277 @@
+<title>Lecture</title>
+<link rel="stylesheet" href="assets/iotsbody/iotsbody.css"/>
+<style>.iots-body hr {border-top: 1px solid;border-bottom: 1px solid; border-right : none ; border-left : none; box-sizing: content-box; height:3px;}</style>    
+
+<section class="iots-body">
+<CENTER>
+<HR SIZE=4>
+<FONT FACE="Courier New">
+
+<H1 ALIGN="CENTER">Spring 2026</H1><BR>
+<H3><U>Computer Networks (COMP 0414)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 0401)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2025</H1><BR>
+<H3><U>Topics in Software (COMP 0432)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 0402)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2025</H1><BR>
+<H3><U>Introduction to Computer Science and Engineering (ITEC 0201)</H3><BR></U>
+<H3><U>Network Programming (EECS 0312)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 0401)</H3><BR></U>
+<H3><U>Problem-based Engineering Training Experiment (COMP 0461)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2024</H1><BR>
+<H3><U>Topics in Software (COMP 0432)</H3><BR></U>
+<H3><U>Big Data Convergence Project (BIDA 0201)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 0402)</H3><BR></U>
+<H3><U>Problem-based Engineering Training Experiment (COMP 0460)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2024</H1><BR>
+<H3><U>Big Data Convergence Project (BIDA 0201)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 0401)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2023</H1><BR>
+<H3>No Class (Sabbatical)</H3><BR>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2023</H1><BR>
+<H3><U>Network Programming (EECS 0312)</H3><BR></U>
+<H3><U>Big Data Convergence Project (BIDA 0201)</H3><BR></U>
+<H3><U>Software Convergence Project 3 (CICT 0703)</H3><BR></U>
+<HR>
+
+
+<H1 ALIGN="CENTER">Fall 2022</H1><BR>
+<H3><U>Problem Solving and Computing (CLTR 273001)</H3><BR></U>
+<H3><U>Topics in Software (COMP 432001)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401001)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2022</H1><BR>
+<H3><U>Network Programming (EECS 312002)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402001)</H3><BR></U>
+<H3><U>Problem-based Engineering Training Experiment (COMP 460001)</H3><BR></U>
+<H3><U>Software Convergence Project 1 (CICT 701001)</H3><BR></U>
+<HR>
+
+
+<H1 ALIGN="CENTER">Fall 2021</H1><BR>
+<H3><U>Capstone Design Project II (ITEC 402001)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2021</H1><BR>
+<H3><U>Problem Solving and Computing (CLTR 273001)</H3><BR></U>
+<H3><U>Software Convergence Design 1 (GLSO 218001)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402001)</H3><BR></U>
+<H3><U>Advanced Mobile Computing (COMP 778001)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2020</H1><BR>
+<H3><U>Capstone Design Project I (ITEC 401003)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401004)</H3><BR></U>
+<H3><U>Topics in Software Convergence IV (GLSO 228001)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2020</H1><BR>
+<H3><U>Capstone Design Project I (ITEC 401016)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402003)</H3><BR></U>
+<H3><U>Advanced Mobile Computing (COMP 778001)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2019</H1><BR>
+<H3><U>Topics in Software (COMP 432001)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401003)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402016)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2019</H1><BR>
+<H3><U>Introduction to Computer Science and Engineering (ITEC 201010)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401016)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402003)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2018</H1><BR>
+<H3><U>Capstone Design Project I (ITEC 401005)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402017)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2018</H1><BR>
+<H3><U>Capstone Design Project I (ITEC 401021)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402006)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2017</H1><BR>
+<H3><U>Topics in Software (COMP 432001)</H3><BR></U>
+<H3><U>Creative Convergence Design (GLSO 213001)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401003)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2017</H1><BR>
+<H3><U>Network Programming (EECS 312001)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401018)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402005)</H3><BR></U>
+<H3><U>Advanced Computer Networks (COME 742001)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2016</H1><BR>
+<H3><U>Topics in Software (COMP 432001)</H3><BR></U>
+<H3><U>Data Structures (COME 331013) and DS Applications (COMP 216002)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401004)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402016)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2016</H1><BR>
+<H3><U>Computer Networks (COMP 414003)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401031)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402005)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402006)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2015</H1><BR>
+<H3><U>Topics in Software (COMP 432001)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401006)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401007)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402022)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2015</H1><BR>
+<H3><U>Introduction to Computer Science and Engineering (ITEC 201009)</H3><BR></U>
+<H3><U>Network Programming (EECS 312001)</H3><BR></U>
+<H3><U>Network Programming (EECS 312002)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401021)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402004)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2014</H1><BR>
+<H3><U>Capstone Design Project I (ITEC 401006)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402021)</H3><BR></U>
+<H3><U>Advanced Computer Networks (COME 742001)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2014</H1><BR>
+<H3><U>Computer Networks (COMP 414002)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402004)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2013</H1><BR>
+<H3><U>Capstone Design Project I (ITEC 401005)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402017)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2013</H1><BR>
+<H3><U>Topics in Software (COMP 432001)</H3><BR></U>
+<H3><U>Capstone Design Project II (ITEC 402005)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2012</H1><BR>
+<H3><U>Topics in Software (COMP 432001)</H3><BR></U>
+<H3><U>Capstone Design Project I (ITEC 401003)</H3><BR></U>
+<H3><U>Senior Project II (EECS 422021)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2012</H1><BR>
+<H3><U>Web Programming Design (COMP 214002)</H3><BR></U>
+<H3><U>Computer Network Protocols (COMP 749001)</H3><BR></U>
+<H3><U>Next Generation Internet Technology (ELEC 957001)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2011</H1><BR>
+<H3><U>Probability and Statistics: Class 1 (COME 311003)</H3><BR></U>
+<H3><U>Probability and Statistics: Class 2 (COME 311004)</H3><BR></U>
+<H3><U>Internet Computing (COMP 764001)</H3><BR></U>
+<H3><U>Topics in Software (COMP 432001)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2011</H1><BR>
+<H3><U>Web Programming Design: Class 1 (COMP 214001)</H3><BR></U>
+<H3><U>Web Programming Design: Class 2 (COMP 214002)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2010</H1><BR>
+<H3><U>Probability and Statistics (COME 311003)</H3><BR></U>
+<H3><U>Data Structures (COME 331004)</H3><BR></U>
+<H3><U>Senior Project II (EECS 422022)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2010</H1><BR>
+<H3><U>Internet Programming Design (EECS 450001)</H3><BR></U>
+<H3><U>Computer Networks (COMP 414003)</H3><BR></U>
+<H3><U>Next-Generation Internet Technology (ELEC 957001)</H3><BR></U>
+<H3><U>Senior Project I (EECS 408016)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2009</H1><BR>
+<H3><U>Probability and Statistics (COME 31103)</H3><BR></U>
+<H3><U>Data Structures (COME 33105)</H3><BR></U>
+<H3><U>Senior Project II (EECS 42202)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2009</H1><BR>
+<H3><U>Introduction to Computer Science (EECS 20704)</H3><BR></U>
+<H3><U>Internet Programming Design (EECS 45001)</H3><BR></U>
+<H3><U>Senior Project I (EECS 40803)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2008</H1><BR>
+<H3><U>Probability and Statistics (COME 31103)</H3><BR></U>
+<H3><U>Internet Computing (COMP 76401)</H3><BR></U>
+<H3><U>Computer Network: Special (ELEC 75401)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2008</H1><BR>
+<H3><U> Internet Programming and Practices (EECS 31401)</H3><BR></U>
+<H3><U> Computer Network Protocols (COMP 74901)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2007</H1><BR>
+<H3><U> Introduction to Computer Science (EECS 20703)</H3><BR></U>
+<H3><U> Probability and Statistics (COME 31103)</H3><BR></U>
+<H3><U> Computer Networks (COMP 41401)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2007</H1><BR>
+<H3><U> C Programming and Practices (EECS 20109)</H3><BR></U>
+<H3><U> Introduction to Computer Science (EECS 20704)</H3><BR></U>
+<H3><U> Internet Programming and Practices (EECS 31401)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2006</H1><BR>
+<H3><U> Introduction to Computer Science (EECS 20703)</H3><BR></U>
+<H3><U> Probability and Statistics (COME 31103)</H3><BR></U>
+<H3><U> Internet Computing (COMP 76401)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2006</H1><BR>
+<H3><U> Introduction to Computer Science (EECS 20704)</H3><BR></U>
+<H3><U> Internet Programming and Practices (EECS 31401)</H3><BR></U>
+<H3><U> Computer Performance Analysis (COMP 75101)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2005</H1><BR>
+<H3><U> Introduction to Computer Science (EECS 20703)</H3><BR></U>
+<H3><U> Data Structures (EECS 20806)</H3><BR></U>
+<H3><U> Computer Network (COMP 41402)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2005</H1><BR>
+<H3><U> Introduction to Computer Science (EECS 20704)</H3><BR></U>
+<H3><U> Internet Programming Design (EECS 49201)</H3><BR></U>
+<H3><U> Computer Network Protocols (COMP 74901)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Fall 2004</H1><BR>
+<H3><U> Computer Engineering (ELEC 26104)</H3><BR></U>
+<H3><U> Data Structures II (COMP 22101)</H3><BR></U>
+<H3><U> Network Programming (EECS 31201)</H3><BR></U>
+<HR>
+
+<H1 ALIGN="CENTER">Spring 2004</H1><BR>
+<H3><U> Introduction to Computer Science (EECS 20704)</H3><BR></U>
+<H3><U> Data Structures I (COMP 21105)</H3><BR></U>
+</section>

ISL-2026/manifest.json

@@ -0,0 +1,18 @@
+{
+    "short_name": "IoTs",
+    "name": "Internet of Things Standards",
+    "start_url" : "./index.html",
+    "icons": [
+        {
+            "src": "/assets/img/Lab_logo_color_transparent.png",
+            "type": "image/png",
+            "sizes": "2917x2918"
+        },
+        {
+            "src": "/assets/img/KakaoTalk_20190723_171753647.png",
+            "type": "image/png",
+            "sizes": "2917x2918"
+        }
+    ],
+    "display": "fullscreen"
+}

ISL-2026/member.html

@@ -0,0 +1,249 @@
+<title>Members</title>
+<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+<link rel="stylesheet" href="assets/iotsbody/iotsbody.css"/>
+<style>
+div hr {border : none; border-top: 1.5px solid gray; box-sizing: content-box; height:3px;}
+</style>    
+
+<section class="iots-body">
+<FONT FACE="TAHOMA">
+
+<center>
+<H2>Members (as of Fall 2026)</H2>
+</center>
+
+<div class="members" style="max-width:1140px; margin-right:auto; margin-left:auto">
+<HR>
+
+<OL>
+<LI><H4>Seok-Joo Koh (고석주, Professor):
+<a href="/home/sjkoh/">Homepage</a> &
+<A HREF="mailto:sjkoh@knu.ac.kr">e-mail </a><br><br></H4>
+
+<LI><H4>Dong-Kyu Choi (최동규, Ph. D.)<br><br></H4>
+
+<LI><H4>Hye-Been Nam (남혜빈, Ph. D. Candidate)<br><br></H4>
+
+<LI><H4>Dohyeon Lim (임도현, Ph. D. Student)<br><br></H4>
+
+<LI><H4>Jun-Hyeok Choi (최준혁, Ph. D. Student)<br><br></H4>
+
+<LI><H4>Gwang-Seon Shin (신광선, M. S. Candidate)<br><br></H4>
+
+<LI><H4>Hwan-Woong Lee (이환웅, M. S. Student)<br><br></H4>
+
+<LI><H4>Hoang Anh Dang (M. S. Student)<br><br></H4>
+
+<LI><H4>Minhee Kim (김민희, Ph. D. Candidate) with School of Computer Science and Engineering<br><br></H4>
+
+<LI><H4>Keun-Sol Kim (김근솔, Ph. D. Candidate) with Department of Information Security<br><br></H4>
+
+<LI><H4>Sung-Jun Min (민성준, Ph. D. Candidate) with Department of Information Science<br><br></H4>
+
+<LI><H4>Jin-Won Choi (최진원, Ph. D. Student) with Department of Science and Technology <br><br></H4>
+
+<LI><H4>Ki-Soo Jung (정기수, Ph. D. Student) with Department of Science and Technology <br><br></H4>
+
+<LI><H4>Mi-Joo Lee (이미주, Ph. D. Student) with Department of ICT Convergence <br><br></H4>
+
+<LI><H4>Yunah Park (박유나, M. S. Candidate)  with Department of Information Security<br><br></H4>
+
+<LI><H4>Chae-Young Park (박채영, M. S. Candidate)  with Department of Information Science<br><br></H4>
+
+
+</OL>
+</div>
+
+<div class="alumni" style="max-width:1140px; margin-right:auto; margin-left:auto">
+<center>
+<HR SIZE=4>
+<H2>Alumni</A></H2>
+<HR SIZE=4>
+</center>
+
+<OL>
+
+<LI><H4>Dongju Kim (김동주, Ph. D.  August 2026 in Computer Science and Engineering)<br><br>
+He is now with Daegu Catholic University (대구가톨릭대학교) as Professor </H4>
+
+<LI><H4>Jung-Mi Hwang (황정미, M. S. August 2026 in Information Science)<br><br>
+She is now with NIA (한국지능정보사회진흥원)</H4>
+
+<LI><H4>Dro Bae (배드로, M. S. February 2026 in Industrial Engineering)<br><br>
+He is now with SK AX </H4>
+
+<LI><H4>Se-Gi Kwon (권세기, M. S. February 2026 in Information Security)<br><br>
+He is now with J Solution (제이솔루션) as CEO </H4>
+
+<LI><H4>Se-Hyun Cho (조세현, Ph. D. August 2025 in Information Security)<br><br>
+He is now with Cyber Security Center</H4>
+
+<LI><H4>Yun-Seong Kim (김윤성, M. S. August 2025 in Data Convergence Computing)<br><br>
+He is now with SL (에스엘)</H4>
+
+<LI><H4>Su-Jin Kim (김수진, M. S. August 2025 in Information Science)<br><br>
+He is now with NIA (한국지능정보사회진흥원)</H4>
+
+<LI><H4>Sang-Tae Kim (김상태, M. S. August 2025 in Industrial Engineering)<br><br>
+He is now with Oh-Sung Electronis (오성전자)</H4>
+
+<LI><H4>Gyu-Bum Kim (김규범, M. S. August 2025 in Computer Science and Engineering)<br><br>
+He is now with Korea Real Estate Board (한국부동산원)</H4>
+
+<LI><H4>Joong-Hwa Jung (정중화, Ph. D. February 2025, M. S. February 2018)<br><br>
+He is now with Lychee AI Coding Academy (리치AI코딩학원) as CEO<br></H4>
+
+<LI><H4>Dohyeon Lim (임도현, M. S. February 2025 in Computer Science and Engineering)<br><br>
+He is now with TakenSoft (테이큰소프트)<br></H4>
+
+<LI><H4>So-Yong Kim (김소용, Ph. D. August 2024, M. S. February 2020)<br><br>
+He is now with Catholic University of Leuven (UCLouvain) in Belgium<br></H4>
+
+<LI><H4>Min-Ji Kim (김민지, M. S. February 2024)<br><br>
+She is now with LG Electronics <br></H4>
+
+<LI><H4>Eun-Ji Ahn (안은지, M. S. February 2024)<br><br>
+S is now with National Security Research Institute (국가보안연구소)<br></H4>
+
+<LI><H4>Dong-Kyu Oh (오동규, M. S. February 2024 in Industrial Engineering)<br><br>
+He is now with Human-Plus (휴먼플러스)<br></H4>
+
+<LI><H4>Jae-Seong Kim (김재성, M. S. August 2023 in Information Science)<br><br>
+He is now with NIA (한국지능정보사회진흥원)<br></H4>
+
+<LI><H4>Dong-Kyu Choi (최동규, Ph. D. February 2023, M. S. February 2017)<br><br>
+He is now with ISL in KNU<br></H4>
+
+<LI><H4>Jin-Won Choi (최진원, M. S. February 2023 in Information Science)<br><br>
+He is now with NIA (한국지능정보사회진흥원)<br></H4>
+
+<LI><H4>Ji-Eun Kim (김지은, M. S. February 2023 in Information Science)<br><br>
+She is now with NIA (한국지능정보사회진흥원)<br></H4>
+
+<LI><H4>Cheol-Min Kim (김철민, Ph. D. August 2022, M. S. February 2017)<br><br>
+He is now with KETI (한국전자기술연구원)<br></H4>
+
+<LI><H4>Kyung-Sik Kim (김경식, M. S.  February 2022)<br><br>
+He is now with Hyundai Autoever (현대오토에버)<br></H4>
+
+<LI><H4>Keun-Soo Kim (김근수, M. S. February 2022)<br><br>
+He is now with Shinhan Bank (신한은행)<br></H4>
+
+<LI><H4>Seong-Woo Jeong (정성우, M. S. February 2022 in Information Science)<br><br>
+He is now with NIA (한국지능정보사회진흥원)<br></H4>
+
+<LI><H4>Min-Cheol Choi (최민철, M. S. February 2022 in Information Science)<br><br>
+He is now with NIA (한국지능정보사회진흥원)<br></H4>
+
+<LI><H4>Jun-Hee Jang (장준희, M. S. August 2021 in Computer Science and Engineering)<br><br>
+He is now with NIA (한국지능정보사회진흥원)<br></H4>
+
+<LI><H4>Muhammad Hafidh Firmansyah (M. S. August 2021)<br><br>
+He is now with State Polytechnic University of Jember in Indonesia<br></H4>
+
+<LI><H4>Kang-Min Jang (장강민, M. S. February 2021 in Information Science) <br><br>
+He is now with NIA (한국지능정보사회진흥원)<br></H4>
+
+<LI><H4>Hong-Keun Lee (이홍근, M. S. February 2021 in Information Science) <br><br>
+He is now with NIA (한국지능정보사회진흥원)<br></H4>
+
+<LI><H4>Hyebeen Nam (남혜빈, M. S. February 2021)<br><br>
+She is now with ISL in KNU<br></H4>
+
+<LI><H4>Nak-Jung Choi (최낙중, Ph. D. February 2020, M. S. February 2013)<br><br>
+He is now with Agency for Defense Development (국방과학연구소)<br></H4>
+
+<LI><H4>Min-Woo Jung (정민우, M. S. February 2019) <br><br>
+He is now with LG Electronics (LG전자)<br></H4>
+
+<LI><H4>Hyung-Woo Kang (강형우, Ph. D. August 2018, M. S. February 2013)<br><br>
+He is now with Samsung Electronics (삼성전자)<br></H4>
+
+<LI><H4>Ye-Chan Choi (최예찬, M. S. February 2018) <br><br>
+He is now with LG-CNS<br></H4>
+
+<LI><H4>Sang-Il Choi (최상일, Ph. D. February 2017, M. S. February 2012)<br><br>
+He is now with Daegu Catholic University (대구가톨릭대학교) as a professor <br></H4>
+
+<LI><H4>Jin-Ho Park (박진호, M. S. August 2016)<br><br>
+He is now with BiThumb (빗썸코리아)<br></H4>
+
+<LI><H4>Sung-Yoon Seok (석성윤, M. S. August 2016 in Samsung Electronics Program)<br><br>
+He is now with Samsung Electronics (삼성전자)<br></H4>
+
+<LI><H4>Jin-Kyu Kim (김진규, M. S. August 2016 in Samsung Electronics Program)<br><br>
+He is now with Samsung Electronics (삼성전자)<br></H4>
+
+<LI><H4>Jae-Cheol Kim (김재철, M. S. August 2016 in Samsung Electronics Program)<br><br>
+He is now with Samsung Electronics (삼성전자)<br></H4>
+
+<LI><H4>Ji-In Kim (김지인, Ph. D. February 2016, M. S. February 2010)<br><br>
+He is now with FAM Tech. (팸텍) as CEO <br></H4>
+
+<LI><H4>Woo-Ju Kim (김우주, M. S. February 2016)<br><br>
+He is now with ZCube (지큐브)<br></H4>
+
+<LI><H4>Jung-Sub Park (박정섭, M. S. August 2015 in Samsung Electronics Program)<br><br>
+He is now with Samsung Electronics (삼성전자)<br></H4>
+
+<LI><H4>Jong-Myoung Choi (최종명, M. S. February 2015)<br><br>
+He is now with NP Communications<br></H4>
+
+<LI><H4>Jong-Kwan Lee (이종관, M. S. February 2014 in Samsung Electronics Program)<br><br>
+He is now with Hanwha Ocean (한화오션) <br></H4>
+
+<LI><H4>Sang-Hun Lee (이상헌, M. S. February 2014)<br><br>
+He is now with Inno Wireless<br></H4>
+</H4>
+
+<LI><H4>Kyeong-Wook Min (민경욱, M. S. February 2013 in Samsung Electronics Program)<br><br>
+He is now with Samsung Electronics (삼성전자)<br></H4>
+
+<LI><H4>Sang-Heon Kim (김상헌, M. S. February 2013 in Samsung Electronics Program)<br><br>
+He is now with Samsung Electronics (삼성전자)<br></H4>
+
+<LI><H4>Moneeb Gohar (Ph. D. August 2012)<br><br>
+He is now with Department of Computer Science, Bahria University (at Islamabad) in Pakistan <br></H4>
+
+<LI><H4>Jae-Wan Park (박재완, M. S. February 2012)<br><br>
+He is now with Ministry of Justice (Immigration Information Center, 법무부)<br></H4>
+
+<LI><H4>Jae-Kyoung Lee (이재경, M. S. February 2012)<br><br>
+She is now with Korea Transportation Satefy Authority (한국교통안전공단)<br></H4>
+
+<LI><H4>Won-Ki Ha (하원기, M. S. February 2012 in Samsung Electronics Program)<br><br>
+He is now with Samsung Electronics (삼성전자)<br></H4>
+
+<LI><H4>Keun-Hee Kim (김근희, M. S. February 2012 in Samsung Electronics Program)<br><br>
+She is now with Samsung Electronics (삼성전자)<br></H4>
+
+<LI><H4>Soon-Hong Kwon (권순홍, M. S. February 2010)<br><br>
+He is now with Samsung Electronics (삼성전자)<br></H4>
+
+<LI><H4>Dong-Phil Kim (김동필, Ph. D. February 2009)<br><br>
+He is now with National Security Research Institute (국가보안연구소)<br></H4>
+
+<LI><H4>Lin Cui (최린, Ph. D. February 2009)<br><br>
+He is now with Tianjin University of Technology and Education in China<br></H4>
+
+<LI><H4>Dong-Hwa Lee (이동화, M. S. February 2009)<br><br>
+He is now with Samsung Electronics (삼성전자)<br></H4>
+
+<LI><H4>Jae-Sung Park (박재성, M. S. August 2008)<br><br>
+He is now with Gom&Company (곰앤컴퍼니)<br></H4>
+
+<LI><H4>Su-Kyoung Ju (주수경, M. S. February 2008)<br><br>
+She is now with Youngjin Univ. (영진전문대학교)<br></H4>
+
+<LI><H4>Sung-Shik Yoon (윤성식, M. S. August 2007)<br><br>
+He is now with Jo-Il Textile Processing Company (조일가공) as CEO<br></H4>
+
+<LI><H4>Sang-Tae Kim (김상태, M. S. February 2007)<br><br>
+He is now with LG Electronics (LG전자) <br></H4>
+
+<LI><H4>Jong-Shik Ha (하종식, M. S. February 2007)<br><br>
+He is now with Samsung Electronics (삼성전자)<br></H4>
+
+</OL>
+<HR SIZE=4>
+</div>

ISL-2026/paper-domestic.html

@@ -0,0 +1,263 @@
+<TITLE>Domestic Papers</TITLE>
+<link rel="stylesheet" href="assets/iotsbody/iotsbody.css"/>
+
+<BODY>
+<section class="iots-body">
+
+<FONT FACE="Garamond">
+<H1 ALIGN="CENTER">Domestic Journals</H1>
+<br/>
+<HR SIZE=4>
+<FONT FACE="Courier New">
+
+<div  style="max-width:1140px; margin-right:auto; margin-left:auto">
+<OL>
+
+
+
+<LI><U>다기관 데이터 기반 도메인 일반화를 적용한 소아청소년 뼈나이 자동 예측 딥러닝 모델의 개발 및 외부 검증<BR></U> 
+<I>한국IT서비스학회지</I>, 제 25권 제 3호, pp. 75 ~ 87, 2026년 6월 (KCI)</LI>
+
+<LI><U>골반 X-ray 영상에서 딥러닝 기반 Risser Grade 자동 분류의 다기관 외부 검증 및 도메인 시프트 분석 : AI 의료기기 상용화 전략에 대한 시사점<BR></U> 
+<I>경영컨설팅연구</I>, 제 26권 제 3호, pp. 337 ~ 348, 2026년 6월 (KCI)</LI>
+
+<LI><U>엣지 장치용 경량 LLM 한국어 스팸 탐지 추론 성능 비교<BR></U> 
+<I>사물인터넷융복합논문지</I>, 제 12권 제 2호, pp. 95 ~ 101, 2026년 4월 (KCI)</LI>
+
+<LI><U>성장클리닉 진단 보조를 위한 지식 그래프 및 대규모 언어 모델 융합 뉴로-심볼릭 임상의사결정 지원 시스템 설계<BR></U> 
+<I>한국IT서비스학회지</I>, 제 25권 제 1호, pp. 63 ~ 73, 2026년 2월 (KCI)</LI>
+
+<LI><U>분산형 하이브리드 AI 기반 모바일 RPG NPC 시스템의 구현<BR></U> 
+<I>사물인터넷융복합논문지</I>, 제 11권 제 6호, pp. 83 ~ 90, 2025년 12월 (KCI)</LI>
+
+<LI><U>관심 영역을 활용한 딥러닝 기반 해무 탐지 시스템<BR></U> 
+<I>한국통신학회논문지</I>, 제 50권 제 7호, pp. 1133 ~ 1142, 2025년 7월 (SCOPUS & KCI)</LI>
+
+<LI><U>FSM과 강화학습 기반의 지능형 NPC AI: 2D 모바일 자동 진행 RPG 게임의 구현 연구<BR></U> 
+<I>정보처리학회논문지</I>, 제 14권 제 6호, pp. 480 ~ 488, 2025년 6월 (KCI)</LI>
+
+<LI><U>공공기관 IT시스템 보안 강화를 위한 사이버 위협 점검/수집 시스템<BR></U> 
+<I>한국IT서비스학회지</I>, 제 24권 제 2호, pp. 31 ~ 46, 2025년 4월 (KCI)</LI>
+
+<LI><U>QUIC 프로토콜의 혼잡제어 성능 비교 분석<BR></U> 
+<I>정보처리학회논문지</I>, 제 14권 제 1호, pp. 9 ~ 13, 2025년 1월 (KCI)</LI>
+
+<LI><U>멀티미디어 영상회의 서비스를 위한 사용자 체감 품질 측정 방법 표준 기술 동향<BR></U> 
+<I>한국컴퓨터통신연구회(OSIA) S&TR Journal</I>, 제 36권 제 2호, pp. 15 ~ 20, 2023년 9월</LI>
+
+<LI><U>차량용 인포테인먼트 서비스 표준화 동향<BR></U> 
+<I>정보과학회지</I>, 제 41권 제 9호, pp. 25 ~ 29, 2023년 9월</LI>
+
+<LI><U>NAT 기반 사물인터넷 환경에서 실시간 통신 지원을 위한 MQTT-CoAP 혼합 기법<BR></U> 
+<I>한국통신학회논문지</I>, 제 46권 제 11호, pp. 1822 ~ 1833, 2021년 11월 (SCOPUS & KCI)</LI>
+
+<LI><U>웹 및 스트리밍 서비스에 대한 QUIC 프로토콜 성능 분석<BR></U> 
+<I>정보처리학회논문지: 컴퓨터 및 통신 시스템</I>, 제 10권 제 5호, pp. 137 ~ 144, 2021년 5월 (KCI)</LI>
+
+<LI><U>가시광 통신 기반 출결 관리 시스템 설계 및 구현<BR></U> 
+<I>한국통신학회논문지</I>, 제 44권 제 7호, pp. 1381 ~ 1390, 2019년 7월 (KCI)</LI>
+
+<LI><U>In-Vehicle Infotainment 시스템에서 Configuration Protocol의 설계 및 구현<BR></U> 
+<I>한국통신학회논문지</I>, 제 43권 제 7호, pp. 1140 ~ 1151, 2018년 7월 (KCI)</LI>
+
+<LI><U>BLE 네트워크 상에서 사물인터넷 서비스 제공을 위한 CoAP과 6LoWPAN 구현<BR></U> 
+<I>방송공학회논문지</I>, 제 21권 제 3호, pp. 298 ~ 306, 2016년 5월 (KCI)</LI>
+
+<LI><U>A Comparative Analysis of Centralized and Distributed Mobility Management in IP-Based Mobile Networks<BR></U> 
+<I>Telecommunications Review</I>, 제 25권 제 4호, pp. 656 ~ 671, 2015년 8월 (KCI)</LI>
+
+<LI><U> IoT(사물기반 인터넷) 기반 헬스케어 서비스: 일상 생활습관 ‧ 건강관리 중심으로 <BR></U> 
+<I>생명공학정책연구센터(BioINpro)</I>, BioINpro 제 13호, pp. 1 ~ 12, 2015년 6월</LI>
+
+<LI><U>Mobility Support Using Locator-Identifier Separation Protocol in 4G Mobile Communication Networks<BR></U> 
+<I>Telecommunications Review</I>, 제 25권 제 2호, pp. 337 ~ 355, 2015년 4월 (KCI)</LI>
+
+<LI><U> 사물인터넷 기반 헬스케어 서비스 및 플랫폼 동향 <BR></U> 
+<I>한국통신학회지(정보와통신)</I>, 제 31권 제 12호, pp. 25 ~ 30, 2014년 12월</LI>
+
+<LI><U>모바일 중심 미래 인터넷: OpenFlow 기반 구현 및 KOREN 테스트베드 실험<BR></U> 
+<I>정보과학회논문지: 정보통신</I>, 제 41권 제 4호, pp. 167 ~ 176, 2014년 8월 (KCI)</LI>
+
+<LI><U>Load Balancing for Proxy Mobile IPv6 in SAE-based Mobile Networks<BR></U> 
+<I>Telecommunications Review</I>, 제 24권 제 3호, pp. 433 ~ 448, 2014년 6월 (KCI)</LI>
+
+<LI><U>LED 기반 조명 제어를 위한 PLASA 표준 프로토콜 기술<BR></U> 
+<I>조명전기설비학회지</I>, 제 28권 제 3호, pp. 9 ~ 21, 2014년 5월</LI>
+
+<LI><U>5세대 이동통신에서의 네트워크 이슈<BR></U> 
+<I>정보과학회지</I>, 제 31권 제 9호, pp. 20 ~ 26, 2013년 9월</LI>
+
+<LI><U>무선 인터넷 환경에서 SCTP 프로토콜의 성능 최적화 방안<BR></U> 
+<I>Telecommunications Review</I>, 제 23권 제 3호, pp. 381 ~ 392, 2013년 6월 (KCI)<
+
+<LI><U>무선 네트워크 환경에서 안드로이드 기반 SCTP 프로토콜의 성능 분석<BR></U> 
+<I>정보과학회논문지: 시스템 및 이론</I>, 제 40권 제 2호, pp. 105 ~ 110, 2013년 4월 (KCI)</LI>
+
+<LI><U>조명 제어 네트워크에서 디바이스 관리를 위한 표준 프로토콜 기술 동향<BR></U> 
+<I>조명전기설비학회지</I>, 제 27권 제 2호, pp. 56 ~ 65, 2013년 3월</LI>
+
+<LI><U>ID-LOC 분리 기반 인터넷 구조에서 분산형 매핑 시스템의 구현 및 평가<BR></U> 
+<I>한국통신학회논문지</I>, 제 37B권(네트워크 및 서비스) 제 11호, pp. 984 ~ 992, 2012년 11월 (KCI)</LI>
+
+<LI><U>이동통신 로밍 환경에서 빠른 홈망 복귀를 위한 망탐색 알고리즘<BR></U> 
+<I>정보처리학회논문지</I>, 제 19-C권 제 2호, pp. 149 ~ 152, 2012년 4월 (KCI)</LI>
+
+<LI><U>미래 인터넷의 이동 네트워크 구조 및 연구동향<BR></U> 
+<I>한국통신학회지(정보와통신)</I>, 제 29권 제 3호, pp. 41 ~ 48, 2012년 3월</LI>
+
+<LI><U>모바일 단말 환경에서 웹브라우저의 로딩속도 개선 기법<BR></U> 
+<I>Telecommunications Review</I>, 제 22권 제 1호, pp. 139 ~ 152, 2012년 2월 (KCI)</LI>
+
+<LI><U>Binding Query를 활용한 Proxy Mobile IPv6의 성능 향상 기법<BR></U> 
+<I>한국통신학회논문지</I>, 제 36권 제 11호(네트워크 및 융합서비스), pp. 1269 ~ 1276, 2011년 11월 (KCI)</LI>
+
+<LI><U>이동 LISP망에서 네트워크 기반 이동성 제어 기법<BR></U> 
+<I>정보처리학회논문지</I>, 제 18-C권 제 5호, pp. 339 ~ 342, 2011년 10월 (KCI)</LI>
+
+<LI><U>MOFI: Future Internet Architecture with Address-free Hosts for Mobile Environments<BR></U> 
+<I>Telecommunications Review</I>, 제 21권 제 2호, pp. 343 ~ 358, 2011년 4월 (KCI)</LI>
+
+<LI><U>미래 인터넷을 위한 네이밍과 어드레싱을 위한 연구<BR></U> 
+<I>정보과학회지</I>, 제 29권 제 3호, pp. 53 ~ 65, 2011년 3월</LI>
+
+<LI><U>Mobile Oriented Future Internet (MOFI): Design Considerations and Architecture<BR></U> 
+<I>OSIA Standards & Technology Review (ISSN:1738-9887) </I>, Vol. 24, No. 1, pp. 61 ~ 77, 2011년 3월</LI>
+
+<LI><U>Fast Tree Join for Seamless Multicast Handover in FMIPv6-based Mobile Networks<BR></U> 
+<I>Telecommunications Review</I>, 제 20권 제 6호, pp. 993 ~ 1003, 2010년 12월 (KCI)</LI>
+
+<LI><U>모바일 IPTV 멀티캐스트 전송 및 서비스 기술 동향<BR></U> 
+<I>정보과학회지</I>, 제 27권 제 8호, pp. 67 ~ 73, 2009년 8월</LI>
+
+<LI><U>이동통신망에서의 모바일 IPTV 표준기술 <BR></U> 
+<I>개방형컴퓨터통신연구회(OSIA) Standards & Technology Review</I>, 2009년  제 2호, pp. 49 ~ 59, 2009년 6월</LI>
+
+<LI><U>A Technique to Enable the Corruption-aware Transport Protocols in Realistic Networks<BR></U> 
+<I>Telecommunications Review</I>, 제 19권 제 1호, pp. 129 ~ 137, 2009년 2월 (KCI)</LI>
+
+<LI><U>A Cross-layer Approach for Throughput Enhancement in Unsteady Satellite Networks<BR></U> 
+<I>Telecommunications Review</I>, 제 18권 제 6호, pp. 1089 ~ 1098, 2008년 12월 (KCI)</LI>
+
+<LI><U>미래인터넷 이동성 제어 프레임워크<BR></U> 
+<I>Telecommunications Review</I>, 제 18권 제 5호, pp. 799 ~ 812, 2008년 10월 (KCI)</LI>
+
+<LI><U>리눅스 환경에서 SCTP와 TCP 프로토콜의 성능 비교<BR></U> 
+<I>한국통신학회논문지:네트워크및서비스</I>, 제 33권 제 8호, pp. 699 ~ 706, 2008년 8월 (KCI)</LI>
+
+<LI><U>3G-WiBro 망간 수직핸드오버를 위한 mSCTP 기법<BR></U> 
+<I>정보과학회논문지:정보통신</I>, 제 35권 제 4호, pp. 355 ~ 365, 2008년 8월 (KCI)</LI>
+
+<LI><U>ITU-T FMC 표준화 현황 및 국내 대응방안<BR></U> 
+<I>Telecommunications Review</I>, 제 18권 제 4호, pp. 583 ~ 592, 2008년 8월 (KCI)</LI>
+
+<LI><U>Standardization on Mobility Management Architectures and Protocols for All-IP Mobile Networks<BR></U> 
+<I>Telecommunications Review</I>, 제 18권 제 3호, pp. 508 ~ 516, 2008년 6월 (KCI)</LI>
+
+<LI><U>ITU-T NGN-GSI 이동성 관리 표준개발 동향<BR></U> 
+<I>개방형컴퓨터통신연구회(OSIA) Standards & Technology Review</I>, 2008년  제 1호, pp. 37 ~ 44, 2008년 3월</LI>
+
+<LI><U>CC-SCTP: Chunk Checksum of SCTP for Enhancement of Throughput in Wireless Network Environment<BR></U> 
+<I>Telecommunications Review</I>, 제 17권 제 4호, pp. 690 ~ 699, 2007년 8월 (KCI)</LI>
+
+<LI><U>ITU-T SG19 이동성 관리기술 표준화 동향<BR></U> 
+<I>개방형컴퓨터통신연구회(OSIA) Standards & Technology Review</I>, 2007년  제 2호, pp. 13 ~ 26, 2007년 6월</LI>
+
+<LI><U>SCTP 기반 수송계층 이동성 기술<BR></U> 
+<I>정보과학회 정보통신기술(정보통신연구회)</I>, 제 20권 제 1호, pp. 64 ~ 79, 2007년 5월</LI>
+
+<LI><U>IP 핸드오버: 망기반 기법 versus 종단간 기법<BR></U> 
+<I>한국통신학회지(정보와통신)</I>, 제 24권 제 4호, pp. 106 ~ 115, 2007년 4월</LI>
+
+<LI><U>ITU-T에서의 B3G 이동성관리 표준 기술 분석<BR></U> 
+<I>Telecommunications Review</I>, 제 16권 제 3호, pp. 460 ~ 469, 2006년 6월 (KCI)</LI>
+
+<LI><U>멀티홈잉 기반 SCTP 성능 실험 및 비교 분석<BR></U> 
+<I>정보처리학회논문지</I>, 제 13-C권 제 2호, pp. 235 ~ 240, 2006년 4월 (KCI)</LI>
+
+<LI><U>mSCTP를 이용한 종단간 이동성 지원 방안<BR></U> 
+<I>정보과학회논문지,</I>제 31권 제 4호, pp. 393 ~ 404, 2004년 8월 (KCI)</LI>
+
+<LI><U>SCTP의 멀티호밍 특성에 대한 성능 평가<BR></U> 
+<I>정보처리학회논문지,</I> 제11-C권 제2호, pp. 245 ~ 252, 2004년 4월 (KCI)</LI>
+
+<LI><U>ECTP 멀티캐스트 전송 프로토콜 : 구현 및 성능분석<BR></U> 
+<I>한국통신학회논문지</I>, 제 28권 제 10호, pp. 876 - 890, 2003년 10월 (KCI)</LI>
+
+<LI><U>3G-WLAN 연동기술 동향 <BR></U>
+<I>ETRI 전자통신동향분석</I>, 제 18권 4호 (통권 82호), pp. 1 - 10, 2003년 8월</LI>
+
+<LI><U>SCTP 표준기술 분석 및 전망 <BR></U>
+<I>ETRI 전자통신동향분석</I>, 제 18권 3호 (통권 81호), pp. 11 - 21, 2003년 6월</LI>
+
+<LI><U>"인터넷 멀티캐스트 현황 및 전망" <BR></U>
+<I>주간기술동향</I>, 제 1090호, pp. 1 - 15, 2003년 4월</LI>
+
+<LI><U>IP 멀티캐스트 시장 전망에 대한 고찰 <BR></U> 
+<I>한국통신학회지(정보통신)</I>, 제 19권 제 10호, pp. 1577 ~ 1590, 2002년 10월</LI>
+
+<LI><U>Subnet Multicast for Delivery of One-to-Many Multicast Applications<BR></U> 
+<I>Telecommunications Review</I>, 제 12권 제 5호, pp. 770 - 779, 2002년 10월 (KCI)</LI>
+
+<LI><U>인터넷방송을 위한 멀티캐스트 기술 동향 <BR></U>
+<I>ETRI 전자통신동향분석</I>, 제 17권 3호 (통권 75호), 2002년 6월</LI>
+
+<LI><U>종단간 서비스품질 표준기술 동향 <BR></U>
+<I>주간기술동향</I>, 제 1049호, 2002년 6월</LI>
+
+<LI><U>신뢰적인 멀티캐스트 전송 프로토콜을 위한 Top-Down 기반의 제어 트리 구축 방안<BR> </U>
+<I>정보과학회논문지</I>, 제 28권, 4호, pp. 611 - 620, 2001년 12월 (KCI)</LI>
+
+<LI><U>"종단간 멀티캐스트 전송을 위한 ECTP 표준 프로토콜" <BR> </U>
+<I>주간기술동향</I>, 제 1016호, 2001년 10월</LI>
+
+<LI><U>"Enhanced Core Based Tree for Many-to-Many IP Multicasting" <BR></U> 
+<I>Telecommunications Review</I>, 제 11권 제 3호, pp. 485 - 493, 2001년 6월 (KCI)</LI>
+
+<LI><U>"멀티캐스팅 프로토콜의 트리구성에 관한 성능평가 및 분석" <BR></U> 
+<I>한국통신학회논문지</I>, 제 26권 제 5호, pp. 738 - 744, 2001년 5월 (KCI)</LI>
+
+<LI><U>"인터넷 멀티캐스트 신기술 동향" <BR></U>
+<I>ETRI 전자통신동향분석</I>, 제 16권 제 2호, pp. 1-9, 2001년 4월</LI>
+
+<LI><U>"차세대 인터넷 멀티캐스팅 기술 동향" <BR> </U>
+<I>한국통신학회지(정보통신)</I>, 제 17권 제 9호, pp. 168-187, 2000년 9월</LI>
+
+<LI><U>"인터넷 멀티캐스트 라우팅 기술 동향"<BR></U>
+<I>ETRI 전자통신동향분석</I>, 제 15권 제 3호, pp. 28-41, 2000년 6월</LI>
+
+<LI><U>"멀티캐스트 신뢰전송 기술 및 표준화 동향"<BR> </U>
+<I>주간기술동향</I>, 제 944호, pp. 16 - 33, 2000년 5월</LI>
+
+<LI><U>"인터넷 전화 시장 및 표준화 동향" <BR></U>
+<I>ETRI 전자통신동향분석</I>, 제15권 2호, pp. 1 - 14, 2000년 4월호</LI>
+
+<LI><U>"액티브 네트워크 구조상에서 공동작업 응용을 위한 성능 향상 기법" <br></U> 
+<I>한국통신학회논문지 </I>, Vol. 24, No. 12B, pp. 2283 - 2291, 1999년 12월 (KCI)</LI>
+
+<LI><U>"다자간 멀티미디어 응용의 멀티캐스트 통신환경을 위한 통합관리 플랫폼"<br> </U>
+<I>한국통신학회논문지 </I>, Vol. 24, No. 12B, pp. 2262 - 2274, 1999년 12월 (KCI)</LI>
+
+<LI><U>"ATM 기반 MPLS 공중망에서의 IP 전송기술" <br> </U>
+<I>한국통신학회지(정보통신)</I>, Vol. 16, No. 12, pp. 47 - 58, 1999년 12월</LI>
+
+<LI><U>"공중 ATM 망에서의 IP 전송기술 동향"<br> </U>
+<I>주간기술동향</I>, 924호, pp. 15 - 29, 1999년 12월</LI>
+
+<LI><U>"인터넷 멀티캐스트 라우팅 프로토콜 분석" <BR></U>
+<I>ETRI 전자통신동향분석</I>, 99년 10월호, pp. 99 - 110, 1999.</LI>
+
+<LI><U>"A Control of Channel Rate for Real-time VBR Video Transmission" <BR></U>
+<I>한국경영과학회논문지</I>, 제 24권 제 3호, pp. 63 - 72, 9월, 1999. (KCI)</LI>
+
+<LI><U>"멀티캐스트 전송을 위한 오류제어 기법의 분류", <BR></U>
+<I>ETRI 전자통신동향분석</I>, 99년 6월호, pp. 76 - 84, 1999. </LI>
+
+<LI><U>"Design of Survivable Communication Networks with High Connectivity Constraints" <BR></U>
+<I>한국경영과학회논문지</I>, Vol. 22, No. 3, pp. 59-80, September, 1997. (KCI)</LI>
+
+<LI><U>"Heuristic Aspects of the Branch and Bound Procedure For a Job Scheduling Problem" <BR></U>
+<I>대한산업공학회지</I>, Vol. 18, No. 2, 141-147, 1992. (KCI)</LI></OL>
+
+</div>
+</section>
+<HR SIZE=4>

ISL-2026/paper-international.html

@@ -0,0 +1,225 @@
+<TITLE>International Papers</TITLE>
+<link rel="stylesheet" href="assets/iotsbody/iotsbody.css"/>
+
+<BODY>
+<section class="iots-body">
+<FONT FACE="Garamond">
+<H1 ALIGN="CENTER">International Journals</H1>
+<br/>
+<HR SIZE=4>
+<FONT FACE="Courier New">
+
+<div  style="max-width:1140px; margin-right:auto; margin-left:auto">
+<OL>
+
+
+<LI><U>"Globally Integrated Trust Authority (GITA) for Resource-Constrained Edge Devices in IoT and 6G" <br></U>
+<I> IEEE Transactions on Network and Service Management</I>, Vol. 23, pp. 4490~4505, April 2026</LI>
+
+<LI><U>"Application Level Trust Authority (APPLETA) for Resource-Constrained Edge Devices in IoT and 6G" <br></U>
+<I> IEEE Transactions on Consumer Electronics</I>, Vol. 71, No. 2, pp. 4934~4948, May 2025</LI>
+
+<LI><U>"mQUIC: Use of QUIC for Handover Support with Connection Migration in Wireless/Mobile Networks"<br></U>
+<I> IEEE Communications Magazine</I>, Vol. 62, Issue 4, pp. 128~134, April 2024</LI>
+
+<LI><U>"Enhanced Backoff Mechanism for Uplink OFDMA in Wireless Local Area Network"<br></U>
+<I> Journal of King Saud University - Computer and Information Sciences</I>, Vol. 36, Issue 3, pp. 1~15, March 2024</LI>
+
+<LI><U>"Use of QUIC for Mobile-Oriented Future Internet (Q-MOFI)"<br></U>
+<I> Electronics</I>, Vol. 13, Article No. 13020431, pp. 1~20, January 2024</LI>
+
+<LI><U>"Use of QUIC for CoAP Transport in IoT Networks"<br></U>
+<I> Internet of Things (ISSN: 2543-1536)</I>, Vol. 24, pp. 1~16, Article No. 100905, December 2023</LI>
+ 
+<LI><U>"Adaptive Control of Congestion Window in QUIC"<br></U>
+<I> International Conference on ICTC</I>, pp. 1394~1396, October 2023</LI>
+
+<LI><U>"Performance Evaluation of AMQP over QUIC in the Internet-of-Thing Networks"<br></U>
+<I> Journal of King Saud University - Computer and Information Sciences</I>, Vol. 35, Issue 4, pp. 1~9, April 2023</LI>
+
+<LI><U>"Use of QUIC for AMQP in IoT networks"<br></U>
+<I> Computer Networks</I>, Vol. 225, Article No. 109640, pp. 1~10, April 2023</LI>
+
+<LI><U>"Zero Energy IoT Devices in Smart Cities Using RF Energy Harvesting"<br></U>
+<I> Electronics</I>, Vol. 12, Article No. 12010148, pp. 1~24, January 2023</LI>
+        
+<LI><U>"Image Forensics Using Non-Reducing Convolutional Neural Network for Consecutive Dual Operators"<br></U>
+<I> Applied Sciences</I>, Vol. 12, Article No. 12147152, pp. 1~18, July 2022</LI>
+
+<LI><U>"6LoWPAN over Optical Wireless Communications for IPv6 Transport in Internet of Things Networks"<br></U>
+<I> IEEE Wireless Communications Letters</I>, Vol. 11, No. 6, pp. 1142~1145, June 2022</LI>
+
+<LI><U>"AEDCN-Net: Accurate and Efficient Deep Convolutional Neural Network Model for Medical Image Segmentation"<br></U>
+<I> IEEE Access</I>, Vol. 9, pp. 154194~154203, November 2021</LI>
+
+<LI><U>"Proxy-based Adaptive Transmission of MP-QUIC in Internet-of-Things Environment"<br></U>
+<I> Electronics</I>, Vol. 10, Article No. 10172175, pp. 1~14, September 2021</LI>
+
+<LI><U>"Digital Certificate Verification Scheme for Smart Grid Using Fog Computing (FONICA)"<br></U>
+<I> Sustainability</I>, Vol. 13, Article No. 13052549, pp. 1~19, February 2021</LI>
+
+<LI><U>"Framework of IoT Services over Unidirectional Visible Lights Communication Networks"<br></U>
+<I> Electronics</I>, Vol. 9, Article No. 9091349, pp. 1~22, September 2020</LI>
+
+<LI><U>"CoAP-based Streaming Control for IoT Applications"<br></U>
+<I> Electronics</I>, Vol. 9, Article No. 9081320, pp. 1~19, August 2020</LI>
+
+<LI><U>"Agent-based In-Vehicle Infotainment Services in Internet-of-Things Environments"<br></U>
+<I> Electronics</I>, Vol. 9, Article No. 9081288, pp. 1~22, August 2020</LI>
+
+<LI><U>"Partial Bicasting with Buffering for Proxy Mobile IPv6 Mobility Management in  CoAP-Based IoT Networks"<br></U>
+<I> Electronics</I>, Vol. 9, Article No. 9040598, pp. 1~13, April 2020</LI>
+
+<LI><U>"Distributed Identifier-Locator Mapping Management in Mobile ILNP Networks"<br></U>
+<I> Electronics</I>, Vol. 9, Article No. 9010058, pp. 1~26, January 2020</LI>
+
+<LI><U>"Mobile-Oriented Future Internet: Implementation and Experimentations over EU-Korea Testbed"<br></U>
+<I> Electronics</I>, Vol. 8, Article No. 8030338, pp. 1~24, March 2019</LI>
+
+<LI><U>"IoT-Based Resource Control for In-Vehicle Infotainment Services: Design and Experimentation"<br></U>
+<I> Sensors</I>, Vol. 19, Article No. s19030620, pp. 1~19, March 2019</LI>
+
+<LI><U>"CoAP-based group mobility management protocol for the Internet-of-Things in WBAN environment"<br></U>
+<I> Future Generation Computer Systems</I>, Vol. 88, pp. 309~318, November 2018</LI>
+
+<LI><U>"Domain-based Distributed Identifier-Locator Mapping Management in Internet-of-Things Networks"<br></U>
+<I> International Journal of Network Management</I>, Vol. 28, Issue 5 (e2035), pp. 1~13, October 2018</LI>
+
+<LI><U>"Cluster-Based Device Mobility Management in Named Data Networking for Vehicular Networks"<br></U>
+<I> Mobile Information Systems</I>, Vol. 2018, pp. 1~7, Open Access Article (Article ID 1710591), August 2018</LI>
+
+<LI><U>"Device Management and Data Transport in IoT Networks Based on Visible Light Communication"<br></U>
+<I> Sensors</I>, Vol. 18, Article No. s18082741, August 2018</LI>
+
+<LI><U>"Enhanced group communication in constrained application protocol-based Internet-of-things networks"<br></U>
+<I> International Journal of Distributed Sensor Networks</I>, Vol. 14, Issue 4, pp. 1~14, April 2018</LI>
+
+<LI><U>"Reliable transmission of visible light communication data in lighting control networks"<br></U>
+<I> IET Networks</I>, Vol. 6, Issue 3, pp. 62~68, May 2017 (SCOPUS)</LI>
+
+<LI><U>"Distributed CoAP Handover using Distributed Mobility Agents in Internet-of-Things Networks"<br></U>
+<I> Journal of Information and Communication Convergence Engineering</I>, Vol. 15, No. 1, pp. 37~42, March 2017 (SCOPUS)</LI>
+
+<LI><U>"A hash-based distributed mapping control scheme in mobile locator-identifier separation protocol networks"<br></U>
+<I> International Journal of Network Management</I>,  Vol. 27, No. 2, pp. 1~13, March 2017</LI>
+
+<LI><U>"Use of Proxy Mobile IPv6 for Mobility Management in CoAP-based IoT Networks"<br></U>
+<I> IEEE Communications Letters</I>, Vol. 20, No. 11, pp. 2284~2287, November 2016</LI>
+
+<LI><U>"Mobility-Aware TAC Configuration in LTE-Based Mobile Communication Systems"<br></U>
+<I> Lecture Notes in Electrical Engineering</I>, Vol. 393, pp. 295~301, August 2016 (SCOPUS)</LI>
+
+<LI><U>"Inter-Domain Mobility Management Based on the Proxy Mobile IP in Mobile Networks"<br></U>
+<I> Journal of Information Processing Systems</I>, Vol. 12, No. 2, pp. 196~213, June 2016 (SCOPUS)</LI>
+
+<LI><U>"TRILL-Based Mobile Packet Core Network for 5G Mobile Communication Systems"<br></U>
+<I> Wireless Personal Communications</I>, Vol. 87, No. 1, pp. 125~144, March 2016</LI>
+
+<LI><U>"Distributed Mobility Management in 6LoWPAN-Based Wireless Sensor Networks"<br></U>
+<I> International Journal of Distributed Sensor Networks</I>, Vol. 11, Issue 10, 12 pages, October 2015</LI>
+
+<LI><U>"An ID/Locator Separation Based Group Mobility Management in Wireless Body Area Network"<br></U>
+<I> Journal of Sensors</I>, Vol. 2015, Open Access Article (Article ID 537205), 12 pages, July 2015</LI>
+
+<LI><U>"Fast Device Discovery for Remote Device Management in Lighting Control Networks"<br></U>
+<I> Journal of Information Processing Systems</I>, Vol. 11, No. 1, pp. 125~133, March 2015 (SCOPUS)</LI>
+
+<LI><U>"Performance Analysis of Distributed Mapping System in ID/Locator Separation Architectures"<br></U>
+<I> Journal of Network and Computer Applications</I>, Vol. 39, pp. 223~232, March 2014</LI>
+
+<LI><U>"A Distributed Mobility Control Scheme in LISP Networks"<br></U>
+<I> Wireless Networks</I>, Vol. 20, No. 2, pp. 245~259, February 2014</LI>
+
+<LI><U>"Distributed Mapping Management of Identifiers and Locators in Mobile-Oriented Internet Environment"<br></U>
+<I> International Journal of Communication Systems</I>, Vol. 27, No. 1, pp. 95~115, January 2014</LI>
+
+<LI><U>"A Network-Based Handover Scheme in HIP-Based Mobile Networks"<br></U>
+<I> Journal of Information Processing Systems</I>, Vol. 9, No. 4, pp. 651~659, December 2013 (SCOPUS)</LI>
+
+<LI><U>"Distributed Mapping Management of Identifiers and Locators in LISP-based Mobile Networks"<br></U>
+<I> Wireless Personal Communications</I>, Vol. 72, No. 1, pp. 565~579, September 2013</LI>
+
+<LI><U>"Mobile Oriented Future Internet (MOFI): Architectural Design and Implementations"<br></U>
+<I> ETRI Journal</I>, Vol. 35, No. 4, pp. 666~676, August 2013</LI>
+
+<LI><U>"Network-Based Distributed Mobility Control in Localized Mobile LISP Networks"<br></U>
+<I> IEEE Communications Letters</I>, Vol. 16, No. 1, pp. 104~107, January 2012</LI>
+
+<LI><U>"Partial Bicasting with Buffering for Proxy Mobile IPv6 Handover in Wireless Networks"<br></U>
+<I> Journal of Information Processing Systems</I>, Vol. 7, No. 4, pp. 627~634, December 2011 (SCOPUS)</LI>
+
+<LI><U>"Distributed Mobility Control in Proxy Mobile IPv6 Networks"<br></U>
+<I> IEICE Transactions on Communications</I>, Vol. E94-B, No. 8, pp. 2216~2224, August 2011</LI>
+
+<LI><U>"Adaptive Congestion Control of mSCTP for Vertical Handover Based on Bandwidth Estimation in Heterogeneous Wireless Networks"<br></U>
+<I> Wireless Personal Communications</I>, Vol. 57, No. 4, pp. 707~725, April 2011</LI>
+
+<LI><U>"Multicast Handover Agents for Fast Handover in Wireless Multicast Networks"<br></U>
+<I> IEEE Communications Letters</I>, Vol. 14, No. 7, pp. 676~678, July 2010</LI>
+
+<LI><U>"Fast Selective ACK Scheme for Throughput Enhancement of Multi-Homed SCTP Hosts"<br></U>
+<I> IEEE Communications Letters</I>, Vol. 14, No. 6, pp. 587~589, June 2010</LI>
+
+<LI><U>"Performance Enhancement of mSCTP for Vertical Handover across Heterogeneous Wireless Networks"<br></U>
+<I> International Journal of Communication Systems</I>, Vol. 22, No. 12, pp. 1573~1591, December 2009</LI>
+
+<LI><U>"Corruption-aware Adaptive Increase and Adaptive Decrease Algorithm for TCP Error and Congestion Controls in Wireless Networks"<br></U>
+<I> International Journal of Communication Systems</I>, Vol. 22, No. 5, pp. 543~564, May 2009</LI>
+
+<LI><U>"Partial CRC Checksum of SCTP for Error Control over Wireless Networks"<br></U>
+<I> Wireless Personal Communications</I>, Vol. 48, No. 2, pp. 247~260, January 2009</LI>
+
+<LI><U>"Analysis of Handover Latency for Mobile IPv6 and mSCTP"<br></U>
+<I> Journal of Information Processing Systems</I>, Vol. 4, No. 3, pp. 87~96, September 2008 (SCOPUS)</LI>
+
+<LI><U>"mSIP: Extension of SIP for Soft Handover with Bicasting"<br></U>
+<I> IEEE Communications Letters</I>, Vol. 12, No. 7, pp. 532~534, July 2008</LI>
+
+<LI><U>"Chunk Checksum of SCTP for Throughput Enhancement"<br></U>
+<I> IEEE Communications Letters</I>, Vol. 10, No. 11, pp. 796~798, November 2006</LI>
+
+<LI><U>"Mobility Management Requirements and Framework for Systems Beyond IMT-2000",<BR></U>
+<I>Journal of Communications and Networks</I>, Vol. 7, No. 2, pp. 171~177, June 2005</LI>
+
+<LI><U>"Transport Layer Mobility Support Utilizing Link Signal Strength Information", <BR></U>
+<I> IEICE Transactions on Communications</I>, Vol. E87-B, No. 9, pp. 2548~2556, September 2004</LI>
+
+<LI><U>"Limiting the Length of BET for Tunnel-Based IP Fast Handover", <BR></U>
+<I> IEICE Transactions on Fundamentals of Electronics Communications and Computer Sciences</I>,<BR> 
+Vol. E87-A, No. 6, pp. 1527~1530, June 2004</LI>
+
+<LI><U>"mSCTP for Soft Handover in Transport Layer", <BR></U>
+<I> IEEE Communications Letters</I>, Vol. 8, No. 3, pp. 189~191, March 2004</LI>
+
+<LI><U>"Configuration of ACK Trees for Multicast Transport Protocols", <BR></U>
+<I>ETRI Journal</I>, Vol. 23, No. 3, pp. 111~120, September 2001</LI>
+
+<LI><U>"Assignment of ADM Rings and DCS Mesh in Telecommunication Networks", <BR></U>
+<I>Journal of the O.R. Society</I>, Vol. 52, No. 4, pp. 440~448, April 2001</LI>
+
+<LI><U>"Multicast Delivery Based on Unicast and Subnet Multicast",</U> <BR>
+<I>IEEE Communications Letters</I>, Vol. 5, No. 4, pp. 181~183, April 2001</LI>
+
+<LI><U>"Dynamic Bandwidth Allocation Scheme for Multiple Real-time VBR Videos over ATM Networks", </U><BR>
+<I>Telecommunications Systems</I>, Vol. 15, pp.359~380, December 2000</LI>
+
+<LI><U>"Minimizing Cost and Delay in Shared Multicast Trees",</U> <BR>
+<I>ETRI Journal</I>, Vol. 22, No. 1, pp.30~37, March 2000</LI>
+
+<LI><U>"Non-Core Based Shared Tree Architecture for IP Multicasting",</U> <BR>
+<I>Electronics Letters</I>, Vol. 35, No. 11, pp. 872~873, May 1999</LI>
+
+<LI><U>"A Design of the Self-Healing ATM Networks Based on the Backup Virtual Path,"</U><BR>
+<I>Computers and Operations Research</I>, Vol. 25, No. 7/8, pp. 595~609, July 1998</LI>
+
+<LI><U>"A Design of the Minimum Cost Ring-Chain Network with Dual-Homing Survivability: Tabu Search Approach" <BR></U>
+<I>Computers and Operations Research</I>, Vol. 24, No. 9, pp. 883~897, September 1997</LI>
+
+<LI><U>"A Tabu Search for the Survivable Fiber Optic Communication Network Design," </U><BR>
+<I>Computers and Industrial Engineering</I>, Vol. 28, Issue 4, pp. 689~700, October 1995</LI> 
+
+</div>
+</section>
+<HR SIZE=4>
+
+

ISL-2026/patent.html

@@ -0,0 +1,452 @@
+<TITLE>Patents</TITLE>
+<link rel="stylesheet" href="assets/iotsbody/iotsbody.css"/>
+<style>div hr {margin-right:-150px; margin-left : -150px; border: 0; height: 1.2px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));}</style>
+
+<BODY>
+<section class="iots-body">
+<FONT FACE="Garamond">
+<H1 ALIGN="CENTER"> Patents</H1>
+
+<br/><HR SIZE=4>
+
+<B>
+<FONT FACE="Courier New">
+<div  style="max-width:1140px; margin-right:auto; margin-left:auto">
+<OL>
+
+<LI>국내 지역별 태양광 발전량 및 전력 단가 예측 웹 서비스 제공 장치 및 그 방법<BR>
+발명자: 고석주, 김경훈, 김나현, 정수인, 홍일표<BR>
+출원번호: 2025-0200788 (한국, 2025.12.16)<BR>
+</LI><BR><BR>
+
+<LI>사물인터넷 네트워크 환경에서 QUIC 기반으로 CoAP 메시지를 중계하는 시스템<BR>
+발명자: 고석주, 정중화, 남혜빈, 최동규, 김민지<BR>
+출원번호: 2023-0180751 (한국, 2023.12.13)<BR>
+등록번호: 2963109 (한국, 2026.05.06)<BR>
+</LI><BR><BR>
+
+<LI>엣지 컴퓨팅을 위한 사물인터넷 서비스 시스템<BR>
+발명자: 고석주, 정중화, 남혜빈, 최동규<BR>
+출원번호: 2023-0161365 (한국, 2023.11.20)<BR>
+</LI><BR><BR>
+
+<LI>무선 네트워크 환경에서 핸드오버 및 커넥션 마이그레이션을 지원하는 장치 및 방법<BR>
+발명자: 고석주, 김소용, 모닙 고하르, 최동규<BR>
+출원번호: 2023-0063455 (한국, 2023.05.17)<BR>
+</LI><BR><BR>
+
+
+<LI>제한된 통신 환경에서 브로커 서버를 이용한 스마트 약상자 제어 시스템 및 방법<BR>
+발명자: 고석주, 김근수, 김철민, 김경식, 나재욱, 박진호<BR>
+출원번호: 2020-0164156 (한국, 2020.11.30)<BR>
+등록번호: 2384614 (한국, 2022.4.05)<BR>
+</LI><BR><BR>
+
+<LI>단방향 가시광 통신 환경에서 데이터 전송 신뢰성 개선을 위한 방법 및 이를 이용한 하이브리드
+통신 시스템<BR>
+발명자: 고석주, 김소용, 최동규, 남혜빈, 정중화, 김창묵<BR>
+출원번호: 2020-0164152 (한국, 2020.11.30)<BR>
+등록번호: 2420614 (한국, 2022.7.08)<BR>
+</LI><BR><BR>
+
+<LI>사물 인터넷 서비스를 제공하기 위한 QUIC-Proxy를 이용한 데이터 전달 방법 및 장치<BR>
+발명자: 고석주, 김소용, 최동규, 남혜빈, 정중화<BR>
+출원번호: 2020-0164141 (한국, 2020.11.30)<BR>
+등록번호: 2345473 (한국, 2021.12.27)<BR>
+</LI><BR><BR>
+
+<LI>금연구역 관리 서비스 방법 및 시스템<BR>
+발명자: 고석주, 이정우, 이용호, 권오상, 정서영, 김경식<BR>
+출원번호: 2020-0101365 (한국, 2020.8.12)<BR>
+등록번호: 2375686 (한국, 2022.3.14)<BR>
+</LI><BR><BR>
+
+<LI>사물 인터넷 환경에서 CoAP 기반의 데이터 스트리밍 방법 및 통신 시스템<BR>
+발명자: 고석주, 정중화, 최동규, 남혜빈, 이채현<BR>
+출원번호: 2020-0094058 (한국, 2020.7.28)<BR>
+등록번호: 2375703 (한국, 2022.3.14)<BR>
+</LI><BR><BR>
+
+<LI>인공지능 기반 적외선 카메라 센싱 시스템 및 방법<BR>
+발명자: 고석주, 홍성기, 김희원, 박명훈, 권민철<BR>
+출원번호: 2019-0174964 (한국, 2019.12.26)<BR>
+</LI><BR><BR>
+
+<LI>폭력 행위 관리 시스템 및 방법<BR>
+발명자: 고석주, 김동욱, 윤서원, 구영준, 성경화, 경예지<BR>
+출원번호: 2019-0122161 (한국, 2019.10.02)<BR>
+등록번호: 2264275 (한국, 2021.6.7)<BR>
+</LI><BR><BR>
+
+<LI>차량 인포테인먼트 관리 시스템<BR>
+발명자: 고석주, 최동규, 정중화, 남혜빈, 손종명<BR>
+출원번호: 2019-0120044 (한국, 2019.9.27)<BR>
+등록번호: 2410024 (한국, 2022.6.13)<BR>
+</LI><BR><BR>
+
+<LI>차량 인포테인먼트 마스터 장치 및 이를 포함하는 차량 인포테인먼트 통합 관리 시스템<BR>
+발명자: 고석주, 최동규, 정중화, 남혜빈, 신호경<BR>
+출원번호: 2019-0059551 (한국, 2019.5.21)<BR>
+등록번호: 2251310 (한국, 2021.5.6)<BR>
+</LI><BR><BR>
+
+<LI>CoAP 기반의 센싱 정보 스트리밍 방법<BR>
+발명자: 고석주, 최동규, 정중화, 남혜빈<BR>
+출원번호: 2018-0168580 (한국, 2018.12.24)<BR>
+</LI><BR><BR>
+
+<LI>이미지에서 기계학습 기법을 활용한 특정 부품영역 탐지 방법<BR>
+발명자: 고석주, 김대기, 김동인, 방종원, 우진철, 정중화<BR>
+출원번호: 2018-0167974 (한국, 2018.12.21)<BR>
+</LI><BR><BR>
+
+<LI>블록체인 기반의 재정장부 관리 시스템<BR>
+발명자: 고석주, 신승민, 서상민, 송동훈, 최효선, 그레고즈 리뼤시치<BR>
+출원번호: 2018-0167970 (한국, 2018.12.21)<BR>
+</LI><BR><BR>
+
+<LI>블록체인을 이용한 게임정보 처리 방법<BR>
+발명자: 고석주, 정재훈, 서창호, 노경환, 원응호<BR>
+출원번호: 2018-0167951 (한국, 2018.12.21)<BR>
+</LI><BR><BR>
+
+<LI>가시광 통신을 이용한 서비스 제공 시스템 및 그 방법<BR>
+발명자: 고석주, 김철민, 김소용, 모닙고하르<BR>
+출원번호: 2018-0155013 (한국, 2018.12.5)<BR>
+</LI><BR><BR>
+
+<LI>차량 인포테인먼트 시스템<BR>
+발명자: 고석주, 최동규, 정중화, 정민우<BR>
+출원번호: 2018-0083515 (한국, 2018.7.18)<BR>
+</LI><BR><BR>
+
+<LI>CoAP 기반의 사물인터넷 기술을 이용한 센서 관리 방법 및 이를 이용한 시스템<BR>
+발명자: 고석주, 최동규, 정중화, 정민우<BR>
+출원번호: 2018-0082485 (한국, 2018.7.16)<BR>
+등록번호: 2071974 (한국, 2020.1.23)<BR>
+</LI><BR><BR>
+
+<LI>가시광 통신을 이용한 무선 인터넷 비밀번호 관리 시스템 및 방법<BR>
+발명자: 김소용, 김철민, 고석주<BR>
+출원번호: 2018-0082463 (한국, 2018.7.16)<BR>
+</LI><BR><BR>
+
+<LI>시각 장애인을 위한 가시광 통신 기반의 교통 신호 전달 시스템 및 방법<BR>
+발명자: 권경동, 금동우, 황지영, 채윤창, 김철민, 김소용, 고석주<BR>
+출원번호: 2018-0079319 (한국, 2018.7.9)<BR>
+</LI><BR><BR>
+
+<LI>데이터 전달 장치, 방법과 그를 이용한 사물 인터넷 시스템, 데이터 전달 방법을 실행하기 위한 프로그램이<BR>
+기록된 기록매체 및 하드웨어와 결합하여 데이터 전달 방법을 실행하기 위하여 매체에 저장된 프로그램<BR>
+발명자: 고석주, 최동규, 정중화<BR>
+출원번호: 2017-0153908 (한국, 2017.11.17)<BR>
+등록번호: 1969652 (한국, 2019.4.10)<BR>
+</LI><BR><BR>
+
+<LI>분산된 게시-구독 기법을 이용한 CoAP 기반 사물 인터넷 시스템의 작동 방법<BR>
+발명자: 고석주, 정중화, 최동규<BR>
+출원번호: 2017-0153357 (한국, 2017.11.16)<BR>
+등록번호: 2031726 (한국, 2019.10.7)<BR>
+</LI><BR><BR>
+
+<LI>비콘 기반 식당 정보 서비스 시스템 및 방법<BR>
+발명자: 고석주, 안창준, 김혜경, 송명근, 최예찬, 허동<BR>
+출원번호: 2017-0087265 (한국, 2017.7.10)<BR>
+</LI><BR><BR>
+
+<LI>사물 인터넷 네트워크에서의 모바일 단말 이동성 제어 장치 및 방법<BR>
+발명자: 고석주, 최상일<BR>
+출원번호: 2017-0064039 (한국, 2017.5.24)<BR>
+등록번호: 1847081 (한국, 2018.4.3)<BR>
+</LI><BR><BR>
+
+<LI>데이터 전달 장치, 방법 및 그를 이용한 사물인터넷 시스템<BR>
+발명자: 고석주, 정중화, 강형우, 최동규<BR>
+출원번호: 2016-0175882 (한국, 2016.12.21)<BR>
+등록번호: 1972470 (한국, 2019.4.19)<BR>
+</LI><BR><BR>
+
+<LI>저전력 근거리 통신을 이용한 개인 정보 교환 방법 및 시스템, 이를 수행하기 위한 기록매체<BR>
+발명자: 고석주, 김지인, 김지희, 김송아, 박지혜, 이승일, 서대화<BR>
+출원번호: 2016-0157411 (한국, 2016.11.24)<BR>
+등록번호: 1784309 (한국, 2017.9.27)<BR>
+</LI><BR><BR>
+
+<LI>가시광 통신 기기 관리 방법 및 장치 (with 유양디앤유)<BR>
+발명자: 김상옥, 유병오, 윤상호, 노승완, 고석주, 최상일 <BR>
+출원번호: 2016-0157606 (한국, 2016.11.24)<BR>
+</LI><BR><BR>
+
+<LI>가시광 통신 방법 및 장치 (with 유양디앤유)<BR>
+발명자: 김상옥, 유병오, 윤상호, 노승완, 고석주, 최상일 <BR>
+출원번호: 2016-0157576 (한국, 2016.11.24)<BR>
+</LI><BR><BR>
+
+<LI>이동 단말 및 관리 서버의 제어 방법<BR>
+발명자: 고석주, 최상일 <BR>
+출원번호: 2016-0051126 (한국, 2016.4.26)<BR>
+등록번호: 1836116 (한국, 2018.3.2)<BR>
+</LI><BR><BR>
+
+<LI>무선 통신을 이용한 범용 안내 서비스 제공 방법 및 시스템<BR>
+발명자: 고석주, 장호영, 이종훈, 박찬석, 서민영 <BR>
+출원번호: 2016-0013614 (한국, 2016.2.3)<BR>
+등록번호: 1716661 (한국, 2017.3.9)<BR>
+</LI><BR><BR>
+
+<LI>디지털 도어락 시스템 및 그 제어 방법<BR>
+발명자: 고석주, 권다영, 노혜성, 이수정 <BR>
+출원번호: 2015-0163735 (한국, 2015.11.23)<BR>
+등록번호: 1814555 (한국, 2017.12.27)<BR>
+</LI><BR><BR>
+
+<LI>무인 지상차량을 이용한 주차차량 관리 시스템<BR>
+발명자: 김인한, 권혜련, 이은섭, 고석주<BR>
+출원번호: 2015-0008735 (한국, 2015.1.19)<BR>
+</LI><BR><BR>
+
+<LI>ESL 신호를 이용하는 측위 방법, 이를 수행하기 위한 기록 매체, 단말기 및 시스템<BR>
+발명자: 고석주, 김지인, 이민형, 김종근, 박지수, 조정근, 이승일, 서대화<BR>
+출원번호: 2014-0180037 (한국, 2014.12.15)<BR>
+등록번호: 1596320 (한국, 2016.2.16)<BR>
+</LI><BR><BR>
+
+<LI>ESL 신호를 이용하여 위치 기반 서비스를 제공하는 스마트 장치, <BR>
+이 장치를 포함하는 스마트 카트 및 ESL 신호를 이용하여 위치 기반 서비스를 제공하는 방법<BR>
+발명자: 고석주, 김지인, 이민형, 김종근, 박지수, 조정근, 이승일, 서대화<BR>
+출원번호: 2014-0180036 (한국, 2014.12.15)<BR>
+</LI><BR><BR>
+
+<LI>3차원 형상 복원을 위한 볼륨 카빙 장치 및 그 방법<BR>
+발명자: 고석주, 하태윤, 서대화, 정귀영, 이상은, 김지인, 김한별<BR>
+출원번호: 2014-0167063 (한국, 2014.11.27)<BR>
+</LI><BR><BR>
+
+<LI>립모션 기기를 이용한 수화 번역 시스템 및 그 방법<BR>
+발명자: 고석주, 조재현, 서대화, 이동훈, 이상은, 김지인, 하대규<BR>
+출원번호: 2014-0166166 (한국, 2014.11.26)<BR>
+</LI><BR><BR>
+
+<LI>립모션 기기의 수화 번역 정확도 향상을 위한 수화 번역 시스템 및 그 방법<BR>
+발명자: 고석주, 조재현, 서대화, 이동훈, 이상은, 김지인, 하대규<BR>
+출원번호: 2014-0166165 (한국, 2014.11.26)<BR>
+</LI><BR><BR>
+
+<LI>저전력 근거리 통신을 이용한 개인 정보 교환 방법 및 시스템, 이를 수행하기 위한 기록매체<BR>
+발명자: 고석주, 김지희, 서대화, 박지혜, 이승일, 김지인, 김송아<BR>
+출원번호: 2014-0164802 (한국, 2014.11.24)<BR>
+</LI><BR><BR>
+
+<LI>차량 분산 방법 및 장치, 이를 수행하기 위한 기록매체<BR>
+발명자: 고석주, 김지인, 엄진욱, 김민규, 홍석진, 배정규, 서대화<BR>
+출원번호: 2014-0161975 (한국, 2014.11.19)<BR>
+등록번호: 1612047 (한국, 2016.4.6) <BR>
+</LI><BR><BR>
+
+<LI>신규 액세스 포인트의 위치 인식 방법 및 이를 이용하는 서버<BR>
+발명자: 고석주, 김우주, 이민형, 하태윤, 심대섭, 조정근, 강보영, 서대화<BR>
+출원번호: 2013-0167207 (한국, 2013.12.30)<BR>
+등록번호: 1568365 (한국, 2015.11.5) <BR>
+</LI><BR><BR>
+
+<LI>디바이스 탐색 장치 및 디바이스 탐색 방법<BR>
+발명자: 고석주, 이상헌, 최상일<BR>
+출원번호: 2013-0140737 (한국, 2013.11.19)<BR>
+등록번호: 1405248 (한국, 2015.4.17) <BR>
+</LI><BR><BR>
+
+<LI>오픈플로우 통신 시스템 및 방법<BR>
+발명자: 고석주, 김지인, 최낙중<BR>
+출원번호: 2013-0140736 (한국, 2013.11.19)<BR>
+등록번호: 1525047 (한국, 2015.5.27) <BR>
+</LI><BR><BR>
+
+<LI>이동통신 시스템의 추적 영역 코드 구성 장치 및 방법<BR>
+발명자: 고석주, 강형우, 백태산, 강현구<BR>
+출원번호: 2013-0140734 (한국, 2013.11.19)<BR>
+등록번호: 1538453 (한국, 2015.7.15) <BR>
+</LI><BR><BR>
+
+<LI>프로세스 모니터링과 키보드 잠금을 이용한 프로세스 관리 방법 및 프로세스 관리 장치<BR>
+발명자: 고석주, 박진호, 이재휘<BR>
+출원번호: 2013-0108587 (한국, 2013.09.10)<BR>
+등록번호: 1515493 (한국, 2015.4.21) <BR>
+</LI><BR><BR>
+
+<LI>공유기 탐지 장치 및 공유기 탐지 방법<BR>
+발명자: 고석주, 박진호, 김철민<BR>
+출원번호: 2013-0091483 (한국, 2013.08.01)<BR>
+</LI><BR><BR>
+
+<LI>호스트 식별 프로토콜 네트워크 환경의 통신 시스템 및 방법<BR>
+발명자: 고석주, 최상일<BR>
+출원번호: 2012-0154836 (한국, 2012.12.27)<BR>
+등록번호: 1405248 (한국, 2014.6.2) <BR>
+</LI><BR><BR>
+
+<LI>액세스 라우터 및 그를 이용한 핸드오버 제어 방법<BR>
+발명자: 고석주, 최낙중, 김지인<BR>
+출원번호: 2012-0154835 (한국, 2012.12.27)<BR>
+등록번호: 1447104 (한국, 2014.9.26) <BR>
+</LI><BR><BR>
+
+<LI>호스트 식별 프로토콜 네트워크 환경의 이동통신 시스템 및 방법<BR>
+발명자: 고석주, 김지인, 이상헌<BR>
+출원번호: 2012-0146740 (한국, 2012.12.14)<BR>
+등록번호: 1459628 (한국, 2014.11.3) <BR>
+</LI><BR><BR>
+
+<LI>라우터의 호스트 위치 관리 방법<BR>
+발명자: 고석주, 김지인<BR>
+출원번호: 2012-0030058 (한국, 2012.03.23)<BR>
+등록번호: 1356721 (한국, 2014.1.20) <BR>
+</LI><BR><BR>
+
+<LI>분산형 구조를 이용한 데이터 통신 방법<BR>
+발명자: 고석주, 모닙고하르, 이재경<BR>
+출원번호: 2011-0111384 (한국, 2011.10.28)<BR>
+등록번호: 1311864 (한국, 2013.09.17) <BR>
+</LI><BR><BR>
+
+<LI>라우터, 그것을 포함하는 통신 네트워크 시스템 및 그것의 이동성 제어 방법<BR>
+발명자: 고석주, 최상일<BR>
+출원번호: 2011-0107533 (한국, 2011.10.20)<BR>
+등록번호: 1329331 (한국, 2013.11.07) <BR>
+</LI><BR><BR>
+
+<LI>모바일 액세스 게이트웨이 및 이를 이용한 이동성 제어 방법<BR>
+발명자: 고석주, 김지인<BR>
+출원번호: 2011-0057608 (한국, 2011.06.14)<BR>
+등록번호: 1223047 (한국, 2013.01.10) <BR>
+</LI><BR><BR>
+
+<LI>멀티홈잉 환경에서 프록시 모바일 인터넷 프로토콜을 사용하는 이동통신 시스템 및 그것의 핸드오버 방법<BR>
+발명자: 고석주, 김지인<BR>
+출원번호: 2011-0001905 (한국, 2011.01.07)<BR>
+등록번호: 1189140 (한국, 2012.10.02) <BR>
+</LI><BR><BR>
+
+<LI>멀티캐스트 방법 및 억세스 게이트웨이<BR>
+발명자: 고석주, 모닙고하르, 이재경<BR>
+출원번호: 2010-0137897 (한국, 2010.12.29)<BR>
+등록번호: 1200407 (한국, 2012.11.06) <BR>
+</LI><BR><BR>
+
+<LI>프록시 모바일 인터넷 프로토콜을 사용하는 이동통신 시스템 및 그것의 핸드오버 방법<BR>
+발명자: 고석주, 김지인<BR>
+출원번호: 2010-0108058 (한국, 2010.11.02)<BR>
+등록번호: 1258238 (한국, 2013.04.19) <BR>
+</LI><BR><BR>
+
+<LI>이동 단말, 통신 네트워크 및 그것의 이동성 제어 방법<BR>
+발명자: 고석주, 최상일<BR>
+출원번호: 2010-0107701 (한국, 2010.11.01)<BR>
+등록번호: 1177354 (한국, 2012.08.21) <BR>
+</LI><BR><BR>
+
+<LI>빠른 핸드오버를 지원하기 위한 이동통신 시스템 및 방법<BR>
+발명자: 고석주, 모닙고하르, 박재완<BR>
+출원번호: 2010-0039688 (한국, 2010.04.28)<BR>
+등록번호: 1091397 (한국, 2011.12.01) <BR>
+</LI><BR><BR>
+
+<LI>이동 단말간 데이터 전송 시스템 및 그 방법<BR>
+발명자: 고석주, 권순홍<BR>
+출원번호: 2009-0048797 (한국, 2009.06.02)<BR>
+등록번호: 1078156 (한국, 2011.10.24) <BR>
+</LI><BR><BR>
+
+<LI>프록시 모바일 IPv6망내 이동단말간 통신 경로 최적화 시스템 및 그 방법<BR>
+발명자: 고석주, 김지인<BR>
+출원번호: 2009-0048796 (한국, 2009.06.02)<BR>
+국제(PCT)출원번호: PCT/KR2009/004942 (PCT출원일: 2009.09.02)<BR>
+</LI><BR><BR>
+
+<LI>이종 무선망간 수직 핸드오버를 위한 이동 SCTP의 적응적 혼잡 제어 방법 및 장치<BR>
+발명자: 고석주, 김동필<BR>
+출원번호: 2009-0013072 (한국, 2009.02.17)<BR>
+등록번호: 1048251 (한국, 2011.07.04) <BR>
+</LI><BR><BR>
+
+<LI>서비스 품질 향상을 위한 PR-SCTP 기반 실시간 멀티미디어 데이터 전송 방법<BR>
+발명자: 고석주, 김상태<BR>
+출원번호: 2008-0135342 (한국, 2008.12.29)<BR>
+등록번호: 1040780 (한국, 2011.06.03) <BR>
+</LI><BR><BR>
+
+<LI>이종 무선망간의 수직적 핸드오버를 위한 데이터 전송 방법 및 장치<BR>
+발명자: 고석주, 김동필<BR>
+출원번호: 2008-0083995 (한국, 2008.08.27)<BR>
+등록번호: 0980592 (한국, 2010.08.31) <BR>
+</LI><BR><BR>
+
+<LI>무선통신용 멀티캐스트 핸드오버 방법<BR>
+발명자: 고석주, 박재성<BR>
+출원번호: 2008-0077918 (한국, 2008.08.08)<BR>
+</LI><BR><BR>
+
+<LI>무선 인터넷 망에서의 바이캐스팅을 이용한 SIP 핸드오버 방법 및 이동 단말<BR>
+발명자: 고석주, 이동화<BR>
+출원번호: 2008-0052456 (한국, 2008.06.04)<BR>
+등록번호: 0987555 (한국, 2010.10.06) <BR>
+</LI><BR><BR>
+
+<LI>무선 인터넷 환경에서의 바이캐스팅 기반 SCTP 핸드오버 방법 및 이동 단말<BR>
+발명자: 고석주, 권순홍, 김동필<BR>
+출원번호: 2008-0049203 (한국, 2008.05.27)<BR>
+등록번호: 0980582 (한국, 2010.08.31) <BR>
+</LI><BR><BR>
+
+<LI>Proxy MIP 기반 무선 인터넷 망에서의 바이캐스팅을 이용한 핸드오버 방법 및 장치<BR>
+발명자: 고석주, 김지인<BR>
+출원번호: 2008-0049153 (한국, 2008.05.27)<BR>
+</LI><BR><BR>
+
+<LI>윈도우 기반의 이동 단말에서 SCTPLIB를 이용한 mSCTP 핸드오버 방법<BR>
+발명자: 김용진, 고석주, 이동화, 김상태<BR>
+출원번호: 2007-0139730 (한국, 2007.12.28)<BR>
+</LI><BR><BR>
+
+<LI>전송 처리율 향상을 위한 SCTP 우선경로 설정 방법<BR>
+발명자: 고석주, 주수경<BR>
+출원번호: 2007-0102031 (한국, 2007.10.10) <BR>
+</LI><BR><BR>
+
+<LI>무선 네트워크에서 패킷의 손상정보를 사용하는 TCP 혼잡제어 방법<BR>
+발명자: 고석주, 최린, 이동화, 김용진<BR>
+출원번호: 2007-0061209 (한국, 2007.06.21) <BR>
+등록번호: 0870619 (한국, 2008.11.19) <BR>
+</LI><BR><BR>
+
+<LI>이동 단말의 SCTP 핸드오버와 모바일 아이피의 연동 장치 및 그 방법<BR>
+발명자: 고석주, 김동필<BR>
+출원번호: 2007-0050648 (한국, 2007.05.25) <BR>
+등록번호: 0880112 (한국, 2009.01.15) <BR>
+</LI><BR><BR>
+
+<LI>청크첵섬을 사용하는 무선 인터넷 에스씨티피 송수신 시스템 및 방법<BR>
+발명자: 김용진, 정종일, 고석주<BR>
+출원번호: 2006-0117121 (한국, 2006.11.24) <BR>
+등록번호: 0780921 (한국, 2007.11.23) <BR>
+</LI><BR><BR>
+
+<LI>데이터 링크계층의 링크 정보를 이용하여 핸드오버를 수행하는 단말장치<BR>
+발명자: 고석주, 김동필<BR>
+출원번호: 2005-0110213 (한국, 2005.11.17) <BR>
+등록번호: 0685740 (한국, 2007.02.15) <BR>
+</LI><BR><BR>
+
+<LI>SCTP 기반의 핸드오버 기능을 구비한 단말장치 및 핸드오버 방법<BR>
+발명자: 고석주, 김동필<BR>
+출원번호: 2005-0045096 (한국, 2005.05.27) <BR>
+등록번호: 0677591 (한국, 2007.01.26) <BR>
+Terminal Having SCTP-Based Handover Function and SCTP-Based Handover Method of the Terminal<BR>
+출원번호: US 11-915457 (미국, 2007.11.26) <BR>
+등록번호: US 8,644,248 (미국, 2014.2.4) <BR>
+</LI><BR><BR>
+</OL>
+
+</FONT>
+</div>
+</section>
+</BODY>

ISL-2026/publication.html

@@ -0,0 +1,17 @@
+<title>Publication</title>
+<link rel="stylesheet" href="assets/iotsbody/iotsbody.css" />
+<style>.iots-body hr {border-top: 1px solid;border-bottom: 1px solid; border-right : none ; border-left : none; box-sizing: content-box; height:3px;}</style>    
+<body>
+    <!-- <iframe id="iots-nav-frame" class="fixed-top iots-pannel" src="assets/pannel/html/pannel.html" seamless></iframe> -->
+    <section class="iots-body">
+        <FONT FACE="Garamond">
+            <OL style="padding : 0; text-align: center">
+                <H2><A HREF="introduction.html">Introduction to IoT Standards Laboratory</A><BR></H2>
+                <H2><A HREF="paper-international.html">International Journals <BR></A></H2>
+                <H2><A HREF="paper-domestic.html">Domestic Journals <BR></A></H2>
+                <H2><A HREF="patent.html">Patents <BR></A></H2>
+            </OL>
+            <br>
+            <HR>
+    </section>
+</body>

ISL-2026/sjkoh/index.html

@@ -0,0 +1,83 @@
+<HTML>
+<HEAD>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+<TITLE>Homepage of Seok-Joo Koh</TITLE>
+</HEAD>
+
+<BODY>
+<center>
+<FONT FACE="Courier New">
+<H1 ALIGN="CENTER">Seok-Joo Koh</H1>
+<HR SIZE=4>
+
+<BLOCKQUOTE ALIGN="CENTER">
+Welcome to My Personal Web Page !!<BR>
+<A HREF="https://cse.knu.ac.kr/">School of Computer Science and Engineering (SCSE)</A><BR>
+<A HREF="https://it.knu.ac.kr/">College of IT Engineering (CITE)</A><BR>
+<A HREF="https://www.knu.ac.kr/">Kyungpook National University (KNU)</A><BR>
+</B>
+</BLOCKQUOTE>
+</center>
+
+<HR>
+<H2>Education</H2>
+- KAIST, Management Science, B. S., 1992. 2. <br>
+- KAIST, Management Science, M. S., 1994. 2.<br> 
+- KAIST, Industrial Engineering, Ph. D., 1998. 8.<br> 
+
+<hr>
+<H2>Career</H2>
+
+<OL>
+
+<LI> 2024. 3 - Present <BR>
+   Dean <BR>
+   College of IT Engineering (CITE)<BR>
+   Kyungpook National University (KNU) <BR></LI><P>
+
+<LI> 2015. 12 - Present <BR>
+   Director <BR>
+   Institute of Software Education (SWEDU)<BR>
+   Kyungpook National University (KNU) <BR></LI><P>
+
+<LI> 2004. 3 - Present <BR>
+   Professor <BR>
+   School of Computer Science and Engineering (CSE)<BR>
+   College of IT Engineering (CITE)<BR>
+   Kyungpook National University (KNU) <BR></LI><P>
+
+<LI> 1998. 8 - 2004. 2 <BR>
+   Senior Researcher <BR>
+   Protocol Engineering Center (PEC) <BR> 
+   Electronics Telecommunications Research Institute (ETRI)</LI><P>
+
+</OL>
+
+<HR>
+<H2>International Standardization</H2>
+
+<UL> 
+
+<LI> ISO/IEC JTC1 SC6/WG7: Reliable/Mobile Multicasting (1999 ~ 2019): Project Editor  <BR>
+<LI> ISO/IEC JTC1 SC41/WG5: Internet-of-Things (IoT) Applications (2020 ~ Present): Project Editor <BR>
+<LI> ITU-T SG13: Mobility Management (1999 ~ 2015): Project Editor  <BR>
+<LI> ITU-T SG20: VLC-based IoT (2018 ~ 2020): Project Editor <BR>
+<LI> IEC TC100: Multimedia Systems and Equipment (2018 ~ Present): Project Editor, TA15 TAM, WG11 Convenor <BR>
+</UL>
+
+
+<HR>
+<H2>Membership on Academic Society</H2>
+<UL>
+<LI> KIPS (Korea Information Processing Society)<br>
+<LI> KICS (Korean Institute of Communications and Information Sciences)<br>
+<LI> KIISE (Korean Institute of Information Scientists and Engineers)<br>
+<LI> IEEE (Institute of Electrical and Electronics Engineers)<br>
+<br>
+</UL>
+
+<HR size=4><P><B>
+
+<A HREF="../index.html">Go back to the Homepage</A> 
+
+</BODY>

ISL-2026/standard.html

@@ -0,0 +1,179 @@
+<HEAD>
+<TITLE>Standardizations</TITLE>
+<link rel="stylesheet" href="assets/iotsbody/iotsbody.css" />
+<style>div hr {margin-right:-150px; margin-left : -150px; border: 0; height: 1.2px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));}</style>
+</HEAD>
+
+<BODY>
+<section class="iots-body">
+<FONT FACE="Verdana">
+<H1 ALIGN="CENTER">International Standardization</H1>
+
+<HR SIZE=4>
+<div  style="max-width:1140px; margin-right:auto; margin-left:auto">
+
+<H3>IEC TC100 (Multimedia Systems and Equipment): 2018 ~ Present</H3>
+
+o WG12: Multimedia Systems and Equipment for Metaverse (IEC 63614) <BR>
+<OL>
+<LI> "Multimedia Systems and Equipment for Metaverse - Part 1: Genaral"<BR>
+IEC TR 63614-1 (May 2026) </LI><BR>
+<LI> "Multimedia Systems and Equipment for Metaverse - Part 2: Classification"<BR>
+IEC TS 63614-2 (May 2026) </LI><BR>
+<LI> "Multimedia Systems and Equipment for Metaverse - Part 3: Gap Analysis"<BR>
+IEC TR 63614-3 (March 2026) </LI><BR>
+<LI> "Multimedia Systems and Equipment for Metaverse - Part 4: AI Use Cases"<BR>
+IEC WDTR 63614-4 (In Progress) </LI><BR>
+</OL>
+
+o WG11(Convenor): User's QoE for Multimedia Conference Services (IEC 63478) <BR>
+<OL>
+<LI> "User's QoE for Multimedia Conference Services - Part 1: General"<BR>
+IEC TR 63478-1 (November 2023) </LI><BR>
+<LI> "User's QoE for Multimedia Conference Services - Part 2: Requirments"<BR>
+IEC IS 63478-2 (October 2025) </LI><BR>
+<LI> "User's QoE for Multimedia Conference Services - Part 3: Measurement Methods"<BR>
+IEC CDV 63478-3 (In Progress) </LI><BR>
+</OL>
+
+o WG30(TA17): Infotainment Services for Public Vehicles (IEC 63479)<BR>
+<OL>
+<LI> "Infotainment Services for Public Vehicles (PVIS) - Part 1: General"<BR>
+IEC TR 63479-1 (November 2023) </LI><BR>
+<LI> "Infotainment Services for Public Vehicles (PVIS) - Part 2: Requirements"<BR>
+IEC IS 63479-2 (February 2026) </LI><BR>
+<LI> "Infotainment Services for Public Vehicles (PVIS) - Part 3: Framework"<BR>
+IEC IS 63479-3 (January 2026) </LI><BR>
+</OL>
+
+o WG30(TA17): Configurable Car Infotainment Services (IEC 63246)<BR>
+<OL>
+<LI> "Configurable Car Infotainment Services (CCIS) - Part 1: General"<BR>
+IEC 63246-1 (August 2021) </LI><BR>
+<LI> "Configurable Car Infotainment Services (CCIS) - Part 2: Requirements"<BR>
+IEC 63246-2 (January 2022) </LI><BR>
+<LI> "Configurable Car Infotainment Services (CCIS) - Part 3: Framework"<BR>
+IEC 63246-3 (January 2022) </LI><BR>
+<LI> "Configurable Car Infotainment Services (CCIS) - Part 4: Protocol"<BR>
+IEC TR 63246-4 (December 2022) </LI><BR>
+</OL>
+
+<HR SIZE=4>
+
+<H3>ISO/IEC JTC1/SC41 (Internet of Things and Digital Twin): 2020 ~ Present</H3>
+
+o (WG5) IoT-based Management of Tangible Cultural Heritage Assets (ISO/IEC TR 30189)<BR>
+<OL>
+<LI> "Part 1: Framework"<BR>
+ISO/IEC TR 30189-1 (March 2025)</LI><BR>
+<LI> "Part 2: Use Cases"<BR>
+ISO/IEC CDTR 30189-2 (In Progress)</LI><BR>
+</OL>
+
+<HR SIZE=4>
+
+<H3>ITU-T SG20 (IoT Services based on VLC): 2018 ~ 2020</H3>
+<OL>
+<LI> "Framework of IoT Services based on Visible Light Communications (VLC)"<BR>
+ITU-T Recommendation Y.4465 (January 2020) </LI><BR>
+<LI> "Functional Architecture for IoT Services based on VLC"<BR>
+ITU-T Recommendation Y.4474 (August 2020) </LI><BR>
+</OL>
+
+<HR SIZE=4>
+
+<H3>TTA/PG425 (가시광 통신 기반 사물인터넷 서비스): 2018 ~ 2020</H3>
+<OL>
+<LI> "가시광 통신 기반 사물인터넷 서비스 - 제 1 부: 네트워크 모델 및 요구사항"<BR>
+TTAK.KO-10.1158-part1 (2019년 12월) </LI><BR>
+<LI> "가시광 통신 기반 사물인터넷 서비스 - 제 2 부: 프레임워크"<BR>
+TTAK.KO-10.1158-part2 (2020년 12월) </LI><BR>
+<LI> "가시광 통신 기반 사물인터넷 서비스 - 제 3 부: 프로토콜"<BR>
+TTAK.KO-10.1158-part3 (2020년 12월) </LI><BR>
+</OL>
+
+<HR SIZE=4>
+<H3>ITU-T SG13 (Mobility Management): 2002 ~ 2012</H3>
+
+<OL>
+<LI>NNI Mobility Management Requirements for SBI2K<BR>
+ITU-T Supplement to Recommendation Q.Sup52 (December 2004)</LI><BR>
+<LI> Mobility Management Requirements for Next-Generation Networks<BR>
+ITU-T Recommendation Q.1706/Y.2801 (July 2006)</LI><BR>
+<LI>Framework of IPv6 Multi-homing for NGN<BR>
+ITU-T Recommendation Y.2052 (Feb. 2008)</LI><BR>
+<LI> Generic Framework of Mobility Management for Next-Generation Networks<BR>
+ITU-T Recommendation Q.1707/Y.2804 (Feb. 2008)</LI><BR>
+<LI>Framework of Location Management for Next-Generation Networks<BR>
+ITU-T Recommendation Q.1708/Y.2805 (October 2008)</LI><BR>
+<LI>Framework of Handover Control for Next-Generation Networks<BR>
+ITU-T Recommendation Q.1709/Y.2806 (October 2008)</LI><BR>
+<LI>Framework of Mobility Management in Service Stratum for NGN<BR>
+ITU-T Recommendation Y.2809 (November 2011)</LI><BR>
+</OL>
+
+<HR SIZE=4>
+<H3>ISO/IEC JTC1/SC6 (WG7: Network and Transport): 2000 ~ 2014</H3>
+
+o Enhanced Communication Transport Protocol (ECTP): ISO/IEC 14476<BR>
+<OL>
+<LI> "ECTP-1: Specification of Simplex Multicast Transport"<BR>
+ITU-T Recommendation X.606 (October 2001) <BR>
+ISO/IEC IS 14476-1 (April 2002)</LI><BR>
+<LI> "ECTP-2: Specification of QoS Management for Simplex Multicast Transport"<BR>
+ITU-T Recommendation X.606.1 (February 2003) <BR>
+ISO/IEC IS 14476-2 (June 2003)</LI><BR>
+<LI> "ECTP-3: Specification of Duplex Multicast Transport"<BR>
+ITU-T Recommendation X.607 (February 2007) <BR>
+ISO/IEC IS 14476-3 (August 2008)</LI><BR>
+<LI> "ECTP-4: Specification of QoS Management for Duplex Multicast Transport"<BR>
+ITU-T Recommendation X.607.1 (November 2008)<BR>
+ISO/IEC IS 14476-4 (April 2010)</LI><BR>
+<LI> "ECTP-5: Specification of N-plex Multicast Transport"<BR>
+ITU-T Recommendation X.608 (February 2007) <BR>
+ISO/IEC IS 14476-5 (August 2008)</LI><BR>
+<LI> "ECTP-6: Specification of QoS Management for N-plex Multicast Transport"<BR>
+ITU-T Recommendation X.608.1 (November 2008)<BR>
+ISO/IEC IS 14476-6 (April 2010)</LI><BR>
+</OL>
+
+o Relayed Multicast Protocol (RMCP): ISO/IEC 16512
+<OL>
+<LI> "RMCP-1: Framework"<BR>
+ITU-T Recommendation X.603 (April 2004) <BR>
+ISO/IEC IS 16512-1</LI><BR>
+<LI> "RMCP-2: Specification of Simplex Group Applications" <BR>
+ITU-T Recommendation X.603.1 (February 2007)<BR>
+ISO/IEC IS 16512-2</LI><BR>
+<LI> "RMCP-3: Specification of N-plex Group Applications" <BR>
+ITU-T Recommendation X.603.2 (September 2010)<BR>
+ISO/IEC IS 16512-3</LI><BR>
+</OL>
+
+o Mobile Multicast Communications (MMC): ISO/IEC 24793
+<OL>
+<LI>"MMC-1: MMC Framework" <BR>
+ITU-T Recommendation X.604 (March 2010)<BR>
+ISO/IEC IS 24793-1 </LI><BR>
+<LI>"MMC-2: MMC Protocol over Native IP Multicast Networks"<BR>
+ITU-T Recommendation X.604.1 (March 2010)<BR>
+ISO/IEC IS 24793-2 </LI><BR>
+<LI>"MMC-3: MMC Protocol over Overlay Multicast Networks"<BR>
+ITU-T Recommendation X.604.2 (September 2010)<BR>
+ISO/IEC IS 24793-3 </LI><BR>
+</OL>
+
+o Future Network: Problem Statement and Requirements (FN-PSR): ISO/IEC TR 29181
+<OL>
+<LI>"Part 1: Overall Aspects" <BR>
+ISO/IEC TR 29181-1 (September 2012) </LI><BR>
+<LI>"Part 2: Naming and Addressing" <BR>
+ISO/IEC TR 29181-2 (December 2014) </LI><BR>
+<LI>"Part 3: Switching and Routing" <BR>
+ISO/IEC TR 29181-3 (April 2013) </LI><BR>
+<LI>"Part 4: Mobility" <BR>
+ISO/IEC TR 29181-4 (December 2013) </LI><BR>
+</OL>
+<HR><HR>
+</BODY>
+

README.md

@@ -0,0 +1,111 @@
+# 🌐 경북대학교 사물인터넷 표준 연구실 (ISL) 홈페이지 리뉴얼 프로젝트
+
+> 본 프로젝트는 **경북대학교 컴퓨터학부 사물인터넷 표준 연구실 (IoT Standards Laboratory, ISL)**의 공식 홈페이지를 차세대 웹 기술 스택(Next.js 14+, TypeScript, Tailwind CSS)으로 리뉴얼 및 구축하기 위한 디렉터리입니다.
+> 
+> 연구실의 실제 데이터 원본(`ISL-2026/`)과 참고용 모던 웹 프로토타입(`refer_landing_page/`)을 기반으로, 멀티 에이전트 협업 체계(MAM)를 통해 차세대 연구실 랜딩페이지를 완성합니다.
+
+---
+
+## 📌 1. 연구실 개요 (Lab Overview)
+
+- **연구실명**: 사물인터넷 표준 연구실 (IoT Standards Laboratory, ISL)
+- **소속**: 경북대학교 IT대학 컴퓨터학부
+- **지도교수**: 고석주 교수 (Prof. Seok-Joo Koh / `sjkoh@knu.ac.kr`)
+- **핵심 연구 분야**:
+  1. **IoT Standards & Protocols**: oneM2M, W3C WoT, OCF, OMA LwM2M 기반 사물인터넷 국제 표준 및 상호운용성 연구
+  2. **Automotive & IVI (CCIS)**: Configurable Car Infotainment Service, 차량 내 인포테인먼트 제어 및 표준 인터페이스
+  3. **Optical Wireless & VLC**: Visible Light Communication (가시광 통신) 및 오토모티브 광통신
+  4. **Next-Gen Networks**: QUIC 기반 멀티에이전트 오케스트레이션, MCM (Metaverse Content Management) 메타버스 인터페이스
+
+---
+
+## 📁 2. 디렉터리 구조 및 역할 (Directory Structure)
+
+```
+landing_page/
+├── README.md               # [본 문서] 프로젝트 통합 온보딩 가이드
+├── ISL-2026/               # 📄 [실제 데이터 원본] 기존 연구실 공식 홈페이지 (HTML/CSS)
+│   ├── index.html          # 메인 랜딩페이지 & 연구 분야 소개
+│   ├── member.html         # 교수진, 석/박사 연구원, 학부연구생, 졸업생 목록
+│   ├── paper-international.html # 국외 저널 및 학회 논문 실적
+│   ├── paper-domestic.html # 국내 저널 및 학회 논문 실적
+│   ├── patent.html         # 특허 등록/출원 실적
+│   ├── standard.html       # 국제/국내 표준화 기여 내역 (oneM2M, ITU-T 등)
+│   ├── lecture.html        # 담당 학부 및 대학원 강의 목록
+│   └── assets/ & image/    # 로고, 교수님 및 연구원 사진, 연구 분야 그래픽 자산
+│
+├── refer_landing_page/     # 🚀 [타겟 웹 애플리케이션 프로토타입] Next.js 14+ App Router
+│   ├── app/                # Next.js App Router 페이지 (intro, members, publications, lectures, standardization)
+│   ├── components/         # 모듈화된 UI 컴포넌트 (Header, Footer, PageHeader, SectionLabel, Reveal, Counter, Marquee)
+│   ├── docs/DESIGN.md      # 고대비 매거진 에디토리얼 디자인 시스템 가이드 문서
+│   └── tailwind.config.ts  # 디자인 토큰 및 시각 스타일 규칙 정의
+│
+├── .agents/                # 🤖 멀티 에이전트 오케스트레이션 규칙 및 스킬 툴킷 (MAM)
+├── .mam/                   # ⚡ 에이전트 세션 DB 및 격리 상태 레지스트리
+├── docs/                   # 진행 작업 노트, 미팅 기록, 아키텍처 결정(ADR)
+└── research/               # 관련 논문, 표준 사양서, 벤치마크 자료
+```
+
+---
+
+## 🎯 3. 온보딩 핵심 미션 (Core Development Missions)
+
+에이전트 팀 및 개발자는 아래 3단계 주요 미션을 순차적으로 진행합니다:
+
+### 📥 Mission 1: 실제 연구실 데이터 추출 및 정밀 마이그레이션 (Data Migration)
+- `ISL-2026/` 디렉터리의 레거시 HTML 파일들에서 **실제 데이터**를 추출합니다:
+  - **구성원**: 교수 소개, 박사/석사/학부 연구원, 졸업생(진로 정보 포함) `[ISL-2026/member.html]`
+  - **논문 실적**: 국외 저널/학회, 국내 저널/학회 논문 최신순 정렬 `[ISL-2026/paper-international.html, paper-domestic.html]`
+  - **특허 & 표준화**: 특허 등록/출원 목록 및 oneM2M/ITU-T/OCF 표준화 실적 `[ISL-2026/patent.html, standard.html]`
+  - **강의 목록**: 학부/대학원 개설 과목 `[ISL-2026/lecture.html]`
+- `refer_landing_page/app/<route>/page.tsx` 내의 예시(placeholder) 데이터 배열을 추출한 **실제 ISL 연구실 데이터로 전면 교체**합니다.
+
+### 🎨 Mission 2: 브랜드 가치 및 디자인 시스템 유지 (Design & UX Refinement)
+- `refer_landing_page/docs/DESIGN.md`에 명시된 에디토리얼 디자인 시스템("Issue 01") 규격을 엄격히 준수합니다.
+- `ISL-2026/assets/`의 연구실 공식 로고(`Lab_logo_color_transparent.png`), 인물 사진, 연구 분야 그래픽 이미지를 `refer_landing_page/public/`으로 이관하여 적용합니다.
+- 매거진 섹션 넘버링(`SectionLabel`), 카운트업(`Counter`), 등장 모션(`Reveal`), 티커(`Marquee`) 컴포넌트를 효과적으로 활용합니다.
+
+### 🔍 Mission 3: SEO, 반응형 UI 및 품질 검증 (QA & Verification)
+- 모든 페이지에 **SEO 최적화** (Title, Meta Description, Semantic HTML5) 적용.
+- 모바일, 태블릿, 데스크톱 화면 반응형 Breakpoint 및 터치 사용자 경험 검증.
+- `npm run build`를 통한 TypeScript 및 Next.js 타입/린트 오류 0건 검증.
+
+---
+
+## 👥 4. 멀티 에이전트 역할 및 협업 프로토콜 (Multi-Agent Team)
+
+본 프로젝트는 `multi-agent-mux` 환경에서 3개의 전용 에이전트가 역할 분담하여 작업을 수행합니다.
+
+| 에이전트 | 담당 역할 (Role) | 주요 임무 (Primary Responsibilities) |
+| :--- | :--- | :--- |
+| 🧠 **Claude** | `planner and reviewer` | 전체 마이그레이션 아키텍처 수립, 데이터 누락 검증, 최종 코드 PR 승인 |
+| 🎨 **Agy** (Antigravity) | `creator` | Component 개발, `ISL-2026` 데이터 추출 및 `refer_landing_page` 코드 작성/적용 |
+| 🔍 **Cline** | `reviewer` | UI/UX 반응형 검수, SEO 및 Accessibility 점검, 린트/타입 안전성 검증 |
+
+> ⚠️ 모든 에이전트는 프로젝트 루트의 [`AGENTS.md`](./AGENTS.md) 지침 및 [`.agents/MULTI_AGENT_RULES.md`](./.agents/MULTI_AGENT_RULES.md) 규약을 최우선으로 숙지하고 준수해야 합니다.
+
+---
+
+## 🛠️ 5. 로컬 개발 및 실행 가이드 (Getting Started)
+
+```bash
+# 1. 참고용 웹 애플리케이션 디렉터리로 이동
+cd refer_landing_page
+
+# 2. 의존성 패키지 설치
+npm install
+
+# 3. 개발 서버 실행 (기본 포트: http://localhost:3000)
+npm run dev
+
+# 4. 프로덕션 빌드 테스트 (검증 시 사용)
+npm run build
+```
+
+---
+
+## 📜 6. 개발 컨벤션 (Development Conventions)
+
+- **커밋 메시지 규칙**: `feat:`, `fix:`, `docs:`, `refactor:`, `style:`, `data:` 접두사 사용.
+- **이미지 및 자산**: 영문 snake_case 파일명 사용 (`refer_landing_page/public/images/` 하위에 저장).
+- **디자인 토큰**: `tailwind.config.ts` 및 `app/globals.css` 디자인 토큰 참조.

RESEARCH.md

@@ -0,0 +1,215 @@
+# Research — 연구 분야 소개
+
+> **경북대학교 컴퓨터학부 사물인터넷 표준 연구실(Internet of Things Standards Lab)** 의 주요 연구 분야.
+> 본 문서는 연구실 소개 홈페이지의 "Research" 섹션에서 직접 사용될 수 있도록 **홈페이지 톤(간결·시각적)** 과 **내부 참조 톤(상세)** 이 혼합돼 있다. 각 항목을 채우면서 홈페이지에 그대로 노출할 부분과 내부 참고용 부분을 구분해 두기.
+
+---
+
+## 0. 연구실 한 줄 소개 (Lab One-liner)
+
+> 홈페이지 히어로/소개 섹션에 노출할 한 줄 가치 제안.
+
+> "____________"
+
+(작성 가이드)
+- 30~50자 내외
+- "무엇을" + "왜" 를 한 문장에 압축
+- 예: "분산 IoT 시스템의 **상호운용성**과 **에이전트 오케스트레이션**을 표준 기반으로 설계하는 연구실"
+
+---
+
+## 1. 연구 분야 개요 (Research Overview)
+
+홈페이지 "Research" 섹션 최상단 — 두 분야가 연구실의 양대 축임을 보여주는 짧은 서론.
+
+> 우리 연구실은 **① 메타버스 환경에서의 상호운용성**과 **② QUIC 기반 멀티에이전트 오케스트레이션** 을 양대 축으로 연구합니다. 두 분야는 모두 "분산 시스템을 어떻게 표준 기반으로 연결하고 조율할 것인가" 라는 동일한 문제의식에서 출발하며, 표준 적합성 검증과 실증 구현을 통해 학계·산업에 기여하고 있습니다.
+
+(홈페이지 다이어그램/아이디어)
+- 두 분야가 별개가 아니라 **공통 문제의식에서 출발**한다는 점 강조
+- 시각적: 두 원이 겹치는 다이어그램 (공통 부분: 표준 기반 분산 시스템 설계)
+
+---
+
+## 2. 연구 분야 ① — MCM (Metaverse / Collaboration Map / Content Mesh)
+
+> **MCM 프로젝트** — 메타버스 환경에서 상호운용성 확보를 위한 연구
+
+### 2.1 한 줄 요약
+
+> "____________"
+
+(작성 가이드)
+- 20~30자
+- 예: "메타버스 플랫폼 간 상호운용성을 위한 표준 기반 MCM 프레임워크"
+
+### 2.2 문제 의식 (Motivation)
+
+> 왜 메타버스 환경에서 상호운용성이 필요한가?
+
+- 
+- 
+- 
+
+### 2.3 핵심 목표 (Goal)
+
+- 
+- 
+
+### 2.4 연구 내용 (Approach)
+
+- 
+- 
+- 
+
+### 2.5 핵심 키워드 (Keywords)
+
+`#메타버스` `#상호운용성` `#MCM` `#____________` `#____________`
+
+### 2.6 관련 표준 / 기술 (Standards & Tech)
+
+- (예: oneM2M, W3C WoT, Matter, WebXR, glTF, OpenXR, ...)
+
+### 2.7 주요 산출물 (Deliverables)
+
+- 논문:
+  - (저자, 학회/저널, 연도, 제목)
+- 표준/기여:
+  - (예: oneM2M WG contribution, KATS 표준안 등)
+- 오픈소스 / 구현체:
+  - (URL)
+- 데모 / 프로토타입:
+  - (URL, 영상)
+
+### 2.8 진행 기간 / 단계
+
+- 시작:
+- 현재 단계: (아이디어 / PoC / 검증 / 양산)
+- 종료/목표:
+
+### 2.9 참여 연구원
+
+- 책임:
+- 참여:
+- 학위: (학부생 / 석사 / 박사)
+
+### 2.10 외부 협력 (선택)
+
+- 산학 협력:
+- 국책 과제:
+
+### 2.11 홈페이지용 시각 자산
+
+- 다이어그램 파일 경로: `assets/mcm_architecture.png` (필요 시 추가)
+- 데모 영상: (URL)
+- 대표 이미지 1장: (캡션: ____________)
+
+---
+
+## 3. 연구 분야 ② — QUIC 기반 Multi-agents Orchestration
+
+> **Multi-agents orchestration architecture and communication interface design** based on **QUIC**
+
+### 3.1 한 줄 요약
+
+> "____________"
+
+(작성 가이드)
+- 20~30자
+- 예: "QUIC 전송 계층 위에서 동작하는 멀티에이전트 오케스트레이션 아키텍처 및 통신 인터페이스 설계"
+
+### 3.2 문제 의식 (Motivation)
+
+> 왜 QUIC 위에서 멀티에이전트 오케스트레이션인가?
+
+- 
+- 
+- 
+
+### 3.3 핵심 목표 (Goal)
+
+- 
+- 
+
+### 3.4 연구 내용 (Approach)
+
+- 아키텍처:
+- 통신 인터페이스 (API/프로토콜):
+- 오케스트레이션 모델:
+- 성능/보안 고려:
+
+### 3.5 핵심 키워드 (Keywords)
+
+`#QUIC` `#HTTP/3` `#멀티에이전트` `#오케스트레이션` `#____________` `#____________`
+
+### 3.6 관련 표준 / 기술 (Standards & Tech)
+
+- IETF QUIC (RFC 9000)
+- HTTP/3 (RFC 9114)
+- MAS (Multi-Agent System) 표준/프레임워크
+- gRPC over HTTP/3
+- (기타)
+
+### 3.7 주요 산출물 (Deliverables)
+
+- 논문:
+  - 
+- 구현체:
+  - 
+- 데모 / 프로토타입:
+  - 
+
+### 3.8 진행 기간 / 단계
+
+- 시작:
+- 현재 단계:
+- 종료/목표:
+
+### 3.9 참여 연구원
+
+- 책임:
+- 참여:
+- 학위:
+
+### 3.10 외부 협력 (선택)
+
+- 
+- 
+
+### 3.11 홈페이지용 시각 자산
+
+- 아키텍처 다이어그램: `assets/quic_mas_architecture.png`
+- 성능 비교 그래프: (필요 시 `assets/benchmarks/`)
+- 데모 영상: (URL)
+
+---
+
+## 4. 분야 간 시너지 (Synergy Between the Two)
+
+> 두 연구 분야가 어떻게 서로 강화하는지 (홈페이지에 시각화 권장).
+
+- **공통 문제의식**: 분산 시스템의 연결·조율
+- **공통 방법론**: 표준 적합성 검증 + 실증 구현
+- **상호 보완**: MCM에서 도출된 상호운용성 요구사항 → QUIC/MAS 연구의 인터페이스 설계에 반영 (혹은 그 반대)
+- (기타 시너지 1~2가지)
+
+---
+
+## 5. 연락 (Contact)
+
+- 연구실 위치: ____________
+- 연락처: ____________
+- 지도교수: ____________
+- 입학/참여 문의: ____________
+
+---
+
+## 작성 가이드 (메타)
+
+- 각 섹션의 **굵은 핵심 문장** 위주로만 채우면 홈페이지 초안이 된다.
+- **세부 산출물**(논문·표준·구현체)은 출처가 있는 것만 기록.
+- 시점 표기는 `2026-06-14 기준` 같이 명시해 홈페이지 업데이트 일관성 유지.
+- 새 분야가 추가되면 ② 섹션을 복사해 ③ 로 추가.
+
+## 변경 이력
+
+- 2026-06-14: 템플릿 초안 작성

refer_landing_page/.gitignore

@@ -0,0 +1,27 @@
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

refer_landing_page/.kanban-final-report.md

@@ -0,0 +1,182 @@
+# IoT Standards Lab Landing Page — Final Project Analysis
+
+> Workspace: `/home/godopu16/PuKi/lab/landing_page/refer_landing_page`
+> Project: `iot-standards-lab-landing` v0.1.0 (private)
+> Produced as the synthesis deliverable for kanban task `t_d70b2c9e`.
+> Sources: `.kanban-inventory.json` (t_5662ba34), `.kanban-stack-profile.md` (t_239791d2), `.kanban-semantic-analysis.md` (t_a62d94ab).
+
+---
+
+## 1. What this project is
+
+This repo is a **reference prototype landing page** for the **경북대학교 컴퓨터학부 사물인터넷 표준 연구실 (KNU CS IoT Standards Lab)** — a small, self-contained marketing site (not a deployed product) intended to be cloned and filled in with the lab's real content. It is structured as a single-page-family academic portal: a hero/intro route, plus four content routes (lectures, members, publications, standardization), all wrapped in a hand-rolled editorial design system dubbed **"Issue 01"** — a magazine-spread aesthetic with serif/sans pairing, grain backgrounds, scroll-reveal motion, and running marquee tickers. All listed people, papers, and standards contributions are *placeholders* to be swapped for real data; the deliverable is the *layout, design system, and motion language*, not the content. Roughly **2,605 LOC across 25 source files**; small enough to read end-to-end in an afternoon.
+
+---
+
+## 2. Tech stack
+
+| Layer | Pin | Notes |
+|---|---|---|
+| Framework | `next@14.2.5` (exact) | App Router; `reactStrictMode: true`; no image domains / redirects / experimental flags |
+| Language | TypeScript 5.5 (installed 5.9.3) | `strict: true`, `moduleResolution: "bundler"`, path alias `@/*` |
+| UI runtime | `react@18.3.1` + `react-dom@18.3.1` | React 18, not 19 — locked to Next 14 line |
+| Styling | `tailwindcss@3.4.6` + `postcss@8.4` + `autoprefixer@10.4` | Custom theme in `tailwind.config.ts` (114 lines) |
+| Lint | `eslint@8.57` + `eslint-config-next@14.2.5` (exact, matches Next) | No `.eslintrc*`, no Prettier |
+| Fonts | `next/font` (Google Serif + Sans exposed as CSS vars) | No external font loader dep |
+| Package manager | npm 10.9.7, lockfile v3 | Single `package-lock.json` (215 KB); no pnpm/yarn/bun |
+| Runtime | Node 22.22.2 (host) | No `engines` field declared |
+
+**Scripts (4, the entire quality-gate surface):** `npm run dev` · `npm run build` · `npm start` · `npm run lint`.
+
+**Not present:** no Docker, no `.env`/env vars, no CI, no test runner, no formatter, no UI lib (no shadcn/Radix/MUI), no icon set, no analytics, no CMS client, no image CDN, no motion library (motion is hand-rolled via `IntersectionObserver` + CSS).
+
+**Security posture:** `npm audit` reports **8 advisories, 1 critical, 6 high, 1 moderate**. 21 of those resolve by a single-line patch — `npm install next@14.2.35` (same major, fixes cache poisoning, Server Components DoS, middleware SSRF, PostCSS XSS, etc.). Transitive `glob` and `minimatch` advisories are dev-time only and not runtime risks for this app.
+
+---
+
+## 3. Architecture and structure
+
+### Tree (top-level)
+
+```
+/home/godopu16/PuKi/lab/landing_page/refer_landing_page
+├── app/                       ← Next.js App Router entrypoint
+│   ├── layout.tsx             ← Root layout: Header + Footer + font vars
+│   ├── globals.css            ← CSS vars, grain bg, reveal transitions
+│   ├── intro/                 ← /          (root landing)
+│   │   ├── page.tsx           ←   287 lines, uses HeroComposition
+│   │   └── _components/
+│   │       └── HeroComposition.tsx  ← private inline-SVG cover graphic
+│   ├── lectures/page.tsx      ← /lectures    102 lines
+│   ├── members/page.tsx       ← /members     174 lines
+│   ├── publications/page.tsx  ← /publications 168 lines
+│   └── standardization/page.tsx ← /standardization 169 lines
+├── components/                ← 7 shared, reusable components
+│   ├── Header.tsx             ← nav + mobile menu
+│   ├── Footer.tsx             ← address/email + Marquee colophon
+│   ├── PageHeader.tsx         ← dual-language route banner
+│   ├── SectionLabel.tsx       ← "01 / 05" corner labels
+│   ├── Counter.tsx            ← tick-up figure animation
+│   ├── Marquee.tsx            ← endless running ticker
+│   └── Reveal.tsx             ← IntersectionObserver scroll reveal
+├── docs/DESIGN.md             ← 332 lines — design system spec
+├── PROMPT.md                  ← 249 lines — original generation brief
+├── README.md                  ← 104 lines — project overview
+├── package.json / package-lock.json (215 KB)
+├── tsconfig.json (22) / next.config.js (6) / next-env.d.ts
+├── tailwind.config.ts (114)   ← canonical design tokens
+├── postcss.config.js (6)
+├── .gitignore (27)
+└── .kanban-*.{json,md}        ← upstream task artifacts (not project content)
+```
+
+### Routing map (Next.js App Router)
+
+| Path | File | Lines | Notes |
+|---|---|---|---|
+| `/` | `app/intro/page.tsx` | 287 | Embeds static `thrusts`, `figures`, `keywords`, `focusAreas` arrays |
+| `/lectures` | `app/lectures/page.tsx` | 102 | Course list |
+| `/members` | `app/members/page.tsx` | 174 | PI + PhD + MS + UG groupings |
+| `/publications` | `app/publications/page.tsx` | 168 | Journals + Conferences |
+| `/standardization` | `app/standardization/page.tsx` | 169 | oneM2M, W3C, IETF, OMA groups |
+
+### Shared component fan-out
+
+| Component | Used in (routes / other components) | Public prop shape |
+|---|---|---|
+| `Header` | `app/layout.tsx` | `{}` |
+| `Footer` | `app/layout.tsx` | `{}` |
+| `Counter` | intro, members, publications, standardization | `{ value, duration?, prefix?, suffix?, className? }` |
+| `Marquee` | intro, publications, standardization, **Footer** | `{ items: string[], reverse?, className? }` |
+| `PageHeader` | lectures, members, publications, standardization | `{ ko, en, display?, description?, index }` |
+| `Reveal` | intro, lectures, members, publications, standardization, **PageHeader** | `{ children, variant?: 'up'\|'left'\|'right'\|'scale', delay?, as?, className? }` |
+| `SectionLabel` | intro, lectures, members, publications, standardization, **PageHeader** | `{ index, total?, label, className? }` |
+
+5 of the 7 (71%) shared components carry JSDoc blocks; `Header` and `Footer` do not.
+
+### Module responsibilities (one-line summary)
+
+- `app/` — routing, metadata, global shell; **page-level orchestration only**, no business logic.
+- `app/intro/_components/` — private assets scoped to one route (`HeroComposition` SVG).
+- `components/` — presentation primitives, prop-driven, zero business logic.
+- `docs/DESIGN.md` — canonical design-token spec (the "Issue 01" system).
+- `tailwind.config.ts` — machine-readable counterpart to `docs/DESIGN.md`; treat it as the source of truth at the build layer.
+
+---
+
+## 4. Strengths and risks
+
+### Strengths
+
+1. **Internally consistent stack.** Next 14.2.5, React 18.3, Tailwind 3.4, TS 5.5, ESLint 8 + `eslint-config-next` pinned to Next's exact version. No mixed majors, no version skew between `next` and `eslint-config-next`. The dep tree is the smallest viable Next 14 surface — `package-lock.json` is only 215 KB, no obvious bloat.
+2. **Strict TypeScript hygiene.** Zero `any` types, zero non-null (`!`) assertions, correct `key` props on every loop. `tsconfig.json` is the canonical strict-mode setup (`strict`, `noEmit`, `incremental`, `isolatedModules`, `moduleResolution: "bundler"`).
+3. **Design system is well-documented and decoupled from data.** `docs/DESIGN.md` (332 lines) + `tailwind.config.ts` (114 lines) are the canonical design sources; component JSDoc blocks (5/7) call out "CUSTOMIZATION HOOK — CONTENT/MOTION" seams. A non-developer touching content can find the right file via the README's customization hooks section.
+4. **No external runtime dependencies beyond Next itself.** No motion lib, no icon set, no UI kit, no analytics, no CMS. Reveal motion uses a hand-rolled `IntersectionObserver`; counter uses `requestAnimationFrame` only. The runtime is small and inspectable.
+5. **A11y-aware motion.** `Reveal` respects `prefers-reduced-motion`; semantic HTML throughout (no `<div>`-as-button patterns).
+6. **Trivial security remediation available.** A single `npm install next@14.2.35` clears 21 published advisories (1 critical, 6 high, 1 moderate) — no major jump, no React change, no behavior change.
+
+### Risks and gaps
+
+1. **0% test coverage.** No test framework, no `*.test.*` / `*.spec.*` files, no test script in `package.json`, no CI. All 14 components/routes are UNTESTED. The highest-leverage gaps:
+   - `Reveal` — wraps most page content; a broken `IntersectionObserver` attachment would render pages invisible (stuck at opacity 0).
+   - `Counter` — uses `requestAnimationFrame`; regressions could leak rAF loops.
+   - `Header` — owns mobile menu state; a regression blocks mobile navigation.
+2. **Statically coupled content.** Member rosters, publication lists, lecture catalogs, and standards contributions live as hardcoded TS arrays *inside* the page files (`app/intro/page.tsx` is 287 lines partly because it embeds `thrusts`, `figures`, `keywords`, `focusAreas` directly). Non-developers cannot update content without a TS edit. The README's customization hooks point at the *code locations* but offer no path to a CMS, markdown, or remote data source.
+3. **21 outstanding Next.js security advisories (1 critical, 6 high, 1 moderate).** All fixed by bumping `next` to `14.2.35`; none are runtime-blocked today, but a security review or production deploy would fail.
+4. **Code duplication.** The "Figures Counter Section" pattern (3-col grid of `<Counter>` cells) is copy-pasted across 4 page files (`intro:145-161`, `members:75-87`, `publications:103-115`, `standardization:106-118`). A `<FiguresBand>` shared component would collapse ~60 lines of repetition. The marquee band wrapper is similarly repeated in 3 places.
+5. **Dead design tokens.** `brand` and `accent` palettes in `tailwind.config.ts:48-53` are marked as back-compat aliases and have no consumers. They bloat the theme and may mislead future contributors.
+6. **Hardcoded private SVG.** `HeroComposition.tsx` embeds mesh/flow coordinates inline — no way for a designer to swap the cover graphic without editing TSX.
+7. **No CI, no formatter, no env var convention, no Node version pin in `engines`.** A new contributor on a different Node major could see different behavior; PRs have no automated lint/typecheck gate.
+8. **Documentation gaps.** README is strong on design system but lacks: (a) supported Node/npm versions, (b) content-update workflow, (c) deploy story, (d) coding-standard / lint rules documentation.
+9. **No src/pages separation, no cmd dir, no monorepo markers.** This is fine for a single-app reference but means there is no scaffold for growth (e.g. a future `/admin` route or a separate landing for a sister project would have to invent conventions).
+10. **Major-version lag (informational, not blocking).** Next 16 / React 19 / Tailwind 4 / TS 6 / ESLint 10 are all available. Each is a *planned migration*, not a security issue — but anyone picking up the project in 2027 will need a multi-week upgrade pass.
+
+---
+
+## 5. Suggested next steps (prioritized)
+
+### P0 — Do now (low effort, high value)
+
+1. **Patch Next.js security advisories.** `npm install next@14.2.35` — single-line, no behavior change, clears 21 advisories. Run `npm audit` after to confirm. *(~5 min)*
+2. **Extract the duplicated Figures Counter Section** into a shared `<FiguresBand items={...} />` component. Touches 4 page files; collapses ~60 lines of duplication. *(~30 min)*
+3. **Remove dead `brand` / `accent` tokens** from `tailwind.config.ts:48-53`. *(~5 min)*
+
+### P1 — Do before any production deploy or public handoff
+
+4. **Add an `engines` field to `package.json`** (`"node": ">=20"`) and document supported versions in `README.md`. Prevents the "works on my machine" drift.
+5. **Add a minimal test setup** — Vitest + React Testing Library is the lowest-friction choice for a Next 14 + TS + no-CI codebase. Start with `Reveal`, `Counter`, and `Header` (the three highest-leverage gaps from §3). *(~half-day)*
+6. **Decouple content from page files.** Even a minimal pass — move the `figures`, `keywords`, `thrusts`, `focusAreas` arrays from `app/intro/page.tsx` into `app/intro/_content.ts` — would make future CMS migration a 1-file change instead of a 4-file one. Same treatment for `members`, `publications`, `lectures`, `standardization`. *(~2 hours)*
+7. **Add a CI workflow** (GitHub Actions) running `npm run lint`, `npm run build`, and (once added) `npm test`. *(~1 hour)*
+
+### P2 — Quality and developer-experience
+
+8. **Externalize the hero SVG.** Move `HeroComposition` coordinates into a JSON or TS data file so designers can iterate without editing TSX. *(~2 hours)*
+9. **Add Prettier** with a project-wide config; wire it into the lint CI check. The design system is editorial — typographic drift is a real risk without a formatter. *(~1 hour)*
+10. **Fill the documentation gaps** in `README.md`: Node version, content-update workflow, deploy story, lint/style rules. *(~2 hours)*
+
+### P3 — Planned migrations (do not bundle with security work)
+
+11. **Next 16 + React 19 + Tailwind 4 upgrade.** All three are major-version jumps; budget a dedicated sprint. The Tailwind v3 → v4 jump is the largest unknown (config format change) — prototype it in a branch first.
+12. **TypeScript 6** and **ESLint 10** (flat config) are mostly mechanical and can ride along with the Next 16 migration.
+
+### Anti-recommendations (do not do)
+
+- **Do not** `npm audit fix --force` — that would jump to Next 16 + React 19 in one move, bundling a security patch with a major migration. The single-line `next@14.2.35` patch is the correct shape.
+- **Do not** turn this into a CMS-backed app before extracting the content arrays; the current shape is the right *baseline* for a reference prototype, but only if the baseline is clean.
+- **Do not** introduce a UI library (shadcn, Radix) or motion library (framer-motion) for the sake of modernization — the hand-rolled motion is a feature, not a gap, and a UI lib would clash with the editorial design system.
+
+---
+
+## 6. Appendix — Source artifacts
+
+This report is a synthesis of three upstream kanban tasks. Each was a stand-alone analysis with its own file:line citations and acceptance criteria.
+
+| Task | Title | Artifact | Role |
+|---|---|---|---|
+| `t_5662ba34` | Inventory project layout and file structure | [`.kanban-inventory.json`](./.kanban-inventory.json) | Structural inventory: 25 source files, 5 routes, 7 components, ~2,605 LOC; no monorepo markers; no test/format/CI/Docker/env markers. |
+| `t_239791d2` | Analyze dependencies, build config, and runtime stack | [`.kanban-stack-profile.md`](./.kanban-stack-profile.md) | Stack profile: dep breakdown (3 runtime + 10 dev), scripts, configs, security audit (8 advisories, 1 critical), version-compatibility sketch. |
+| `t_a62d94ab` | Survey code semantics, tests, and documentation | [`.kanban-semantic-analysis.md`](./.kanban-semantic-analysis.md) | Semantic read: module map, public API surface with prop shapes and consumers, test coverage matrix (14/14 UNTESTED), documentation audit, code smells. |
+
+**Reading order for a human reviewer:** if you only have 10 minutes, read §1 + §4 (Strengths and risks) + §5 P0 items. If you have 30 minutes, add the three source artifacts — they cite specific files and line ranges throughout.
+
+**Not part of the project (do not treat as source of truth):** `.antigravity-session.md` is a runtime artifact from the upstream `t_c6396592` task; `.kanban-*.{json,md}` files are this kanban session's analysis outputs and are not project documentation.

refer_landing_page/.kanban-inventory.json

@@ -0,0 +1,137 @@
+{
+  "project": {
+    "name": "iot-standards-lab-landing",
+    "version": "0.1.0",
+    "private": true,
+    "description": "Reference prototype landing page for 경북대학교 컴퓨터학부 사물인터넷 표준 연구실 (IoT Standards Lab).",
+    "root": "/home/godopu16/PuKi/lab/landing_page/refer_landing_page"
+  },
+  "summary": {
+    "type": "Next.js 14 App Router landing page (TypeScript + Tailwind CSS)",
+    "framework": "next@14.2.5",
+    "ui": "react@18.3.1 + tailwindcss@3.4.6",
+    "language": "TypeScript 5.5",
+    "node_modules_dir_present": true,
+    "build_artifact_present": true,
+    "git_repo": true
+  },
+  "top_level_directories": [
+    {"name": "app", "path": "./app", "purpose_guess": "Next.js App Router routes and global layout/styles"},
+    {"name": "app/intro", "path": "./app/intro", "purpose_guess": "Landing/home page (introductory hero composition)"},
+    {"name": "app/intro/_components", "path": "./app/intro/_components", "purpose_guess": "Private components scoped to the intro page"},
+    {"name": "app/lectures", "path": "./app/lectures", "purpose_guess": "Lectures / talks route page"},
+    {"name": "app/members", "path": "./app/members", "purpose_guess": "Lab members / people route page"},
+    {"name": "app/publications", "path": "./app/publications", "purpose_guess": "Publications list route page"},
+    {"name": "app/standardization", "path": "./app/standardization", "purpose_guess": "Standardization activities route page"},
+    {"name": "components", "path": "./components", "purpose_guess": "Shared/reusable React components used across routes"},
+    {"name": "docs", "path": "./docs", "purpose_guess": "Design documentation"},
+    {"name": "node_modules", "path": "./node_modules", "purpose_guess": "NPM dependency tree (gitignored)"},
+    {"name": ".next", "path": "./.next", "purpose_guess": "Next.js build output cache (gitignored)"}
+  ],
+  "top_level_files": [
+    ".antigravity-session.md",
+    ".gitignore",
+    "next.config.js",
+    "next-env.d.ts",
+    "package.json",
+    "package-lock.json",
+    "postcss.config.js",
+    "PROMPT.md",
+    "README.md",
+    "tailwind.config.ts",
+    "tsconfig.json",
+    "tsconfig.tsbuildinfo"
+  ],
+  "file_counts_by_extension": {
+    "tsx": 14,
+    "ts": 2,
+    "js": 2,
+    "json": 2,
+    "md": 4,
+    "css": 1
+  },
+  "total_source_files_excluding_deps_and_lock": 25,
+  "loc_estimate": {
+    "scope": "All source files (.ts/.tsx/.js/.css/.json/.md) excluding node_modules, .next, .git, package-lock.json, tsconfig.tsbuildinfo",
+    "total_lines": 2605,
+    "breakdown": {
+      "tsx_total": 1397,
+      "ts_total": 136,
+      "js_total": 12,
+      "css_total": 146,
+      "json_total": 50,
+      "md_total": 731
+    }
+  },
+  "entry_points": {
+    "framework": "Next.js App Router — entry is the `app/` directory, not a single file",
+    "app_root_layout": "app/layout.tsx",
+    "routes": [
+      {"path": "/", "file": "app/intro/page.tsx", "lines": 287, "uses_components": ["app/intro/_components/HeroComposition.tsx"]},
+      {"path": "/lectures", "file": "app/lectures/page.tsx", "lines": 102},
+      {"path": "/members", "file": "app/members/page.tsx", "lines": 174},
+      {"path": "/publications", "file": "app/publications/page.tsx", "lines": 168},
+      {"path": "/standardization", "file": "app/standardization/page.tsx", "lines": 169}
+    ],
+    "shared_components": [
+      "components/Counter.tsx",
+      "components/Footer.tsx",
+      "components/Header.tsx",
+      "components/Marquee.tsx",
+      "components/PageHeader.tsx",
+      "components/Reveal.tsx",
+      "components/SectionLabel.tsx"
+    ],
+    "global_styles": "app/globals.css",
+    "no_legacy_pages_dir": true,
+    "no_src_dir": true,
+    "no_cmd_dir": true,
+    "no_main_index_app_server_file": true
+  },
+  "monorepo_markers": {
+    "is_monorepo": false,
+    "evidence": {
+      "single_package_json": true,
+      "package_json_count": 1,
+      "workspaces_field": false,
+      "lerna_json": false,
+      "turbo_json": false,
+      "nx_json": false,
+      "pnpm_workspace_yaml": false,
+      "yarn_workspaces": false,
+      "rush_json": false
+    }
+  },
+  "config_files": {
+    "typescript": "tsconfig.json (22 lines)",
+    "next": "next.config.js (6 lines, reactStrictMode: true)",
+    "tailwind": "tailwind.config.ts (114 lines)",
+    "postcss": "postcss.config.js (6 lines)",
+    "eslint": "eslint-config-next in package.json devDependencies (no standalone .eslintrc visible at top level)"
+  },
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint"
+  },
+  "documentation": [
+    {"file": "README.md", "lines": 104},
+    {"file": "PROMPT.md", "lines": 249, "purpose_guess": "Prompt / brief for the reference design"},
+    {"file": "docs/DESIGN.md", "lines": 332, "purpose_guess": "Design system specification (Google design.md token spec)"},
+    {"file": ".antigravity-session.md", "lines": 46, "purpose_guess": "Runtime artifact captured by an upstream task — antigravity CLI session info, not project content"}
+  ],
+  "git": {
+    "is_git_repo": true,
+    "gitignore_present": true,
+    "gitignored_paths": ["node_modules", ".next", "out", "build", "*.tsbuildinfo", "next-env.d.ts", ".env*.local"]
+  },
+  "notes_for_downstream_tasks": [
+    "Single Next.js 14 App Router project — not a monorepo, not a multi-package workspace.",
+    "All routes live under app/; no pages/ dir, no src/ dir, no separate server entrypoint.",
+    "Total source footprint is small (~2.6k lines across 25 files) — feasible to read entirely if needed.",
+    "Documentation is split: PROMPT.md (brief) and docs/DESIGN.md (design system) are the primary reference docs; README.md is a project overview.",
+    "Tailwind config is rich (114 lines) — likely the canonical source of design tokens, worth inspecting before reading page components.",
+    ".antigravity-session.md is NOT a project file — it is an artifact left by the parent task t_c6396592 (antigravity CLI session setup). Do not treat as documentation."
+  ]
+}

refer_landing_page/.kanban-semantic-analysis.md

@@ -0,0 +1,333 @@
+# Semantic Analysis Report — IoT Standards Lab Landing Page Prototype
+
+This report provides a structured, semantic read-only analysis of the reference prototype codebase for the Kyungpook National University IoT Standards Lab. The workspace contains approximately 2,605 lines of code across 25 files using Next.js 14, React 18, TypeScript 5, and Tailwind CSS 3.
+
+---
+
+## 1. Modules and Responsibilities
+
+This project is structured as a standard Next.js 14 App Router codebase. The responsibilities are clearly divided between page routing structures and reusable UI components.
+
+*   `app/`
+    *   **Purpose**: Owns the application routing, page structures, global layouts, metadata configurations, and global styles. It manages the core shell of the application but delegates UI component instantiation to the shared `components/` directory.
+    *   **Key Files**:
+        *   `app/layout.tsx`: Root layout configuration. Imports next/font Google Serifs/Sans, sets up base metadata, and wraps pages in standard header/footer.
+        *   `app/globals.css`: Contains CSS variable mappings matching design system tokens, grain background effects, custom typography class layers, and scroll-reveal CSS transitions.
+*   `app/intro/`
+    *   **Purpose**: Owns the primary landing page (root route `/` or `/intro`), introducing the lab's core identity, mission, statistical counters, and two research thrusts.
+    *   **Key Files**:
+        *   `app/intro/page.tsx`: Orchestrates the cover page layouts, mission quotes, and research thrust cards.
+*   `app/intro/_components/`
+    *   **Purpose**: Private subdirectory for intro-specific UI components. It does not share these components with other routes.
+    *   **Key Files**:
+        *   `app/intro/_components/HeroComposition.tsx`: Custom inline SVG render of an abstract mesh (representing MCM) and flow streams (representing QUIC) with native CSS animations.
+*   `app/lectures/`
+    *   **Purpose**: Owns the route `/lectures` displaying academic coursework and lectures offered by the lab director.
+    *   **Key Files**:
+        *   `app/lectures/page.tsx`: Renders course articles with details on codes, target levels, and descriptions.
+*   `app/members/`
+    *   **Purpose**: Owns the route `/members` showing the lab members, beginning with the PI and grouping student researchers.
+    *   **Key Files**:
+        *   `app/members/page.tsx`: Maps advisors, Ph.D. students, M.S. students, and undergraduate researchers.
+*   `app/publications/`
+    *   **Purpose**: Owns the route `/publications` displaying selected publications and output statistics.
+    *   **Key Files**:
+        *   `app/publications/page.tsx`: Houses publication data (Journals, Conferences) mapped in a list layout.
+*   `app/standardization/`
+    *   **Purpose**: Owns the route `/standardization` highlighting contributions made to various international standards bodies.
+    *   **Key Files**:
+        *   `app/standardization/page.tsx`: Groups standardization details per organization (oneM2M, W3C, IETF, OMA).
+*   `components/`
+    *   **Purpose**: Owns all shared, reusable presentation and interaction components. It holds no business logic and relies on configurable props to customize content.
+    *   **Key Files**:
+        *   `components/Header.tsx`: Responsive navigation bar with mobile menu toggles.
+        *   `components/Footer.tsx`: Site footer including address, email, and internal site index.
+        *   `components/PageHeader.tsx`: Reusable route banner supporting dual-language headers.
+        *   `components/SectionLabel.tsx`: corner-aligned section label ("01 / 05") mimicking magazine spreads.
+        *   `components/Reveal.tsx`: Motion wrapper triggering transition classes on scroll.
+        *   `components/Counter.tsx`: Client-side tick-up animation for figures.
+        *   `components/Marquee.tsx`: Endless horizontally running keyword ticker.
+*   `docs/`
+    *   **Purpose**: Owns documentation on the design system layout, color tokens, typography scales, and motion specifications.
+    *   **Key Files**:
+        *   `docs/DESIGN.md`: The canonical specification guide for the editorial magazine system ("Issue 01").
+
+---
+
+## 2. Public API Surface
+
+### (a) Shared Components (components/)
+
+*   `Counter` (default export) in `components/Counter.tsx:11`
+    *   **Props Shape**:
+        ```typescript
+        {
+          value: number;
+          duration?: number;
+          prefix?: string;
+          suffix?: string;
+          className?: string;
+        }
+        ```
+    *   **Consumers**:
+        *   `app/intro/page.tsx:5` (line figure metrics)
+        *   `app/members/page.tsx:5` (headcount metrics)
+        *   `app/publications/page.tsx:5` (publication count metrics)
+        *   `app/standardization/page.tsx:5` (contribution metrics)
+*   `Footer` (default export) in `components/Footer.tsx:13`
+    *   **Props Shape**: `{}` (takes no props)
+    *   **Consumers**:
+        *   `app/layout.tsx:5` (global page shell)
+*   `Header` (default export) in `components/Header.tsx:16`
+    *   **Props Shape**: `{}` (takes no props)
+    *   **Consumers**:
+        *   `app/layout.tsx:4` (global page shell)
+*   `Marquee` (default export) in `components/Marquee.tsx:9`
+    *   **Props Shape**:
+        ```typescript
+        {
+          items: string[];
+          reverse?: boolean;
+          className?: string;
+        }
+        ```
+    *   **Consumers**:
+        *   `app/intro/page.tsx:4` (keywords banner)
+        *   `components/Footer.tsx:2` (colophon running ticker)
+        *   `app/publications/page.tsx:6` (venues ticker)
+        *   `app/standardization/page.tsx:6` (standards bodies ticker)
+*   `PageHeader` (default export) in `components/PageHeader.tsx:10`
+    *   **Props Shape**:
+        ```typescript
+        {
+          ko: string;
+          en: string;
+          display?: string;
+          description?: string;
+          index: number;
+        }
+        ```
+    *   **Consumers**:
+        *   `app/lectures/page.tsx:2` (page introduction banner)
+        *   `app/members/page.tsx:2` (page introduction banner)
+        *   `app/publications/page.tsx:2` (page introduction banner)
+        *   `app/standardization/page.tsx:2` (page introduction banner)
+*   `Reveal` (default export) in `components/Reveal.tsx:15`
+    *   **Props Shape**:
+        ```typescript
+        {
+          children: ReactNode;
+          variant?: "up" | "left" | "right" | "scale";
+          delay?: number;
+          as?: ElementType;
+          className?: string;
+        }
+        ```
+    *   **Consumers**:
+        *   `app/intro/page.tsx:3` (scroll stagger containers)
+        *   `app/lectures/page.tsx:3` (scroll stagger containers)
+        *   `app/members/page.tsx:3` (scroll stagger containers)
+        *   `app/publications/page.tsx:3` (scroll stagger containers)
+        *   `app/standardization/page.tsx:3` (scroll stagger containers)
+        *   `components/PageHeader.tsx:2` (in-header transitions)
+*   `SectionLabel` (default export) in `components/SectionLabel.tsx:7`
+    *   **Props Shape**:
+        ```typescript
+        {
+          index: number;
+          total?: number;
+          label: string;
+          className?: string;
+        }
+        ```
+    *   **Consumers**:
+        *   `app/intro/page.tsx:6` (layout sub-numbering)
+        *   `app/lectures/page.tsx:4` (layout sub-numbering)
+        *   `app/members/page.tsx:4` (layout sub-numbering)
+        *   `app/publications/page.tsx:4` (layout sub-numbering)
+        *   `app/standardization/page.tsx:4` (layout sub-numbering)
+        *   `components/PageHeader.tsx:1` (header numbering tag)
+
+### (b) Page-level Components (app/)
+
+*   `RootLayout` (default export) in `app/layout.tsx:44`
+    *   **Props Shape**: `{ children: React.ReactNode; }`
+    *   **Consumers**: Entry layout shell for the Next.js router.
+*   `metadata` (named export) in `app/layout.tsx:35`
+    *   **Props Shape**: `Metadata` (Next.js config object)
+    *   **Consumers**: Resolved internally by Next.js for page metadata headers.
+*   `IntroPage` (default export) in `app/intro/page.tsx:73`
+    *   **Props Shape**: `{}` (takes no props)
+    *   **Consumers**: Next.js App Router path resolver.
+*   `metadata` (named export) in `app/intro/page.tsx:9`
+    *   **Props Shape**: `Metadata`
+    *   **Consumers**: Resolved internally by Next.js.
+*   `LecturesPage` (default export) in `app/lectures/page.tsx:45`
+    *   **Props Shape**: `{}` (takes no props)
+    *   **Consumers**: Next.js App Router path resolver.
+*   `metadata` (named export) in `app/lectures/page.tsx:6`
+    *   **Props Shape**: `Metadata`
+    *   **Consumers**: Resolved internally by Next.js.
+*   `MembersPage` (default export) in `app/members/page.tsx:65`
+    *   **Props Shape**: `{}` (takes no props)
+    *   **Consumers**: Next.js App Router path resolver.
+*   `metadata` (named export) in `app/members/page.tsx:7`
+    *   **Props Shape**: `Metadata`
+    *   **Consumers**: Resolved internally by Next.js.
+*   `PublicationsPage` (default export) in `app/publications/page.tsx:84`
+    *   **Props Shape**: `{}` (takes no props)
+    *   **Consumers**: Next.js App Router path resolver.
+*   `metadata` (named export) in `app/publications/page.tsx:8`
+    *   **Props Shape**: `Metadata`
+    *   **Consumers**: Resolved internally by Next.js.
+*   `StandardizationPage` (default export) in `app/standardization/page.tsx:88`
+    *   **Props Shape**: `{}` (takes no props)
+    *   **Consumers**: Next.js App Router path resolver.
+*   `metadata` (named export) in `app/standardization/page.tsx:8`
+    *   **Props Shape**: `Metadata`
+    *   **Consumers**: Resolved internally by Next.js.
+
+### (c) Private Components (app/<route>/_components/)
+
+*   `HeroComposition` (default export) in `app/intro/_components/HeroComposition.tsx:9`
+    *   **Props Shape**: `{ className?: string; }`
+    *   **Consumers**:
+        *   `app/intro/page.tsx:7` (embedded inline SVG cover graphic)
+
+### (d) Utilities/Hooks
+
+*   **None**. No utility files or custom hooks exist in the codebase. All custom scrolling or counter timing functions are written directly inline within `useEffect` wrappers of the respective UI components.
+
+---
+
+## 3. Test Coverage Footprint
+
+*   **Test Files Found**: A workspace-wide search for patterns such as `*.test.*`, `*.spec.*`, `__tests__/`, `vitest.config*`, `jest.config*`, `playwright.config*`, and `cypress/` returned **zero files**. There is no testing framework configured, nor are there any test scripts defined in `package.json`.
+*   **CI Configuration**: No CI configurations (e.g. `.github/workflows` or GitLab CI configuration files) exist in the workspace.
+*   **Coverage Matrix**:
+
+| Component / Route | Coverage Status | Evidence / Notes |
+| --- | --- | --- |
+| `components/Counter.tsx` | **UNTESTED** | No test file exists; contains requestAnimationFrame loops requiring mock timers. |
+| `components/Footer.tsx` | **UNTESTED** | No test file exists; pure static HTML render. |
+| `components/Header.tsx` | **UNTESTED** | No test file exists; houses mobile menu toggling state. |
+| `components/Marquee.tsx` | **UNTESTED** | No test file exists; renders static marquee track loops. |
+| `components/PageHeader.tsx` | **UNTESTED** | No test file exists; renders standard dual headings. |
+| `components/Reveal.tsx` | **UNTESTED** | No test file exists; relies on IntersectionObserver hooks. |
+| `components/SectionLabel.tsx` | **UNTESTED** | No test file exists; simple presentation decorator. |
+| `app/layout.tsx` | **UNTESTED** | No test file exists; handles font loading and root HTML. |
+| `app/intro/page.tsx` | **UNTESTED** | No test file exists; orchestrates landing sections. |
+| `app/intro/_components/HeroComposition.tsx` | **UNTESTED** | No test file exists; renders raw SVG frames and paths. |
+| `app/lectures/page.tsx` | **UNTESTED** | No test file exists; presentation routing. |
+| `app/members/page.tsx` | **UNTESTED** | No test file exists; presentation routing. |
+| `app/publications/page.tsx` | **UNTESTED** | No test file exists; presentation routing. |
+| `app/standardization/page.tsx` | **UNTESTED** | No test file exists; presentation routing. |
+
+*   **Top 3 Testing Gaps**:
+    1.  **`components/Reveal.tsx`**: Since it acts as a layout wrapper for almost all elements across all pages, any regression in the IntersectionObserver attachment could render all pages entirely invisible (stuck at opacity 0).
+    2.  **`components/Counter.tsx`**: Uses `requestAnimationFrame` and an active observer, which can cause frame stuttering or rendering failures on outdated browsers if not properly tested/mocked.
+    3.  **`components/Header.tsx`**: Manages the mobile view menu drawer state. Failure here blocks mobile navigation.
+
+---
+
+## 4. Documentation Presence
+
+*   **`README.md`**: Provides a clear introduction mapping the project's purpose as a reference prototype. It includes a lab overview, technology stack, directory layout, routing map table, design system overview, and customization hooks outlining where to modify styles, colors, and static data variables.
+    *   *First 20 lines quote*:
+        ```markdown
+        # 사물인터넷 표준 연구실 랜딩 페이지 (Reference Prototype)
+
+        경북대학교 컴퓨터학부 **사물인터넷 표준 연구실(IoT Standards Lab)** 의 랜딩 페이지
+        **참고용 프로토타입**입니다. 프로덕션 배포용이 아니라, 구조와 디자인을 참고해
+        실제 콘텐츠로 교체하기 위한 레퍼런스 구현입니다. 모든 인물·논문·표준 기여 내역은
+        예시(placeholder)이므로 실제 정보로 바꿔서 사용하세요.
+
+        ## 연구실 소개 (Lab Context)
+
+        본 연구실은 사물인터넷 국제 표준을 기반으로 **(a) 메타버스 상호운용성(MCM Project)**
+        과 **(b) QUIC 기반 멀티에이전트 오케스트레이션 아키텍처 및 통신 인터페이스 설계**
+        두 가지 축을 연구합니다.
+
+        ## 기술 스택 (Tech Stack)
+
+        - **Next.js 14+** (App Router)
+        - **TypeScript**
+        - **Tailwind CSS**
+        ```
+*   **`PROMPT.md`**: Confirming this is a **developer-facing prompt session history log** rather than user documentation. It logs the exact prompt briefs, session USD costs, and incremental generation patterns used when the AI created the repository.
+*   **`docs/` Directory**:
+    *   `docs/DESIGN.md`: The **canonical design system specification** detailing color tokens, typography scales, motion principles, and reuse rules for shared elements under "Issue 01".
+*   **JSDoc Coverage**:
+    *   **5 out of 7 (71.4%)** exported components in `components/` include structured JSDoc descriptions.
+    *   *Sample 1 (with JSDoc)*: `components/Counter.tsx` lines 5–10:
+        ```typescript
+        /**
+         * Number that ticks up from 0 → `value` when scrolled into view.
+         * Uses requestAnimationFrame only (no animation library).
+         *
+         * CUSTOMIZATION HOOK — CONTENT: value / prefix / suffix.
+         */
+        ```
+    *   *Sample 2 (with JSDoc)*: `components/Reveal.tsx` lines 7–14:
+        ```typescript
+        /**
+         * Scroll-triggered reveal. Uses a single IntersectionObserver (no deps).
+         * Pairs with the `.reveal` / `.is-visible` rules in globals.css.
+         *
+         * CUSTOMIZATION HOOK — MOTION:
+         *   variant → direction of entrance
+         *   delay   → stagger (ms), applied as transition-delay
+         */
+        ```
+    *   *Sample 3 (without JSDoc)*: `components/Footer.tsx` line 13:
+        ```typescript
+        export default function Footer() {
+        ```
+    *   *Sample 4 (without JSDoc)*: `components/Header.tsx` line 16:
+        ```typescript
+        export default function Header() {
+        ```
+*   **Documentation Gaps**:
+    1.  **No Data Flow & API integration guidance**: Lacks documentation explaining how to decouple the hardcoded static variables into remote databases, markdown files, or headless CMS feeds.
+    2.  **No local runtime guidelines**: Does not state supported Node.js version ranges (e.g., node 18/20 LTS) or lockfile rules to prevent dependency drift when a developer sets up local development.
+    3.  **No coding standard/linting rules documentation**: Missing details on stylistic constraints (e.g. Prettier or specific TypeScript guidelines) to maintain editorial design conventions.
+
+---
+
+## 5. Code Smells
+
+*   **Duplication**:
+    *   *JSX Structure*: The **Figures Counter Section** pattern is copy-pasted across 4 files. They use the same layout class structure:
+        ```tsx
+        <section className="border-b border-ink">
+          <div className="container-content grid gap-px bg-line sm:grid-cols-3">
+        ```
+        And they loop over a list mapping to `<Counter>`:
+        *   `app/intro/page.tsx` (lines 145–161)
+        *   `app/members/page.tsx` (lines 75–87)
+        *   `app/publications/page.tsx` (lines 103–115)
+        *   `app/standardization/page.tsx` (lines 106–118)
+    *   *Marquee Band Sections*: Very similar wrapper layouts enclosing `<Marquee>` components:
+        *   `app/intro/page.tsx` (lines 136–142)
+        *   `app/publications/page.tsx` (lines 94–101)
+        *   `app/standardization/page.tsx` (lines 98–104)
+    *   *Static Data Shapes*: Static arrays are defined at the top of each page file, coupling presentation and routing code directly with source content.
+*   **Dead Code**:
+    *   *Unused Design Tokens*: The `brand` and `accent` configurations in `tailwind.config.ts` (lines 48–53) are deprecated aliases marked as "back-compat" to avoid breaking stray classes, but are not actively referenced anywhere in the source files.
+*   **Oversized Files**:
+    *   `app/intro/page.tsx` is **288 lines long**. This size is partly justified as it acts as the primary landing page with multiple complex layout structures. However, it also embeds multiple large static arrays (e.g. `thrusts`, `figures`, `keywords`, `focusAreas`) directly in the file. Separating these datasets into a localized content file would reduce complexity.
+*   **Prop Drilling**:
+    *   None identified. The components are flat and presentation-only, and do not pass state down multiple layers.
+*   **Other Smells**:
+    *   TypeScript rules are strictly followed: there is no usage of `any` types or assertions, and no non-null (`!`) assertion bypasses.
+    *   Looping `key` props are correctly defined and mapped across all loops in the project.
+
+---
+
+## 6. Summary
+
+This codebase functions as a high-fidelity reference prototype and layout scaffold for a university research laboratory portal. The primary strength of the project is its exceptional editorial visual identity ("Issue 01") and its clean, type-safe implementation that respects accessibility parameters (such as `prefers-reduced-motion`). The top 3 risks/gaps identified are:
+
+1.  **Statically Coupled Content**: Page data (like membership lists, publications, and standardized contributions) is hardcoded directly inside page routes, making updates labor-intensive and error-prone for non-developers.
+2.  **Lack of Automated Verification**: The complete absence of testing tools, linting workflows, or CI pipelines poses a risk of visual regression or runtime failures during layout refactoring.
+3.  **No decoupled content or asset structure**: Static SVGs (like `HeroComposition`) are locked in hardcoded coordinates, preventing easy swap-outs of layout designs by non-designers.

refer_landing_page/.kanban-stack-profile.md

@@ -0,0 +1,140 @@
+# Stack Profile — `iot-standards-lab-landing`
+
+> Reference prototype landing page for the KNU CS IoT Standards Lab.
+> Workspace: `/home/godopu16/PuKi/lab/landing_page/refer_landing_page`
+> Produced as the deliverable for kanban task `t_239791d2`.
+
+## 1. Languages, Frameworks, Package Manager
+
+| Layer | Pin / Range | Installed | Latest | Note |
+|---|---|---|---|---|
+| Language | TypeScript `^5.5.3` | 5.9.3 | 6.0.3 | Pin is fine; major jump to TS 6 is non-breaking for most code |
+| Framework | Next.js `14.2.5` (exact) | 14.2.5 | 16.2.9 | 2 majors behind; line-locked by app's React 18 dep |
+| UI runtime | `react` `^18.3.1`, `react-dom` `^18.3.1` | 18.3.1 | 19.2.7 | React 19 is available but is a major — see §5 |
+| Package manager | npm (single `package-lock.json`, lockfile v3) | npm 10.9.7 | — | No `pnpm-lock.yaml` / `yarn.lock` / `bun.lockb` present |
+| Runtime | Node v22.22.2 (host) | — | — | No `engines` field declared |
+
+**Type system config** (`tsconfig.json`):
+- `strict: true`, `noEmit: true`, `incremental: true`
+- `moduleResolution: "bundler"`, `jsx: "preserve"`, `isolatedModules: true`
+- `plugins: [{ "name": "next" }]`, path alias `@/*` → `./*`
+
+**Next.js config** (`next.config.js`):
+- `reactStrictMode: true`; no image domains, no redirects, no rewrites, no headers, no experimental flags. Minimal by design.
+
+**Styling**:
+- Tailwind CSS `^3.4.6` (installed 3.4.19) — latest line is 4.x; the `tailwind.config.ts` is rich enough (114 lines, custom theme) that the v3→v4 jump is a planned migration, not a `npm update`.
+- `postcss.config.js` wires Tailwind + `autoprefixer` (^10.4.19).
+- Font stack is loaded via `next/font` and exposed as CSS variables — no external font loader (Google Fonts, Fontsource) is in the dep tree.
+
+**Not present**:
+- No `Dockerfile` / `docker-compose*` / `dockerignore` — there is no container image for this app.
+- No `.env`, `.env.example`, `.envrc` — the app reads no env vars.
+- No `.eslintrc*` file and no `eslintConfig` block in `package.json`. ESLint runs through `next lint`, which uses `eslint-config-next`'s defaults (`core-web-vitals` + `next/typescript`).
+- No `.prettierrc*` — formatting is not enforced in CI.
+- No `.github/`, no `.gitlab-ci.yml`, no `.circleci/` — no CI pipeline.
+
+## 2. Dependencies
+
+### Direct (runtime) — 3 packages
+
+| Package | Pin | Purpose |
+|---|---|---|
+| `next` | `14.2.5` (exact) | Framework |
+| `react` | `^18.3.1` | UI library |
+| `react-dom` | `^18.3.1` | DOM renderer |
+
+### Dev — 10 packages
+
+| Package | Pin | Purpose |
+|---|---|---|
+| `@types/node` | `^20.14.0` | Node typings (dev only) |
+| `@types/react` | `^18.3.3` | React typings |
+| `@types/react-dom` | `^18.3.0` | React DOM typings |
+| `autoprefixer` | `^10.4.19` | PostCSS plugin |
+| `postcss` | `^8.4.39` | CSS pipeline |
+| `tailwindcss` | `^3.4.6` | Utility CSS |
+| `typescript` | `^5.5.3` | Compiler |
+| `eslint` | `^8.57.0` | Linter |
+| `eslint-config-next` | `14.2.5` (exact, matches Next) | Next-flavored ESLint config |
+
+**Observations**:
+- Footprint is intentionally minimal — no `framer-motion`, no UI lib (shadcn/Radix/MUI), no icon set, no analytics, no CMS client, no image CDN.
+- `next` and `eslint-config-next` are pinned **exact** (no `^`); `react` and `react-dom` use `^`. This is the right call: Next and its ESLint config must move together.
+- Dev types are pinned to React 18, consistent with the runtime.
+- `package-lock.json` is 215 KB → transitive tree is fairly clean; the project has no obvious bloat.
+
+## 3. Scripts
+
+Four npm scripts, all thin wrappers around `next`:
+
+| Script | Command | Use |
+|---|---|---|
+| `npm run dev` | `next dev` | Local dev server (default port 3000) |
+| `npm run build` | `next build` | Production build → `.next/` |
+| `npm start` | `next start` | Run the production build |
+| `npm run lint` | `next lint` | ESLint via Next's wrapper |
+
+No `test`, `format`, `typecheck`, `prepare`, `pre-commit`, or any other lifecycle hooks. The 4-script surface is honest: linting is the only quality gate declared.
+
+## 4. Configuration / Manifest Inventory
+
+| File | Lines | Notes |
+|---|---|---|
+| `package.json` | 28 | Single manifest, no `engines`, no `workspaces` |
+| `package-lock.json` | (215 KB) | npm v3 lockfile |
+| `tsconfig.json` | 22 | strict, bundler resolution, `@/*` alias |
+| `next.config.js` | 6 | `reactStrictMode: true` only |
+| `tailwind.config.ts` | 114 | Editorial design tokens, custom colors, custom animations |
+| `postcss.config.js` | 6 | tailwindcss + autoprefixer |
+| `next-env.d.ts` | 5 | Next-managed, gitignored |
+| `tsconfig.tsbuildinfo` | (80 KB) | Incremental build cache, gitignored |
+| `.gitignore` | 27 | Standard Next.js ignore set |
+| `.kanban-inventory.json` | 137 | Upstream inventory artifact (not a config) |
+| `.antigravity-session.md` | 46 | Upstream runtime artifact (not a config) |
+
+## 5. Outdated / Vulnerable Pins (Trivially Obvious)
+
+### Vulnerabilities (from `npm audit`) — 8 advisories, 1 critical
+
+`next@14.2.5` is affected by **21 published advisories** that are fixed in `14.2.35` (same line, not a major jump):
+- **Critical** (1): Cache poisoning (GHSA-gp8f-8m3g-qvj9)
+- **High** (6): DoS via Server Components, image optimizer, middleware cache poisoning, SSRF via middleware redirect, etc.
+- **Moderate** (1): PostCSS XSS via unescaped `</style>` (transitive through `next/node_modules/postcss`)
+
+Plus **transitive**:
+- `glob` 10.2.0–10.4.5 — command injection in CLI (only triggered if `glob`'s CLI is invoked; **not a runtime risk for this Next app**)
+- `minimatch` 9.0.0–9.6 — ReDoS (transitive via ESLint's glob walker; **dev-time only**)
+
+**Recommended fix (lowest-risk):** `npm install next@14.2.35` — same major, same line, fixes 21 Next advisories + the transitive `postcss` advisory. Does **not** require React changes. `npm audit fix --force` would jump to Next 16 + React 19 — that's a planned migration, not a security patch.
+
+### Outdated-by-major pins (information only — not security)
+
+| Pin | Major delta | Risk profile |
+|---|---|---|
+| `next` 14 → 16 | App Router stabilized; some breaking changes (params async, etc.) | Planned migration |
+| `react`/`react-dom` 18 → 19 | New compiler, ref as prop, async transitions | Requires Next 15+ |
+| `eslint` 8 → 10 | Flat config becoming default | Could be deferred |
+| `typescript` 5 → 6 | Mostly compat, some strictness tightening | Trivial in this codebase |
+| `tailwindcss` 3 → 4 | New engine, config format change | Significant migration (would touch `tailwind.config.ts`) |
+| `@types/*` React 18 → 19, Node 20 → 25 | Mismatched with installed Node 22 host | Cosmetic |
+| `@types/node` 20 → 25 | Host is Node 22 — current pin still works but `25` would track current Node | Cosmetic |
+
+The biggest near-term "looks dated" item is the **React 18 + Next 14 stack** (released mid-2024), but everything is internally consistent — no mixed majors, no version skew between `next` and `eslint-config-next`. The stack is intentionally conservative.
+
+### Compatibility sketch (host vs declared)
+
+- Host Node 22, npm 10.9.7 — fits Next 14 / React 18 cleanly. No `engines` field; any contributor on Node ≥18 works.
+- `eslint@8` is the last v8; the `next lint` shim still works in Next 14.2.
+
+## 6. Build / Toolchain Footprint Summary
+
+- **Source files**: 25 (14 .tsx, 2 .ts, 2 .js, 1 .css, 2 .json, 4 .md), ~2,605 LOC excluding deps and lockfile (per upstream `.kanban-inventory.json`).
+- **Routes**: 5 under `app/` (`/`, `/lectures`, `/members`, `/publications`, `/standardization`).
+- **Shared components**: 7 in `components/`.
+- **Build artifacts present**: `node_modules/` (342 dirs) and `.next/` exist; lockfile and `tsconfig.tsbuildinfo` present.
+- **No test runner, no formatter, no CI, no Docker, no env vars, no analytics, no CMS, no icon lib, no motion lib.** The dependency tree is the smallest viable Next 14 + React 18 + Tailwind v3 surface.
+
+## 7. Stack-Profile Verdict
+
+A **deliberately minimal Next 14 App Router reference implementation**: a small landing page with a hand-rolled design system encoded in `tailwind.config.ts` and `app/globals.css`. Dependencies are minimal and internally consistent; the only real-world remediation on the table is bumping `next` to `14.2.35` (one-line patch) to clear 21 advisories. Major-version upgrades (Next 16, React 19, Tailwind 4) are a separate planned migration, not security work.

refer_landing_page/PROMPT.md

@@ -0,0 +1,249 @@
+# PROMPT.md — Claude Code에 전달한 프롬프트 기록
+
+> `refer_landing_page/` 디렉터리를 만들 때 Claude Code에 보낸 프롬프트의 **원문 + 의도 + 세션 메타** 기록. 공부/재사용용.
+
+---
+
+## 0. 작업 요약
+
+- **대상**: `~/PuKi/lab/landing_page/refer_landing_page/`
+- **프레임워크**: Next.js 14+ (App Router) + TypeScript + Tailwind CSS
+- **5개 라우트**: `/intro`, `/members`, `/publications`, `/lectures`, `/standardization`
+- **컨텍스트**: 경북대 IoT 표준 연구실 — MCM(메타버스 상호운용성) + QUIC 멀티에이전트 오케스트레이션
+- **최종 산출물**: 18개 파일 (config 6 + app 7 + components 3 + README + .gitignore)
+- **총 비용**: 약 $0.54 USD (claude-opus-4-8, 13 turns)
+- **호출 모드**: `claude -p "..."` (print mode, 비대화형)
+
+> ⚠️ `npm install`/`npm run dev`는 의도적으로 실행하지 않음. 사용자가 직접 실행.
+
+---
+
+## 1. 호출 명령 패턴 (Print Mode)
+
+```bash
+claude -p "$(cat /tmp/cc_prompt.md)" \
+  --dangerously-skip-permissions \
+  --max-turns 30 \
+  --max-budget-usd 5 \
+  --output-format json
+```
+
+| 플래그 | 값 | 이유 |
+|--------|-----|------|
+| `-p` | — | 비대화형 one-shot. 다중-턴 워크플로에는 부적합 |
+| `--dangerously-skip-permissions` | — | 파일 쓰기/네트워크를 자동 승인 (워크스페이스 신뢰 다이얼로그 스킵) |
+| `--max-turns` | 30 | 무한 루프 방지. 단일 작업엔 25~30이면 충분 |
+| `--max-budget-usd` | 5 | 비용 상한. 시스템 프롬프트 캐시 생성에 최소 ~$0.05 필요 |
+| `--output-format` | json | `session_id`, `total_cost_usd` 등 메타 회수 |
+| `workdir` | `/home/godopu16/PuKi/lab/landing_page` | Claude가 작업할 루트 |
+
+---
+
+## 2. 1차 프롬프트 (전체 — `/tmp/cc_prompt.md`)
+
+> claude가 부분적으로만 수행한 후 인터럽트됨. 다음 12개 파일만 생성:
+> package.json, next.config.js, next-env.d.ts, tsconfig.json, postcss.config.js, tailwind.config.ts, .gitignore, app/layout.tsx, app/globals.css, components/Header.tsx, components/Footer.tsx, components/PageHeader.tsx
+
+```text
+Create a Next.js 14+ (App Router) landing-page reference prototype at
+/home/godopu16/PuKi/lab/landing_page/refer_landing_page/ for a Korean
+university research lab.
+
+REQUIREMENTS (strict):
+1. Use Next.js 14+ App Router with TypeScript and Tailwind CSS. Use
+   create-next-app style structure (package.json, next.config.js, app/
+   directory, tailwind.config.ts, tsconfig.json, postcss.config.js).
+   If create-next-app is not available offline, write all files
+   manually with correct contents. Do NOT run any interactive install.
+2. Top app header with 5 navigation links routing to: /intro, /members,
+   /publications, /lectures, /standardization. Header must be sticky
+   and have a working mobile hamburger menu.
+3. Implement ALL 5 pages with realistic placeholder content. Each page
+   must be a real Next.js route (app/<route>/page.tsx) — NOT a single-
+   page mock.
+4. Lab context: 경북대학교 컴퓨터학부 사물인터넷 표준 연구실
+   (Internet of Things Standards Lab). The lab has two main research
+   thrusts: (a) MCM project — interoperability in metaverse
+   environments, (b) QUIC-based multi-agents orchestration architecture
+   and communication interface design. The intro page should introduce
+   both. The other pages should reflect this context.
+5. Responsive: works on desktop (>=1024px), tablet (640-1023), and
+   mobile (<640). Test that the header collapses to a hamburger menu
+   on mobile. Use Tailwind responsive classes.
+6. Korean-language UI. Lab name in Korean and English. Bilingual
+   section headers (Korean primary, English in parentheses) where
+   natural.
+7. Include a Footer with lab address placeholder, contact email
+   placeholder, and copyright line.
+8. README.md inside refer_landing_page/ explaining: project purpose
+   (reference prototype, not production), how to run (npm install,
+   npm run dev), route map, and a short list of customization hooks
+   (colors, fonts, content).
+9. Do NOT install npm packages. Just generate the source files. Add a
+   package.json with the standard Next.js scripts (dev, build, start,
+   lint) and the deps listed but with a note in README that the user
+   must run npm install themselves.
+10. Keep total file count reasonable — prefer fewer, well-structured
+    files over many fragments.
+
+OUTPUT FORMAT:
+- After generating files, list every file path you created with one-
+  line descriptions.
+- Do NOT run npm install, npm run dev, or any network commands.
+- Reply in English (final summary to me). The user is the lab PI; I am
+  Claude, the coding agent.
+
+Begin.
+```
+
+### 1차 시도 결과
+
+- 1차 호출은 30분 이상 흐른 뒤 인터럽트됨 (Hermes 세션 셧다운).
+- 그 시점에 claude는 **설정 파일 + components 3개 + layout.tsx + globals.css** 까지만 생성.
+- **5개 페이지(`app/<route>/page.tsx`) + README.md** 가 누락된 채 중단.
+
+---
+
+## 3. 2차 프롬프트 — 복구용 (누락 6개 파일만 생성) — `/tmp/cc_prompt2.md`
+
+> 같은 디렉터리에 새 세션으로 재진입하되, 이미 만들어진 파일은 **덮어쓰지 말라**고 명시.
+> claude-code skill의 Pitfall #13을 적용해 `-c` (continue) 대신 **새 세션 + 명시적 파일 목록** 패턴 사용.
+
+```text
+You are continuing a partially-completed task. The previous Claude
+session was interrupted at
+/home/godopu16/PuKi/lab/landing_page/refer_landing_page/.
+
+ALREADY CREATED (do NOT recreate, do NOT overwrite, leave as-is):
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/package.json
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/next.config.js
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/next-env.d.ts
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/tsconfig.json
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/postcss.config.js
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/tailwind.config.ts
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/.gitignore
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/app/layout.tsx
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/app/globals.css
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/components/Header.tsx
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/components/Footer.tsx
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/components/PageHeader.tsx
+
+YOU MUST CREATE (these are missing):
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/app/intro/page.tsx
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/app/members/page.tsx
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/app/publications/page.tsx
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/app/lectures/page.tsx
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/app/standardization/page.tsx
+- /home/godopu16/PuKi/lab/landing_page/refer_landing_page/README.md
+
+CONTEXT (same as original task):
+- Next.js 14+ App Router, TypeScript, Tailwind CSS.
+- Lab: 경북대학교 컴퓨터학부 사물인터넷 표준 연구실 (Internet of
+  Things Standards Lab).
+- Two research thrusts:
+  (a) MCM project — interoperability in metaverse environments
+  (b) QUIC-based multi-agents orchestration architecture and
+      communication interface design
+- Korean-language UI. Bilingual section headers (Korean primary,
+  English in parentheses) where natural.
+- 5 pages must each have realistic placeholder content (not lorem
+  ipsum). Use the lab context.
+- Responsive: use Tailwind responsive classes; works on desktop,
+  tablet, mobile.
+- Each page should use the existing components/PageHeader.tsx and
+  components/Footer.tsx where appropriate.
+
+README.md must include:
+- Project purpose (reference prototype, not production)
+- Lab context (1-2 sentences)
+- Tech stack (Next.js 14 App Router, TypeScript, Tailwind CSS)
+- Directory structure
+- How to run: `cd refer_landing_page && npm install && npm run dev`
+  and the resulting URL
+- Route map: /intro, /members, /publications, /lectures,
+  /standardization with one-line description of each
+- Customization hooks: where to change colors (tailwind.config.ts),
+  fonts (app/layout.tsx), content (each page.tsx)
+- A note that the user must run `npm install` themselves (do not run)
+
+OUTPUT FORMAT:
+- After generating files, list every file path you created with one-
+  line descriptions.
+- Do NOT run npm install, npm run dev, or any network commands.
+- Do NOT overwrite any of the ALREADY CREATED files listed above.
+- Reply in English. Be concise.
+
+Begin.
+```
+
+### 2차 시도 결과
+
+- `subtype: success`, 13 turns, $0.54
+- 누락된 6개 파일 모두 생성, 기존 12개 파일은 그대로 유지
+- README에 경고 문구(사용자 직접 `npm install` 필요) 명시
+
+---
+
+## 4. 프롬프트 설계 패턴 — 학습 노트
+
+### 4-1. Print 모드에서는 짧고 결정적인 프롬프트가 낫다
+
+`claude -p`는 **짧고 구체적인 지시**에 최적화돼 있다. claude-code skill 공식 가이드도 같은 내용을 명시:
+
+> "Brief, concrete prompts for print-mode code generation finish in seconds.
+> A 3-sentence verbose prompt with background context can cause 120s+ timeouts.
+> The file-write tool (not your prompt text) carries the implementation details."
+
+→ 1차 프롬프트가 60줄(약 1.2KB) 정도가 적절. 더 길면 `thinking` 시간만 늘어나고 결과는 같다.
+
+### 4-2. `REQUIREMENTS (strict):` 10개로 분해
+
+체크리스트 형식의 번호 매기기 지시는 누락이 적다. 1번이 누락되면 1번 항목만 다시 요청할 수 있어 **복구 단위**가 명확해진다.
+
+### 4-3. "Do NOT run X" — 네거티브 제약
+
+`Do NOT run npm install, npm run dev, or any network commands` 같은 **명시적 금지 목록**이 print 모드에서 일탈을 줄이는 데 효과적이었다.
+
+### 4-4. 작업 디렉터리 경로를 절대경로로
+
+`workdir`만으로는 부족. 프롬프트 안의 모든 경로를 **절대경로**로 적어야 claude가 자기 판단으로 위치를 옮기지 않는다.
+
+### 4-5. 복구 패턴: `-c` 대신 새 세션 + "ALREADY CREATED" 명세
+
+claude-code skill Pitfall #13:
+
+> "`-c` / `--continue` is dangerous in multi-workdir orchestration — `claude -c`
+> resumes the most recent session for the current working directory, which is
+> the wrong session whenever (a) you switched workdirs, (b) multiple workdirs
+> are in play, or (c) the most recent session in that workdir is not the one
+> you want to resume."
+
+→ 이번 케이스도 같은 이유로 `-c`를 피하고 **새 세션 + 누락 파일 명세** 로 복구했다. 12개 파일 경로를 일일이 적은 덕에 claude는 안전하게 "기존 파일 보존 + 누락 6개 생성" 으로 작업을 분기했다.
+
+### 4-6. `// CUSTOMIZATION HOOK` 주석 메타포
+
+claude가 각 페이지에 `// CUSTOMIZATION HOOK` 주석을 달아 데이터 배열의 위치를 표시했다. README에서 이 주석을 가리키는 가이드를 작성하면 **사용자가 실제 콘텐츠로 교체**할 때 헤맬 일이 없다. (보너스 효과)
+
+### 4-7. `--output-format json`의 활용
+
+`session_id`, `total_cost_usd`, `num_turns`, `usage.modelUsage`를 받으면 비용 추적·재개에 유리하다. 본 작업의 비용 메타(13 turns, $0.54)도 이걸로 회수했다.
+
+---
+
+## 5. 다음에 비슷한 작업을 한다면
+
+| 개선점 | 이유 |
+|--------|------|
+| 프롬프트를 1차에 한 번에 다 보내지 말고, **테스트 가능한 단위**(예: config + layout → 1차, pages → 2차)로 쪼갠다 | 인터럽트 시 손실이 적고 검증 단계 명확 |
+| `--max-turns 20` + `--max-budget-usd 3` 같은 보수적 캡 | 평균 작업 단위에 맞춰 과다 사용 방지 |
+| `--append-system-prompt-file`로 연구실 컨텍스트 미리 주입 | 매번 프롬프트에 컨텍스트 반복 안 해도 됨 |
+| 인터랙티브 모드(tmux) 검토 | 5개 페이지가 서로 의존성이 낮아 print 모드가 적절했지만, 디자인 반복이 많으면 tmux가 유리 |
+
+---
+
+## 6. 관련 산출물
+
+- `refer_landing_page/README.md` — 사용자용 실행 가이드
+- `refer_landing_page/` — 실제 Next.js 프로토타입 (18개 파일)
+- `refer_landing_page/RESEARCH.md`(상위) — 연구 분야 소개용 (홈페이지 카피 소스)
+- `/tmp/cc_prompt.md`, `/tmp/cc_prompt2.md` — 원본 프롬프트 파일 (이 문서의 원천)

refer_landing_page/README.md

@@ -0,0 +1,104 @@
+# 사물인터넷 표준 연구실 랜딩 페이지 (Reference Prototype)
+
+경북대학교 컴퓨터학부 **사물인터넷 표준 연구실(IoT Standards Lab)** 의 랜딩 페이지
+**참고용 프로토타입**입니다. 프로덕션 배포용이 아니라, 구조와 디자인을 참고해
+실제 콘텐츠로 교체하기 위한 레퍼런스 구현입니다. 모든 인물·논문·표준 기여 내역은
+예시(placeholder)이므로 실제 정보로 바꿔서 사용하세요.
+
+## 연구실 소개 (Lab Context)
+
+본 연구실은 사물인터넷 국제 표준을 기반으로 **(a) 메타버스 상호운용성(MCM Project)**
+과 **(b) QUIC 기반 멀티에이전트 오케스트레이션 아키텍처 및 통신 인터페이스 설계**
+두 가지 축을 연구합니다.
+
+## 기술 스택 (Tech Stack)
+
+- **Next.js 14+** (App Router)
+- **TypeScript**
+- **Tailwind CSS**
+
+## 디렉터리 구조 (Directory Structure)
+
+```
+refer_landing_page/
+├── app/
+│   ├── layout.tsx              # 루트 레이아웃 (Header/Footer, 폰트, 메타데이터)
+│   ├── globals.css             # Tailwind 지시문 + 공통 유틸 클래스
+│   ├── intro/page.tsx          # 연구실 소개
+│   ├── members/page.tsx        # 구성원
+│   ├── publications/page.tsx   # 논문
+│   ├── lectures/page.tsx       # 강의
+│   └── standardization/page.tsx# 표준화 활동
+├── components/
+│   ├── Header.tsx              # 반응형 상단 내비게이션
+│   ├── Footer.tsx              # 하단 연락처/바로가기
+│   ├── PageHeader.tsx          # 페이지 배너 (한글 제목 + 영문 display)
+│   ├── SectionLabel.tsx        # 매거진 섹션 넘버링 (01 / 05)
+│   ├── Reveal.tsx              # 스크롤 등장 모션 래퍼
+│   ├── Counter.tsx             # 0→값 카운트업 숫자
+│   └── Marquee.tsx             # 키워드 러닝 티커
+├── docs/
+│   └── DESIGN.md               # 디자인 시스템 문서 (토큰·타입·모션·컴포넌트)
+├── tailwind.config.ts          # 색상·폰트·타입스케일·모션 토큰
+├── next.config.js
+├── tsconfig.json
+├── postcss.config.js
+└── package.json
+```
+
+## 실행 방법 (How to Run)
+
+> ⚠️ 의존성 설치(`npm install`)는 **사용자가 직접 실행**해야 합니다. 이 저장소를
+> 생성한 도구는 `npm install`을 실행하지 않았습니다.
+
+```bash
+cd refer_landing_page
+npm install
+npm run dev
+```
+
+개발 서버는 기본적으로 **http://localhost:3000** 에서 실행됩니다.
+
+## 라우트 맵 (Route Map)
+
+| 경로 | 설명 |
+| --- | --- |
+| `/intro` | 연구실 소개 — 두 가지 연구 축(MCM, QUIC)과 연구 분야 |
+| `/members` | 구성원 — 지도교수 및 박사·석사·학부 연구원 (placeholder) |
+| `/publications` | 논문 — 대표 저널/학회 논문 목록 (placeholder) |
+| `/lectures` | 강의 — 담당 학부·대학원 강의 (placeholder) |
+| `/standardization` | 표준화 활동 — oneM2M, W3C WoT, IETF QUIC, OMA LwM2M 기여 (placeholder) |
+
+## 디자인 시스템 (Design System)
+
+이 사이트는 **고대비 매거진 스프레드** 감성의 에디토리얼 디자인 시스템("Issue 01")
+으로 구성됩니다. 소수의 토큰에서 전체 테마가 파생되며, 토큰 하나를 바꾸면 사이트
+전반에 반영됩니다. 색상 토큰, 타입 스케일, 모션 원칙, 공유 컴포넌트 사용법 등 전체
+설명은 **[`docs/DESIGN.md`](./docs/DESIGN.md)** 를 참고하세요.
+
+## 커스터마이징 (Customization Hooks)
+
+- **색상(Colors):** `tailwind.config.ts` 의 `theme.extend.colors` 에서 디자인 토큰을
+  수정합니다 — `ink`(본문·괘선), `ivory`/`paper`(종이 배경), `line`(헤어라인),
+  그리고 두 에디토리얼 강조색 `vermillion`(MCM/저널) · `cobalt`(QUIC/학회). 같은 값이
+  `app/globals.css` 의 `:root` CSS 변수에도 미러링되어 있으니 **두 곳을 함께** 바꾸세요.
+  (`brand`/`accent` 별칭은 레거시 호환용이므로 신규 코드에서는 사용하지 마세요.)
+- **폰트(Fonts):** `app/layout.tsx` 에서 `next/font` 로 로드해 CSS 변수
+  (`--font-display`, `--font-serif-ko`, `--font-sans`)로 노출하고,
+  `tailwind.config.ts` 의 `fontFamily` 에서 패밀리를, `fontSize` 의
+  `display`/`display-sm` 에서 매거진 디스플레이 스케일을 조정합니다.
+- **모션(Motion):** 스크롤 등장 타이밍은 `app/globals.css` 의 `--reveal-duration` /
+  `--reveal-ease` 에서, 마퀴·스트림 등 애니메이션 속도는 `tailwind.config.ts` 의
+  `theme.extend.animation` 에서 조정합니다. `prefers-reduced-motion` 은 자동 존중됩니다.
+- **콘텐츠(Content):** 각 `app/<route>/page.tsx` 상단의 `// CUSTOMIZATION HOOK` 주석이
+  표시된 데이터 배열(구성원, 논문, 강의, 표준 기여, 카운터 수치, 키워드 티커 등)을
+  실제 정보로 교체하세요.
+- **공유 컴포넌트(Shared Components):** `Reveal`(등장 모션), `SectionLabel`(섹션 넘버링),
+  `PageHeader`(페이지 마스트헤드), `Counter`(카운트업 수치), `Marquee`(키워드 티커)를
+  재사용합니다. 각 컴포넌트의 용도와 props 는 `docs/DESIGN.md` 4절을 참고하세요.
+- **내비게이션/푸터:** `components/Header.tsx` 의 `navItems`, `components/Footer.tsx` 의
+  주소·이메일 placeholder 를 수정합니다.
+
+---
+
+> 본 프로젝트는 참고용 프로토타입이며 실제 서비스 배포를 보장하지 않습니다.

refer_landing_page/REVIEW.md

@@ -0,0 +1,364 @@
+# 코드 리뷰 — refer_landing_page ("Issue 01" 디자인 시스템 적용)
+
+> 리뷰 대상: `main` 브랜치, `893dd91` (Initial commit) 이후의 working-tree 변경분
+> (`git status` 기준 12 modified + 9 untracked files, +1,092 / -262 lines, 5개 라우트 + 5개 신규 컴포넌트 + 디자인 문서 1건)
+> 검증 방법: `git diff` 정독, `npx tsc --noEmit` (clean), `npm run build` (clean, 8/8 정적 페이지), 디자인 정합성/HTML 유효성/접근성 정적 분석
+> 작성일: 2026-06-16 (1차) · **재검증: 2026-06-17 (2차)**
+
+> ### ⚠️ 2차 재검증 노트 (2026-06-17)
+> 1차 리뷰(2026-06-16) **이후 코드가 일부 수정**되었습니다. 1차의 P0/P1 중 여러 건이 이미 working tree에 반영되어, 아래 본문의 일부 항목은 **stale(이미 해결)** 상태입니다. 2차 재검증 결과 상태를 갱신하고, 1차가 놓친 **신규 버그 1건(`display-sm` 클래스 미정의 — §3 신규 A)** 을 추가했습니다.
+>
+> | 항목 | 1차 상태 | 2차 현재 상태 |
+> |---|---|---|
+> | §3 #1 publications `<ol>`>`<div>`>`<li>` | 🟠 미해결 | ✅ **해결됨** (`as="li"` 적용, `publications/page.tsx:133`) |
+> | §4 P1 #4 Marquee `w-full max-w-full` | 미반영 | ✅ **해결됨** (`Marquee.tsx:22`) |
+> | §3 medium·P1 #3 HeroComposition 텍스트 겹침 | 🟡 미해결 | ✅ **해소됨** (주석을 상단 모서리 y=24로 이동) |
+> | §4 P0 #2 Next.js 14.2.5 보안 | 🟠 미해결 | 🟠 **여전히 미해결** — 잔존 P0 |
+> | **신규 A** `display-sm` 클래스 미정의 | — | 🔴 **신규 High (1차 누락)** |
+> | **신규 B** `Counter` rAF unmount 미취소 | — | 🟡 **신규 Medium (1차 누락)** |
+
+---
+
+## 1. 개요 (Overview)
+
+이번 변경은 "한 권의 인쇄 매거지(Issue 01)" 컨셉의 **에디토리얼 디자인 시스템**을 처음부터 적용한 대규모 시각·구조 리뉴얼입니다. 단순한 클래스 리네임이 아니라 **레이아웃 언어·타이포그래피·모션·테마 토큰 전체**를 재설계했습니다.
+
+핵심 변화:
+
+- **테마 토큰 재설계**: `brand`(KNU 블루) / `accent` 단일 톤 → `ink` / `ivory` / `paper` / `line` + 두 개의 에디토리얼 강조색 `vermillion`(MCM) · `cobalt`(QUIC) 시스템으로 교체. `tailwind.config.ts` 와 `app/globals.css` `:root` 양쪽에 미러링되어 있어 토큰 일관성 보장.
+- **타이포그래피 교체**: 시스템 sans → Fraunces(영문 디스플레이 세리프) + Noto Serif KR(한글 세리프 헤드라인) + Inter(본문) 3-페어. `next/font`로 CSS 변수 주입.
+- **신규 모션·UI 프리미티브 4종**: `Reveal`(IntersectionObserver 기반 스크롤 등장), `Counter`(rAF 카운트업, `prefers-reduced-motion` 존중), `Marquee`(CSS 키프레임 러닝 티커), `SectionLabel`("01 / 05" 스프레드 넘버링).
+- **페이지 단위 전면 재구성**: 5개 라우트 모두 cover spread → figures → 메인 콘텐츠 → 보조 섹션의 잡지식 레이아웃으로 재작성. 카운터, 마키, 섹션 라벨이 페이지마다 다른 의미로 재사용됨.
+- **디자인 문서 정비**: `docs/DESIGN.md` 정본 보강, `docs/LAYOUT_AUDIT.md` 17개 이슈 카탈로그(이번 변경으로 일부 해결), `docs/TYPOGRAPHY_FIXES.md` 작업 노트 추가.
+- **문서**: `README.md`에 디자인 시스템 섹션·커스터마이징 훅 5종(색·폰트·모션·콘텐츠·공유 컴포넌트) 추가.
+
+기술적으로 **빌드/lint/타입 체크 모두 통과**합니다 (`npm run build` → 8/8 정적 페이지 생성, 87.1 KB shared first-load JS, no warnings).
+
+### 이전에 카탈로그화된 이슈 해결 현황
+
+`docs/LAYOUT_AUDIT.md` 17개 이슈 중 이번 diff에서 **다수가 해결**되었습니다 (해결 항목 8, 잔존 5, 미해결 4, 검증 후 OK 3):
+
+| # | 이슈 | 상태 |
+|---|------|------|
+| 1 | `border-current/*` opacity modifier → fixed gray | ✅ 해결 (`border-ink/20` 또는 `border-vermillion/30`로 교체) |
+| 2 | HeroComposition `transformOrigin` 박스 미스매치 | ✅ 해결 (인라인 `transformBox: "fill-box"` 추가) |
+| 3 | HeroComposition 우하단 텍스트와 4번 스트림 충돌 | ✅ 해결 (text `y` 356 → 334로 이동) |
+| 5 | Footer `mt-24` × `<main flex-1>` 이중 여백 | ✅ 해결 (`mt-0 lg:mt-8`) |
+| 6 | PageHeader `<h1>` 한국어 단어 분리 | ✅ 해결 (`break-keep` + `text-balance` 추가) |
+| 7 | "Standards" 9rem 캡 오버플로 | ✅ 해결 (`display` 캡 9rem → 7rem) |
+| 8 | Members 3그룹 2명 → 3-col ghost cell | ✅ 해결 (`lg:grid-cols-2`로 통일) |
+| 9 | `.reveal` no-JS 폴백 부재 | ✅ 해결 (`<noscript><style>` 추가) |
+| 10 | PageHeader `display` 미지정 시 `en` 풀사이즈 | ⚠️ **부분 무효** — `display ?? en` 분기는 맞으나 폴백이 의존하는 `display-sm` 클래스가 **미정의**라 의도된 3.75rem이 아닌 ~16px로 렌더됨. **신규 A 참조** |
+| 11 | Counter "2026" 0→2026 카운트업 | ⚠️ **부분 무효** — `static` prop은 정상이나 `display-sm` 스케일이 **미적용**(~16px). **신규 A 참조** |
+| 17 | `corner-label` 14px → 16px | ✅ 해결 (`text-sm` → `text-base`) |
+
+---
+
+## 2. 변경된 파일 (Files changed)
+
+| 파일 | 변경 종류 | 설명 |
+|---|---|---|
+| `tailwind.config.ts` | modified | 컬러 토큰 전체 교체(ink/ivory/paper/line/vermillion/cobalt, brand는 back-compat 별칭), 폰트 패밀리 3종, `display`/`display-sm` 매거진 스케일, marquee/stream-dash/node-pulse 5종 keyframes·animation 추가. |
+| `app/globals.css` | modified | `:root` CSS 변수 미러, 종이 그레인 배경, `::selection` 강조, `.display`/`.headline-ko`/`.kicker`/`.corner-label`/`.pull-quote`/`.rule`/`.spread-card`/`.draw-underline` 에디토리얼 프리미티브, `.reveal` 4종 variant, `.marquee-track`, `prefers-reduced-motion` 폴백 추가. 기존 `.card`/`.section-title`/`.section-subtitle` 제거(어디서도 미사용). |
+| `app/layout.tsx` | modified | `next/font`로 3개 폰트 로드 + CSS 변수 주입, `<html className>`에 변수 부착, `<noscript>` 폴백. |
+| `components/Header.tsx` | modified | 데스크탑 nav에 01–05 섹션 번호 + 영문 라벨 + 활성 상태 애니언더라인, 모바일 햄버거 아이콘 6×6→5×5 + 테두리 토글, 이슈 스트립 ("Issue 01 — 2026"), sticky ivory 배경. |
+| `components/Footer.tsx` | modified | 3-col 단순 링크 → 5-col 잡지 콜로폰(colophon/contact/index), `<Marquee>` 콜로폰 티커, 라벨별 인덱스 01–05, `draw-underline` 호버 효과, 세리프 산세리프if credit. |
+| `components/PageHeader.tsx` | modified | 그라데이션 히어로 → ivory 잡지 마스트헤드, `<SectionLabel>`+`<Reveal>` 조합, 한국어 serif `headline-ko` + 영어 `display` 워드 + 우측 보더라인 데스크립션, `display` 폴백 안전장치. |
+| `app/intro/page.tsx` | modified | Cover spread(헤드라인 + HeroComposition SVG) + 카운터 행(연구 축/표준화 기구/Issue) + 미션 풀쿼트 + 두 추력 비교 카드(vermillion × cobalt 연결 라인) + Focus Areas 4-col 그리드. `thrusts` 데이터에 `no`/`tag`/`accent` 필드 추가, 키워드/figures 데이터 추가. |
+| `app/members/page.tsx` | modified | 카운터 3종(지도교수/대학원/학부) + advisor 7+5 콜룸 + research groups 3그룹(vermillion/cobalt/ink 액센트). 3번째 그룹(학부) 2명 → `sm:grid-cols-2`로 통일. |
+| `app/publications/page.tsx` | modified | Venue `<Marquee>` + 카운터 3종(전체/저널/학회) + 잡지식 출판물 리스트(번호·연도·타입 좌측 rail + 제목·저자·venue 우측 본문), `Journal` → vermillion, `Conference` → cobalt. |
+| `app/standardization/page.tsx` | modified | Org `<Marquee>` + 카운터 3종(표준화 기구/기여 항목/기술 영역) + 4개 표준화 기구 카드(oneM2M/W3C WoT/IETF QUIC/OMA LwM2M), 기구별 accent(vermillion/cobalt 교차) + 적응형 보더. |
+| `app/lectures/page.tsx` | modified | 강의 3종을 3-col 카운터-스타일 카드로 재구성, 강의별 accent(vermillion/cobalt/ink), 우상단 01–03 spread 번호, 호버 시 accent 배경 + ivory 텍스트. |
+| `README.md` | modified | 디자인 시스템 섹션, 컴포넌트 트리 보강(SectionLabel/Reveal/Counter/Marquee 추가), 커스터마이징 훅 5종(색·폰트·모션·콘텐츠·공유 컴포넌트) 상세화. |
+| **신규** `components/Reveal.tsx` | added (60 lines) | `IntersectionObserver` 기반 스크롤 등장, `variant: up|left|right|scale`, `delay` ms, `as` prop으로 태그 오버라이드 가능. cleanup에서 `io.disconnect()`. |
+| **신규** `components/Counter.tsx` | added (78 lines) | rAF 카운트업 (`easeOutExpo`), `prefers-reduced-motion` 존중 시 즉시 렌더, `static` prop으로 years/고정값 처리. |
+| **신규** `components/Marquee.tsx` | added (41 lines) | 콘텐츠를 2번 복제해 `-50%` 트랜슬레이트 루프, `reverse` prop으로 방향 반전, ✦ 세퍼레이터. |
+| **신규** `components/SectionLabel.tsx` | added (28 lines) | "01 / 05" 스프레드 넘버 + hairline + kicker. |
+| **신규** `app/intro/_components/HeroComposition.tsx` | added (116 lines) | 인라인 SVG 에디토리얼 일러스트, MCM 노드 메시(vermillion) + QUIC 멀티스트림(cobalt), `node-pulse`·`stream-dash` CSS 애니메이션. |
+| **신규** `docs/DESIGN.md` (17,872 B) | added | 디자인 시스템 정본(토큰·타이포·모션·컴포넌트 4종). |
+| **신규** `docs/LAYOUT_AUDIT.md` (22,936 B) | added | 17개 이슈 카탈로그(이번 리뷰 시점 기준 11개 해결). |
+| **신규** `docs/TYPOGRAPHY_FIXES.md` (4,322 B) | added | 타이포그래피 작업 노트. |
+| **신규** `.antigravity-session.md`, `.kanban-*.md` (4 files) | added | Antigravity CLI 세션 / 카반 작업 산출물 (리뷰 대상 아님, 무시). |
+| **신규** `package-lock.json` | added | 의존성 잠금 파일 (기존 `package.json`은 변경 없음 — dev install로 추정, 커밋 대상 검토 필요, §3 참조). |
+
+---
+
+## 3. 발견된 이슈 (Issues)
+
+### 🔴 신규 A (High) — `display-sm` 클래스가 정의되어 있지 않아 매거진 디스플레이 텍스트가 ~16px로 축소 렌더 *(1차 누락)*
+
+**위치:** `components/PageHeader.tsx:43`, `app/intro/page.tsx:53` (+ `Counter` 경유)
+
+`display-sm`은 `tailwind.config.ts:77`에서 **`fontSize` 키**로 정의되어 있습니다. Tailwind의 `fontSize` 키는 `text-<key>` 유틸리티만 생성하므로 실제로 만들어지는 클래스는 `text-display-sm`이고, **맨(bare) `display-sm` 클래스는 생성되지 않습니다.** 한편 `app/globals.css`에는 `.display` 컴포넌트 클래스만 있고 `.display-sm` 컴포넌트 클래스는 없습니다.
+
+검증 (컴파일된 CSS 기준):
+
+```bash
+$ grep -o "display-sm" .next/static/css/app/layout.css | wc -l
+0          # ← display-sm 규칙이 전혀 없음
+$ grep -o "\.display"  .next/static/css/app/layout.css | wc -l
+1          # ← .display(컴포넌트 클래스)는 존재
+```
+
+따라서 `className="display-sm ..."`은 **아무 폰트 크기도 적용하지 않는 no-op 클래스**이고, 해당 텍스트는 브라우저 기본 크기(~16px)로 렌더됩니다.
+
+**영향:**
+
+- `PageHeader`에 `display` prop을 넘기지 않으면 fallback `en` 단어가 `display-sm`으로 렌더됩니다. **현재 `PageHeader`를 사용하는 4개 페이지(members/publications/lectures/standardization) 모두 `display`를 넘기지 않으므로**, "Members" · "Publications" · "Lectures" · "Standardization" 영문 디스플레이 단어가 의도된 `clamp(2rem, 5.5vw, 3.75rem)`이 아니라 **~16px 작은 vermillion 세리프**로 표시됩니다 — 마스트헤드의 큰 영문 단어가 사실상 사라집니다.
+- `app/intro/page.tsx:53`의 연도 "2026" 피겨는 `size: "display-sm"`이라 `Counter`가 `display-sm`으로 렌더 → **~16px**. 같은 행의 "2" · "4"는 `display`(최대 7rem)라 **극단적인 크기 불일치**로 피겨 행이 깨져 보입니다.
+- 이 버그는 본 문서 §1 LAYOUT_AUDIT 표의 #10/#11(및 #6/#7 일부) "해결" 주장을 **무효화**합니다.
+
+**왜 1차에서 못 잡았나 / build가 clean한 이유:** Tailwind/PostCSS는 **미정의 유틸리티 클래스를 에러 없이 조용히 무시**합니다. 따라서 `npx tsc --noEmit`도 `npm run build`도 통과하며, "build clean"이 **시각적 정합성을 보장하지 않습니다.**
+
+**권장 수정 (택1):**
+
+```css
+/* (A안, 권장) app/globals.css 컴포넌트 레이어에 .display-sm 추가 */
+.display-sm { @apply font-display text-display-sm font-light; }
+/* → 추가 시 PageHeader의 중복 `font-display font-light`는 제거 가능 */
+```
+
+또는 사용처를 `display-sm` → `text-display-sm`으로 바꾸되, 폰트 패밀리/굵기 클래스(`font-display font-light`)를 함께 명시 (Counter 사용처는 현재 폰트 클래스가 없으므로 누락 주의).
+
+### 🟡 신규 B (Medium) — `Counter`의 `requestAnimationFrame` 루프가 unmount 시 취소되지 않음 *(1차 누락)*
+
+**위치:** `components/Counter.tsx:52-69`
+
+```tsx
+const io = new IntersectionObserver(([entry]) => {
+  ...
+  let raf = 0;
+  const tick = (now) => { ...; if (t < 1) raf = requestAnimationFrame(tick); };
+  raf = requestAnimationFrame(tick);
+  return () => cancelAnimationFrame(raf);   // ← IO 콜백의 반환값 → 아무 데도 안 쓰임
+}, { threshold: 0.4 });
+io.observe(el);
+return () => io.disconnect();                // ← useEffect cleanup: 옵저버만 끊고 rAF는 안 멈춤
+```
+
+`return () => cancelAnimationFrame(raf)`는 **IntersectionObserver 콜백의 반환값**이라 호출되지 않습니다. `useEffect`의 cleanup은 `io.disconnect()`만 수행하므로, **진행 중인 rAF 카운트업 루프는 중단되지 않습니다.** 카운트업 도중 컴포넌트가 언마운트되면(예: 빠른 라우트 전환) rAF가 언마운트된 컴포넌트에 `setDisplay`를 계속 호출합니다. React 18은 이 setState를 경고 없이 no-op 처리하므로 **실 피해는 경미(낭비 프레임 수 개)**하지만, 명백한 누수입니다.
+
+**권장:** `raf` 변수를 `useEffect` 스코프로 끌어올려 cleanup에서 `cancelAnimationFrame(raf)`을 호출. 또는 `isStatic`/완료 플래그로 보호.
+
+---
+
+### ✅ ~~🟠 High — 잘못된 HTML 구조: `<div>`가 `<ol>`/`<ul>` 안에서 `<li>`를 감쌈~~ — **[2026-06-17 해결됨]**
+
+> **2차 재검증:** 현재 코드는 `app/publications/page.tsx:133`에서 `<Reveal as="li" ...>`로 렌더되며 주석에 본 항목(`REVIEW.md §3 #1`)을 인용해 둠. `<ol>`의 직접 자식 계약(`<li>`만 허용)을 준수하므로 **해결**. 아래 설명은 이력 보존용.
+
+**위치:** `app/publications/page.tsx:131-160`
+
+```tsx
+<ol className="mt-12 border-t border-ink">
+  {publications.map((p, i) => (
+    <Reveal key={p.title} delay={(i % 3) * 80}>     {/* default as="div" */}
+      <li className="group grid gap-6 border-b border-ink py-8 ...">
+        ...
+      </li>
+    </Reveal>
+  ))}
+</ol>
+```
+
+`Reveal`은 기본 `as: "div"`로 렌더링됩니다. 결과 DOM은 `<ol><div class="reveal"><li>...</li></div></ol>`이 되어 HTML 명세 위반입니다([spec](https://html.spec.whatwg.org/multipage/grouping-content.html#the-ol-element): `<ol>`의 자식은 0개 이상의 `<li>`/`<script>`/`<template>`만 허용). React는 콘솔 경고를 띄우지 않지만, 자동복구로 DOM이 재정렬될 수 있고(`<li>`가 `<ol>` 밖으로 이동), `<ol>`의 `start`/`type` 카운터 의미가 깨질 수 있습니다.
+
+나머지 페이지(lectures/standardization/members/intro)는 모두 `<Reveal>` 안에서 `<article>`을 감싸므로 안전합니다. 오직 publications만 `<li>`를 직접 감쌉니다.
+
+**권장 수정:**
+
+```tsx
+<Reveal as="li" key={p.title} delay={(i % 3) * 80}
+        className="group grid gap-6 border-b border-ink py-8 ...">
+  ...
+</Reveal>
+```
+
+### 🟠 High — `npm audit` 1 critical + 6 high 보안 권고 미반영
+
+**위치:** `package.json` / `package-lock.json` (Next.js `14.2.5`)
+
+`.kanban-final-report.md` §2에 따르면 의존성에 8개 권고(1 critical, 6 high, 1 moderate)가 있습니다. 핵심은 `next@14.2.5` → `14.2.35` 패치 한 줄로 21개가 해결됩니다(서버 컴포넌트 DoS, 캐시 포이즈닝, 미들웨어 SSRF, PostCSS XSS 등). 호환성: 같은 14.x 라인, React 18 락도 그대로.
+
+**권장 수정:**
+
+```bash
+npm install next@14.2.35
+npm audit
+```
+
+### 🟡 Medium — `package-lock.json`이 untracked 상태로 추가됨
+
+**위치:** working tree 루트
+
+`package.json`은 diff에 없는데 `package-lock.json`이 untracked로 들어왔습니다. 이전 커밋(`893dd91`)에도 lockfile이 없었다면 이번에 처음 도입된 것인데, 그 경우:
+
+- **의도된 커밋**이면 그대로 두고, 향후 `package.json` 변경 시 함께 업데이트되는지 CI 또는 가이드로 명시.
+- **무심코 추가된 것**이면(예: 로컬 `npm install` 부산물) `.gitignore`로 옮기는 것을 권장. 단, 215 KB인 lockfile을 추적하면 재현 가능한 빌드가 보장되므로 보통은 추적하는 편이 낫습니다.
+
+**권장 결정:** lockfile 추적 유지(재현 가능한 빌드의 정석). 단, 의도가 불분명하면 `git log --diff-filter=A -- package-lock.json`으로 첫 등장 시점 확인.
+
+### 🟡 Medium — `Reveal`의 IntersectionObserver cleanup 시점: `disconnect`이 unmount 시점에만 실행
+
+**위치:** `components/Reveal.tsx:47`
+
+```tsx
+useEffect(() => {
+  ...
+  io.observe(el);
+  return () => io.disconnect();
+}, []);
+```
+
+`unobserve`가 첫 intersection 시점에 호출되어(entry isIntersecting → unobserve, line 39) 이후 콜백이 다시 안 불리지만, dependency array가 `[]`라서 `variant`/`delay` prop이 바뀌어도 옵저버가 재생성되지 않습니다. 현재 `variant`는 CSS attribute로 적용되므로 prop 변경이 옵저버 동작에는 영향이 없어 실 문제는 없지만, **마운트 이후 prop만 바뀌는 경우 stale observer**가 됩니다(미세).
+
+**권장:** `useEffect` deps에 `[variant, delay]`를 추가하거나, `entry.target`의 `data-variant` 속성을 read해서 비교. 다만 현재 사용 패턴(컴포넌트가 한 번 마운트되면 prop이 안 바뀌는 정적 리스트)에서는 영향 없음 — **minor**.
+
+### 🟡 Medium — `Reveal as` prop 시그니처가 런타임 안전성을 보장하지 않음
+
+**위치:** `components/Reveal.tsx:19`, `26`
+
+`as?: ElementType`이라 `<Reveal as="ol">`처럼 잘못된 부모(예: `ol` 안의 `ol` 금지)나, `<Reveal as="li">`를 잊고 wrapper를 list 안에 넣는 사용을 막을 수 없습니다. #1의 문제가 발생한 이유도 이 가드 부재입니다. 호출 컨벤션으로 잡혀 있지만(모든 페이지가 `<Reveal>` 안에 article/div를 둠), 실수 방지 차원에서 **사용 시 `li`/`ol`/`ul` 컨텍스트일 땐 `as`를 강제하는 lint 룰(예: eslint-plugin-jsx-a11y custom rule) 또는 README에 "list 내부에서 쓸 땐 `as=\"li\"`" 규칙**을 명시하면 좋겠습니다.
+
+### 🟡 Medium — `Marquee`의 트랙이 `flex` + 콘텐츠가 `inline-flex`인데, width가 콘텐츠에 맞춰져 viewBox/parent overflow 계산이 viewport에 의존
+
+**위치:** `components/Marquee.tsx:22-38`
+
+`<div className="marquee-track">` 안의 시퀀스가 `[0, 1].map(dup)`로 2번 복제됩니다. CSS는 `translateX(0 → -50%)`로 50% 이동 후 같은 위치로 와서 seamless loop. **하지만 `marquee-track`이 `inline-flex`이고 콘텐츠가 `flex`인 점이 데스크탑에서만 동작**합니다 — 부모에 `overflow-hidden`은 있으니 화면이 줄어들면 콘텐츠가 부모 너비에 의해 클립되지만, **부모 width가 명시되지 않은 경우(예: `<Reveal>`의 wrapper)** `inline-flex`는 콘텐츠 폭만큼 자라서 페이지를 가로로 스크롤 가능하게 만들 수 있습니다. 현재는 모두 `container-content` 안에 있어 안전하지만, 다른 곳에서 단독 사용 시 가로 스크롤이 생길 수 있습니다.
+
+**권장:** `Marquee` 최상위에 `max-w-full` 또는 `w-full`을 추가하고, 부모 wrapper에서도 가로 클립이 보장되는지 명시.
+
+### ✅ ~~🟡 Medium — HeroComposition 4번 스트림이 우측 모서리 가까이 통과, 우하단 텍스트와의 간격이 6–10px~~ — **[2026-06-17 해소됨]**
+
+> **2차 재검증:** 현재 코드는 주석(annotation) 텍스트를 **상단 두 모서리(y=24)** 로 이동했습니다(`HeroComposition.tsx:104,107`). 스트림(y≥250)·노드 메시(y=60~240)와 수직으로 분리되어 겹침이 구조적으로 제거되었습니다. 1차의 `y=334` 우하단 배치 가정은 더 이상 유효하지 않습니다. 아래 설명은 이력 보존용.
+
+**위치:** `app/intro/_components/HeroComposition.tsx:99-113`
+
+LAYOUT_AUDIT #3은 `y=356 → 334`로 이동하여 해결되었지만, 스트림 곡선의 마지막 control point는 `360, 320` (i=3) 입니다. 텍스트 baseline은 `y=334`이고 폰트 size 11 + letterSpacing 2이므로 텍스트 상단 ~y=323, 하단 ~y=336. 텍스트의 우측 끝(`x=360, textAnchor="end"`)은 x=360에 anchor되므로 가로 폭이 좁지는 않지만, **스트림 4번은 x=240~360 / y=300~340 대역**을 지나가며 텍스트의 시작점(좌측)에 근접합니다. 텍스트 내용("QUIC · STREAMS")이 ~100px 폭이라면 우측 x≈260~360에 그려지는데, 4번 스트림의 끝점 (360, 320)이 텍스트의 (260, 334) 근처를 지나갑니다.
+
+해결된 것으로 보이지만 실제로는 텍스트가 스트림 곡선과 **여전히 시각적으로 겹칠 수 있는** 좁은 마진입니다. `y=320` 정도 또는 `y=348` 정도로 더 멀리 두는 편이 안전합니다.
+
+### 🟡 Medium — `text-balance` + `break-keep`이 한국어에 대해 100% 안정적이지 않음
+
+**위치:** `components/PageHeader.tsx:32`
+
+```tsx
+<h1 className="headline-ko break-keep text-balance text-3xl leading-[1.05] text-ink sm:text-4xl lg:text-5xl">
+```
+
+- `text-balance` (CSS `text-wrap: balance`)는 2024년 기준 Chrome 114+ / Safari 17.5+ / Firefox 121+에서 지원. **지원하지 않는 브라우저에서는 무시되며 fallback 없음** — 큰 문제 아님.
+- `break-keep` (`word-break: keep-all`)은 한국어/일본어/중국어 텍스트에서 단어 경계로 줄바꿈을 강제. 한국어는 공백이 거의 없어서 효과가 제한적입니다. `"멀티에이전트 오케스트레이션"` 같이 공백이 있는 제목은 효과가 있고, `"사물인터넷표준연구실"` 같이 공백이 없는 경우 여전히 글자 단위로 깨질 수 있습니다.
+
+**권장:** 한 줄이 너무 길어질 가능성이 있는 한국어 헤드라인은 강제로 `<br />`을 박거나 `whitespace-pre-line` + 줄바꿈 문자(`\n`)를 사용.
+
+### 🟡 Medium — `Reveal`로 감싼 `<div>`/`<article>` 안에 있는 `<a>` 링크가 reveal 애니메이션과 충돌할 가능성
+
+`Reveal`은 `opacity: 0` → 1로 페이드 인하는데, `prefers-reduced-motion`이 설정되지 않은 환경에서 사용자가 링크를 빠르게 따라가려 할 때(약 0.8s transition + delay) **클릭 타깃이 시각적으로 보이지만 실제 클릭 가능 시점이 늦어지는** 사각지대가 생깁니다. IntersectionObserver의 `threshold: 0.12`는 12%가 뷰포트에 들어와야 트리거되므로 화면 상단에서 스크롤 시 약 100ms 정도만 보입니다.
+
+**권장:** `prefers-reduced-motion` 사용자에게만 즉시 표시 + 일반 사용자에게는 0.4s로 duration 단축 검토(현재 820ms는 약간 길음). 또는 threshold를 더 낮춰 0.05 정도로.
+
+### 🟢 Low — `key={p.title}`가 title 충돌 시 깨짐
+
+**위치:** `app/publications/page.tsx:131`, `app/standardization/page.tsx` 등
+
+publication title이 unique하지 않은 경우(같은 제목이 여러 venue에 출판될 수 있음) React key 충돌이 일어납니다. 현재 데이터는 unique이지만, 향후 같은 title이 들어오면 오류. `key={\`${p.title}-${p.year}-${p.venue}\`}` 등 composite key가 더 안전.
+
+### 🟢 Low — `accent` 식별자가 색상 이름과 충돌
+
+**위치:** `app/lectures/page.tsx:18,26,34`, `app/members/page.tsx:25,34,44`, `app/standardization/page.tsx:20,30,40,50`
+
+각 페이지가 data field 이름으로 `accent`를 쓰고(`accent: "vermillion" as const`), `accentText`/`accentDot` 맵의 key로도 씁니다. 가독성은 양호하지만 `accent`는 Tailwind 유틸리티 클래스 이름과 충돌할 수 있고, 추후 CSS `accent-color` 속성과 헷갈릴 여지가 있습니다. 의미상 `theme` 또는 `tint`가 더 명확합니다.
+
+### 🟢 Low — `<Reveal>`의 SSR/CSR hydration mismatch 가능성 (이론적)
+
+`Reveal`은 `"use client"`이고 첫 렌더에서 `is-visible` 클래스를 아직 안 가진 상태로 마운트됩니다. HTML은 SSR 시에도 `.reveal` + `data-variant` + `opacity: 0`이 적용되어 전송되고, JS hydrate 후 IntersectionObserver가 `is-visible`을 토글합니다. **서버에서는 항상 `opacity: 0` → 클라이언트에서는 항상 `opacity: 0`이라 hydration mismatch는 없음**. 다만 **no-JS 환경**에서는 noscript 폴백(`<noscript><style>.reveal { opacity: 1 !important; ... }</style></noscript>`)이 의도대로 동작하므로 해결됨. ✅
+
+### 🟢 Low — `Header` 모바일 메뉴의 z-index와 `<Marquee>` band의 sticky 충돌 가능성
+
+`Header`는 `sticky top-0 z-50`. `<Marquee>`는 absolute/sticky 없이 일반 flow. 모바일에서 햄버거 메뉴가 열렸을 때(`<nav id="mobile-menu">` 펼쳐진 상태) `<Marquee>`가 위에 있으면 클릭이 가려질 수 있으나, `<Marquee>`는 `aria-hidden`이라 인터랙션 요소는 아닙니다. **실 문제 아님**.
+
+### 🟢 Low — `app/intro/page.tsx:90-105`에 중첩된 `<Reveal>` 4연타
+
+```tsx
+<Reveal delay={60}>...</Reveal>
+<Reveal delay={120}>...</Reveal>
+<Reveal delay={200}>...</Reveal>
+<Reveal delay={260}>...</Reveal>
+```
+
+같은 부모 영역에 4개 sibling Reveal이 60ms 간격으로 등장. `Reveal` 각각이 별도 IntersectionObserver 인스턴스를 생성하므로 **브라우저 메모리에 observer 4개가 동시** 만들어집니다(가벼우나 관용적이지 않음). 같은 영역이면 하나의 Reveal로 묶고 내부 stagger를 CSS `transition-delay`로 처리하는 편이 깔끔합니다.
+
+### 🟢 Low — 접근성: `Marquee`에 `prefers-reduced-motion` 폴백은 있으나 키보드/SR 사용자용 일시정지 토글 없음
+
+`prefers-reduced-motion` 환경에서는 `.marquee-track { animation: none }`이 적용되어 멈춥니다. 그러나 키보드 사용자나 스크린리더 사용자에게 명시적인 정지 토글은 없습니다. `aria-hidden`이라 SR은 무시하므로 큰 문제는 아니나, 인지적으로 천천히 움직이는 콘텐츠가 본문 읽기를 방해할 수 있습니다(학습장애 사용자 등). WCAG 2.2.2 (Pause, Stop, Hide) 권고. 현재 컨텐츠는 "decorative ticker"로 분류 가능하므로 **선택적 개선사항**.
+
+### 🟢 Low — `HeroComposition` SVG의 `aria-label`이 한글/영문 혼합
+
+`aria-label="MCM 상호운용 노드와 QUIC 멀티스트림을 형상화한 추상 일러스트레이션"` — 영문+한글 혼합. SR 호환성을 고려하면 영문만 또는 한/영 둘 다 `<title>` + `<desc>`로 분리하는 게 표준. 현재 SR 환경에서 한글이 잘 읽히므로 **minor**.
+
+---
+
+## 4. 개선 제안 (Concrete Suggestions)
+
+> **2차 갱신:** 1차 P0 #1과 P1 #3/#4는 이미 해결되어 목록에서 제거(취소선)했고, **신규 A(`display-sm` 미정의)** 를 P0로 승격했습니다.
+
+### P0 (반드시 머지 전 처리)
+
+1. **신규 A — `display-sm` 클래스 정의** — `app/globals.css`에 `.display-sm { @apply font-display text-display-sm font-light; }` 추가. 미적용 시 4개 PageHeader 페이지의 영문 디스플레이 단어와 intro "2026" 피겨가 ~16px로 깨짐. **§3 신규 A 참조.** 1분 작업.
+2. **`#2` npm audit 해결** — `npm install next@14.2.35` 후 `npm audit` clean 확인. `package.json`은 여전히 `14.2.5` (미반영). 1분 작업.
+3. ~~**`#1` HTML invalidity 수정**~~ — ✅ **이미 해결됨** (`publications/page.tsx:133` `<Reveal as="li">`).
+
+### P1 (다음 PR에서)
+
+4. ~~**HeroComposition 우하단 텍스트 마진**~~ — ✅ **해소됨** (주석을 상단 y=24로 이동).
+5. ~~**Marquee `w-full max-w-full` 명시**~~ — ✅ **이미 적용됨** (`Marquee.tsx:22`).
+6. **신규 B — `Counter` rAF cleanup** — `raf`를 useEffect 스코프로 올려 cleanup에서 `cancelAnimationFrame`. **§3 신규 B 참조.** 5분 작업.
+7. **`Reveal` 내부 stagger를 `transition-delay`로 통합** — intro 페이지 4연타는 단일 wrapper로 묶고 자식은 `style={{ transitionDelay: ... }}`로 처리. (미해결, minor) 10분 작업.
+8. **`Reveal`의 `transition-duration`을 820ms → 600ms로 단축** — 모션 선호 off 환경에서 페이지 응답성 개선. (`globals.css:20` 아직 820ms) 1분 작업.
+
+### P2 (정리)
+
+7. **README에 "List 안에서 `<Reveal>` 사용 시 `as=\"li\"` 필수" 규칙 추가** — `docs/DESIGN.md` 4절 보강.
+8. **데이터 필드명 `accent` → `tint` 리네임** — lecture/member/standardization 페이지 3곳 + intro. 15분 작업.
+9. **`publications` 키를 composite으로** — `key={\`${p.title}-${p.year}\`}`. 1분 작업.
+10. **package.json에 `"engines": { "node": ">=20" }` 명시** — Node 22 환경 명시. 1분.
+11. **마키에 명시적 정지 토글** (선택) — `prefers-reduced-motion` 외에 키보드/터치 사용자가 토글 가능하도록 `<button aria-label="티커 일시정지">` 추가. 30분 작업.
+12. **`Counter`에 `aria-live="polite"` 추가** — 카운트업이 끝났을 때 SR이 "전체 논문 4건" 식으로 알려줄 수 있음. 5분 작업.
+
+---
+
+## 5. 결론 (Verdict) — **2026-06-17 재검증 기준**
+
+### **Needs changes (잔존 P0 2건 머지 전 처리 필요)**
+
+매우 잘 정리된 변경입니다. 1차 리뷰 이후 코드가 갱신되어 **1차 P0 #1(publications HTML)·P1 #3(HeroComposition)·P1 #4(Marquee) 3건이 이미 해결**되었습니다. 다만 2차 재검증에서 **1차가 놓친 시각 버그 1건**을 발견했고, 1차의 보안 권고는 아직 미반영입니다.
+
+**머지 전 반드시 처리할 2건 (P0):**
+
+1. **`display-sm` 클래스 미정의** (`globals.css`에 `.display-sm` 추가) — 4개 PageHeader 페이지의 영문 디스플레이 단어와 intro "2026" 피겨가 의도된 ~3.75rem이 아니라 ~16px로 렌더되어 마스트헤드/피겨 행이 깨짐. **build/tsc가 잡지 못하는 조용한 버그.** §3 신규 A.
+2. **Next.js 14.2.5 보안 권고 1 critical + 6 high** — 동일 라인 14.2.35로 한 줄 업그레이드로 해결. (아직 `package.json` 미반영)
+
+이 두 건을 처리하면 **LGTM**입니다. 그 후 P1(신규 B Counter cleanup, Reveal stagger/duration)은 다음 PR에서 정리하면 됩니다.
+
+### 핵심 강점 (정리)
+
+- **토큰 일관성**: `tailwind.config.ts` ↔ `app/globals.css` `:root` 양쪽 미러, `tailwind.config.ts` 한 줄 변경이 사이트 전체에 전파.
+- **모션 일관성**: 4개 페이지에서 같은 카운터/마키/리빌이 다른 의미로 재사용되어 통일된 리듬.
+- **접근성 기본기**: `aria-hidden` (Marquee), `aria-expanded` (Header), `aria-label` (HeroComposition SVG), `noscript` 폴백, `prefers-reduced-motion` 존중.
+- **타입 안전성**: 모든 prop이 optional/required 명시, `as const` 리터럴 타입으로 액센트 매핑, TypeScript 5.9 / strict 모드 clean.
+- **문서화**: `docs/DESIGN.md`(정본), `docs/LAYOUT_AUDIT.md`(자체 점검), `docs/TYPOGRAPHY_FIXES.md`(작업 노트) 3종이 변경을 추적 가능하게 만듦.
+
+### 결론 요약
+
+| 항목 | 평가 |
+|---|---|
+| 빌드/타입/lint | ✅ Clean (단, 미정의 클래스 `display-sm`는 빌드가 못 잡음 — §3 A) |
+| 디자인 일관성 | ⚠️ 5개 라우트 잡지 미학은 일관되나, `display-sm` 미정의로 영문 마스트헤드/연도 피겨가 실제로는 깨짐 |
+| 모션/타이포/테마 | ✅ 토큰 시스템 작동 (타이포 한 군데 `display-sm` 누락 제외) |
+| 1차 이슈 해결 (2차 확인) | ✅ P0 #1·P1 #3·P1 #4 추가 해결됨 |
+| 신규 발견 이슈 (2차) | 🔴 1건(`display-sm` 미정의, High), 🟡 1건(Counter rAF cleanup) |
+| 잔존 P0 | 🟠 2건 — (a) `display-sm` 정의, (b) Next.js 14.2.35 업그레이드 |
+| 머지 가능 여부 | **잔존 P0 2건 처리 후 가능** |
+
+---
+
+*리뷰어 메모: 변경량 대비 코드 품질이 매우 높습니다. 특히 LAYOUT_AUDIT에 카탈로그된 이슈 중 핵심 8건을 한 번에 해결한 점, 그리고 `<noscript>` 폴백을 layout 단계에 추가한 점은 마이너 변경에서 놓치기 쉬운 디테일을 잘 챙긴 흔적입니다. 위 2건(P0)만 정리되면 본 변경은 그대로 main에 머지해도 좋을 수준입니다.*

refer_landing_page/app/globals.css

@@ -0,0 +1,158 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* ==================================================================
+   EDITORIAL DESIGN SYSTEM — global tokens & type
+   CUSTOMIZATION HOOK: design tokens are mirrored from tailwind.config.ts
+   as CSS variables so plain CSS (grain, gradients) can reuse them.
+   ================================================================== */
+:root {
+  color-scheme: light;
+  --ink: #0a0a0a;
+  --ivory: #f5f1e8;
+  --paper: #ece6d6;
+  --line: #d8d1c0;
+  --vermillion: #d9342b;
+  --cobalt: #1b3a8a;
+
+  /* CUSTOMIZATION HOOK — MOTION: global reveal timing */
+  --reveal-duration: 600ms;
+  --reveal-ease: cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+html {
+  scroll-behavior: smooth;
+}
+
+body {
+  @apply bg-ivory text-ink font-sans antialiased;
+  /* Subtle paper grain — pure CSS, no asset. */
+  background-image: radial-gradient(
+    rgba(10, 10, 10, 0.022) 1px,
+    transparent 1px
+  );
+  background-size: 4px 4px;
+}
+
+::selection {
+  background: var(--vermillion);
+  color: var(--ivory);
+}
+
+/* ==================================================================
+   COMPONENT LAYER — editorial primitives
+   ================================================================== */
+@layer components {
+  .container-content {
+    @apply mx-auto w-full max-w-content px-5 sm:px-8 lg:px-12;
+  }
+
+  /* Massive magazine display title (English serif). */
+  .display {
+    @apply font-display text-display font-light;
+    font-optical-sizing: auto;
+  }
+
+  /* Smaller display title — used for long fallback words (PageHeader `en`)
+     and figures that should not read at the full cover scale (e.g. the
+     "2026" issue year on /intro). Mirrors `.display` at the `display-sm`
+     type ramp. See LAYOUT_AUDIT #6 + #10. */
+  .display-sm {
+    @apply font-display text-display-sm font-light;
+    font-optical-sizing: auto;
+  }
+
+  /* Korean serif headline. */
+  .headline-ko {
+    @apply font-serif-ko font-semibold tracking-tight;
+  }
+
+  /* Small-caps kicker / eyebrow with wide tracking. */
+  .kicker {
+    @apply font-sans text-[0.7rem] font-semibold uppercase tracking-caps text-ink-mute;
+  }
+
+  /* Corner "01 / 05" spread numbering.
+     Bumped from text-sm (14px) to text-base (16px) so the editorial
+     spread number reads as "page number", not body copy.
+     See LAYOUT_AUDIT #17. */
+  .corner-label {
+    @apply font-display text-base font-medium tabular-nums tracking-wide text-ink-mute;
+  }
+
+  /* Huge italic serif pull-quote. */
+  .pull-quote {
+    @apply font-display text-3xl font-light italic leading-tight sm:text-4xl lg:text-5xl;
+  }
+
+  /* Hairline editorial rule. */
+  .rule {
+    @apply border-t border-ink/80;
+  }
+
+  /* Magazine inset card on dimmer paper. */
+  .spread-card {
+    @apply border border-ink/15 bg-paper transition duration-500;
+  }
+
+  /* Animated underline-draw on hover (for links). */
+  .draw-underline {
+    background-image: linear-gradient(var(--vermillion), var(--vermillion));
+    background-position: 0 100%;
+    background-repeat: no-repeat;
+    background-size: 0% 2px;
+    transition: background-size 0.4s var(--reveal-ease);
+  }
+  .draw-underline:hover {
+    background-size: 100% 2px;
+  }
+}
+
+/* ==================================================================
+   MOTION — scroll reveal (paired with components/Reveal.tsx)
+   CUSTOMIZATION HOOK — MOTION: edit transforms / duration here.
+   ================================================================== */
+.reveal {
+  opacity: 0;
+  transform: translateY(28px);
+  transition: opacity var(--reveal-duration) var(--reveal-ease),
+    transform var(--reveal-duration) var(--reveal-ease);
+  will-change: opacity, transform;
+}
+.reveal[data-variant="left"] {
+  transform: translateX(-40px);
+}
+.reveal[data-variant="right"] {
+  transform: translateX(40px);
+}
+.reveal[data-variant="scale"] {
+  transform: scale(0.96);
+}
+.reveal.is-visible {
+  opacity: 1;
+  transform: none;
+}
+
+/* Marquee track must be 2× content for a seamless loop. */
+.marquee-track {
+  display: inline-flex;
+  white-space: nowrap;
+  will-change: transform;
+}
+
+/* Respect users who prefer reduced motion. */
+@media (prefers-reduced-motion: reduce) {
+  .reveal {
+    opacity: 1 !important;
+    transform: none !important;
+    transition: none;
+  }
+  .marquee-track,
+  [class*="animate-"] {
+    animation: none !important;
+  }
+  html {
+    scroll-behavior: auto;
+  }
+}

refer_landing_page/app/intro/_components/HeroComposition.tsx

@@ -0,0 +1,120 @@
+/**
+ * Abstract editorial hero — a custom illustration (inline SVG, no asset).
+ *   • MCM  → a constellation of interconnected nodes (vermillion).
+ *   • QUIC → flowing, multiplexed streams (cobalt), animated dash flow.
+ * Animations are pure CSS (tailwind keyframes: node-pulse, stream-dash).
+ *
+ * CUSTOMIZATION HOOK — palette is inherited from CSS vars; geometry below.
+ */
+export default function HeroComposition({
+  className = "",
+}: {
+  className?: string;
+}) {
+  // MCM node coordinates (interconnected mesh, upper-left field).
+  const nodes = [
+    { x: 70, y: 90 },
+    { x: 160, y: 60 },
+    { x: 130, y: 170 },
+    { x: 230, y: 130 },
+    { x: 60, y: 210 },
+    { x: 210, y: 240 },
+  ];
+  // Mesh edges between nodes (index pairs).
+  const edges: [number, number][] = [
+    [0, 1],
+    [0, 2],
+    [1, 3],
+    [2, 3],
+    [2, 4],
+    [3, 5],
+    [2, 5],
+    [4, 5],
+  ];
+
+  return (
+    <svg
+      viewBox="0 0 380 380"
+      role="img"
+      aria-label="MCM 상호운용 노드와 QUIC 멀티스트림을 형상화한 추상 일러스트레이션"
+      className={className}
+    >
+      {/* Frame */}
+      <rect
+        x="6"
+        y="6"
+        width="368"
+        height="368"
+        fill="none"
+        stroke="#0A0A0A"
+        strokeWidth="1.5"
+      />
+
+      {/* ---- QUIC: flowing multiplexed streams (cobalt) ---- */}
+      <g stroke="#1B3A8A" fill="none" strokeWidth="2.5" strokeLinecap="round">
+        {[0, 1, 2, 3].map((i) => {
+          const y = 250 + i * 30;
+          return (
+            <path
+              key={i}
+              d={`M 30 ${y} C 140 ${y - 40}, 240 ${y + 40}, 360 ${y - 20}`}
+              strokeDasharray="10 14"
+              className="animate-stream-dash"
+              style={{ animationDelay: `${i * 0.6}s`, opacity: 0.85 }}
+            />
+          );
+        })}
+      </g>
+
+      {/* ---- MCM: interconnected node mesh (vermillion) ---- */}
+      <g stroke="#D9342B" strokeWidth="1.5">
+        {edges.map(([a, b], i) => (
+          <line
+            key={i}
+            x1={nodes[a].x}
+            y1={nodes[a].y}
+            x2={nodes[b].x}
+            y2={nodes[b].y}
+            opacity="0.55"
+          />
+        ))}
+      </g>
+      <g fill="#D9342B">
+        {nodes.map((n, i) => (
+          <circle
+            key={i}
+            cx={n.x}
+            cy={n.y}
+            r={i % 2 === 0 ? 9 : 6}
+            className="animate-node-pulse"
+            style={{
+              animationDelay: `${i * 0.5}s`,
+              transformBox: "fill-box",
+              transformOrigin: "center",
+            }}
+          />
+        ))}
+      </g>
+
+      {/* Annotations — placed in the top corners (y=24), clear of the
+          MCM node mesh (y=60..240) and the QUIC stream curves (y≥250 with
+          control points reaching y+40=380). See LAYOUT_AUDIT #3 and
+          REVIEW §3 "P1 #3" — keeping them at y=24 (mirror corners) preserves
+          a symmetric layout that the original LAYOUT_AUDIT mirror decided on. */}
+      <text x="20" y="24" fill="#0A0A0A" fontSize="11" fontWeight="600" letterSpacing="2">
+        MCM · MESH
+      </text>
+      <text
+        x="360"
+        y="24"
+        textAnchor="end"
+        fill="#0A0A0A"
+        fontSize="11"
+        fontWeight="600"
+        letterSpacing="2"
+      >
+        QUIC · STREAMS
+      </text>
+    </svg>
+  );
+}

refer_landing_page/app/intro/page.tsx

@@ -0,0 +1,292 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+import Reveal from "@/components/Reveal";
+import Marquee from "@/components/Marquee";
+import Counter from "@/components/Counter";
+import SectionLabel from "@/components/SectionLabel";
+import HeroComposition from "./_components/HeroComposition";
+
+export const metadata: Metadata = {
+  title: "연구실 소개 (Intro)",
+  description:
+    "메타버스 상호운용성(MCM)과 QUIC 기반 멀티에이전트 오케스트레이션을 연구하는 경북대학교 사물인터넷 표준 연구실 소개.",
+};
+
+// CUSTOMIZATION HOOK: the two research thrusts (cover spread comparison).
+const thrusts = [
+  {
+    no: "Thrust 01",
+    tag: "MCM",
+    accent: "vermillion" as const,
+    ko: "메타버스 상호운용성",
+    en: "Metaverse Interoperability",
+    desc: "이종(異種) 메타버스 플랫폼 간 객체·아바타·자산의 상호운용을 위한 공통 데이터 모델과 변환 계층을 설계합니다. oneM2M / W3C 표준을 기반으로 서로 다른 가상 환경이 동일한 의미(semantics)로 데이터를 교환합니다.",
+    points: [
+      "공통 정보 모델(Common Information Model) 정의",
+      "의미 보존 변환(semantic-preserving mapping) 계층",
+      "상호운용성 테스트베드 및 적합성 검증",
+    ],
+  },
+  {
+    no: "Thrust 02",
+    tag: "QUIC",
+    accent: "cobalt" as const,
+    ko: "멀티에이전트 오케스트레이션",
+    en: "Multi-Agent Orchestration",
+    desc: "다수의 자율 에이전트가 저지연·다중스트림 환경에서 협력하도록 QUIC 전송 위에 오케스트레이션 아키텍처와 통신 인터페이스를 설계합니다. 연결 마이그레이션과 스트림 다중화로 메시지 라우팅을 최적화합니다.",
+    points: [
+      "QUIC 스트림 다중화 기반 에이전트 메시지 라우팅",
+      "오케스트레이터–에이전트 제어 인터페이스 설계",
+      "연결 마이그레이션 기반 모바일·엣지 지원",
+    ],
+  },
+];
+
+// CUSTOMIZATION HOOK: headline figures (animated counters).
+// `value: 2026` is marked static so it renders as a fixed year, not a
+// 0→2026 count-up. The year is also rendered at the smaller `display-sm`
+// scale (the other two figures use the full `display` scale), so the
+// 4-digit "2026" does not push the cell padding. See LAYOUT_AUDIT #11 + #13.
+const figures = [
+  { value: 2, label: "연구 축 · Research Thrusts", suffix: "", size: "display" as const, static: false },
+  { value: 4, label: "표준화 기구 · Standards Bodies", suffix: "", size: "display" as const, static: false },
+  { value: 2026, label: "Issue · 발행", suffix: "", size: "display-sm" as const, static: true },
+];
+
+// CUSTOMIZATION HOOK: research keyword ticker.
+const keywords = [
+  "INTEROPERABILITY",
+  "oneM2M",
+  "W3C WoT",
+  "QUIC TRANSPORT",
+  "MULTI-AGENT",
+  "STREAM MULTIPLEXING",
+  "CONNECTION MIGRATION",
+  "METAVERSE",
+  "SEMANTIC MAPPING",
+  "CONFORMANCE",
+];
+
+const focusAreas = [
+  { ko: "사물인터넷 표준화", en: "IoT Standardization" },
+  { ko: "메타버스 상호운용성", en: "Metaverse Interoperability" },
+  { ko: "전송 프로토콜(QUIC)", en: "Transport Protocols" },
+  { ko: "멀티에이전트 시스템", en: "Multi-Agent Systems" },
+];
+
+export default function IntroPage() {
+  return (
+    <>
+      {/* ============ COVER SPREAD ============ */}
+      <section className="relative overflow-hidden border-b border-ink">
+        <div className="container-content pb-10 pt-12 sm:pt-16">
+          <Reveal>
+            <SectionLabel index={1} label="The Cover" />
+          </Reveal>
+
+          <div className="mt-8 grid items-center gap-10 lg:grid-cols-12">
+            {/* Headline column */}
+            <div className="lg:col-span-7">
+              <Reveal delay={60}>
+                <p className="kicker">경북대학교 컴퓨터학부 · IoT Standards Lab</p>
+              </Reveal>
+              <Reveal delay={120}>
+                {/* Korean + English mixed, magazine-cover scale */}
+                <h1 className="headline-ko mt-4 text-[clamp(2.5rem,8vw,5.5rem)] leading-[0.98] text-ink">
+                  사물인터넷의
+                  <br />
+                  <span className="text-vermillion">표준</span>을 짓다
+                </h1>
+                <p className="display mt-3 leading-[0.9]" aria-hidden>
+                  Standards
+                  <span className="block italic text-cobalt">in&nbsp;Motion</span>
+                </p>
+              </Reveal>
+              <Reveal delay={200}>
+                <p className="mt-8 max-w-prose text-base leading-relaxed text-ink-soft">
+                  메타버스 상호운용성(MCM)과 QUIC 기반 멀티에이전트 오케스트레이션.
+                  국제 표준을 토대로 분산되고 이종적인 시스템이 동일한 의미로
+                  데이터를 교환하고 협력하도록 설계합니다.
+                </p>
+              </Reveal>
+              <Reveal delay={260}>
+                <div className="mt-8 flex flex-wrap gap-3">
+                  <Link
+                    href="/publications"
+                    className="bg-ink px-6 py-3 text-sm font-semibold uppercase tracking-[0.16em] text-ivory transition hover:bg-vermillion"
+                  >
+                    논문 보기 →
+                  </Link>
+                  <Link
+                    href="/members"
+                    className="border border-ink px-6 py-3 text-sm font-semibold uppercase tracking-[0.16em] text-ink transition hover:bg-ink hover:text-ivory"
+                  >
+                    구성원
+                  </Link>
+                </div>
+              </Reveal>
+            </div>
+
+            {/* Abstract illustration column */}
+            <Reveal variant="scale" delay={200} className="lg:col-span-5">
+              <HeroComposition className="w-full" />
+              <p className="mt-3 text-right text-xs italic text-ink-mute">
+                Fig. 01 — MCM 노드 메시 × QUIC 멀티스트림
+              </p>
+            </Reveal>
+          </div>
+        </div>
+
+        {/* Keyword marquee band */}
+        <Reveal>
+          <Marquee
+            items={keywords}
+            className="border-y border-ink bg-ink py-3 font-display text-xl tracking-wide text-ivory"
+          />
+        </Reveal>
+      </section>
+
+      {/* ============ FIGURES / COUNTERS ============ */}
+      <section className="border-b border-ink">
+        <div className="container-content grid gap-px bg-line sm:grid-cols-3">
+          {figures.map((f, i) => (
+            <Reveal key={f.label} delay={i * 100} className="bg-ivory">
+              <div className="px-6 py-10">
+                <Counter
+                  value={f.value}
+                  suffix={f.suffix}
+                  static={f.static}
+                  className={`${f.size} block text-ink`}
+                />
+                <p className="kicker mt-3">{f.label}</p>
+              </div>
+            </Reveal>
+          ))}
+        </div>
+      </section>
+
+      {/* ============ MISSION / PULL QUOTE ============ */}
+      <section className="border-b border-ink">
+        <div className="container-content py-16 sm:py-24">
+          <Reveal>
+            <SectionLabel index={2} label="Mission" />
+          </Reveal>
+          <Reveal delay={100}>
+            <blockquote className="pull-quote mt-10 max-w-4xl text-ink">
+              “표준 적합성과 실증을 함께 추구하여, 연구가{" "}
+              <span className="text-vermillion">실제 표준 문서</span>와{" "}
+              <span className="text-cobalt">오픈소스 구현</span>으로 이어지게 한다.”
+            </blockquote>
+          </Reveal>
+          <Reveal delay={160}>
+            <p className="mt-6 max-w-prose text-sm leading-relaxed text-ink-mute">
+              {/* CUSTOMIZATION HOOK: marginalia / footnote */}
+              † 본 연구실은 사물인터넷 국제 표준을 토대로, 분산·이종 시스템이
+              동일한 의미로 데이터를 교환하고 협력할 수 있는 상호운용 기술을 연구합니다.
+            </p>
+          </Reveal>
+        </div>
+      </section>
+
+      {/* ============ TWO THRUSTS — SIDE BY SIDE WITH CONNECTING LINE ============ */}
+      <section className="border-b border-ink">
+        <div className="container-content py-16 sm:py-24">
+          <Reveal>
+            <SectionLabel index={3} label="Two Research Thrusts" />
+          </Reveal>
+
+          <div className="relative mt-12 grid gap-px lg:grid-cols-2">
+            {/* Connecting line + node between the two thrusts (desktop) */}
+            <div
+              aria-hidden
+              className="absolute left-1/2 top-1/2 hidden -translate-x-1/2 -translate-y-1/2 lg:block"
+            >
+              <div className="flex items-center">
+                <span className="h-2 w-2 rounded-full bg-vermillion" />
+                <span className="h-px w-16 bg-ink" />
+                <span className="flex h-9 w-9 items-center justify-center rounded-full border border-ink bg-ivory font-display text-xs">
+                  ×
+                </span>
+                <span className="h-px w-16 bg-ink" />
+                <span className="h-2 w-2 rounded-full bg-cobalt" />
+              </div>
+            </div>
+
+            {thrusts.map((t, i) => {
+              const isVerm = t.accent === "vermillion";
+              return (
+                <Reveal
+                  key={t.tag}
+                  variant={i === 0 ? "left" : "right"}
+                  delay={i * 120}
+                >
+                  <article
+                    className={`group h-full border border-ink p-8 transition-colors duration-500 sm:p-10 ${
+                      isVerm
+                        ? "hover:bg-vermillion hover:text-ivory"
+                        : "hover:bg-cobalt hover:text-ivory"
+                    }`}
+                  >
+                    <div className="flex items-baseline justify-between">
+                      <span className="kicker group-hover:text-ivory/70">{t.no}</span>
+                      <span
+                        className={`font-display text-5xl ${
+                          isVerm ? "text-vermillion" : "text-cobalt"
+                        } group-hover:text-ivory`}
+                      >
+                        {t.tag}
+                      </span>
+                    </div>
+                    <h3 className="headline-ko mt-6 text-3xl leading-tight">
+                      {t.ko}
+                    </h3>
+                    <p className="font-display mt-1 text-lg italic opacity-70">
+                      {t.en}
+                    </p>
+                    <p className="mt-5 text-sm leading-relaxed opacity-90">
+                      {t.desc}
+                    </p>
+                    <ul className="mt-6 space-y-3 text-sm">
+                      {t.points.map((p) => (
+                        <li key={p} className="flex gap-3 border-t border-ink/20 pt-3 group-hover:border-ivory/20">
+                          <span className="font-display text-xs opacity-60">→</span>
+                          <span>{p}</span>
+                        </li>
+                      ))}
+                    </ul>
+                  </article>
+                </Reveal>
+              );
+            })}
+          </div>
+        </div>
+      </section>
+
+      {/* ============ FOCUS AREAS ============ */}
+      <section>
+        <div className="container-content py-16 sm:py-24">
+          <Reveal>
+            <SectionLabel index={4} label="Focus Areas" />
+          </Reveal>
+          <div className="mt-10 grid gap-px bg-line sm:grid-cols-2 lg:grid-cols-4">
+            {focusAreas.map((f, i) => (
+              <Reveal key={f.en} delay={i * 80} className="bg-ivory">
+                <div className="group flex h-full flex-col justify-between gap-8 p-7 transition-colors duration-500 hover:bg-ink hover:text-ivory">
+                  <span className="font-display text-2xl text-ink-mute group-hover:text-vermillion">
+                    {String(i + 1).padStart(2, "0")}
+                  </span>
+                  <div>
+                    <p className="headline-ko text-lg">{f.ko}</p>
+                    <p className="mt-1 text-xs uppercase tracking-[0.16em] text-ink-mute group-hover:text-ivory/60">
+                      {f.en}
+                    </p>
+                  </div>
+                </div>
+              </Reveal>
+            ))}
+          </div>
+        </div>
+      </section>
+    </>
+  );
+}

refer_landing_page/app/layout.tsx

@@ -0,0 +1,68 @@
+import type { Metadata } from "next";
+import { Fraunces, Noto_Serif_KR, Inter } from "next/font/google";
+import "./globals.css";
+import Header from "@/components/Header";
+import Footer from "@/components/Footer";
+
+/**
+ * CUSTOMIZATION HOOK — FONTS
+ * The editorial system pairs an English display serif (Fraunces) and a
+ * Korean serif (Noto Serif KR) for headlines, with a clean sans for body.
+ * Pretendard is preferred for body but is not served by Google Fonts, so
+ * Inter is loaded as the web fallback (see tailwind.config.ts sans stack).
+ */
+const fraunces = Fraunces({
+  subsets: ["latin"],
+  weight: ["300", "400", "500", "600"],
+  style: ["normal", "italic"],
+  variable: "--font-display",
+  display: "swap",
+});
+
+const notoSerifKr = Noto_Serif_KR({
+  subsets: ["latin"],
+  weight: ["400", "600", "700"],
+  variable: "--font-serif-ko",
+  display: "swap",
+});
+
+const inter = Inter({
+  subsets: ["latin"],
+  variable: "--font-sans",
+  display: "swap",
+});
+
+export const metadata: Metadata = {
+  title: {
+    default: "사물인터넷 표준 연구실 (IoT Standards Lab) · 경북대학교",
+    template: "%s · 사물인터넷 표준 연구실",
+  },
+  description:
+    "경북대학교 컴퓨터학부 사물인터넷 표준 연구실. 메타버스 상호운용성(MCM) 및 QUIC 기반 멀티에이전트 오케스트레이션 연구.",
+};
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html
+      lang="ko"
+      className={`${fraunces.variable} ${notoSerifKr.variable} ${inter.variable}`}
+    >
+      <head>
+        {/* No-JS fallback for the .reveal scroll-reveal: without this, every
+            page is blank if hydration fails (e.g. Google Fonts request blocked). */}
+        <noscript>
+          <style>{`.reveal { opacity: 1 !important; transform: none !important; }`}</style>
+        </noscript>
+      </head>
+      <body className="flex min-h-screen flex-col">
+        <Header />
+        <main className="flex-1">{children}</main>
+        <Footer />
+      </body>
+    </html>
+  );
+}

refer_landing_page/app/lectures/page.tsx

@@ -0,0 +1,102 @@
+import type { Metadata } from "next";
+import PageHeader from "@/components/PageHeader";
+import Reveal from "@/components/Reveal";
+import SectionLabel from "@/components/SectionLabel";
+
+export const metadata: Metadata = {
+  title: "강의 (Lectures)",
+  description: "사물인터넷 표준 연구실 지도교수가 담당하는 강의 목록 (placeholder).",
+};
+
+// CUSTOMIZATION HOOK: replace placeholder lectures below.
+const lectures = [
+  {
+    code: "CSE3xx",
+    ko: "사물인터넷 개론",
+    en: "Introduction to IoT",
+    level: "학부 · Undergraduate",
+    accent: "vermillion" as const,
+    desc: "IoT 아키텍처, 센서·액추에이터, 통신 프로토콜(MQTT/CoAP)과 oneM2M 표준의 기본 개념을 다룹니다. 간단한 디바이스–서버 연동 실습을 포함합니다.",
+  },
+  {
+    code: "CSE4xx",
+    ko: "네트워크 프로토콜과 전송 기술",
+    en: "Network Protocols & Transport",
+    level: "학부/대학원 · Undergraduate / Graduate",
+    accent: "cobalt" as const,
+    desc: "TCP/UDP에서 QUIC까지 전송 계층의 발전과 설계 원리를 학습합니다. 스트림 다중화, 연결 마이그레이션, 혼잡 제어를 실험을 통해 분석합니다.",
+  },
+  {
+    code: "CSE6xx",
+    ko: "메타버스 상호운용성과 표준",
+    en: "Metaverse Interoperability & Standards",
+    level: "대학원 · Graduate",
+    accent: "ink" as const,
+    desc: "이종 메타버스 플랫폼 간 데이터 모델, 의미 보존 변환, W3C/oneM2M 표준을 다루는 세미나형 대학원 강의입니다. 최신 논문 리뷰와 프로젝트를 병행합니다.",
+  },
+];
+
+const accent: Record<string, { hover: string; text: string }> = {
+  vermillion: { hover: "hover:bg-vermillion hover:text-ivory", text: "text-vermillion" },
+  cobalt: { hover: "hover:bg-cobalt hover:text-ivory", text: "text-cobalt" },
+  ink: { hover: "hover:bg-ink hover:text-ivory", text: "text-ink" },
+};
+
+export default function LecturesPage() {
+  return (
+    <>
+      <PageHeader
+        ko="강의"
+        en="Lectures"
+        index={4}
+        description="연구실에서 담당하는 학부·대학원 강의입니다. 아래 강의 정보는 예시(placeholder)이며 실제 개설 과목으로 교체할 수 있습니다."
+      />
+
+      <section>
+        <div className="container-content py-16 sm:py-24">
+          <Reveal>
+            <SectionLabel index={1} label="Courses" />
+          </Reveal>
+
+          <div className="mt-12 grid gap-px bg-line lg:grid-cols-3">
+            {lectures.map((l, i) => {
+              const a = accent[l.accent];
+              return (
+                <Reveal
+                  key={l.code}
+                  variant={i === 0 ? "left" : i === 2 ? "right" : "up"}
+                  delay={i * 100}
+                  className="bg-ivory"
+                >
+                  <article
+                    className={`group flex h-full flex-col border border-ink p-8 transition-colors duration-500 sm:p-10 ${a.hover}`}
+                  >
+                    <div className="flex items-baseline justify-between">
+                      <span className={`font-display text-xl ${a.text} group-hover:text-ivory`}>
+                        {l.code}
+                      </span>
+                      <span className="font-display text-4xl text-ink-mute group-hover:text-ivory/70">
+                        {String(i + 1).padStart(2, "0")}
+                      </span>
+                    </div>
+
+                    <h3 className="headline-ko mt-6 text-2xl leading-tight">{l.ko}</h3>
+                    <p className="font-display mt-1 text-lg italic opacity-70">{l.en}</p>
+
+                    <p className={`mt-4 inline-flex w-fit border border-ink/30 px-3 py-1 text-xs font-semibold uppercase tracking-[0.16em] group-hover:border-ivory/40`}>
+                      {l.level}
+                    </p>
+
+                    <p className="mt-6 border-t border-ink/20 pt-6 text-sm leading-relaxed opacity-90 group-hover:border-ivory/20">
+                      {l.desc}
+                    </p>
+                  </article>
+                </Reveal>
+              );
+            })}
+          </div>
+        </div>
+      </section>
+    </>
+  );
+}

refer_landing_page/app/members/page.tsx

@@ -0,0 +1,174 @@
+import type { Metadata } from "next";
+import PageHeader from "@/components/PageHeader";
+import Reveal from "@/components/Reveal";
+import SectionLabel from "@/components/SectionLabel";
+import Counter from "@/components/Counter";
+
+export const metadata: Metadata = {
+  title: "구성원 (Members)",
+  description: "사물인터넷 표준 연구실 지도교수 및 대학원·학부 연구원 소개 (placeholder).",
+};
+
+// CUSTOMIZATION HOOK: replace placeholder member data below.
+const advisor = {
+  ko: "홍길동 교수",
+  en: "Prof. Gildong Hong",
+  role: "지도교수 · Principal Investigator",
+  desc: "사물인터넷 표준, 메타버스 상호운용성, 전송 프로토콜. (이메일 placeholder: pi@example.knu.ac.kr)",
+  fields: ["IoT Standardization", "Metaverse Interoperability", "QUIC Transport"],
+};
+
+const groups = [
+  {
+    ko: "박사과정 연구원",
+    en: "Ph.D. Students",
+    accent: "vermillion" as const,
+    members: [
+      { name: "연구원 A (placeholder)", topic: "QUIC 기반 멀티에이전트 오케스트레이션" },
+      { name: "연구원 B (placeholder)", topic: "메타버스 공통 정보 모델 (MCM)" },
+    ],
+  },
+  {
+    ko: "석사과정 연구원",
+    en: "M.S. Students",
+    accent: "cobalt" as const,
+    members: [
+      { name: "연구원 C (placeholder)", topic: "oneM2M 적합성 검증" },
+      { name: "연구원 D (placeholder)", topic: "QUIC 스트림 다중화 성능 분석" },
+      { name: "연구원 E (placeholder)", topic: "W3C WoT Thing Description 매핑" },
+    ],
+  },
+  {
+    ko: "학부 연구원",
+    en: "Undergraduate Researchers",
+    accent: "ink" as const,
+    members: [
+      { name: "연구원 F (placeholder)", topic: "테스트베드 개발" },
+      { name: "연구원 G (placeholder)", topic: "데이터 시각화" },
+    ],
+  },
+];
+
+// CUSTOMIZATION HOOK: headcount figures (animated counters).
+const figures = [
+  { value: 1, label: "지도교수 · Principal Investigator" },
+  { value: 5, label: "대학원 연구원 · Graduate Members" },
+  { value: 2, label: "학부 연구원 · Undergraduates" },
+];
+
+const accentText: Record<string, string> = {
+  vermillion: "text-vermillion",
+  cobalt: "text-cobalt",
+  ink: "text-ink",
+};
+
+export default function MembersPage() {
+  return (
+    <>
+      <PageHeader
+        ko="구성원"
+        en="Members"
+        index={2}
+        description="연구실 지도교수와 박사·석사·학부 연구원을 소개합니다. 아래 정보는 예시(placeholder)이며 실제 구성원 정보로 교체할 수 있습니다."
+      />
+
+      {/* ============ HEADCOUNT FIGURES ============ */}
+      <section className="border-b border-ink">
+        <div className="container-content grid gap-px bg-line sm:grid-cols-3">
+          {figures.map((f, i) => (
+            <Reveal key={f.label} delay={i * 100} className="bg-ivory">
+              <div className="px-6 py-10">
+                <Counter value={f.value} className="display block text-ink" />
+                <p className="kicker mt-3">{f.label}</p>
+              </div>
+            </Reveal>
+          ))}
+        </div>
+      </section>
+
+      {/* ============ PRINCIPAL INVESTIGATOR ============ */}
+      <section className="border-b border-ink">
+        <div className="container-content py-16 sm:py-24">
+          <Reveal>
+            <SectionLabel index={1} label="Principal Investigator" />
+          </Reveal>
+
+          <div className="mt-10 grid gap-px lg:grid-cols-12">
+            <Reveal variant="left" className="lg:col-span-7">
+              <article className="group h-full border border-ink p-8 transition-colors duration-500 hover:bg-ink hover:text-ivory sm:p-10">
+                <span className="kicker group-hover:text-ivory/70">{advisor.role}</span>
+                <h2 className="headline-ko mt-5 text-4xl leading-tight">{advisor.ko}</h2>
+                <p className="font-display mt-1 text-2xl italic text-vermillion">
+                  {advisor.en}
+                </p>
+                <p className="mt-6 max-w-prose text-sm leading-relaxed opacity-90">
+                  {advisor.desc}
+                </p>
+              </article>
+            </Reveal>
+
+            <Reveal variant="right" delay={120} className="lg:col-span-5">
+              <div className="flex h-full flex-col gap-px bg-line">
+                {advisor.fields.map((field, i) => (
+                  <div
+                    key={field}
+                    className="group flex items-center gap-5 bg-ivory px-7 py-6 transition-colors duration-500 hover:bg-paper"
+                  >
+                    <span className="font-display text-3xl text-ink-mute group-hover:text-vermillion">
+                      {String(i + 1).padStart(2, "0")}
+                    </span>
+                    <span className="text-sm uppercase tracking-[0.16em] text-ink-soft">
+                      {field}
+                    </span>
+                  </div>
+                ))}
+              </div>
+            </Reveal>
+          </div>
+        </div>
+      </section>
+
+      {/* ============ RESEARCH GROUPS ============ */}
+      <section>
+        <div className="container-content py-16 sm:py-24">
+          <Reveal>
+            <SectionLabel index={2} label="Researchers" />
+          </Reveal>
+
+          {groups.map((g, gi) => (
+            <div key={g.en} className="mt-14 first:mt-12">
+              <Reveal>
+                <div className="flex items-baseline justify-between border-b border-ink pb-4">
+                  <h3 className="headline-ko text-2xl text-ink sm:text-3xl">{g.ko}</h3>
+                  <span
+                    className={`font-display text-lg italic ${accentText[g.accent]}`}
+                  >
+                    {g.en}
+                  </span>
+                </div>
+              </Reveal>
+
+              <div className="mt-px grid gap-px bg-line sm:grid-cols-2">
+                {g.members.map((m, mi) => (
+                  <Reveal key={m.name} delay={mi * 80} className="bg-ivory">
+                    <article className="group flex h-full flex-col justify-between gap-8 p-7 transition-colors duration-500 hover:bg-ink hover:text-ivory">
+                      <span className="font-display text-2xl text-ink-mute group-hover:text-vermillion">
+                        {String(gi + 1).padStart(2, "0")}.{String(mi + 1).padStart(2, "0")}
+                      </span>
+                      <div>
+                        <h4 className="headline-ko text-lg">{m.name}</h4>
+                        <p className="mt-2 text-xs leading-relaxed text-ink-mute group-hover:text-ivory/60">
+                          {m.topic}
+                        </p>
+                      </div>
+                    </article>
+                  </Reveal>
+                ))}
+              </div>
+            </div>
+          ))}
+        </div>
+      </section>
+    </>
+  );
+}

refer_landing_page/app/publications/page.tsx

@@ -0,0 +1,173 @@
+import type { Metadata } from "next";
+import PageHeader from "@/components/PageHeader";
+import Reveal from "@/components/Reveal";
+import SectionLabel from "@/components/SectionLabel";
+import Counter from "@/components/Counter";
+import Marquee from "@/components/Marquee";
+
+export const metadata: Metadata = {
+  title: "논문 (Publications)",
+  description: "사물인터넷 표준 연구실의 대표 논문 목록 (placeholder).",
+};
+
+// CUSTOMIZATION HOOK: replace placeholder publications below.
+const publications = [
+  {
+    year: "2025",
+    type: "Journal",
+    title:
+      "메타버스 상호운용을 위한 공통 정보 모델 설계 및 oneM2M 매핑 (Design of a Common Information Model for Metaverse Interoperability over oneM2M)",
+    authors: "Hong G., Researcher A., et al.",
+    venue: "한국통신학회논문지 (J-KICS), Vol. 50, No. 3",
+  },
+  {
+    year: "2025",
+    type: "Conference",
+    title:
+      "QUIC-based Orchestration Architecture for Low-Latency Multi-Agent Communication",
+    authors: "Researcher B., Hong G.",
+    venue: "IEEE International Conference on Communications (ICC)",
+  },
+  {
+    year: "2024",
+    type: "Journal",
+    title:
+      "W3C WoT Thing Description를 활용한 이종 메타버스 자산의 의미 보존 변환 (Semantic-Preserving Mapping of Cross-Platform Metaverse Assets Using W3C WoT)",
+    authors: "Researcher C., Hong G., et al.",
+    venue: "정보과학회논문지 (KIISE Transactions), Vol. 51, No. 11",
+  },
+  {
+    year: "2024",
+    type: "Conference",
+    title:
+      "Stream Multiplexing Strategies for Agent Message Routing over QUIC",
+    authors: "Researcher D., Researcher B., Hong G.",
+    venue: "ACM/IEEE Symposium on Edge Computing (SEC)",
+  },
+  {
+    year: "2023",
+    type: "Conference",
+    title:
+      "oneM2M 기반 IoT 디바이스 상호운용성 적합성 검증 프레임워크 (A Conformance Testing Framework for oneM2M-based IoT Interoperability)",
+    authors: "Researcher E., Hong G.",
+    venue: "한국정보과학회 학술발표회 (KSC)",
+  },
+];
+
+// CUSTOMIZATION HOOK: venue ticker.
+const venueTicker = [
+  "J-KICS",
+  "IEEE ICC",
+  "KIISE TRANSACTIONS",
+  "ACM/IEEE SEC",
+  "KSC",
+  "oneM2M",
+  "W3C WoT",
+  "IETF QUIC",
+];
+
+// Accent per publication type, drawn from the editorial palette.
+const typeAccent: Record<string, { text: string; rule: string }> = {
+  Journal: { text: "text-vermillion", rule: "bg-vermillion" },
+  Conference: { text: "text-cobalt", rule: "bg-cobalt" },
+};
+
+// Derived figures.
+const journalCount = publications.filter((p) => p.type === "Journal").length;
+const confCount = publications.filter((p) => p.type === "Conference").length;
+const figures = [
+  { value: publications.length, label: "전체 논문 · Total Publications" },
+  { value: journalCount, label: "저널 · Journal" },
+  { value: confCount, label: "학회 · Conference" },
+];
+
+export default function PublicationsPage() {
+  return (
+    <>
+      <PageHeader
+        ko="논문"
+        en="Publications"
+        index={3}
+        description="메타버스 상호운용성(MCM)과 QUIC 기반 멀티에이전트 통신 분야의 대표 논문입니다. 아래 목록은 예시(placeholder)입니다."
+      />
+
+      {/* Venue marquee band */}
+      <Reveal>
+        <Marquee
+          items={venueTicker}
+          reverse
+          className="border-b border-ink bg-ink py-3 font-display text-xl tracking-wide text-ivory"
+        />
+      </Reveal>
+
+      {/* ============ FIGURES ============ */}
+      <section className="border-b border-ink">
+        <div className="container-content grid gap-px bg-line sm:grid-cols-3">
+          {figures.map((f, i) => (
+            <Reveal key={f.label} delay={i * 100} className="bg-ivory">
+              <div className="px-6 py-10">
+                <Counter value={f.value} className="display block text-ink" />
+                <p className="kicker mt-3">{f.label}</p>
+              </div>
+            </Reveal>
+          ))}
+        </div>
+      </section>
+
+      {/* ============ PUBLICATION LIST ============ */}
+      <section>
+        <div className="container-content py-16 sm:py-24">
+          <Reveal>
+            <SectionLabel index={1} label="Selected Works" />
+          </Reveal>
+
+          <ol className="mt-12 border-t border-ink">
+            {publications.map((p, i) => {
+              const accent = typeAccent[p.type] ?? {
+                text: "text-ink",
+                rule: "bg-ink",
+              };
+              // Reveal `as="li"` keeps the <ol> direct-child contract (HTML spec:
+              // <ol> may only contain <li>/<script>/<template>). See REVIEW.md §3 #1.
+              return (
+                <Reveal
+                  as="li"
+                  key={p.title}
+                  delay={(i % 3) * 80}
+                  className="group grid gap-6 border-b border-ink py-8 transition-colors duration-500 hover:bg-paper sm:grid-cols-12 sm:py-10"
+                >
+                  {/* Index + year rail */}
+                  <div className="flex items-baseline gap-4 sm:col-span-3 sm:flex-col sm:gap-3">
+                    <span className="font-display text-5xl leading-none text-ink-mute">
+                      {String(i + 1).padStart(2, "0")}
+                    </span>
+                    <span className="font-display text-2xl italic text-ink">
+                      {p.year}
+                    </span>
+                    <span
+                      className={`inline-flex items-center gap-2 text-xs font-semibold uppercase tracking-[0.16em] ${accent.text}`}
+                    >
+                      <span className={`h-1.5 w-1.5 rounded-full ${accent.rule}`} />
+                      {p.type}
+                    </span>
+                  </div>
+
+                  {/* Title + meta */}
+                  <div className="sm:col-span-9">
+                    <h3 className="headline-ko text-xl leading-snug text-ink sm:text-2xl">
+                      {p.title}
+                    </h3>
+                    <p className="mt-3 text-sm text-ink-soft">{p.authors}</p>
+                    <p className="font-display text-sm italic text-ink-mute">
+                      {p.venue}
+                    </p>
+                  </div>
+                </Reveal>
+              );
+            })}
+          </ol>
+        </div>
+      </section>
+    </>
+  );
+}