:root{color-scheme:dark;background:#101b22;color:#ebd3a2;font-family:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;font-synthesis:none;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
html,body{margin:0;min-width:280px;min-height:100%}
body{background:#101b22}
.home{min-height:100svh;display:flex;align-items:center;flex-direction:column;overflow:hidden}
.welcome{z-index:1;flex:none;text-align:center;padding:clamp(24px,5vh,48px) 20px 0}
.welcome h1{font:inherit;font-size:clamp(34px,5vw,52px);font-weight:600;line-height:1.15;letter-spacing:-.055em;margin:0 0 18px}
.welcome p{font-size:clamp(20px,2.1vw,28px);line-height:1.45;margin:0;max-width:1100px}
.welcome p:last-child{color:#a5c8d1;margin-top:5px}
.portrait{position:relative;width:min(660px,calc((100svh - 235px)*.754545),100%);flex:none;aspect-ratio:1328/1760;margin:0 auto}
.portrait img{display:block;width:100%;height:100%;user-select:none;-webkit-user-drag:none}
.portrait-open{position:absolute;inset:0;visibility:hidden;pointer-events:none}
.portrait[data-mouth="open"] .portrait-open{visibility:visible}
.mouth{position:absolute;left:31.5%;top:43%;width:28%;height:14%;border-radius:50%;cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none}
.mouth:focus-visible{outline:2px dashed #ebd3a2;outline-offset:4px}
@media(max-width:700px){
  .welcome{padding-top:max(30px,env(safe-area-inset-top));padding-inline:14px}
  .welcome h1{font-size:38px;margin-bottom:16px}
  .welcome p{font-size:19px;line-height:1.45;max-width:540px}
  .portrait{width:min(100%,calc((100svh - 245px)*.754545));margin-top:14px}
}
@media(max-width:360px){.welcome p{font-size:18px}}
@media(max-height:520px) and (min-width:701px){.welcome{padding-top:15px}.welcome h1{font-size:30px;margin-bottom:8px}.welcome p{font-size:20px}.portrait{width:min(380px,calc((100svh - 155px)*.754545))}}

