:root{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;color:#f3f8fd;background:#061d35;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:#061d35}body::before{content:"";position:fixed;inset:0;background:linear-gradient(180deg,#061b34e8 0%,#07233bb8 35%,#052139a6 65%,#04182eea 100%),url('./images/sea-aerial.jpg') center/cover no-repeat;z-index:-1;pointer-events:none}body{isolation:isolate}.app{min-height:100dvh;display:flex;flex-direction:column;max-width:720px;margin:auto;padding:max(12px,env(safe-area-inset-top)) 28px max(12px,env(safe-area-inset-bottom))}header,footer{display:flex;justify-content:space-between;align-items:center;gap:14px;min-height:88px}header{border-bottom:1px solid #bfdcf023}.brand{display:flex;align-items:center;gap:12px}.brand img{border-radius:14px;width:50px;height:50px;box-shadow:0 4px 20px #0003}.brand-name{font-size:14px;letter-spacing:.16em;font-weight:750}.brand-name small{display:block;font-size:8px;font-weight:500;letter-spacing:.16em;margin-top:5px;color:#b3cadc}.small{font-size:11px;color:#c4dce9;white-space:nowrap;background:#bdddf00c;border:1px solid #cbe4f023;padding:7px 10px;border-radius:30px}.hero{text-align:center;padding-top:clamp(34px,8vh,76px)}.eyebrow{color:#abcddb;font-size:10px;letter-spacing:.23em;font-weight:650}.hero h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(37px,9vw,58px);line-height:1.15;letter-spacing:-.045em;font-weight:400;margin:22px 0 17px;text-wrap:balance}.hero p{font-size:18px;line-height:1.65;color:#d9e9f3;margin:0;font-weight:350}.center{flex:1;min-height:345px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:35px 0 24px}#talk{appearance:none;width:196px;height:196px;flex-shrink:0;border-radius:50%;background:radial-gradient(circle at 35% 20%,#7fcbdf 0%,#46a4c7 45%,#1b688f 100%);border:1px solid #d5f2ff80;box-shadow:0 0 0 10px #82cfe80a,0 0 0 11px #a8d9e822,0 18px 60px #001b3280,inset 0 2px 10px #ffffff24;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;color:#05263c;font-weight:800;font-size:21px;letter-spacing:.12em;cursor:pointer;touch-action:manipulation;transition:background .3s,box-shadow .3s}#talk:disabled{opacity:.55;cursor:default}#talk.active{background:radial-gradient(circle at 35% 20%,#b4e0f0,#77bdd5 50%,#418eaf);box-shadow:0 0 0 13px #86d5ea16,0 0 0 14px #a8d9e84a,0 18px 60px #001b3280}#talkIcon{position:relative;width:28px;height:38px;border:2px solid currentColor;border-radius:16px;font-size:0}#talkIcon::before{content:"";position:absolute;left:-8px;top:14px;width:40px;height:29px;border:2px solid currentColor;border-top:0;border-radius:0 0 22px 22px}#talkIcon::after{content:"";position:absolute;left:11px;top:41px;width:2px;height:8px;background:currentColor}#talk.active #talkIcon{border-radius:4px;width:25px;height:25px;background:currentColor}#talk.active #talkIcon::before,#talk.active #talkIcon::after{display:none}#status{font-size:18px;min-height:28px;margin:31px 0 9px;text-align:center;max-width:360px;line-height:1.5}.hint{color:#bfd5e4;font-size:14px;text-align:center;line-height:1.65;margin:0}footer{border-top:1px solid #bfdcf023;color:#c0d4e1;font-size:12px;min-height:65px}footer a{color:#bad1df;text-decoration:none;font-size:12px;padding:12px;min-height:44px;display:flex;align-items:center}#resumeAudio{background:#d6effa;color:#123a54;border:0;border-radius:12px;padding:12px 18px;margin:10px;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #e6c58c;outline-offset:6px}[hidden]{display:none!important}@media(max-width:370px){.app{padding-left:20px;padding-right:20px}.brand-name small{font-size:7px}.small{font-size:10px;padding:6px}.brand img{width:42px;height:42px}}@media(max-height:700px){.hero{padding-top:25px}.hero h1{font-size:38px;margin:16px 0}.center{min-height:300px;padding-top:25px}#talk{width:174px;height:174px}.hero p{font-size:16px}}@media(prefers-reduced-motion:reduce){#talk{transition:none}}

footer{justify-content:flex-end}#status[hidden]~.hint{margin-top:24px}