:root{--bb-ink:#102235;--bb-sky:#bfe7ff;--bb-ice:#eaf8ff;--bb-cream:#fff7df;--bb-cyan:#35d7ff;--bb-orange:#ff9a3c;--bb-blue:#5c9cf5}
.barkbyte-page{margin:0;background:var(--bb-sky);color:var(--bb-ink);font-family:var(--body);overflow-x:hidden}.barkbyte-page *{box-sizing:border-box}.bb-world{height:100svh;min-height:690px;position:relative;overflow:hidden;isolation:isolate}.bb-world__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;transform:scale(1.015) translate3d(calc(var(--px,0)*-8px),calc(var(--py,0)*-5px),0);transition:transform .18s linear}.bb-world__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,28,50,.05),transparent 34%,rgba(9,28,50,.07));pointer-events:none}.bb-home{position:absolute;z-index:6;left:28px;top:24px;display:flex;align-items:center;gap:10px;padding:7px 12px 7px 8px;background:rgba(255,247,223,.92);border:2px solid rgba(16,34,53,.78);border-radius:999px;box-shadow:4px 5px 0 rgba(16,34,53,.18);font:700 10px var(--mono);letter-spacing:.08em}.bb-home img{width:34px;height:34px;object-fit:cover;border-radius:50%;background:#d7f3ff}.bb-signs{position:absolute;z-index:7;top:24px;left:50%;transform:translateX(-50%);display:flex;gap:14px;align-items:flex-start}.bb-sign{min-width:142px;padding:12px 17px;border:2px solid var(--bb-ink);border-radius:13px;background:rgba(255,247,223,.94);box-shadow:5px 6px 0 rgba(16,34,53,.23);font:700 12px var(--body);text-align:center;transition:transform .2s ease}.bb-sign small{display:block;font:8px var(--mono);letter-spacing:.12em;opacity:.65;margin-bottom:2px}.bb-sign:nth-child(1){transform:rotate(-2deg)}.bb-sign:nth-child(2){background:#dcf7ff;transform:rotate(1deg)}.bb-sign:nth-child(3){background:#ffe5bc;transform:rotate(-1deg)}.bb-sign:hover{transform:translateY(-4px) rotate(0)}.bb-welcome{position:absolute;z-index:5;right:8vw;top:50%;transform:translateY(-44%);width:min(570px,42vw);text-align:center;color:#17324b}.bb-welcome>p:first-child{font:500 11px var(--mono);letter-spacing:.24em;margin:0 0 18px}.bb-welcome h1{font:800 clamp(72px,8.2vw,136px)/.82 var(--display);letter-spacing:-.085em;margin:0;text-shadow:0 5px 0 rgba(255,255,255,.55)}.bb-welcome h2{font:700 clamp(26px,2.6vw,42px)/1 var(--display);letter-spacing:-.045em;margin:20px 0 8px}.bb-welcome__copy{max-width:390px;margin:0 auto;color:#31536b;font-size:15px}.bb-welcome__actions{margin-top:25px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.bb-welcome__actions a{padding:12px 16px;background:rgba(255,247,223,.92);border:2px solid var(--bb-ink);border-radius:12px;box-shadow:4px 5px 0 rgba(16,34,53,.2);font:700 10px var(--mono);letter-spacing:.05em}.bb-welcome__actions a:first-child{background:#ffd57b}.bb-welcome__actions span{margin-left:7px}.bb-population{position:absolute;z-index:5;right:28px;top:105px;font:10px var(--mono);line-height:1.45;transform:rotate(3deg);text-align:right}.bb-population span{display:block;font-size:30px;line-height:1;margin-top:7px}.bb-scroll{position:absolute;z-index:5;right:38px;bottom:25px;font:9px var(--mono);letter-spacing:.12em}.bb-scroll span{font-size:18px;margin-left:7px}.bb-trail{height:88vh;min-height:660px;position:relative;overflow:hidden;background:#dff4ff;border-top:4px solid rgba(16,34,53,.9);border-bottom:4px solid rgba(16,34,53,.9)}.bb-trail__world{position:absolute;inset:auto 0 0;width:115%;height:100%;object-fit:cover;object-position:center center;transform:translateX(calc(var(--trail-progress,0)*-6%));filter:saturate(.95)}.bb-trail:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(231,249,255,.92) 0%,rgba(231,249,255,.3) 36%,transparent 65%);pointer-events:none}.bb-trail__copy{position:absolute;z-index:4;left:6vw;top:12vh;width:min(390px,35vw)}.bb-trail__copy span{font:9px var(--mono);letter-spacing:.12em}.bb-trail__copy h2{font:800 clamp(48px,6vw,90px)/.9 var(--display);letter-spacing:-.075em;margin:12px 0 18px}.bb-trail__copy p{max-width:330px;color:#34566d}.bb-trail__runner{position:absolute;z-index:5;width:min(31vw,430px);left:calc(32% + var(--trail-progress,0)*26%);bottom:3vh;filter:drop-shadow(0 18px 16px rgba(20,62,89,.15));transform:translateY(calc(sin(var(--trail-progress,0))*1px))}.bb-trail__signal{position:absolute;z-index:4;width:min(14vw,180px);right:12%;top:37%;animation:bbBeacon 2.2s ease-in-out infinite}.bb-trail__meter{position:absolute;z-index:5;left:6vw;right:6vw;bottom:22px;display:flex;justify-content:space-between;padding-top:10px;border-top:1px dashed rgba(16,34,53,.5);font:9px var(--mono);letter-spacing:.08em}.bb-sniff{min-height:88vh;padding:95px 7vw;background:var(--bb-cream);display:grid;grid-template-columns:1.1fr .9fr;gap:6vw;align-items:center}.bb-sniff__art{min-height:590px;position:relative;display:grid;place-items:center}.bb-sniff__art>img:first-of-type{position:relative;z-index:2;width:min(88%,620px);filter:drop-shadow(0 25px 24px rgba(16,34,53,.13))}.bb-sniff__halo{position:absolute;width:68%;aspect-ratio:1;border-radius:50%;background:#bfeeff;box-shadow:0 0 0 28px rgba(191,238,255,.4),0 0 0 55px rgba(191,238,255,.2)}.bb-sniff__beacon{position:absolute!important;z-index:3!important;width:160px!important;right:4%;bottom:14%;animation:bbBeacon 2.2s ease-in-out infinite}.bb-cloud-card{position:relative;padding:55px 50px;background:#fff;border:2px solid var(--bb-ink);border-radius:44% 56% 48% 52%/54% 43% 57% 46%;box-shadow:12px 16px 0 rgba(16,34,53,.12)}.bb-cloud-card>span{font:9px var(--mono);letter-spacing:.12em}.bb-cloud-card h2{font:800 clamp(44px,5vw,78px)/.9 var(--display);letter-spacing:-.065em;margin:15px 0 20px}.bb-cloud-card p{max-width:410px;font-size:17px}.bb-bone{position:absolute;width:150px;right:-45px;bottom:-55px;transform:rotate(16deg);filter:drop-shadow(0 15px 14px rgba(16,34,53,.12))}.bb-token-world{min-height:100svh;position:relative;overflow:hidden;background:linear-gradient(#75c8ff,#d8f4ff 58%,#fff0bd 58%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:100px 24px;text-align:center;border-top:4px solid var(--bb-ink)}.bb-token-world__sun{position:absolute;width:330px;height:330px;border-radius:50%;background:#ffd679;top:8%;right:8%;box-shadow:0 0 0 22px rgba(255,214,121,.25)}.bb-token-world__eyebrow{position:relative;z-index:2;font:10px var(--mono);letter-spacing:.16em}.bb-token-world h2{position:relative;z-index:2;font:800 clamp(86px,14vw,220px)/.7 var(--display);letter-spacing:-.11em;margin:13px 0 12px;color:#17324b}.bb-token-world__coin{position:relative;z-index:3;width:min(46vw,520px);filter:drop-shadow(0 28px 22px rgba(16,34,53,.18));animation:bbFloat 5s ease-in-out infinite}.bb-token-world__orbit{position:absolute;z-index:4;padding:10px 14px;border:2px solid var(--bb-ink);background:var(--bb-cream);border-radius:999px;font:700 9px var(--mono);box-shadow:4px 5px 0 rgba(16,34,53,.16)}.bb-token-world__orbit--one{left:12%;top:31%;transform:rotate(-9deg)}.bb-token-world__orbit--two{right:12%;top:42%;transform:rotate(8deg)}.bb-token-world__orbit--three{left:16%;bottom:24%;transform:rotate(5deg)}.bb-contract{position:relative;z-index:4;width:min(720px,90vw);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-top:24px;padding:12px 14px;background:rgba(255,247,223,.94);border:2px solid var(--bb-ink);border-radius:12px;font:9px var(--mono);box-shadow:5px 6px 0 rgba(16,34,53,.15)}.bb-contract code{overflow:hidden;text-overflow:ellipsis}.bb-contract button{border:0;background:var(--bb-ink);color:white;padding:8px 11px;border-radius:7px;font:9px var(--mono);cursor:pointer}.bb-token-links{position:relative;z-index:4;display:flex;gap:10px;margin-top:18px}.bb-token-links a{padding:10px 13px;border:2px solid var(--bb-ink);background:#fff;border-radius:10px;font:700 9px var(--mono)}.bb-pack{height:86vh;min-height:650px;position:relative;overflow:hidden;background:#102235;display:grid;place-items:center}.bb-pack__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.bb-pack__veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,30,48,.08),rgba(10,30,48,.08) 44%,rgba(10,30,48,.66))}.bb-pack__card{position:absolute;z-index:3;right:7vw;width:min(430px,38vw);padding:34px;background:rgba(255,247,223,.92);border:2px solid var(--bb-ink);border-radius:22px;box-shadow:9px 11px 0 rgba(16,34,53,.28);transform:rotate(1deg)}.bb-pack__card>span{font:9px var(--mono);letter-spacing:.12em}.bb-pack__card h2{font:800 clamp(52px,6vw,88px)/.82 var(--display);letter-spacing:-.08em;margin:13px 0 25px}.bb-pack__card>a{display:inline-block;padding:11px 14px;border:2px solid var(--bb-ink);border-radius:10px;background:#ffd679;font:700 9px var(--mono)}.bb-pack__card small{display:block;margin-top:22px;font:8px var(--mono);line-height:1.5;color:#486378}@keyframes bbBeacon{50%{transform:translateY(-12px) scale(1.04)}}@keyframes bbFloat{50%{transform:translateY(-18px) rotate(5deg)}}@media(max-width:850px){.bb-world{min-height:760px}.bb-world__image{object-position:41% center}.bb-signs{top:auto;bottom:20px;width:100%;padding:0 16px;justify-content:center;gap:8px}.bb-sign{min-width:0;flex:1;max-width:132px;padding:10px 7px;font-size:10px}.bb-home{left:14px;top:14px}.bb-population,.bb-scroll{display:none}.bb-welcome{top:auto;right:16px;left:16px;bottom:95px;transform:none;width:auto;padding:22px 16px;background:rgba(239,250,255,.84);border-radius:18px;backdrop-filter:blur(8px)}.bb-welcome h1{font-size:18vw}.bb-welcome h2{font-size:7vw}.bb-welcome__copy{font-size:13px}.bb-trail{min-height:720px}.bb-trail__world{width:160%;object-position:center bottom}.bb-trail__copy{left:20px;top:55px;width:76vw}.bb-trail__runner{width:62vw;left:calc(8% + var(--trail-progress,0)*22%);bottom:10%}.bb-trail__signal{width:30vw;right:4%;top:48%}.bb-trail__meter{left:20px;right:20px;font-size:7px}.bb-sniff{grid-template-columns:1fr;padding:70px 20px 100px}.bb-sniff__art{min-height:430px}.bb-cloud-card{padding:42px 28px;border-radius:28px}.bb-bone{width:115px;right:5px;bottom:-70px}.bb-token-world__orbit{display:none}.bb-token-world__coin{width:min(84vw,500px)}.bb-contract{grid-template-columns:auto 1fr auto;font-size:7px}.bb-pack{height:760px}.bb-pack__image{object-position:43% center}.bb-pack__veil{background:linear-gradient(180deg,transparent 25%,rgba(10,30,48,.75))}.bb-pack__card{left:18px;right:18px;bottom:24px;width:auto;padding:28px}.bb-pack__card h2{font-size:15vw}}