/* Illustrated ElakoS theme — artwork and proportions from the approved layout. */
.scroll-home { font-family: Georgia, "Times New Roman", serif; }
.theme-scroll .scroll-header {
  position:absolute; top:0; left:6%; width:88%; height:66px;
  padding:2px 3%; gap:24px;
  background:#1b1b19 url(images/ranking-art.webp) center/350% auto;
  border-bottom:1px solid #ad8a51;
  box-shadow:0 3px 10px #1b160d52;
}
.theme-scroll .scroll-brand { width:136px; height:64px; }
.theme-scroll .scroll-brand img { width:136px; height:72px; }
.theme-scroll .scroll-navigation { gap:clamp(12px,1.6vw,26px); }
.theme-scroll .scroll-navigation a { font:14px Georgia,serif; padding:18px 0; }
.theme-scroll .scroll-header-actions { gap:20px; }
.theme-scroll .scroll-preferences {
  position:absolute; top:76px; right:7%; min-height:0;
  padding:5px 10px; gap:14px; background:#24221bc9;
  border:1px solid #a88a5452; box-shadow:0 2px 8px #0002;
}
.theme-scroll .site-theme-switch,.theme-scroll .scroll-motion-toggle { font-size:10px; }
.theme-scroll .site-theme-switch button { font-size:10px; padding:2px 8px; }
.theme-scroll .site-theme-switch__label { display:none; }
.scroll-button {
  border:0; background:transparent url(images/button-crimson.webp) center/100% 100% no-repeat;
  box-shadow:none; min-height:56px; padding:15px 28px;
  color:#f9e9c9; text-shadow:0 1px 2px #180903;
  filter:drop-shadow(0 3px 3px #2b160c30);
}
.scroll-button:hover { filter:brightness(1.18) drop-shadow(0 3px 5px #2b160c40); }
.scroll-button--small { min-height:40px; padding:10px 22px; }
.scroll-button--paper {
  background:linear-gradient(#211e1aee,#211e1aee),url(images/paper.webp);
  border:1px solid #b79661; box-shadow:inset 0 0 0 3px #30241b,inset 0 0 0 4px #99763e;
  color:#efdcbb; min-height:52px; position:relative;
}
.scroll-button--paper svg { width:18px; height:18px; fill:#d6ba8e; }
.scroll-hero {
  height:clamp(640px,55vw,960px); min-height:0;
  background:#bbae97;
}
.scroll-hero-scenery { background-position:center bottom; }
.scroll-hero:before {
  background:radial-gradient(ellipse at 50% 35%,#f4e7d469,transparent 46%),linear-gradient(0deg,#28231b26,transparent 25%);
}
.scroll-hero:after {
  height:clamp(90px,12vw,190px); bottom:-42px;
  background:url(images/ink-transition.webp) center top/100% 100% no-repeat;
  clip-path:none;
}
.scroll-hero-copy { width:57%; max-width:880px; padding:82px 5px 20px; }
.scroll-hero-logo { width:clamp(290px,27vw,460px); height:clamp(170px,16vw,274px); margin-bottom:0; }
.scroll-hero h1 { font-size:clamp(26px,2.35vw,42px); font-weight:600; margin-bottom:10px; }
.scroll-hero-facts { font:clamp(14px,1.4vw,20px) Georgia,serif; margin-bottom:19px; }
.scroll-launch {
  width:max-content; max-width:100%; margin:0 auto;
  padding:12px 0 0; font-size:clamp(14px,1.4vw,21px);
  border-top:1px solid #85312465; font-weight:600;
}
.scroll-hero-buttons { margin:22px 0 12px; gap:14px; }
.scroll-hero-buttons .scroll-button { min-width:215px; font-size:16px; }
.scroll-platforms { display:flex; align-items:center; justify-content:center; gap:10px; font:15px Georgia,serif; }
.scroll-platforms span { margin:0 1px; }
.scroll-platforms svg { width:21px; height:23px; fill:#293238; }
.scroll-shared-world { margin-top:9px; font-size:16px; }
.scroll-explore { margin-top:30px; font:14px Georgia,serif; }
.scroll-hero .scroll-character { width:32%; height:96%; bottom:0; }
.scroll-hero .scroll-character--warrior { left:0; }
.scroll-hero .scroll-character--ninja { right:-1%; height:92%; }
.scroll-standard--shinsoo { left:7%; top:12%; width:18%; height:62%; transform:rotate(-8deg); }
.scroll-standard--chunjo { left:21%; top:25%; width:8.5%; height:33%; }
.scroll-standard--jinno { right:18%; top:24%; width:9%; height:35%; }
.scroll-presentation {
  min-height:0; height:clamp(345px,29vw,515px);
  margin-top:-30px; mask-image:linear-gradient(transparent,#000 34px);
  padding:38px 20%; gap:34px; grid-template-columns:1fr 1fr;
  background:url(images/ink-paper.webp) center/100% 100% no-repeat;
}
.scroll-presentation h2 { font-size:clamp(30px,3.1vw,50px); margin:0 0 10px; line-height:1.05; }
.scroll-presentation .scroll-eyebrow { font:13px Georgia,serif; letter-spacing:.11em; margin-bottom:10px; }
.scroll-presentation p:not(.scroll-eyebrow) { font-size:16px; line-height:1.4; margin-bottom:16px; }
.scroll-presentation .scroll-button { font-size:15px; padding:15px 25px; min-height:57px; }
.scroll-presentation-address { margin-top:6px; font-size:14px; text-align:center; }
.scroll-presentation .scroll-character {
  width:29%; height:125%; bottom:-4%; overflow:hidden;
}
.scroll-presentation .scroll-character--sura { left:-4%; }
.scroll-presentation .scroll-character--shaman { right:-4%; }
.scroll-presentation .scroll-character img { height:137%; object-fit:cover; object-position:center top; }
.scroll-presentation .scroll-character-hint { bottom:12%; }
.scroll-preview {
  aspect-ratio:16/10; border:0; box-shadow:none; overflow:visible;
  margin-inline:-8px; width:calc(100% + 16px);
}
.scroll-preview>img { position:absolute; top:11%; left:8%; width:84%; height:79%; object-fit:cover; }
.scroll-preview:before {
  content:''; position:absolute; inset:0; z-index:3; pointer-events:none;
  background:url(images/video-frame.webp) center/100% 100% no-repeat;
}
.scroll-preview:after { inset:11% 8% 10%; }
.scroll-preview-caption { bottom:16%; font-size:11px; padding-inline:22px; }
.scroll-play { width:65px; height:65px; }
.scroll-status {
  min-height:46px; padding:12px 5%; font-family:Georgia,serif;
  background:#252320 url(images/ranking-art.webp) center/350% auto;
}
.scroll-news {
  padding:30px 7% 30px;
  background:linear-gradient(90deg,transparent,#efe4cf9e 23%,#efe4cf9e 78%,transparent),url(images/ink-paper.webp) center/100% 100% no-repeat;
}
.scroll-news>.scroll-eyebrow { display:none; }
.scroll-news>h2 { margin:0; font-size:clamp(36px,3.4vw,53px); font-weight:600; }
.scroll-news>h2:after { margin-top:7px; }
.scroll-news-grid { margin-top:20px; gap:28px; }
.scroll-news .legacy-news-card {
  grid-template-columns:35% minmax(0,1fr); gap:20px;
  padding:0; border:0;
}
.scroll-news-art { height:150px; min-height:0; max-height:none; align-self:center; border:0; }
.scroll-news .news .left-field { margin-bottom:7px; gap:10px; font:11px Georgia,serif; }
.scroll-news .news .title { font-size:19px; line-height:1.18; margin-bottom:7px; }
.scroll-news .news .text { font:14px/1.4 Georgia,serif; }
.scroll-news .news .text p { margin-bottom:0; }
.scroll-news .legacy-news-card__eyebrow { display:none; }
.scroll-news .legacy-news-card__more { margin-top:9px; font-weight:600; font-family:Georgia,serif; }
.scroll-social-band {
  width:100%; max-width:none; margin:0; border:0; box-shadow:none;
  padding:35px 15% 34px; gap:38px; grid-template-columns:1.25fr 1fr;
  background:#22221f url(images/ranking-art.webp) center/100% 100% no-repeat;
  font-family:Georgia,serif;
}
.scroll-social-band h2 { font-size:32px; margin-bottom:15px; }
.scroll-section-top { gap:10px; flex-wrap:nowrap; }
.scroll-section-top h2 { font-size:30px; margin:0; }
.scroll-ranking-tabs { flex-wrap:nowrap; gap:0; border:1px solid #977b4540; }
.scroll-ranking-tabs a,.scroll-ranking-tabs button { padding:8px 12px; font-size:11px; white-space:nowrap; }
.scroll-ranking-tabs button[aria-pressed=true] { background:#7a241d; border:1px solid #aa643a; }
.scroll-rankings table { margin-top:14px; }
.scroll-rankings td,.scroll-rankings th { padding:6px 8px; }
.scroll-rankings td a { text-decoration:none; }
.scroll-rankings td a:hover { color:#e8b280; }
.scroll-rankings .scroll-text-link { margin-top:11px; color:#d97757; }
.scroll-community { padding-left:34px; }
.scroll-community h3 { color:#d6deff; font-size:22px; margin:0 0 7px; }
.scroll-community p { margin-bottom:9px; font:14px/1.4 Georgia,serif; }
.scroll-discord-identity { display:flex; align-items:center; gap:24px; }
.scroll-discord-logo { width:88px; height:70px; flex:0 0 88px; fill:#7795fa; }
.scroll-community-counts { white-space:nowrap; }
.scroll-community .scroll-button--discord {
  display:flex; width:100%; min-height:48px; margin-top:14px;
  border:1px solid #8094ff; background:linear-gradient(#2f4ea1ee,#183472ee),url(images/paper.webp);
  box-shadow:inset 0 0 0 3px #243f75,inset 0 0 0 4px #a8b9fd2e;
  color:#f4f0e2; padding:10px 16px; font-size:14px;
}
.scroll-button--discord svg { width:30px; height:24px; fill:currentColor; }
.scroll-community .scroll-facebook-link { display:flex; justify-content:center; align-items:center; gap:12px; color:#8fbbf7; margin-top:10px; font-size:15px; }
.scroll-facebook-link svg { width:24px; height:24px; fill:currentColor; }
.scroll-footer-art { background:linear-gradient(90deg,transparent,#efe4cf99 23%,#efe4cf99 78%,transparent),url(images/ink-paper.webp) center bottom/100% 100% no-repeat; }
.scroll-services { width:80%; margin:0 auto; padding:21px 0; border-top:0; gap:0; }
.scroll-services a { justify-content:center; flex:1; padding:0 18px; border-right:1px solid #8e6e444a; font-size:15px; }
.scroll-services a:first-child { padding-left:0; }
.scroll-services a:last-child { border-right:0; padding-right:0; }
.scroll-service-icon { width:30px; height:30px; flex:0 0 30px; color:#79572c; }
.scroll-service-icon--ban { color:#882d23; }
.scroll-footer { width:80%; padding:30px 0 48px; color:#3d3023; }
.scroll-footer a { text-decoration:none; }
.scroll-footer>div>a { color:#8b3324; text-decoration:underline; }
@media(min-width:1800px) {
  .scroll-hero-copy { padding-top:94px; }
  .scroll-hero h1 { font-size:42px; }
  .scroll-presentation .scroll-character { height:125%; }
}
@media(max-width:1250px) and (min-width:851px) {
  .theme-scroll .scroll-header { left:4%; width:92%; padding-inline:2%; }
  .theme-scroll .scroll-header-actions { margin-left:auto; }
  .scroll-hero-copy { padding-top:100px; }
  .scroll-hero-buttons .scroll-button { min-width:175px; font-size:13px; }
  .scroll-presentation { padding-inline:20%; gap:12px; }
  .scroll-presentation .scroll-button { font-size:12px; padding:14px 20px; }
  .scroll-presentation h2 { font-size:34px; }
  .scroll-social-band { padding-inline:14%; gap:25px; }
  .scroll-section-top { flex-wrap:wrap; }
  .scroll-discord-identity { gap:14px; }
  .scroll-discord-logo { width:60px; flex-basis:60px; }
  .scroll-community { padding-left:22px; }
  .scroll-community h3 { font-size:18px; }
  .scroll-community-counts { white-space:normal; }
}
@media(max-width:1150px) {
  .theme-scroll .scroll-navigation { top:66px; }
  .theme-scroll .scroll-navigation a { padding:13px 8px; }
  .theme-scroll .scroll-brand { width:115px; }
  .scroll-news .legacy-news-card { grid-template-columns:30% minmax(0,1fr); gap:16px; }
  .scroll-services { width:90%; }
  .scroll-services a { font-size:12px; padding:0 10px; }
}
@media(max-width:850px) {
  .theme-scroll .scroll-header { left:0; width:100%; height:68px; padding-inline:18px; }
  .theme-scroll .scroll-preferences { top:76px; right:14px; }
  .theme-scroll .scroll-navigation { top:68px; }
  .scroll-hero { height:710px; }
  .scroll-hero-copy { width:70%; padding-top:110px; }
  .scroll-hero-logo { width:285px; height:166px; }
  .scroll-hero h1 { font-size:29px; }
  .scroll-hero .scroll-character { width:38%; height:78%; bottom:0; }
  .scroll-hero .scroll-character--warrior { left:-5%; }
  .scroll-hero .scroll-character--ninja { right:-4%; height:76%; }
  .scroll-hero-buttons .scroll-button { min-width:0; font-size:13px; padding:14px 20px; }
  .scroll-standard--shinsoo { top:21%; left:3%; width:19%; height:47%; }
  .scroll-standard--chunjo { top:30%; left:24%; width:9%; height:28%; }
  .scroll-standard--jinno { top:24%; right:11%; width:12%; height:34%; }
  .scroll-hero:after { bottom:-28px; height:110px; }
  .scroll-presentation { height:auto; min-height:490px; padding:40px 24%; gap:20px; }
  .scroll-presentation h2 { font-size:34px; }
  .scroll-presentation .scroll-character { width:35%; height:90%; bottom:0; }
  .scroll-presentation .scroll-character--sura { left:-9%; }
  .scroll-presentation .scroll-character--shaman { right:-9%; }
  .scroll-preview { width:110%; max-width:400px; margin-inline:-5%; }
  .scroll-news { padding:30px 5%; }
  .scroll-news .legacy-news-card { display:block; }
  .scroll-news-art { height:140px; margin-bottom:13px; }
  .scroll-social-band { grid-template-columns:1fr; padding:40px 17%; background-size:auto 100%; gap:24px; }
  .scroll-section-top { flex-wrap:wrap; }
  .scroll-community { border-left:0; padding:24px 0 0; }
  .scroll-discord-identity { justify-content:center; }
  .scroll-community h2 { text-align:center; }
  .scroll-community .scroll-button--discord { max-width:420px; margin-inline:auto; }
  .scroll-services { width:84%; padding:24px 0; gap:22px 0; }
  .scroll-services a { padding:0 10px!important; font-size:13px; justify-content:flex-start; }
  .scroll-services a:nth-child(2) { border:0; }
  .scroll-footer { width:84%; padding-top:24px; }
  .scroll-footer-art { background-size:auto 100%; }
}
@media(max-width:540px) {
  .theme-scroll .scroll-header { height:64px; padding-inline:12px; gap:10px; }
  .theme-scroll .scroll-brand { width:90px; }
  .theme-scroll .scroll-brand img { width:90px; height:60px; }
  .theme-scroll .scroll-header-actions { gap:11px; }
  .theme-scroll .scroll-navigation { top:64px; }
  .theme-scroll .scroll-preferences { top:70px; right:11px; }
  .theme-scroll .scroll-header .scroll-button { padding:9px 14px; min-height:36px; }
  .scroll-hero { height:820px; }
  .scroll-hero-copy { width:100%; padding:113px 16px 0; }
  .scroll-hero-logo { width:268px; height:155px; }
  .scroll-hero h1 { font-size:27px; max-width:370px; margin:0 auto 14px; }
  .scroll-hero-facts { font-size:14px; margin-bottom:16px; }
  .scroll-launch { font-size:13px; }
  .scroll-hero-buttons { gap:9px; margin:17px 0 13px; }
  .scroll-hero-buttons .scroll-button { font-size:12px; min-height:48px; padding:11px 15px; }
  .scroll-platforms { font-size:13px; }
  .scroll-shared-world { font-size:14px; }
  .scroll-explore { margin-top:5px; }
  .scroll-hero .scroll-character { height:40%; width:58%; bottom:-3px; }
  .scroll-hero .scroll-character--warrior { left:-6%; }
  .scroll-hero .scroll-character--ninja { right:-6%; height:39%; }
  .scroll-standard--shinsoo { top:auto; bottom:50px; left:6%; height:210px; width:25%; }
  .scroll-standard--chunjo { top:auto; bottom:80px; left:43%; height:150px; width:16%; }
  .scroll-standard--jinno { top:auto; bottom:50px; right:5%; height:210px; width:22%; }
  .scroll-hero:after { height:75px; bottom:-16px; }
  .scroll-presentation { min-height:670px; padding:35px 24px 255px; }
  .scroll-presentation h2 { font-size:34px; }
  .scroll-presentation .scroll-character { width:55%; height:255px; bottom:0; }
  .scroll-presentation .scroll-character--sura { left:-8%; }
  .scroll-presentation .scroll-character--shaman { right:-8%; }
  .scroll-preview { width:92%; max-width:330px; margin:0; }
  .scroll-news { padding:28px 22px; }
  .scroll-news>h2 { font-size:36px; }
  .scroll-news-grid { gap:23px; }
  .scroll-news .legacy-news-card { display:grid; grid-template-columns:30% minmax(0,1fr); gap:15px; }
  .scroll-news-art { height:140px; margin:0; }
  .scroll-news .news .title { font-size:18px; }
  .scroll-news .news .text { font-size:13px; }
  .scroll-social-band { padding:36px 8%; background-size:auto 100%; background-position:center; }
  .scroll-social-band h2 { font-size:29px; }
  .scroll-ranking-tabs { width:100%; justify-content:space-between; }
  .scroll-ranking-tabs a,.scroll-ranking-tabs button { flex:1; padding:8px 5px; text-align:center; }
  .scroll-discord-logo { width:70px; flex-basis:70px; }
  .scroll-discord-identity { gap:14px; }
  .scroll-community h3 { font-size:19px; }
  .scroll-community p { font-size:12px; }
  .scroll-services { width:90%; gap:20px 0; }
  .scroll-services a { gap:10px; font-size:12px; }
  .scroll-service-icon { width:25px; height:25px; flex-basis:25px; }
  .scroll-footer { width:86%; padding-bottom:40px; }
}