:root{--ink:#170b0d;--red:#541719;--gold:#bd9145;--bone:#ded2bb}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#58191c}body{overflow:hidden;color:var(--bone);font-family:"Palatino Linotype","Book Antiqua",Georgia,serif}#sphere-background{position:fixed;inset:0;width:100%;height:100%;z-index:0;background:radial-gradient(ellipse at 50% 44%,#78292b 0,#5a191b 46%,#270d10 100%)}
body::before{content:"";position:fixed;inset:-4%;z-index:1;pointer-events:none;border-radius:12% / 9%;background:radial-gradient(ellipse at 50% 47%,transparent 48%,rgba(16,4,6,.18) 70%,rgba(5,1,2,.92) 100%);box-shadow:inset 0 0 9vw #080203}body::after{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;border-radius:10% / 7%;box-shadow:inset 0 0 1px rgba(210,167,89,.24),inset 25px 0 45px -36px rgba(229,182,97,.2),inset -25px 0 45px -36px rgba(229,182,97,.2)}.paper-noise{position:fixed;inset:0;z-index:2;opacity:.24;pointer-events:none;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='.75' numOctaves='5' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E")}
.shell-lines{position:fixed;z-index:1;inset:0;pointer-events:none;opacity:.15}.shell-lines i{position:absolute;inset:4%;border:1px solid #d0a65d;border-radius:50% 50% 46% 54% / 42% 45% 55% 58%;transform:scaleX(1.11)}.shell-lines i:nth-child(2){inset:10%;transform:scaleX(1.06);opacity:.45}.shell-lines i:nth-child(3){inset:17%;transform:scaleX(1.03);opacity:.25}
.topbar{position:fixed;z-index:5;top:30px;left:clamp(24px,5vw,76px);right:clamp(24px,5vw,76px);display:flex;align-items:center;padding-bottom:15px;border-bottom:1px solid rgba(197,153,76,.34)}.wordmark{display:flex;align-items:center;gap:13px;color:#e4d7bf;text-decoration:none;font:500 clamp(1.25rem,2.2vw,1.9rem)/1 "Bodoni MT",Didot,serif;letter-spacing:.24em}.wordmark small{display:block;margin-top:5px;color:#a88750;font:600 .47rem/1 "Palatino Linotype",serif;letter-spacing:.55em}.seal{display:grid;place-items:center;width:29px;height:29px;color:#c39c5a;border:1px solid #936c3c;font-family:KaiTi,STKaiti,serif;transform:rotate(-3deg)}.topbar>p{margin:0 auto;color:#ad9876;font-size:.56rem;letter-spacing:.5em}.top-chinese{color:#d0a458;font:600 1rem KaiTi,STKaiti,serif;letter-spacing:.38em}
.hero{position:relative;z-index:3;min-height:100svh;display:flex;align-items:center;justify-content:center;padding:116px 20px 128px}.left-inscription{position:absolute;left:clamp(25px,7vw,110px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;color:#b18a51}.left-inscription span{writing-mode:vertical-rl;letter-spacing:.35em;font-size:.55rem}.left-inscription b{margin:13px 0;font:500 clamp(1.4rem,2.4vw,2rem) "Bodoni MT",serif;letter-spacing:.18em}.left-inscription i{display:block;width:1px;height:92px;background:linear-gradient(#a77b3e,transparent)}.left-inscription small{margin-top:14px;writing-mode:vertical-rl;font-size:.48rem;letter-spacing:.25em;color:#907651}.right-inscription{position:absolute;right:clamp(30px,8vw,125px);top:51%;display:flex;flex-direction:column;gap:4px;color:#bd914c;font:600 clamp(1.05rem,2vw,1.5rem) KaiTi,STKaiti,serif;line-height:1;opacity:.8}.right-inscription span{display:block}
.coin-stage{position:relative;width:min(51vh,485px);aspect-ratio:1;display:grid;place-items:center;cursor:pointer;touch-action:none}.coin-stage::after{content:"";position:absolute;bottom:5%;width:57%;height:10%;border-radius:50%;background:rgba(12,3,4,.42);filter:blur(18px)}#coin-canvas{position:absolute;inset:-12%;z-index:3;width:124%;height:124%;outline:none}.fallback-coin{position:relative;z-index:2;width:58%;aspect-ratio:1;border-radius:50%;border:0;padding:9px;color:#541a16;background:conic-gradient(from 20deg,#8e5e2a,#d0aa5c,#71441c,#be8d3f,#d7b36a,#8e5e2a);box-shadow:0 28px 55px rgba(7,2,2,.6),inset 0 0 0 4px #694018;animation:hover 4s ease-in-out infinite}.coin-ring{width:100%;height:100%;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px double #694018;background:radial-gradient(circle at 38% 32%,#d2ac62,#a8692b 70%);box-shadow:inset 0 5px 12px rgba(255,230,161,.35),inset 0 -8px 17px rgba(71,31,13,.4)}.coin-ring b{font:700 clamp(4rem,11vh,8rem)/1 KaiTi,STKaiti,serif;text-shadow:1px 2px #dbb667,-2px -2px #704019}.coin-ring small{letter-spacing:.5em;margin-left:.5em;font-weight:700}.load-status{position:absolute;bottom:4%;margin:0;color:#aa9672;font-size:.56rem;letter-spacing:.22em;text-transform:uppercase}.spinning .fallback-coin{animation:fast-spin .15s linear infinite}@keyframes hover{50%{transform:translateY(-8px) rotateX(4deg)}}@keyframes fast-spin{to{transform:rotateY(360deg) rotateX(18deg)}}
.invitation{position:absolute;bottom:87px;left:50%;transform:translateX(-50%);display:flex;align-items:flex-start;gap:15px;width:min(600px,calc(100% - 40px));padding-top:13px;border-top:1px solid rgba(192,148,76,.3);color:#b9aa92}.invitation-index{color:#c09a58;font:600 .7rem KaiTi,serif}.invitation p{margin:0;font-size:clamp(.78rem,1.3vw,.92rem);line-height:1.55;letter-spacing:.035em}.invitation strong{color:#d4bf93;font-weight:600}
.dock{position:fixed;z-index:5;bottom:22px;left:50%;transform:translateX(-50%);display:flex;gap:3px;width:min(530px,calc(100% - 32px));border-top:1px solid rgba(182,140,73,.38);border-bottom:1px solid rgba(182,140,73,.38);background:rgba(16,7,8,.52);backdrop-filter:blur(12px)}.dock a,.dock button{flex:1;min-width:0;border:0;padding:13px 7px;color:#bdae98;background:transparent;font:600 .58rem "Bodoni MT",Didot,serif;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;text-align:center;cursor:pointer}.dock button{color:#d4b477}.dock a:hover,.dock button:hover{color:#f0d8a3;background:rgba(193,148,76,.08)}
.toast{position:fixed;z-index:10;left:50%;bottom:86px;transform:translate(-50%,9px);opacity:0;padding:9px 16px;color:#e0cfad;background:#1d1010;border:1px solid #77582f;font-size:.7rem;letter-spacing:.1em;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{width:min(560px,calc(100% - 32px));color:#301b17;padding:44px clamp(24px,6vw,56px) 30px;border:1px solid #8d693b;background:#ccb58d;background-image:linear-gradient(rgba(218,198,159,.9),rgba(193,164,119,.92)),url("data:image/svg+xml,%3Csvg viewBox='0 0 150 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.6' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E");box-shadow:0 35px 110px #080303,inset 0 0 65px rgba(80,38,20,.2);text-align:center}dialog::backdrop{background:rgba(9,3,3,.8);backdrop-filter:blur(8px)}.close{position:absolute;right:13px;top:10px;border:0;color:#5d3126;background:transparent;font-size:1.8rem;cursor:pointer}.dialog-seal{display:inline-grid;place-items:center;width:39px;height:39px;color:#d6bd8e;background:#6c211f;font-family:KaiTi,STKaiti,serif}.eyebrow{margin:15px 0 22px;color:#74513a;font-size:.6rem;letter-spacing:.38em}blockquote{margin:0;color:#431615;font:700 clamp(1.65rem,5vw,2.45rem)/1.55 KaiTi,STKaiti,SimSun,serif}.meaning{color:#5c493b;font-style:italic;line-height:1.55}.limit-note{margin:28px 0 0;padding-top:16px;border-top:1px solid rgba(104,67,43,.3);color:#6d5948;font-size:.67rem;letter-spacing:.05em}.prize-box{margin:22px 0 0;padding:16px;border:1px solid #92703c;background:rgba(247,219,148,.28)}.prize-box p{margin:0 0 10px;color:#6f211f;font-size:.64rem;letter-spacing:.17em}.prize-box code{display:block;overflow-wrap:anywhere;user-select:all}.prize-box button{margin-top:12px;padding:8px 13px;border:1px solid #76502d;background:transparent;color:#51291d;cursor:pointer}
@media(max-height:730px){.topbar{top:20px}.hero{padding-top:88px}.coin-stage{width:min(47vh,430px)}.invitation{bottom:78px}}@media(max-width:700px){.topbar>p,.left-inscription,.right-inscription{display:none}.top-chinese{margin-left:auto}.hero{padding-bottom:145px}.coin-stage{width:min(86vw,445px)}.invitation{bottom:78px}.dock a,.dock button{padding:13px 4px;font-size:.53rem;letter-spacing:.1em}}@media(prefers-reduced-motion:reduce){.fallback-coin{animation-play-state:paused}}


/* LORE MODAL */
.dock{width:min(650px,calc(100% - 32px))}
.lore-dialog{width:min(790px,calc(100% - 32px));max-height:min(82vh,820px);padding:0;text-align:left;overflow:hidden}
.lore-dialog .close{z-index:2}
.lore-heading{position:relative;padding:38px 54px 26px;text-align:center;border-bottom:1px solid rgba(105,67,40,.26)}
.lore-heading::before,.lore-heading::after{content:"";position:absolute;top:57px;width:24%;height:1px;background:linear-gradient(90deg,transparent,#9b7444)}
.lore-heading::before{left:5%}
.lore-heading::after{right:5%;transform:scaleX(-1)}
.lore-heading .eyebrow{margin:13px 0 10px}
.lore-heading h2{margin:0;color:#4c1816;font:700 clamp(1.7rem,4vw,2.45rem)/1.25 KaiTi,STKaiti,SimSun,serif;letter-spacing:.12em}
.lore-subtitle{margin:8px 0 0;color:#70543e;font-size:.76rem;font-style:italic;letter-spacing:.05em}
.lore-copy{max-height:50vh;overflow:auto;padding:28px clamp(26px,6vw,64px) 18px;scrollbar-color:#895f36 transparent;column-count:2;column-gap:44px;column-rule:1px solid rgba(108,70,42,.18)}
.lore-copy p{break-inside:avoid;margin:0 0 1.15em;color:#48362c;font-size:clamp(.82rem,1.35vw,.96rem);line-height:1.72;text-align:justify}
.lore-copy p:first-child::first-letter{float:left;margin:.05em .11em 0 0;color:#762621;font:700 3.4em/.82 "Bodoni MT",Didot,serif}
.lore-footer{display:flex;align-items:center;justify-content:center;gap:13px;padding:15px 30px 22px;color:#7e3528;font-family:KaiTi,STKaiti,serif}
.lore-footer i{width:34px;height:1px;background:#9b774c}
@media(max-width:700px){.dock a,.dock button{padding:13px 3px;font-size:.48rem;letter-spacing:.07em}.lore-heading{padding:34px 24px 23px}.lore-heading::before,.lore-heading::after{display:none}.lore-copy{column-count:1;max-height:56vh;padding:24px}.lore-copy p{text-align:left}}


/* LORE SCROLL FIX V2 */
.lore-dialog{width:min(790px,calc(100% - 32px));height:min(82vh,820px);max-height:calc(100dvh - 40px);padding:0;overflow:hidden}
.lore-dialog[open]{display:flex;flex-direction:column}
.lore-heading{flex:0 0 auto}
.lore-copy{flex:1 1 auto;min-height:0;max-height:none;overflow-x:hidden;overflow-y:auto;padding:30px clamp(26px,7vw,76px) 24px;scrollbar-color:#895f36 rgba(108,70,42,.08);scrollbar-width:thin;column-count:1;column-gap:normal;column-rule:0}
.lore-copy p{break-inside:auto;margin:0 0 1.25em;font-size:clamp(.86rem,1.35vw,.98rem);line-height:1.76;text-align:left}
.lore-footer{flex:0 0 auto;border-top:1px solid rgba(105,67,40,.2)}
@media(max-width:700px){.lore-dialog{height:calc(100dvh - 24px);max-height:calc(100dvh - 24px)}.lore-heading{padding:28px 24px 20px}.lore-copy{max-height:none;padding:24px}}


/* LORE HORIZONTAL FIX V3 */
.lore-dialog {
  width: min(790px, calc(100% - 32px));
  height: min(82vh, 820px);
  max-height: calc(100dvh - 40px);
  overflow: hidden;
}

.lore-dialog[open] {
  display: flex;
  flex-direction: column;
}

.lore-heading {
  flex: 0 0 auto;
}

.lore-copy {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overflow-x: scroll;
  overflow-y: hidden;
  padding: 30px 42px 18px;
  column-count: auto;
  column-width: 300px;
  column-gap: 44px;
  column-rule: 1px solid rgba(108, 70, 42, .18);
  column-fill: auto;
  scrollbar-color: #895f36 rgba(108, 70, 42, .12);
  scrollbar-width: auto;
}

.lore-copy p {
  break-inside: avoid;
  margin: 0 0 1.25em;
  line-height: 1.76;
  text-align: justify;
}

.lore-footer {
  flex: 0 0 auto;
  padding: 12px 30px 15px;
}

@media (max-width: 700px) {
  .lore-dialog {
    height: calc(100dvh - 24px);
    max-height: calc(100dvh - 24px);
  }

  .lore-copy {
    max-height: none;
    padding: 24px;
    column-count: auto;
    column-width: calc(100vw - 112px);
    column-gap: 40px;
  }

  .lore-copy p {
    text-align: left;
  }
}

/* BG IMAGE AT 20 PERCENT */
#sphere-background {
  background-color: #58191c;
  background-image:
    radial-gradient(
      ellipse at 50% 44%,
      rgba(120, 41, 43, .80) 0%,
      rgba(90, 25, 27, .80) 46%,
      rgba(39, 13, 16, .80) 100%
    ),
    url('/bg.png');
  background-position: center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

/* BG IMAGE AT 5 PERCENT */
#sphere-background {
  background-color: #58191c !important;
  background-image:
    radial-gradient(
      ellipse at 50% 44%,
      rgba(120, 41, 43, .80) 0%,
      rgba(90, 25, 27, .80) 46%,
      rgba(39, 13, 16, .80) 100%
    ),
    linear-gradient(
      rgba(88, 25, 28, .95),
      rgba(39, 13, 16, .95)
    ),
    url('/bg.png') !important;
  background-position: center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

/* BG PNG 5 PERCENT */
#sphere-background {
  background-color: #58191c !important;
  background-image:
    linear-gradient(rgba(88,25,28,.95), rgba(39,13,16,.95)),
    url('/bg.png') !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  background-repeat: no-repeat !important;
}
#sphere-background {
  background-color: #350f11 !important;
  background-image:
    linear-gradient(rgba(53,15,17,.95), rgba(23,8,10,.95)),
    url('/bg.png') !important;
}
