/* The Arc machine — shared by /arc_uploads/tiers/machine.html and the home page hero.
   Everything is scoped under .am-root so it can sit inside any page. */
.am-root{--am-paper:#f2ece1;--am-bg:#0d1118;background:var(--am-bg);color:var(--am-paper);
  font-family:"EB Garamond",Georgia,"Times New Roman",serif;padding:18px 12px 26px}
.am-root *{box-sizing:border-box}
.am-inner{max-width:900px;margin:0 auto}
.am-stage{position:relative;width:100%;aspect-ratio:1610/1802;user-select:none;-webkit-user-select:none}
.am-floor{position:absolute;left:10%;right:10%;bottom:-2%;height:30%;pointer-events:none;
  background:radial-gradient(ellipse at 50% 100%,rgba(255,170,70,.28),rgba(255,140,40,.06) 55%,transparent 75%)}
.am-backlight{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 42%,rgba(120,90,50,.28),rgba(60,45,30,.08) 45%,transparent 70%)}
.am-lens{position:absolute;border-radius:50%;overflow:hidden;pointer-events:none;
  background:radial-gradient(circle at 40% 35%,rgba(210,230,245,.55),rgba(120,160,190,.35) 45%,rgba(40,70,100,.55) 100%)}
.am-lens::after{content:"";position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.55),rgba(255,255,255,0) 28%),radial-gradient(circle at 70% 80%,rgba(255,255,255,.18),transparent 30%);
  box-shadow:inset 0 0 18px rgba(255,255,255,.35),inset 0 0 40px rgba(20,40,70,.5)}
.am-scene{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.am-light{position:absolute;pointer-events:none;border-radius:50%;mix-blend-mode:screen;transform:translate(-50%,-50%)}
.am-light.lantern{background:radial-gradient(circle,rgba(255,190,90,.95),rgba(255,140,40,.45) 35%,transparent 70%);animation:am-flicker 2.8s infinite}
.am-light.orb{background:radial-gradient(circle,rgba(255,215,140,1),rgba(255,160,60,.5) 35%,rgba(255,120,30,.12) 60%,transparent 75%);animation:am-orbpulse 6s ease-in-out infinite}
.am-light.orb.surge{animation:am-orbsurge 1.6s ease-out 1}
.am-light.screen{background:radial-gradient(circle,rgba(120,205,240,.55),rgba(80,150,220,.2) 45%,transparent 70%);animation:am-breathe 3.4s ease-in-out infinite}
.am-light.lamp{background:radial-gradient(circle,rgba(255,120,60,1),rgba(255,90,40,.5) 40%,transparent 70%);animation:am-blink 4s infinite}
.am-light.lamp.g{background:radial-gradient(circle,rgba(160,255,140,1),rgba(80,220,90,.5) 40%,transparent 70%);animation-delay:1.3s;animation-duration:5.2s}
@keyframes am-flicker{0%,100%{opacity:.75;transform:translate(-50%,-50%) scale(1)}8%{opacity:.95}20%{opacity:.7}33%{opacity:1;transform:translate(-50%,-50%) scale(1.06)}47%{opacity:.8}61%{opacity:.98}74%{opacity:.72}88%{opacity:.9}}
@keyframes am-orbpulse{0%,100%{opacity:.12;transform:translate(-50%,-50%) scale(.7)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}}
@keyframes am-orbsurge{0%{opacity:.3;transform:translate(-50%,-50%) scale(.8)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.9)}100%{opacity:.4;transform:translate(-50%,-50%) scale(.9)}}
@keyframes am-breathe{0%,100%{opacity:.55;transform:translate(-50%,-50%) scale(.92)}50%{opacity:.95;transform:translate(-50%,-50%) scale(1.08)}}
@keyframes am-blink{0%,86%,100%{opacity:.15}90%,96%{opacity:1}}
.am-fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.am-glow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0;transition:opacity .7s ease;
  filter:brightness(1.22) saturate(1.15) drop-shadow(0 0 10px rgba(255,205,110,.95)) drop-shadow(0 0 28px rgba(255,160,50,.75)) drop-shadow(0 0 60px rgba(255,120,30,.45))}
.am-glow img{position:absolute;inset:0;width:100%;height:100%;display:block}
.am-glow.on{opacity:1}
.am-screen{position:absolute;left:0;top:0;overflow:hidden;background:#0a1220;transform-origin:0 0;border-radius:6px;
  box-shadow:inset 0 0 18px rgba(120,205,240,.25)}
.am-screen canvas{width:100%;height:100%;display:block}
.am-screen::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px),radial-gradient(circle at 50% 50%,transparent 55%,rgba(0,0,0,.45))}
.am-hot{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.am-hot polygon{fill:transparent;stroke:transparent;cursor:pointer;pointer-events:all}
.am-hot polygon:hover{fill:rgba(255,220,140,.06)}
.am-caption{margin:14px 6px 0;min-height:3.2em;text-align:center;line-height:1.35}
.am-caption b{display:flex;align-items:center;justify-content:center;gap:12px;font-weight:normal;font-size:clamp(20px,4.6vw,28px);color:#e8dcc4;letter-spacing:.02em;transition:opacity .35s ease}
.am-caption b img{width:clamp(36px,8vw,48px);height:clamp(36px,8vw,48px);object-fit:contain;flex:0 0 auto;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
.am-caption b i{font-style:normal}
.am-caption span{display:block;margin-top:4px;font-family:"DM Sans",system-ui,sans-serif;font-weight:300;font-size:clamp(13px,3.4vw,16px);color:#a1957f;transition:opacity .35s ease}
.am-caption.fade b,.am-caption.fade span{opacity:0}
