/* MiNI BRoKER — shared pixel styles */
:root{
  --ink:#16181F; --cream:#F7F1E5; --panel:#FCF8EF; --grey:#C6C2B8; --grey-t:#5F5B53;
  --red:#E23B32; --yellow:#EFBF2E; --purple:#6E35CE; --orange:#E08A2E;
  --sky:#3BA3E8; --green:#33A155;
}
*{box-sizing:border-box}
[hidden]{display:none !important}
html,body{margin:0;padding:0;max-width:100%;overflow-x:hidden}
body{background:var(--cream);color:var(--ink);font-family:'VT323',monospace}
img{image-rendering:pixelated;-ms-interpolation-mode:nearest-neighbor;max-width:100%}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--red)}
button{font-family:'Press Start 2P',monospace}
.pixel{font-family:'Press Start 2P',monospace}

/* navbar */
.nav{background:var(--ink);width:100%}
.nav__in{max-width:1180px;margin:0 auto;padding:12px clamp(10px,2.5vw,22px);display:flex;gap:8px;align-items:center;justify-content:flex-end;position:relative}
.nav__list{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.nav__list a{font-family:'Press Start 2P',monospace;font-size:10px;line-height:1.4;padding:9px 10px;background:var(--ink);color:var(--cream);border:3px solid var(--cream)}
.nav__list a:hover{background:var(--yellow);color:var(--ink);border-color:var(--yellow)}
.nav__list a.is-on{background:var(--yellow);color:var(--ink);border-color:var(--yellow)}
.nav__menu{display:none;font-size:11px;padding:11px 13px;background:var(--yellow);color:var(--ink);border:3px solid var(--ink);cursor:pointer}
@media (max-width:899px){
  .nav__menu{display:block;margin-left:auto}
  .nav__list{display:none;position:absolute;top:calc(100% - 2px);right:clamp(10px,2.5vw,22px);z-index:60;flex-direction:column;flex-wrap:nowrap;background:var(--ink);border:4px solid var(--cream);padding:8px;min-width:220px;max-width:calc(100vw - 32px);animation:mbpop .16s steps(3) both}
  .nav__list.is-open{display:flex}
  .nav__list a{text-align:left}
}

/* layout */
.wrap{max-width:1180px;margin:0 auto;padding:clamp(18px,3vw,30px) clamp(12px,3vw,26px) 56px;display:flex;flex-direction:column;gap:clamp(26px,4.5vw,50px)}
.sec{display:flex;flex-direction:column;gap:16px}
.h1{font-family:'Press Start 2P',monospace;font-size:clamp(28px,7vw,62px);line-height:1.25;margin:0;letter-spacing:2px}
.h2{font-family:'Press Start 2P',monospace;font-size:clamp(18px,3.4vw,34px);line-height:1.4;margin:0;letter-spacing:1px}
.h3{font-family:'Press Start 2P',monospace;font-size:clamp(13px,2.2vw,17px);line-height:1.6;margin:0}
.lead{font-size:clamp(18px,2vw,21px);line-height:1.3;margin:0;max-width:680px}
.txt{font-size:20px;line-height:1.3;margin:0}
.note{font-size:19px;line-height:1.3;margin:0}
.note--red{color:var(--red)}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.gauto{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:clamp(14px,2.4vw,20px)}
.gcard{display:grid;grid-template-columns:repeat(auto-fit,minmax(285px,1fr));gap:14px}
.gsmall{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:clamp(10px,1.8vw,16px)}
.panel{background:var(--panel);border:4px solid var(--ink);box-shadow:8px 8px 0 var(--ink);padding:clamp(16px,3vw,24px);display:flex;flex-direction:column;gap:12px}
.panel--flat{box-shadow:6px 6px 0 var(--ink);padding:16px}
.dark{background:var(--ink);box-shadow:8px 8px 0 var(--ink);padding:clamp(16px,3vw,24px);display:flex;flex-direction:column;gap:14px;color:var(--cream)}
.chip{font-family:'Press Start 2P',monospace;font-size:10px;line-height:1.7;padding:11px 12px;background:var(--panel);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);display:inline-block}
.tag{font-family:'Press Start 2P',monospace;font-size:9px;line-height:1.6;padding:7px 9px;background:var(--cream);border:3px solid var(--ink)}
.kicker{font-family:'Press Start 2P',monospace;font-size:10px;line-height:1.7;color:var(--red)}
.num{width:32px;height:32px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;border:3px solid var(--ink);font-family:'Press Start 2P',monospace;font-size:9px}
.hr{height:4px;background:var(--ink)}

