[hidden]{display:none!important}
:root{
  --bg:#0a0a0b;
  --fg:#f2f0ea;
  --mute:#8f8d86;
  --line:rgba(255,255,255,.08);
  --card:rgba(255,255,255,.035);
  --card-hi:rgba(255,255,255,.07);
  --accent:#c9c7c0;
  --w:520px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);color:var(--fg);-webkit-text-size-adjust:100%}
body{font-family:"Pretendard Variable",Pretendard,-apple-system,system-ui,sans-serif;font-feature-settings:"ss01";line-height:1.45;-webkit-font-smoothing:antialiased}
.mono{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
img{display:block}

.page{max-width:var(--w);margin:0 auto;padding:0 0 max(40px,env(safe-area-inset-bottom))}

/* ── 히어로 ─────────────────────────── */
.hero{position:relative;overflow:hidden;aspect-ratio:4/5}
/* 사진 아래를 불투명 판으로 덮지 않고 투명하게 녹인다. 그래야 뒤의 빛이 사진 안까지 올라와 버튼과 한 장면이 된다 */
.hero .photo{width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:grayscale(1) contrast(1.05);
  -webkit-mask-image:linear-gradient(180deg,#000 45%,rgba(0,0,0,.55) 72%,transparent 100%);mask-image:linear-gradient(180deg,#000 45%,rgba(0,0,0,.55) 72%,transparent 100%);transform:scale(1.06);transition:transform 1.6s cubic-bezier(.2,.7,.2,1),opacity .8s ease;opacity:0}
.hero.in .photo{transform:scale(1);opacity:1}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,11,0) 40%,rgba(10,10,11,.45) 70%,rgba(10,10,11,0) 100%)}
.hero-text{position:absolute;left:0;right:0;bottom:0;padding:0 24px 22px;z-index:1}
.hero-text>*{opacity:0;transform:translateY(10px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.hero.in .hero-text>*{opacity:1;transform:none}
.hero.in .hero-text>:nth-child(1){transition-delay:.35s}
.hero.in .hero-text>:nth-child(2){transition-delay:.45s}
.hero.in .hero-text>:nth-child(3){transition-delay:.55s}
.hero.in .hero-text>:nth-child(4){transition-delay:.65s}
.eyebrow{font-size:11px;color:var(--mute);margin-bottom:10px}
h1{font-size:44px;font-weight:700;letter-spacing:-.03em;line-height:1;margin-bottom:12px}
h1 .en{font-size:13px;font-weight:500;letter-spacing:.14em;color:var(--mute);vertical-align:baseline;margin-left:4px;position:relative;top:2px}
.bio{font-size:16px;font-weight:500;color:var(--fg);letter-spacing:-.01em}
.role{font-size:11px;color:var(--accent);margin-top:6px}

/* ── 링크 ─────────────────────────── */
.group{padding:22px 16px 0}
.label{font-size:11px;font-weight:400;color:var(--mute);padding:0 8px 10px}
/* 뒤에서 비칠 빛. 유리는 비칠 게 있어야 유리로 보인다 */
.ambient{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;
  /* 바탕 그라데이션: 위는 검정, 가운데로 갈수록 은은한 회색, 비스듬한 은빛 띠 하나 */
  background:
    linear-gradient(115deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.045) 48%,rgba(255,255,255,0) 66%),
    linear-gradient(180deg,#0a0a0b 0%,#141416 45%,#1b1b1e 70%,#0e0e10 100%)}
.ambient i{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;will-change:transform}
.ambient .b1{width:62vmax;height:62vmax;left:-24vmax;top:22vh;background:radial-gradient(circle,rgba(255,255,255,.26) 0,rgba(255,255,255,0) 68%);animation:drift1 22s ease-in-out infinite alternate}
.ambient .b2{width:52vmax;height:52vmax;right:-22vmax;top:62vh;background:radial-gradient(circle,rgba(255,255,255,.2) 0,rgba(255,255,255,0) 66%);opacity:.9;animation:drift2 26s ease-in-out infinite alternate}
.ambient .b3{width:44vmax;height:44vmax;left:10vw;top:92vh;background:radial-gradient(circle,rgba(255,255,255,.18) 0,rgba(255,255,255,0) 66%);opacity:.9;animation:drift3 30s ease-in-out infinite alternate}
@keyframes drift1{to{transform:translate(18vw,-14vh) scale(1.1)}}
@keyframes drift2{to{transform:translate(-20vw,-22vh) scale(.92)}}
@keyframes drift3{to{transform:translate(16vw,-40vh) scale(1.15)}}
.page{position:relative;z-index:1}

/* 리퀴드 글라스 버튼: ::before = 유리 몸통(흐림), ::after = 빛 받는 테두리 */
.link{position:relative;display:flex;align-items:center;gap:14px;padding:12px;border-radius:20px;margin-bottom:10px;isolation:isolate;
  transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.link::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;
  background:
    radial-gradient(120% 90% at var(--mx,20%) var(--my,0%),rgba(255,255,255,.16),rgba(255,255,255,0) 55%),
    linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.025) 60%,rgba(255,255,255,.06));
  -webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(255,255,255,.06),inset 0 0 0 1px rgba(255,255,255,.05),0 12px 32px -12px rgba(0,0,0,.6);
  opacity:0;transition:opacity .45s ease}
.link::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(145deg,rgba(255,255,255,.55),rgba(255,255,255,.08) 35%,rgba(255,255,255,.02) 60%,rgba(255,255,255,.22));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .45s ease}
.link>.thumb,.link>.txt,.link>.arr{opacity:0;transform:translateY(4px);transition:opacity .45s ease,transform .45s cubic-bezier(.2,.7,.2,1)}
.link.in::before,.link.in::after{opacity:1}
.link.in>.thumb,.link.in>.txt,.link.in>.arr{opacity:1;transform:none}
.link.in>.txt{transition-delay:.05s}
.link.in>.arr{transition-delay:.1s}
.link:hover{transform:translateY(-1px)}
.link:active{transform:scale(.98)}
.thumb{box-shadow:0 0 0 1px rgba(255,255,255,.08)}

