@font-face{
  font-family:"PyeojinGothic";
  src:url("./assets/PyeojinGothic-Bold.woff") format("woff");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}


@font-face{
  font-family:"JeonjuWanpanbon";
  src:url("./assets/JeonjuWanpanbon-SunL.woff") format("woff");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"JayeonSans";
  src:url("./assets/JayeonSans-Regular.woff") format("woff");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"JayeonSans";
  src:url("./assets/JayeonSans-Medium.woff") format("woff");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@600;700;900&display=swap');

:root{
  --ink:#101614;
  --forest:#15231f;
  --forest2:#20352f;
  --cream:#f1ead9;
  --paper:#f7f1e5;
  --gold:#c4a660;
  --gold2:#e0c788;
  --rose:#edc0cb;
  --red:#8d3e35;
  --jade:#658f83;
  --line:rgba(27,39,35,.16);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:"JayeonSans",sans-serif;
  font-weight:400;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
button{font:inherit}
.paper-noise{
  position:fixed;inset:0;z-index:100;pointer-events:none;opacity:.055;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.46'/%3E%3C/svg%3E");
}

.topbar{
  position:fixed;left:0;top:0;width:100%;height:84px;display:flex;align-items:center;
  padding:0 5vw;z-index:50;color:white;border-bottom:1px solid rgba(255,255,255,.13);
  backdrop-filter:blur(11px);
  background:linear-gradient(to bottom,rgba(8,12,11,.68),rgba(8,12,11,.18),transparent);
}
.brand{display:flex;align-items:center;gap:12px}
.brand-seal{
  width:39px;height:39px;display:grid;place-items:center;border:1px solid rgba(224,199,136,.6);
  font-family:"Noto Serif KR",serif;font-weight:700;color:var(--gold2)
}
.brand-name{font-family:"Noto Serif KR",serif;font-weight:700;font-size:21px;letter-spacing:.14em}
.nav{margin-left:auto;margin-right:38px;display:flex;gap:34px;font-size:14px;font-weight:500}
.nav a{opacity:.82;transition:.2s}.nav a:hover{opacity:1;color:var(--gold2)}
/* old discord-top removed */
.discord-top{
  padding:11px 18px;border:1px solid rgba(255,255,255,.36);font-size:12px;letter-spacing:.16em;transition:.2s
}
.discord-top:hover{background:rgba(255,255,255,.08);border-color:rgba(224,199,136,.65);color:var(--gold2)}
.menu-btn{display:none;margin-left:auto;background:none;border:0;color:white;font-size:24px}

.hero{
  min-height:100vh;position:relative;display:grid;place-items:center;text-align:center;color:white;overflow:hidden;
  background:#12201d;
}
.hero-world{position:absolute;inset:0;z-index:0;overflow:hidden}
.sky-gradient{
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 50% 19%,rgba(238,196,145,.16),transparent 22%),
    radial-gradient(circle at 48% 28%,rgba(173,82,84,.10),transparent 35%),
    linear-gradient(180deg,#28413a 0%,#192b27 41%,#101917 72%,#0b100f 100%);
}
.layer{position:absolute;will-change:transform;transition:transform .12s linear}
.moon-glow{
  width:40vw;height:40vw;min-width:420px;min-height:420px;border-radius:50%;
  left:50%;top:1%;transform:translateX(-50%);
  background:radial-gradient(circle,rgba(243,199,137,.18),rgba(226,142,126,.06) 52%,transparent 72%);
  filter:blur(28px)
}
.red-sun{
  width:min(21vw,315px);aspect-ratio:1;border-radius:50%;left:50%;top:13%;transform:translateX(-50%);
  background:radial-gradient(circle at 46% 43%,#f4d1ad 0%,#df9b79 52%,#a54f50 74%,rgba(139,57,60,.18) 76%,transparent 78%);
  box-shadow:0 0 90px rgba(230,161,122,.16);opacity:.70
}
.cloud-ribbon{
  height:80px;opacity:.24;filter:blur(.2px);
  background:rgba(226,217,200,.8);
  -webkit-mask-repeat:no-repeat;-webkit-mask-size:contain;-webkit-mask-position:center;
  mask-repeat:no-repeat;mask-size:contain;mask-position:center;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 380 120'%3E%3Cpath fill='black' d='M14 81c20-28 48-32 73-17 8-20 28-31 49-29 21 2 37 12 46 29 20-14 45-13 65 2 17 13 29 14 51 10v17H12c-8 0-12-3-12-8 0-7 5-10 14-10zm124-42c14-12 32-14 50-6 10 5 18 12 22 22h-22c-5-6-12-10-21-10-11-1-20 2-29 7V39zm109 40c11-7 22-8 34-6 9 2 17 6 23 11h-18c-5-3-10-5-16-5-8 0-15 2-23 7v-7z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 380 120'%3E%3Cpath fill='black' d='M14 81c20-28 48-32 73-17 8-20 28-31 49-29 21 2 37 12 46 29 20-14 45-13 65 2 17 13 29 14 51 10v17H12c-8 0-12-3-12-8 0-7 5-10 14-10zm124-42c14-12 32-14 50-6 10 5 18 12 22 22h-22c-5-6-12-10-21-10-11-1-20 2-29 7V39zm109 40c11-7 22-8 34-6 9 2 17 6 23 11h-18c-5-3-10-5-16-5-8 0-15 2-23 7v-7z'/%3E%3C/svg%3E");
}
.cloud-ribbon-1{width:280px;left:8%;top:22%;animation:cloudDrift 14s ease-in-out infinite alternate}
.cloud-ribbon-2{width:360px;right:7%;top:28%;opacity:.18;animation:cloudDrift 18s ease-in-out infinite alternate}
.cloud-ribbon-3{width:210px;left:60%;top:36%;opacity:.12;animation:cloudDrift 12s ease-in-out infinite alternate}

.mountain-art{left:0;bottom:0;width:100%;height:67vh}
.mt-back{fill:#243b35;opacity:.56}
.mt-mid{fill:#162823;opacity:.85}
.mt-front{fill:#0f1b18;opacity:.98}
.far-mist{
  position:absolute;width:140%;left:-20%;height:16vh;border-radius:50%;filter:blur(20px);
  background:radial-gradient(ellipse at center,rgba(231,229,219,.27),rgba(231,229,219,.06) 54%,transparent 73%);
  animation:mistDrift 20s ease-in-out infinite alternate
}
.far-mist-a{bottom:31vh}
.far-mist-b{bottom:20vh;opacity:.5;animation-duration:27s}

.palace-art{
  width:min(88vw,1500px);height:auto;left:50%;bottom:5.5vh;transform:translateX(-50%);
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.24))
}
.palace-shadow path{fill:#070b0a}
.palace-main .roof-base,.palace-main .roof-upper,.palace-main .roof-crown{fill:#111a17}
.eave{fill:#07100d}
.roof-tile{fill:none;stroke:rgba(224,199,136,.23);stroke-width:5;stroke-linecap:round}
.lower-columns rect,.upper-columns rect{fill:#161f1c}
.gate{fill:#090d0c;stroke:rgba(181,75,64,.65);stroke-width:4}
.gate-detail{fill:none;stroke:rgba(181,75,64,.55);stroke-width:4}
.dancheong-line{fill:none;stroke:rgba(77,143,124,.55);stroke-width:5}
.stone-base path{fill:#0b110f}
.stone-base path:first-child{fill:#111a17}

.branch{width:min(28vw,380px);height:auto;top:8vh;z-index:2;opacity:.88}
.branch-left{left:-10px}
.branch-right{right:-10px}
.branch-line,.twig{fill:none;stroke:#0b0f0e;stroke-width:16;stroke-linecap:round}
.twig{stroke-width:9}
.blossoms circle{fill:#efc4ce;stroke:#fff0f3;stroke-width:2;opacity:.92}

.roof-foreground{
  position:absolute;bottom:-2px;width:43vw;height:19vw;max-height:260px;background:#060a08;z-index:2;
  clip-path:polygon(0 73%,10% 66%,14% 54%,29% 51%,38% 41%,62% 41%,71% 51%,86% 54%,90% 66%,100% 73%,100% 100%,0 100%);
}
.roof-foreground::after{
  content:"";position:absolute;left:0;right:0;top:55%;height:2px;background:rgba(224,199,136,.10);
  box-shadow:0 16px 0 rgba(224,199,136,.075),0 32px 0 rgba(224,199,136,.055),0 48px 0 rgba(224,199,136,.04)
}
.roof-left{left:-4vw}.roof-right{right:-4vw;transform:scaleX(-1)}
.bottom-vignette{
  position:absolute;inset:auto 0 0;height:38vh;z-index:2;
  background:linear-gradient(180deg,transparent,rgba(5,8,7,.10) 28%,rgba(5,8,7,.58) 100%)
}

.petal-field,.sparkle-field{position:absolute;inset:0;pointer-events:none;z-index:3;overflow:hidden}
.petal{
  position:absolute;top:-7vh;width:18px;height:12px;
  background:linear-gradient(135deg,#ffe0e7,#eaa4b8);
  border-radius:65% 35% 68% 32%/58% 44% 56% 42%;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.12));
  animation-name:fall,sway,spin;animation-timing-function:linear,ease-in-out,linear;animation-iteration-count:infinite
}
.petal.small{width:11px;height:7px}.petal.large{width:24px;height:16px}
.spark{
  position:absolute;width:3px;height:3px;border-radius:50%;background:rgba(255,225,167,.8);
  box-shadow:0 0 10px rgba(255,225,167,.55);animation:twinkle linear infinite alternate
}

.hero-content{position:relative;z-index:5;padding:124px 22px 92px;max-width:1100px}
.eyebrow{font-family:"JayeonSans",sans-serif;font-weight:500;font-size:12px;letter-spacing:.34em;color:var(--gold2)}
.hero h1{margin:22px 0 16px;font-family:"Noto Serif KR",serif}
.hero-kicker{
  display:block;font-family:"JayeonSans",sans-serif;font-weight:400;
  font-size:clamp(19px,2vw,30px);letter-spacing:.10em;color:#f1e4e6
}
.hero h1 strong{
  display:block;font-size:clamp(94px,13vw,182px);line-height:1;font-family:"JeonjuWanpanbon","Noto Serif KR",serif;
  font-weight:400;letter-spacing:-.055em;
  text-shadow:0 7px 35px rgba(0,0,0,.33)
}
.hero-desc{font-family:"JayeonSans",sans-serif;font-weight:400;line-height:1.95;color:#ddd8d7;font-size:15px;letter-spacing:.015em}
.hero-actions{display:flex;justify-content:center;gap:12px;margin-top:36px;flex-wrap:wrap}
.primary,.secondary{min-width:205px;min-height:58px;border:0;padding:12px 20px;cursor:pointer;transition:.22s}
.primary{background:linear-gradient(180deg,#f0d89d,#d5b66d);color:#17201d;box-shadow:0 10px 32px rgba(0,0,0,.20)}
.primary span{display:block;font-size:11px;opacity:.65}.primary b{font-size:14px;letter-spacing:.08em}
.primary:hover{transform:translateY(-2px);filter:brightness(1.05)}
.secondary{display:grid;place-items:center;border:1px solid rgba(255,255,255,.32);background:rgba(8,14,12,.16);color:white}
.secondary:hover{background:rgba(255,255,255,.09)}
.discord-hero{border-color:rgba(224,199,136,.40);color:#f6e7bf}
.server-state{margin-top:24px;display:flex;justify-content:center;align-items:center;gap:9px;font-size:10px;letter-spacing:.12em;color:#c7cbc8}
.server-state b{color:var(--gold2);font-weight:500}.dot{width:6px;height:6px;border-radius:50%;background:#85c58d;box-shadow:0 0 12px #85c58d}
.scroll{position:absolute;z-index:5;bottom:25px;font-size:9px;letter-spacing:.25em;color:#b6b8b3}
.scroll span{display:block;font-size:16px;margin-top:5px}

.section{padding:120px 7vw}
.section-title p{color:var(--red);font-size:11px;letter-spacing:.24em;font-weight:500}
.section-title h2{font:700 clamp(34px,5vw,66px)/1.3 "Noto Serif KR",serif;margin:18px 0 0;letter-spacing:-.04em}
.section-title span{display:block;color:#656a66;margin-top:18px}
.intro{background:var(--paper)}
.intro-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:70px;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.paper-card{min-height:310px;padding:40px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);position:relative}
.paper-card::after{content:"";position:absolute;right:22px;bottom:20px;width:55px;height:55px;border:1px solid rgba(142,61,52,.18);border-radius:50%}
.card-no{font:700 28px "Noto Serif KR",serif;color:var(--red)}
.paper-card h3{font:700 26px "Noto Serif KR",serif;margin:70px 0 16px}
.paper-card p{color:#646963;line-height:1.9;font-size:14px;max-width:320px}

.dark-section{background:#111916;color:white;position:relative;overflow:hidden}
.dark-section::before{content:"瓦";position:absolute;right:-2vw;top:-8vw;font:900 36vw/1 "Noto Serif KR",serif;color:rgba(255,255,255,.018)}
.section-title.light p{color:var(--gold2)}
.contents-grid{display:grid;grid-template-columns:1fr 1fr;margin-top:72px;border-top:1px solid rgba(255,255,255,.13)}
.content-card{display:flex;gap:32px;padding:45px 22px;border-bottom:1px solid rgba(255,255,255,.13);min-height:220px}
.content-card:nth-child(odd){border-right:1px solid rgba(255,255,255,.13)}
.symbol{width:66px;height:66px;flex:0 0 66px;border:1px solid rgba(212,188,123,.5);display:grid;place-items:center;font:600 26px "Noto Serif KR",serif;color:var(--gold2)}
.content-card small{letter-spacing:.12em;color:#8f9a95;font-size:10px}
.content-card h3{font:700 28px "Noto Serif KR",serif;margin:10px 0}
.content-card p{color:#aeb6b1;line-height:1.85;font-size:14px;max-width:480px}

.ranks{background:#ece4d2}
.rank-line{display:grid;grid-template-columns:repeat(7,1fr);margin-top:66px;border-top:1px solid rgba(27,39,35,.25);border-bottom:1px solid rgba(27,39,35,.25)}
.rank{padding:30px 12px;text-align:center;border-right:1px solid rgba(27,39,35,.15)}
.rank:last-child{border-right:0}.rank i{display:block;font-style:normal;font-size:9px;letter-spacing:.1em;color:#8f8471}
.rank b{font:600 20px "Noto Serif KR",serif;display:block;margin-top:14px}.rank.king{background:#111916;color:#f3e8ca}.rank.king i{color:var(--gold2)}

.join{background:#71352f;color:white;padding-top:100px;padding-bottom:100px}
.join-panel{
  min-height:590px;padding:70px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.23);
  background:linear-gradient(rgba(18,28,25,.94),rgba(18,28,25,.94)),repeating-linear-gradient(45deg,transparent 0 18px,rgba(255,255,255,.04) 18px 19px)
}
.join-panel::after{content:"瓦";position:absolute;right:1vw;bottom:-7vw;font:900 27vw/1 "Noto Serif KR",serif;color:rgba(255,255,255,.035)}
.join-panel h2{font:700 clamp(42px,7vw,82px)/1.25 "Noto Serif KR",serif;margin:18px 0 18px;position:relative;z-index:2}
.join-panel>p:not(.eyebrow){color:#aeb6b1}
.ip-large{
  margin-top:48px;width:min(100%,560px);padding:22px 26px;background:transparent;color:white;border:1px solid rgba(212,188,123,.55);
  text-align:left;cursor:pointer;position:relative;z-index:2;transition:.2s
}
.ip-large:hover{background:rgba(212,188,123,.08)}
.ip-large small{display:block;color:var(--gold2);letter-spacing:.16em;font-size:9px}
.ip-large strong{display:block;font-size:24px;margin-top:8px;letter-spacing:.05em}
.ip-large span{position:absolute;right:22px;top:50%;transform:translateY(-50%);font-size:11px;color:#aeb6b1}
.join-links{display:flex;gap:18px;margin-top:28px;position:relative;z-index:2;flex-wrap:wrap}
.join-links a{font-size:13px;border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:5px}


.toast{
  position:fixed;left:50%;bottom:28px;transform:translate(-50%,120px);z-index:200;background:#111915;color:#fff;padding:14px 20px;
  font-size:12px;border:1px solid rgba(255,255,255,.12);transition:.3s
}
.toast.show{transform:translate(-50%,0)}
.reveal{opacity:0;transform:translateY(24px);transition:.7s ease}.reveal.visible{opacity:1;transform:none}

@keyframes cloudDrift{0%{translate:0 0}100%{translate:35px 4px}}
@keyframes mistDrift{0%{transform:translateX(-2%)}100%{transform:translateX(4%)}}
@keyframes fall{0%{transform:translateY(-10vh)}100%{transform:translateY(112vh)}}
@keyframes sway{0%{margin-left:0}50%{margin-left:34px}100%{margin-left:-24px}}
@keyframes spin{0%{rotate:0deg}100%{rotate:360deg}}
@keyframes twinkle{0%{opacity:.12;transform:translateY(0) scale(.8)}100%{opacity:.95;transform:translateY(-8px) scale(1.2)}}

@media(max-width:900px){
  .nav,/* old discord-top removed */
.discord-top{display:none}.menu-btn{display:block}
  .nav.open{display:flex;position:absolute;top:84px;left:0;right:0;padding:25px 5vw;flex-direction:column;gap:20px;background:rgba(15,23,20,.97);border-top:1px solid rgba(255,255,255,.1)}
  .intro-grid{grid-template-columns:1fr}.contents-grid{grid-template-columns:1fr}.content-card:nth-child(odd){border-right:0}
  .rank-line{grid-template-columns:repeat(2,1fr)}.rank{border-bottom:1px solid rgba(27,39,35,.15)}
  .join-panel{padding:44px 28px}.palace-art{width:1080px;max-width:none}.branch{width:240px;opacity:.72}
}
@media(max-width:560px){
  .topbar{height:70px;padding:0 20px}.hero-content{padding-top:94px}.hero h1 strong{font-size:96px}
  .hero-kicker{font-size:17px;letter-spacing:.06em}.hero-desc br{display:none}
  .section{padding:86px 22px}.paper-card{padding:30px;min-height:250px}.content-card{padding:34px 6px;gap:18px}
  .symbol{width:52px;height:52px;flex-basis:52px}.rank-line{grid-template-columns:1fr 1fr}.join{padding:60px 18px}
  .join-panel{padding:38px 22px;min-height:520px}.ip-large strong{font-size:18px}.ip-large span{display:none}
  footer{padding:28px 22px;display:block}footer p{margin-top:10px}.secondary,.primary{min-width:185px}
  .palace-art{width:940px;bottom:8vh}.branch{opacity:.55}.red-sun{width:230px}.moon-glow{min-width:320px;min-height:320px}
}


/* ---------- GIWA footer v5 ---------- */
.site-footer{
  min-height:330px;
  background:#050505;
  color:#f3f3f3;
  padding:62px 3.2vw 54px;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:80px;
  border-top:1px solid rgba(255,255,255,.04);
  font-family:"JayeonSans",sans-serif;
}
.footer-left{max-width:760px}
.footer-logo{
  display:inline-flex;
  align-items:center;
  gap:13px;
  margin-bottom:13px;
}
.footer-symbol{
  width:31px;
  height:31px;
  position:relative;
  display:inline-block;
}
.footer-symbol i{
  position:absolute;
  left:1px;
  width:28px;
  height:7px;
  background:#fff;
  border-radius:1px 7px 1px 7px;
  transform:skewX(-18deg);
}
.footer-symbol i:nth-child(1){top:2px;transform:skewX(-18deg) rotate(5deg)}
.footer-symbol i:nth-child(2){top:12px;left:5px;width:24px;transform:skewX(18deg) rotate(-3deg)}
.footer-symbol i:nth-child(3){top:22px;transform:skewX(-18deg) rotate(4deg)}
.footer-wordmark{
  font-size:22px;
  font-weight:500;
  letter-spacing:.10em;
  line-height:1;
}
.footer-support{
  margin:0 0 35px;
  color:#9b9b9b;
  font-size:12px;
  letter-spacing:.01em;
}
.footer-support a{
  color:#d6e7ff;
  transition:.2s;
}
.footer-support a:hover{color:#fff}

.footer-legal-links{
  display:flex;
  flex-wrap:wrap;
  gap:9px 16px;
  margin-bottom:13px;
}
.footer-legal-links a{
  position:relative;
  color:#f2f2f2;
  font-size:12px;
  font-weight:500;
  text-decoration:underline;
  text-underline-offset:3px;
}
.footer-legal-links a:not(:last-child)::after{
  content:"";
  width:1px;
  height:9px;
  position:absolute;
  right:-8px;
  top:4px;
  background:#5d5d5d;
}

.footer-company{
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
  color:#f1f1f1;
  font-size:12px;
  margin-bottom:13px;
}
.footer-company span{white-space:nowrap}
.footer-copy{
  margin:0;
  color:#777;
  font-size:12px;
  line-height:1.65;
}

.footer-right{
  width:min(390px,34vw);
  display:grid;
  grid-template-columns:1fr auto;
  gap:75px;
  padding-top:18px;
}
.footer-link-group{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:18px;
}
.footer-link-group strong{
  color:white;
  font-size:15px;
  font-weight:500;
  margin-bottom:10px;
}
.footer-link-group a{
  color:#6f6f6f;
  font-size:14px;
  transition:.18s;
}
.footer-link-group a:hover{
  color:#fff;
  transform:translateX(2px);
}
.footer-socials{
  display:flex;
  gap:27px;
  align-items:flex-start;
}
.social-btn{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  color:#f4f4f4;
  transition:.2s;
}
.social-btn svg{
  width:24px;
  height:24px;
  fill:currentColor;
}
.social-btn:hover{
  color:var(--gold2);
  transform:translateY(-2px);
}

@media(max-width:820px){
  .site-footer{
    padding:48px 24px 42px;
    flex-direction:column;
    gap:46px;
  }
  .footer-right{
    width:100%;
    grid-template-columns:1fr auto;
    gap:30px;
    padding-top:0;
  }
}
@media(max-width:480px){
  .footer-right{
    grid-template-columns:1fr;
  }
  .footer-socials{
    gap:22px;
  }
  .footer-company{
    flex-direction:column;
    gap:6px;
  }
}


.footer-company{
  max-width:900px;
}
.footer-company span:last-child{
  flex-basis:100%;
  white-space:normal;
}
.gitbook-social svg{
  width:25px;
  height:25px;
}


/* v7 - Main GIWA title font */
.hero h1 strong{
  letter-spacing:-.02em;
  line-height:.95;
}


/* v8 - Requested section heading font */
.dark-section .section-title h2,
.ranks .section-title h2,
.join-panel h2{
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-weight:700;
  letter-spacing:-.035em;
}


/* ---------- v10 top header ---------- */
.topbar-v10{
  height:84px;
  padding:0 28px;
  background:#020202;
  border-bottom:1px solid rgba(255,255,255,.05);
  backdrop-filter:none;
}
.topbar-v10::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent);
}
.topbar-inner{
  width:100%;
  max-width:1280px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:38px;
}
.brand{
  display:flex;
  align-items:center;
  gap:14px;
  flex:0 0 auto;
}
.brand-seal-logo{
  width:33px;
  height:31px;
  border:none;
  position:relative;
  display:inline-block;
}
.brand-seal-logo i{
  position:absolute;
  left:1px;
  width:28px;
  height:7px;
  background:#fff;
  border-radius:1px 7px 1px 7px;
  transform:skewX(-18deg);
}
.brand-seal-logo i:nth-child(1){top:2px;transform:skewX(-18deg) rotate(5deg)}
.brand-seal-logo i:nth-child(2){top:12px;left:5px;width:24px;transform:skewX(18deg) rotate(-3deg)}
.brand-seal-logo i:nth-child(3){top:22px;transform:skewX(-18deg) rotate(4deg)}

.brand-name-en{
  font-family:"JayeonSans",sans-serif;
  font-weight:500;
  font-size:18px;
  letter-spacing:.12em;
  color:#fff;
}

.nav-v10{
  display:flex;
  align-items:center;
  gap:38px;
  margin-left:36px;
  margin-right:auto;
  font-family:"JayeonSans",sans-serif;
  font-weight:500;
  font-size:14px;
}
.nav-v10 a{
  color:#fff;
  opacity:.92;
  transition:.18s;
}
.nav-v10 a:hover{
  opacity:1;
  color:var(--gold2);
}

.topbar-actions{
  display:flex;
  align-items:center;
  gap:14px;
  margin-left:auto;
}
.discord-pill{
  min-width:176px;
  height:46px;
  padding:0 22px;
  border-radius:999px;
  background:#f3f3f3;
  color:#111;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family:"JayeonSans",sans-serif;
  font-weight:500;
  font-size:14px;
  letter-spacing:-.01em;
  transition:.18s;
}
.discord-pill:hover{
  transform:translateY(-1px);
  background:#fff;
}
.topbar-v10 .menu-btn{
  display:none;
  margin-left:0;
  background:none;
  border:0;
  color:white;
  font-size:24px;
}

@media(max-width:900px){
  .topbar-v10{
    height:72px;
    padding:0 18px;
  }
  .topbar-inner{
    gap:16px;
  }
  .topbar-v10 .menu-btn{
    display:block;
  }
  .nav-v10{
    display:none;
    margin:0;
  }
  .nav-v10.open{
    display:flex;
    position:absolute;
    top:72px;
    left:0;
    right:0;
    flex-direction:column;
    align-items:flex-start;
    gap:18px;
    padding:24px 20px 26px;
    background:#050505;
    border-top:1px solid rgba(255,255,255,.06);
  }
  .discord-pill{
    min-width:auto;
    height:40px;
    padding:0 16px;
    font-size:13px;
  }
}
@media(max-width:560px){
  .brand-name-en{
    font-size:17px;
    letter-spacing:.10em;
  }
  .discord-pill{
    padding:0 14px;
    font-size:12px;
  }
}


/* ---------- v11 topbar polish ---------- */

.topbar-v10{
  transition:
    height .24s ease,
    background-color .24s ease,
    box-shadow .24s ease,
    border-color .24s ease;
}

.topbar-v10 .topbar-inner{
  transition:gap .24s ease;
}

/* Slightly more compact, balanced brand */
.topbar-v10 .brand{
  gap:12px;
}

.topbar-v10 .brand-seal-logo{
  transform:scale(.96);
  transform-origin:center;
}

.topbar-v10 .brand-name-en{
  font-size:17px;
  letter-spacing:.115em;
}

/* Menu underline animation */
.nav-v10 a{
  position:relative;
  padding:31px 0 28px;
  line-height:1;
  transition:
    color .2s ease,
    opacity .2s ease;
}

.nav-v10 a::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:19px;
  width:0;
  height:1.5px;
  border-radius:999px;
  background:var(--gold2);
  transform:translateX(-50%);
  transition:width .2s ease;
}

.nav-v10 a:hover::after{
  width:100%;
}

/* More premium Discord CTA */
.discord-pill{
  box-shadow:0 0 0 1px rgba(255,255,255,.06);
  transition:
    transform .2s ease,
    background-color .2s ease,
    box-shadow .2s ease;
}

.discord-pill:hover{
  transform:translateY(-1px);
  box-shadow:
    0 8px 24px rgba(0,0,0,.18),
    0 0 0 1px rgba(255,255,255,.12);
}

/* Shrink header after scrolling */
.topbar-v10.scrolled{
  height:66px;
  background:rgba(2,2,2,.95);
  border-bottom-color:rgba(255,255,255,.08);
  box-shadow:0 10px 32px rgba(0,0,0,.18);
}

.topbar-v10.scrolled .topbar-inner{
  gap:30px;
}

.topbar-v10.scrolled .brand-seal-logo{
  transform:scale(.88);
}

.topbar-v10.scrolled .brand-name-en{
  font-size:16px;
}

.topbar-v10.scrolled .nav-v10 a{
  padding:23px 0 21px;
}

.topbar-v10.scrolled .nav-v10 a::after{
  bottom:14px;
}

.topbar-v10.scrolled .discord-pill{
  height:40px;
  min-width:164px;
  font-size:13px;
}

/* Smoothly reveal shadow only when scrolled */
.topbar-v10::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(
    180deg,
    rgba(255,255,255,.018),
    rgba(255,255,255,0)
  );
  transition:opacity .24s ease;
}

.topbar-v10.scrolled::before{
  opacity:1;
}

@media(max-width:900px){
  .topbar-v10.scrolled{
    height:64px;
  }

  .topbar-v10.scrolled .nav-v10.open{
    top:64px;
  }

  .nav-v10 a,
  .topbar-v10.scrolled .nav-v10 a{
    width:100%;
    padding:4px 0;
  }

  .nav-v10 a::after,
  .topbar-v10.scrolled .nav-v10 a::after{
    display:none;
  }

  .topbar-v10.scrolled .discord-pill{
    height:38px;
    min-width:auto;
  }
}

@media(max-width:560px){
  .topbar-v10 .brand{
    gap:10px;
  }

  .topbar-v10 .brand-name-en{
    font-size:16px;
  }

  .topbar-v10 .brand-seal-logo{
    transform:scale(.90);
  }
}


/* ==================== v12 MAIN REDESIGN ==================== */

:root{
  --v12-black:#0a0d0c;
  --v12-deep:#111a17;
  --v12-jade:#456e63;
  --v12-jade2:#70988d;
  --v12-paper:#efe7d5;
  --v12-paper2:#f7f1e5;
  --v12-red:#8d4339;
  --v12-gold:#c8aa65;
  --v12-muted:#7f827c;
}

.section-kicker{
  margin:0;
  font-family:"JayeonSans",sans-serif;
  font-size:12px;
  font-weight:500;
  letter-spacing:.20em;
  color:var(--v12-red);
}
.light-kicker{color:var(--v12-gold)}

/* About */
.about-v12{
  background:var(--v12-paper2);
  padding:130px 7vw;
  color:var(--v12-black);
}
.about-shell{
  max-width:1280px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.1fr 1.25fr;
  grid-template-rows:auto auto;
  gap:28px;
}
.about-heading{
  padding:10px 40px 30px 0;
}
.about-heading h2{
  margin:18px 0 22px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(40px,5vw,68px);
  line-height:1.24;
  letter-spacing:-.045em;
}
.about-lead{
  max-width:540px;
  margin:0;
  color:#656963;
  font-size:15px;
  line-height:1.95;
}
.about-feature{
  min-height:370px;
  border:1px solid rgba(23,31,28,.14);
  position:relative;
  overflow:hidden;
}
.about-feature-main{
  background:var(--v12-deep);
  color:#fff;
  padding:42px 44px;
}
.feature-no{
  font-size:11px;
  letter-spacing:.12em;
  color:var(--v12-gold);
}
.feature-copy{
  position:relative;
  z-index:2;
  margin-top:82px;
}
.feature-copy small,
.about-mini small{
  color:#969f99;
  font-size:11px;
  letter-spacing:.15em;
}
.feature-copy h3{
  margin:12px 0 18px;
  font-family:"Noto Serif KR",serif;
  font-size:34px;
  line-height:1.35;
}
.feature-copy p{
  max-width:470px;
  color:#b6beb9;
  line-height:1.8;
  font-size:14px;
}
.feature-mark{
  position:absolute;
  right:-18px;
  bottom:-75px;
  font-family:"Noto Serif KR",serif;
  font-size:260px;
  font-weight:900;
  color:rgba(255,255,255,.035);
}
.about-side-grid{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
}
.about-mini{
  min-height:250px;
  padding:34px 38px;
  border-top:1px solid rgba(23,31,28,.18);
  border-bottom:1px solid rgba(23,31,28,.18);
  position:relative;
}
.about-mini:nth-child(2){
  background:#e7deca;
}
.about-mini .feature-no{
  color:var(--v12-red);
}
.about-mini h3{
  margin:48px 0 12px;
  font-family:"Noto Serif KR",serif;
  font-size:28px;
}
.about-mini p{
  color:#656963;
  line-height:1.8;
  font-size:14px;
  max-width:480px;
}

/* Contents */
.contents-v12{
  background:var(--v12-black);
  color:#fff;
  padding:130px 7vw 150px;
}
.contents-head{
  max-width:1280px;
  margin:0 auto 64px;
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:40px;
}
.contents-head h2{
  margin:18px 0 0;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(42px,5vw,68px);
  line-height:1.23;
  letter-spacing:-.045em;
}
.contents-intro{
  width:360px;
  margin:0 0 8px;
  color:#8e9691;
  font-size:14px;
  line-height:1.8;
}
.content-showcase{
  max-width:1280px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.3fr .85fr;
  grid-template-rows:auto auto;
  gap:18px;
}
.content-large,
.content-tall,
.content-wide{
  position:relative;
  border:1px solid rgba(255,255,255,.09);
  overflow:hidden;
  background:#121916;
  min-height:420px;
}
.content-large{
  grid-row:span 2;
  min-height:860px;
}
.content-tall{
  min-height:410px;
}
.content-wide{
  grid-column:2;
  min-height:430px;
}
.content-topline{
  display:flex;
  justify-content:space-between;
  padding:26px 28px 0;
  color:#8e9791;
  font-size:11px;
  letter-spacing:.13em;
}
.content-topline span{color:var(--v12-gold)}
.content-visual{
  position:relative;
  overflow:hidden;
  margin:20px 26px;
  min-height:210px;
  border-radius:2px;
}
.content-large .content-visual{
  min-height:500px;
}
.content-visual::before,
.content-visual::after{
  content:"";
  position:absolute;
  inset:0;
}
.content-visual-mining{
  background:
    radial-gradient(circle at 68% 38%,rgba(199,170,101,.22),transparent 23%),
    linear-gradient(145deg,#304c44,#172722 68%);
}
.content-visual-mining::before{
  background:
    linear-gradient(145deg,transparent 0 39%,rgba(255,255,255,.05) 39% 40%,transparent 40% 100%),
    repeating-linear-gradient(90deg,transparent 0 52px,rgba(255,255,255,.025) 52px 53px);
}
.content-visual-farming{
  background:linear-gradient(150deg,#536e4e,#233821);
}
.content-visual-farming::before{
  background:repeating-linear-gradient(18deg,transparent 0 30px,rgba(255,255,255,.045) 30px 32px);
}
.content-visual-fishing{
  background:linear-gradient(155deg,#315c60,#152f36);
}
.content-visual-fishing::before{
  background:radial-gradient(ellipse at 60% 70%,rgba(255,255,255,.08),transparent 45%);
}
.content-visual-gathering{
  width:45%;
  min-width:220px;
  min-height:250px;
  margin:0;
  background:linear-gradient(145deg,#5b7150,#263627);
}
.visual-kanji{
  position:absolute;
  right:24px;
  bottom:6px;
  font-family:"Noto Serif KR",serif;
  font-size:clamp(100px,14vw,230px);
  font-weight:900;
  line-height:1;
  color:rgba(255,255,255,.085);
}
.content-copy{
  padding:2px 28px 32px;
}
.content-copy h3{
  margin:0 0 12px;
  font-family:"Noto Serif KR",serif;
  font-size:30px;
}
.content-copy p{
  margin:0;
  color:#a1aaa4;
  line-height:1.8;
  font-size:14px;
}
.content-wide-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:20px 28px 28px;
}
.content-wide-inner .content-copy{
  padding:0;
  max-width:360px;
}

/* Ranks */
.ranks-v12{
  background:var(--v12-paper);
  padding:130px 7vw 145px;
  color:var(--v12-black);
}
.ranks-head{
  max-width:1280px;
  margin:0 auto 72px;
}
.ranks-head h2{
  margin:18px 0 14px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(42px,5vw,68px);
  letter-spacing:-.045em;
}
.ranks-head>p:last-child{
  color:#696d68;
  line-height:1.8;
}
.rank-journey{
  max-width:1280px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(7,1fr);
  position:relative;
  padding-top:8px;
}
.rank-track{
  position:absolute;
  left:7%;
  right:7%;
  top:72px;
  height:1px;
  background:linear-gradient(90deg,#9b8d72,#c7a65e,#8d4339);
}
.rank-step{
  text-align:center;
  position:relative;
  z-index:2;
}
.rank-index{
  display:block;
  margin-bottom:22px;
  font-size:10px;
  letter-spacing:.14em;
  color:#867e70;
}
.rank-medallion{
  width:74px;
  height:74px;
  margin:0 auto 18px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#e5dcc8;
  border:1px solid #b7a98d;
  font-family:"Noto Serif KR",serif;
  font-size:24px;
  color:#574d3d;
  box-shadow:0 0 0 8px var(--v12-paper);
}
.rank-step b{
  font-family:"Noto Serif KR",serif;
  font-size:18px;
}
.rank-final .rank-medallion{
  background:#17221f;
  color:var(--v12-gold);
  border-color:#17221f;
}
.rank-final b{color:#7d342f}

/* Join */
.join-v12{
  padding:110px 7vw;
  background:#6d332d;
}
.join-v12-card{
  max-width:1280px;
  margin:0 auto;
  min-height:470px;
  background:#101815;
  color:#fff;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:70px;
  align-items:center;
  padding:68px 72px;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
}
.join-v12-card::before{
  content:"";
  position:absolute;
  left:55%;
  top:-20%;
  width:420px;
  height:420px;
  border-radius:50%;
  border:1px solid rgba(200,170,101,.10);
  box-shadow:
    0 0 0 60px rgba(200,170,101,.025),
    0 0 0 120px rgba(200,170,101,.018);
}
.join-v12-left,
.join-v12-right{
  position:relative;
  z-index:2;
}
.join-v12-left h2{
  margin:18px 0 18px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(48px,6vw,78px);
  line-height:1.2;
  letter-spacing:-.05em;
}
.join-v12-left>p:last-child{
  color:#8f9792;
}
.join-v12-right{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.join-server-btn,
.join-discord-btn{
  width:100%;
  min-height:76px;
  border:0;
  padding:18px 22px;
}
.join-server-btn{
  text-align:left;
  background:#efe3c3;
  color:#121713;
  cursor:pointer;
  position:relative;
}
.join-server-btn span{
  display:block;
  font-size:10px;
  letter-spacing:.14em;
  color:#7e7158;
}
.join-server-btn strong{
  display:block;
  margin-top:6px;
  font-size:20px;
  letter-spacing:.04em;
}
.join-server-btn small{
  position:absolute;
  right:20px;
  top:50%;
  transform:translateY(-50%);
  color:#7e7158;
}
.join-discord-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  color:#101510;
  font-weight:500;
}
.join-wiki-link{
  margin-top:12px;
  color:#9da49f;
  font-size:13px;
  align-self:flex-start;
  border-bottom:1px solid rgba(255,255,255,.18);
  padding-bottom:4px;
}
.join-seal{
  position:absolute;
  right:-15px;
  bottom:-90px;
  font-family:"Noto Serif KR",serif;
  font-size:260px;
  font-weight:900;
  color:rgba(255,255,255,.025);
}

/* v12 responsiveness */
@media(max-width:980px){
  .about-shell{
    grid-template-columns:1fr;
  }
  .about-heading{
    padding-right:0;
  }
  .about-side-grid{
    grid-template-columns:1fr;
  }
  .contents-head{
    display:block;
  }
  .contents-intro{
    width:auto;
    max-width:520px;
    margin-top:18px;
  }
  .content-showcase{
    grid-template-columns:1fr;
  }
  .content-large,
  .content-wide{
    grid-column:auto;
    grid-row:auto;
  }
  .content-large{
    min-height:650px;
  }
  .content-large .content-visual{
    min-height:360px;
  }
  .rank-journey{
    grid-template-columns:repeat(4,1fr);
    row-gap:40px;
  }
  .rank-track{
    display:none;
  }
  .join-v12-card{
    grid-template-columns:1fr;
    gap:40px;
  }
}

@media(max-width:620px){
  .about-v12,
  .contents-v12,
  .ranks-v12,
  .join-v12{
    padding-left:22px;
    padding-right:22px;
  }
  .about-feature-main{
    padding:30px 26px;
  }
  .about-mini{
    padding:28px 24px;
  }
  .content-large{
    min-height:560px;
  }
  .content-large .content-visual{
    min-height:300px;
  }
  .content-wide-inner{
    display:block;
  }
  .content-visual-gathering{
    width:100%;
    margin-top:24px;
  }
  .rank-journey{
    grid-template-columns:repeat(2,1fr);
    row-gap:34px;
  }
  .join-v12-card{
    padding:42px 24px;
  }
  .join-server-btn small{
    display:none;
  }
}


/* =========================================================
   v13 · GIWA-inspired minimal redesign for The GIWA server
   ========================================================= */

:root{
  --g13-black:#050505;
  --g13-ink:#101010;
  --g13-white:#ffffff;
  --g13-soft:#f3f3f1;
  --g13-line:#d9d9d5;
  --g13-gray:#767676;
  --g13-red:#b4483d;
  --g13-pink:#e7b7bd;
}

/* HERO */
.hero13{
  min-height:100vh;
  padding:84px 4vw 34px;
  background:#f5f5f2;
  color:#080808;
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  grid-template-rows:1fr auto;
  gap:24px;
  overflow:hidden;
  position:relative;
}
.hero13-copy{
  align-self:center;
  padding:8vh 2vw 6vh 2vw;
  position:relative;
  z-index:3;
}
.hero13-eyebrow,.v13-small{
  margin:0;
  font-family:"JayeonSans",sans-serif;
  font-size:12px;
  font-weight:500;
  letter-spacing:.12em;
}
.hero13 h1{
  margin:27px 0 30px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-weight:700;
  letter-spacing:-.065em;
  line-height:.98;
}
.hero13 h1 span{
  display:block;
  font-size:clamp(38px,4.4vw,70px);
}
.hero13 h1 strong{
  display:block;
  font-family:"JeonjuWanpanbon","PyeojinGothic",sans-serif;
  font-weight:400;
  font-size:clamp(78px,9.6vw,158px);
  letter-spacing:-.035em;
}
.hero13-desc{
  margin:0;
  max-width:590px;
  color:#585858;
  font-size:15px;
  line-height:1.9;
}
.hero13-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:34px;
}
.hero13-copyip,.hero13-discord{
  min-width:205px;
  min-height:61px;
  border:1px solid #111;
  padding:12px 19px;
  cursor:pointer;
  transition:.2s ease;
}
.hero13-copyip{
  background:#050505;color:#fff;text-align:left;
}
.hero13-copyip span{display:block;color:#a8a8a8;font-size:10px;letter-spacing:.1em}
.hero13-copyip b{display:block;margin-top:5px;font-size:14px;letter-spacing:.04em}
.hero13-discord{
  background:#fff;color:#080808;display:grid;place-items:center;font-size:14px;
}
.hero13-copyip:hover,.hero13-discord:hover{transform:translateY(-2px)}

.hero13-art{
  position:relative;
  align-self:stretch;
  min-height:680px;
  background:#e9e9e6;
  overflow:hidden;
}
.hero13-art::before{
  content:"";
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(0,0,0,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(0,0,0,.035) 1px,transparent 1px);
  background-size:32px 32px;
}
.hero13-sun{
  position:absolute;
  width:min(31vw,460px);aspect-ratio:1;border-radius:50%;
  left:54%;top:9%;transform:translateX(-50%);
  background:var(--g13-red);
  opacity:.92;
}
.hero13-orbit{
  position:absolute;border:1px solid rgba(0,0,0,.14);border-radius:50%;
  left:54%;top:9%;transform:translateX(-50%);
}
.orbit-one{width:min(42vw,620px);aspect-ratio:1;margin-left:0;margin-top:-75px}
.orbit-two{width:min(52vw,780px);aspect-ratio:1;margin-left:0;margin-top:-155px}
.hero13-cloud{
  position:absolute;height:44px;border-radius:999px;background:#fff;opacity:.63;filter:blur(12px)
}
.cloud-one{width:235px;left:7%;top:28%;animation:h13Cloud 12s ease-in-out infinite alternate}
.cloud-two{width:315px;right:-5%;top:37%;animation:h13Cloud 18s ease-in-out infinite alternate-reverse}
.hero13-palace{
  position:absolute;left:0;right:0;bottom:0;width:100%;height:83%;z-index:2;
}
.h13-mountains path:first-child{fill:#d0d0cc}
.h13-mountains path:last-child{fill:#a8aaa5}
.h13-eave-low,.h13-eave-mid,.h13-eave-top{fill:#080808}
.h13-building{fill:#1c1c1b}
.h13-columns path{fill:none;stroke:#575753;stroke-width:7}
.h13-gate{fill:#a4473d}
.h13-gate-lines{fill:none;stroke:#d79288;stroke-width:4}
.h13-stone{fill:#575753}.h13-stone-bottom{fill:#2a2a28}
.hero13-label{
  position:absolute;right:22px;bottom:19px;z-index:4;
  font-size:10px;letter-spacing:.12em;color:#dededb;
}
.hero13-petals{position:absolute;inset:0;z-index:4;pointer-events:none}
.h13-petal{
  position:absolute;top:-20px;width:11px;height:7px;background:#edbdc5;
  border-radius:70% 30% 65% 35%;
  animation:h13Petal linear infinite;
}
.hero13-foot{
  grid-column:1/-1;
  display:flex;align-items:center;gap:18px;
  padding-top:9px;border-top:1px solid #c9c9c5;
  font-size:11px;color:#777;
}
.hero13-foot span{color:#111}
.hero13-foot p{margin:0}

@keyframes h13Cloud{to{transform:translateX(40px)}}
@keyframes h13Petal{
  from{transform:translate3d(0,-30px,0) rotate(0deg)}
  to{transform:translate3d(40px,110vh,0) rotate(420deg)}
}

/* STORY / ABOUT */
.story13{
  background:#fff;
  padding:150px 4vw 170px;
  color:#080808;
}
.story13-intro{
  max-width:1280px;margin:0 auto 105px;
}
.story13-intro h2{
  max-width:950px;
  margin:20px 0 0;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(48px,6.7vw,100px);
  line-height:1.05;
  letter-spacing:-.065em;
}
.story13-grid{
  max-width:1280px;margin:auto;
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid #111;
}
.story13-item{
  padding:25px 20px 0;
  border-right:1px solid #dadad7;
}
.story13-item:first-child{padding-left:0}
.story13-item:last-child{border-right:0;padding-right:0}
.story13-num{display:block;font-size:11px;margin-bottom:26px}
.story13-visual{
  height:340px;
  position:relative;overflow:hidden;
  display:grid;place-items:center;
}
.story13-visual-one{background:#050505}
.story13-visual-two{background:#eeeef0}
.story13-visual-three{background:#d7d9d5}
.story13-symbol{
  font-family:"Noto Serif KR",serif;
  color:#fff;font-size:150px;font-weight:900;
}
.story13-rings{
  width:220px;aspect-ratio:1;position:relative;border-radius:50%;
  border:1px solid #999;display:grid;place-items:center;
}
.story13-rings i{
  position:absolute;border-radius:50%;border:1px solid #aaa;
}
.story13-rings i:nth-child(1){width:300px;height:300px}
.story13-rings i:nth-child(2){width:145px;height:145px}
.story13-rings i:nth-child(3){width:72px;height:72px;background:#050505}
.story13-rings b{position:relative;color:#fff;z-index:2;font:700 24px "Noto Serif KR",serif}
.story13-steps{width:72%;display:flex;align-items:flex-end;gap:8px;height:70%}
.story13-steps span{flex:1;background:#111}
.story13-steps span:nth-child(1){height:22%}
.story13-steps span:nth-child(2){height:42%}
.story13-steps span:nth-child(3){height:67%}
.story13-steps span:nth-child(4){height:100%;background:var(--g13-red)}
.story13-text{padding:28px 0 34px}
.story13-text small{font-size:11px;color:#777}
.story13-text h3{
  margin:10px 0 16px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:28px;letter-spacing:-.04em
}
.story13-text p{margin:0;color:#666;line-height:1.85;font-size:14px}

/* CONTENTS */
.features13{
  background:#f1f1ef;
  padding:145px 4vw 165px;
}
.features13-head{
  max-width:1280px;margin:0 auto 75px;
}
.features13-head h2{
  max-width:940px;margin:20px 0 0;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(50px,6.7vw,100px);line-height:1.04;letter-spacing:-.065em
}
.features13-list{
  max-width:1280px;margin:auto;
  display:grid;grid-template-columns:1fr 1fr;gap:18px;
}
.feature13{
  min-height:620px;
  padding:34px;
  position:relative;
  display:flex;flex-direction:column;
  overflow:hidden;
}
.feature13-light{background:#fff;color:#050505}
.feature13-dark{background:#050505;color:#fff}
.feature13-copy{position:relative;z-index:2}
.feature13-copy>span{font-size:11px;display:inline-block;margin-right:16px}
.feature13-copy small{font-size:11px;color:#858585}
.feature13-copy h3{
  margin:64px 0 15px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(34px,4vw,54px);letter-spacing:-.05em
}
.feature13-copy p{margin:0;max-width:410px;font-size:14px;line-height:1.8;color:#777}
.feature13-dark .feature13-copy p{color:#999}
.feature13-art{
  flex:1;min-height:330px;position:relative;margin-top:35px;overflow:hidden;
}
.feature13-bigchar{
  position:absolute;right:4%;bottom:-16%;
  font:900 clamp(150px,20vw,300px)/1 "Noto Serif KR",serif;
  opacity:.06;
}
.feature13-dark .feature13-bigchar{color:#fff}
.mine-cube{
  position:absolute;width:120px;height:120px;border:2px solid #111;transform:rotate(30deg) skew(-8deg);
}
.cube-a{left:12%;top:28%;background:#ddd}
.cube-b{left:34%;top:7%;background:#aaa}
.cube-c{left:48%;top:38%;background:var(--g13-red)}
.farm-art{background:#101010}
.farm-lines{
  position:absolute;inset:0;
  background:repeating-linear-gradient(165deg,transparent 0 46px,rgba(255,255,255,.13) 46px 48px);
}
.farm-sun{position:absolute;width:170px;height:170px;border-radius:50%;background:var(--g13-red);right:13%;top:11%}
.fish-art{background:#ececeb}
.fish-ripple{
  position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);border:1px solid #111;border-radius:50%
}
.r1{width:110px;height:110px;background:#050505}
.r2{width:245px;height:245px}
.r3{width:410px;height:410px;border-color:#aaa}
.collect-art{background:#111}
.collect-node{
  position:absolute;border-radius:50%;background:#fff;width:24px;height:24px
}
.n1{left:18%;top:65%}.n2{left:49%;top:25%;background:var(--g13-red)}.n3{right:17%;top:56%}
.collect-path{position:absolute;height:1px;background:#777;transform-origin:left center}
.p1{left:20%;top:66%;width:240px;transform:rotate(-31deg)}
.p2{left:51%;top:28%;width:210px;transform:rotate(25deg)}

/* RANKS */
.ranks13{
  background:#050505;color:#fff;
  padding:155px 4vw 170px;
}
.ranks13-head{max-width:1280px;margin:0 auto 105px}
.v13-small-white{color:#aaa}
.ranks13-head h2{
  max-width:1050px;margin:20px 0 25px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(48px,6.6vw,98px);line-height:1.04;letter-spacing:-.065em
}
.ranks13-head>p:last-child{color:#888;font-size:14px}
.ranks13-road{max-width:1280px;margin:auto;position:relative}
.ranks13-row{
  display:grid;grid-template-columns:repeat(7,1fr);
}
.rank13{
  min-height:285px;padding:24px 18px;
  border-left:1px solid #292929;
  display:flex;flex-direction:column;
  position:relative;
}
.rank13:last-child{border-right:1px solid #292929}
.rank13 span{font-size:11px;color:#777}
.rank13 strong{
  margin-top:auto;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:28px;letter-spacing:-.04em
}
.rank13 small{color:#6f6f6f;margin-top:8px}
.rank13-final{background:#fff;color:#050505}
.rank13-final span,.rank13-final small{color:#777}
.rank13-final::before{
  content:"王";position:absolute;right:7px;top:-4px;
  font:900 130px "Noto Serif KR",serif;color:#f0f0ee
}
.rank13-line{
  height:1px;background:linear-gradient(90deg,#444,#fff);
}

/* START */
.start13{
  background:#fff;
  padding:150px 4vw 170px;
}
.start13-top{max-width:1280px;margin:0 auto 80px}
.start13-top h2{
  max-width:900px;margin:20px 0 0;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(54px,7vw,105px);line-height:1.02;letter-spacing:-.07em
}
.start13-actions{
  max-width:1280px;margin:auto;
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid #111;border-bottom:1px solid #111;
}
.start13-card{
  min-height:310px;padding:28px 25px;
  color:#050505;background:#fff;border:0;border-right:1px solid #ddd;
  text-align:left;display:flex;flex-direction:column;cursor:pointer;transition:.2s
}
.start13-card:last-child{border-right:0}
.start13-card:hover{background:#f0f0ee}
.start13-card span{font-size:11px}
.start13-card small{margin-top:62px;color:#777;font-size:11px}
.start13-card strong{
  margin-top:12px;font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:30px;letter-spacing:-.04em
}
.start13-card em{font-style:normal;margin-top:auto;font-size:12px;color:#777}

/* RESPONSIVE */
@media(max-width:1000px){
  .hero13{grid-template-columns:1fr;padding-top:72px}
  .hero13-art{min-height:620px}
  .hero13-foot{grid-column:auto}
  .story13-grid{grid-template-columns:1fr}
  .story13-item{border-right:0;border-bottom:1px solid #ddd;padding:25px 0}
  .story13-visual{height:420px}
  .features13-list{grid-template-columns:1fr}
  .ranks13-row{grid-template-columns:repeat(4,1fr);row-gap:1px}
  .rank13{border-bottom:1px solid #292929}
  .start13-actions{grid-template-columns:1fr}
  .start13-card{border-right:0;border-bottom:1px solid #ddd;min-height:230px}
  .start13-card:last-child{border-bottom:0}
}
@media(max-width:620px){
  .hero13{padding-left:20px;padding-right:20px}
  .hero13-copy{padding-left:0;padding-right:0}
  .hero13-art{min-height:500px}
  .hero13-desc br{display:none}
  .story13,.features13,.ranks13,.start13{padding-left:20px;padding-right:20px}
  .story13-visual{height:320px}
  .feature13{padding:25px;min-height:530px}
  .ranks13-row{grid-template-columns:repeat(2,1fr)}
  .rank13{min-height:210px}
}


/* =========================================================
   v14 · Interactive responsive rank selector
   ========================================================= */

.ranks13-row{
  align-items:stretch;
}

.rank13{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  min-width:0;
  color:#fff;
  background:transparent;
  border:0;
  border-left:1px solid #292929;
  border-radius:0;
  font:inherit;
  text-align:left;
  cursor:pointer;
  overflow:hidden;
  transition:
    background-color .22s ease,
    color .22s ease,
    transform .22s ease,
    border-color .22s ease;
}

.rank13:last-child{
  border-right:1px solid #292929;
}

.rank13::before{
  display:none;
}

.rank13-index{
  display:block;
  font-size:11px;
  color:#777;
  transition:color .22s ease;
}

.rank13-hanja{
  position:absolute;
  right:7px;
  top:-15px;
  font:900 132px/1 "Noto Serif KR",serif;
  color:transparent;
  opacity:0;
  pointer-events:none;
  transform:translateY(12px) scale(.94);
  transition:
    opacity .24s ease,
    transform .24s ease,
    color .24s ease;
}

.rank13:hover:not(.is-active){
  background:#111;
}

.rank13:focus-visible{
  outline:2px solid #fff;
  outline-offset:-3px;
  z-index:3;
}

.rank13.is-active{
  background:#fff;
  color:#050505;
  border-color:#fff;
}

.rank13.is-active .rank13-index,
.rank13.is-active small{
  color:#777;
}

.rank13.is-active .rank13-hanja{
  color:#efefed;
  opacity:1;
  transform:translateY(0) scale(1);
}

.rank13.is-active strong,
.rank13.is-active small,
.rank13.is-active .rank13-index{
  position:relative;
  z-index:2;
}

.rank13-status{
  margin-top:24px;
  min-height:84px;
  display:flex;
  align-items:center;
  gap:16px;
  border-top:1px solid #292929;
  color:#777;
  position:relative;
  overflow:hidden;
}

.rank13-status>span{
  font-size:11px;
  letter-spacing:.08em;
}

.rank13-status>strong{
  color:#fff;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:20px;
  letter-spacing:-.03em;
}

.rank13-status>b{
  margin-left:auto;
  font:900 66px/1 "Noto Serif KR",serif;
  color:#242424;
}

@media(max-width:1000px){
  .ranks13-row{
    grid-template-columns:repeat(4,1fr);
  }

  .rank13{
    min-height:235px;
    border-bottom:1px solid #292929;
  }

  .rank13:nth-child(4n){
    border-right:1px solid #292929;
  }

  .rank13-hanja{
    font-size:112px;
  }
}

@media(max-width:620px){
  .ranks13-row{
    grid-template-columns:repeat(2,1fr);
  }

  .rank13{
    min-height:190px;
    padding:20px 16px;
  }

  .rank13:nth-child(2n){
    border-right:1px solid #292929;
  }

  .rank13 strong{
    font-size:24px;
  }

  .rank13-hanja{
    right:2px;
    top:0;
    font-size:92px;
  }

  .rank13-status{
    min-height:70px;
    margin-top:18px;
  }

  .rank13-status>b{
    font-size:52px;
  }
}


/* =========================================================
   v16 · Hero title text + desktop stability
   ========================================================= */

.hero13-copy{
  min-width:0;
  max-width:720px;
}

.hero13 h1{
  width:100%;
  max-width:720px;
  overflow:visible;
}

.hero13 h1 span{
  display:block;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-weight:700;
  font-size:clamp(38px,4.15vw,68px);
  line-height:1.08;
  letter-spacing:-.055em;
  white-space:nowrap;
}

.hero13 h1 strong{
  display:block;
  margin-top:8px;
  font-family:"JeonjuWanpanbon","Noto Serif KR",serif !important;
  font-weight:400 !important;
  font-size:clamp(104px,10.5vw,176px);
  line-height:.88;
  letter-spacing:-.015em;
  white-space:nowrap;
  word-break:keep-all;
  overflow:visible;
}

/* Keep the two-column hero stable on ordinary PC resolutions */
@media(min-width:1001px){
  .hero13{
    grid-template-columns:minmax(430px,.86fr) minmax(560px,1.14fr);
  }

  .hero13-copy{
    padding-left:1.2vw;
    padding-right:1.8vw;
  }

  .hero13-art{
    min-width:0;
  }
}

/* Medium desktop / small laptop */
@media(min-width:1001px) and (max-width:1280px){
  .hero13{
    grid-template-columns:minmax(390px,.9fr) minmax(500px,1.1fr);
  }

  .hero13 h1 span{
    font-size:clamp(36px,4vw,54px);
  }

  .hero13 h1 strong{
    font-size:clamp(92px,9.2vw,132px);
  }

  .hero13-desc{
    max-width:520px;
  }

  .hero13-copyip,
  .hero13-discord{
    min-width:190px;
  }
}

/* Tablet */
@media(max-width:1000px){
  .hero13 h1 span{
    white-space:normal;
  }

  .hero13 h1 strong{
    white-space:normal;
  }
}

/* Mobile */
@media(max-width:620px){
  .hero13 h1{
    margin-top:22px;
    margin-bottom:24px;
  }

  .hero13 h1 span{
    font-size:clamp(32px,10vw,46px);
  }

  .hero13 h1 strong{
    margin-top:7px;
    font-size:clamp(84px,27vw,122px);
    line-height:.9;
  }
}


/* =========================================================
   v17 · Exact Jeonju title rendering across PC/mobile
   ========================================================= */

.sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

.hero13 h1 .hero13-giwa-title{
  display:block;
  margin-top:8px;
  width:100%;
  max-width:480px;
  line-height:1;
  color:#080808;
  overflow:visible;
  font-size:0 !important;
}

.hero13-giwa-svg{
  display:block;
  width:clamp(270px,27vw,455px);
  height:auto;
  max-width:100%;
  overflow:visible;
  fill:currentColor;
}

/* Desktop: keep the exact vector title fully inside the copy column */
@media(min-width:1001px){
  .hero13 h1 .hero13-giwa-title{
    max-width:100%;
  }

  .hero13-giwa-svg{
    width:min(100%,455px);
  }
}

/* Small desktop/laptop */
@media(min-width:1001px) and (max-width:1280px){
  .hero13-giwa-svg{
    width:min(100%,390px);
  }
}

/* Tablet */
@media(max-width:1000px){
  .hero13-giwa-svg{
    width:min(58vw,420px);
  }
}

/* Mobile */
@media(max-width:620px){
  .hero13-giwa-svg{
    width:min(72vw,330px);
  }
}


/* v18 cleanup: selected rank status removed */
.rank13-status{
  display:none !important;
}


/* =========================================================
   v19 · YouTube cinematic hero background
   starts at 15:51 (951 seconds)
   ========================================================= */
.hero13-video-mode{
  position:relative;
  isolation:isolate;
  background:#050505;
  color:#fff;
  min-height:100vh;
}

.hero13-video-bg{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  background:#050505;
}

.hero13-video-bg iframe{
  position:absolute;
  top:50%;
  left:50%;
  width:max(100vw,177.77777778vh);
  height:max(56.25vw,100vh);
  min-width:100%;
  min-height:100%;
  transform:translate(-50%,-50%) scale(1.04);
  border:0;
  pointer-events:none;
}

.hero13-video-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg,
      rgba(0,0,0,.82) 0%,
      rgba(0,0,0,.66) 36%,
      rgba(0,0,0,.24) 67%,
      rgba(0,0,0,.28) 100%
    ),
    linear-gradient(180deg,
      rgba(0,0,0,.24) 0%,
      rgba(0,0,0,.06) 50%,
      rgba(0,0,0,.62) 100%
    );
}

.hero13-video-mode .hero13-copy{
  position:relative;
  z-index:4;
}

.hero13-video-mode .hero13-eyebrow{
  color:rgba(255,255,255,.76);
}

.hero13-video-mode h1,
.hero13-video-mode h1 span,
.hero13-video-mode h1 strong,
.hero13-video-mode .hero13-giwa-title{
  color:#fff;
}

.hero13-video-mode .hero13-giwa-svg{
  fill:#fff;
}

.hero13-video-mode .hero13-desc{
  color:rgba(255,255,255,.78);
}

.hero13-video-mode .hero13-copyip{
  background:#fff;
  color:#050505;
  border-color:#fff;
}

.hero13-video-mode .hero13-copyip span{
  color:#6a6a6a;
}

.hero13-video-mode .hero13-discord{
  background:rgba(5,5,5,.36);
  color:#fff;
  border-color:rgba(255,255,255,.68);
  backdrop-filter:blur(8px);
}

.hero13-video-mode .hero13-discord:hover{
  background:rgba(5,5,5,.58);
}

.hero13-video-mode .hero13-art{
  opacity:0;
  pointer-events:none;
}

.hero13-video-mode .hero13-foot{
  position:relative;
  z-index:4;
  color:rgba(255,255,255,.66);
  border-top-color:rgba(255,255,255,.22);
}

.hero13-video-mode .hero13-foot span{
  color:#fff;
}

@media(min-width:1001px){
  .hero13-video-mode{
    grid-template-columns:minmax(500px,.88fr) minmax(520px,1.12fr);
  }
}

@media(max-width:1000px){
  .hero13-video-mode{
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    padding-top:100px;
  }

  .hero13-video-mode .hero13-copy{
    margin-top:auto;
    padding-bottom:60px;
  }

  .hero13-video-mode .hero13-art{
    display:none;
  }

  .hero13-video-overlay{
    background:
      linear-gradient(180deg,
        rgba(0,0,0,.30) 0%,
        rgba(0,0,0,.38) 45%,
        rgba(0,0,0,.86) 100%
      );
  }
}

@media(max-width:620px){
  .hero13-video-bg iframe{
    transform:translate(-50%,-50%) scale(1.18);
  }

  .hero13-video-mode .hero13-copy{
    padding-bottom:38px;
  }
}

@media(prefers-reduced-motion: reduce){
  .hero13-video-bg{
    opacity:.5;
  }
}


/* =========================================================
   v20 · Ranking / Donate subpages
   ========================================================= */

.nav-v10 a.is-current::after{
  width:100%;
}

.subpage{
  background:#f3f3f1;
  color:#080808;
}

.subpage-main{
  min-height:100vh;
  padding-top:84px;
}

.subhero{
  min-height:430px;
  padding:110px 4vw 75px;
  background:#050505;
  color:#fff;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}

.subhero-kicker{
  margin:0 0 20px;
  color:#8a8a8a;
  font-size:12px;
  letter-spacing:.15em;
}

.subhero h1{
  margin:0;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(64px,8vw,126px);
  line-height:.92;
  letter-spacing:-.07em;
}

.subhero>p:last-child{
  margin:28px 0 0;
  color:#9b9b9b;
  font-size:15px;
}

.ranking-section,
.donate-section{
  padding:95px 4vw 140px;
  max-width:1380px;
  margin:0 auto;
}

.ranking-controls{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:30px;
  margin-bottom:28px;
}

.ranking-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.ranking-tab{
  min-width:98px;
  height:44px;
  border:1px solid #bdbdb8;
  background:transparent;
  color:#656565;
  cursor:pointer;
  transition:.18s;
}

.ranking-tab:hover,
.ranking-tab.is-active{
  background:#050505;
  color:#fff;
  border-color:#050505;
}

.ranking-updated{
  color:#888;
  font-size:11px;
}

.ranking-board{
  border-top:1px solid #111;
  border-bottom:1px solid #111;
  background:#fff;
}

.ranking-head{
  display:grid;
  grid-template-columns:110px 1fr 220px;
  padding:19px 22px;
  border-bottom:1px solid #ddd;
  color:#737373;
  font-size:11px;
}

.ranking-empty{
  min-height:430px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:50px 20px;
}

.ranking-empty-mark{
  font:900 116px/1 "Noto Serif KR",serif;
  color:#e8e8e5;
}

.ranking-empty strong{
  margin-top:18px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:28px;
}

.ranking-empty p{
  max-width:480px;
  color:#777;
  line-height:1.8;
  font-size:14px;
}

.ranking-note{
  margin-top:26px;
  display:flex;
  gap:20px;
  color:#777;
  font-size:12px;
  line-height:1.7;
}

.ranking-note span{color:#111}
.ranking-note p{margin:0}

.donate-subhero{
  background:#ececea;
  color:#050505;
}

.donate-subhero .subhero-kicker,
.donate-subhero>p:last-child{
  color:#777;
}

.donate-intro{
  max-width:850px;
  margin-bottom:70px;
}

.donate-intro>span{
  font-size:11px;
}

.donate-intro h2{
  margin:20px 0;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(46px,6vw,82px);
  letter-spacing:-.055em;
}

.donate-intro p{
  color:#6b6b6b;
  line-height:1.9;
}

.donate-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid #111;
  border-bottom:1px solid #111;
}

.donate-card{
  min-height:430px;
  padding:28px;
  display:flex;
  flex-direction:column;
  border-right:1px solid #ddd;
  background:#fff;
}

.donate-card:last-child{
  border-right:0;
}

.donate-card-dark{
  background:#050505;
  color:#fff;
  border-color:#050505;
}

.donate-no{
  font-size:11px;
}

.donate-card small{
  margin-top:75px;
  color:#777;
  font-size:11px;
  letter-spacing:.1em;
}

.donate-card h3{
  margin:13px 0 16px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:34px;
  letter-spacing:-.045em;
}

.donate-card p{
  margin:0;
  color:#777;
  line-height:1.8;
  font-size:14px;
}

.donate-card-dark p{
  color:#999;
}

.donate-card a,
.donate-coming{
  margin-top:auto;
  font-size:12px;
  color:#777;
}

.donate-card a{
  border-bottom:1px solid #aaa;
  padding-bottom:4px;
  align-self:flex-start;
}

.donate-card-dark .donate-coming{
  color:#fff;
}

.donate-business{
  margin-top:45px;
  padding-top:24px;
  border-top:1px solid #d0d0cc;
  display:flex;
  gap:10px 24px;
  flex-wrap:wrap;
  color:#797979;
  font-size:12px;
}

.donate-business p{
  margin:0;
}

@media(max-width:900px){
  .subpage-main{
    padding-top:72px;
  }

  .subhero{
    min-height:360px;
    padding:90px 22px 55px;
  }

  .ranking-section,
  .donate-section{
    padding:70px 22px 105px;
  }

  .ranking-controls{
    display:block;
  }

  .ranking-updated{
    display:block;
    margin-top:16px;
  }

  .donate-grid{
    grid-template-columns:1fr;
  }

  .donate-card{
    border-right:0;
    border-bottom:1px solid #ddd;
    min-height:340px;
  }

  .donate-card:last-child{
    border-bottom:0;
  }
}

@media(max-width:560px){
  .ranking-head{
    grid-template-columns:70px 1fr 90px;
    padding-left:12px;
    padding-right:12px;
  }

  .ranking-tabs{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .ranking-tab{
    width:100%;
  }
}


/* =========================================================
   v21 · In-game donation process
   ========================================================= */

.donate-intro-v21{
  margin-bottom:54px;
}

.donation-process{
  border-top:1px solid #111;
}

.donation-step{
  display:grid;
  grid-template-columns:115px 1fr;
  min-height:220px;
  border-bottom:1px solid #cfcfca;
  background:#fff;
}

.donation-step-num{
  padding:30px 22px;
  border-right:1px solid #ddd;
  font-size:12px;
  color:#6f6f6f;
}

.donation-step-body{
  padding:30px 34px 36px;
}

.donation-step-body small{
  display:block;
  margin-bottom:28px;
  color:#777;
  font-size:11px;
  letter-spacing:.1em;
}

.donation-step-body h3{
  margin:0 0 16px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(27px,3vw,42px);
  line-height:1.25;
  letter-spacing:-.045em;
}

.donation-step-body p{
  margin:0;
  max-width:760px;
  color:#6e6e6e;
  font-size:14px;
  line-height:1.9;
}

.donation-step-body p strong{
  color:#111;
  font-weight:500;
}

.donation-step-final{
  background:#050505;
  color:#fff;
  border-bottom-color:#050505;
}

.donation-step-final .donation-step-num{
  border-right-color:#292929;
  color:#888;
}

.donation-step-final .donation-step-body p{
  color:#9b9b9b;
}

.donation-step-final .donation-step-body p strong{
  color:#fff;
}

.donation-command-box{
  margin-top:28px;
  min-height:120px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding:24px 30px;
  background:#e7e7e3;
  border:1px solid #d2d2cd;
}

.donation-command-box span{
  display:block;
  margin-bottom:8px;
  color:#777;
  font-size:10px;
  letter-spacing:.12em;
}

.donation-command-box strong{
  font-family:"JayeonSans",sans-serif;
  font-size:clamp(20px,2.4vw,30px);
  font-weight:500;
  letter-spacing:-.02em;
}

.donation-command-box p{
  margin:0;
  color:#777;
  font-size:12px;
}

.donation-command-box b{
  color:#111;
  font-weight:500;
}

.donation-terms{
  margin-top:86px;
  display:grid;
  grid-template-columns:190px 1fr;
  background:#8f3e36;
  color:#fff;
  min-height:360px;
}

.donation-terms-mark{
  display:grid;
  place-items:center;
  border-right:1px solid rgba(255,255,255,.18);
  font:900 96px/1 "Noto Serif KR",serif;
  color:rgba(255,255,255,.2);
}

.donation-terms-copy{
  padding:46px 50px;
}

.donation-terms-copy>span{
  font-size:11px;
  color:rgba(255,255,255,.66);
  letter-spacing:.08em;
}

.donation-terms-copy h3{
  max-width:860px;
  margin:18px 0 22px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(29px,3.4vw,48px);
  line-height:1.35;
  letter-spacing:-.05em;
}

.donation-terms-copy p{
  max-width:850px;
  margin:0;
  color:rgba(255,255,255,.76);
  font-size:13px;
  line-height:1.9;
}

.donation-terms-links{
  margin-top:28px;
  display:flex;
  gap:22px;
  flex-wrap:wrap;
}

.donation-terms-links a{
  color:#fff;
  font-size:12px;
  border-bottom:1px solid rgba(255,255,255,.5);
  padding-bottom:4px;
}

.donation-help{
  min-height:150px;
  padding:28px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  border-bottom:1px solid #111;
}

.donation-help span{
  color:#777;
  font-size:11px;
}

.donation-help h3{
  margin:10px 0 0;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:24px;
  letter-spacing:-.035em;
}

.donation-help>a{
  flex:0 0 auto;
  min-width:180px;
  padding:16px 20px;
  text-align:center;
  background:#050505;
  color:#fff;
  font-size:12px;
}

@media(max-width:720px){
  .donation-step{
    grid-template-columns:64px 1fr;
  }

  .donation-step-num{
    padding:26px 14px;
  }

  .donation-step-body{
    padding:26px 22px 30px;
  }

  .donation-command-box{
    display:block;
  }

  .donation-command-box p{
    margin-top:18px;
  }

  .donation-terms{
    grid-template-columns:1fr;
  }

  .donation-terms-mark{
    min-height:110px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.18);
  }

  .donation-terms-copy{
    padding:34px 24px 38px;
  }

  .donation-help{
    display:block;
  }

  .donation-help>a{
    display:block;
    margin-top:22px;
  }
}


/* =========================================================
   v22 · Uploaded GIWA icon
   ========================================================= */

.brand-image-logo,
.footer-image-logo{
  overflow:hidden;
  background:#050505 !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
}

.brand-image-logo img,
.footer-image-logo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.brand-image-logo i,
.footer-image-logo i{
  display:none !important;
}

.brand-image-logo{
  width:38px !important;
  height:38px !important;
  border-radius:2px;
  flex:0 0 38px;
}

.footer-image-logo{
  width:44px !important;
  height:44px !important;
  border-radius:2px;
  flex:0 0 44px;
}

@media(max-width:620px){
  .brand-image-logo{
    width:34px !important;
    height:34px !important;
    flex-basis:34px;
  }
}


/* =========================================================
   v26 · Header / footer Korean wordmark
   ========================================================= */

.brand-name-ko{
  font-family:"JeonjuWanpanbon","Noto Serif KR",serif !important;
  font-weight:400 !important;
  font-size:28px !important;
  letter-spacing:-0.03em !important;
  line-height:1;
  color:#fff;
  display:inline-block;
  transform:translateY(1px);
}

.footer-wordmark-ko{
  font-family:"JeonjuWanpanbon","Noto Serif KR",serif !important;
  font-weight:400 !important;
  font-size:30px !important;
  letter-spacing:-0.03em !important;
  line-height:1;
}

@media(max-width:900px){
  .brand-name-ko{
    font-size:25px !important;
  }
}

@media(max-width:560px){
  .brand-name-ko{
    font-size:23px !important;
  }

  .footer-wordmark-ko{
    font-size:28px !important;
  }
}


/* =========================================================
   v27 · Exact SVG wordmark for header/footer
   ========================================================= */

.brand-name-svg,
.footer-wordmark-svg{
  display:inline-flex !important;
  align-items:center;
  line-height:1;
  font-size:0 !important;
  letter-spacing:0 !important;
  color:inherit;
}

.brand-name-svg img,
.footer-wordmark-svg img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}

/* Header logo balance */
.brand{
  gap:12px !important;
}

.brand-name-svg{
  width:68px;
  transform:translateY(1px);
  flex:0 0 auto;
}

.brand-name-svg img{
  max-width:68px;
}

/* Footer logo balance */
.footer-logo{
  gap:12px !important;
  align-items:center !important;
}

.footer-wordmark-svg{
  width:74px;
  transform:translateY(1px);
  flex:0 0 auto;
}

.footer-wordmark-svg img{
  max-width:74px;
}

/* Disable old korean text styling if still present */
.brand-name-ko,
.footer-wordmark-ko{
  font-size:0 !important;
}

@media(max-width:900px){
  .brand{
    gap:10px !important;
  }

  .brand-name-svg{
    width:62px;
  }

  .brand-name-svg img{
    max-width:62px;
  }
}

@media(max-width:560px){
  .brand-name-svg{
    width:58px;
    transform:translateY(0);
  }

  .brand-name-svg img{
    max-width:58px;
  }

  .footer-wordmark-svg{
    width:68px;
  }

  .footer-wordmark-svg img{
    max-width:68px;
  }
}


/* =========================================================
   v28 · Wordmark color + scale correction
   ========================================================= */

.brand{
  gap:9px !important;
}

.brand-name-svg{
  width:49px !important;
  max-width:49px !important;
  transform:translateY(0) !important;
}

.brand-name-svg img{
  width:49px !important;
  max-width:49px !important;
  height:auto !important;
}

.footer-logo{
  gap:10px !important;
}

.footer-wordmark-svg{
  width:54px !important;
  max-width:54px !important;
  transform:translateY(0) !important;
}

.footer-wordmark-svg img{
  width:54px !important;
  max-width:54px !important;
  height:auto !important;
}

@media(max-width:900px){
  .brand-name-svg,
  .brand-name-svg img{
    width:46px !important;
    max-width:46px !important;
  }
}

@media(max-width:560px){
  .brand{
    gap:8px !important;
  }

  .brand-name-svg,
  .brand-name-svg img{
    width:43px !important;
    max-width:43px !important;
  }

  .footer-wordmark-svg,
  .footer-wordmark-svg img{
    width:50px !important;
    max-width:50px !important;
  }
}


/* =========================================================
   v29 · Original GIWA brand restored + Market page
   ========================================================= */

/* Restore original brand lockup after v22-v28 overrides */
.brand{
  gap:12px !important;
}

.brand-seal-logo{
  width:34px !important;
  height:34px !important;
  flex:0 0 34px !important;
  overflow:visible !important;
  background:transparent !important;
}

.brand-name-en{
  display:inline-block !important;
  width:auto !important;
  max-width:none !important;
  font-family:"JayeonSans",sans-serif !important;
  font-size:20px !important;
  font-weight:500 !important;
  letter-spacing:.08em !important;
  line-height:1 !important;
  color:#fff !important;
  transform:none !important;
}

.footer-logo{
  gap:12px !important;
  align-items:center !important;
}

.footer-symbol{
  width:38px !important;
  height:38px !important;
  flex:0 0 38px !important;
  overflow:visible !important;
  background:transparent !important;
}

.footer-wordmark{
  display:inline-block !important;
  width:auto !important;
  max-width:none !important;
  font-family:"JayeonSans",sans-serif !important;
  font-size:22px !important;
  font-weight:500 !important;
  letter-spacing:.08em !important;
  line-height:1 !important;
  color:#fff !important;
  transform:none !important;
}

.brand-image-logo,
.footer-image-logo,
.brand-name-svg,
.footer-wordmark-svg{
  width:auto;
  max-width:none;
}

/* Market page */
.market-subhero{
  background:#050505;
}

.market-section{
  max-width:1400px;
  margin:0 auto;
  padding:74px 4vw 150px;
}

.market-toolbar{
  display:flex;
  align-items:flex-end;
  gap:18px;
  margin-bottom:20px;
}

.market-search-wrap{
  min-width:280px;
}

.market-search-wrap label{
  display:block;
  margin-bottom:8px;
  font-size:10px;
  color:#777;
  letter-spacing:.12em;
}

.market-select{
  width:100%;
  height:50px;
  padding:0 15px;
  border:1px solid #c8c8c3;
  background:#fff;
  color:#111;
  font-family:"JayeonSans",sans-serif;
  font-size:14px;
}

.market-periods{
  display:flex;
  gap:6px;
}

.market-period{
  width:66px;
  height:50px;
  border:1px solid #c8c8c3;
  background:transparent;
  cursor:pointer;
  color:#777;
}

.market-period.is-active,
.market-period:hover{
  background:#050505;
  color:#fff;
  border-color:#050505;
}

.market-demo-badge{
  margin-left:auto;
  padding:9px 12px;
  background:#ece4d4;
  font-size:10px;
  color:#796a50;
  letter-spacing:.08em;
}

.market-summary{
  display:grid;
  grid-template-columns:1.35fr repeat(3,1fr);
  border-top:1px solid #111;
  border-bottom:1px solid #111;
  background:#fff;
}

.market-stat{
  min-height:145px;
  padding:27px 24px;
  border-right:1px solid #ddd;
}

.market-stat:last-child{
  border-right:0;
}

.market-stat small{
  display:block;
  color:#777;
  font-size:10px;
  margin-bottom:24px;
}

.market-stat strong{
  display:block;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:clamp(24px,2.5vw,36px);
  letter-spacing:-.045em;
}

.market-stat-main{
  background:#050505;
  color:#fff;
}

.market-stat-main small{
  color:#888;
}

.market-stat-main span{
  display:block;
  margin-top:8px;
  font-size:12px;
}

.price-up{color:#d06c5f}
.price-down{color:#6b8fb8}

.market-main-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 315px;
  gap:18px;
  margin-top:18px;
}

.market-chart-panel{
  background:#fff;
  border:1px solid #dededa;
  padding:28px 30px 30px;
}

.market-panel-head{
  display:flex;
  justify-content:space-between;
  gap:25px;
  align-items:flex-start;
}

.market-panel-head small,
.trade-history-head small,
.market-side-block>small{
  color:#777;
  font-size:10px;
  letter-spacing:.12em;
}

.market-panel-head h2,
.trade-history-head h2{
  margin:9px 0 0;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:30px;
  letter-spacing:-.04em;
}

.market-chart-legend{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:11px;
  color:#777;
}

.legend-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#111;
}

.market-chart-wrap{
  display:grid;
  grid-template-columns:62px 1fr;
  grid-template-rows:370px 30px;
  margin-top:28px;
}

.market-ylabels{
  display:flex;
  flex-direction:column-reverse;
  justify-content:space-between;
  padding:12px 10px 13px 0;
  text-align:right;
  color:#999;
  font-size:10px;
}

.market-chart{
  width:100%;
  height:370px;
  overflow:visible;
}

.chart-grid line{
  stroke:#e1e1de;
  stroke-width:1;
}

.market-line{
  fill:none;
  stroke:#111;
  stroke-width:3;
  vector-effect:non-scaling-stroke;
}

.market-area-path{
  fill:url(#marketArea);
}

.chart-point{
  fill:#fff;
  stroke:#111;
  stroke-width:2;
  vector-effect:non-scaling-stroke;
}

.chart-point.last{
  fill:#111;
}

.market-xlabels{
  grid-column:2;
  display:flex;
  justify-content:space-between;
  color:#999;
  font-size:10px;
  padding-top:8px;
}

.market-side{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.market-side-block{
  background:#fff;
  border:1px solid #dededa;
  padding:27px 25px;
}

.market-dl{
  margin:28px 0 0;
}

.market-dl div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:15px 0;
  border-top:1px solid #e5e5e1;
}

.market-dl dt{
  color:#777;
  font-size:11px;
}

.market-dl dd{
  margin:0;
  font-weight:500;
  font-size:13px;
}

.market-side-dark{
  flex:1;
  background:#050505;
  color:#fff;
  border-color:#050505;
}

.market-side-dark h3{
  margin:32px 0 14px;
  font-family:"PyeojinGothic","JayeonSans",sans-serif;
  font-size:25px;
  line-height:1.35;
}

.market-side-dark p{
  margin:0;
  color:#939393;
  font-size:12px;
  line-height:1.8;
}

.trade-history{
  margin-top:70px;
}

.trade-history-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin-bottom:22px;
}

.trade-history-head>span{
  color:#777;
  font-size:12px;
}

.trade-table-wrap{
  overflow-x:auto;
  border-top:1px solid #111;
  border-bottom:1px solid #111;
  background:#fff;
}

.trade-table{
  width:100%;
  min-width:820px;
  border-collapse:collapse;
}

.trade-table th{
  padding:17px 18px;
  text-align:left;
  color:#777;
  font-size:10px;
  font-weight:400;
  border-bottom:1px solid #ddd;
}

.trade-table td{
  padding:20px 18px;
  font-size:12px;
  border-bottom:1px solid #ecece8;
}

.trade-table tbody tr:last-child td{
  border-bottom:0;
}

.trade-table td:nth-child(4),
.trade-table td:nth-child(5){
  font-variant-numeric:tabular-nums;
}

.trade-type{
  display:inline-flex;
  min-width:46px;
  height:25px;
  align-items:center;
  justify-content:center;
  border:1px solid #bbb;
  font-size:10px;
}

.trade-type.buy{
  background:#111;
  border-color:#111;
  color:#fff;
}

.trade-type.sell{
  color:#777;
}

.market-bottom-note{
  display:flex;
  gap:14px;
  padding-top:25px;
  color:#777;
  font-size:11px;
  line-height:1.7;
}

.market-bottom-note p{
  margin:0;
}

@media(max-width:1000px){
  .market-main-grid{
    grid-template-columns:1fr;
  }

  .market-side{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .market-summary{
    grid-template-columns:1fr 1fr;
  }

  .market-stat:nth-child(2){
    border-right:0;
  }

  .market-stat:nth-child(-n+2){
    border-bottom:1px solid #ddd;
  }
}

@media(max-width:720px){
  .market-section{
    padding:55px 20px 100px;
  }

  .market-toolbar{
    display:grid;
    grid-template-columns:1fr;
  }

  .market-search-wrap{
    min-width:0;
  }

  .market-demo-badge{
    margin-left:0;
    justify-self:start;
  }

  .market-summary{
    grid-template-columns:1fr;
  }

  .market-stat{
    min-height:120px;
    border-right:0 !important;
    border-bottom:1px solid #ddd;
  }

  .market-stat:last-child{
    border-bottom:0;
  }

  .market-chart-panel{
    padding:24px 16px 22px;
  }

  .market-chart-wrap{
    grid-template-columns:48px 1fr;
    grid-template-rows:300px 28px;
  }

  .market-chart{
    height:300px;
  }

  .market-side{
    grid-template-columns:1fr;
  }

  .market-panel-head{
    display:block;
  }

  .market-chart-legend{
    margin-top:12px;
  }
}

@media(max-width:620px){
  .brand{
    gap:10px !important;
  }

  .brand-seal-logo{
    width:32px !important;
    height:32px !important;
    flex-basis:32px !important;
  }

  .brand-name-en{
    font-size:18px !important;
  }

  .footer-symbol{
    width:36px !important;
    height:36px !important;
    flex-basis:36px !important;
  }

  .footer-wordmark{
    font-size:20px !important;
  }
}