/* ClanFights illustrated beta — explicit surface colors, including interaction states. */
.hero{min-height:760px;background:#eddbb7}.hero-landscape{background:url('/images/landing/founders-town-v2.webp') right center/cover no-repeat;opacity:1;filter:none}.hero:before{background:linear-gradient(90deg,#f6e6c6 0%,#f6e6c6ed 23%,#f6e6c600 57%)}.hero:after{background:linear-gradient(0deg,#f1e1bc,transparent 13%)}.hero-art{display:none}.hero-content{padding-top:150px;padding-bottom:125px}.hero h1{font-size:clamp(46px,4.5vw,72px);max-width:650px}.hero-intro{max-width:385px;font-size:16px;color:#493421}.hero-foot{display:none}.release-note{font-weight:600;color:#543a24}.hero .status-pill{border-radius:20px;padding:9px 14px;letter-spacing:1.1px}.hero .eyebrow{color:#684923}
.world-card{border:2px solid #98713c;border-radius:20px;background:#231e18;box-shadow:0 5px 0 #856236,0 15px 25px #77502522}.world-card h3{color:#fff0ca;text-shadow:0 2px 3px #000b;line-height:1.12}.world-card p{color:#fff5df;font-size:14px;line-height:1.7}.world-card .chapter-number{color:#f4cb77;font-weight:700}.world-card-shade{background:linear-gradient(0deg,#201a14 0%,#201a14ed 24%,#201a1444 78%)}.world-card-copy{inset:auto 25px 25px}.world-card>img{filter:saturate(.9)}
.class-tabs button,.class-tabs button:hover,.class-tabs button:focus-visible,.class-tabs button[aria-selected=true]{color:#49301c}.class-tabs button span,.class-tabs button:hover span,.class-tabs button[aria-selected=true] span{color:inherit}.class-tabs button:hover,.class-tabs button:focus-visible{background:#fff1cc;border-color:#6b4828;box-shadow:0 3px 0 #967039}.class-tabs button[aria-selected=true]{background:#68452b;color:#fff1cf;border-color:#4c301d;box-shadow:inset 0 0 0 2px #bf9557,0 3px 0 #422b1d}.class-tabs button[aria-selected=true]:hover{background:#795135;color:#fff1cf}.class-description .eyebrow{color:#80532e}.gallery-image{background:#e8d2a7;border:2px solid #a88348;border-radius:14px;overflow:hidden}.gallery-image>span{color:#513923}.gallery-note{color:#6c5137}
.rewards-section{position:relative;isolation:isolate;background:radial-gradient(ellipse at 50% 10%,#fff3d4,#dfc494);border-block:1px solid #b49155}.rewards-section:before,.rewards-section:after{display:none}.rewards-section h2{color:#51351f}.rewards-section .section-intro,.rewards-section .reward-note{color:#674a2e}.reward-grid{align-items:stretch;gap:25px;max-width:1080px;position:relative}.reward-card{padding:40px 28px 32px;border:2px solid #ab8240;border-radius:20px;background:linear-gradient(150deg,#fff5dc,#e8cda0);box-shadow:inset 0 0 0 5px #f9e6bb,0 6px 0 #9b743e,0 15px 25px #72512930}.reward-card:first-child{transform:translateY(-12px);background:linear-gradient(135deg,#725033,#3f2b20);border-color:#d6ae63;box-shadow:inset 0 0 0 5px #8f693a,0 6px 0 #3d291d,0 18px 35px #5c3e2340}.reward-card:first-child h3{color:#ffe3a2}.reward-card:first-child p,.reward-card:first-child .reward-number{color:#f0d9b6}.reward-card h3{font-size:30px;line-height:1.1}.reward-card p{font-size:14px;line-height:1.7}.reward-art{height:190px;margin:10px 0 25px;display:grid;place-items:center}.title-medallion{width:140px;height:150px;border-radius:50% 50% 40% 40%;border:6px double #f3d390;color:#fff0bd;background:radial-gradient(#b28443,#674322);box-shadow:0 0 0 9px #d5ac5a33,0 10px 15px #21160c55;transform:rotate(-7deg)}.reward-crest{background:#6e5040;border:5px double #b58d4f}.planned-label{top:16px;right:16px;font-size:9px;padding:6px 9px;border-radius:20px;letter-spacing:1px;background:#f7e4ba;color:#60401e;border:1px solid #a88346}.reward-note{font-size:13px;max-width:800px;margin-top:34px}.reward-chest{width:155px;height:155px;object-fit:contain}
.beta-invite-card{position:relative;padding:36px;background:linear-gradient(135deg,#fff0cd,#dbba83);border:2px solid #9e753c;border-radius:22px;box-shadow:inset 0 0 0 5px #f6dfac,0 7px 0 #9e7948}.beta-invite-card h3{font:36px/1.1 ClanDisplay,sans-serif;margin:10px 0 15px}.beta-invite-card>p:not(.eyebrow){line-height:1.7;color:#65472d}.beta-invite-card .button{width:100%;justify-content:space-between;margin:23px 0}.invite-seal{float:right;width:65px;height:65px;display:grid;place-items:center;border-radius:50%;border:4px double #dcb775;background:#784529;color:#ffe2a1;font:36px Georgia}.beta-invite-card .privacy-note{font-size:12px}.founder-dialog .cf-turnstile{min-height:65px;margin:15px 0;display:flex;justify-content:center;background:transparent}.founder-dialog .submit-button,.founder-dialog .submit-button:hover{color:#362116;background:linear-gradient(#ffe5a0,#d6a757);min-height:56px;border:2px solid #825c2f;font-size:18px}.founder-dialog .submit-button:disabled{opacity:.7;color:#503a26}.founder-dialog .form-feedback{padding:12px;border-radius:8px;background:#fff1d3}.founder-dialog .form-feedback.error{color:#8c211b;border:1px solid #b86b50}.founder-dialog .form-feedback.success{color:#24502b;border:1px solid #71865a}.founder-dialog .form-feedback[hidden]{display:none}
.demo-mode button{font-family:ClanDisplay,sans-serif;font-size:18px}.demo-toolbar{background:linear-gradient(#735032,#493321);border-color:#38251a}.demo-stage{min-height:560px}.demo-stage[data-mode=forge] .demo-town-art,.demo-stage[data-mode=forge][data-faction=karus] .demo-town-art{background:url('/images/landing/forge-courtyard-v2.webp') center 55%/cover;filter:none}.demo-stage[data-mode=forge] .demo-npc{left:15px;right:15px}.demo-forge{position:absolute;inset:0}.demo-forge[hidden],.demo-city[hidden],.demo-adventure[hidden]{display:none}.forge-sign{position:absolute;top:20px;left:50%;transform:translateX(-50%);width:max-content;max-width:90%;padding:13px 26px;background:#3e291eee;border:2px solid #ddba72;border-radius:13px;text-align:center;box-shadow:0 4px 0 #23190f}.forge-sign span{color:#e4bd74;font-size:10px;letter-spacing:2px}.forge-sign h3{color:#fff0cc;margin:7px 0 0;font:28px/1.15 ClanDisplay,sans-serif}.forge-weapon{position:absolute;left:50%;top:20%;transform:translateX(-50%);width:230px;height:230px;display:grid;place-items:center}.forge-weapon img{position:relative;width:85%;height:85%;object-fit:contain;filter:drop-shadow(3px 5px 2px #25160dcc);transform:rotate(-25deg)}.forge-glow{position:absolute;inset:0;border-radius:50%;background:radial-gradient(#ffedb199,#e4a43122,transparent 68%)}.forge-weapon strong{position:absolute;right:6px;bottom:10px;display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:#5e3824;border:3px solid #ffe2a0;color:#ffe5a2;font:32px ClanDisplay,sans-serif;box-shadow:0 4px 0 #342117}.forge-weapon[data-level="0"] .forge-glow{opacity:.35}.forge-weapon.is-forging{animation:forge-strike .65s ease-in-out}.forge-result{position:absolute;z-index:3;left:50%;top:40%;transform:translate(-50%,-50%) rotate(-4deg);padding:18px 25px;background:#f8dd94;border:3px solid #714725;box-shadow:0 5px 0 #392516;border-radius:12px;color:#55331b;font:28px/1.2 ClanDisplay,sans-serif;white-space:nowrap}.forge-assurance{position:absolute;bottom:100px;left:50%;transform:translateX(-50%);background:#2c211ce8;border:1px solid #c29b5e;color:#ffe5b2;border-radius:20px;padding:8px 14px;font-size:12px;max-width:90%;text-align:center;width:max-content}.demo-workbench{grid-template-columns:1fr 1.3fr auto;gap:16px 22px;background:linear-gradient(#f5e6c4,#e4c899);padding:22px}.demo-upgrade-info{gap:8px}.demo-upgrade-info strong{font:23px/1.15 ClanDisplay,sans-serif;color:#51321e}.demo-upgrade-info>span{display:none}.demo-upgrade-info small{font-size:12px;color:#6a4d30}.material-requirements{display:flex;flex-wrap:wrap;gap:7px}.material-requirements span{display:block;padding:7px 10px;border:1px solid #698051;border-radius:7px;background:#e8edd4;color:#35532d;font:700 13px/1.2 system-ui}.material-requirements span.is-missing{border-color:#ad6846;background:#f6e1cc;color:#8a3b24}.demo-workbench .button:disabled{background:linear-gradient(#d8c4a1,#c4ac85);color:#634e34;box-shadow:inset 0 0 0 2px #f2dfb8,0 3px 0 #8d734b;cursor:not-allowed;opacity:1}.gather-button{grid-column:2/-1;justify-self:stretch;border:1px solid #99723c;border-radius:8px;background:#fff0c9;color:#614020;font:700 13px system-ui;padding:11px;cursor:pointer}.gather-button[hidden]{display:none}.gather-button:hover{background:#ffdf95}.demo-bottom{background:#d5b985}.demo-choices select{min-height:44px}.demo-npc p{box-shadow:0 3px 0 #61482b66}.demo-choices label{font-size:12px}
@keyframes forge-strike{20%{translate:0 -14px;rotate:-7deg}45%{translate:0 18px;rotate:6deg;filter:brightness(2)}70%{translate:0 -5px}100%{translate:0;rotate:0deg}}
@media(max-width:960px){.hero-landscape{background-position:62% center}.hero:before{background:linear-gradient(90deg,#f6e6c6ed,#f6e6c6aa 34%,#f6e6c600 72%)}.hero h1{max-width:470px}.reward-card{padding-inline:20px}.reward-card h3{font-size:25px}}
@media(max-width:760px){.hero{min-height:840px}.hero-landscape{background-size:auto 520px;background-position:78% bottom;background-color:#f4e4c6}.hero:before{background:linear-gradient(#f6e6c6 0%,#f6e6c6 32%,#f6e6c600 65%)}.hero-content{padding-top:115px;padding-bottom:390px}.hero h1{font-size:42px;max-width:390px;line-height:1.05}.hero-intro{font-size:14px;line-height:1.7;max-width:340px;margin-top:17px}.hero-buttons{margin-top:22px}.hero .status-pill{margin-bottom:20px;font-size:8px}.hero .eyebrow{font-size:9px}.hero:after{background:linear-gradient(0deg,#f1e1bc,transparent 12%)}.reward-card:first-child{transform:none}.reward-grid{gap:24px}.reward-card{display:grid;grid-template-columns:105px 1fr;padding:50px 20px 25px;text-align:left;gap:6px 18px;min-height:205px}.reward-card .reward-art{grid-row:1/5;height:130px;margin:0}.reward-card .title-medallion{width:90px;height:108px}.reward-card .title-medallion svg{width:30px;height:30px}.reward-card .reward-crest{width:100px;height:100px}.reward-card .reward-crest img{width:75px;height:75px}.reward-card .reward-chest{width:110px;height:120px}.reward-card h3{font-size:26px}.reward-card p{font-size:13px}.reward-card .reward-number{margin:0;font-size:9px}.reward-card .planned-label{top:12px;right:12px}.beta-invite-card{padding:27px 22px}.demo-stage{min-height:470px}.demo-mode button{font-size:14px;padding:10px 8px}.forge-sign{top:14px;padding:10px 14px}.forge-sign h3{font-size:22px}.forge-sign span{font-size:8px}.forge-weapon{top:22%;width:185px;height:185px}.forge-assurance{font-size:10px;bottom:110px}.forge-result{font-size:20px;padding:15px;white-space:normal;width:75%;text-align:center}.demo-workbench{grid-template-columns:1fr;gap:15px;padding:18px}.demo-choices{grid-column:1;grid-template-columns:auto 1fr auto 1fr}.demo-upgrade-info{grid-column:1}.demo-workbench .button{grid-column:1;justify-content:center;width:100%;min-height:50px;font-size:19px}.gather-button{grid-column:1}.material-requirements span{font-size:13px;flex:1;text-align:center}.demo-workbench .demo-upgrade-info strong{font-size:22px}.demo-upgrade-info small{font-size:12px}.world-card h3{font-size:29px}.world-card-copy{inset:auto 23px 25px}.founder-dialog{padding:18px 16px}.founder-dialog .submit-button{font-size:17px}.demo-bottom button{font-size:12px}}
@media(prefers-reduced-motion:reduce){.forge-weapon.is-forging{animation:none}}

@media(min-width:761px){.hero-landscape{background-size:auto 100%;background-position:right bottom;background-color:#f4e4c6}.hero:before{background:linear-gradient(90deg,#f6e6c6 0%,#f6e6c6d9 28%,#f6e6c600 60%)}}
@media(max-width:480px){.founder-greeting{margin-right:0;gap:8px}.founder-greeting img{width:46px;height:46px;flex-shrink:0}.founder-greeting>div{flex:1;min-width:0;padding:10px}.founder-greeting h2{font-size:19px}.founder-greeting span{font-size:10px}.founder-dialog>p{font-size:14px}.founder-dialog .consent{font-size:12px}.founder-dialog .privacy-note{line-height:1.6}}
/* V3: the illustration fades into the page instead of ending at a vertical seam. */
@media(min-width:761px){.hero-landscape{inset:0 0 0 auto;width:min(1700px,88vw);background-size:cover;background-position:right 20%;background-color:transparent;mask-image:linear-gradient(90deg,transparent 0%,#000 32%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 32%)}.hero:before{background:linear-gradient(90deg,#f6e6c6 0%,#f6e6c6f0 24%,#f6e6c6a6 38%,#f6e6c600 62%)}.hero:after{background:linear-gradient(0deg,#f1e1bc,transparent 21%)}.hero h1{max-width:650px}.hero-intro{background:none}}
.demo-stage[data-mode=adventure] .demo-town-art,.demo-stage[data-mode=adventure][data-faction=karus] .demo-town-art{background:linear-gradient(#34281c08,#34281c26),url('/images/landing/mining-courtyard-v3.webp') center 58%/cover;filter:none}.demo-stage[data-mode=adventure]{min-height:580px}.demo-health{border:2px solid #d2b16a;background:linear-gradient(#493b2deb,#2c2923f5);box-shadow:inset 0 0 0 3px #cba55c22,0 5px 0 #2d211b55}.demo-health strong{color:#fff0c9}.demo-health progress::-webkit-progress-bar{background:#172f31}.demo-health progress::-webkit-progress-value{background:linear-gradient(#c0f7e8,#4bc6ba);box-shadow:inset 0 -3px #198e8f}.demo-hero{bottom:73px;left:8%;height:400px;width:31%;filter:drop-shadow(8px 10px 3px #33230f66)}.demo-crystal{left:49%;top:27%;height:52%;width:32%;display:flex;flex-direction:column;align-items:center}.demo-crystal>img{height:82%;width:100%;object-fit:contain;filter:drop-shadow(0 8px 3px #223c3e55) drop-shadow(0 0 12px #7af5df55)}.crystal-aura{inset:47% 6% 13%;border-bottom:2px solid #7cdccb;background:radial-gradient(ellipse,#72ebd95c,transparent 65%)}.crystal-prompt{position:relative;padding:7px 23px 9px;border:2px solid #b9cfa0;border-radius:12px;background:linear-gradient(#427369,#244f4c);box-shadow:0 4px 0 #1c3934;color:#fff2c9;font:22px/1 ClanDisplay,sans-serif;text-shadow:0 2px #203e38}.crystal-prompt small{font:10px/1.3 system-ui;color:#e2f2df;letter-spacing:.3px;margin-top:5px}.demo-weapon-level{left:31%;bottom:128px;border-radius:12px;transform:rotate(-5deg);background:linear-gradient(#705133,#45311f);box-shadow:0 4px 0 #38291c}.demo-npc p{background:#fff1d4;border-color:#8c6e43;color:#49331f;max-width:600px}.demo-npc img{box-shadow:0 0 0 3px #553820,0 4px 7px #0005}.demo-wallet span{padding:7px 12px;background:#2e241b80;border:1px solid #bf9a5944;border-radius:20px}
/* One featured founder reward and two supporting previews. */
.reward-showcase{display:grid;grid-template-columns:1.15fr 1fr;grid-template-rows:1fr 1fr;gap:20px;max-width:1140px}.reward-showcase .reward-card{margin:0;transform:none;min-width:0;border-radius:18px;box-shadow:inset 0 0 0 4px #f8e5bc,0 5px 0 #aa8349,0 15px 30px #69492620;padding:34px 25px;overflow:hidden}.reward-showcase .reward-featured{grid-row:1/3;display:flex;flex-direction:column;align-items:center;text-align:center;background:radial-gradient(ellipse at 50% 18%,#916c3a,#523923 48%,#34291f);border-color:#d7b572;box-shadow:inset 0 0 0 4px #8a6438,0 6px 0 #3c2e20,0 18px 35px #65462240;padding:35px 38px}.reward-featured:before{content:'';position:absolute;inset:12px;border:1px solid #d7b57244;border-radius:10px;pointer-events:none}.reward-featured .reward-art{height:205px;width:100%;margin:18px 0 18px;background:radial-gradient(ellipse,#eaca7a30,transparent 65%)}.founder-standard{position:relative;width:126px;height:154px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:3px solid #f3d592;border-radius:48px 48px 16px 16px;background:linear-gradient(135deg,#dec17c,#a87b37 48%,#8f5f2c);box-shadow:inset 0 0 0 5px #71502b,inset 0 0 0 7px #eccb82,0 9px 0 #302419,0 13px 24px #19150d77;transform:rotate(-5deg);color:#fff3c9}.founder-standard>svg{width:45px;height:45px;stroke:#fff0bf;fill:none;stroke-width:1.6}.founder-standard>span{font:52px/1 Georgia,serif;color:#fff0bb;text-shadow:0 3px #745022}.standard-ribbon{position:absolute;bottom:-15px;left:-20px;right:-20px;padding:9px 4px;background:linear-gradient(#426a5c,#2c493f);border:2px solid #d2b36b;color:#ffedb7;font:700 11px/1.2 Georgia,serif;letter-spacing:2px;box-shadow:0 4px 0 #1e3029}.reward-featured .reward-copy{width:100%;position:relative}.reward-featured .reward-number{font:10px/1.4 system-ui;letter-spacing:1.6px;color:#e8cfa5;display:block;margin-bottom:12px}.reward-featured h3{font-size:40px;color:#ffdfa0;margin-bottom:10px}.reward-featured p{color:#f3dfba;max-width:none}.reward-perks{display:grid;gap:9px;text-align:left;max-width:315px;margin:20px auto 24px}.reward-perks>span{display:flex;gap:9px;align-items:center;color:#e8d5b4;font:13px/1.4 system-ui}.reward-perks svg{width:17px;height:17px;stroke:#a9c8a5;fill:none;stroke-width:2;flex-shrink:0}.reward-featured .button{width:100%;justify-content:center;font-size:16px;gap:13px;min-height:52px}.reward-showcase .reward-future{display:grid;grid-template-columns:135px 1fr;align-items:center;gap:23px;padding:42px 26px 28px;text-align:left;background:linear-gradient(130deg,#fff4d7,#e6cda1)}.reward-future .reward-art{width:135px;height:150px;margin:0;display:grid;place-items:center;grid-row:auto}.reward-future .reward-copy{min-width:0}.reward-future h3{font-size:29px;margin:10px 0;color:#654321}.reward-future p{font-size:13px;line-height:1.65;max-width:none;color:#6b5036}.reward-future .reward-number{font:9px system-ui;letter-spacing:1.4px;color:#80623d}.founder-frame{position:relative;width:108px;height:128px;flex-shrink:0;border:6px double #c7a468;border-radius:24px;background:radial-gradient(#706c4f,#2d3930);box-shadow:0 0 0 4px #806239,0 7px 12px #66441e44;overflow:visible}.founder-frame img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 12%;border-radius:16px}.founder-frame>span{position:absolute;bottom:-14px;left:50%;transform:translateX(-50%);background:#694b2b;color:#ffe4a0;border:2px solid #c5a56b;width:30px;height:30px;display:grid;place-items:center;line-height:1;border-radius:7px}.reward-future .reward-chest{width:135px;height:145px;object-fit:contain;filter:drop-shadow(0 9px 5px #51331644)}.reward-showcase .planned-label{top:13px;right:13px;z-index:2;padding:6px 9px;font-size:8px}.reward-showcase .reward-featured .planned-label{background:#e5c384;color:#50351f;border-color:#f1d9a1}
@media(max-width:960px){.reward-showcase{grid-template-columns:1fr 1fr;gap:15px}.reward-showcase .reward-featured{padding:32px 24px}.reward-showcase .reward-future{grid-template-columns:95px 1fr;gap:18px;padding:40px 20px 24px}.reward-future .reward-art{width:95px}.reward-future .founder-frame{width:80px;height:105px}.reward-future .reward-chest{width:100px;height:115px}.reward-future h3{font-size:25px}.reward-featured h3{font-size:35px}.reward-featured .button{font-size:14px}}
@media(max-width:760px){.demo-stage[data-mode=adventure]{min-height:465px}.demo-hero{left:-3%;width:48%;height:280px;bottom:86px}.demo-crystal{left:43%;top:29%;width:53%;height:43%}.demo-weapon-level{left:29%;bottom:132px;font-size:17px}.crystal-prompt{font-size:18px;padding:7px 17px}.crystal-prompt small{font-size:9px}.demo-health{left:14px;right:14px;padding:12px}.demo-wallet span{padding:5px 11px}.demo-wallet{gap:12px}.reward-showcase{grid-template-columns:1fr;grid-template-rows:auto;max-width:540px;gap:20px}.reward-showcase .reward-featured{grid-row:auto;padding:27px 24px 30px}.reward-featured .reward-art{height:175px;margin:15px 0}.founder-standard{width:110px;height:134px}.founder-standard>svg{width:38px;height:38px}.founder-standard>span{font-size:43px}.reward-featured h3{font-size:34px}.reward-showcase .reward-future{grid-template-columns:90px 1fr;gap:20px;padding:43px 20px 25px}.reward-future .reward-art{height:125px;width:90px}.reward-future h3{font-size:27px}.reward-featured .reward-number{font-size:9px}.reward-featured .button{font-size:15px}.reward-perks{max-width:100%}.reward-future .reward-number{font-size:9px}.reward-future p{font-size:13px}}
@media(prefers-reduced-motion:reduce){.demo-crystal,.founder-standard{animation:none}}
.reward-showcase .reward-art.reward-crest{border:0;border-radius:0;box-shadow:none;background:radial-gradient(ellipse,#d4b16a40,transparent 68%)}
/* Town v4: one illustrated asset family, transparent buildings on a shared ground plane. */
.demo-stage[data-mode=town]{min-height:590px}
.demo-stage[data-mode=town] .demo-town-art,.demo-stage[data-mode=town][data-faction=karus] .demo-town-art{background:url('/images/landing/town-green-v4.webp') center 55%/cover;filter:none}
.demo-city{inset:0 3% 100px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:22px;padding-top:82px}
.demo-city[hidden]{display:none}
.demo-city-hint{position:absolute;top:18px;left:50%;transform:translateX(-50%);margin:0;padding:10px 20px;width:max-content;max-width:95%;font-size:13px;background:#fff2d4ed;border:1px solid #94723c;color:#513c25;box-shadow:0 3px 0 #63492344}
.demo-city .demo-building{position:relative;top:auto;left:auto;width:100%;height:350px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:0 0 4px;isolation:isolate;border-radius:18px;outline-offset:4px}
.demo-city .demo-building>img{position:relative;display:block;width:100%;height:285px;object-fit:contain;object-position:center bottom;transform:scale(.88);transform-origin:center bottom;filter:drop-shadow(0 8px 3px #473e2540);transition:transform .35s,filter .2s}
.demo-city .demo-building[data-building=hall]>img{height:310px}
.demo-city .demo-building[data-tier="1"]>img{transform:scale(.94)}
.demo-city .demo-building[data-tier="2"]>img{transform:scale(.96)}
.demo-city .demo-building[data-tier="3"]>img{transform:scale(1)}
.demo-city .demo-building:hover>img,.demo-city .demo-building:focus-visible>img{filter:drop-shadow(0 8px 3px #473e2540) drop-shadow(0 0 4px #fff0ab)}
.demo-city .building-foundation{display:none}
.demo-city .building-caption{flex-shrink:0;min-width:140px;width:80%;max-width:230px;margin:7px auto 0;padding:9px 12px;background:linear-gradient(#fff2d3,#dfc18a);color:#50351e;border:2px solid #8d6734;border-radius:10px;box-shadow:inset 0 0 0 2px #fff0ce,0 4px 0 #674d2e;font-size:15px;line-height:1.2}
.demo-city .building-caption small{color:#795c36;font-size:11px;margin-top:5px}
.demo-city .demo-building[aria-pressed=true] .building-caption{background:linear-gradient(#416657,#29483c);color:#fff0c9;border-color:#ebc77c;box-shadow:inset 0 0 0 2px #658471,0 4px 0 #24392c}
.demo-city .demo-building[aria-pressed=true] .building-caption small{color:#e8d5ab}
.demo-city .building-banner{top:24%;right:4%;padding:10px 6px;background:#385c4a;color:#ffe8a1;border-color:#d1ac63;z-index:1}
.demo-city [data-tier="2"] .building-banner{display:none}
.demo-city [data-tier="3"] .building-banner{display:block}
@media(max-width:760px){
.demo-stage[data-mode=town]{min-height:650px}
.demo-city{inset:55px 10px 105px;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:1fr 1fr;gap:5px 10px;padding:0;align-items:end}
.demo-city-hint{top:-43px;padding:8px 12px;font-size:11px;max-width:100%;width:max-content}
.demo-city .demo-building{height:230px}
.demo-city .demo-building[data-building=hall]{grid-column:1/-1;width:54%;justify-self:center;height:235px}
.demo-city .demo-building>img,.demo-city .demo-building[data-building=hall]>img{height:180px;width:100%;max-width:235px}
.demo-city .building-caption{width:96%;min-width:0;padding:7px 4px;font-size:12px;margin-top:2px}
.demo-city .building-caption small{font-size:10px;margin-top:3px}
.demo-city .building-banner{top:18%;right:1%;font-size:10px;padding:8px 5px}
.demo-stage[data-mode=town] .demo-town-art{background-position:center;background-size:auto 100%}
}
@media(prefers-reduced-motion:reduce){.demo-city .demo-building>img{transition:none}}
/* Guided demo journey, explicit upgrade benefits and live resource feedback. */
.demo-journal{display:grid;grid-template-columns:58px minmax(0,1fr) 250px;gap:18px;align-items:center;padding:22px 24px;background:linear-gradient(115deg,#fff0cc,#e7c992);border-bottom:2px solid #9b783f;color:#513820}
.journal-seal{width:56px;height:66px;border:3px double #d4ac60;border-radius:20px 20px 14px 14px;background:linear-gradient(#5d785b,#304e3e);color:#ffe2a0;display:grid;place-items:center;box-shadow:0 4px 0 #304432}
.journal-seal svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.6}
.journal-step{display:block;font:700 9px/1.3 system-ui;letter-spacing:1.5px;color:#866033;margin-bottom:5px}
.journal-copy h3{font:26px/1.1 ClanDisplay,sans-serif;color:#53371e;margin:0 0 6px}
.journal-copy p{font:13px/1.5 system-ui;margin:0;max-width:470px;color:#705236}
.journal-progress>div{display:flex;align-items:center;justify-content:space-between;gap:12px;font:700 11px/1.3 system-ui;color:#74552c}
.journal-progress b{white-space:nowrap}
.journal-progress progress{display:block;width:100%;height:7px;margin:9px 0 11px;appearance:none;border:0;border-radius:7px;overflow:hidden;background:#ceb17e}
.journal-progress progress::-webkit-progress-bar{background:#ceb17e}
.journal-progress progress::-webkit-progress-value{background:#54724d;border-radius:7px}
.journal-progress progress::-moz-progress-bar{background:#54724d}
.journal-progress button{width:100%;min-height:44px;padding:9px 14px;font:18px ClanDisplay,sans-serif;color:#fff0c8;border:2px solid #bd9956;border-radius:9px;background:linear-gradient(#6a4c30,#493421);box-shadow:inset 0 0 0 1px #b08b4b,0 3px 0 #70502c;cursor:pointer}
.journal-progress button:hover{background:linear-gradient(#80603d,#5b412b)}
.demo-journal.is-ready .journal-progress button{background:linear-gradient(#4f775d,#2b503d);border-color:#edc981;color:#fff0b8}
.demo-journal.is-ready .journal-step{color:#2e5e3b}
.demo-journal.is-complete .journal-seal{background:linear-gradient(#d9b267,#946325);color:#fff2c6;border-color:#ffe3a3}
.demo-stats{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:0;background:#493621;border-top:2px solid #ab8545;border-bottom:1px solid #c8a264;padding:15px 20px;color:#ffe5b1}
.demo-stats>div{display:flex;flex-wrap:wrap;align-items:baseline;gap:5px 9px;padding:0 20px;border-right:1px solid #b18b5055}
.demo-stats>div:first-child{padding-left:0}.demo-stats>div:last-child{border:0}
.demo-stats>div>span{font:11px/1.4 system-ui;color:#e4c99e;flex-basis:100%}
.demo-stats strong,.demo-stats strong b{font:25px/1.1 ClanDisplay,sans-serif;font-weight:400}
.demo-stats strong small{font:12px system-ui;color:#e4c99e}
.demo-stats>div>small{font:10px system-ui;color:#e4c99e}
.demo-result{margin:0;padding:10px 18px;min-height:39px;background:#dfe5c5;color:#34502d;text-align:center;font:700 13px/1.4 system-ui;border-bottom:1px solid #9fa878}
.demo-result[hidden]{display:block;visibility:hidden}
.town-demo{background:#eddbb5}
.demo-upgrade-info .upgrade-detail{font:12px/1.5 system-ui;color:#705335;margin:0 0 3px;max-width:430px}
.demo-upgrade-info [data-upgrade-benefit]{font-weight:700;color:#355741;background:#e0e6c8;padding:7px 9px;border-radius:6px;width:fit-content}
.demo-journal button:focus-visible,.demo-building:focus-visible{outline:3px solid #2c706b;outline-offset:4px}
@media(max-width:760px){
.demo-journal{grid-template-columns:42px minmax(0,1fr);gap:10px 12px;padding:17px 16px}
.journal-seal{width:40px;height:52px;border-radius:14px}.journal-seal svg{width:25px;height:25px}
.journal-copy h3{font-size:22px}.journal-copy p{font-size:12px}.journal-step{font-size:8px}
.journal-progress{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) 115px;gap:0 14px;align-items:center}
.journal-progress>div{grid-column:1;grid-row:1;font-size:10px;gap:6px}.journal-progress progress{grid-column:1;grid-row:2;margin:6px 0 0}
.journal-progress button{grid-column:2;grid-row:1/3;min-height:45px;font-size:16px;padding:8px}
.demo-stats{padding:13px 12px;grid-template-columns:1.2fr 1fr 1fr}
.demo-stats>div{display:block;padding:0 9px}.demo-stats>div>span{display:block;font-size:10px;margin-bottom:5px}.demo-stats strong,.demo-stats strong b{font-size:23px}
.demo-stats strong small{font-size:10px}.demo-stats>div>small{display:block;font-size:9px;line-height:1.5;margin-top:3px}
.demo-result{font-size:12px;padding:10px 12px;min-height:39px}.demo-upgrade-info .upgrade-detail{font-size:12px}
}