body{--bg:#fff0f5;--fg:#6b0f2b;--muted:#b0456c;--tile:#ffc2d4;--tile-fg:#6b0f2b;--centre:#ff5c8a;--centre-fg:#ffffff;--accent:#d6336c;--card:#ffe0ea;--radius:14px;--good:#d6336c;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M24 40c-7-6-18-13-18-23 0-6 4-10 9-10 4 0 7 2 9 5 2-3 5-5 9-5 5 0 9 4 9 10 0 10-11 17-18 23z' fill='%23ffd6e2' opacity='.45'/%3E%3C/svg%3E")}
h2,h3,.brand{font-family:"Segoe Script","Brush Script MT","Apple Chancery",cursive}
button,.button,.themes summary{border-radius:999px}
input{border-radius:var(--radius)}
/* seven pixel hearts laid out as one big heart: two lobes, two wide sides, the centre, two converging at the tip */
.hive{display:block;position:relative;width:260px;height:220px;margin:.5rem auto}
.hive button{position:absolute;width:78px;height:69px;padding:2px 0 0;transform:none;background:none;clip-path:none;color:var(--tile-fg);font-size:1.6rem;isolation:isolate;transition:transform .15s;--face:var(--tile);--side:#e48aa4;--hi:#ffe3ea}
.hive button::before,.hive button::after{content:"";position:absolute;inset:0;z-index:-1;
  clip-path:polygon(11.1% 0,33.3% 0,33.3% 12.5%,44.4% 12.5%,44.4% 25%,55.6% 25%,55.6% 12.5%,66.7% 12.5%,66.7% 0,88.9% 0,88.9% 12.5%,100% 12.5%,100% 50%,88.9% 50%,88.9% 62.5%,77.8% 62.5%,77.8% 75%,66.7% 75%,66.7% 87.5%,55.6% 87.5%,55.6% 100%,44.4% 100%,44.4% 87.5%,33.3% 87.5%,33.3% 75%,22.2% 75%,22.2% 62.5%,11.1% 62.5%,11.1% 50%,0 50%,0 12.5%,11.1% 12.5%)}
.hive button::before{background:linear-gradient(var(--hi),var(--hi)) 16% 24%/11.2% 12.5% no-repeat,var(--face)}
.hive button::after{background:var(--side);transform:translate(6px,6px);z-index:-2}
.hive .centre{width:60px;height:53px;font-size:1.4rem;background:none;color:var(--centre-fg);--face:var(--centre);--side:#c2325f;--hi:#ff94b3}
.hive button:hover{animation:beat .6s ease-in-out infinite}
.hive button:active{animation:none;transform:scale(1.18);transition-duration:.05s}
.hive button:nth-child(1){left:100px;top:75px}
.hive button:nth-child(2){left:47px;top:1px}
.hive button:nth-child(3){left:135px;top:1px}
.hive button:nth-child(4){left:1px;top:71px}
.hive button:nth-child(5){left:181px;top:71px}
.hive button:nth-child(6){left:51px;top:143px}
.hive button:nth-child(7){left:131px;top:143px}
@keyframes beat{50%{transform:scale(1.08)}}
#enter{font-size:0}
#enter::after{content:"send";font-size:1rem}
#found li::before,.words li::before{content:"\2665  ";color:var(--accent)}
.msg{position:relative}
.msg.ok::before,.msg.ok::after{content:"\2665";position:absolute;bottom:0;color:var(--centre);pointer-events:none;animation:float 1.4s ease-out forwards}
.msg.ok::before{left:30%}
.msg.ok::after{left:62%;animation-delay:.2s;font-size:.8em}
@keyframes float{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-3rem) rotate(-12deg)}}
@media (prefers-reduced-motion:reduce){.hive button,.msg.ok::before,.msg.ok::after{animation:none}}