/* The phone presentation is one shared, two-dimensional vector stage. */
.mobile-cinema,.mobile-workshop{display:none}
html[data-experience=mobile] #world-canvas{display:none}
html[data-experience=mobile] .fallback-workstation{display:none!important}
html[data-experience=mobile] .site-header{height:72px;min-height:72px;padding:0 6%;gap:10px;background:#04070ced}
html[data-experience=mobile] .brand{width:105px}
html[data-experience=mobile] .header-coordinate{display:none}
html[data-experience=mobile] .header-actions{gap:5px}
html[data-experience=mobile] .header-contact{font-size:14px;min-height:44px;gap:9px}
html[data-experience=mobile] .motion-toggle,
html[data-experience=mobile] .index-toggle{width:40px;height:44px}
html[data-experience=mobile] .motion-toggle{border-radius:24px;width:32px;height:32px}
html[data-experience=mobile] .journey-nav{top:65px;right:5%;width:410px;max-width:90vw;max-height:calc(100svh - 82px);padding:20px 24px}
html[data-experience=mobile] #journey{padding-top:88px;pointer-events:none}
html[data-experience=mobile] #journey .chapter,
html[data-experience=mobile] #journey .contact-chapter{height:calc(var(--mobile-story-height,760px)*1.35);min-height:0;padding:0;scroll-margin-top:88px;pointer-events:none}
html[data-experience=mobile] #journey .chapter-copy,
html[data-experience=mobile] #journey .contact-chapter .chapter-copy{--copy-opacity:0;--copy-events:none;position:fixed;left:6%;right:auto;top:88px;width:88%;max-width:560px;max-height:max(140px,calc(var(--mobile-story-height,760px) - 228px));overflow:auto;overscroll-behavior:auto;scrollbar-width:thin;scrollbar-color:#42657b transparent;margin:0;padding:0 2px 2px 0;opacity:var(--copy-opacity,1);transform:none!important;filter:none!important;pointer-events:var(--copy-events,auto);will-change:opacity}
html[data-experience=mobile] #journey .opening-chapter .chapter-copy{--copy-opacity:1;--copy-events:auto}
html[data-experience=mobile] h1{font-size:40px;line-height:1.04;letter-spacing:-.055em}
html[data-experience=mobile] h2,
html[data-experience=mobile] #vision h2,
html[data-experience=mobile] .contact-chapter h2{font-size:32px;line-height:1.07;letter-spacing:-.05em;max-width:100%}
html[data-experience=mobile] .kicker{font-size:11px;line-height:1.5;letter-spacing:.095em;margin-bottom:12px;color:#bfd7e6}
html[data-experience=mobile] .chapter-description,
html[data-experience=mobile] .intro-description{font-size:15.5px;line-height:1.48;margin-top:14px;max-width:43ch;color:#c0ceda;letter-spacing:0}
html[data-experience=mobile] .chapter-lead{font-size:16px;line-height:1.48;margin-top:14px;max-width:42ch;color:#d9e5ee}
html[data-experience=mobile] .chapter-lead+.chapter-description{font-size:15.5px;line-height:1.48;margin-top:11px;max-width:43ch}
html[data-experience=mobile] .chapter-actions{margin-top:18px}
html[data-experience=mobile] .pill-button{font-size:14px;min-height:46px;gap:18px;padding:8px 9px 8px 19px}
html[data-experience=mobile] .primary-button>span{width:28px;height:28px}
html[data-experience=mobile] .line-button{font-size:14px;min-height:44px;line-height:1.4;margin-top:13px;padding:8px 0 7px;gap:20px}
html[data-experience=mobile] .contact-chapter .pill-button{margin-top:17px}
html[data-experience=mobile] .contact-email{font-size:18px;margin-top:17px;line-height:1.5}
html[data-experience=mobile] .contact-links{font-size:14px;line-height:1.6;margin-top:11px;gap:7px 17px;max-width:100%}
html[data-experience=mobile] .contact-links>a:first-child{width:100%}
html[data-experience=mobile] .scene-caption,
html[data-experience=mobile] .intro-note,
html[data-experience=mobile] .end-note,
html[data-experience=mobile] .chapter-rail,
html[data-experience=mobile] .experience-footer{display:none!important}
/* Draw arrows with borders and a shaft, so iOS never substitutes emoji. */
html[data-experience=mobile] .header-contact>span,
html[data-experience=mobile] .line-button>span,
html[data-experience=mobile] .pill-button>span{position:relative;display:inline-block;flex-shrink:0;font-size:0!important;line-height:0;color:#b9e6f7}
html[data-experience=mobile] .header-contact>span,
html[data-experience=mobile] .line-button>span{width:22px;height:22px}
html[data-experience=mobile] .header-contact>span:before,
html[data-experience=mobile] .line-button>span:before,
html[data-experience=mobile] .pill-button>span:before{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:translate(-30%,-70%)}
html[data-experience=mobile] .header-contact>span:after,
html[data-experience=mobile] .line-button>span:after,
html[data-experience=mobile] .pill-button>span:after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:currentColor;transform:translate(-50%,-50%) rotate(-45deg)}
html[data-experience=mobile] .opening-chapter .pill-button>span{transform:rotate(135deg)}
html[data-experience=mobile] .world-vignette:before,
html[data-experience=mobile] .world-vignette:after{display:none}
html[data-experience=mobile] .world-vignette{background:linear-gradient(180deg,#02060c25,transparent 47%,#02060c16)}
html[data-experience=mobile] .mobile-cinema{--mobile-play-state:paused;position:fixed;inset:0;display:block;z-index:3;overflow:hidden;pointer-events:none;isolation:isolate}
html[data-experience=mobile] .mobile-workshop{position:absolute;display:block;left:50%;bottom:max(32px,env(safe-area-inset-bottom));width:480px;height:280px;margin:0;transform:translateX(-50%);transform-origin:50% 100%;pointer-events:none;contain:layout style;will-change:transform}
html[data-experience=mobile] .mobile-stage-art{display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
html[data-experience=mobile] .mobile-robot-control{position:absolute;padding:0;border:0;border-radius:24px;background:transparent;pointer-events:auto;touch-action:pan-y;cursor:pointer;-webkit-tap-highlight-color:transparent}
html[data-experience=mobile] .mobile-robot-control:focus-visible{outline:2px solid #afe9f7;outline-offset:5px;background:#9bd9ee09}
html[data-experience=mobile] .mobile-arm-outline{fill:none;stroke:#081523;stroke-width:21px;stroke-linecap:round}
html[data-experience=mobile] .mobile-arm-pearl{fill:none;stroke:#c3d8e4;stroke-width:16px;stroke-linecap:round}
html[data-experience=mobile] .mobile-arm-metal{fill:none;stroke:#7d9db4;stroke-width:14px;stroke-linecap:round}
html[data-experience=mobile] .mobile-tool-under{fill:none;stroke:#18374c;stroke-width:7px;stroke-linecap:round}
html[data-experience=mobile] .mobile-tool{fill:none;stroke:#b4d5e5;stroke-width:4px;stroke-linecap:round}
html[data-experience=mobile] .mobile-editor-label{fill:#a1b9cb;font:7px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
html[data-experience=mobile] .mobile-code-line{fill:#c2d2e0;font:15px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:-.15px}
html[data-experience=mobile] .mobile-code-line:first-child{fill:#b5addc}
html[data-experience=mobile] .mobile-code-line:nth-child(2){fill:#a9c4b8}
html[data-experience=mobile] .mobile-code-line:last-child{fill:#9adce7}
html[data-experience=mobile] .mobile-code-cursor{stroke:#b8e8f3;stroke-width:1.2px;animation:xrob-vector-cursor 1.2s steps(2,end) infinite;animation-play-state:var(--mobile-play-state)}
html[data-experience=mobile] .mobile-web-word{fill:#e5f0f8;font:500 23px/1 var(--display);letter-spacing:-1px}
html[data-experience=mobile] .mobile-web-accent{fill:#a9dbe9}
html[data-experience=mobile] .mobile-web-small{fill:#1b3e55;font:600 5.5px/1 var(--font);letter-spacing:.3px}
html[data-experience=mobile] .mobile-devops-node rect{fill:#183349;stroke:#78a0b9;stroke-width:.9px}
html[data-experience=mobile] .mobile-devops-node text{fill:#c6e0ef;font:500 9px/1 var(--display);letter-spacing:.3px}
html[data-experience=mobile] .mobile-devops-node path{fill:none;stroke:#9edcd9;stroke-width:2.1px;stroke-linecap:round;stroke-linejoin:round}
html[data-experience=mobile] .mobile-board-title{fill:#335971;font:600 9px/1 var(--display);letter-spacing:.4px}
html[data-experience=mobile] .mobile-plan-label{fill:#ecf5fa;font:500 8px/1 var(--display);letter-spacing:.4px}
html[data-experience=mobile] .mobile-phone-kicker{fill:#a0c1d7;font:8px/1 var(--display);letter-spacing:1px}
html[data-experience=mobile] .mobile-phone-title{fill:#e3f1f9;font:500 14px/1 var(--display);letter-spacing:-.4px}
html[data-experience=mobile] .mobile-bot-eyes{transform-box:fill-box;transform-origin:50% 50%;animation:xrob-vector-blink 6.1s linear infinite;animation-play-state:var(--mobile-play-state)}
html[data-experience=mobile] .mobile-cinema[data-mobile-paused=true] *,
html[data-experience=mobile] .mobile-cinema[data-mobile-paused=true] *:after{animation-play-state:paused!important}
@keyframes xrob-vector-blink{0%,42%,46%,87%,91%,100%{transform:scaleY(1)}44%,89%{transform:scaleY(.14)}}
@keyframes xrob-vector-cursor{0%,100%{opacity:1}50%{opacity:0}}
@media(max-width:350px){html[data-experience=mobile] .brand{width:94px}html[data-experience=mobile] .header-actions{gap:1px}html[data-experience=mobile] .header-contact{font-size:14px;gap:5px}html[data-experience=mobile] .header-contact>span{width:18px}html[data-experience=mobile] .motion-toggle{width:30px;height:30px}html[data-experience=mobile] .index-toggle{width:36px}html[data-experience=mobile] h1{font-size:38px}}
@media(prefers-reduced-motion:reduce){html[data-experience=mobile] .mobile-cinema *,html[data-experience=mobile] .mobile-cinema *:after{animation:none!important}}

/* Landscape uses adjacent reading and workshop columns. */
html[data-experience=mobile][data-mobile-orientation=landscape] #journey .chapter-copy,
html[data-experience=mobile][data-mobile-orientation=landscape] #journey .contact-chapter .chapter-copy{width:46%;max-height:calc(var(--mobile-story-height,390px) - 104px)}
html[data-experience=mobile][data-mobile-orientation=landscape] .mobile-workshop{left:76%}