.reference-page{--ref-game-copy:#fff;--ref-game-visual:#fff;--ref-portrait:#c6b4e8;--ref-collection:#ddd1f0;--ref-join:#e9ccd9}
/* Keep the approved first screen and header palette unchanged. */
.reference-page :is(.ref-split,.reference-world,.join-section,.footer,dialog){--paper:#f0eaf8}
.reference-page .ref-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:720px;isolation:isolate}
.ref-copy{padding:80px clamp(38px,5.5vw,110px);display:flex;align-items:flex-start;justify-content:center;flex-direction:column;min-width:0}
.ref-copy .section-kicker{font-size:14px;margin-bottom:30px}
.ref-copy h2{font-size:clamp(46px,5vw,78px);font-weight:650;line-height:1.06;letter-spacing:-.055em;margin-bottom:30px;max-width:100%}
.ref-copy .ref-description{font-size:17px;line-height:1.65;max-width:400px}
.ref-copy .ref-secondary{font-size:15px;line-height:1.65;max-width:400px;margin-top:26px}
.ref-copy .button{margin-top:35px;font-size:15px;min-height:56px;padding:14px 24px}
.ref-copy .ref-next{margin-top:38px;font-size:15px;min-height:44px;gap:30px}
.game-copy{background:var(--ref-game-copy)}
.game-visual{background:var(--ref-game-visual);padding:55px clamp(25px,3vw,64px);display:flex;flex-direction:column;justify-content:center;min-width:0}
.scene-heading,.scene-footer{display:flex;justify-content:space-between;align-items:center;font-size:12px;gap:15px}
.scene-heading{padding-bottom:22px}.scene-heading>span:last-child{font-weight:600}
.game-scene{position:relative;aspect-ratio:4/3;width:100%;overflow:hidden;border-radius:5px;background:#88ae65}
.scene-land{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 48%}
.scene-actor{position:absolute;width:14%;height:auto;aspect-ratio:86/96;left:49%;top:69%;transform:translate(-50%,-50%);filter:drop-shadow(0 4px 0 #314a3826)}
.scene-actor img,.scene-actor canvas{width:100%;height:auto;display:block;image-rendering:pixelated}
.scene-footer{padding-top:18px}.scene-footer>div{display:flex;gap:4px;align-items:center}.scene-concept{opacity:.68}
.scene-control{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;min-width:44px;min-height:44px;padding:6px 10px;border:1px solid #27204735;border-radius:5px}
.scene-expand{font-size:21px;padding:6px}.scene-control:hover{background:#c6b4e838}
.pair-visual{background:var(--ref-portrait);position:relative;min-height:720px;overflow:hidden;isolation:isolate}
.pair-background-word{position:absolute;left:-6%;top:27%;font-size:clamp(200px,23vw,400px);line-height:1;writing-mode:vertical-rl;transform:rotate(180deg);font-weight:800;letter-spacing:-.06em;color:#a38cc7;opacity:.47;z-index:-1;pointer-events:none}
.pair-orbit{position:absolute;width:86%;aspect-ratio:1;left:7%;top:13%;border:1px solid #7454962b;border-radius:50%;transform:scaleX(.8) rotate(-20deg);z-index:-1;pointer-events:none}
.pair-stage{position:absolute;inset:65px 5% 98px}
.portrait-panel{position:absolute;left:11%;top:0;width:64%;height:93%;margin:0;display:flex;align-items:center;justify-content:center;background:#d8c8ec;border:1px solid #a891c349;border-radius:8px;box-shadow:0 16px 35px #76539a0e}
.portrait-panel img{width:88%;height:87%;object-fit:contain;image-rendering:pixelated;margin-bottom:28px}
.portrait-panel figcaption{position:absolute;bottom:17px;left:24px;font-size:12px;color:#564270}
.sprite-panel{position:absolute;left:62%;bottom:0;width:30%;margin:0;text-align:center;isolation:isolate;transition:transform 230ms var(--ease-out)}
.sprite-panel img,.sprite-panel canvas{width:100%;height:auto;image-rendering:pixelated;display:block;position:relative;z-index:1}
.sprite-panel figcaption{font-size:12px;margin-top:13px}.sprite-ground{position:absolute;bottom:32px;left:15%;right:9%;height:12px;border-radius:50%;background:#73568d40;filter:blur(1px)}
.pair-bottom{position:absolute;bottom:28px;left:38px;right:38px;display:flex;align-items:center;gap:16px;justify-content:space-between;font-size:12px}
.sprite-modes{display:flex;gap:5px}.sprite-modes button{padding:7px 14px;min-height:44px;font-size:13px;border-bottom:1px solid transparent;opacity:.65}.sprite-modes button[aria-pressed=true]{border-color:var(--ink);opacity:1;font-weight:600}
.pair-study-label{font-size:11px;color:#574170}.pair-motion{width:44px;height:44px;border:1px solid #27204735;border-radius:50%;font-size:16px}
.collection-copy{background:var(--ref-collection)}
.reference-page .join-section{background:var(--ref-join)}.reference-page .join-flower{color:#73576f}.reference-page .join-actions{min-width:220px}.reference-page .join-status{margin-bottom:0}
.reference-page .footer-word{color:#e9ddfb}.reference-page .footer-bottom nav a{display:flex;align-items:center;min-height:44px;font-size:13px}.reference-page .footer-bottom nav a:hover{text-decoration:underline;text-underline-offset:5px}
.reference-page .reference-world{background:var(--paper);padding-top:100px;padding-bottom:80px}
.reference-page .reference-world .world-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;padding:10px}
.reference-page .reference-world .world-tab{justify-content:flex-start;min-height:90px;min-width:0;padding:15px 17px;text-align:left}
.reference-page .reference-world .world-tab strong{font-size:16px}.reference-page .reference-world .world-tab small{font-size:11px;margin-top:5px;line-height:1.3}
.reference-page .reference-world .world-scene-copy h3{font-size:clamp(40px,5.5vw,82px)}
.reference-page .ref-scene-dialog{max-width:1200px;width:calc(100% - 36px);padding:25px;background:var(--paper)}.ref-scene-dialog h2{font-size:25px;margin:0 50px 20px 0}.ref-scene-dialog img{width:100%;height:auto;border-radius:4px}.ref-scene-dialog p{margin:15px 0 0;font-size:12px}
@media(min-width:1600px){.reference-page .ref-split,.pair-visual{min-height:830px}.pair-stage{inset:85px 5% 108px}.ref-copy{padding-top:100px;padding-bottom:100px}.game-scene{aspect-ratio:1.38}.portrait-panel img{width:84%}}
@media(min-width:981px) and (max-width:1199px){.ref-copy{padding:60px 35px}.ref-copy h2{font-size:49px}.ref-copy .ref-description{font-size:16px}.game-visual{padding:45px 25px}.pair-stage{inset:75px 2% 110px}.pair-bottom{left:25px;right:25px;gap:7px}.pair-study-label{max-width:75px}}
@media(max-width:980px){.reference-page .ref-split{grid-template-columns:1fr;min-height:0}.ref-copy{padding:60px 8%}.ref-copy h2{font-size:clamp(46px,7.5vw,65px)}.ref-copy .ref-description,.ref-copy .ref-secondary{max-width:530px}.game-visual{padding:45px 8%}.game-scene{aspect-ratio:16/10}.pair-visual{min-height:700px}.pair-stage{inset:55px max(5%,calc((100% - 680px)/2)) 95px}.portrait-panel{width:58%;left:15%}.sprite-panel{width:26%;left:62%}.pair-background-word{font-size:320px;top:18%;left:-2%;writing-mode:horizontal-tb;transform:none}.pair-bottom{left:8%;right:8%}.reference-page .reference-world .world-tab{padding:12px 10px}.reference-page .reference-world .world-tab strong{font-size:14px}.reference-page .reference-world .world-tab small{display:none}}
@media(max-width:600px){.ref-copy{padding:48px 25px 55px}.ref-copy .section-kicker{font-size:12px;margin-bottom:25px}.ref-copy h2{font-size:48px;margin-bottom:24px}.ref-copy .ref-description{font-size:16px;line-height:1.6}.ref-copy .ref-secondary{font-size:14px;margin-top:22px}.ref-copy .ref-next{margin-top:25px}.game-visual{padding:30px 22px}.scene-heading,.scene-footer{font-size:11px}.scene-heading{padding-bottom:17px}.scene-concept{display:none}.game-scene{aspect-ratio:4/3}.scene-actor{width:17%}.scene-control{font-size:11px}.scene-expand{font-size:20px}.pair-visual{min-height:550px}.pair-stage{inset:45px 0 95px}.portrait-panel{left:12%;width:63%;height:94%}.portrait-panel img{width:90%;height:85%}.portrait-panel figcaption{font-size:11px;left:16px;bottom:16px}.sprite-panel{left:61%;width:29%}.sprite-panel figcaption{font-size:11px;margin-top:10px}.pair-bottom{left:22px;right:22px;bottom:23px;gap:8px}.sprite-modes button{padding:7px 11px;font-size:12px}.pair-study-label{font-size:10px;max-width:90px;text-align:center}.pair-background-word{font-size:240px;writing-mode:vertical-rl;transform:rotate(180deg);top:24%;left:-7%}.reference-page .join-status{font-size:12px}.reference-page .reference-world{padding-top:60px;padding-bottom:35px}.reference-page .reference-world .world-tabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:7px}.reference-page .reference-world .world-tab{min-height:53px;justify-content:center;flex-direction:row;padding:10px 8px;text-align:center}.reference-page .reference-world .world-tab:last-child{grid-column:span 2}.reference-page .reference-world .world-tab::after{display:none}.reference-page .reference-world .world-scene-copy h3{font-size:44px}.reference-page .reference-world .world-stage{min-height:410px}.reference-page .ref-scene-dialog{padding:20px 14px}.ref-scene-dialog h2{font-size:24px}}
@media(max-width:360px){.ref-copy h2{font-size:42px}.ref-copy{padding-left:22px;padding-right:22px}.pair-visual{min-height:505px}.pair-stage{top:38px}.pair-bottom{left:16px;right:16px}.pair-study-label{max-width:65px}.sprite-panel{left:60%;width:31%}}
@media(prefers-reduced-motion:reduce){.reference-page *{scroll-behavior:auto}.sprite-panel{transition:none}}
/* Supplied run cycle travels through the scene; the hero artwork stays static. */
.scene-actor{aspect-ratio:92/108;animation:reference-run-path 11s linear infinite}
@keyframes reference-run-path{0%{left:38%;top:74%}45%{left:65%;top:73%}50%{left:66%;top:73%}95%{left:39%;top:74%}100%{left:38%;top:74%}}
.reference-motion-paused .scene-actor{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.scene-actor{animation:none}}
/* Match the reference's spacing between sections without changing the hero palette. */
.reference-page #main{background:#f0eaf8}
.reference-page .join-section{margin-top:64px}
@media(max-width:600px){.reference-page .join-section{margin-top:40px}}

/* Compact final CTA; keep the approved outer separator. */
.reference-page .join-section{padding-top:40px;padding-bottom:40px}
.reference-page .join-section h2{font-size:clamp(36px,3vw,44px)}
.reference-page .join-section .section-kicker{margin-bottom:12px}
.reference-page .join-section p:not(.section-kicker){margin-top:16px;font-size:15px}
.reference-page .join-flower{font-size:100px}
.reference-page .join-actions .text-link{margin-top:8px;font-size:14px}
@media(max-width:720px){.reference-page .join-section{padding-top:32px;padding-bottom:32px;gap:22px}}

/* Preserve the supplied high-resolution portrait and its full composition. */
.portrait-panel img{image-rendering:auto}

/* Four original idle frames, 200 ms each; foot anchor is (45,80). */
.archer-stage{position:relative;aspect-ratio:90/96}
.archer-viewport{position:absolute;inset:0;overflow:hidden}
.sprite-panel .archer-viewport img{width:400%;max-width:none;height:100%;animation:archer-idle .8s steps(4,end) infinite;image-rendering:pixelated}
.archer-stage .sprite-ground{top:83.3333%;bottom:auto;left:50%;right:auto;width:46%;height:4%;transform:translate(-50%,-50%);background:#73568d45;filter:blur(1.5px)}
@keyframes archer-idle{to{transform:translateX(-100%)}}
@media(prefers-reduced-motion:reduce){.sprite-panel .archer-viewport img{animation:none}}

.opening-copy{position:absolute;z-index:2;left:var(--space);bottom:7%;color:#272047;isolation:isolate}
.opening-copy::before{content:"";position:absolute;inset:-65px -75px calc(-7svh - 2px) -100px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 35% 65%,#fff8eae6 0%,#fff8eaaa 38%,#fff8ea00 72%)}
.opening-eyebrow{font-size:10px;letter-spacing:.1em;text-transform:uppercase;margin:0 0 15px}
.opening-copy h2{font-size:clamp(32px,2.5vw,46px);line-height:1.06;letter-spacing:-.045em;font-weight:700;margin:0 0 20px}
.opening-description{font-size:15px;line-height:1.5;margin:0 0 22px}
.opening-actions{display:flex;gap:10px}
.opening-actions .button{min-width:136px;min-height:48px;padding:12px 23px;font-size:14px;justify-content:center;gap:15px}
.opening-whitelist{background:#fff8e9d9;color:#272047;border:1px solid #27204738;box-shadow:none}
.opening-whitelist:hover{background:#fff8e9}
@media(max-width:980px){.reference-page .immersive-hero{height:auto;min-height:0;display:block;padding:calc(96px + 56.25vw + 30px) 8% 36px;background:#fff8ef}.opening-copy{position:relative;left:auto;bottom:auto}.opening-copy::before{display:none}}
@media(max-width:600px){.reference-page .immersive-hero{padding:calc(106px + 56.25vw + 26px) 22px 32px}.opening-copy h2{font-size:34px}.opening-actions .button{min-width:0;flex:1;max-width:170px}}

/* Compact navigation over the artwork, with a light sunset-cream foreground. */
.site-header .small-brand{min-width:44px;min-height:44px;justify-content:center}
.site-header .small-brand span{display:block;font-size:32px;line-height:1;letter-spacing:0}
@media(min-width:981px){
.site-header .main-nav,.site-header .small-brand{color:color-mix(in srgb,#fff5df calc(100% - var(--nav-progress)*100%),#272047)}
.site-header .main-nav{font-weight:650}
.site-header .main-nav a,.site-header .main-nav button,.site-header .small-brand{text-shadow:none}
}

.reference-page .footer .button-cream{box-shadow:0 3px 0 rgba(21,16,49,.22),inset 0 1px 0 #ffffff16}

.game-scene{background:#272047}.game-video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}


.footer-seat{display:inline-block;position:relative}.footer-archer{position:absolute;width:.9em;max-width:none;height:auto;left:.075em;top:-.48em;pointer-events:none;image-rendering:pixelated}.footer-word{overflow:visible}
@media(max-width:600px){.footer-archer{top:-.355em}}

.footer-signature{width:max-content;max-width:100%}.footer .footer-tagline{margin:12px 0 20px;text-align:right;font-size:clamp(14px,1.45vw,28px);line-height:1.5;color:#e9ddfb;letter-spacing:0}

/* The full token address stays readable and selectable at every screen width. */
.token-contract{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;width:min(100%,440px);margin-top:18px;padding:4px 4px 4px 12px;border:1px solid #79598540;border-radius:8px;background:#fff8efd9;color:#574067}
.contract-label{font-size:10px;font-weight:700;letter-spacing:.06em}
.token-contract code{min-width:0;font-family:inherit;font-size:12px;line-height:1.5;letter-spacing:0;overflow-wrap:anywhere;user-select:text;-webkit-user-select:text}
.contract-copy{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:86px;min-height:44px;padding:10px 12px;border:1px solid #79598538;border-radius:5px;background:#e9ddf1;color:inherit;font:inherit;font-size:12px;font-weight:600;cursor:pointer;transition:background-color 150ms ease}
.contract-copy:hover{background:#dfcde9}.contract-copy:active{background:#d6bfdf}.contract-copy:focus-visible{outline:2px solid #795985;outline-offset:3px}.contract-copy svg{flex-shrink:0}
.contract-feedback.is-error{position:static;width:auto;height:auto;margin:8px 0 0;clip:auto;clip-path:none;overflow:visible;white-space:normal;font-size:12px;color:#574067}
@media(max-width:600px){.token-contract{gap:8px;padding-left:10px}.token-contract code{font-size:12px}.contract-copy{min-width:78px;padding-inline:9px}}