@font-face{font-family:Pixel;src:url('./assets/fonts/fusion-pixel.woff2') format('woff2');font-display:block}
@font-face{font-family:Departure;src:url('./assets/fonts/DepartureMono-Regular.otf') format('opentype');font-display:block}
@font-face{font-family:Authentic;src:url('./assets/fonts/AUTHENTICSans-60.otf') format('opentype');font-weight:400;font-display:block}
@font-face{font-family:Authentic;src:url('./assets/fonts/AUTHENTICSans-90.otf') format('opentype');font-weight:500;font-display:block}
@font-face{font-family:AuthenticButton;src:url('./assets/fonts/AUTHENTICSans-90.otf') format('opentype');font-display:block}
@font-face{font-family:Comic;src:url('./assets/fonts/ComicShannsMonoNerdFontPropo-Regular.otf') format('opentype');font-display:block;unicode-range:U+0000-001F,U+0021-24FF,U+2501,U+2503-254F,U+2551-2570,U+2574-2580,U+2589-2590,U+2594-10FFFF}
:root{--top-color:#f77c00;--screen-color:#05fbff;--ink:#494949;--ui-scale:1;--grain:url('./assets/grain.svg');color-scheme:light;font-family:Authentic,'PingFang SC',sans-serif}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:white}body{display:flex;justify-content:center;overflow-x:hidden}button,input,textarea{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:disabled{cursor:wait}button{padding:0;border:0;color:inherit;background:none}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #494949;outline-offset:3px}button:focus:not(:focus-visible){outline:none}p,h1,h2,pre{margin:0}img{display:block;max-width:none;pointer-events:none;user-select:none}pre{font-variant-ligatures:none;font-feature-settings:'liga' 0} [hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.stage{position:relative;width:375px;height:812px;flex:none;background:white;border-radius:30px;overflow:hidden;transform-origin:top center}.machine{position:absolute;left:10px;top:97px;width:355px;height:680px;isolation:isolate}.surface{position:absolute}.black-base{left:-.158px;top:472.679px}.body-base{left:0;top:0}.corner{left:253px;top:0}.indicator-lights{position:absolute;left:0;top:0;z-index:1;pointer-events:none}.indicator-lights i{position:absolute;width:7px;height:7px;border-radius:50%;opacity:0;box-shadow:0 0 5px currentColor,inset 1px 1px 2px #fff9}.indicator-lights i:nth-child(1){left:307.25px;top:10px;color:#ff9b09;background:currentColor}.indicator-lights i:nth-child(2){left:319.05px;top:19.5px;color:#db75f7;background:currentColor}.indicator-lights i:nth-child(3){left:329.72px;top:31px;color:#05fbff;background:currentColor}.indicator-lights i:nth-child(4){left:338.75px;top:43px;color:#9ae255;background:currentColor}
.plastic{background-color:#e4e0dd;background-image:linear-gradient(#ffffff08,#99999908);isolation:isolate}.plastic:before{content:'';position:absolute;inset:0;background-image:url('./assets/figma/76357.png');background-size:cover;mix-blend-mode:luminosity;opacity:.4;border-radius:inherit;z-index:-1;pointer-events:none}
.top-plate{position:absolute;left:11px;top:21px;width:333px;height:180px;border:0;border-radius:100px;box-shadow:inset 0 0 8px -4px black,inset 0 0 0 1px #c6c6c6}.round-rim{pointer-events:none;position:absolute;left:160px;top:7px;width:166px;height:166px;padding:3px;background:conic-gradient(from 108deg at 68% 45%,#3f3f3f,#565656 22.356%,#6e6e6e 44.712%,#575757 72.356%,#3f3f3f);border-radius:100%;box-shadow:inset 4px 4px 4px black}.round-bezel{width:160px;height:160px;padding:10px;border-radius:100%;background:linear-gradient(53deg,#000 8.3301%,#232323 31.872%,#656565 48.207%,#232323 70.119%,#3e3e3e 108.26%);box-shadow:inset 0 0 5px black}.round-screen{position:relative;width:140px;height:140px;background:var(--top-color);border-radius:100%;box-shadow:0 0 8px var(--top-color);overflow:hidden;color:black;transition:background-color 150ms,box-shadow 150ms}.round-screen:after{position:absolute;inset:0;content:'';border-radius:inherit;pointer-events:none;box-shadow:inset -4px -4px 16px -4px #0008,inset -40px -40px 24px -8px #ffffff40;z-index:4}.reflection{position:absolute;left:4.91px;top:1.42px;width:71.903px;height:68.723px;display:flex;align-items:center;justify-content:center;transform:rotate(-38.95deg);pointer-events:none;z-index:3}.reflection img{position:absolute;left:-32.4px;top:-32.4px}.screen-grain{position:absolute;inset:0;pointer-events:none;background-image:var(--grain);opacity:.23;mix-blend-mode:soft-light;z-index:7;border-radius:inherit}#startup-character{position:absolute;left:-12.88px;top:23.01px;font:9.509172px/10.697819px Departure,monospace;white-space:pre;letter-spacing:0}.character-grid{position:absolute;left:14px;top:33px;display:grid;grid-template-columns:repeat(16,7px);grid-template-rows:repeat(7,10.5px);font:11.667px/10.5px Departure,Pixel,monospace;white-space:pre}.character-grid span{width:7px;height:10.5px;text-align:center;overflow:visible}
.color-keys{position:absolute;inset:0;pointer-events:none}.color-key{position:absolute;pointer-events:none;isolation:isolate;touch-action:manipulation}.key-layer{position:absolute;display:flex;align-items:center;justify-content:center;pointer-events:none}.key-rotation{position:relative;flex:none;transform:rotate(var(--angle)) scaleY(-1)}.key-layer img{position:absolute}.key-face .key-rotation:after{content:'';position:absolute;inset:-.75px;border:1.5px solid black;border-radius:50%;opacity:0;background:linear-gradient(90deg,#9d9895 21.154%,#efedeb);box-shadow:inset 3.52px 3.52px 3.516px #00000040,inset .88px .88px 3.1px #0008,inset -3.52px -3.52px 12px -5px #0008,inset -.88px -.88px 1.758px 1.758px #ffffff80,inset 0 4px 9.3px -2px #00000040,inset -4px -4px 9.3px -2px #00000040}.key-face,.key-label-box{transition:translate 100ms ease-out}.color-key:active .key-face,.color-key.pressing .key-face,.color-key:active .key-label-box,.color-key.pressing .key-label-box{translate:0 1px}.color-key:active .key-face img,.color-key.pressing .key-face img{opacity:0}.color-key:active .key-face .key-rotation:after,.color-key.pressing .key-face .key-rotation:after{opacity:1}.key-label-box{position:absolute;display:flex;align-items:center;justify-content:center;pointer-events:none}.key-label{position:relative;flex:none;font:7px/10.697819px Authentic,sans-serif;white-space:nowrap;pointer-events:none;transform:rotate(var(--label-angle));color:#000}.color-key:focus-visible{outline-offset:-6px;border-radius:50%}.character-switch{position:absolute;left:168px;top:4px;width:30px;height:60px;padding:4px;border-radius:100px;transform:rotate(45deg);background:linear-gradient(#ffffff1a,#9999991a);box-shadow:0 1px 1px #fff8}.character-switch-bed{position:relative;display:block;background:black;padding:1px;width:22px;height:52px;border-radius:100px}.character-switch-cap{position:relative;display:flex;align-items:center;justify-content:center;width:20px;height:50px;border-radius:100px;background:linear-gradient(#efedeb,#cdc6c1);box-shadow:inset 1px 1px 2px 2px #ffffff80,inset 4px 4px 4px -4px #ffffff80,inset -1px -1px 1px #0008,inset -4px -4px 4px #0004;transition:transform 100ms,box-shadow 100ms}.character-switch-cap img{transform:rotate(-45deg)}.character-switch:active .character-switch-cap{transform:translateY(1px);box-shadow:inset 2px 2px 4px #0007}.speaker{position:absolute;left:10.872px;top:11.03px;width:33.941px;height:33.941px;display:flex;align-items:center;justify-content:center;transform:rotate(-45deg)}
.display-controls{position:absolute;left:11px;top:210.28247px;display:flex;gap:7px;align-items:center;width:333px;height:360px}.main-rim{position:relative;width:280px;height:360px;flex:none;padding:7px;border:0;border-radius:5px;box-shadow:inset 0 0 8px -4px black,inset 0 0 0 1px #c6c6c6}.main-rim-dark{position:relative;padding:3px;border-radius:5px;background:conic-gradient(from 90deg at 68% 45%,#3f3f3f,#565656 22.356%,#6e6e6e 44.712%,#575757 72.356%,#3f3f3f);box-shadow:inset 4px 4px 4px -3px black}.main-bezel{padding:10px;background:linear-gradient(45.98deg,#000 12.755%,#232323 33.17%,#656565 47.336%,#232323 66.337%,#3e3e3e 99.415%);border-radius:5px;box-shadow:inset 0 0 5px black}.main-screen{position:relative;width:240px;height:320px;background:var(--screen-color);border-radius:4.95px;color:var(--ink);box-shadow:0 0 8px var(--screen-color);overflow:hidden;transition:background-color 100ms,box-shadow 100ms}.screen-effects{position:absolute;left:-135.46px;top:-175.58px;z-index:5;pointer-events:none}.screen-shadow{position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 8px -2px black,inset -8px 8px 16px -4px #0008;z-index:9}.screen-content{position:relative;width:240px;height:320px;font-family:Pixel,monospace;isolation:isolate;z-index:6}.view{position:absolute;inset:0}.home-view{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:5px 10px 15px}.home-view h1{font:37px/1.15 Pixel,monospace;letter-spacing:1.85px;text-align:center;width:240px;height:140px;flex:none;text-shadow:0 4px 4px #0004;font-weight:400}.home-view h1 span{display:inline-block;font-size:24px;white-space:nowrap;letter-spacing:0}.input-options{display:flex;flex-direction:column;align-items:center;gap:10px;width:200px}.input-row{display:flex;gap:10px;width:100%;justify-content:center}.pixel-button,.pixel-border{border:solid currentColor;border-width:1.5px 3px 3px 1.5px;border-radius:5px}.pixel-button{border:0;box-shadow:inset 1.5px 1.5px 0 currentColor,inset -3px -3px 0 currentColor;font:14px/normal Pixel,monospace;letter-spacing:.7px;text-shadow:0 4px 4px #0004;color:var(--ink);transition:background 80ms,transform 80ms;position:relative}.pixel-button:active{transform:translate(1px,1.5px);box-shadow:inset 2.5px 2.5px 0 currentColor,inset -1.5px -1.5px 0 currentColor;background:#00000015}.pixel-button:focus-visible{outline-color:currentColor;outline-offset:2px}.input-option{display:flex;flex:1;min-width:0;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:10px 15px}.input-option>span:last-child{white-space:nowrap;flex:none;line-height:19px}.input-option img,.itinerary-option>img{flex:none}.image-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px}.itinerary-option{display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 8px;width:200px}.itinerary-option span{white-space:nowrap}.main-screen[data-white='true'] .input-option img,.main-screen[data-white='true'] .itinerary-option>img{filter:brightness(0) invert(1)}
.side-controls{height:360px;flex:0 0 46px;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.bw-switch{position:relative;border:1px solid #c6c6c6;box-shadow:inset 0 0 8px -4px black;border-radius:100px;padding:7px;display:flex;flex-direction:column;gap:7.5px;width:46px;height:89.5px}.font-key{position:relative;width:32px;height:34px;border:1px solid black;flex:none;transition:filter 100ms,box-shadow 100ms,transform 100ms}.white-key{border-radius:100px 100px 5px 5px;background:linear-gradient(#efedeb,#cdc6c1);box-shadow:inset 1px 1px 2px 2px #ffffff80,inset 4px 4px 4px -4px #ffffff80,inset -1px -1px 1px #0008,inset -4px -4px 4px #0004}.black-key{border-radius:5px 5px 100px 100px;background:linear-gradient(#505050,#242424);box-shadow:inset -1px -1px 1px #0008,inset -4px -4px 4px #0004,inset 1px 1px 1px black,inset 4px 4px 4px #0004}.font-key:active,.font-key.pressing{transform:translateY(1px);filter:brightness(.86);box-shadow:inset 2px 2px 5px #0008}.font-key:focus-visible{outline-offset:2px}.side-speaker{position:relative;display:flex;align-items:center;justify-content:center;width:36.062px;height:36.062px;transform:rotate(45deg)}.color-slider{position:relative;border:1px solid #c6c6c6;border-radius:100px;width:46px;height:198px;padding:3px;box-shadow:inset 0 0 8px -4px black}.slider-tint{position:absolute;inset:3px;border-radius:100px;background:linear-gradient(180deg,#ff9b091a 5%,#db75f71a 35%,#05fbff1a 65%,#9ae2551a 95%),#ffffff33}.rainbow-track{position:absolute;left:17px;top:19px;width:10px;height:160px;border-radius:100px;background:linear-gradient(180deg,#ff9b09 5%,#db75f7 35%,#05fbff 65%,#9ae255 95%);box-shadow:inset 2px 1px 1px #000,inset -1px -1px 1px #000,inset -4px -4px 3px #0004,0 0 3px #66ffff;filter:blur(.45px)}.rainbow-track:before{content:'';position:absolute;inset:0 -1.5px;border-radius:inherit;background:inherit;filter:blur(2px);z-index:-1}.slider-thumb{transition:transform 110ms cubic-bezier(.23,1,.32,1);position:absolute;left:6px;top:104.84px;width:32px;height:20px;border-radius:5px;background:linear-gradient(90deg,#cdc6c1,#efedeb);box-shadow:0 -4px 4px #0004,inset -1px -1px 1px white,inset -4px -4px 4px #ffffffbf,inset 1px 1px 1px #0008,inset 4px 4px 4px #0004;pointer-events:none;z-index:2}.slider-thumb:after{content:'';position:absolute;left:3px;right:3px;top:14px;height:13px;background:var(--handle-glow,#05fbff);filter:blur(5px);opacity:.8;z-index:-2;pointer-events:none}#screen-color{position:absolute;left:0;top:17px;width:44px;height:164px;margin:0;appearance:none;-webkit-appearance:none;writing-mode:vertical-lr;direction:ltr;background:transparent;border:0;opacity:0;z-index:4;cursor:ns-resize;touch-action:none}#screen-color::-webkit-slider-thumb{appearance:none;width:40px;height:20px}#screen-color::-moz-range-thumb{width:40px;height:20px;border:0}#color-slider:focus-within{outline:none}#color-slider.dragging .slider-thumb{transform:scale(.94)}
.base-button{position:absolute;z-index:5;isolation:isolate;transition:translate 100ms,filter 100ms}.base-button:active,.base-button.pressing{translate:0 3px;filter:brightness(.95)}.back-button{left:5.6px;top:588.284px;width:82px;height:70.943px}.start-button{left:93.342px;top:588.219px;width:256px;height:77.353px}.base-cap{position:absolute;left:-4px;top:0}.base-label{position:absolute;white-space:nowrap;font-family:AuthenticButton,'PingFang SC',sans-serif;font-weight:400;color:black}.back-button .base-label{left:49.1px;top:33px;font-size:12px;letter-spacing:.5px;transform:rotate(9.72deg)}.start-button .base-label{left:175.833px;top:43.9px;font-size:18px;line-height:10.698px;transform:rotate(-8.59deg);transform-origin:left top}.back-ridge{position:absolute;left:7.09px;top:15.11px;width:66.297px;height:11.747px;display:flex;align-items:center;justify-content:center;transform:rotate(9.22deg)}.start-ridge{position:absolute;left:10.4px;top:-10.09px;width:235.412px;height:62.272px;display:flex;align-items:center;justify-content:center;transform:rotate(-9.26deg)}
.input-view,.ready-view,.result-view{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px 14px;gap:12px;text-align:center}.view h2{font:24px/1.15 Pixel,monospace;letter-spacing:1px;text-shadow:0 4px 4px #0004}.input-view h2{font-size:21px}.input-view>p,.ready-view>p,.result-view>p{font:12px/1.5 Pixel,monospace}.input-view textarea{font:12px/1.5 Pixel,monospace;width:206px;height:135px;resize:none;background:transparent;border:1.5px solid currentColor;color:inherit;padding:8px;border-radius:4px;outline-offset:2px}.input-view textarea::placeholder{color:inherit;opacity:.6}.input-view textarea:focus{outline-color:currentColor}.input-actions{display:flex;gap:10px;width:100%}.input-actions .pixel-button{flex:1;padding:8px 4px}.input-view .field-error{height:15px;min-height:15px;margin-top:-8px;margin-bottom:-6px;font-size:10px}.file-label{position:relative;cursor:pointer;text-decoration:underline;font-size:12px;max-width:100%}.file-label input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.ready-view .pixel-button,.result-view .pixel-button{padding:8px 12px}.trip-summary{max-height:104px;max-width:200px;overflow:auto;overflow-wrap:anywhere;text-align:left}.eyebrow{letter-spacing:1px}.result-view{gap:8px;padding:15px}.result-view h2{font-size:22px}.result-view #result-explanation{max-width:205px}.result-view .local-result-note{font-size:9px;opacity:.8}.result-character{width:160px;height:84px;display:grid;grid-template-columns:repeat(16,10px);grid-template-rows:repeat(7,12px);font:16px/12px Departure,Pixel,monospace;white-space:pre;text-align:center}.screen-toast{position:absolute;left:15px;bottom:12px;width:210px;background:var(--screen-color);border:1.5px solid currentColor;border-radius:4px;padding:8px;font:12px/1.4 Pixel,monospace;text-align:center;z-index:11;box-shadow:2px 3px 0 #0004}.processing-view{overflow:hidden}.ascii-photo{position:absolute;inset:0;white-space:pre;font-family:Comic,monospace;font-weight:400;letter-spacing:0;color:var(--ink);filter:drop-shadow(0 4px 2px #0004);overflow:hidden}.loading-popup{position:absolute;left:50%;top:50%;width:172.297px;height:70.519px;transform:translate(-50%,-50%);background:var(--screen-color);filter:drop-shadow(0 4px 2px #0004);color:var(--ink);z-index:3}.loading-popup p{position:absolute;top:12.075px;width:100%;font:18px/1.25 Pixel,monospace;letter-spacing:.9px;text-align:center;text-shadow:0 4px 4px #0004}.loading-popup pre{position:absolute;top:43.087px;left:50%;transform:translateX(-50%);font:6.6px/7.2px Comic,monospace;white-space:pre;letter-spacing:0}.photo-change{position:absolute;right:10px;bottom:12px;padding:7px 10px;background:var(--screen-color);box-shadow:2px 3px 0 #0004}.photo-view:focus-within .photo-change,.photo-change:hover{opacity:1}
@media(min-width:600px){body{min-height:100dvh;align-items:center}.stage{margin:18px 0}}@media(max-width:374px){.stage{transform:scale(var(--ui-scale));margin-bottom:calc((var(--ui-scale) - 1)*812px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}

/* Clearcoat follows the cap, while its printed label stays crisp above it. */
.key-face .key-rotation { pointer-events: auto; border-radius: 50%; }
.key-clearcoat {
  position: absolute; inset: 0; border-radius: 50%; pointer-events: none; z-index: 2;
  background: radial-gradient(ellipse at 32% 93%, #fff8 0, #fff2 28%, transparent 60%), linear-gradient(105deg, #ffffff35, transparent 40%, #ffffff08 70%, #00000012);
  box-shadow: inset .55px -.65px .45px #ffffffa6, inset -.5px .5px .7px #00000038;
  opacity: .5;
  transition: opacity 100ms ease-out;
}
.color-key:active .key-clearcoat { opacity: .22; }
.character-switch-cap:after, .font-key:after, .slider-thumb > .clearcoat {
  content: ''; position: absolute; inset: 1px; border-radius: inherit; pointer-events: none;
  background: radial-gradient(ellipse at 25% 8%, #ffffff80, #ffffff12 38%, transparent 68%), linear-gradient(112deg, #ffffff1a, transparent 35%, #00000008);
  box-shadow: inset .5px .7px .4px #ffffff90, inset -.5px -.5px .7px #00000038;
  opacity: .45;
}
.character-switch-cap img { position: relative; z-index: 2; }
.font-key[aria-pressed='true'] { box-shadow: inset 1px 1px 2px #0007, inset 3px 3px 4px -1px #0005, inset -.7px -.7px .8px #ffffff4d; }
.font-key[aria-pressed='true']:after { opacity: .18; }
.round-content { position: absolute; inset: 0; width: 140px; height: 140px; }
.glass-optics-ready .round-content { filter: url('#round-lens'); }
#startup-character { -webkit-text-stroke: 1.1886466px currentColor; paint-order: stroke fill; text-shadow: 0 4px 4px #00000040; }
.character-grid, .result-character { -webkit-text-stroke: 1.1886466px currentColor; paint-order: stroke fill; text-shadow: 0 4px 4px #00000040; }
.round-screen:before, .main-screen:before {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 8;
  background: radial-gradient(ellipse at 24% -15%, #ffffff47 0%, #ffffff0a 42%, transparent 58%), linear-gradient(124deg, #ffffff0d 2%, transparent 32%, transparent 77%, #ffffff0a 100%);
  box-shadow: inset 0 1px .8px #ffffff42, inset 1px 0 .8px #ffffff12;
}
.main-screen:before { opacity: .55; }
.round-screen { background-image: radial-gradient(ellipse at 48% 43%, transparent 35%, #00000015 100%); }

/* The housing contains no lit LED; every glow belongs to exactly one light. */
.corner { width:102px; height:105px; border-radius:30px; background:conic-gradient(from 108deg at 68% 45%,#3f3f3f,#565656 22.356%,#6e6e6e 44.712%,#575757 72.356%,#3f3f3f); box-shadow:inset 1px 1px 4px -3px #000; }
.indicator-housing { left:301.994px; top:3.822px; }
.indicator-lights { z-index:1; }
.indicator-lights i { width:9px; height:9px; opacity:1; background:none!important; box-shadow:none; color:transparent; }
.indicator-lights i:before { content:'';position:absolute;left:-1px;top:-1px;width:11px;height:11px;background:url('./assets/figma/indicator-off.svg') center / 11px 11px no-repeat; }
.indicator-lights i:after { content:'';position:absolute;inset:0;border-radius:50%;opacity:0;background:radial-gradient(circle at 65% 28%,#fff 0%,var(--light-color) 51.267%,var(--light-color));box-shadow:0 0 1px var(--light-color),inset 4px 4px 8px #00000029; }
.indicator-lights i.is-lit:after { opacity:1; }
.indicator-lights i:nth-child(1) { left:306.246px;top:9px; }
.indicator-lights i:nth-child(2) { left:318.049px;top:18.5px; }
.indicator-lights i:nth-child(3) { left:328.721px;top:30px; }
.indicator-lights i:nth-child(4) { left:337.746px;top:42px; }
.exported-glass-rim { position:relative!important; flex:none; }
.home-view h1 { position:relative; }
.home-view h1 .headline-copy { position:absolute;left:0;top:46.55px;width:240px;font:37px/1.15 Pixel,monospace;letter-spacing:1.85px; }
.input-option>span:last-child,.itinerary-option>span { -webkit-text-stroke:.4px currentColor; paint-order:stroke fill; }
/* Figma input outlines are OUTSIDE; they do not consume the button's layout. */
.input-option,.itinerary-option,.input-option:active,.itinerary-option:active,.input-option.pressing,.itinerary-option.pressing { box-shadow:none; }
.input-option:before,.itinerary-option:before { content:'';position:absolute;left:-1.5px;top:-1.5px;right:-3px;bottom:-3px;border:solid currentColor;border-width:1.5px 3px 3px 1.5px;border-radius:6.5px;pointer-events:none; }
.input-option:active:before,.itinerary-option:active:before,.input-option.pressing:before,.itinerary-option.pressing:before { border-width:3px 1.5px 1.5px 3px; }

/* Press the large caps into the base while light escapes around both edges. */
.base-button:before {
  content:'';position:absolute;left:5px;right:5px;top:14px;bottom:-6px;
  border-radius:10px 10px 20px 20px;background:var(--top-color);
  filter:blur(7px);opacity:0;pointer-events:none;z-index:-1;
  box-shadow:0 5px 12px 3px var(--top-color);
  transition:opacity 100ms ease-out;
}
.base-button:active:before,.base-button.pressing:before { opacity:.85; }
.back-button:before { transform:rotate(9deg); }
.start-button:before { transform:rotate(-3deg); }
.base-button:after {
  content:'';position:absolute;left:7px;right:7px;top:-2px;height:16px;
  border-radius:50%;background:var(--top-color);filter:blur(7px);
  box-shadow:0 -4px 10px 2px var(--top-color);opacity:0;
  pointer-events:none;z-index:-1;transition:opacity 100ms ease-out;
}
.base-button:active:after,.base-button.pressing:after { opacity:.7; }
.back-button:after { transform:rotate(9deg); }
.start-button:after { transform:rotate(-3deg); }

.slider-thumb:after { content:none; }
.slider-handle-glow { position:absolute;left:9px;width:26px;height:11px;top:119.84px;border-radius:50%;background:#05fbff;filter:blur(5px);opacity:.85;pointer-events:none;z-index:1; }
/* Native PNG keeps Figma's recessed shadow; the source vector supplies its alpha silhouette. */
.indicator-housing { width:50.084px;height:50.8272px;background:url('./assets/figma/indicator-housing.png') 0 0 / 100% 100% no-repeat;-webkit-mask:url('./assets/figma/indicator-housing.svg') 0 0 / 100% 100% no-repeat;mask:url('./assets/figma/indicator-housing.svg') 0 0 / 100% 100% no-repeat; }

/* Fine phosphor grain belongs only to the small circular screen. */
.round-screen > .screen-grain { opacity:.33;background-size:105px 105px; }
/* One cast shadow covers each screen button's outline, icon and printed label. */
.main-screen .pixel-button { text-shadow:none;filter:drop-shadow(0 4px 2px #00000040); }
.main-screen .pixel-button:active,.main-screen .pixel-button.pressing { filter:drop-shadow(0 1px .75px #00000040); }

/* Content sits above the broad lens wash; fine grain and glints remain in front. */
.round-content { z-index:5; }
/* The opaque body occludes rear emitters at its real curved PNG silhouette. */
.black-base { z-index:0; }
.corner,.base-button { z-index:1; }
.body-base { z-index:2; }
.top-plate,.speaker,.display-controls { z-index:3; }