.campaign-world-body{overflow-x:hidden}
.campaign-world-body .site-shell{max-width:100%;overflow-x:hidden}
.campaign-world-main{width:min(900px,calc(100% - 40px));margin:0 auto;padding:38px 0 78px}
.campaign-world-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(230px,.75fr);gap:28px;align-items:end;padding:16px 4px 26px}
.campaign-world-hero h1{margin:5px 0 10px;font-size:clamp(42px,7vw,66px);line-height:.94;letter-spacing:-.05em}
.campaign-world-hero p{max-width:620px;margin:0;color:var(--muted);font-size:13px;line-height:1.65}
.campaign-world-actions{display:grid;justify-items:end;gap:12px;text-align:right}
.campaign-world-actions p{max-width:320px;font-size:10px}
.campaign-collection-link{position:relative}
.campaign-world-shell{position:relative}
.campaign-world{width:min(720px,100%);margin:0 auto;overflow:hidden}
.campaign-world-chapter{position:relative;display:grid;gap:14px;box-sizing:border-box;padding:18px 20px 22px;border:1px solid rgba(119,188,255,.16);border-radius:22px;background:linear-gradient(180deg,rgba(17,35,52,.94),rgba(8,20,31,.96));box-shadow:0 18px 60px rgba(0,0,0,.35);animation:campaignChapterIn .28s ease-out}
.campaign-world-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:2px 4px 4px}
.campaign-world-heading div{display:flex;align-items:center;gap:9px;min-width:0}
.campaign-world-heading span{color:#cfe2f2;font-size:12px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}
.campaign-world-heading small{padding:4px 7px;border-radius:999px;background:rgba(255,255,255,.055);color:#8fa9bd;font-size:8px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.campaign-world-heading strong{color:#7894a9;font-size:10px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.campaign-chapter-arrow{min-height:38px;border:1px solid rgba(119,188,255,.1);border-radius:12px;background:rgba(7,17,28,.6);color:#94adbf;display:flex;align-items:center;justify-content:center;gap:9px;font:inherit;font-size:9px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:border-color .18s,color .18s,background .18s,transform .18s}
.campaign-chapter-arrow span{font-size:17px;line-height:1}
.campaign-chapter-arrow:hover:not(:disabled){border-color:rgba(54,209,255,.35);background:rgba(20,38,56,.86);color:#dff4ff}
.campaign-chapter-arrow.is-prev:hover:not(:disabled){transform:translateX(-1px)}
.campaign-chapter-arrow.is-next:hover:not(:disabled){transform:translateX(1px)}
.campaign-chapter-arrow:disabled{opacity:.22;cursor:not-allowed}
.campaign-world.is-transitioning{pointer-events:none}
.campaign-chapter-transition-track{display:flex;width:100%;will-change:transform}
.campaign-chapter-transition-track>.campaign-world-chapter{flex:0 0 100%;width:100%;animation:none}
.campaign-chapter-transition-track.is-forward{animation:campaignChapterSlideForward .84s steps(7,end) both}
.campaign-chapter-transition-track.is-backward{animation:campaignChapterSlideBackward .84s steps(7,end) both}

.campaign-route-board{position:relative;width:min(620px,100%);aspect-ratio:1/1;margin:0 auto;display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(7,1fr);gap:6px;padding:8px;background:#07111c;border:1px solid rgba(255,255,255,.07);border-radius:20px;box-shadow:inset 0 0 32px rgba(0,0,0,.28);touch-action:manipulation}
.campaign-board-cell{position:relative;min-width:0;min-height:0;border-radius:10px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.045)}
.campaign-board-space{display:block;background:#101e2b;opacity:.24}
.campaign-stage-node{appearance:none;border:0;background:var(--neutral);color:#d9e8f3;display:grid;place-items:center;overflow:hidden;cursor:pointer;transition:transform .12s ease,filter .15s ease,background .22s ease,opacity .18s ease,box-shadow .18s ease}
.campaign-stage-node:hover:not(:disabled){filter:brightness(1.13);transform:scale(1.035);z-index:3}
.campaign-stage-node.is-route{box-shadow:inset 0 0 0 1px rgba(74,116,149,.72),0 2px 8px rgba(0,0,0,.2)}
.campaign-stage-node.is-completed{background:linear-gradient(145deg,#1473d7,#1e95ff);box-shadow:inset 0 0 0 1px rgba(206,235,255,.2),0 0 15px rgba(37,140,255,.12)}
.campaign-stage-node.is-current{z-index:4;outline:2px solid var(--blue2);outline-offset:-2px;background:var(--neutral);box-shadow:inset 0 0 0 1px rgba(115,187,255,.45),0 0 20px rgba(37,140,255,.24)}
.campaign-stage-node.is-locked{opacity:.31;cursor:not-allowed;filter:saturate(.45)}
.campaign-stage-node.is-claiming{background:var(--neutral);filter:brightness(1.45)}
.campaign-stage-node.just-completed{animation:campaignStageClaim .62s cubic-bezier(.2,.9,.25,1.35)}
.campaign-stage-node.just-arrived{animation:campaignStageArrival .7s cubic-bezier(.2,.9,.25,1.25)}
.campaign-stage-number{position:relative;z-index:2;font-size:clamp(10px,1.7vw,14px);font-weight:950;font-variant-numeric:tabular-nums;text-shadow:0 2px 6px rgba(0,0,0,.42)}
.campaign-stage-node.is-booster-milestone{box-shadow:inset 0 0 0 2px rgba(255,209,102,.62),0 0 16px rgba(255,209,102,.08)}
.campaign-stage-node.is-booster-milestone.is-completed{box-shadow:inset 0 0 0 2px rgba(255,224,139,.72),0 0 18px rgba(37,140,255,.16)}
.campaign-milestone-mark{position:absolute;right:7%;top:5%;z-index:3;color:var(--warn);font-size:clamp(8px,1.5vw,13px);text-shadow:0 0 8px rgba(255,209,102,.45)}
.campaign-stage-node.is-boss{box-shadow:inset 0 0 0 2px rgba(255,209,102,.55),0 0 18px rgba(255,209,102,.08);background:linear-gradient(145deg,#172635,#102131)}
.campaign-stage-node.is-boss.is-completed{background:linear-gradient(145deg,#1473d7,#1e95ff);box-shadow:inset 0 0 0 2px rgba(255,222,132,.7),0 0 18px rgba(37,140,255,.18)}
.campaign-boss-avatar{position:absolute;inset:7%;width:86%;height:86%;object-fit:contain;border-radius:9px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.42));pointer-events:none}
.campaign-stage-node.is-locked .campaign-boss-avatar{filter:grayscale(.8) brightness(.6);opacity:.68}
.campaign-stage-node.is-completed .campaign-boss-avatar{filter:drop-shadow(0 3px 7px rgba(0,0,0,.42)) saturate(1.08)}
.campaign-stage-number.boss-number{position:absolute;right:5%;bottom:4%;min-width:18px;padding:2px 4px;border-radius:6px;background:rgba(4,10,16,.82);color:#fff;font-size:8px;line-height:1.2}

.campaign-route-runner{--to-left:50%;--to-top:50%;position:absolute;z-index:8;left:var(--to-left);top:var(--to-top);width:clamp(28px,7.4vw,54px);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none;border-radius:50%;filter:drop-shadow(0 4px 9px rgba(0,0,0,.55));box-shadow:0 0 0 3px rgba(205,233,255,.94),0 0 0 6px rgba(37,140,255,.58),0 0 22px rgba(37,140,255,.65);background:linear-gradient(145deg,#1473d7,#1e95ff);overflow:hidden}
.campaign-current-avatar-image{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.campaign-current-avatar-initial{display:grid;width:100%;height:100%;place-items:center;border-radius:50%;background:linear-gradient(145deg,#1473d7,#1e95ff);color:#fff;font-size:clamp(13px,3vw,24px);font-weight:950;line-height:1;text-shadow:0 2px 7px rgba(0,0,0,.35)}
.campaign-route-runner.is-moving{animation:campaignRunnerMove .7s cubic-bezier(.3,.7,.2,1) both}
.campaign-route-runner.is-arriving{animation:campaignRunnerArrive .55s cubic-bezier(.2,.9,.25,1.35)}

.campaign-jump-current{position:fixed;z-index:35;right:max(18px,env(safe-area-inset-right));bottom:max(20px,calc(env(safe-area-inset-bottom) + 16px));padding:11px 15px;border:1px solid rgba(54,209,255,.28);border-radius:999px;background:rgba(10,27,35,.94);color:#cdeeff;font:inherit;font-size:10px;font-weight:900;box-shadow:0 12px 36px rgba(0,0,0,.35);backdrop-filter:blur(12px);cursor:pointer}

.campaign-stage-sheet{width:min(620px,calc(100% - 24px));max-height:min(82vh,720px);margin:auto 0 0 auto;padding:0;border:1px solid rgba(123,191,216,.20);border-radius:26px 26px 0 0;background:#091722;color:#eaf3f8;box-shadow:0 -30px 90px rgba(0,0,0,.5);overflow:auto}
.campaign-stage-sheet::backdrop{background:rgba(0,7,12,.7);backdrop-filter:blur(5px)}
.campaign-stage-sheet-handle{width:48px;height:4px;margin:10px auto 2px;border-radius:999px;background:rgba(255,255,255,.16)}
.campaign-stage-sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:20px 22px 14px}
.campaign-stage-sheet-head h2{margin:5px 0 2px;font-size:30px;letter-spacing:-.035em}
.campaign-stage-sheet-head p{margin:0;color:var(--muted);font-size:10px}
.campaign-sheet-close{width:36px;height:36px;border:1px solid rgba(255,255,255,.09);border-radius:50%;background:#0d2230;color:#cadbe5;font-size:23px;cursor:pointer}
.campaign-stage-sheet-section{padding:6px 22px 10px}
.campaign-stage-sheet-label{color:#9eb4c2;font-size:9px;font-weight:950;letter-spacing:.13em}
.campaign-stage-sheet-help{margin:6px 0 14px;color:#698596;font-size:10px;line-height:1.5}
.campaign-stage-boosters{display:grid;gap:9px}
.campaign-booster-card{width:100%;display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 13px;border:1px solid rgba(125,181,209,.14);border-radius:15px;background:#0b1c28;color:#dce9ef;text-align:left;cursor:pointer}
.campaign-booster-card:not(:disabled):hover{border-color:rgba(123,205,165,.38)}
.campaign-booster-card:disabled{opacity:.43;cursor:not-allowed}
.campaign-booster-card.is-selected{border-color:rgba(170,224,132,.55);background:linear-gradient(145deg,rgba(35,82,58,.48),rgba(11,29,38,.96));box-shadow:inset 0 0 0 1px rgba(179,229,139,.08)}
.campaign-booster-card.is-free{opacity:1;border-color:rgba(113,202,249,.55);background:linear-gradient(145deg,rgba(24,70,95,.55),rgba(10,28,39,.96))}
.campaign-booster-card.is-free b{color:#a9e6ff}
.campaign-booster-icon{width:42px;height:42px;border-radius:13px;background:rgba(255,255,255,.045);display:grid;place-items:center;font-size:20px}
.campaign-booster-card strong{display:block;font-size:12px}
.campaign-booster-card span{display:block;margin-top:3px;color:#7f99a8;font-size:9px;line-height:1.35}
.campaign-booster-card b{color:#9fb2bd;font-size:9px;white-space:nowrap}
.campaign-stage-sheet-message{min-height:18px;margin:6px 22px;color:#e8b69c;font-size:10px}
.campaign-stage-start.site-play-cta{display:flex!important;width:calc(100% - 44px);justify-content:center;margin:8px 22px max(22px,env(safe-area-inset-bottom));border:0;cursor:pointer}
.campaign-collection-badge{position:absolute;top:-8px;right:-8px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;display:grid;place-items:center;background:#d9ee7f;color:#102015;font-size:9px;font-weight:950;box-shadow:0 0 0 3px #07111c}
.campaign-badge-host{position:relative}

@keyframes campaignChapterIn{from{opacity:.45;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes campaignChapterSlideForward{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@keyframes campaignChapterSlideBackward{from{transform:translateX(-100%)}to{transform:translateX(0)}}
@keyframes campaignStageClaim{0%{transform:scale(.72);filter:brightness(1.9)}65%{transform:scale(1.1);filter:brightness(1.25)}100%{transform:scale(1);filter:brightness(1)}}
@keyframes campaignStageArrival{0%{box-shadow:inset 0 0 0 1px rgba(115,187,255,.45),0 0 0 rgba(37,140,255,0)}55%{box-shadow:inset 0 0 0 2px rgba(115,187,255,.9),0 0 30px rgba(37,140,255,.45)}100%{box-shadow:inset 0 0 0 1px rgba(115,187,255,.45),0 0 20px rgba(37,140,255,.24)}}
@keyframes campaignRunnerMove{from{left:var(--from-left);top:var(--from-top);transform:translate(-50%,-50%) scale(.92)}45%{transform:translate(-50%,-62%) scale(1.12)}to{left:var(--to-left);top:var(--to-top);transform:translate(-50%,-50%) scale(1)}}
@keyframes campaignRunnerArrive{0%{transform:translate(-50%,-50%) scale(.25);opacity:.2}70%{transform:translate(-50%,-50%) scale(1.18);opacity:1}100%{transform:translate(-50%,-50%) scale(1)}}

@media(max-width:720px){
  .campaign-world-main{width:100%;max-width:100%;padding-top:22px}
  .campaign-world-hero{grid-template-columns:1fr;padding:14px 18px 22px}
  .campaign-world-hero h1{font-size:48px}
  .campaign-world-actions{justify-items:start;text-align:left}
  .campaign-world{width:100%;padding:0 10px}
  .campaign-world-chapter{padding:12px 10px 14px;border-radius:18px;gap:10px}
  .campaign-world-heading{padding-inline:2px;gap:8px}
  .campaign-world-heading div{gap:6px}
  .campaign-world-heading span{font-size:10px}
  .campaign-world-heading strong{font-size:8px}
  .campaign-route-board{gap:4px;padding:6px;border-radius:16px}
  .campaign-board-cell{border-radius:8px}
  .campaign-stage-number{font-size:9px}
  .campaign-stage-number.boss-number{font-size:7px;min-width:16px}
  .campaign-chapter-arrow{min-height:34px;font-size:8px}
  .campaign-stage-sheet{width:100%;max-width:100%;max-height:86vh;border-left:0;border-right:0}
  .campaign-booster-card{grid-template-columns:38px minmax(0,1fr) auto;padding:11px}
  .campaign-booster-icon{width:38px;height:38px}
}
@media(prefers-reduced-motion:reduce){
  .campaign-world-chapter,.campaign-chapter-transition-track,.campaign-stage-node.just-completed,.campaign-stage-node.just-arrived,.campaign-route-runner.is-moving,.campaign-route-runner.is-arriving{animation:none}
  .campaign-stage-node,.campaign-jump-current,.campaign-chapter-arrow{transition:none}
}