@font-face{font-family:Caveat;src:url('assets/caveat.ttf') format('truetype');font-weight:400 700;font-display:swap}
:root{--blue:#0b46e5;--white:#fff;--side:5.2vw;color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0;background:var(--blue);color:var(--white);font-family:Arial,'Microsoft YaHei',sans-serif}body{min-width:320px}
.cover{position:relative;isolation:isolate;min-height:700px;height:100svh;overflow:hidden;background:var(--blue)}
.photograph,#liquid{position:absolute;inset:0;width:100%;height:100%;display:block}.photograph{object-fit:cover;object-position:50% 52%;z-index:-3}#liquid{z-index:-2;pointer-events:none}
.masthead{position:absolute;top:36px;left:var(--side);right:var(--side);display:flex;justify-content:space-between;align-items:center;font-size:12px;letter-spacing:.11em;gap:24px}
.reveal-toggle{font:inherit;letter-spacing:inherit;color:inherit;border:0;padding:14px 0;background:none;cursor:pointer}.reveal-toggle:hover{text-decoration:underline;text-underline-offset:6px}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:4px}a:focus-visible,button:focus-visible{outline:2px solid white;outline-offset:6px}
h1{position:absolute;top:28%;left:50%;margin:0;width:max-content;max-width:92%;text-align:center;font-family:Caveat,'Brush Script MT',cursive;font-size:clamp(90px,13.8vw,260px);font-weight:500;line-height:1.13;letter-spacing:-.055em;white-space:nowrap;transform:translate(-50%,-50%) rotate(-3deg);pointer-events:none;text-shadow:0 1px 12px #0b46e518}h1 span:last-child{margin-left:.025em}
.hint{position:absolute;left:50%;top:62%;font-family:Caveat,cursive;font-size:24px;transform:translate(-50%,-50%) rotate(-5deg);transition:opacity .6s;pointer-events:none}.interacted .hint{opacity:0}
.information{position:absolute;left:11.5%;right:8%;bottom:7%;display:grid;grid-template-columns:1fr 1.15fr 1.3fr 1.35fr;gap:4vw}.information h2{font-weight:400;font-size:13px;opacity:.7;margin:0 0 17px}.information p,.information a{font-size:14px;line-height:1.85;margin:0}.information a{display:inline-block;min-height:30px;overflow-wrap:anywhere}
.fallback #liquid{display:none}.fallback .photograph{clip-path:circle(0 at 60% 48%);transition:clip-path 1s}.fallback.revealed .photograph{clip-path:circle(48% at 60% 48%)}
@media(min-width:1800px){.information p,.information a{font-size:16px}.information h2{font-size:14px}}
@media(max-width:700px){:root{--side:7vw}.cover{min-height:740px}.masthead{top:20px;font-size:10px;letter-spacing:.07em;gap:16px}.reveal-toggle{min-height:44px;font-size:10px}h1{top:29%;left:50%;width:84%;font-size:25vw;line-height:.85;white-space:normal;letter-spacing:-.045em}h1 span{display:block}h1 span:last-child{margin-left:0;margin-top:.1em}.photograph{object-position:58% center}.hint{top:65%;font-size:22px}.information{left:8%;right:8%;bottom:5%;grid-template-columns:1fr 1fr;column-gap:20px;row-gap:25px}.information h2{margin-bottom:7px;font-size:12px}.information p,.information a{font-size:12px;line-height:1.8}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}