*{box-sizing:border-box}body{margin:0;background:#edece7;color:#283036;font-family:Arial,sans-serif}nav,main,footer{max-width:1400px;margin:auto}nav{padding:24px 32px;display:flex;justify-content:space-between;align-items:center}a{color:inherit;text-decoration:none}button{border:1px solid #28303655;border-radius:30px;background:transparent;color:inherit;padding:10px 17px;cursor:pointer}main{padding:12px 32px 32px}.intro{margin-bottom:28px}.intro h1{font-size:clamp(30px,4vw,54px);letter-spacing:-.06em;margin:0 0 12px}.intro p{font-size:14px;color:#596268}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.study{border-radius:18px;overflow:hidden;min-width:0;position:relative}.study header{padding:22px 24px 0}.study h2{font:600 13px Arial;margin:0 0 7px}.study header p{font:12px Arial;margin:0;opacity:.65}.water{height:174px;position:relative;overflow:hidden;touch-action:pan-y}.letters{position:absolute;inset:0}.glyph{position:absolute;left:0;top:0;font-size:clamp(32px,4vw,57px);line-height:1.2;white-space:pre;will-change:transform;transform-origin:50% 65%;user-select:none}.glyph::before,.glyph::after{content:attr(data-char);position:absolute;inset:0;pointer-events:none}.caption{margin:0;padding:0 24px 22px;font-size:11px;line-height:1.5;opacity:.72}footer{padding:10px 32px 32px;font-size:12px;color:#657070}.bubble{background:radial-gradient(ellipse at 35% 25%,#fff1d7,#ecd4b1);color:#65482f}.bubble .glyph{font-family:Arial Rounded MT Bold,Arial,sans-serif;font-weight:1000;letter-spacing:-.08em;color:#f58c69;-webkit-text-stroke:1.3px #b86246;text-shadow:0 2px #c47054,0 4px #bb654c,0 6px 1px #a9594540,2px 9px 6px #80512c30}.bubble .glyph::before{background:linear-gradient(115deg,#fff7d7 5%,#ffd6a4 24%,#f79773 50%,#f4b18c 72%,#a64d38 100%);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-stroke:.5px #ce8163}.bubble .glyph::after{color:transparent;-webkit-text-stroke:.55px #fff2da;transform:translate(-.8px,-1.3px);opacity:.7}.scribble{background:#f7f3e7;color:#3a3935}.scribble .glyph{font-family:Comic Sans MS,Chalkboard, cursive;font-weight:700;color:transparent;-webkit-text-stroke:1px #343b39}.scribble .glyph::before{-webkit-text-stroke:.65px #535b56;transform:translate(1.7px,-1.1px) rotate(-3deg)}.scribble .glyph::after{-webkit-text-stroke:.4px #9a866a;transform:translate(-1.3px,1.5px) rotate(2deg)}.marker{background:#e5e7e2;color:#293940}.marker .glyph{font-family:Arial,sans-serif;font-weight:900;font-style:italic;color:#3c5863;text-shadow:3px 3px #f0b640,-1px -1px #faf5db;-webkit-text-stroke:1px #1f363e}.marker .glyph::after{color:transparent;-webkit-text-stroke:.65px #172f39;transform:translate(3px,-3px);opacity:.7}.riso{background:#f1e7cf;color:#444b3a}.riso .glyph{font-family:Georgia,serif;font-weight:900;color:#bc5749;text-shadow:3px 2px #70887a}.riso .glyph::before{color:transparent;background:radial-gradient(circle,#efdab3 0 .7px,transparent .9px) 0 0/3px 3px;background-clip:text;-webkit-background-clip:text;opacity:.8}.riso .glyph::after{color:transparent;-webkit-text-stroke:.5px #805640;transform:translate(-1px,1px);opacity:.5}.sketch{background:repeating-linear-gradient(0deg,#e8e2d633 0 1px,transparent 1px 23px),#f4f0e5;color:#585b56}.sketch .glyph{font-family:Georgia,serif;font-style:italic;color:#86948588;-webkit-text-stroke:.65px #4e5955;text-shadow:3px 3px 3px #dcb87077}.sketch .glyph::before{color:transparent;-webkit-text-stroke:.5px #55594e;transform:translate(1px,-1px) rotate(-2deg)}.sketch .glyph::after{color:transparent;background:repeating-linear-gradient(115deg,transparent 0 3px,#626b6266 3px 3.5px);background-clip:text;-webkit-background-clip:text}.uv{background:radial-gradient(ellipse at 50% 60%,#241748,#090c20);color:#cdc5f3}.uv .glyph{font-family:Arial,sans-serif;font-weight:300;color:transparent;-webkit-text-stroke:1px #b79bef;text-shadow:0 0 7px #9b65ff,0 0 18px #6f39b8}.uv .glyph::before{color:transparent;background:repeating-linear-gradient(0deg,transparent 0 6px,#b595db88 6px 7px);background-clip:text;-webkit-background-clip:text;-webkit-text-stroke:0}.uv .glyph::after{color:transparent;-webkit-text-stroke:.4px #eadbff;transform:scale(.92,.88);opacity:.6}@media(max-width:650px){nav{padding:18px 20px}main{padding:10px 16px 24px}.grid{grid-template-columns:1fr;gap:14px}.study header{padding:20px 20px 0}.glyph{font-size:44px}.water{height:145px}.caption{padding:0 20px 20px;font-size:10px}footer{padding:0 20px 24px}}@media(prefers-reduced-motion:reduce){.glyph{will-change:auto}}

@media(min-width:651px) and (max-width:1050px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bubble .glyph{-webkit-text-stroke:5px #ed9c79;paint-order:stroke fill}.bubble .glyph::before{-webkit-text-stroke:.35px #ffdfb2}.bubble .glyph::after{-webkit-text-stroke:.4px #fff2da;opacity:.55}

.mini .intro,.mini footer{display:none}.mini nav{padding:12px 32px}.mini .water{height:130px}.mini .study header{padding-top:16px}.mini .caption{padding-bottom:16px}
