@font-face{font-family:'Roboto Mono';font-style:normal;font-weight:400;font-display:block;src:url('fonts/roboto-mono-400.ttf') format('truetype')}
@font-face{font-family:'Roboto Mono';font-style:normal;font-weight:500;font-display:block;src:url('fonts/roboto-mono-500.ttf') format('truetype')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:700;font-display:block;src:url('fonts/space-grotesk-700.ttf') format('truetype')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:block;src:url('fonts/manrope-variable.ttf') format('truetype')}
/* Centered landing composition. Motion is owned by ui-motion.css. */
:root{--landing-font:'Manrope',Arial,Helvetica,sans-serif;--hero-type-size:clamp(64px,8.33vw,152px);--hero-line-height:.78;--surhay-name-size:clamp(48px,8vw,144px);--ui-margin:max(40px,env(safe-area-inset-left))}
.masthead{position:fixed;z-index:30;inset:0 0 auto;height:120px;padding-inline:var(--ui-margin);display:flex;align-items:center;justify-content:space-between;color:#fff;background:transparent;transition:opacity .4s;pointer-events:none}
/* Let visible page links receive clicks beneath the transparent header. */
.masthead .wordmark,.masthead .header-links,.masthead .site-menu{pointer-events:auto}
body[data-view="journey"] .masthead{opacity:0;pointer-events:none}
.wordmark{display:none}
.masthead .local-time{position:absolute;left:var(--ui-margin);font:400 12px 'Roboto Mono','Courier New',monospace;letter-spacing:0;color:#a5a0a8}
.local-time #clock{margin:0;font-weight:500;color:#fff}
.masthead .header-links{position:absolute;right:var(--ui-margin);top:50%;transform:translateY(-50%);display:flex;margin:0}
.header-links .menu-button{font:500 12px 'Roboto Mono','Courier New',monospace;letter-spacing:.03em;background:transparent;color:#fff;padding:10px 0;min-height:44px;min-width:44px}
.header-links .menu-button::after{content:'+';display:inline-block;margin-left:14px;color:#9e94a5;transition:transform 350ms}
.header-links .menu-button[aria-expanded="true"]::after{transform:rotate(45deg)}
.header-links .menu-button:hover{color:#dca8e7}
.header-links .menu-button:focus-visible{outline:2px solid #cf00f4;outline-offset:5px}
.masthead .site-menu{position:absolute;z-index:50;right:var(--ui-margin);top:95px;width:290px;max-width:calc(100vw - 48px);max-height:calc(100svh - 115px);overflow-y:auto;overscroll-behavior:contain;padding:12px 22px;background:#0c0a0ef2;color:#fff;border:1px solid #302933;backdrop-filter:blur(18px);box-shadow:0 20px 45px #0008}
.site-menu button{font:13px 'Roboto Mono','Courier New',monospace;letter-spacing:.06em;display:flex;justify-content:space-between;align-items:center;gap:14px;width:100%;text-align:left;min-height:45px;padding:15px 0;border-bottom:1px solid #333}
.site-menu>button:last-child{border-bottom:0}
.site-menu button:hover{color:#df61fa}
.landing{--ambient-x:0;--ambient-y:0;position:relative;padding:0;background:transparent;color:#fff;min-height:650px;height:100svh}
.landing-center{position:absolute;left:0;right:0;top:49%;transform:translateY(-50%);display:block;width:100%}
.landing .intro-meta{position:absolute;left:50%;top:-48px;transform:translateX(-50%);font:400 10px/1.5 'Roboto Mono','Courier New',monospace;letter-spacing:.035em;color:#aaa3ad;white-space:nowrap}
.landing .intro-meta>span{display:flex;align-items:center;justify-content:center;gap:9px}
.landing .status-dot{background:#cf00f4;width:7px;height:7px;margin:0;flex:0 0 7px}
.landing .status-dot,.finale .territory-line .status-dot{animation:status-blink 1.9s ease-in-out infinite;box-shadow:0 0 10px #d642f74d;transform-origin:center}
@keyframes status-blink{0%,36%,100%{opacity:1;transform:scale(1)}56%,72%{opacity:.2;transform:scale(.82)}}
.landing .name-block{display:block;padding:0;margin:0;width:100%;text-align:center}
.landing .name-block h1{font:500 var(--hero-type-size)/var(--hero-line-height) var(--landing-font);letter-spacing:-.045em;text-indent:0;margin:0}
.landing .headline-frame{position:relative;display:grid;grid-template-areas:'headline';align-items:center;justify-items:center;width:max-content;max-width:100%;margin:auto;font:inherit;letter-spacing:inherit;color:#fff;text-align:center;background:none;outline:none}
.headline-sway{grid-area:headline;display:block;transform:perspective(1200px) translate3d(calc(var(--ambient-x)*-6px),calc(var(--ambient-y)*-4px),0) rotateY(calc(var(--ambient-x)*.6deg));transition:transform 200ms linear;transform-origin:50% 50%}
.landing .hero-role{align-items:center;text-transform:uppercase}
.landing .title-line>span{display:flex;justify-content:center;align-items:baseline;gap:.075em}
.ui-revealed .title-line{overflow:visible}
.landing-blurb{position:absolute;left:calc(50% + var(--hero-type-size)*3.4);top:calc(50% + var(--hero-type-size)*.55);width:clamp(200px,18.2vw,310px);margin:0;font:500 clamp(10px,.9vw,14px)/1.2 var(--landing-font);letter-spacing:-.025em;text-transform:uppercase;text-align:left;color:#e2dfe4}
/* Fixed skill tracks share one baseline; mobile keeps them beside the location. */
.landing .landing-footer{position:absolute;bottom:42px;left:var(--ui-margin);right:var(--ui-margin);display:flex;justify-content:space-between;align-items:center;padding:0;border:0;color:#fff;font:400 12px/20px 'Roboto Mono','Courier New',monospace;letter-spacing:0;gap:24px}
.landing .landing-footer .role-labels{display:grid;grid-template-columns:12.5ch 1.8ch 20.5ch;align-items:baseline;gap:0;flex:0 0 auto;font:inherit;letter-spacing:0;max-width:100%;text-align:initial}
.role-slot{grid-row:1;display:block;min-width:0;width:100%;height:auto;line-height:inherit;overflow:hidden;white-space:nowrap;will-change:transform,opacity}
.role-slot-a{grid-column:1;text-align:right;color:#fff}
.role-slot-b{grid-column:3;text-align:left;color:#b7b0bd}
.role-plus{grid-column:2;grid-row:1;display:block;text-align:center;align-self:baseline;width:100%;font:inherit;line-height:inherit;color:#b7b0bd}
.landing-location{flex:0 1 auto;min-width:0}
/* The completed landing gets one quiet invitation, above the footer row. */
.landing-scroll-cue{position:absolute;z-index:2;left:50%;bottom:96px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-width:52px;min-height:58px;padding:7px;color:#c6bdcc;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,7px);transition:opacity 300ms ease,transform 300ms ease,visibility 0s linear 300ms}
.landing-scroll-cue .mono{font:400 10px/1.3 'Roboto Mono','Courier New',monospace;letter-spacing:.09em}
.landing-scroll-cue svg{display:block;flex:0 0 auto}
.landing-scroll-cue.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);transition-delay:0s}
.landing-scroll-cue:hover{color:#f1d7f8}
.landing-scroll-cue:focus-visible{outline:1px solid #d9ade7;outline-offset:5px}
/* The original rabbit and its circle share a quiet neon tube and local hover light. */
.rabbit-control{--rabbit-x:0;--rabbit-y:0;position:relative;display:inline-grid;place-items:center;flex:0 0 auto;width:88px;height:88px;min-height:44px;padding:8px;color:#fff;perspective:400px;vertical-align:bottom}
.rabbit-orbit{position:relative;display:grid;place-items:center;width:100%;height:100%;border:1px solid #dac6e5b3;border-radius:50%;box-shadow:0 0 2px #f6dbff38,0 0 7px #cf00f426,inset 0 0 4px #cf00f414;transform:translate3d(calc(var(--rabbit-x)*3px),calc(var(--rabbit-y)*3px),0) rotateX(calc(var(--rabbit-y)*-12deg)) rotateY(calc(var(--rabbit-x)*12deg));transition:transform 400ms cubic-bezier(.16,1,.3,1),border-color 220ms,box-shadow 220ms}
.rabbit-orbit::before{content:'';position:absolute;inset:-1px;border:1px solid #fff5ff;border-radius:inherit;opacity:0;pointer-events:none;-webkit-mask-image:radial-gradient(circle at calc(50% + var(--rabbit-x)*50%) calc(50% + var(--rabbit-y)*50%),#000 0 16%,transparent 65%);mask-image:radial-gradient(circle at calc(50% + var(--rabbit-x)*50%) calc(50% + var(--rabbit-y)*50%),#000 0 16%,transparent 65%);filter:drop-shadow(0 0 2px #fff) drop-shadow(0 0 7px #df81ff);transition:opacity 220ms}
.rabbit-drawing{display:block;width:74%;height:74%;object-fit:contain;filter:brightness(0) invert(1) drop-shadow(0 0 1px #f3d9ff70) drop-shadow(0 0 3px #cf00f440);user-select:none;transform:translate3d(calc(var(--rabbit-x)*6px),calc(var(--rabbit-y)*6px),0) rotate(calc(var(--rabbit-x)*4deg));transition:transform 500ms cubic-bezier(.16,1,.3,1),filter 220ms}
.rabbit-neon-highlight{display:none;position:absolute;left:50%;top:50%;width:74%;height:74%;background:radial-gradient(circle at calc(50% + var(--rabbit-x)*70%) calc(50% + var(--rabbit-y)*70%),#fff 0 10%,#efb9ff 28%,transparent 58%);-webkit-mask:url('media/rabbit.png') center/contain no-repeat;mask:url('media/rabbit.png') center/contain no-repeat;filter:drop-shadow(0 0 2px #fff) drop-shadow(0 0 7px #dc7eff);opacity:0;pointer-events:none;transform:translate(-50%,-50%) translate3d(calc(var(--rabbit-x)*6px),calc(var(--rabbit-y)*6px),0) rotate(calc(var(--rabbit-x)*4deg));transition:transform 500ms cubic-bezier(.16,1,.3,1),opacity 220ms}
@supports ((mask-image:linear-gradient(#000,#000)) or (-webkit-mask-image:linear-gradient(#000,#000))){.rabbit-neon-highlight{display:block}}
.rabbit-control:hover{color:#fff}
@media(hover:hover){
.rabbit-control:hover .rabbit-orbit{border-color:#ecd4f5d9;box-shadow:0 0 3px #ffeaff70,0 0 11px #db74ff80,inset 0 0 7px #cf00f43d}
.rabbit-control:hover .rabbit-drawing{filter:brightness(0) invert(1) drop-shadow(0 0 2px #fce6ffb3) drop-shadow(0 0 6px #d76aff80)}
.rabbit-control:hover .rabbit-neon-highlight,.rabbit-control:hover .rabbit-orbit::before{opacity:1}
}
.rabbit-control:is(:focus-visible,:active) .rabbit-orbit{border-color:#fff4ff;box-shadow:0 0 3px #fff,0 0 12px #dc7effb3,inset 0 0 8px #cf00f459}
.rabbit-control:is(:focus-visible,:active) .rabbit-drawing{filter:brightness(0) invert(1) drop-shadow(0 0 2px #fff) drop-shadow(0 0 7px #e18bff)}
.rabbit-control:is(:focus-visible,:active) .rabbit-neon-highlight{background:#fff5ff;opacity:1}
.rabbit-control:is(:focus-visible,:active) .rabbit-orbit::before{-webkit-mask-image:none;mask-image:none;opacity:1}
.rabbit-control:focus-visible{outline:none}
.rabbit-control:focus-visible .rabbit-orbit{outline:1px solid #e8b3ff;outline-offset:4px}
.landing .title-rabbit{width:44px;height:44px;align-self:flex-end;margin:0 0 .015em 0;padding:4px;z-index:2}
.landing .title-rabbit .rabbit-orbit{width:clamp(24px,2.2vw,34px);height:clamp(24px,2.2vw,34px)}
.landing .title-rabbit .rabbit-drawing{transform:translate3d(calc(var(--rabbit-x)*3px),calc(var(--rabbit-y)*3px),0) rotate(calc(var(--rabbit-x)*4deg))}
.landing .title-rabbit .rabbit-neon-highlight{transform:translate(-50%,-50%) translate3d(calc(var(--rabbit-x)*3px),calc(var(--rabbit-y)*3px),0) rotate(calc(var(--rabbit-x)*4deg))}
.connect-ending{display:inline-flex;align-items:baseline;gap:.025em;white-space:nowrap;vertical-align:baseline}
/* Keep the story entrance visible while retaining a compact title ending. */
.traditional-hero .story-rabbit{font-size:inherit;align-self:flex-end;width:clamp(48px,.58em,64px);height:clamp(48px,.58em,64px);min-width:48px;min-height:48px;padding:0;margin:0 0 .02em;place-items:center;vertical-align:baseline}
.traditional-hero .story-rabbit .rabbit-orbit{width:clamp(30px,.46em,48px);height:clamp(30px,.46em,48px)}
.ui-roll-mask{overflow:hidden}
.ui-roll-inner{display:inline-block}
.ui-revealed .ui-roll-mask{overflow:visible}
.blurb-line{display:block;overflow:hidden}
.blurb-line-inner{display:block}
.role-labels-roll{flex:0 0 auto;max-width:100%}
@media(min-width:1600px){:root{--ui-margin:60px}}
@media(max-width:1060px){
 .landing-center{top:48%;transform:translateY(-46%)}
 .landing-blurb{position:static;width:240px;max-width:80%;margin:28px auto 0;font-size:12px;line-height:1.3;text-align:center}
 .landing .landing-footer{font-size:10px}
}
@media(max-width:760px){
 :root{--hero-type-size:clamp(34px,10.2vw,78px);--surhay-name-size:clamp(30px,7.3vw,54px);--ui-margin:max(24px,env(safe-area-inset-left))}
 .masthead{height:95px}.masthead .local-time{font-size:11px}.header-links .menu-button{font-size:11px}.masthead .site-menu{top:83px;width:270px}
 .landing{min-height:600px}.landing-center{top:47%;transform:translateY(-43%)}
 .landing .intro-meta{top:-40px;font-size:9px;letter-spacing:0}
 .landing .intro-meta>span{gap:8px}.landing .status-dot{width:6px;height:6px;flex-basis:6px}
 .landing-blurb{width:230px;margin-top:28px;font-size:11px;line-height:1.35}
 .landing .landing-footer{bottom:calc(27px + env(safe-area-inset-bottom));font-size:10px;line-height:16px;gap:20px}.landing-scroll-cue{bottom:calc(104px + env(safe-area-inset-bottom))}.landing .landing-footer .role-labels{font-size:10px}
 .landing .title-rabbit{width:44px;height:44px;padding:4px}
 .rabbit-control{width:76px;height:76px;padding:7px}
}
@media(max-width:560px){.landing .landing-footer{display:grid;grid-template-columns:minmax(0,1fr) max-content;align-items:end;gap:14px;font-size:9px}.landing-location{align-self:end}.landing .landing-footer .role-labels-roll{justify-self:end;align-self:end}.landing .landing-footer .role-labels{width:34.8ch;font-size:9px}.landing-location .ui-roll-inner{max-width:100%}}
@media(max-width:360px){:root{--ui-margin:max(20px,env(safe-area-inset-left))}.masthead .local-time{font-size:10px}.header-links .menu-button{font-size:10px}.landing .intro-meta{font-size:8px}}
@media(orientation:landscape) and (max-height:540px){
 :root{--hero-type-size:clamp(28px,8svh,42px);--surhay-name-size:clamp(28px,9svh,46px);}
 .masthead{height:70px}.masthead .local-time{font-size:11px}.masthead .site-menu{top:65px;max-height:calc(100svh - 80px)}
 .landing{min-height:350px}.landing-center{top:49%;transform:translateY(-47%)}.landing .intro-meta{top:-30px;font-size:8px}
 .landing-blurb{position:absolute;left:calc(50% + var(--hero-type-size)*4.25);top:calc(50% - 12px);width:200px;max-width:none;margin:0;font-size:10px;text-align:left}
 .landing-scroll-cue{bottom:calc(72px + env(safe-area-inset-bottom));min-height:50px;gap:5px}
 .landing .landing-footer{flex-direction:row;align-items:center;gap:20px;font-size:8px;bottom:calc(18px + env(safe-area-inset-bottom))}.landing .landing-footer .role-labels{font-size:8px;align-self:auto}
 .landing .title-rabbit{width:44px;height:44px;padding:4px}
}
@media(orientation:landscape) and (max-height:540px) and (max-width:820px){.landing{min-height:450px}.landing-center{top:46%}.landing-blurb{position:static;width:230px;margin:22px auto 0;text-align:center}.landing-scroll-cue{bottom:calc(95px + env(safe-area-inset-bottom))}.landing .landing-footer{display:grid;grid-template-columns:minmax(0,1fr) max-content;align-items:end;gap:14px}.landing-location{align-self:end}.landing .landing-footer .role-labels-roll{justify-self:end;align-self:end}}
@media(prefers-reduced-motion:reduce){.landing-scroll-cue{transition:none}.headline-sway,.rabbit-orbit,.rabbit-drawing{transform:none!important;transition:none}.rabbit-neon-highlight{transform:translate(-50%,-50%)!important;transition:none}.rabbit-orbit::before{transition:none}.landing .status-dot,.finale .territory-line .status-dot{animation:none;opacity:1;transform:none}.role-slot{will-change:auto}}