@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600&family=Newsreader:ital,opsz,wght@1,6..72,400&display=swap";:root{font-family:Manrope,sans-serif;color:#fff5fa;background:#8c315f;color-scheme:dark}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}button,a{color:inherit;font:inherit}#scene{position:absolute;inset:0;width:100%;height:100%;display:block;outline:none;cursor:grab;touch-action:none}#scene:active{cursor:grabbing}.topbar{position:absolute;z-index:5;inset:0 0 auto;height:78px;padding:0 42px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,235,245,.24)}.brand{display:flex;align-items:center;gap:14px;color:#fff7fb;text-decoration:none;font:500 10px DM Mono,monospace;letter-spacing:.19em}.brand b{color:#ff91bd;font-weight:500}.brand-mark{position:relative;width:25px;height:25px;display:flex;align-items:flex-end;justify-content:center;gap:2px;border:1px solid rgba(255,197,220,.72);transform:rotate(45deg)}.brand-mark i{width:2px;height:8px;background:#ff9ac1;transform:rotate(-45deg)}.brand-mark i:nth-child(2){height:13px}.brand-mark i:nth-child(3){height:5px}.weather{display:flex;align-items:center;gap:12px;color:#e9c7d6;font:400 9px DM Mono,monospace;letter-spacing:.15em}.weather b{color:#fff5f9;font-weight:500}.sun-icon{color:#ffd0e1;font-size:17px;animation:turn 14s linear infinite}.hero{position:absolute;z-index:4;left:7vw;top:47%;width:410px;transform:translateY(-50%)}.eyebrow{display:flex;align-items:center;gap:11px;margin:0 0 19px;color:#ffc2da;font:500 9px DM Mono,monospace;letter-spacing:.22em}.eyebrow span{width:24px;height:1px;background:#ffc2da}h1{margin:0;color:#fff8fb;font-size:clamp(50px,5.1vw,78px);font-weight:500;line-height:.93;letter-spacing:-.058em;text-shadow:0 2px 28px rgba(82,14,52,.24)}h1 em{color:#ffacd0;font:400 italic 1.06em Newsreader,Georgia,serif;letter-spacing:-.03em}.lede{max-width:340px;margin:24px 0 28px;color:#f5dce7;font-size:12px;line-height:1.75}#feed{min-width:185px;padding:14px 16px;display:flex;justify-content:space-between;border:1px solid rgba(255,184,215,.82);background:#6f1b4861;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;color:#fff4f9;font:500 9px DM Mono,monospace;letter-spacing:.17em;transition:.25s}#feed span{color:#ffc4dc;font-size:14px;line-height:10px}#feed:hover{background:#cf377994;transform:translateY(-2px);box-shadow:0 10px 30px #4b0f2f38}.herd-card{position:absolute;z-index:4;top:108px;right:38px;width:240px;padding:18px;border:1px solid rgba(255,226,239,.25);background:#6919446b;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.card-heading{display:flex;justify-content:space-between;margin-bottom:12px;color:#edc5d8;font:500 8px DM Mono,monospace;letter-spacing:.2em}.card-heading i{width:5px;height:5px;border-radius:50%;background:#ff9bc4;box-shadow:0 0 10px #ff74ad}.horse-row{display:grid;grid-template-columns:28px 1fr auto;gap:9px;align-items:center;padding:10px 0;border-top:1px solid rgba(255,229,241,.14)}.horse-icon{color:#ff9fc8;font-size:20px;transform:scaleX(-1)}.horse-row div{display:flex;flex-direction:column;gap:3px}.horse-row b{font:500 8px DM Mono,monospace;letter-spacing:.1em}.horse-row small{color:#d6a9bf;font:400 6px DM Mono,monospace;letter-spacing:.09em}.horse-row em{color:#ffc7dd;font:500 7px DM Mono,monospace;font-style:normal;letter-spacing:.12em}.supply{padding-top:12px;display:grid;grid-template-columns:1fr auto;gap:8px;color:#dfb5c9;font:400 7px DM Mono,monospace;letter-spacing:.12em}.supply b{color:#fff0f7;font-weight:500}.supply div{grid-column:1/-1;height:2px;background:#ffffff2b}.supply i{display:block;width:82%;height:100%;background:#ff7db4;box-shadow:0 0 8px #ff579d80;transition:width .7s}.caption{position:absolute;z-index:4;left:42px;bottom:31px;display:flex;align-items:center;gap:14px}.caption>span{color:#ffabd0;font:500 9px DM Mono,monospace}.caption>i{width:38px;height:1px;background:#ffdaea8c}.caption p{margin:0;display:flex;flex-direction:column;gap:4px}.caption b{font:500 8px DM Mono,monospace;letter-spacing:.16em}.caption small{color:#d8afc2;font:400 7px DM Mono,monospace;letter-spacing:.1em}.hint{position:absolute;z-index:4;left:50%;bottom:34px;transform:translate(-50%);color:#d4adbf;font:400 7px DM Mono,monospace;letter-spacing:.16em}.hint span{color:#ffe0ed}.sound{position:absolute;z-index:6;right:38px;bottom:27px;height:31px;display:flex;align-items:center;gap:3px;border:0;background:transparent;cursor:pointer;color:#e4bdcf;font:400 7px DM Mono,monospace;letter-spacing:.16em}.sound i{width:2px;height:10px;background:#ff9bc5;animation:meter 1.1s ease-in-out infinite alternate}.sound i:nth-child(2){height:16px;animation-delay:-.5s}.sound i:nth-child(3){height:7px;animation-delay:-.8s}.sound i:nth-child(4){height:12px;animation-delay:-.25s}.sound span{margin-left:7px}.sound.paused i{animation-play-state:paused;height:3px}.grain{position:absolute;z-index:2;inset:-50%;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");animation:grain .3s steps(2) infinite}.vignette{position:absolute;z-index:3;inset:0;pointer-events:none;box-shadow:inset 0 0 180px #450d2b7a;background:linear-gradient(90deg,rgba(79,15,50,.3),transparent 50%,rgba(88,18,57,.05))}@keyframes meter{to{transform:scaleY(.35);opacity:.5}}@keyframes turn{to{transform:rotate(360deg)}}@keyframes grain{0%{transform:translate(2%,1%)}25%{transform:translate(-2%,3%)}50%{transform:translate(1%,-2%)}75%{transform:translate(3%,2%)}to{transform:translate(-1%,-3%)}}@media(max-width:760px){.topbar{height:66px;padding:0 20px}.weather{display:none}.hero{left:24px;top:39%;width:calc(100% - 48px)}.hero h1{font-size:49px}.lede{max-width:270px;font-size:11px}.herd-card{top:82px;right:15px;width:185px;padding:12px;transform:scale(.84);transform-origin:top right}.horse-row{padding:7px 0}.caption{left:21px;bottom:22px}.hint{display:none}.sound{right:16px;bottom:16px}.sound span{display:none}}@media(max-height:650px){.hero{top:48%;transform:translateY(-43%)}.hero .lede{margin:15px 0 18px}.herd-card{transform:scale(.82);transform-origin:top right}}
