.about-bubble{position:absolute;z-index:8;left:calc(50% + 130px);bottom:150px;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px)}
.about-trigger{position:relative;display:flex;align-items:center;gap:12px;min-height:52px;padding:9px 17px 9px 10px;border:1px solid #ffffff70;border-radius:20px 20px 20px 5px;background:#fff;color:#102e59;box-shadow:0 8px 30px #04152e38;font-family:inherit;font-size:13px;line-height:1.3;font-weight:700;cursor:pointer;backdrop-filter:blur(16px);animation:about-float 4s ease-in-out infinite;white-space:nowrap}
.about-trigger>span:nth-child(2){font-family:inherit;font-size:13px;font-weight:750}
.about-trigger:hover{background:#fff;box-shadow:0 10px 36px #04152e55}
.about-trigger:focus-visible,.about-close:focus-visible{outline:3px solid #ed365b;outline-offset:4px}
.about-spark{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#102e59;color:white;position:relative}
.about-spark::after{content:"";position:absolute;inset:-4px;border:1px solid #ed365b80;border-radius:50%;animation:about-pulse 3s ease-out infinite}
.about-spark svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5}
.about-plus{width:12px;height:12px;position:relative;margin-left:3px;transition:transform .25s}
.about-plus::before,.about-plus::after{content:"";position:absolute;background:#ed365b;border-radius:2px}
.about-plus::before{width:12px;height:2px;left:0;top:5px}.about-plus::after{width:2px;height:12px;left:5px;top:0}
.about-trigger[aria-expanded="true"]{animation:none;background:#fff}.about-trigger[aria-expanded="true"] .about-plus{transform:rotate(45deg)}
.about-panel{position:absolute;bottom:calc(100% + 17px);left:50%;transform:translateX(-50%);width:390px;max-width:calc(100vw - 64px);max-height:min(420px,60vh);overflow:auto;overscroll-behavior:contain;padding:24px 26px 26px;border:1px solid #ffffffb0;border-radius:22px;background:#f8fbfff7;color:#102e59;box-shadow:0 20px 65px #03112666;backdrop-filter:blur(24px);text-align:left;animation:about-reveal .28s ease-out;transform-origin:bottom center}
.about-panel[hidden]{display:none}.about-panel-top{display:flex;align-items:center;justify-content:space-between;gap:20px}.about-panel-top>span{font-size:9px;letter-spacing:.16em;font-weight:800;color:#526885}
.about-close{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;border:1px solid #d7e2f0;border-radius:50%;background:white;color:#102e59;cursor:pointer}.about-close svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7}
.about-panel h2{margin:12px 0;font-size:27px;line-height:1.2;font-weight:650;letter-spacing:-.04em}.about-draft{display:inline-block;padding:4px 8px;border-radius:6px;background:#ed365b0f;color:#ae2441;font-size:10px;font-weight:650}.about-panel p{margin:16px 0 0;font-size:13px;line-height:1.75;color:#526885}
@keyframes about-float{0%,100%{box-shadow:0 8px 30px #04152e38,0 0 0 0 #ffffff00}50%{box-shadow:0 10px 36px #04152e55,0 0 0 6px #ffffff18}}
@keyframes about-pulse{0%,100%{transform:scale(.94);opacity:.25}50%{transform:scale(1.13);opacity:.8}}
@keyframes about-reveal{from{opacity:0;transform:translate(-50%,9px) scale(.96)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@media(max-width:760px){.about-bubble{bottom:106px}.about-panel{padding:19px 20px 22px;max-height: min(370px,57vh)}.about-trigger{min-height:48px;gap:10px}.about-panel h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){.about-trigger,.about-spark::after,.about-panel{animation:none}.about-plus{transition:none}}

.about-trigger::after{content:"";position:absolute;left:8px;bottom:-15px;width:24px;height:19px;background:#fff;clip-path:polygon(30% 0,100% 0,0 100%);pointer-events:none}
@media(max-width:760px){.about-bubble{left:calc(50% + 32px);bottom:132px}.about-panel{margin-left:-32px}.about-trigger{border-radius:18px 18px 18px 5px}}

/* Lightweight speech bubble for the local preview. */
.about-bubble{bottom:184px}
.about-trigger{min-height:38px;padding:6px 12px 6px 8px;gap:8px;border-color:#ffffff55;border-radius:14px 14px 14px 4px;background:#ffffff18;color:#fff;backdrop-filter:blur(10px);box-shadow:0 4px 18px #04152e20}
.about-trigger>span:nth-child(2){font-size:12px;font-weight:550}
.about-spark{width:24px;height:24px;background:#ffffff12}
.about-spark svg{width:15px;height:15px}
.about-spark::after{inset:-2px;border-color:#ffffff35}
.about-plus{transform:scale(.8);margin-left:1px}
.about-plus::before,.about-plus::after{background:#fff}
.about-trigger:hover,.about-trigger[aria-expanded="true"]{background:#ffffff2b;color:#fff;box-shadow:0 5px 20px #04152e30}
.about-trigger::after{left:7px;bottom:-11px;width:18px;height:13px;background:#ffffff25}
@keyframes about-float{0%,100%{box-shadow:0 4px 18px #04152e20,0 0 0 0 #ffffff00}50%{box-shadow:0 5px 22px #04152e30,0 0 0 4px #ffffff0c}}
@media(max-width:760px){.about-bubble{bottom:162px}.about-trigger{min-height:38px;gap:8px;border-radius:14px 14px 14px 4px}}
.about-bubble{bottom:210px}
@media(max-width:760px){.about-bubble{bottom:190px}}

.about-bubble{bottom:245px}
@media(max-width:760px){.about-bubble{bottom:225px}}

.about-panel .about-subtitle{margin:18px 0 0;font-size:18px;line-height:1.4;font-weight:600;letter-spacing:-.02em;color:#102e59}.about-panel strong{font-weight:750;color:#193b65}

.about-bubble{bottom:280px}
@media(max-width:760px){.about-bubble{bottom:260px}}