/* 와이어프레임: 카드가 뜨기 직전 잠깐 그려졌다 사라진다 */
.wire{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:2;
  fill:none;stroke:rgba(255,255,255,.6);stroke-width:1;transition:opacity .45s ease}
.wire *{vector-effect:non-scaling-stroke}
.wire .d{stroke-dasharray:1;stroke-dashoffset:1;animation:draw .55s cubic-bezier(.4,0,.2,1) forwards}
.wire.out{opacity:0}
@keyframes draw{to{stroke-dashoffset:0}}
.thumb{flex:0 0 56px;width:56px;height:56px;border-radius:12px;overflow:hidden;background:#1a1a1d;display:grid;place-items:center}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb.tile{background:#fdfdfd}
.thumb.tile img{width:100%;height:100%;object-fit:cover}
.thumb.paper{background:#f2efe8}
.thumb.paper img{width:30px;height:42px;object-fit:contain}
.thumb.ig{background:#161618}
.thumb.ig svg{width:26px;height:26px;fill:none;stroke:#fff;stroke-width:1.9}
.thumb.ig .pt{fill:#fff;stroke:none}
.txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.name{font-size:16px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sub{font-size:13px;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.arr{flex:0 0 28px;width:28px;height:28px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--mute);transition:color .2s,border-color .2s,transform .25s}
.arr svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.link:hover .arr{color:var(--fg);border-color:rgba(255,255,255,.25);transform:translate(1px,-1px)}

.foot{font-size:10px;color:var(--mute);text-align:center;padding:36px 16px 0;opacity:.7}

/* ── PC: 가운데 기둥, 히어로 모서리 둥글게 ── */
@media (min-width:640px){
  .page{padding-top:40px}
  .hero{border-radius:24px;aspect-ratio:1/1}
  h1{font-size:52px}
}
@media (prefers-reduced-motion:reduce){
  .hero .photo,.hero-text>*,.link>*{transition:none;opacity:1;transform:none}
  .link::before,.link::after{transition:none;opacity:1}
  .ambient i{animation:none}
}

/* ── 통계(관리자) ─────────────────────────── */
#gate{cursor:default;-webkit-tap-highlight-color:transparent}
.admin{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:grid;place-items:center;padding:20px;overflow-y:auto}
.admin-card{position:relative;width:100%;max-width:440px;max-height:88vh;overflow-y:auto;background:#111113;border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:22px;box-shadow:0 24px 60px -20px rgba(0,0,0,.8)}
.admin-x{position:absolute;top:12px;right:14px;background:none;border:0;color:var(--mute);font-size:16px;cursor:pointer;padding:6px}
.admin-h{font-size:15px;font-weight:600;margin-bottom:14px}
#admin-pw{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:#0a0a0b;color:var(--fg);font-size:15px;outline:none}
#admin-pw:focus{border-color:rgba(255,255,255,.32)}
#admin-go{width:100%;margin-top:10px;padding:12px;border-radius:12px;border:0;background:var(--fg);color:#0a0a0b;font-size:14px;font-weight:600;cursor:pointer}
.admin-msg{min-height:16px;margin-top:10px;font-size:12px;color:#e0736b;text-align:center}
.st-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:6px}
.st-kpi>div{background:#0a0a0b;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:12px 6px;text-align:center}
.st-kpi b{display:block;font-size:22px;font-weight:700;letter-spacing:-.02em}
.st-kpi span{font-size:10px;color:var(--mute)}
#admin-body h4{font-size:11px;font-weight:600;color:var(--mute);margin:18px 0 6px;display:flex;gap:8px;align-items:baseline;letter-spacing:.02em;text-transform:uppercase}
#admin-body h4 em{font-style:normal;font-size:10px;color:#5a5852;text-transform:none;letter-spacing:0}
.st-row{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;border-radius:10px;background:#0a0a0b;margin-bottom:5px;font-size:14px}
.st-row b{font-weight:600;font-size:13px}
.st-row.muted{color:var(--mute);font-size:12px;justify-content:flex-start}
.st-log{display:flex;flex-direction:column;gap:4px}
.st-line{display:grid;grid-template-columns:auto auto 1fr auto;gap:8px;font-size:11.5px;color:#c9c7c0;padding:7px 10px;background:#0a0a0b;border-radius:9px}
.st-line span:nth-child(1){color:var(--mute)}
.st-line span:nth-child(3){color:var(--fg);text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st-line span:nth-child(4){text-align:right;color:var(--mute)}