:root{--paper:#fbf3e2;--panel:#f7e8c6;--ink:#4a331d;--soft:#745a3b;--edge:#c4a876;--flame:#e2504c;--deep:#a93430;--moss:#487333;--pixel:'Press Start 2P',monospace;--data:'VT323',monospace;--body:'Karla',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:18px;line-height:1.65}a{color:inherit}img{max-width:100%;object-fit:contain}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--moss);outline-offset:6px}.skip{position:absolute;top:-80px;left:15px;z-index:20;background:var(--paper);padding:12px}.skip:focus{top:12px}.site-header{max-width:1280px;margin:auto;padding:26px 44px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-family:var(--pixel);font-size:15px;letter-spacing:-.5px;text-decoration:none;display:flex;gap:12px;align-items:center}.brand img{image-rendering:pixelated;border-radius:8px}nav{display:flex;align-items:center;gap:28px;font-size:15px;font-weight:700}nav>a:not(.button){text-decoration:none}nav>a:hover,.text-link:hover{color:var(--deep)}.button{display:inline-flex;align-items:center;justify-content:center;gap:25px;background:var(--flame);color:white;border:2px solid var(--deep);box-shadow:0 5px 0 var(--deep);text-decoration:none;font-weight:800;font-size:18px;padding:14px 25px;transition:transform .12s,box-shadow .12s}.button:hover{background:#d6423e;transform:translateY(-2px);box-shadow:0 7px 0 var(--deep)}.button:active{transform:translateY(4px);box-shadow:0 1px 0 var(--deep)}.button.small{font-size:15px;padding:9px 16px;gap:14px}.hero{max-width:1280px;margin:auto;padding:60px 44px 85px;display:grid;grid-template-columns:1.08fr 1fr;gap:55px;align-items:center}.eyebrow{font-family:var(--data);font-size:21px;letter-spacing:2px;text-transform:uppercase;color:var(--moss);margin:0 0 22px;display:flex;align-items:center;gap:10px}.status-dot{width:8px;height:8px;display:inline-block;background:var(--moss);box-shadow:3px 3px 0 #cdd1a0}h1{font-family:var(--pixel);font-size:clamp(28px,3.2vw,44px);line-height:1.65;letter-spacing:-1.5px;margin:0 0 25px}h1 em{font-style:normal;color:var(--deep)}.lede{font-weight:700;font-size:22px;line-height:1.5;margin:0 0 18px}.intro{max-width:470px;color:var(--soft);margin:0 0 30px}.actions{display:flex;gap:27px;align-items:center}.text-link{font-weight:700;text-underline-offset:6px;font-size:16px}.platform-note{font-size:14px;color:var(--soft);margin:16px 0 0}.hero-art{transform:rotate(2deg);position:relative}.scene{position:relative;aspect-ratio:1/1.12;background:#d7e39c url('assets/grass.webp') center bottom/auto 100%;border:4px solid var(--ink);box-shadow:12px 12px 0 #e5d4ac;overflow:hidden}.scene-label{position:absolute;top:24px;left:24px;z-index:2;font-family:var(--data);font-size:20px;letter-spacing:1px;background:var(--paper);padding:6px 12px;border:2px solid var(--ink)}.scene-sun{position:absolute;width:80px;height:80px;background:#f5d779;right:28px;top:95px;box-shadow:8px 0 #e8c75b,-8px 0 #e8c75b,0 8px #e8c75b,0 -8px #e8c75b}.scene-tower{image-rendering:pixelated;position:absolute;width:96px;right:35px;top:43%}.scene-path{position:absolute;width:130%;height:62px;left:-12%;bottom:22%;background:#e5cc8d;border-block:8px solid #b49f65;transform:rotate(-16deg)}.hero-dog{position:absolute;width:72%;height:72%;left:3%;bottom:4%;image-rendering:pixelated;filter:drop-shadow(8px 10px 0 #4a331d20)}.scene-caption{position:absolute;bottom:20px;left:18px;right:18px;padding:10px 8px;background:var(--paper);border:2px solid var(--ink);font-size:15px;text-align:center;font-weight:700}.scene-caption span{color:var(--deep)}.art-note{display:block;text-align:right;margin-top:22px;font-family:var(--data);letter-spacing:2px;font-size:16px}.ribbon{border-block:2px solid var(--edge);background:var(--panel);display:flex;justify-content:center;gap:45px;padding:18px 20px;font-family:var(--data);font-size:23px;letter-spacing:2px}.ribbon b{color:var(--deep)}.section{max-width:1192px;margin:auto;padding:90px 0}.section-heading{max-width:650px;margin:0 auto 65px;text-align:center}.section-heading .eyebrow{justify-content:center}h2{font-family:var(--pixel);font-size:clamp(22px,2.6vw,32px);line-height:1.7;letter-spacing:-1px;margin:0 0 20px}h3{font-size:34px;line-height:1.2;letter-spacing:-1px;margin:14px 0 24px}.section-heading p:last-child{color:var(--soft);font-size:20px}.story-row{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:center;margin-bottom:85px}.story-row.reverse .story-copy{grid-column:1;grid-row:1}.story-row.reverse .battle-art{grid-column:2;grid-row:1}.story-copy p{color:var(--soft)}.chapter{font-family:var(--data);color:var(--moss);font-size:20px;letter-spacing:1.5px}.detail{display:inline-block;margin-top:10px;padding-top:14px;border-top:2px dashed var(--edge);font-size:16px;font-weight:700}.territory-art{height:340px;position:relative;background-color:#e7e4c8;background-image:linear-gradient(#b7bf9c60 1px,transparent 1px),linear-gradient(90deg,#b7bf9c60 1px,transparent 1px);background-size:40px 40px;border:3px solid var(--ink);overflow:hidden;box-shadow:8px 8px 0 #e5d4ac}.map-street{position:absolute;background:#fbf3e2;border:2px solid #d3c5a6}.map-street.horizontal{left:0;right:0;top:40%;height:37px;transform:rotate(-14deg)}.map-street.vertical{top:0;bottom:0;left:48%;width:37px;transform:rotate(-14deg)}.territory-art svg{position:absolute;inset:0;width:100%;height:100%}.claims{position:absolute;left:48px;top:50px;display:grid;grid-template-columns:repeat(4,40px);gap:4px}.claims i{height:40px;background:#88ae63aa;border:2px solid #648946}.territory-art>img{position:absolute;right:17%;top:13%;image-rendering:pixelated}.illustration-tag{position:absolute;bottom:14px;left:14px;right:14px;text-align:center;background:var(--paper);padding:7px 8px;font-family:var(--data);font-size:18px;letter-spacing:1px;border:2px solid var(--ink)}.battle-art{aspect-ratio:1.45;position:relative;border:3px solid var(--ink);box-shadow:8px 8px 0 #e5d4ac;overflow:hidden;background:#bddca1}.battle-bg{width:100%;height:100%;object-fit:cover}.battle-dog,.battle-monster{position:absolute;bottom:15%;image-rendering:pixelated}.battle-dog{width:38%;height:52%;left:8%;transform:scaleX(-1)}.battle-monster{width:27%;height:42%;right:12%}.pack-callout{display:flex;gap:35px;align-items:center;padding:32px 40px;background:var(--panel);border-block:2px solid var(--edge)}.pack-dogs{flex:0 0 330px;display:flex;align-items:end}.pack-dogs img{width:120px;image-rendering:pixelated;margin-left:-15px}.pack-callout h3{font-size:28px;margin:10px 0}.pack-callout p{margin:0;color:var(--soft)}.companion{border-top:2px dashed var(--edge);display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.companion-copy>p:not(.eyebrow){color:var(--soft)}.breed-picker{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}.breed-picker button{font:700 15px var(--body);background:var(--paper);color:var(--ink);border:2px solid var(--edge);padding:10px 14px;cursor:pointer}.breed-picker button:hover{border-color:var(--moss)}.breed-picker button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}.breed-note{font-size:14px}.dog-preview{margin:0;text-align:center;background:url('assets/grass.webp') center/cover;border:3px solid var(--ink);box-shadow:8px 8px 0 #e5d4ac;padding:20px 25px}.dog-preview>img{width:300px;height:300px;image-rendering:pixelated}.dog-preview figcaption{background:var(--paper);border:2px solid var(--ink);padding:12px}.dog-preview figcaption span{display:block}#breed-name{font-weight:800;font-size:24px}.dog-preview figcaption span:last-child{font-family:var(--data);font-size:17px;letter-spacing:1px}.beta{max-width:none;text-align:center;background:var(--panel);border-block:2px solid var(--edge);padding-inline:24px}.beta .eyebrow{justify-content:center}.beta>p:not(.eyebrow):not(.platform-note){max-width:570px;margin:0 auto 30px;color:var(--soft)}.beta-steps{display:flex;justify-content:center;gap:50px;list-style:none;padding:0;margin:45px 0 0;font-size:16px}.beta-steps span{font-family:var(--data);font-size:23px;color:var(--moss);margin-right:8px}.faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}.questions details{border-bottom:1px solid var(--edge);padding:20px 0}.questions details:first-child{padding-top:0}summary{cursor:pointer;font-weight:800;font-size:20px}details p{color:var(--soft);margin:15px 0 5px}footer{max-width:1280px;margin:auto;border-top:2px solid var(--edge);padding:30px 44px;display:flex;align-items:center;gap:30px;font-size:13px;color:var(--soft)}footer .brand{font-size:12px;color:var(--ink)}footer>a:not(.brand){margin-left:auto}
@media(min-width:1400px){.hero{padding-top:85px;padding-bottom:110px}}
@media(max-width:1250px){.section{margin-inline:44px}.beta{margin-inline:0}.story-row{gap:45px}.companion{gap:55px}.ribbon{gap:26px}.pack-dogs{flex-basis:270px}.pack-dogs img{width:100px}}
@media(max-width:800px){.site-header{padding:20px 24px}.brand{font-size:12px}nav{gap:15px}nav>a:not(.button){display:none}.hero{padding:40px 24px 60px;gap:40px;grid-template-columns:1fr}.hero-copy{max-width:580px}h1{font-size:clamp(27px,6vw,42px)}.hero-art{max-width:500px;width:90%;margin:auto}.scene{aspect-ratio:1.12}.scene-label{font-size:18px}.ribbon{gap:16px;flex-wrap:wrap;font-size:18px;letter-spacing:1px}.ribbon b{display:none}.section{padding-block:60px;margin-inline:24px}.section-heading{margin-bottom:40px}.story-row{grid-template-columns:1fr;gap:35px;margin-bottom:55px}.story-copy{max-width:600px}.story-row.reverse .story-copy,.story-row.reverse .battle-art{grid-column:auto;grid-row:auto}.story-row.reverse .battle-art{grid-row:1}.territory-art,.battle-art{max-width:600px;width:100%;margin:auto}.pack-callout{flex-direction:column;gap:15px;padding:25px;text-align:center}.pack-dogs{flex-basis:auto}.companion{grid-template-columns:1fr;gap:30px}.dog-preview{max-width:480px;width:100%;margin:auto}.beta{margin-inline:0}.beta-steps{flex-direction:column;gap:12px;margin-top:30px}.faq{grid-template-columns:1fr;gap:15px}footer{flex-wrap:wrap;gap:15px;padding:25px 24px}footer .brand{width:100%}footer>a:not(.brand){margin-left:0}.lede{font-size:21px}}
@media(max-width:380px){.site-header{padding-inline:16px}.brand{font-size:10px;gap:8px}.brand img{width:30px;height:30px}.button.small{font-size:13px;padding:8px;gap:6px}.hero{padding-inline:20px}h1{font-size:25px}.actions{gap:18px}.button{padding:12px 16px;font-size:16px;gap:12px}.text-link{font-size:14px}.scene-label{top:15px;left:12px;font-size:15px}.scene-caption{font-size:12px}.scene-tower{width:70px}.section{margin-inline:20px}.beta{margin-inline:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}
