/* =========================================================================
   サケクエ / SAKE QUEST — Landing Page styles
   Palette is exposed as CSS custom properties so it stays easy to retheme.
   ========================================================================= */
:root{
  --wood-dark:#5C3A1E;
  --wood-mid:#8B5A2B;
  --wood-light:#C9986A;
  --gem-blue-deep:#1E5F8E;
  --gem-blue-light:#5DADE2;
  --brass-gold:#C8A155;
  --parchment:#F5E6D3;
  --parchment-shadow:#DCC5A0;
  --ink-brown:#2C1810;
  --accent-red:#8B2C1E;
  /* main accent — switch this one line to re-tint kickers, badges, underlines */
  --accent:var(--gem-blue-deep);

  --font-serif:'Noto Serif JP',serif;
  --font-sans:'Noto Sans JP',sans-serif;
  --font-en:'Cinzel',serif;
  --font-deco:'Reggae One',system-ui,cursive;

  --wrap:min(1080px,92vw);
  --anchor-offset:74px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:#e9d6b4;
  font-family:var(--font-sans);
  color:var(--ink-brown);
}
::selection{background:var(--gem-blue-deep);color:#f3e3c0;}
img{display:block;}
a{color:inherit;}

/* ---- shared layout ---- */
.page{
  position:relative;
  min-height:100vh;
  overflow-x:hidden;
  background:
    radial-gradient(80% 60% at 18% 0%, rgba(201,152,106,.16), transparent 60%),
    radial-gradient(70% 55% at 96% 26%, rgba(30,95,142,.06), transparent 55%),
    linear-gradient(180deg,#f9efda,#efdfc1 60%,#e9d6b4);
}
.wrap{width:var(--wrap);margin:0 auto;}
.wrap--wide{width:min(1080px,94vw);}
.section{padding:clamp(40px,7vw,72px) 0;position:relative;}
.anchor{scroll-margin-top:var(--anchor-offset);}
.sprite{position:absolute;width:0;height:0;pointer-events:none;opacity:0;}

/* ---- scroll reveal ---- */
.reveal.is-out{opacity:0;}
.reveal.is-in{animation:scq-rise .72s cubic-bezier(.2,.7,.2,1) both;}
@keyframes scq-rise{from{opacity:0;transform:translateY(28px);}to{opacity:1;transform:none;}}
@keyframes scq-float{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
@keyframes scq-floatb{0%,100%{transform:translateY(0) rotate(0deg);}50%{transform:translateY(-6px) rotate(-3deg);}}
@keyframes scq-coin{0%,100%{transform:translateY(0) rotate(-6deg);}50%{transform:translateY(-10px) rotate(6deg);}}
@keyframes scq-float-tt{0%,100%{transform:translate(-50%,0);}50%{transform:translate(-50%,-8px);}}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;}
  html{scroll-behavior:auto;}
}

/* =========================================================================
   Header
   ========================================================================= */
.site-header{
  position:sticky;top:0;z-index:60;
  background:linear-gradient(180deg,#f6e8d0,#eedcbd);
  border-bottom:4px solid var(--wood-dark);
  box-shadow:0 4px 14px rgba(60,38,18,.16);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;min-height:58px;padding:7px 0;
}
.back-link{
  display:inline-flex;align-items:center;gap:9px;text-decoration:none;
  color:var(--wood-dark);font-weight:700;font-size:13px;
  transition:color .15s;
}
.back-link:hover{color:var(--accent-red);}
.back-icon{
  display:inline-grid;place-items:center;width:24px;height:24px;border-radius:6px;
  background:var(--wood-dark);color:#f3e3c0;font-size:13px;line-height:1;
}
.main-nav{display:flex;gap:6px;flex-wrap:wrap;}
.nav-link{
  padding:7px 14px;border-radius:7px;text-decoration:none;
  color:var(--ink-brown);font-weight:700;font-size:13px;font-family:var(--font-serif);
  transition:background .15s,color .15s;
}
.nav-link:hover{background:var(--wood-dark);color:#f7ecd4;}

/* =========================================================================
   Hero
   ========================================================================= */
.hero{position:relative;width:100%;overflow:hidden;padding:clamp(30px,6vw,60px) 0 clamp(40px,7vw,70px);}
.hero-deco{position:absolute;pointer-events:none;}
.hd-big{left:50%;top:45%;transform:translate(-50%,-50%);width:min(560px,82vw);opacity:.07;color:var(--gem-blue-deep);}
.hd1{left:3%;top:13%;width:clamp(46px,8vw,84px);color:var(--wood-dark);opacity:.14;}
.hd2{right:4%;top:9%;width:clamp(42px,7vw,76px);color:var(--wood-dark);opacity:.13;animation:scq-floatb 7s ease-in-out infinite;}
.hd3{left:6%;bottom:6%;width:clamp(38px,6vw,64px);color:var(--wood-mid);opacity:.16;animation:scq-float 6s ease-in-out infinite;}
.hd4{right:7%;bottom:9%;width:clamp(38px,6vw,58px);color:var(--wood-mid);opacity:.16;}
.hero-inner{position:relative;z-index:2;text-align:center;}
.hero-logo{
  height:clamp(150px,30vw,320px);width:auto;max-width:96%;margin:0 auto;
  filter:drop-shadow(0 14px 26px rgba(60,38,18,.34));
}
.hero-subtitle{
  margin:20px auto 0;max-width:760px;font-family:var(--font-serif);font-weight:600;
  color:#3a2415;font-size:clamp(15px,2.4vw,20px);line-height:1.7;
}
.hero-sub-en{font-family:var(--font-en);font-weight:700;letter-spacing:.08em;color:#9a6a14;}
.event-badge{
  display:inline-flex;align-items:center;gap:10px;margin-top:20px;
  padding:11px 22px;border-radius:999px;
  background:linear-gradient(180deg,#fbf1dd,#f0ddbd);
  border:2px solid var(--accent);color:var(--accent);
  font-weight:700;font-family:var(--font-serif);font-size:clamp(13px,1.8vw,16px);
  box-shadow:0 4px 14px rgba(30,95,142,.18);
}
.event-badge .for{font-family:var(--font-en);font-weight:600;opacity:.65;}

/* =========================================================================
   Section header — wood plaque with scroll rods
   ========================================================================= */
.sec-head{text-align:center;margin:0 auto clamp(26px,3.4vw,42px);}
.sec-head--tight{margin-bottom:clamp(24px,3.2vw,38px);}
.sec-head--wide{margin-bottom:clamp(28px,3.6vw,44px);}
.sec-head--join{margin-bottom:clamp(30px,4vw,48px);}
.kicker{
  font-family:var(--font-en);font-weight:600;letter-spacing:.28em;text-transform:uppercase;
  color:var(--accent);font-size:clamp(11px,1.6vw,14px);margin-bottom:12px;
}
.kicker--light{color:var(--brass-gold);}
.plaque{display:inline-flex;align-items:stretch;filter:drop-shadow(0 8px 16px rgba(60,38,18,.26));}
.plaque--dark{filter:drop-shadow(0 8px 18px rgba(0,0,0,.45));}
.plaque-rod{width:22px;align-self:stretch;}
.plaque-rod--flip{transform:scaleX(-1);}
.plaque-label{
  display:grid;place-items:center;padding:13px clamp(22px,4vw,46px);
  font-family:var(--font-serif);font-weight:900;color:#f7ecd4;
  font-size:clamp(23px,4.4vw,38px);line-height:1.1;
  background:
    repeating-linear-gradient(90deg,rgba(0,0,0,.05) 0 7px,rgba(255,255,255,.025) 7px 14px),
    linear-gradient(180deg,#9c6a39,#7a4a24 55%,#5c3a1e);
  border-top:2px solid #bd8d4f;border-bottom:2px solid #3a2412;
  text-shadow:0 2px 3px rgba(0,0,0,.4);
}
.sec-underline{width:66px;height:3px;margin:16px auto 0;border-radius:2px;
  background:linear-gradient(90deg,transparent,var(--accent),transparent);}
.sec-underline--gold{background:linear-gradient(90deg,transparent,var(--brass-gold),transparent);}

/* =========================================================================
   Adventure Book
   ========================================================================= */
.adv-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(282px,1fr));
  gap:clamp(24px,4vw,48px);align-items:center;
}
.adv-lead{margin:0;font-size:clamp(15px,1.9vw,17px);line-height:2.05;color:#3a2415;text-wrap:pretty;}
.adv-art{position:relative;display:grid;place-items:center;min-height:210px;}
.adv-art-glow{position:absolute;width:min(220px,60%);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(93,173,226,.3),transparent 68%);}
.book-icon{width:clamp(150px,26vw,212px);color:#7a4a24;position:relative;z-index:1;
  filter:drop-shadow(0 12px 20px rgba(60,38,18,.3));animation:scq-float 6s ease-in-out infinite;}
.quill-icon{position:absolute;right:13%;top:4%;width:clamp(56px,10vw,94px);color:var(--wood-dark);
  z-index:2;transform:rotate(8deg);animation:scq-floatb 5s ease-in-out infinite;
  filter:drop-shadow(0 8px 12px rgba(60,38,18,.3));}
.tenets{margin-top:clamp(34px,4.5vw,52px);}
.tenets-title{text-align:center;font-family:var(--font-serif);font-weight:700;color:var(--wood-dark);
  font-size:clamp(17px,2.4vw,21px);margin-bottom:22px;letter-spacing:.04em;}
.tenet-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(228px,1fr));gap:20px;}
.tenet-card{
  background:linear-gradient(180deg,#fbf2df,#efdcbd);border:2px solid #d8bf96;border-radius:16px;
  padding:26px 20px;text-align:center;box-shadow:0 8px 20px rgba(92,58,30,.12);
}
.tenet-medal{
  width:66px;height:66px;margin:0 auto 16px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 28%,#f4e3b0,var(--brass-gold) 65%,#9a7327);
  border:3px solid var(--wood-dark);
  box-shadow:inset 0 -3px 6px rgba(0,0,0,.25),0 4px 10px rgba(60,38,18,.25);
}
.tenet-medal svg{width:34px;height:34px;color:var(--wood-dark);}
.tenet-text{font-size:15px;line-height:1.65;font-weight:700;color:var(--ink-brown);}

/* =========================================================================
   Quest List
   ========================================================================= */
.quest-intro{text-align:center;max-width:680px;margin:0 auto;
  font-size:clamp(15px,1.9vw,17px);line-height:1.9;color:#3a2415;text-wrap:pretty;}
.eff-wrap{text-align:center;margin:20px 0 4px;}
.eff-badge{
  display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:999px;
  background:linear-gradient(180deg,#fff7e6,#f3e3c1);border:2px solid var(--accent);
  color:var(--accent);font-weight:800;font-family:var(--font-serif);font-size:15px;
  box-shadow:0 3px 10px rgba(0,0,0,.1);
}
.eff-badge svg{width:18px;height:18px;flex:none;}
.quest-list{margin-top:clamp(26px,3.5vw,38px);display:flex;flex-direction:column;gap:clamp(22px,3vw,32px);}
.quest-card{
  background:linear-gradient(180deg,#fbf2df,#f1e0c1);border:2px solid #d8bf96;border-radius:18px;
  box-shadow:0 12px 30px rgba(92,58,30,.14);overflow:hidden;
}
.quest-card-head{
  display:flex;align-items:center;gap:15px;padding:16px clamp(16px,3vw,24px);
  background:
    repeating-linear-gradient(90deg,rgba(0,0,0,.05) 0 8px,rgba(255,255,255,.03) 8px 16px),
    linear-gradient(180deg,#8a5a2c,#6e4420 60%,#5c3a1e);
  border-bottom:3px solid var(--brass-gold);
}
.quest-icon{
  flex:none;width:54px;height:54px;border-radius:13px;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 28%,#7fc4ec,var(--gem-blue-deep) 75%);
  border:2px solid var(--brass-gold);
  box-shadow:inset 0 -3px 6px rgba(0,0,0,.3),0 4px 10px rgba(0,0,0,.3);
}
.quest-icon svg{width:30px;height:30px;color:#eef6ff;}
.quest-titles{flex:1;min-width:0;}
.quest-sub{font-family:var(--font-en);letter-spacing:.14em;color:#f0d9a8;font-size:11px;font-weight:600;}
.quest-ja{font-family:var(--font-deco);color:#fff7e8;font-size:clamp(19px,3.2vw,26px);
  line-height:1.18;text-shadow:0 2px 0 rgba(0,0,0,.28);}
.quest-tag{
  flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--font-en);font-weight:700;font-size:19px;color:#f3d9a8;
  background:radial-gradient(circle at 35% 28%,#a9432f,var(--accent-red) 75%);
  border:2px solid #6f2014;box-shadow:inset 0 -2px 4px rgba(0,0,0,.35),0 3px 7px rgba(0,0,0,.3);
}
.quest-body{padding:clamp(16px,3vw,26px);}
.quest-desc{margin:0 0 16px;font-size:15px;line-height:1.85;color:#3a2415;text-wrap:pretty;}

/* quest tables */
.qt-scroll{overflow-x:auto;padding-bottom:2px;}
.qt{display:grid;border:2px solid #d8bf96;border-radius:12px;overflow:hidden;background:#fbf2df;}
.qt--A{grid-template-columns:minmax(74px,0.8fr) minmax(150px,2fr) minmax(108px,1.2fr);min-width:340px;}
.qt--C{grid-template-columns:minmax(84px,1fr) minmax(166px,2.3fr) minmax(80px,1fr) minmax(58px,0.8fr);min-width:470px;}
.qt--D{grid-template-columns:minmax(150px,1.7fr) minmax(120px,1.3fr);min-width:300px;}
.qt-head{
  padding:12px 16px;font-weight:700;font-size:12.5px;letter-spacing:.05em;color:#f3e3c0;
  display:flex;align-items:center;background:linear-gradient(180deg,#8a5a2c,#6e4420);
}
.qt-cell{
  padding:12px 16px;font-size:14.5px;line-height:1.45;color:var(--ink-brown);
  border-top:1px solid rgba(139,90,43,.16);display:flex;align-items:center;
}
.qt-cell--alt{background:rgba(201,152,106,.09);}
.qt-cell--first{font-weight:700;color:var(--wood-dark);}
.qt-cell--reward{font-weight:800;color:#9a6a14;gap:4px;white-space:nowrap;}
.qt-coin{width:16px;height:16px;flex:none;margin-right:5px;}

/* reward badge */
.reward-badge{
  display:inline-flex;align-items:center;gap:14px;padding:14px 22px;border-radius:14px;
  background:linear-gradient(180deg,#fff7e2,#f5e6c2);border:2px dashed var(--brass-gold);
}
.reward-badge>svg{width:42px;height:42px;flex:none;filter:drop-shadow(0 3px 5px rgba(0,0,0,.2));}
.reward-label{font-size:11px;font-weight:700;letter-spacing:.1em;color:#8a6a48;}
.reward-value{font-family:var(--font-deco);font-size:22px;color:#9a6a14;line-height:1.25;}

/* sponsors */
.sponsors{margin-top:18px;}
.sponsors-title{font-family:var(--font-en);letter-spacing:.14em;color:#8a6a48;font-size:11px;
  font-weight:600;margin-bottom:12px;}
.sponsor-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:12px;}
.sponsor-card{
  display:flex;align-items:center;gap:12px;padding:13px 15px;border-radius:14px;
  background:linear-gradient(180deg,#fdf6e6,#f1e0c1);border:1.5px solid #d8bf96;
  box-shadow:0 4px 12px rgba(92,58,30,.1);
}
.sponsor-icon{
  flex:none;width:42px;height:42px;border-radius:11px;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 28%,#7fc4ec,var(--gem-blue-deep) 78%);
  border:2px solid var(--brass-gold);box-shadow:inset 0 -2px 4px rgba(0,0,0,.28);
}
.sponsor-icon svg{width:23px;height:23px;color:#eef6ff;}
.sponsor-q{font-family:var(--font-deco);color:var(--gem-blue-deep);font-size:15px;line-height:1.2;}
.sponsor-booth{font-size:11.5px;color:#7a5a38;margin-top:3px;line-height:1.3;}

/* free quests */
.free-scroll{display:flex;gap:14px;overflow-x:auto;padding:4px 2px 14px;}
.free-card{
  flex:0 0 auto;width:210px;display:block;background:linear-gradient(180deg,#fbf2df,#efdcbd);
  border:1.5px solid #d8bf96;border-radius:15px;padding:16px 14px;text-align:center;
  box-shadow:0 6px 14px rgba(92,58,30,.12);
  text-decoration:none;color:inherit;
}
.free-card--link{cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;}
.free-card--link:hover{transform:translateY(-3px);box-shadow:0 12px 22px rgba(92,58,30,.22);border-color:var(--brass-gold);}
.free-card--link:focus-visible{outline:2px solid var(--brass-gold);outline-offset:3px;}
.free-icon{
  width:48px;height:48px;margin:0 auto;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 28%,#7fc4ec,var(--gem-blue-deep) 78%);
  border:2px solid var(--brass-gold);box-shadow:inset 0 -2px 5px rgba(0,0,0,.3);
}
.free-icon svg{width:26px;height:26px;color:#eef6ff;}
.free-name{font-family:var(--font-deco);color:var(--gem-blue-deep);font-size:15px;margin-top:11px;line-height:1.25;}
.free-note{
  display:inline-block;font-size:10.5px;font-weight:700;color:#8a6a48;
  background:rgba(200,161,85,.16);border:1px solid rgba(200,161,85,.4);
  border-radius:999px;padding:2px 10px;margin-top:7px;
}
.free-desc{font-size:11.5px;color:#5b4631;margin-top:9px;line-height:1.65;text-align:left;text-wrap:pretty;}

/* =========================================================================
   Coins & Rewards (dark band)
   ========================================================================= */
.coin-section{
  position:relative;overflow:hidden;color:#f3e3c0;padding:clamp(48px,7vw,84px) 0;
  background:radial-gradient(120% 80% at 50% 0%, #27506e, #1b3a52 55%, #142d3f);
}
.seigaiha{position:absolute;left:0;top:0;width:100%;height:30px;opacity:.18;}
.coin-deco{position:absolute;}
.cd1{left:4%;top:20%;width:46px;opacity:.5;animation:scq-coin 5s ease-in-out infinite;}
.cd2{right:6%;top:14%;width:38px;opacity:.42;animation:scq-coin 6.5s ease-in-out infinite;}
.cd3{right:10%;bottom:12%;width:52px;opacity:.4;animation:scq-coin 5.8s ease-in-out infinite;}
.cd4{left:8%;bottom:16%;width:34px;opacity:.36;animation:scq-coin 7s ease-in-out infinite;}
.coin-inner{position:relative;z-index:2;}
.cycle{
  display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;
  gap:clamp(8px,1.6vw,18px);margin:clamp(8px,2vw,18px) auto 0;max-width:920px;
}
.cycle-step{display:flex;flex-direction:column;align-items:center;gap:9px;width:118px;}
.cycle-medal{
  width:74px;height:74px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 28%,#fef3d6,var(--brass-gold) 70%,#8a6a1e);
  border:3px solid #f3e3c0;box-shadow:0 6px 16px rgba(0,0,0,.4);
}
.cycle-medal svg{width:38px;height:38px;color:var(--wood-dark);}
.cycle-label{font-family:var(--font-serif);font-weight:700;font-size:14px;color:#f7ecd4;text-align:center;line-height:1.35;}
.cycle-arrow{font-size:26px;color:var(--brass-gold);font-weight:700;align-self:center;padding-top:24px;}
.cycle-loop{display:flex;flex-direction:column;align-items:center;gap:7px;align-self:center;padding-top:6px;}
.cycle-loop-icon{
  width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:23px;
  color:#16344b;background:var(--brass-gold);border:2px solid #f3e3c0;box-shadow:0 4px 10px rgba(0,0,0,.35);
}
.cycle-loop-text{font-size:11px;color:#d9c69a;}
.conv-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(248px,1fr));gap:18px;
  max-width:720px;margin:clamp(34px,4.5vw,54px) auto 0;
}
.conv-card{
  background:linear-gradient(180deg,#fbf2df,#efdcbd);border:2px solid var(--brass-gold);
  border-radius:16px;padding:20px 22px;display:flex;align-items:center;gap:15px;
  box-shadow:0 10px 24px rgba(0,0,0,.3);
}
.conv-card svg{width:52px;height:52px;flex:none;filter:drop-shadow(0 3px 5px rgba(0,0,0,.2));}
.conv-card .chest{color:var(--wood-mid);}
.conv-label{font-size:11px;font-weight:700;letter-spacing:.08em;color:#8a6a48;}
.conv-value{font-family:var(--font-serif);font-weight:900;font-size:clamp(17px,2.4vw,22px);color:var(--wood-dark);line-height:1.35;}
.conv-value--gold{color:#9a6a14;}
.expiry{text-align:center;margin:clamp(26px,3.5vw,40px) auto 0;}
.expiry-inner{
  display:inline-flex;align-items:center;gap:11px;padding:11px 22px;border-radius:10px;
  background:rgba(243,227,192,.08);border:1px solid rgba(243,227,192,.32);
  color:#e8d6ad;font-size:13.5px;line-height:1.5;text-align:left;
}
.expiry-inner svg{width:28px;height:28px;flex:none;}

/* =========================================================================
   Event Overview
   ========================================================================= */
.overview-panel{
  position:relative;background:linear-gradient(180deg,#fbf2df,#f1e0c1);
  border:2px solid var(--brass-gold);border-radius:18px;padding:clamp(22px,4vw,40px);
  box-shadow:0 12px 30px rgba(92,58,30,.16);max-width:840px;margin:0 auto;
}
.ov-rows{display:flex;flex-direction:column;}
.ov-row{
  display:grid;grid-template-columns:minmax(104px,150px) 1fr;gap:14px;align-items:center;
  padding:15px 2px;border-bottom:1px dashed rgba(139,90,43,.3);
}
.ov-row--last{border-bottom:none;}
.ov-key{
  font-family:var(--font-serif);font-weight:700;color:var(--wood-dark);font-size:14px;
  display:flex;align-items:center;gap:9px;
}
.ov-key svg{width:22px;height:22px;flex:none;color:var(--wood-mid);}
.ov-val{font-size:clamp(15px,2vw,18px);font-weight:700;color:var(--ink-brown);}
.ov-val--link{font-size:clamp(14px,1.9vw,17px);}
.ov-link{color:var(--gem-blue-deep);text-decoration:none;border-bottom:2px solid rgba(30,95,142,.3);word-break:break-all;}
.ov-link:hover{border-bottom-color:var(--gem-blue-deep);}
.organizers{margin-top:26px;padding-top:22px;border-top:2px solid rgba(200,161,85,.4);}
.org-title{text-align:center;font-family:var(--font-en);letter-spacing:.2em;color:#8a6a48;font-size:11px;margin-bottom:14px;}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;max-width:500px;margin:0 auto;}
.org-slot{height:90px;border:2px dashed var(--brass-gold);border-radius:12px;overflow:hidden;
  background:rgba(255,255,255,.6);padding:8px;}
.org-slot image-slot{display:block;width:100%;height:100%;}
.org-link{display:block;width:100%;height:100%;text-decoration:none;transition:opacity .15s ease;}
.org-link:hover{opacity:.78;}
.org-link:focus-visible{outline:2px solid var(--brass-gold);outline-offset:2px;border-radius:6px;}

/* =========================================================================
   How to Join
   ========================================================================= */
.join-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:24px;}
.step-card{
  position:relative;background:linear-gradient(180deg,#fbf2df,#efdcbd);border:2px solid #d8bf96;
  border-radius:18px;padding:38px 22px 26px;text-align:center;box-shadow:0 10px 24px rgba(92,58,30,.13);
}
.step-num{
  position:absolute;left:50%;top:-22px;transform:translateX(-50%);
  width:50px;height:50px;border-radius:14px;display:grid;place-items:center;
  font-family:var(--font-en);font-weight:700;font-size:22px;color:#fff;
  background:radial-gradient(circle at 35% 28%,#7fc4ec,var(--gem-blue-deep) 75%);
  border:3px solid var(--brass-gold);box-shadow:0 6px 14px rgba(30,95,142,.35);
}
.step-icon{display:grid;place-items:center;}
.step-icon svg{width:44px;height:44px;color:#7a4a24;}
.step-en{font-family:var(--font-en);letter-spacing:.18em;color:#9a6a14;font-size:12px;font-weight:600;margin-top:10px;}
.step-title{font-family:var(--font-serif);font-weight:700;color:var(--ink-brown);font-size:17px;margin-top:4px;}
.step-desc{margin:8px 0 0;font-size:13px;line-height:1.7;color:#5b4631;}
.store-badges{display:flex;flex-direction:column;gap:9px;align-items:center;margin-top:16px;}
.store-link{display:block;width:180px;}
.store-link image-slot{display:block;width:100%;height:100%;}
#dl-appstore{aspect-ratio:108.85/40;}
#dl-googleplay{aspect-ratio:646/250;}
.cta-band{
  margin-top:clamp(36px,5vw,56px);position:relative;overflow:hidden;
  background:radial-gradient(120% 100% at 50% 0%,#6b4521,#3a2412 72%);
  border:3px solid var(--brass-gold);border-radius:22px;
  padding:clamp(32px,5vw,54px) clamp(20px,4vw,40px);text-align:center;
  box-shadow:0 16px 40px rgba(60,38,18,.4);
}
.cta-compass{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(360px,70%);opacity:.08;color:var(--brass-gold);}
.cta-inner{position:relative;z-index:1;}
.cta-en{font-family:var(--font-en);font-weight:600;letter-spacing:.26em;color:var(--brass-gold);font-size:clamp(11px,1.6vw,14px);}
.cta-title{font-family:var(--font-serif);font-weight:900;color:#f9efdb;font-size:clamp(24px,4.6vw,40px);
  line-height:1.25;margin-top:10px;text-shadow:0 2px 6px rgba(0,0,0,.4);}
.cta-buttons{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:26px;}
.store-btn{
  display:inline-flex;align-items:center;gap:10px;padding:14px 28px;border-radius:13px;
  background:linear-gradient(180deg,#f6e3ab,var(--brass-gold));border:2px solid var(--wood-dark);
  color:#3a2412;font-weight:800;font-size:clamp(15px,2vw,17px);font-family:var(--font-serif);
  text-decoration:none;
  box-shadow:0 7px 18px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.5);
  transition:transform .15s,box-shadow .15s;
}
.store-btn svg{width:19px;height:19px;flex:none;}
.store-btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.6);}

/* =========================================================================
   FAQ
   ========================================================================= */
.faq-list{display:flex;flex-direction:column;gap:13px;max-width:820px;margin:0 auto;}
.faq-item{border-radius:14px;overflow:hidden;border:2px solid #d8bf96;box-shadow:0 6px 16px rgba(92,58,30,.12);}
.faq-q{
  width:100%;display:flex;align-items:center;gap:13px;text-align:left;cursor:pointer;
  border:none;padding:15px 18px;background:linear-gradient(180deg,#fbf2df,#f1e0c1);font-family:inherit;
}
.faq-q:hover{background:linear-gradient(180deg,#fdf6e8,#f4e6c9);}
.faq-badge{
  flex:none;width:34px;height:34px;border-radius:8px;display:grid;place-items:center;
  font-family:var(--font-en);font-weight:700;font-size:16px;color:#f3e3c0;
  box-shadow:inset 0 -1px 3px rgba(0,0,0,.3);
}
.faq-badge--q{background:radial-gradient(circle at 35% 28%,#a9432f,var(--accent-red) 78%);border:2px solid #6f2014;}
.faq-badge--a{background:radial-gradient(circle at 35% 28%,#7fc4ec,var(--gem-blue-deep) 78%);border:2px solid #154d72;}
.faq-q-text{flex:1;min-width:0;font-family:var(--font-serif);font-weight:700;
  font-size:clamp(14px,1.9vw,16.5px);color:var(--ink-brown);line-height:1.5;}
.faq-sign{flex:none;font-size:24px;line-height:1;display:inline-block;font-weight:700;
  color:var(--brass-gold);transition:transform .3s ease,color .3s ease;}
.faq-panel{overflow:hidden;max-height:0;opacity:0;transition:max-height .35s ease,opacity .2s ease;}
.faq-a{display:flex;gap:13px;padding:15px 18px;background:rgba(255,255,255,.34);}
.faq-a-text{margin:0;font-size:14.5px;line-height:1.85;color:#3a2415;text-wrap:pretty;}
.faq-item.open .faq-panel{max-height:480px;opacity:1;transition:max-height .45s ease,opacity .3s ease .05s;}
.faq-item.open .faq-sign{transform:rotate(45deg);color:var(--accent-red);}

/* =========================================================================
   Footer
   ========================================================================= */
.site-footer{
  position:relative;background:linear-gradient(180deg,#3a2412,#241208);color:#d8c2a0;
  border-top:5px solid var(--brass-gold);padding:clamp(44px,5vw,64px) 0 30px;margin-top:clamp(18px,3vw,30px);
}
.to-top{
  position:absolute;left:50%;top:-27px;transform:translateX(-50%);
  width:54px;height:54px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 28%,#9c6a39,#5c3a1e);border:3px solid var(--brass-gold);
  box-shadow:0 6px 16px rgba(0,0,0,.42);animation:scq-float-tt 4s ease-in-out infinite;text-decoration:none;
}
.to-top svg{width:32px;height:32px;}
.to-top:hover{border-color:#f3e3c0;}
.foot-inner{text-align:center;}
.foot-title{font-family:var(--font-serif);font-weight:900;font-size:clamp(22px,3.4vw,30px);color:#f3e3c0;letter-spacing:.04em;}
.foot-en{font-family:var(--font-en);letter-spacing:.3em;color:var(--brass-gold);font-size:12px;margin-top:4px;}
.foot-nav{display:flex;flex-wrap:wrap;gap:8px 4px;justify-content:center;align-items:center;margin:22px auto 0;max-width:560px;}
.foot-link{color:#d8c2a0;text-decoration:none;font-size:13px;padding:4px 14px;}
.foot-link:hover{color:#f3e3c0;}
.foot-sep{color:#6b4f33;}
.foot-copy{margin-top:18px;font-size:12.5px;color:#c4a878;letter-spacing:.02em;}

/* =========================================================================
   Responsive tweaks
   ========================================================================= */
@media (max-width:768px){
  .header-inner{justify-content:center;}
  .main-nav{justify-content:center;}
}
@media (max-width:640px){
  /* Quest tables (A/C/D): full-visible, no horizontal scroll */
  .qt-scroll{overflow-x:visible;}
  .qt--A,.qt--C,.qt--D{min-width:0;}
  .qt--A{grid-template-columns:0.9fr 2fr 1.1fr;}
  .qt--C{grid-template-columns:1fr 2.2fr 1fr 0.7fr;}
  .qt--D{grid-template-columns:1.6fr 1.1fr;}
  .qt-head{padding:9px 7px;font-size:11.5px;letter-spacing:.02em;}
  .qt-cell{padding:9px 8px;font-size:12.5px;line-height:1.4;overflow-wrap:break-word;}
  .qt-cell--reward{white-space:normal;}
  .qt-coin{width:13px;height:13px;margin-right:3px;}

  /* Sponsor cards (Cat F): force single column */
  .sponsor-grid{grid-template-columns:1fr;}

  /* Coin cycle: vertical stack so down-arrow reads correctly */
  .cycle{flex-direction:column;align-items:center;gap:6px;}
  .cycle-step{width:auto;}
  .cycle-arrow{transform:rotate(90deg);padding-top:0;font-size:24px;}
  .cycle-loop{padding-top:0;}

  /* Event Overview: stack key/value to avoid awkward 2-line wraps */
  .ov-row{grid-template-columns:1fr;gap:4px;padding:14px 2px;}
  .ov-key{font-size:12px;color:#7a5a38;font-weight:600;letter-spacing:.02em;}
  .ov-val{font-size:15px;line-height:1.55;font-weight:700;}
  .ov-val--link{font-size:14px;}
}