.hoof-app{--hoof-ink:#302729;--hoof-yellow:#f1d65a;background:#fbfaf6;color:var(--hoof-ink);min-height:100vh;padding-bottom:60px}.hoof-topbar{display:flex;justify-content:space-between;align-items:center;padding:18px 36px;border-bottom:1px solid #dcd9cf;font-size:14px}.hoof-topbar>a{text-decoration:none}.hoof-topbar>span{font:12px/1.5 'Courier New',monospace;letter-spacing:.045em;color:#6e6662}.hoof-heading{text-align:center;margin:25px auto 32px}.hoof-wordmark{font:italic 800 74px/.9 Georgia,serif;letter-spacing:-.075em;text-decoration:none;color:var(--hoof-ink)}.hoof-wordmark>span{color:#b67717}.hoof-heading>p{font-size:14px;margin-top:12px;color:#625956}.hoof-workspace{max-width:1060px;margin:auto;padding:0 32px;display:grid;grid-template-columns:1fr 440px;gap:100px;align-items:center}.hoof-kicker{font:12px/1.5 'Courier New',monospace;letter-spacing:.1em;color:#79674b}.hoof-intro h1{font-size:65px;line-height:.98;letter-spacing:-.06em;margin:24px 0}.hoof-intro h1>em{font:italic 1em Georgia,serif;letter-spacing:-.065em}.hoof-intro>p{font-size:19px;line-height:1.65;color:#645954}.hoof-rule{height:4px;width:65px;background:var(--hoof-yellow);margin:30px 0}.hoof-intro>.hoof-demo-note{font-size:14px;line-height:1.65;max-width:310px}.hoof-related{font-size:13px;color:#665952;display:inline-block;margin-top:24px;text-underline-offset:4px}.hoof-deck{min-width:0}.hoof-deck-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.hoof-deck-heading h2{font-size:18px;letter-spacing:-.02em;font-weight:600}.hoof-deck-heading>span{font:12px 'Courier New',monospace;color:#77675d}.hoof-card{background:white;border:1px solid #ddd6c9;border-radius:20px;overflow:hidden;box-shadow:0 15px 50px #38281612;touch-action:pan-y;transition:transform .15s;user-select:none}.hoof-photo{height:440px;position:relative;background:#d5dcca;overflow:hidden}.hoof-photo>img{width:100%;height:100%;object-fit:cover;object-position:center top;pointer-events:none}.hoof-personality{position:absolute;left:18px;top:18px;font-size:12px;color:#3e342c;background:#ffffffeb;padding:7px 12px;border-radius:30px}.hoof-photo-caption{position:absolute;inset:auto 0 0;padding:70px 24px 23px;background:linear-gradient(transparent,#1d271beb);color:white}.hoof-photo-caption h3{font-size:36px;letter-spacing:-.045em;font-weight:600}.hoof-photo-caption h3>span{font-size:28px;font-weight:400}.hoof-photo-caption>p{font-size:14px;color:#ebf0e5;margin-top:6px}.hoof-bio{padding:20px 24px 24px}.hoof-bio>p{font-size:16px;line-height:1.55;color:#5a5048}.hoof-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:17px}.hoof-tags>span{font-size:12px;border:1px solid #e8dfcf;padding:5px 9px;border-radius:20px;color:#7c694d}.hoof-actions{display:flex;justify-content:center;gap:24px;margin-top:20px}.hoof-actions>button{width:65px;height:65px;border-radius:50%;border:1px solid #d9d0c0;display:grid;place-items:center;box-shadow:0 5px 15px #3027290c;transition:transform .2s,background .2s}.hoof-actions>button:hover{transform:translateY(-3px)}.hoof-pass{background:white;color:#816b5f;font-size:39px}.hoof-like{background:var(--hoof-yellow);color:#4a3726;font-size:29px;border-color:#dfc040!important}.hoof-hint{text-align:center;font-size:12px;color:#73685f;margin-top:15px}.hoof-announcement{min-height:20px;text-align:center;font-size:13px;color:#76614e;margin-top:6px}.hoof-match{padding:0;border:1px solid #d6cdbd;border-radius:24px;max-width:min(420px,calc(100vw - 32px));max-height:90svh;background:#fff9e6;color:#392b28;box-shadow:0 30px 120px #20151055}.hoof-match::backdrop{background:#1b241acd;backdrop-filter:blur(6px)}.hoof-match-content{text-align:center;padding:36px 32px}.hoof-match h2{font-size:54px;line-height:.95;margin:18px 0 24px;letter-spacing:-.055em}.hoof-match h2>em{font-family:Georgia,serif;font-weight:400}.hoof-match img{height:150px;width:150px;border-radius:50%;object-fit:cover;object-position:50% 35%;margin:0 auto 24px;border:5px solid var(--hoof-yellow)}.hoof-match p{font-size:16px;color:#69544a}.hoof-next{display:inline-block;padding:14px 20px;border:1px solid #e1c549;border-radius:8px;background:var(--hoof-yellow);color:#3b302a;font-size:14px;font-weight:600;margin-top:24px}.hoof-match .hoof-match-small,.hoof-match-small{font-size:12px;line-height:1.6;margin-top:18px;color:#77695d}.hoof-finished{min-height:495px;background:#fff4c9;border:1px solid #e5d68e;border-radius:20px;padding:55px 28px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}.hoof-finished h2{font-size:34px;line-height:1.1;letter-spacing:-.04em;margin:25px 0 15px}.hoof-finished>p{color:#7a6752}.hoof-liked{display:flex;justify-content:center;gap:18px;margin-top:25px}.hoof-liked figure{margin:0}.hoof-liked img{width:65px;height:65px;border-radius:50%;object-fit:cover}.hoof-liked figcaption{font-size:12px;margin-top:8px}.hoof-app a:hover{color:#93700c}.hoof-app button:focus-visible,.hoof-app a:focus-visible,.hoof-card:focus-visible{outline:3px solid #5c77bd;outline-offset:5px}body:has(.hoof-app)>.site-header,body:has(.hoof-app)>.site-footer{display:none}@media(max-width:900px){.hoof-workspace{gap:40px;grid-template-columns:1fr 400px}.hoof-intro h1{font-size:50px}.hoof-intro>p{font-size:17px}}@media(max-width:700px){.hoof-app{padding-bottom:30px}.hoof-topbar{padding:15px 20px}.hoof-topbar>span{font-size:12px;max-width:150px;text-align:right}.hoof-heading{margin:22px auto}.hoof-wordmark{font-size:58px}.hoof-workspace{display:flex;flex-direction:column;gap:22px;padding:0 20px}.hoof-deck{width:100%;max-width:420px;order:0}.hoof-intro{order:1;text-align:center;max-width:360px;margin-top:15px}.hoof-intro>.hoof-kicker,.hoof-intro h1,.hoof-intro>p:not(.hoof-demo-note),.hoof-rule{display:none}.hoof-intro>.hoof-demo-note{font-size:12px;max-width:none}.hoof-related{margin-top:12px}.hoof-photo{height:clamp(350px,52svh,450px)}.hoof-bio{padding:16px 20px}.hoof-bio>p{font-size:15px}.hoof-tags{margin-top:12px}.hoof-actions>button{height:58px;width:58px}.hoof-actions{margin-top:16px}.hoof-hint{max-width:270px;margin-inline:auto}.hoof-match-content{padding:28px 22px}.hoof-match h2{font-size:48px}}
