/* Authored from Figma 455:14633, 455:14742 and 455:14743 at their native 1600 × 900 geometry. */
.atlas-film{width:min(1440px,calc(100vw - 80px));margin-left:50%;transform:translateX(-50%);margin-top:48px}
.atlas-film-viewport{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:22px;background:#303235;box-shadow:0 1px 0 #ffffff14,0 30px 80px #0004}
.atlas-film-stage{position:absolute;left:0;top:0;width:1600px;height:900px;transform-origin:top left;transform:scale(var(--atlas-scale,.725));background:#303235;color:#fff;font-family:Inter,sans-serif;font-size:12px;line-height:20px;font-weight:500;letter-spacing:0;pointer-events:none;user-select:none}
.atlas-film-stage *{box-sizing:border-box}
.atlas-film-stage :is(p,span,strong,label){margin:0;letter-spacing:0}
.atlas-film-stage img{display:block;max-width:none;flex-shrink:0}
.at-control{display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;font-size:12px;line-height:20px;font-weight:600}
.at-navigation{position:absolute;left:12px;top:12px;height:48px;display:flex;gap:12px;align-items:center}
.at-project{height:48px;width:184px;background:#18181b;border:1px solid #1b1b1d;border-radius:16px;box-shadow:inset 0 2px 0 #ffffff0d;display:flex;gap:4px;align-items:center;padding:4px 8px 4px 4px;color:#b5b6b9;font-weight:500}
.at-project>span{display:grid;place-items:center;width:40px;height:40px;background:#07080a;border:1px solid #28292a;border-radius:12px;margin-right:4px}.at-project>img{margin-left:auto}
.at-modes{display:flex;align-items:center;gap:4px;padding:4px 16px 4px 4px;border:1px solid #1b1b1d;border-radius:24px;background:#242427;box-shadow:inset 0 2px 0 #ffffff0d;height:48px;color:#b5b6b9}
.at-modes .at-control{padding:10px;border-radius:20px;line-height:15px;height:40px}.at-modes .is-atlas{background:#9a8df7;border:1px solid #3d3d3f;color:#151719;box-shadow:0 2px 2px #0004}
.at-map-mode,.at-component-menu{border:1px solid #080808;border-radius:16px;padding:2px;background:#242427;box-shadow:inset 0 2px 0 #ffffff0d;height:48px;display:flex;align-items:center}
.at-map-mode .at-control{padding:10px 12px;background:#46474a;color:#9a8df7;border-radius:14px;gap:8px}
.at-component-menu{padding:12px;gap:8px;background:linear-gradient(#9a8df733,#9a8df733),#242427}
.at-user{position:absolute;right:12px;top:12px;display:flex;gap:8px}
.at-user .at-control{height:48px;min-width:48px;padding:12px;background:#242427;border:1px solid #1b1b1d;border-radius:16px;box-shadow:inset 0 2px 0 #ffffff0d;gap:4px}.at-user .at-profile{background:#474747;box-shadow:inset 0 2px 0 #ffffff1f}
.at-canvas{position:absolute;left:12px;top:72px;width:1280px;height:792px;overflow:hidden;border-radius:20px;border:0;box-shadow:inset 0 0 0 1px #0006;background:#17181a}
.at-map-world,.at-character-world{position:absolute;inset:0;transform-origin:0 0;will-change:transform,opacity}
.at-character-world{opacity:0}
.at-world-grid{position:absolute;inset:0;mask-image:radial-gradient(ellipse at center,#000 40%,#0005)}
.at-region-outline{position:absolute;width:266.504px;height:274px}
.at-region-name{position:absolute;transform:translateX(-50%);font-size:12px;font-weight:600;color:#9a8df7;line-height:20px}.at-sound-name{color:#f0997d}.at-story-name{color:#b95a8c}
.at-hex,.at-character{position:absolute;width:148px;height:132px}
.at-hex-rotate{position:absolute;left:8px;top:-8px;width:132px;height:148px;transform:rotate(-90deg)}
.at-hex-rotate>img{position:absolute;left:0;top:2.3425px}
.at-sections{position:absolute;left:35px;top:29px}
.at-count{position:absolute;left:82px;top:6px;width:30px;height:30px;display:grid;place-items:center}
.at-count>div{position:absolute;inset:0;transform:rotate(-90deg)}.at-count>div>img{position:absolute;top:-.954px}.at-count>span{position:relative;font-size:12px;font-weight:600;line-height:20px;color:#e4e4e4}
.at-hex-label{position:absolute;top:49px;left:0;right:0;display:flex;flex-direction:column;align-items:center;font-size:10px;font-weight:600;line-height:20px}
.at-character-art{position:absolute;left:44px;top:16px;width:60px;height:60px;object-fit:cover}
.at-character strong{position:absolute;top:76px;left:0;width:100%;text-align:center;font-size:10px;line-height:20px;font-weight:600}
.at-character>span{position:absolute;top:97px;left:0;width:100%;text-align:center;font-size:10px;line-height:20px;text-transform:uppercase;letter-spacing:.4px;color:#ffffff4d}
.at-nested{position:absolute;inset:0;width:1280px;height:792px;overflow:visible;opacity:0;pointer-events:none}
.at-nested path{fill:#090a0c09;stroke:#ffffff6b;stroke-width:.78;stroke-dasharray:2.2 2.8;vector-effect:non-scaling-stroke}
.at-breadcrumbs{position:absolute;top:23px;left:640px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;font-weight:600;opacity:0}.at-breadcrumbs>span{color:#b95a8b}
.at-context-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 65%,#b95a8b19);opacity:0}
.at-inspector{position:absolute;left:948px;top:12px;width:320px;height:768px;border-radius:16px;border:0;background:#322f3e66;backdrop-filter:blur(8px);box-shadow:inset 0 0 0 1px #ffffff0d,0 0 20px #0008;overflow:hidden;opacity:0;transform:translateX(28px);will-change:transform,opacity}
.at-inspector-heading{position:absolute;left:16px;right:16px;top:24px;font-size:20px;line-height:24px;font-weight:500;display:flex;justify-content:space-between}
.at-inspector-heading>span{position:relative;width:24px;height:24px}.at-inspector-heading>span>img{position:absolute;left:-14px;top:-14px}
.at-inspector-tabs{position:absolute;left:16px;top:65px;display:flex;gap:24px;font-size:12px;font-weight:600;line-height:20px;color:#b5b6b9}
.at-inspector-tabs>span{display:flex;align-items:center;gap:6px;padding:0 2px 4px;white-space:nowrap}.at-inspector-tabs>.is-selected{color:#fff;border-bottom:1px solid #fff}
.at-preview{position:absolute;top:90px;left:0;width:320px;height:292px;background-color:#ffffff20;background-image:conic-gradient(#ffffff0a 25%,transparent 0 50%,#ffffff0a 0 75%,transparent 0);background-size:12px 12px}
.at-preview-art{position:absolute;left:70px;top:28px;width:180px;height:180px;object-fit:cover}
.at-preview-actions{position:absolute;top:227px;left:32px;display:flex;gap:16px}.at-preview-actions>.at-control{height:48px;padding:12px 14px;border:1px solid #1b1b1d;border-radius:16px;background:#474747;box-shadow:inset 0 2px 0 #ffffff1f;gap:4px}
.at-preview-divider{position:absolute;left:0;top:89px}
.at-fields{position:absolute;left:12px;top:394px;width:296px;height:350px;display:flex;flex-direction:column;gap:12px;overflow:hidden;mask-image:linear-gradient(#000 0%,#000 60%,transparent 90%)}
.at-fields label{font-size:12px;color:#ffffff4d;font-weight:400;line-height:20px;display:block}
.at-fields p{border:1px solid #2a2b2e;border-radius:12px;background:#000;padding:9px 12px;font-size:12px;font-weight:400;line-height:20px}
.at-ask{position:absolute;left:102px;top:708px;display:flex;align-items:center;gap:10px;color:#b5b6b9;font-weight:600}
.at-mover{position:absolute;left:1292px;top:72px;width:12px;height:792px;display:grid;place-items:center}.at-mover>span{width:4px;height:24px;border-radius:2px;background:#ffffff1a}
.at-assistant{position:absolute;left:1304px;top:72px;width:284px;height:792px;padding:12px;border-radius:20px;background:radial-gradient(ellipse 214px 723px at 50% 0%,#9a8df73d,transparent 60%),radial-gradient(ellipse at 0 72%,#9a8df714,transparent 50%),linear-gradient(#122a2e,#101113 34%,#090a0c 68%,#08090a);filter:drop-shadow(0 7px 5.5px #0005)}
.at-assistant-tabs{display:flex;gap:9px;padding:4px;background:#0003;border:1px solid #ffffff1a;border-radius:12px;height:42px}
.at-assistant-tabs>.at-control{flex:1;padding:6px 8px;gap:4px;color:#b5b6b9}
.at-assistant-tabs>.is-voice{color:#9a8df7;border-radius:8px;background:#ffffff1a;box-shadow:inset 0 1px 0 #ffffff0d}
.at-assistant-center{position:absolute;left:12px;right:12px;top:267px;display:flex;flex-direction:column;align-items:center}
.at-orby-large{width:128px;height:128px;position:relative}.at-orby-large>img{position:absolute;left:34px;top:34px;transform:scale(2.133333)}
.at-assistant-center>strong{font-size:14px;line-height:20px;font-weight:600;margin-top:16px}.at-assistant-center>span{font-size:12px;font-weight:400;color:#ffffff66}
.at-voice-actions{display:flex;gap:16px;align-items:center;margin-top:32px}.at-voice-actions>span{width:44px;height:44px;border:1px solid #ffffff33;border-radius:44px;display:grid;place-items:center}
.at-voice-actions>.at-mic{width:84px;height:84px;border:2px solid #ffffff33;background:radial-gradient(ellipse at 42% 30%,#ffffff4d,transparent 75%),radial-gradient(ellipse at 42% 30%,transparent,#0303034d),#9a8df7}
.at-footer{position:absolute;left:20px;right:20px;bottom:8px;display:flex;align-items:center;gap:28px;height:20px;font-size:12px;color:#6e7072;font-weight:600}
.at-footer>span{display:flex;align-items:center;gap:4px}.at-footer .at-footer-spacer{flex:1}.at-footer-help{margin-left:74px}
.atlas-film-caption{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 4px 0;color:#a4a0af;font-size:14px;line-height:24px}
.atlas-film-caption p{margin:0}.atlas-film-caption p>span{transition:opacity .3s}
.atlas-playback{display:inline-flex;align-items:center;gap:8px;background:transparent;border:1px solid #ffffff18;padding:7px 12px;border-radius:9px;color:#b5b6b9;font-size:12px;line-height:20px;min-width:82px;justify-content:center}
.atlas-playback:hover{background:#ffffff06;border-color:#9a8df770}.atlas-playback:focus-visible{outline:2px solid #9a8df7;outline-offset:4px}
.at-pause-symbol{display:block;width:10px;height:12px;border-left:3px solid currentColor;border-right:3px solid currentColor}.atlas-playback[aria-pressed=true] .at-pause-symbol{width:10px;height:12px;border:6px solid transparent;border-left:9px solid currentColor;border-right:0}
@media(prefers-reduced-motion:reduce){.atlas-film-caption p>span{transition:none}}

.at-world-grid svg{width:1280px;height:792px;display:block}
.at-world-grid path{fill:none;stroke:#ffffff26;stroke-width:.7;stroke-dasharray:6 10}
.at-hex-surface,.at-hex .at-sections{opacity:.75}
.at-region-outline{opacity:.75}
.at-character .at-hex-rotate{opacity:.76}
/* All components are filled until Sprig is selected. Scrub with the film clock. */
.at-character:not([data-at-character="sprig"]) .at-hex-rotate{opacity:calc(.76 * (1 - .8 * var(--at-selected,0)))}
.at-modes .at-control:not(.is-atlas)>img,.at-modes>img{filter:brightness(0) invert(.7)}
.at-map-mode img{filter:brightness(0) saturate(100%) invert(67%) sepia(44%) saturate(639%) hue-rotate(203deg) brightness(99%)}
.atlas-film-caption p{font-size:14px;line-height:24px;letter-spacing:0}
.atlas-playback[hidden]{display:none}

.at-selection-nav{position:absolute;left:604px;top:0;display:flex;gap:12px;height:48px;opacity:var(--at-selected,0)}
.at-selection-map{display:grid;place-items:center;width:48px;height:48px;border:1px solid #1b1b1d;border-radius:16px;background:#242427;box-shadow:inset 0 2px 0 #ffffff0d}
.at-selection-item{display:flex;align-items:center;gap:8px;width:164px;padding:10px 12px;background:#242427;border:1px solid #1b1b1d;border-radius:16px;box-shadow:inset 0 2px 0 #ffffff0d}
.at-selection-item>img:first-child{width:26px;height:26px;object-fit:cover;border:1px solid #ffffff1f;border-radius:4px}
.at-selection-item>span{display:flex;flex:1;flex-direction:column;line-height:15px}.at-selection-item small{font-size:8px;font-weight:400;color:#ffffff80;text-transform:uppercase}.at-selection-item strong{font-size:12px;font-weight:600;color:#fff}
.at-map-mode,.at-component-menu{opacity:calc(1 - var(--at-selected,0))}
.at-component-menu>.at-control>img{filter:brightness(0) invert(1)}
.at-region-outline>img{opacity:.75}

.at-selection-map>img{filter:brightness(0) invert(.7)}

/* The original Atlas portal contour opens into the camera handoff. */
.at-portal{position:absolute;z-index:3;left:640px;top:396px;width:148px;height:132px;opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.35)}
.at-portal svg{display:block;width:148px;height:132px;overflow:visible}
.at-portal path{fill:none;stroke:#9a8df7e6;stroke-width:.8;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 7px #9a8df79e)}
.at-orby-large>canvas{display:block;position:absolute;inset:0;width:128px;height:128px;opacity:0}
.at-orby-large.orby-live>canvas{opacity:1}
.at-orby-large.orby-live>img{visibility:hidden}