/* buttons */
.btn{font-family:'Press Start 2P',monospace;font-size:13px;line-height:1.5;padding:15px 19px;background:var(--panel);color:var(--ink);border:4px solid var(--ink);box-shadow:5px 5px 0 var(--ink);cursor:pointer;display:inline-block;text-align:center}
.btn--y{background:var(--yellow)}
.btn--sky{background:var(--sky)}
.btn--green{background:var(--green);color:var(--cream)}
.btn--purple{background:var(--purple);color:var(--cream)}
.btn--red{background:var(--red);color:var(--cream)}
.btn--big{font-size:clamp(15px,2.2vw,20px);padding:clamp(17px,2.4vw,23px) clamp(22px,3.6vw,40px);box-shadow:8px 8px 0 var(--ink)}
.btn--sm{font-size:13px;padding:13px 15px;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.btn--off{background:var(--grey);color:var(--grey-t);cursor:not-allowed}
.btn--on-dark{border-color:var(--cream)}
.btn:disabled{background:var(--grey);color:var(--grey-t);cursor:not-allowed}
.back{align-self:flex-start}
input.pin{font-family:'VT323',monospace;font-size:21px;padding:12px;background:var(--cream);color:var(--ink);border:4px solid var(--ink);width:100%;max-width:540px}

/* art tiles */
.tile{background:var(--panel);border:4px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
.tile__img{width:100%;aspect-ratio:1;background-size:cover;background-position:center;image-rendering:pixelated}
.tile__cap{font-family:'Press Start 2P',monospace;font-size:9px;line-height:1.6;text-align:center;padding:7px 2px;border-top:4px solid var(--ink)}
.marquee{overflow:hidden;max-width:100%;padding:4px 0 12px}
.marquee__in{display:flex;gap:12px;width:max-content;animation:mbmarquee 80s linear infinite}
.marquee .tile{width:clamp(112px,16vw,150px);flex:0 0 auto}

/* locked previews */
.lock{position:relative}
.lock__body{filter:blur(5px);display:flex;flex-direction:column;gap:14px}
.lock__veil{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:14px;
  background-color:rgba(198,196,190,.55);
  background-image:repeating-linear-gradient(0deg,rgba(90,90,90,.30) 0 2px,transparent 2px 4px),repeating-linear-gradient(90deg,rgba(90,90,90,.30) 0 2px,transparent 2px 4px)}
.lock__label{font-family:'Press Start 2P',monospace;font-size:clamp(10px,1.9vw,14px);line-height:1.7;text-align:center;background:var(--ink);padding:13px 15px}
.bar{border:4px solid var(--ink)}
.sw{width:74px;height:74px;border:4px solid var(--ink)}

/* whitelist */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.step{background:var(--panel);border:4px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:12px 8px;text-align:center}
.step.is-done{background:var(--green);color:var(--cream)}
.step.is-now{background:var(--yellow)}
.step__n{font-family:'Press Start 2P',monospace;font-size:12px;line-height:1.6}
.step__l{font-family:'Press Start 2P',monospace;font-size:8px;line-height:1.8}
.card{border:5px solid var(--ink);box-shadow:8px 8px 0 var(--ink);padding:clamp(14px,2.4vw,22px);width:100%;max-width:640px;display:flex;flex-direction:column;gap:clamp(14px,2.4vw,20px)}
.card__top{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.card__mid{display:flex;flex-wrap:wrap;gap:clamp(14px,2.6vw,24px);align-items:flex-start}
.card__img{width:clamp(120px,26vw,180px);aspect-ratio:1;flex:0 0 auto;border:4px solid var(--ink);background-size:cover;image-rendering:pixelated}
.card__col{display:flex;flex-direction:column;gap:8px;min-width:min(100%,190px);flex:1}
.card__k{font-family:'Press Start 2P',monospace;font-size:10px;line-height:1.6}
.card__v{font-size:clamp(20px,2.6vw,26px);line-height:1.1;word-break:break-all;overflow-wrap:anywhere}
.card__chip{font-family:'Press Start 2P',monospace;font-size:clamp(9px,1.4vw,12px);line-height:1.6;padding:10px 12px}
.win{position:relative;overflow:hidden;background:var(--green);border:5px solid var(--ink);box-shadow:10px 10px 0 var(--ink);padding:clamp(20px,4.5vw,44px);text-align:center}
.win__t{font-family:'Press Start 2P',monospace;font-size:clamp(15px,3.2vw,28px);line-height:1.5;margin:0 0 16px;position:relative}
.win__p{font-size:clamp(19px,2.3vw,23px);line-height:1.35;margin:0;position:relative}
.spark{position:absolute;left:50%;top:70%}
.spark i{display:block;width:12px;height:12px;animation:mbshoot 1.05s steps(6) infinite}

/* hunt */
.hunt{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:clamp(8px,1.4vw,12px)}
.hunt button{padding:0;background:var(--yellow);border:4px solid var(--ink);box-shadow:5px 5px 0 var(--ink);cursor:pointer;display:block;width:100%}
.hunt__q{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1;font-family:'Press Start 2P',monospace;font-size:clamp(18px,4vw,30px)}

/* studio */
.pad{display:grid;grid-template-columns:repeat(16,1fr);width:100%;max-width:560px;aspect-ratio:1;background:var(--cream);border:5px solid var(--ink);box-shadow:8px 8px 0 var(--ink);touch-action:none}
.pad div{outline:1px solid var(--ink);outline-offset:-1px}
.swatch{width:46px;height:46px;border:4px solid var(--ink);box-shadow:4px 4px 0 var(--ink);cursor:pointer;padding:0}
.sigpad{width:100%;max-width:560px;height:180px;display:block;background:var(--cream);border:5px solid var(--ink);box-shadow:8px 8px 0 var(--ink);touch-action:none;cursor:crosshair}

/* referral */
.code{font-family:'Press Start 2P',monospace;font-size:clamp(18px,4.4vw,34px);line-height:1.4;letter-spacing:3px;word-break:break-all}
.link{font-size:21px;line-height:1.3;word-break:break-all;overflow-wrap:anywhere;max-width:100%;user-select:all}
.prog{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.prog i{display:block;height:30px;background:var(--cream);border:4px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.prog i.is-on{background:var(--green)}

/* collabs */
.collabs{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:clamp(12px,2vw,18px)}
.collab{background:var(--panel);border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:12px;display:flex;flex-direction:column;gap:10px;transition:transform .12s steps(2),box-shadow .12s steps(2)}
.collab:hover{transform:translate(-3px,-3px);box-shadow:9px 9px 0 var(--red)}
.collab__img{width:100%;aspect-ratio:1;border:4px solid var(--ink);background:var(--cream);background-size:cover;background-position:center}
.collab__n{font-family:'Press Start 2P',monospace;font-size:11px;line-height:1.6;word-break:break-word;overflow-wrap:anywhere}
.collab__u{font-size:20px;line-height:1.2;word-break:break-word;overflow-wrap:anywhere}

/* modal */
.modal{position:fixed;inset:0;z-index:90;background:rgba(22,24,31,.82);display:none;align-items:center;justify-content:center;padding:18px}
.modal.is-open{display:flex}
.modal__box{background:var(--panel);border:5px solid var(--ink);box-shadow:10px 10px 0 var(--ink);padding:clamp(20px,4vw,32px);max-width:420px;text-align:center;animation:mbpop .16s steps(3) both}

/* wallet chooser */
.wallets{display:flex;flex-direction:column;gap:8px;margin:14px 0 0}
.wallet{display:flex;align-items:center;gap:12px;width:100%;text-align:left;font-family:'Press Start 2P',monospace;font-size:12px;line-height:1.5;padding:14px;background:var(--cream);color:var(--ink);border:4px solid var(--ink);box-shadow:5px 5px 0 var(--ink);cursor:pointer}
.wallet:hover{background:var(--yellow)}
.wallet img{width:28px;height:28px;flex:0 0 auto;border:3px solid var(--ink);image-rendering:auto}
.wallet__dot{width:28px;height:28px;flex:0 0 auto;background:var(--sky);border:3px solid var(--ink)}

/* footer */
.foot{max-width:1180px;margin:0 auto;padding:0 clamp(12px,3vw,26px) 40px}
.foot__in{border-top:4px solid var(--ink);padding-top:20px;display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center}

@keyframes mbfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes mbmarquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes mbpop{0%{transform:scale(.88);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes mbshoot{0%{transform:translateY(0);opacity:1}100%{transform:translateY(-140px);opacity:0}}
@keyframes mbblink{0%,100%{opacity:1}50%{opacity:.3}}