/* Anomaly Hunt is deliberately small until opened. Shared across both UIs. */
.anomaly-portal{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:14px;padding:8px 10px;border:1px dashed #586652;
  background:#151b13;color:#d7e5c5;
}
.anomaly-portal > span{
  font:700 9px/1.35 "Courier Prime","Courier New",monospace;
  letter-spacing:.08em;
}
.anomaly-portal button{
  flex:0 0 auto;min-height:38px;padding:6px 10px;
  border:1px solid #b8ff35;background:#1b2716;color:#dfff9d;
  font:700 10px/1.2 "Courier Prime","Courier New",monospace;
  cursor:pointer;
}
.anomaly-portal button:hover,.anomaly-portal button:focus-visible{
  background:#b8ff35;color:#11140f;
}
.anomaly-portal.is-active{border-color:#b8ff35}
.anomaly-portal.is-complete{background:#243119}
.anomaly-dialog{
  width:min(600px,calc(100vw - 24px));max-width:600px;max-height:min(85dvh,860px);
  margin:auto;padding:0;border:2px solid #b8ff35;
  background:#0b100b;color:#e6e7dc;overflow:auto;
  box-shadow:8px 8px 0 #0009;
}
.anomaly-dialog::backdrop{background:rgba(2,8,2,.85)}
.anomaly-dialog > header{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  position:sticky;top:0;z-index:1;padding:10px 14px;
  background:#b8ff35;color:#11140f;
  font:700 11px "Courier Prime","Courier New",monospace;
}
.anomaly-dialog > header button{
  min-width:40px;min-height:40px;border:1px solid #11140f;
  background:transparent;color:#11140f;font-size:23px;cursor:pointer;
}
.anomaly-dialog > header button:focus-visible,.anomaly-export:focus-visible{
  outline:3px solid #e04734;outline-offset:2px;
}
.anomaly-body{padding:20px clamp(14px,4vw,26px) 28px}
.anomaly-kicker,.anomaly-step-number,.anomaly-reward > span,.anomaly-pending{
  font:700 10px/1.4 "Courier Prime","Courier New",monospace;
  letter-spacing:.06em;color:#b8ff35;
}
.anomaly-body h2{
  margin:7px 0 12px;font:800 clamp(23px,6vw,38px)/1.05 "Orbitron",sans-serif;
  overflow-wrap:anywhere;
}
.anomaly-body h2 span{color:#b8ff35}
.anomaly-intro,.anomaly-step p,.anomaly-reward p{
  font:400 13px/1.55 "Courier Prime","Courier New",monospace;
}
.anomaly-intro{max-width:52ch;color:#b3c0ad}
.anomaly-steps{display:grid;gap:8px;margin:18px 0}
.anomaly-step{padding:12px;border:1px solid #394437;background:#101710}
.anomaly-step.is-found{border-color:#9ad544;background:#182218}
.anomaly-step strong{display:block;margin-top:4px;font:700 13px/1.3 "Orbitron",sans-serif}
.anomaly-step p{margin:7px 0 0;color:#c8d5c0}
.anomaly-step:not(.is-found) .anomaly-step-number{color:#aab99a}
.anomaly-pending{padding:10px 0;color:#8c9e80}
.anomaly-reward{border:2px solid #b8ff35;padding:16px;background:#1b2716}
.anomaly-reward h3{
  margin:8px 0 12px;color:#e9ffca;
  font:700 clamp(16px,5vw,23px)/1.2 "Orbitron",sans-serif;
  overflow-wrap:anywhere;
}
.anomaly-reward p{margin:8px 0;color:#dfebd3}
.anomaly-reward .anomaly-note{font-size:10px;color:#a5b39b}
.anomaly-export{
  width:100%;min-height:44px;margin-top:10px;padding:9px;
  border:1px solid #11140f;background:#b8ff35;color:#11140f;
  font:700 11px/1.3 "Courier Prime","Courier New",monospace;cursor:pointer;
}
.anomaly-toast{
  position:fixed;z-index:500;right:16px;bottom:16px;max-width:min(380px,calc(100vw - 32px));
  padding:13px;border:1px solid #b8ff35;background:#111a10;color:#e8ffcf;
  font:700 11px/1.4 "Courier Prime","Courier New",monospace;
  box-shadow:4px 4px 0 #0008;
}
.anomaly-toast[hidden]{display:none}
@media(max-width:760px){
  .anomaly-portal{margin:12px 0;flex-wrap:wrap}
  .anomaly-portal button{min-width:110px}
  .anomaly-toast{bottom:calc(86px + env(safe-area-inset-bottom))}
  .anomaly-dialog{
    width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;border:0;
  }
  .anomaly-dialog > header{padding-top:calc(8px + env(safe-area-inset-top))}
  .anomaly-body{padding-bottom:calc(28px + env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:reduce){
  .anomaly-portal button,.anomaly-dialog{scroll-behavior:auto}
}

/* Daily case board and collectible archive. */
.anomaly-case-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:18px 0;
}
.anomaly-case{
  display:flex;flex-direction:column;align-items:flex-start;gap:7px;
  width:100%;min-height:118px;padding:13px;text-align:left;
  border:1px solid #46533f;background:#121b11;color:#e6efe1;cursor:pointer;
}
.anomaly-case small,.anomaly-case span{
  font:700 10px/1.3 "Courier Prime","Courier New",monospace;
  letter-spacing:.04em;
}
.anomaly-case small{color:#b8ff35}
.anomaly-case strong{font:700 13px/1.25 "Orbitron",sans-serif;overflow-wrap:anywhere}
.anomaly-case span{margin-top:auto;color:#a7b6a0}
.anomaly-case.is-solved{border-color:#9ed659;background:#1b2a16}
.anomaly-case.is-solved span{color:#b8ff35}
.anomaly-case.is-selected,.anomaly-collection-grid button.is-selected{outline:2px solid #b8ff35;outline-offset:-3px}
.anomaly-case:hover,.anomaly-case:focus-visible,.anomaly-collection-grid button:hover,.anomaly-collection-grid button:focus-visible{
  outline:3px solid #b8ff35;outline-offset:2px;
}
.anomaly-step .anomaly-note{font-size:10px;color:#90a08b;margin-top:12px}
.anomaly-collection{margin:22px 0 0;padding-top:15px;border-top:1px dashed #6a7d60}
.anomaly-collection h3{margin:0;color:#b8ff35;font:700 14px/1.2 "Orbitron",sans-serif}
.anomaly-collection p{margin:6px 0 12px;color:#abb9a5;font:11px/1.4 "Courier Prime",monospace}
.anomaly-collection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.anomaly-collection-grid button{
  min-height:60px;padding:9px;text-align:left;background:#172116;color:#e5f4dd;
  border:1px solid #465940;cursor:pointer;
}
.anomaly-collection-grid button small,.anomaly-collection-grid button strong{display:block;overflow-wrap:anywhere}
.anomaly-collection-grid button small{color:#b8ff35;font:700 9px/1.35 "Courier Prime",monospace}
.anomaly-collection-grid button strong{margin-top:4px;font:700 11px/1.3 "Orbitron",sans-serif}
.anomaly-collection-grid > span{color:#aab8a4;font:11px "Courier Prime",monospace}
.anomaly-collection-more{
  width:100%;min-height:42px;margin-top:10px;border:1px solid #b8ff35;
  background:#172116;color:#dfff9d;cursor:pointer;
  font:700 11px/1.3 "Courier Prime","Courier New",monospace;
}
.anomaly-collection-more:hover,.anomaly-collection-more:focus-visible{
  background:#b8ff35;color:#11140f;outline:2px solid #b8ff35;outline-offset:2px;
}
@media(max-width:430px){
  .anomaly-case-grid{gap:6px}
  .anomaly-case{min-height:110px;padding:10px}
  .anomaly-case strong{font-size:11px}
  .anomaly-case small,.anomaly-case span{font-size:9px}
  .anomaly-reward-actions{grid-template-columns:1fr}
}

/* Creature pack and collection, shared by desktop and mobile. */
.creature-draw{padding:16px;border:1px solid #8ebf49;background:#142011}
.creature-draw h3{margin:8px 0 12px;color:#e7ffc4;font:700 17px/1.25 "Orbitron",sans-serif}
.creature-draw > p{color:#d3e5c9;font:12px/1.5 "Courier Prime",monospace}
.creature-draw .anomaly-step{margin:12px 0}
.creature-pack{display:grid;place-items:center;gap:12px;margin:16px 0}
.creature-pack-face{
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;
  width:min(100%,200px);aspect-ratio:3/4;padding:14px;border:3px double #b8ff35;
  background:radial-gradient(circle at 50% 43%,#426b25,#172415 63%,#0b120b);
  color:#dfffad;box-shadow:0 0 0 5px #081008,0 10px 30px #0009;
}
.creature-pack-face small,.creature-pack-face span{font:700 9px/1.3 "Courier Prime",monospace;text-align:center;letter-spacing:.09em}
.creature-pack-face b{font:800 86px/1 "Orbitron",sans-serif;text-shadow:0 0 20px #c5ff70}
.creature-pack .anomaly-export{max-width:340px;min-height:48px}
.creature-pack .anomaly-export:disabled{opacity:.7;cursor:wait}
.creature-odds{margin-top:12px;border-top:1px dashed #71836a;padding-top:10px;color:#ccd9c3;font:11px/1.55 "Courier Prime",monospace}
.creature-odds summary{cursor:pointer;color:#b8ff35;min-height:30px;font-weight:700}
.creature-odds p{margin:5px 0 0}
.creature-card{
  --tier:#c5c5b5;position:relative;max-width:350px;margin:14px auto;padding:9px;
  border:2px solid var(--tier);background:#080e0a;color:#f5f6ed;
  box-shadow:0 10px 32px #000b,inset 0 0 0 2px #ffffff17;
}
.creature-card.rarity-b,.creature-slot.rarity-b{--tier:#a7dc74}
.creature-card.rarity-a,.creature-slot.rarity-a{--tier:#5fe0d7}
.creature-card.rarity-s,.creature-slot.rarity-s{--tier:#bf9cff}
.creature-card.rarity-sr,.creature-slot.rarity-sr{--tier:#ffc863}
.creature-card-top{display:flex;align-items:center;justify-content:space-between;padding:2px 5px 9px;color:var(--tier);font:700 10px "Courier Prime",monospace;letter-spacing:.08em}
.creature-card-top b{font:800 21px "Orbitron",sans-serif}
.creature-art{aspect-ratio:4/3;background:#243126;overflow:hidden;border:1px solid var(--tier)}
.creature-art img{width:100%;height:100%;object-fit:cover;display:block}
.creature-card-info{padding:12px 5px 7px}
.creature-card-info small,.creature-card-info > span{display:block;color:var(--tier);font:700 10px/1.35 "Courier Prime",monospace}
.creature-card-info strong{display:block;margin:8px 0;font:800 clamp(20px,6vw,29px)/1 "Orbitron",sans-serif;overflow-wrap:anywhere}
.creature-card-info p{min-height:38px;margin:7px 0 11px;color:#dae6d5;font:12px/1.4 "Courier Prime",monospace}
.creature-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.creature-slot{
  --tier:#c5c5b5;display:flex;flex-direction:column;gap:7px;min-width:0;
  padding:6px;text-align:left;border:1px solid var(--tier);background:#0b140c;color:#fff;cursor:pointer;
}
.creature-slot img,.creature-unknown{display:grid;place-items:center;width:100%;aspect-ratio:4/3;object-fit:cover;background:#1b291a}
.creature-unknown{font:700 36px "Orbitron",sans-serif;color:#66715e}
.creature-slot > span:last-child{display:grid;gap:4px;padding:3px}
.creature-slot b{font:700 10px "Orbitron",sans-serif;overflow-wrap:anywhere}
.creature-slot small{color:var(--tier);font:700 10px "Courier Prime",monospace}
.creature-slot:disabled{cursor:default;opacity:.68}
.creature-slot:not(:disabled):focus-visible,.creature-slot:not(:disabled):hover{outline:3px solid var(--tier);outline-offset:2px}
@media(max-width:430px){
  .creature-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .creature-draw{padding:12px}
}

/* Pack reveal lives inside the open dialog, above its sticky header. */
.creature-draw-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}
.creature-sound-toggle{
  min-width:88px;min-height:36px;padding:5px 8px;background:#101910;
  border:1px solid #8ebf49;color:#dcffae;
  font:700 10px "Courier Prime","Courier New",monospace;cursor:pointer;
}
.creature-sound-toggle[aria-pressed="false"]{border-color:#788374;color:#c4cfc1}
.creature-sound-toggle:hover,.creature-sound-toggle:focus-visible{
  outline:2px solid #b8ff35;outline-offset:2px;
}
.creature-reveal-overlay{
  position:fixed;inset:0;z-index:20;display:grid;place-items:center;
  padding:clamp(10px,3vw,25px);overflow:auto;
  background:radial-gradient(circle at 50% 42%,#24401f 0%,#0c160e 54%,#050906 100%);
  color:#e9f8df;isolation:isolate;
}
.creature-reveal-overlay:before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.24;
  background:repeating-linear-gradient(0deg,transparent 0 3px,#b8ff3522 4px 5px);
}
.creature-reveal-inner{
  width:min(420px,100%);max-height:100%;overflow:auto;display:flex;
  flex-direction:column;align-items:center;gap:14px;
  padding:18px 12px;text-align:center;
}
.creature-reveal-kicker{
  color:#b8ff35;font:700 10px/1.4 "Courier Prime","Courier New",monospace;
  letter-spacing:.11em;
}
.creature-reveal-status{
  color:#dfffac;font:800 clamp(15px,4.5vw,22px)/1.3 "Orbitron",sans-serif;
  overflow-wrap:anywhere;
}
.creature-reveal-pack{
  display:flex;flex-direction:column;justify-content:space-between;align-items:center;
  width:min(215px,65vw);aspect-ratio:3/4;padding:16px;border:3px double #c7ff71;
  background:radial-gradient(circle,#355c27,#192c18 54%,#091109);
  box-shadow:0 0 0 6px #101c13,0 0 55px #b8ff3550;
  backface-visibility:hidden;
}
.creature-reveal-pack span,.creature-reveal-pack small{
  font:700 10px/1.2 "Courier Prime",monospace;letter-spacing:.08em;
}
.creature-reveal-pack b{font:800 92px/1 "Orbitron",sans-serif;text-shadow:0 0 30px #c9ff7c}
.creature-reveal-meter{width:min(260px,90%);height:5px;background:#263723;overflow:hidden}
.creature-reveal-meter span{
  display:block;height:100%;width:100%;background:#c7ff71;
  transform:scaleX(0);transform-origin:left;animation:creature-meter 2.3s linear forwards;
}
.creature-reveal-action{
  min-height:46px;width:min(310px,100%);padding:10px;
  border:1px solid #b8ff35;background:#b8ff35;color:#0e170c;
  font:700 11px/1.3 "Courier Prime","Courier New",monospace;cursor:pointer;
}
.creature-reveal-action:hover,.creature-reveal-action:focus-visible{
  background:#ecffd0;outline:3px solid #b8ff35;outline-offset:3px;
}
.creature-reveal-overlay[data-stage="scan"] .creature-reveal-pack{
  animation:creature-scan .28s ease-in-out infinite alternate;
}
.creature-reveal-overlay[data-stage="charge"] .creature-reveal-pack{
  animation:creature-charge .5s ease-in-out infinite alternate;
}
.creature-reveal-overlay[data-stage="burst"] .creature-reveal-pack{
  animation:creature-burst .28s ease-out forwards;
}
.creature-reveal-overlay[data-stage="revealed"] .creature-reveal-pack,
.creature-reveal-overlay[data-stage="revealed"] .creature-reveal-meter{display:none}
.creature-reveal-overlay[data-stage="revealed"] .creature-card{
  width:min(330px,100%);margin:0;flex:0 0 auto;
  animation:creature-arrive .48s cubic-bezier(.15,.82,.26,1.14) both;
}
.creature-reveal-overlay[data-rarity="sr"][data-stage="revealed"]{
  background:radial-gradient(circle at 50% 37%,#76561f,#2c220f 43%,#080b08 100%);
}
.creature-reveal-overlay[data-rarity="sr"][data-stage="revealed"]:before{
  /* The rays need a square larger than the viewport diagonal. Rotating a
     viewport-sized rectangle exposed its edges behind the card. */
  inset:auto;top:50%;left:50%;width:200vmax;height:200vmax;
  transform:translate(-50%,-50%);
  opacity:.52;background:repeating-conic-gradient(from 0deg at center,#ffe2a116 0deg 8deg,transparent 9deg 24deg);
  animation:creature-halo 14s linear infinite;
}
.creature-reveal-overlay[data-rarity="sr"] .creature-reveal-status{
  color:#ffe09a;text-shadow:0 0 15px #ffc86399;
}
@keyframes creature-meter{to{transform:scaleX(1)}}
@keyframes creature-scan{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(-5px) rotate(1deg)}}
@keyframes creature-charge{from{transform:scale(.98);filter:brightness(1)}to{transform:scale(1.09);filter:brightness(1.65)}}
@keyframes creature-burst{to{transform:scale(1.3) rotateY(90deg);opacity:0}}
@keyframes creature-arrive{from{opacity:0;transform:translateY(25px) scale(.78)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes creature-halo{
  from{transform:translate(-50%,-50%) rotate(0deg)}
  to{transform:translate(-50%,-50%) rotate(360deg)}
}
@media(max-width:430px){
  .creature-reveal-inner{gap:10px}
  .creature-reveal-overlay[data-stage="revealed"] .creature-card{width:min(290px,100%)}
}
@media(prefers-reduced-motion:reduce){
  .creature-reveal-overlay *, .creature-reveal-overlay:before{animation:none!important}
}

/* QA-only controls, rendered only when ?gacha-test=1 is active. */
.creature-test-panel{
  margin:12px 0 18px;padding:14px;border:2px solid #ffcf6c;
  background:#2b2112;color:#f8e6c2;
}
.creature-test-panel > strong{
  display:block;color:#ffcf6c;font:800 13px/1.3 "Orbitron",sans-serif;
}
.creature-test-panel p{
  margin:8px 0 12px;font:11px/1.55 "Courier Prime","Courier New",monospace;
}
.creature-test-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.creature-test-subhead{margin:16px 0 8px;padding-top:11px;border-top:1px solid #ae824a;color:#ffcf6c;font:700 10px/1.4 "Courier Prime",monospace;letter-spacing:.09em}
.creature-test-buttons button,.creature-test-reset,.creature-test-panel a{
  min-height:44px;padding:8px 5px;border:1px solid #ffcf6c;
  background:#14190f;color:#ffdfa0;cursor:pointer;text-align:center;
  font:700 10px/1.3 "Courier Prime","Courier New",monospace;
}
.creature-test-buttons button:hover,.creature-test-buttons button:focus-visible,
.creature-test-reset:hover,.creature-test-reset:focus-visible,
.creature-test-panel a:hover,.creature-test-panel a:focus-visible{
  background:#ffcf6c;color:#17140c;outline:2px solid #ffcf6c;outline-offset:2px;
}
.creature-test-reset{display:block;width:100%;margin-top:9px}
.creature-test-panel a{display:grid;place-items:center;margin-top:9px;text-decoration:none}
@media(max-width:400px){.creature-test-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Beta 15 progressive TRACE assistance. */
.anomaly-case-assist{display:grid;gap:9px;margin-top:14px;padding-top:12px;border-top:1px dashed #46583f}
.anomaly-integrity{display:grid;grid-template-columns:1fr auto;gap:5px 10px;align-items:center;padding:9px 10px;border:1px solid #374632;background:#0d140d}
.anomaly-integrity>span{color:#9eae97;font:700 9px/1.2 "Courier Prime","Courier New",monospace;letter-spacing:.08em}
.anomaly-integrity>b{color:#b8ff35;font:800 15px/1 "Orbitron",sans-serif}
.anomaly-integrity>i{grid-column:1/-1;display:block;height:5px;background:#273225;overflow:hidden}
.anomaly-integrity>i em{display:block;width:var(--integrity,100%);height:100%;background:#b8ff35;transition:width .25s ease}
.anomaly-integrity>small{grid-column:1/-1;color:#758171;font:700 8px/1.35 "Courier Prime","Courier New",monospace}
.anomaly-trace{padding:11px 11px 12px;border:1px solid #586b4e;background:#151f14}
.anomaly-trace>small{display:block;color:#b8ff35;font:700 9px/1.3 "Courier Prime","Courier New",monospace;letter-spacing:.08em}
.anomaly-trace>strong{display:block;margin-top:5px;color:#f0f7e9;font:800 11px/1.3 "Orbitron",sans-serif}
.anomaly-trace>p{margin:7px 0 0!important;color:#becbb8!important;font-size:11px!important;line-height:1.48!important}
.anomaly-trace>button,.anomaly-trace-request{width:100%;min-height:40px;margin-top:10px;padding:8px 10px;border:1px solid #b8ff35;background:#0d140d;color:#dfffac;text-align:left;cursor:pointer;font:700 10px/1.25 "Courier Prime","Courier New",monospace}
.anomaly-trace>button span{float:right;color:#86967f;font-size:8px}
.anomaly-trace>button:hover,.anomaly-trace>button:focus-visible,.anomaly-trace-request:hover,.anomaly-trace-request:focus-visible{background:#b8ff35;color:#11140f;outline:2px solid #b8ff35;outline-offset:2px}
.anomaly-trace>button:hover span,.anomaly-trace>button:focus-visible span{color:#34402f}
.anomaly-trace-request{margin-top:0;background:#1c2918;color:#b8ff35}
.anomaly-trace-max{display:block;padding:9px;border:1px dashed #51604b;color:#85917f;font:700 9px/1.4 "Courier Prime","Courier New",monospace;text-align:center}
.case-guidance-pulse{position:relative!important;z-index:4!important;outline:3px solid #b8ff35!important;outline-offset:4px!important;box-shadow:0 0 0 7px #b8ff3520,0 0 28px #b8ff354a!important;animation:caseGuidancePulse .75s ease-in-out 4!important}
@keyframes caseGuidancePulse{0%,100%{filter:none}50%{filter:brightness(1.35)}}
@media(max-width:430px){.anomaly-trace>button span{display:block;float:none;margin-top:3px}.anomaly-integrity>b{font-size:13px}}
@media(prefers-reduced-motion:reduce){.case-guidance-pulse{animation:none!important}}
