:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#182230;font-synthesis:none;text-rendering:optimizelegibility;--page:#f7f8fb;--surface:#fff;--surface-muted:#f1f4f8;--ink:#182230;--control-ink:#344054;--muted:#566174;--quiet:#778197;--line:#d9e0ea;--line-strong:#bcc7d6;--accent:#675cf5;--accent-dark:#5145df;--accent-soft:#efeeff;--green:#21865a;--green-soft:#eaf8f1;background:#f7f8fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 12% 18%, #675cf51a, transparent 32rem), radial-gradient(circle at 86% 82%, #21865a14, transparent 28rem), var(--page);min-width:320px;min-height:100vh;margin:0;overflow-x:hidden}button{font:inherit}.app-shell{grid-template-columns:minmax(0,1fr) minmax(420px,.82fr);align-items:center;gap:clamp(36px,7vw,112px);width:min(1180px,100% - 48px);min-height:100vh;margin:0 auto;padding:48px 0;display:grid}.intro{min-width:0;max-width:610px}.intro-topline{justify-content:space-between;align-items:center;gap:18px;margin-bottom:22px;display:flex}.intro-actions{flex:none;align-items:center;gap:8px;display:flex}.eyebrow{color:var(--accent-dark);letter-spacing:.16em;text-transform:uppercase;margin:0;font-size:.78rem;font-weight:720}.github-link{min-height:32px;color:var(--control-ink);border:1px solid var(--line);background:#ffffffe0;border-radius:999px;align-items:center;gap:7px;padding:5px 10px;font-size:.72rem;font-weight:650;text-decoration:none;transition:color .16s,border-color .16s,background .16s,transform .16s;display:inline-flex}.github-link svg{fill:currentColor;width:15px;height:15px}.github-link:hover,.github-link:focus-visible{color:var(--accent-dark);background:var(--accent-soft);border-color:#675cf56b;outline:none;transform:translateY(-1px)}.language-switcher{border:1px solid var(--line);background:#ffffffe0;border-radius:999px;flex:none;gap:3px;padding:3px;display:inline-flex}.language-switcher button{min-width:42px;color:var(--quiet);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:5px 9px;font-size:.7rem;font-weight:650}.language-switcher button:hover,.language-switcher button:focus-visible{color:var(--accent-dark);outline:none}.language-switcher button[aria-pressed=true]{color:var(--accent-dark);background:var(--accent-soft)}h1{letter-spacing:-.07em;max-width:600px;margin:0;font-size:clamp(3rem,7vw,6.6rem);font-weight:760;line-height:.95}.lede{max-width:530px;color:var(--muted);margin:30px 0 0;font-size:clamp(1rem,1.6vw,1.22rem);line-height:1.8}.controls{flex-wrap:wrap;gap:10px;margin-top:32px;display:flex}.controls button{color:var(--control-ink);border:1px solid var(--line);cursor:pointer;background:#ffffffe0;border-radius:999px;padding:11px 17px;transition:color .16s,border-color .16s,background .16s,transform .16s}.controls button:hover,.controls button:focus-visible{color:var(--accent-dark);background:var(--accent-soft);border-color:#675cf56b;outline:none;transform:translateY(-1px)}.mode-toggle{width:min(100%,560px);color:var(--ink);text-align:left;border:1px solid var(--line);cursor:pointer;background:#ffffffe0;border-radius:18px;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:14px;margin-top:16px;padding:14px 16px;transition:border-color .16s,background .16s,transform .16s;display:grid}.mode-toggle:hover,.mode-toggle:focus-visible{background:var(--accent-soft);border-color:#675cf56b;outline:none;transform:translateY(-1px)}.mode-toggle-copy{min-width:0}.mode-toggle-copy strong,.mode-toggle-copy small{display:block}.mode-toggle-copy strong{font-size:.9rem;font-weight:650}.mode-toggle-copy small{color:var(--quiet);text-overflow:ellipsis;white-space:nowrap;margin-top:4px;font-size:.72rem;overflow:hidden}.mode-toggle-switch{border:1px solid var(--line-strong);background:#d8dee9;border-radius:999px;width:42px;height:24px;transition:border-color .16s,background .16s;position:relative}.mode-toggle-switch span{background:var(--surface);border-radius:50%;width:16px;height:16px;transition:translate .18s,background .16s;position:absolute;top:3px;left:3px;box-shadow:0 2px 6px #1018282e}.mode-toggle-status{min-width:2em;color:var(--quiet);text-align:right;font-size:.72rem;font-weight:650}.mode-toggle[aria-checked=true]{background:var(--green-soft);border-color:#21865a57}.mode-toggle[aria-checked=true] .mode-toggle-switch{background:var(--green);border-color:#21865a94}.mode-toggle[aria-checked=true] .mode-toggle-switch span{background:#fff;translate:18px}.mode-toggle[aria-checked=true] .mode-toggle-status{color:var(--green)}.pet-library{width:100%;min-width:0;max-width:560px;margin-top:34px}.pet-library-heading{justify-content:space-between;align-items:baseline;margin-bottom:12px;display:flex}.pet-library-heading h2{letter-spacing:.02em;margin:0;font-size:.92rem;font-weight:650}.pet-library-heading span{color:var(--quiet);font-size:.75rem}.pet-picker{scrollbar-color:#675cf552 transparent;scrollbar-width:thin;gap:9px;max-width:100%;padding:3px 3px 10px;display:flex;overflow-x:auto}.pet-option{min-width:76px;color:var(--muted);border:1px solid var(--line);cursor:pointer;background:#ffffffe0;border-radius:15px;place-items:center;padding:8px 7px 7px;transition:color .16s,border-color .16s,background .16s,transform .16s;display:grid}.pet-option:hover,.pet-option:focus-visible{color:var(--ink);border-color:#675cf561;outline:none;transform:translateY(-2px)}.pet-option.is-selected{color:var(--ink);background:var(--accent-soft);border-color:#675cf59e;box-shadow:0 8px 24px #5145df1f}.pet-option-preview{background-position:0 0;background-repeat:no-repeat;background-size:384px 468px;width:48px;height:52px;display:block}.pet-option-label{text-align:center;text-overflow:ellipsis;white-space:nowrap;width:62px;margin-top:4px;font-size:.68rem;display:block;overflow:hidden}.mapping-card{border:1px solid var(--line);background:#ffffffe0;border-radius:18px;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;max-width:520px;margin-top:36px;padding:18px 20px;display:grid}.mapping-card div{min-width:0}.mapping-card span{color:var(--quiet);margin-bottom:5px;font-size:.75rem;display:block}.mapping-card strong{text-overflow:ellipsis;white-space:nowrap;font-size:.98rem;font-weight:640;display:block;overflow:hidden}.mapping-arrow{color:var(--accent)!important;margin:0!important;font-size:1.25rem!important}.pet-card{isolation:isolate;border:1px solid var(--line-strong);background:linear-gradient(145deg,#fffffffa,#f4f7fbfa);border-radius:34px;flex-direction:column;min-height:min(620px,76vh);display:flex;position:relative;overflow:hidden;box-shadow:0 40px 100px #10182824}.ambient-orb{z-index:-1;filter:blur(4px);border-radius:50%;position:absolute}.ambient-orb-one{background:#675cf51f;width:180px;height:180px;top:14%;left:8%}.ambient-orb-two{background:#21865a17;width:220px;height:220px;bottom:18%;right:2%}.pet-stage{flex:1;place-items:center;min-height:0;padding:36px;display:grid}.pet-shell{cursor:grab;touch-action:none;width:210px;height:226px;transition:translate 80ms linear;position:relative}.pet-interaction-target{color:inherit;cursor:grab;touch-action:none;background:0 0;border:0;padding:0;position:absolute;inset:0}.pet-interaction-target:active{cursor:grabbing}.pet-interaction-target:focus-visible{outline:2px solid var(--accent);outline-offset:8px;border-radius:38%}.pet-resize-hit-target{z-index:30;cursor:default;border-radius:8px;justify-content:flex-end;align-items:flex-end;width:48px;height:48px;display:flex;position:absolute;bottom:0;right:0}.pet-resize-handle{width:20px;height:20px;color:var(--muted);border:1px solid var(--line-strong);opacity:0;cursor:nwse-resize;touch-action:none;background:#fffffff0;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:color .12s,opacity .12s;display:flex;box-shadow:0 6px 16px #10182829}.pet-resize-handle svg{width:12px;height:12px}.pet-resize-hit-target:hover .pet-resize-handle,.pet-resize-handle:focus-visible,.pet-shell.is-resizing .pet-resize-handle{color:var(--ink);opacity:1}.pet-resize-handle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.pet-resize-active,.pet-resize-active *{cursor:nwse-resize!important}.pet-sprite{will-change:transform, background-position;-webkit-user-select:none;user-select:none;transition:opacity .16s,filter .16s;position:absolute;top:50%;left:50%;translate:-50% -50%}.pet-card[data-loading=true] .pet-sprite{opacity:.4;filter:saturate(.4)}.pet-meta{border-top:1px solid var(--line);background:#f8fafceb;justify-content:space-between;align-items:center;padding:22px 26px;display:flex}.pet-meta__identity,.pet-meta__actions{align-items:center;gap:9px;display:flex}.pet-meta__actions{justify-content:flex-end}.pet-meta p{color:var(--quiet);margin:0;font-size:.8rem}.pet-download{min-height:34px;color:var(--accent-dark);background:var(--accent-soft);border:1px solid #675cf557;border-radius:999px;flex:none;align-items:center;gap:7px;padding:7px 11px;font-size:.75rem;font-weight:650;text-decoration:none;transition:color .16s,border-color .16s,background .16s,transform .16s;display:inline-flex}.pet-download:hover,.pet-download:focus-visible{color:#fff;border-color:var(--accent);background:var(--accent);outline:none;transform:translateY(-1px)}.pet-download:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.pet-download[hidden]{display:none}.page-floating-mode .pet-card{z-index:1000;min-height:0;box-shadow:none;pointer-events:none;background:0 0;border:0;border-radius:0;position:fixed;inset:0;overflow:visible}.page-floating-mode .ambient-orb,.page-floating-mode .pet-meta{display:none}.page-floating-mode .pet-stage{pointer-events:none;padding:0}.page-floating-mode .pet-shell{pointer-events:auto}.status-dot{background:var(--green);border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 5px #21865a1a}.developer-guide{border-top:1px solid var(--line);grid-template-columns:minmax(0,.82fr) minmax(440px,1.18fr);gap:clamp(44px,8vw,120px);width:min(1180px,100% - 48px);margin:0 auto;padding:clamp(72px,9vw,118px) 0 clamp(88px,11vw,144px);display:grid}.guide-copy h2{letter-spacing:-.04em;max-width:560px;margin:0;font-size:clamp(2.8rem,5.4vw,5.3rem);font-weight:750;line-height:.98}.guide-copy>p{max-width:540px;color:var(--muted);margin:26px 0 0;font-size:1rem;line-height:1.75}.guide-steps{max-width:540px;margin:34px 0 0;padding:0;list-style:none}.guide-steps li{border-bottom:1px solid var(--line);grid-template-columns:28px minmax(0,1fr);align-items:start;gap:16px;padding:17px 0;display:grid}.guide-steps li:first-child{border-top:1px solid var(--line)}.step-index{width:26px;height:26px;color:var(--accent-dark);background:var(--accent-soft);border-radius:50%;place-items:center;font-size:.72rem;font-weight:720;display:grid}.guide-steps strong,.guide-steps span{display:block}.guide-steps strong{font-size:.9rem;font-weight:680}.guide-steps div>span{color:var(--quiet);margin-top:5px;font-size:.78rem;line-height:1.55}.guide-links{flex-wrap:wrap;gap:9px;max-width:560px;margin-top:30px;display:flex}.guide-links a{min-height:38px;color:var(--control-ink);border:1px solid var(--line);background:#ffffffbd;border-radius:10px;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;font-size:.76rem;font-weight:650;text-decoration:none;transition:color .16s,border-color .16s,background .16s,transform .16s;display:inline-flex}.guide-links a:hover,.guide-links a:focus-visible{color:var(--accent-dark);background:var(--accent-soft);border-color:#675cf56b;outline:none;transform:translateY(-1px)}.guide-links a:focus-visible,.github-link:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.repository-address{width:100%}.quick-start{color:#f8fafc;background:#202939;border-radius:18px;align-self:center;min-width:0;overflow:hidden;box-shadow:0 28px 70px #1018282e}.quick-start-header{border-bottom:1px solid #ffffff1f;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.quick-start-header strong{font-size:.82rem;font-weight:680}.quick-start-header span{color:#abb6c8;font-size:.7rem}.quick-start pre{color:#d8dee9;scrollbar-color:#ffffff3d transparent;scrollbar-width:thin;margin:0;padding:26px 22px 30px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:clamp(.72rem,1.25vw,.82rem);line-height:1.8;overflow-x:auto}.code-command{color:#b7e4c7;margin-bottom:20px;display:block}.code-command:before{color:#778197;content:"$ ";-webkit-user-select:none;user-select:none}.code-keyword{color:#c4b5fd}.code-string{color:#b7e4c7}.code-number{color:#fdba74}@media (width<=880px){.app-shell{grid-template-columns:minmax(0,1fr);width:min(650px,100% - 32px);padding:64px 0 32px}h1{font-size:clamp(3.2rem,15vw,5.8rem)}.pet-card{min-height:540px}.developer-guide{grid-template-columns:minmax(0,1fr);width:min(650px,100% - 32px)}}@media (width<=520px){.intro-topline{flex-direction:column;align-items:flex-start}.eyebrow{padding-top:0}.intro-actions{justify-content:space-between;width:100%}h1{letter-spacing:-.06em;word-break:break-all;font-size:clamp(3rem,13.2vw,4.8rem)}.mapping-card{gap:10px;padding:15px}.mode-toggle{grid-template-columns:minmax(0,1fr) auto}.mode-toggle-status{display:none}.pet-card{border-radius:26px;min-height:470px}.pet-meta{flex-direction:column;align-items:flex-start;gap:8px}.pet-meta__actions{justify-content:space-between;width:100%}.page-floating-mode .pet-card{border-radius:0;min-height:0}.guide-copy h2{font-size:clamp(2.75rem,13vw,4.2rem)}.guide-links{flex-direction:column;align-items:stretch}.guide-links a{width:100%}.quick-start pre{padding:22px 18px 26px;font-size:.69rem}}@media (hover:none){.pet-resize-handle{opacity:.72}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}