/* PIKO — native grid artwork and UI. No screenshot or video backgrounds. */
:root{--display:'Pixelify Sans',monospace;--mono:'Silkscreen',monospace;--pixel-cut:polygon(0 12px,12px 12px,12px 0,calc(100% - 12px) 0,calc(100% - 12px) 12px,100% 12px,100% calc(100% - 12px),calc(100% - 12px) calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,12px calc(100% - 12px),0 calc(100% - 12px));font-family:var(--display)}
body{-webkit-font-smoothing:auto;background:#082c33;font-size:17px}
h1,h2,h3{font-weight:600!important;letter-spacing:-.025em!important}
a,button,input,textarea,select{font-family:var(--display)}
img,.noko-mascot{image-rendering:pixelated}
.site-header{border-bottom:2px solid #38616a;background:#082c33;backdrop-filter:none}
.wordmark{font-size:38px;letter-spacing:-1px;font-weight:700}.wordmark-dot{font-size:10px;margin:8px 0 0 4px}
#brand-mascot{width:43px;height:45px}
.docs-link{font-size:17px;font-weight:500}
.network-badge{border-radius:0;border-width:2px;font-size:9px;padding:7px 10px;box-shadow:3px 3px 0 #021d24}
.network-badge i,.live-indicator{border-radius:0;width:6px;height:6px}
.morph-button,.morph-button.small{border-radius:0;border-width:2px;box-shadow:4px 4px 0 #5b8b92;background:#e7f4f3;transition:transform .16s steps(2),box-shadow .16s steps(2);font-weight:600;font-size:18px}
.morph-button.dark{background:#d9f77c;box-shadow:4px 4px 0 #6e8b37}
.morph-button.small{font-size:16px;padding-right:62px}
.morph-button:hover,.morph-button.dark:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 #031e24}
.morph-button:active{transform:translate(3px,3px);box-shadow:1px 1px 0 #031e24}
.button-pet{transform:none;right:0;bottom:-23px;transition:transform .2s steps(3)}
.morph-button:hover .button-pet{transform:translateY(-8px)}
.market-ribbon{border-bottom-width:2px;background:#06252d}
.ticker-track>a{font-size:10px;border-right:2px solid #28545a}
.ticker-track>a>b{font-size:16px;font-weight:600}.ticker-track .change{font-size:9px}
.ticker-track img,.coin-image{border-radius:0}
.story-pin{border-radius:0;clip-path:var(--pixel-cut);background:#0e3b44;border:2px solid #456d73;box-shadow:none}
.hero-copy{top:7%;left:45%;width:52%}
.hero-copy h1{font-size:clamp(58px,6vw,100px);line-height:.97;font-weight:600;letter-spacing:-.025em;margin:22px 0}
.hero-copy>p:not(.eyebrow){font:18px/1.4 var(--display);max-width:420px;color:#b6d4d5}
.hero-copy .eyebrow{font-size:9px;letter-spacing:0;max-width:420px;line-height:1.5}
.hero-actions .morph-button{font-size:17px;padding-left:17px;padding-right:55px;min-height:52px}
.hero-pet{bottom:-6%;left:-10%;width:62%}
.hero-pet .noko-mascot{--mascot-ink:#d9f77c;--mascot-cream:#082c33;filter:drop-shadow(10px 10px 0 #031e24)}
.hero-orbit{border-radius:0;background-color:#144951;background-image:linear-gradient(90deg,#b9e3dc0c 2px,transparent 2px),linear-gradient(#b9e3dc0c 2px,transparent 2px);background-size:32px 32px;left:-5%;bottom:-12%;width:45%;aspect-ratio:1/1.25;border:2px solid #558085;box-shadow:16px -16px 0 #113f46;clip-path:polygon(0 48px,32px 48px,32px 16px,64px 16px,64px 0,calc(100% - 64px) 0,calc(100% - 64px) 16px,calc(100% - 32px) 16px,calc(100% - 32px) 48px,100% 48px,100% 100%,0 100%)}
.hero-orbit:before{content:'';position:absolute;left:20%;top:15%;width:8px;height:8px;background:#d9f77c;box-shadow:128px 32px 0 #79b9c8,48px 160px 0 #d9f77c,-24px 96px 0 #79b9c8,184px 208px 0 #d9f77c,104px 320px 0 #79b9c8;animation:pixel-stars 3s steps(2,end) infinite}
.hero-orbit span{left:23%;top:7%;font-size:9px;letter-spacing:0;rotate:0;color:#97c9c9}
.hero-speech{rotate:0;transform:none;border-radius:0;left:7%;top:35%;background:#e7f4f3;border:2px solid #061f26;box-shadow:6px 6px 0 #031e24;animation:pixel-bubble 3s steps(4,end) infinite;font-size:17px;padding:12px 16px}
.hero-speech:after{content:'';position:absolute;width:12px;height:12px;background:#e7f4f3;bottom:-12px;left:20px;box-shadow:0 2px 0 #061f26,2px 0 0 #061f26}
.hero-speech small{font-size:8px;letter-spacing:0}.speech-eye{font-family:var(--mono);font-size:21px}
.scroll-note{font-size:8px;right:3%;bottom:22px;gap:10px}.scroll-note b{border-radius:0;border-width:2px}
.chapter-indicator{font-size:9px}.chapter-indicator span{border-radius:0;width:6px;height:6px}
.squad-heading .eyebrow{font-size:9px;letter-spacing:0}.squad-heading h2{font-size:clamp(43px,4.8vw,76px);font-weight:600;line-height:1}
.squad-heading p:last-child{font:17px/1.4 var(--display)}
.fleet-icon{border-radius:0;border:2px solid #d8eeee;box-shadow:5px 5px 0 #031e24;clip-path:var(--pixel-cut);padding:2px}
.fleet-label b{font-size:24px;font-weight:600;letter-spacing:0}.fleet-label small{font:15px/1.2 var(--display);max-width:170px}
.board-heading{align-items:center;gap:20px}.board-heading h2{font-size:35px}.data-label{font-size:8px;letter-spacing:0;flex-shrink:0}
.board-column{border-radius:0;border:2px solid #87b5bc;box-shadow:5px 5px 0 #031e24}
.board-column>header{border-bottom:2px solid #8dbcc2;min-height:80px}.board-column>header h3{font-size:24px}.board-column>header small{font:12px/1.2 var(--display)}
.board-column>header>.board-pet{border-radius:0;border:2px solid #89b0b6;box-shadow:2px 2px 0 #729da5;padding:0}
.market-row{gap:8px;padding:13px 11px}.market-row b{font:600 16px var(--display)}
.market-row small{font:12px/1.2 var(--display);margin-top:4px}.market-row .row-number{font:14px var(--display)}.market-row .row-number small{font:11px var(--display)}
.coin-image{border-width:2px}.word-row{padding:12px 15px}.word-row strong{font-size:27px;letter-spacing:0}.word-row small{font:12px var(--display)}
.board-empty{font:16px/1.4 var(--display)}.word-bars i{width:8px}.word-bars{gap:4px}
.section-topline{border-bottom-width:2px;font-size:9px;letter-spacing:0}.section-topline i{font:600 21px var(--display)}
.markets-intro h2,.big-heading{font-size:clamp(45px,5vw,76px);line-height:1}.markets-intro p{font:19px/1.45 var(--display)}
.feature-market{border-radius:0;border-width:2px;box-shadow:5px 5px 0 #031e24;transition:transform .2s steps(3)}
.feature-market:hover{box-shadow:7px 7px 0 #031e24;transform:translate(-2px,-2px)}
.feature-market-head h3{font-size:28px}.feature-market-head small{font:14px var(--display)}.feature-market-head img,.feature-market-head .coin-image{border-radius:0}
.feature-price{font-size:42px}.feature-stats{font:13px var(--display);border-top-width:2px}.feature-arrow{font-family:var(--mono);font-size:20px}
.text-link{font-size:18px}.data-note,.section-placeholder{font:14px/1.5 var(--display)}
.black-world{border-radius:0;clip-path:var(--pixel-cut)}.black-world .eyebrow{font-size:9px;letter-spacing:0}.black-world .big-heading{font-size:clamp(43px,4.5vw,68px)}
.black-world p:not(.eyebrow){font:19px/1.45 var(--display)}
.peek-panel{border-radius:0;border:3px solid #56858f;box-shadow:8px 8px 0 #93b8be;background:#0e3b44}
.peek-panel:before{background-image:linear-gradient(#ffffff0b 2px,transparent 2px),linear-gradient(90deg,#ffffff0b 2px,transparent 2px);background-size:24px 24px;mask-image:none}
.peek-readout>div{font-size:9px;line-height:1.6;border-bottom-width:2px}.peek-label{font-size:8px;letter-spacing:0}
.peek-character{transform:none;bottom:-180px}.peek-readout .live-indicator{border-radius:0}
.action-card,.action-card.dark{border-radius:0;border-width:2px;box-shadow:6px 6px 0 #021e25;min-height:410px;transition:transform .2s steps(3)}
.action-card:hover{box-shadow:9px 9px 0 #021e25;transform:translate(-3px,-3px)}
.action-card h3{font-size:56px}.action-card p{font:18px/1.4 var(--display);max-width:260px}.action-card p.eyebrow{font:9px var(--mono)}
.action-card .action-arrow,.action-card.dark .action-arrow{border-radius:0;border-width:2px;font-family:var(--mono);font-size:19px}
.action-card:hover .card-pet{transform:translateY(-24px)}.action-card .card-pet{transition:transform .4s steps(4)}
.finale{border-radius:0;clip-path:polygon(0 12px,12px 12px,12px 0,calc(100% - 12px) 0,calc(100% - 12px) 12px,100% 12px,100% 100%,0 100%)}
.finale h2{font-size:clamp(74px,9.5vw,140px);line-height:.94}.finale p{font:18px/1.4 var(--display)}.finale p.eyebrow{font:9px/1.6 var(--mono)}
.finale .finale-pet{rotate:0;right:-10%;bottom:-24%}
.site-footer p{font:14px/1.45 var(--display)}.site-footer .footer-links{font:14px var(--display)}
.dock{border-radius:0;border:2px solid #659098;box-shadow:6px 6px 0 #011d24;background:#04232b;backdrop-filter:none;padding:9px 11px 12px;gap:8px}
.dock a{transition:transform .15s steps(3)}.dock .dock-tile{border-radius:0;border:2px solid #8dbcc8;box-shadow:3px 3px 0 #396976;background:#b2d6dc}
.dock a.active .dock-tile{box-shadow:3px 3px 0 #657f29}
.dock a.active:after{border-radius:0;width:4px;height:4px;bottom:-8px}
.dock .dock-glyph{top:5px;left:5px}.dock .dock-glyph svg{width:14px;height:14px}
.dock .dock-tile .noko-mascot{bottom:-14px;left:11px;width:43px;height:44px;transition:bottom .2s steps(2)}
.dock .tooltip{border-radius:0;box-shadow:3px 3px 0 #011d24;font-size:9px}
.toast{border-radius:0;border:2px solid #06242d;box-shadow:5px 5px 0 #031b23;font-size:11px}
.noko-mascot .mascot-creature{transform-origin:320px 500px;animation:piko-idle 2s steps(2,end) infinite;animation-delay:var(--mascot-delay,0s)}
.noko-mascot.is-greeting .mascot-creature{animation:piko-hello .6s steps(4,end) both}
.noko-mascot.is-blinking .mascot-eye-blink{animation:piko-blink .18s steps(1,end) both}
@keyframes piko-idle{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes piko-hello{0%,100%{transform:translateY(0)}40%{transform:translateY(-30px)}70%{transform:translateY(-10px)}}
@keyframes piko-blink{0%,100%{transform:scaleY(1)}40%{transform:scaleY(.25)}}
@keyframes pixel-stars{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes pixel-bubble{0%,100%{translate:0 0}50%{translate:0 -8px}}
@media(min-width:900px) and (max-height:850px){.hero-copy{top:6%;width:52%}.hero-copy h1{font-size:clamp(48px,8.4vh,70px);margin:18px 0}.hero-copy>p:not(.eyebrow){font-size:16px;max-width:390px}.hero-copy .eyebrow{font-size:8px}.hero-actions{margin-top:22px}.hero-actions .morph-button{font-size:16px;min-height:47px}.hero-pet{bottom:-9%;width:63%}.hero-speech{top:30%}.board-heading h2{font-size:30px}.board-heading .data-label{font-size:7px}.market-row{padding-top:10px;padding-bottom:10px;min-height:63px}}
@media(min-width:900px) and (max-width:1100px){.hero-copy h1{font-size:60px}.hero-pet{left:-14%;width:67%;bottom:-7%}.hero-speech{left:5%;top:34%;font-size:16px}.hero-actions .morph-button{font-size:15px;padding-left:12px;padding-right:40px}.hero-actions .button-pet{width:45px;bottom:-19px}.hero-copy>p:not(.eyebrow){font-size:17px;max-width:380px}.board-heading h2{font-size:28px}.board-column>header h3{font-size:21px}.board-column>header small{font-size:11px}.market-row b{font-size:14px}.market-row .row-number{font-size:12px}.market-row .row-number small{font-size:10px}}
@media(max-width:899px),(max-height:619px){.hero-copy{left:auto;top:auto;width:100%;padding:40px 30px 0}.hero-copy h1{font-size:clamp(54px,9vw,84px)}.hero-copy>p:not(.eyebrow){font-size:18px;max-width:510px}.hero-pet{position:relative;width:78%;left:auto;right:auto;bottom:auto;margin:20px auto -22% -8%}.hero-orbit{left:-8%;width:72%;top:420px;bottom:auto;aspect-ratio:1/1.1}.hero-speech{left:auto;right:7%;top:570px;font-size:16px}.squad-heading h2{font-size:47px}.squad-heading p:last-child{font-size:17px}.board-heading h2{font-size:33px}.board-column>header h3{font-size:25px}.board-column>header small{font-size:13px}.market-row b{font-size:16px}.market-row .row-number{font-size:15px}.market-row .row-number small{font-size:12px}.action-card h3{font-size:43px}.action-card p{font-size:17px}.finale .finale-pet{bottom:-22%;right:-25%}}
@media(max-width:650px){
 .site-header{height:68px;padding:0 16px}.wordmark{font-size:32px;gap:4px}#brand-mascot{width:35px;height:37px}.header-right{gap:8px}.network-badge{font-size:7px;padding:6px}.morph-button.small{font-size:13px;padding-left:10px;padding-right:37px;min-height:39px}.small .button-pet{width:42px;right:-3px;bottom:-19px}.ticker-track>a>b{font-size:14px}.ticker-track>a{font-size:9px}
 .hero-copy{padding:31px 22px 0}.hero-copy h1{font-size:clamp(45px,12vw,65px);line-height:1.04;margin:20px 0}.hero-copy .eyebrow{font-size:8px;line-height:1.7;max-width:280px}.hero-copy>p:not(.eyebrow){font-size:17px;line-height:1.4;max-width:330px}.hero-actions{gap:12px;margin-top:24px}.hero-actions .morph-button{font-size:15px;min-height:46px;padding-left:11px;padding-right:39px}.hero-actions .button-pet{width:43px;bottom:-20px}
 .hero-pet{width:110%;margin:30px auto -30% -23%}.hero-orbit{width:80%;left:-8%;top:470px;aspect-ratio:1/1.2;background-size:24px 24px}.hero-speech{top:520px;right:4%;left:auto;font-size:14px;padding:10px 12px;max-width:172px}.hero-speech small{font-size:7px}.hero-orbit span{display:none}
 .squad-heading{padding:40px 23px 25px}.squad-heading h2{font-size:36px}.squad-heading .eyebrow{font-size:8px}.squad-heading p:last-child{font-size:16px}.fleet-label b{font-size:22px}.fleet-label small{font-size:14px}.board-heading h2{font-size:30px}.board-heading .data-label{font-size:7px}.board-column{min-width:270px}.board-column>header h3{font-size:24px}
 .section-topline i{font-size:18px}.section-topline span:last-child{font-size:7px;line-height:1.5;max-width:115px;text-align:right}.markets-intro h2{font-size:43px}.markets-intro p{font-size:18px}.feature-market-head small{font-size:14px}.feature-stats{font-size:13px}.section-cta .morph-button{font-size:16px;min-height:48px}.section-cta .text-link{font-size:16px}.data-note{font-size:14px}
 .black-world .big-heading{font-size:43px}.black-world p:not(.eyebrow){font-size:18px}.black-world .eyebrow{font-size:8px}.peek-readout{margin:24px 18px}.peek-readout>div{font-size:8px;gap:12px}.peek-label{font-size:7px}.peek-character{bottom:-165px}.action-card,.action-card.dark{min-height:360px}.action-card h3{font-size:44px}.action-card p{font-size:17px;max-width:235px}.action-card p.eyebrow{font-size:8px}.action-card .card-pet{bottom:-72px}
 .finale h2{font-size:68px}.finale p{font-size:17px}.finale p.eyebrow{font-size:8px;line-height:1.7}.site-footer p{font-size:13px}.site-footer .footer-links{font-size:14px}.dock{padding:7px 8px 11px;gap:7px;max-width:calc(100vw - 18px);bottom:12px}.dock a,.dock .dock-tile{width:42px;height:44px}.dock .dock-glyph svg{width:12px;height:12px}.dock .dock-tile .noko-mascot{width:39px;height:40px;bottom:-14px;left:6px}.toast{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.noko-mascot .mascot-creature,.noko-mascot .mascot-eye-blink,.hero-speech,.hero-orbit:before{animation:none!important}.hero-pet{position:relative;left:auto;right:auto;bottom:auto;margin:10px auto -20% -10%}.hero-copy{left:auto;top:auto;width:100%}}

/* Reserve each sprite its own label column while the fleet spreads. */
.fleet-label{width:132px;left:0;top:148px}.fleet-label b{display:block;font-size:21px;line-height:1.1;min-height:46px;overflow-wrap:anywhere}.fleet-label small{max-width:130px;margin:5px auto 0;font-size:14px;line-height:1.25}
@media(min-width:900px) and (max-width:1100px){.fleet-label b{font-size:18px;min-height:40px}.fleet-label small{font-size:13px}}
@media(max-width:899px),(max-height:619px){.fleet-label{top:auto;left:auto;width:132px}.fleet-label b{font-size:20px;min-height:24px}}

.kit-link{font-family:var(--display);font-size:17px;font-weight:600;white-space:nowrap;color:#d9f77c}.kit-link:focus-visible{outline:2px solid #d9f77c;outline-offset:5px}@media(max-width:650px){.header-right>.docs-link{display:none}.kit-link{font-size:14px}}@media(max-width:470px){.header-right>.network-badge{display:none}.header-right{gap:12px}}

.social-link{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex-shrink:0;border:1px solid currentColor;color:#d9f77c}.social-link svg{width:17px;height:17px}.social-link:hover{background:#d9f77c;color:#082c33}.social-link:focus-visible{outline:2px solid #d9f77c;outline-offset:4px}@media(max-width:470px){.header-right>.kit-link{display:none}.social-link{width:32px;height:34px}}