@font-face{
  font-family:Pretendard;
  src:url("../../fonts/PretendardVariable.woff2") format("woff2-variations");
  font-weight:100 900;
  font-display:swap;
}
:root{
  --pit:#0e1117;
  --pit-2:#12161c;
  --paper:#1a2029;
  --seam:#2b3441;
  --chalk:#eae3d6;
  --chalk-2:#c4bcac;
  --dust:#8b8577;
  --kyris:#89e7c0;
  --minas:#b9deef;
  --exia:#f1e3b9;
  --body:Pretendard,"IBM Plex Sans KR",sans-serif;
  --display:"Gowun Batang",serif;
  --data:"IBM Plex Mono",monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--chalk);
  background:
    linear-gradient(90deg,transparent 0 47px,rgba(137,231,192,.05) 48px,transparent 49px),
    repeating-linear-gradient(0deg,transparent 0 35px,rgba(185,222,239,.025) 36px),
    var(--pit);
  font-family:var(--body);
  word-break:keep-all;
}
em,i,cite{font-style:normal}
button,a{font:inherit}
.wrap{width:min(1160px,calc(100% - 40px));margin-inline:auto}
.nav{position:sticky;top:0;z-index:10;border-bottom:1px solid var(--seam);background:rgba(14,17,23,.94);backdrop-filter:blur(14px)}
.nav .wrap{height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;color:var(--chalk);text-decoration:none;font-weight:600}
.brand img{width:34px;height:34px;object-fit:contain}
.brand small{color:var(--dust);font:500 9px/1 var(--data);letter-spacing:.18em}
.nav nav{display:flex;align-items:center;gap:24px}
.nav nav a{color:var(--chalk-2);text-decoration:none;font-size:14px;white-space:nowrap}
.nav nav a[aria-current="page"]{color:var(--minas)}
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--seam);background:linear-gradient(120deg,rgba(137,231,192,.035),transparent 40%,rgba(185,222,239,.05)),var(--pit-2)}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(185,222,239,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(185,222,239,.035) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(90deg,transparent 15%,black)}
.hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.6fr);align-items:center;gap:clamp(40px,8vw,100px);padding-block:clamp(82px,11vw,138px)}
.tag{margin:0 0 20px;color:var(--minas);font:500 10px/1 var(--data);letter-spacing:.15em;text-transform:uppercase}
h1,h2,h3,p{margin-top:0}
h1,h2{font-family:var(--display);font-weight:700}
h1{margin-bottom:24px;font-size:clamp(48px,7vw,78px);line-height:1.15;letter-spacing:-.045em}
.lead{max-width:48ch;margin:0;color:var(--chalk-2);font-size:clamp(16px,2vw,19px);line-height:1.85}
.gate-mark{display:grid;place-items:center;min-height:340px;position:relative}
.gate-mark::before{content:"";position:absolute;width:72%;aspect-ratio:1;border:1px solid rgba(185,222,239,.11);transform:rotate(45deg)}
.gate-mark img{position:relative;width:min(82%,330px);filter:drop-shadow(0 26px 52px rgba(0,0,0,.42))}
.connect{border-bottom:1px solid var(--seam);background:rgba(18,22,28,.88)}
.connect .wrap{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);align-items:center;gap:40px;padding-block:42px}
.connect-copy small{display:block;margin-bottom:9px;color:var(--dust);font:500 9px/1 var(--data);letter-spacing:.16em;text-transform:uppercase}
.connect-copy strong{font-family:var(--display);font-size:25px}
.server-copy{width:100%;display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px;padding:20px 22px;border:1px solid rgba(185,222,239,.24);background:rgba(26,32,41,.66);color:var(--chalk);cursor:pointer;text-align:left;transition:.2s}
.server-copy:hover{border-color:var(--minas);background:rgba(185,222,239,.055)}
.server-copy b{font:500 clamp(18px,3vw,24px)/1 var(--data);color:var(--minas)}
.server-copy span{font-size:13px;color:var(--chalk-2)}
.server-copy[data-copied="true"] span{color:var(--kyris)}
main .wrap{padding-block:clamp(76px,10vw,124px)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:34px;padding-bottom:25px;border-bottom:1px solid var(--seam)}
.section-head h2{margin:0;font-size:clamp(32px,5vw,52px);letter-spacing:-.035em}
.section-head p{max-width:42ch;margin:0;color:var(--dust);font-size:14px;line-height:1.75}
.release{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);gap:1px;border:1px solid var(--seam);background:var(--seam)}
.release-main,.release-side{background:linear-gradient(145deg,rgba(28,34,43,.98),rgba(20,25,32,.98));padding:clamp(28px,5vw,48px)}
.status{display:inline-flex;align-items:center;gap:8px;margin-bottom:26px;color:var(--kyris);font:500 10px/1 var(--data);letter-spacing:.12em;text-transform:uppercase}
.status::before{content:"";width:7px;height:7px;border:1px solid currentColor;transform:rotate(45deg)}
.release h3{margin-bottom:12px;font-family:var(--display);font-size:clamp(28px,4vw,40px)}
.release-description{max-width:52ch;margin-bottom:28px;color:var(--chalk-2);line-height:1.8}
.release-meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.release-meta span{padding:7px 10px;border:1px solid rgba(185,222,239,.13);color:var(--dust);font-size:12px}
.download-button{display:inline-flex;align-items:center;justify-content:center;min-width:200px;padding:15px 22px;border:1px solid var(--exia);background:transparent;color:var(--exia);text-decoration:none;font-weight:600;transition:.2s}
.download-button:hover{background:var(--exia);color:var(--pit)}
.download-button[aria-disabled="true"]{border-color:var(--seam);color:var(--dust);cursor:not-allowed;pointer-events:none}
.release-side h3{font-family:var(--body);font-size:16px}
.release-notes{margin:0;padding-left:18px;color:var(--chalk-2);font-size:14px;line-height:1.8}
.release-notes:empty::before{content:"새 배포와 함께 변경 내용을 안내합니다.";color:var(--dust)}
.hash{margin-top:28px;padding-top:20px;border-top:1px solid var(--seam)}
.hash small{display:block;margin-bottom:8px;color:var(--dust);font:500 9px/1 var(--data);letter-spacing:.12em;text-transform:uppercase}
.hash code{display:block;overflow-wrap:anywhere;color:var(--chalk-2);font:12px/1.65 var(--data)}
.history{margin-top:72px}
.history-list{border-top:1px solid var(--seam)}
.history-item{display:grid;grid-template-columns:130px 1fr auto;gap:24px;align-items:center;padding:22px 0;border-bottom:1px solid var(--seam)}
.history-item time{color:var(--dust);font:12px/1 var(--data)}
.history-item strong{display:block;margin-bottom:5px}
.history-item p{margin:0;color:var(--dust);font-size:13px}
.history-item a{color:var(--minas);text-decoration:none;font-size:13px}
.empty{padding:38px 0;border-bottom:1px solid var(--seam);color:var(--dust);font-size:14px}
.notice{margin-top:44px;padding:22px 24px;border-left:2px solid var(--kyris);background:rgba(137,231,192,.035);color:var(--chalk-2);font-size:14px;line-height:1.8}
footer{border-top:1px solid var(--seam);background:#0b0e13}
footer .wrap{display:flex;justify-content:space-between;gap:20px;padding-block:28px;color:var(--dust);font-size:12px}
@media(max-width:760px){
  .wrap{width:min(100% - 32px,1160px)}
  .nav .wrap{height:64px}
  .brand small{display:none}
  .nav nav{gap:15px;overflow-x:auto}
  .hero .wrap{grid-template-columns:1fr;padding-block:72px}
  .gate-mark{position:absolute;right:-80px;bottom:-65px;min-height:280px;width:280px;opacity:.2}
  .connect .wrap{grid-template-columns:1fr;gap:22px}
  .section-head{align-items:start;flex-direction:column}
  .release{grid-template-columns:1fr}
  .history-item{grid-template-columns:1fr auto;gap:8px 18px}
  .history-item time{grid-column:1/-1}
  footer .wrap{flex-direction:column}
}