:root{color-scheme:light;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:#454136;background:#faf6ec}html.embed,body.embed{background:transparent}
*{box-sizing:border-box}body{margin:0}main{max-width:850px;margin:auto;padding:28px 30px 30px}header{display:flex;align-items:center;justify-content:space-between}header a{font-size:12px;letter-spacing:.17em;font-weight:800;color:#686043;text-decoration:none}.badge{display:flex;align-items:center;gap:7px;font-size:12px;color:#737762}.badge i{width:6px;height:6px;border-radius:50%;background:#91a77b}.intro{text-align:center;margin:38px 0 0}.intro p{font-size:12px;letter-spacing:.08em;color:#a4916b;margin:0 0 9px}.intro h1{font-size:clamp(24px,4vw,34px);letter-spacing:-.02em;margin:0 0 12px;font-weight:750}.intro span{font-size:14px;color:#8f8878}.stage{position:relative;display:flex;align-items:center;flex-direction:column;margin:12px auto 0;max-width:540px;background:radial-gradient(ellipse at center,#fff8d955,transparent 66%)}canvas{display:block;width:min(100%,430px);aspect-ratio:1;cursor:grab;touch-action:none;opacity:0;transition:opacity .35s}canvas.ready{opacity:1}canvas:active{cursor:grabbing}canvas:focus-visible{outline:2px solid #a89261;outline-offset:0;border-radius:40%}.stage p{margin:0;min-height:24px;font-size:13px;color:#8d8062;text-align:center}.actions{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:23px auto 0}button{font:inherit;font-size:13px;border:1px solid #e1d8c5;background:#fffaf1;color:#6e6654;border-radius:100px;padding:11px 17px;cursor:pointer;transition:background .18s,transform .18s}button:hover{background:#f4e8c9;transform:translateY(-1px)}button[aria-pressed=true]{color:#665129;background:#f2de9c;border-color:#dfc778}button:focus-visible,a:focus-visible{outline:2px solid #a89261;outline-offset:4px}footer{margin-top:30px;padding-top:22px;border-top:1px solid #e9e2d3;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;color:#a19886}footer div{display:flex;gap:16px}footer a{color:#9b8457;text-underline-offset:4px}.embed main{padding:0}.embed header,.embed .intro,.embed .actions,.embed footer{display:none}.embed .stage{margin:0}.embed .stage p{display:none}.embed canvas{width:100%}@media(max-width:560px){main{padding:22px 16px}.intro{margin-top:30px}.stage{margin-top:20px}canvas{width:min(100%,350px)}button{padding:10px 13px}.actions{gap:8px;margin-top:17px}footer{justify-content:center;text-align:center;gap:12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}