/* ════════════════════════════════════════════════════════════
   MCTools v3 preview — additions layered on the REAL site theme.
   Everything here uses the existing design tokens (--panel, --accent,
   --btn-*, Mojangles) so it reads as the same site, upgraded.
   ════════════════════════════════════════════════════════════ */

/* ── home search bar ── */
.home-search-wrap{max-width:560px;margin:.2rem auto 1.4rem;padding:0 1rem}
.home-search{
  display:flex;align-items:center;gap:.6rem;width:100%;
  background:var(--input-bg);border:2px solid var(--input-brd);
  padding:.7rem .9rem;cursor:text;transition:border-color .15s, box-shadow .15s;
}
.home-search:hover,.home-search:focus-visible{border-color:var(--accent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 25%,transparent)}
.home-search .hs-icon{font-size:.9rem;opacity:.7}
.home-search .hs-ph{font-family:var(--mc);font-size:.6rem;color:var(--text-mut);text-shadow:1px 1px 0 #000;letter-spacing:.04em}
.home-search kbd{margin-left:auto;font-family:var(--mono);font-size:.62rem;border:1px solid var(--panel-border);padding:.1rem .4rem;color:var(--text-mut);border-radius:3px}

/* ── builder layout (tool pages) ── */
.builder{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:1rem;align-items:start;max-width:1100px;margin:0 auto;padding:0 1rem}
.builder .steps{min-width:0}
.step-num{
  display:inline-grid;place-items:center;width:24px;height:24px;margin-right:.55rem;
  font-family:var(--mc);font-size:.6rem;color:#fff;text-shadow:1px 1px 0 rgba(0,0,0,.6);
  background:linear-gradient(180deg,color-mix(in srgb,var(--btn-bg),#fff 10%),var(--btn-bg));
  border:2px solid;border-top-color:var(--btn-hi);border-left-color:var(--btn-hi);
  border-bottom-color:var(--btn-lo);border-right-color:var(--btn-lo);
  vertical-align:middle;
}
.card-label .state{float:right;font-size:.5rem;color:var(--green);letter-spacing:1px;text-shadow:1px 1px 0 #000}

/* disc grid — inventory slots */
.disc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:.45rem}
.disc{
  display:flex;flex-direction:column;align-items:center;gap:.35rem;padding:.6rem .25rem .45rem;
  background:var(--input-bg);border:2px solid var(--input-brd);cursor:pointer;
  transition:transform .08s steps(2), border-color .1s, background .1s;
}
.disc:hover{transform:translate(-1px,-1px);border-color:color-mix(in srgb,var(--accent) 60%,var(--input-brd))}
.disc.on{border-color:var(--green);background:color-mix(in srgb,var(--green) 8%,var(--input-bg));box-shadow:0 0 10px color-mix(in srgb,var(--green) 25%,transparent)}
.disc-n{font-family:var(--mc);font-size:.5rem;color:var(--text-sec);text-shadow:1px 1px 0 #000}
.disc.on .disc-n{color:var(--green)}
.disc .px-icon{image-rendering:pixelated}

#dzStatus{font-family:var(--mc);font-size:.52rem;color:var(--green);margin-top:.55rem;min-height:1em;text-shadow:1px 1px 0 #000;text-align:center}
.dz.got{border-style:solid;border-color:color-mix(in srgb,var(--green) 70%,transparent)}

/* ── sticky pack panel ── */
.pack.card{position:sticky;top:70px;padding:0;overflow:hidden;margin-bottom:1rem}
.pack .pack-head{display:flex;align-items:center;gap:.5rem;padding:.85rem 1rem .6rem;border-bottom:2px solid color-mix(in srgb,var(--accent),transparent 70%)}
.pack .pack-head .card-label{margin:0;padding:0;border:none;flex:1}
.pack .pack-count{font-family:var(--mc);font-size:.55rem;color:#0a1a0a;background:var(--green);border:2px solid #000;padding:.06rem .4rem;box-shadow:1.5px 1.5px 0 #000;text-shadow:none}
.pack-body{padding:.5rem .8rem;max-height:240px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--accent) rgba(0,0,0,.3)}
.pk-row{display:flex;align-items:center;gap:.5rem;padding:.38rem .2rem;border-bottom:1px dashed rgba(255,255,255,.08)}
.pk-row:last-child{border-bottom:none}
.pk-n{font-family:var(--mc);font-size:.55rem;text-shadow:1px 1px 0 #000;color:var(--text)}
.pk-t{color:var(--text-mut);font-size:.6rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.pk-d{font-family:var(--mono);font-size:.6rem;color:var(--text-mut)}
.pk-empty{text-align:center;color:var(--text-mut);font-size:.62rem;padding:.9rem}
.pack-foot{padding:.8rem 1rem 1rem;border-top:2px solid color-mix(in srgb,var(--accent),transparent 70%);background:rgba(0,0,0,.18)}
.pack-meta{display:flex;justify-content:space-between;font-size:.6rem;color:var(--text-mut);margin-bottom:.55rem}
.pack-meta b{color:var(--text-sec);font-family:var(--mono);font-weight:400}
.pack-foot .btn-p{width:100%;font-size:.72rem;padding:10px 0;justify-content:center}
.pack-hint{font-size:.52rem;color:var(--text-mut);text-align:center;margin-top:.55rem;text-shadow:1px 1px 0 #000}

/* ── related tools row ── */
.related-wrap{max-width:1100px;margin:1.6rem auto 0;padding:0 1rem}
.related-label{font-family:var(--mc);font-size:.7rem;color:var(--text);text-shadow:2px 2px 0 #000;margin:0 0 .6rem;letter-spacing:.04em}
.related-label::before{content:'◆ ';color:var(--accent)}

/* ── breadcrumb ── */
.crumb{max-width:1100px;margin:1rem auto 0;padding:0 1rem;display:flex;gap:.45rem;align-items:center;font-family:var(--mc);font-size:.5rem;color:var(--text-mut);text-shadow:1px 1px 0 #000}
.crumb a:hover{color:var(--text-sec)}
.crumb .sep{opacity:.6}

/* ── coords (instant) ── */
.inst{max-width:860px;margin:0 auto;padding:0 1rem}
.coords-duo{display:grid;grid-template-columns:1fr 56px 1fr;align-items:stretch}
.dim.card{margin-bottom:0;position:relative}
.dim.ow{border-top-color:color-mix(in srgb,#55FF55 55%,var(--panel-hi));border-left-color:color-mix(in srgb,#55FF55 55%,var(--panel-hi))}
.dim.ne{border-top-color:color-mix(in srgb,#FF5555 55%,var(--panel-hi));border-left-color:color-mix(in srgb,#FF5555 55%,var(--panel-hi))}
.dim .card-label{display:flex;align-items:center;gap:.5rem}
.dim.ow .card-label{color:#55FF55;border-bottom-color:color-mix(in srgb,#55FF55,transparent 70%)}
.dim.ne .card-label{color:#FF5555;border-bottom-color:color-mix(in srgb,#FF5555,transparent 70%)}
.dim .ratio{margin-left:auto;font-size:.5rem;color:var(--text-mut);letter-spacing:1px}
.coord-f{margin-bottom:.7rem}
.coord-f label{display:block;font-family:var(--mc);font-size:.55rem;color:var(--text-sec);margin-bottom:.25rem;text-shadow:1px 1px 0 #000}
.coord-f input{
  width:100%;background:var(--input-bg);border:2px solid var(--input-brd);
  color:var(--text);font-family:var(--mono);font-size:1.15rem;padding:.5rem .7rem;
}
.coord-f input:focus{outline:none;border-color:var(--accent)}
.dim.ow .coord-f input:focus{border-color:#55FF55}
.dim.ne .coord-f input:focus{border-color:#FF5555}
.coord-f input.pulse{animation:cpulse .35s}
@keyframes cpulse{0%{background:color-mix(in srgb,#55FF55 18%,var(--input-bg))}100%{background:var(--input-bg)}}
.swap-col{display:flex;align-items:center;justify-content:center}
#swapBtn{
  width:42px;height:42px;display:grid;place-items:center;cursor:pointer;font-size:1rem;color:var(--text);
  background:linear-gradient(180deg,color-mix(in srgb,var(--btn2-bg),#fff 10%),var(--btn2-bg));
  border:3px solid;border-top-color:var(--btn2-hi);border-left-color:var(--btn2-hi);
  border-bottom-color:var(--btn2-lo);border-right-color:var(--btn2-lo);
  transition:filter .1s;z-index:1;
}
#swapBtn:hover{filter:brightness(1.15)}
#swapBtn.spin{animation:swspin .4s steps(4)}
@keyframes swspin{to{transform:rotate(360deg)}}
.btn-copy{margin-top:.2rem;width:100%;justify-content:center}
.inst-note{text-align:center;color:var(--text-mut);font-size:.62rem;margin:1.1rem 0 0}
.inst-note b{color:var(--green)}

/* ── cmd-K palette (theme styled) ── */
.cmdk-overlay{position:fixed;inset:0;z-index:300;background:rgba(5,3,16,.72);backdrop-filter:blur(3px);display:none;align-items:flex-start;justify-content:center;padding-top:13vh}
.cmdk-overlay.open{display:flex}
.cmdk{
  width:540px;max-width:92vw;background:var(--panel);
  border:2px solid var(--panel-border);border-top-color:var(--panel-hi);border-left-color:var(--panel-hi);
  box-shadow:6px 6px 0 rgba(0,0,0,.55);backdrop-filter:blur(10px);
}
.cmdk-head{display:flex;align-items:center;gap:.6rem;padding:.8rem 1rem;border-bottom:2px solid color-mix(in srgb,var(--accent),transparent 70%)}
.cmdk-glyph{color:var(--text-mut)}
.cmdk-head input{flex:1;background:none;border:none;outline:none;color:var(--text);font-family:var(--mc);font-size:.72rem;text-shadow:1px 1px 0 #000}
.cmdk-head input::placeholder{color:var(--text-mut)}
.cmdk-head kbd{font-family:var(--mono);font-size:.6rem;border:1px solid var(--panel-border);padding:.06rem .35rem;color:var(--text-mut);border-radius:3px}
.cmdk-list{max-height:320px;overflow-y:auto;padding:.4rem;scrollbar-width:thin;scrollbar-color:var(--accent) rgba(0,0,0,.3)}
.cmdk-item{display:flex;align-items:center;gap:.6rem;padding:.55rem .65rem;transition:background .1s;text-decoration:none;color:var(--text)}
.cmdk-item:hover,.cmdk-item.sel{background:color-mix(in srgb,var(--accent) 12%,transparent)}
.cmdk-ic{font-size:1rem;width:22px;text-align:center}
.cmdk-n{font-family:var(--mc);font-size:.6rem;text-shadow:1px 1px 0 #000}
.cmdk-d{margin-left:auto;font-size:.58rem;color:var(--text-mut)}
.cmdk-empty{padding:1.2rem;text-align:center;color:var(--text-mut);font-size:.62rem;font-family:var(--mc);text-shadow:1px 1px 0 #000}

/* ── toast (MC achievement style, theme colors) ── */
.toast-wrap{position:fixed;top:60px;right:14px;z-index:400;display:flex;flex-direction:column;gap:.5rem}
.toast{
  display:flex;align-items:center;gap:.7rem;min-width:250px;max-width:330px;
  background:var(--panel);border:2px solid #000;
  border-top-color:var(--gold);border-left-color:var(--gold);
  box-shadow:3px 3px 0 #000;padding:.65rem .9rem;backdrop-filter:blur(8px);
  transform:translateX(120%);transition:transform .3s steps(6);
}
.toast.in{transform:translateX(0)}
.toast-ic{font-size:1.3rem;line-height:1}
.toast-tx b{display:block;font-family:var(--mc);font-size:.58rem;color:var(--gold);text-shadow:1.5px 1.5px 0 #000}
.toast-tx i{font-style:normal;font-size:.6rem;color:var(--text-sec)}

/* copied state */
.btn.copied{filter:brightness(1.25)}

/* reveal */
.rv{opacity:0;transform:translateY(12px);transition:opacity .45s ease,transform .45s ease}
.rv.vis{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}

/* responsive */
@media(max-width:860px){
  .builder{grid-template-columns:1fr}
  .pack.card{position:static}
  .coords-duo{grid-template-columns:1fr}
  .swap-col{padding:.5rem 0}
}

/* ── embed-card icons replacing emojis on home ── */
.tool-icon img.ti-img{height:46px;width:auto;max-width:74px;object-fit:contain;display:block;margin:0 auto;filter:drop-shadow(0 4px 6px rgba(0,0,0,.45))}
.ti-img.px{image-rendering:pixelated;height:42px}
.sc-caption-icon img{height:22px;width:auto;display:block;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.cmdk-ic img{height:22px;width:auto;max-width:30px;object-fit:contain;display:block}
.portal-mini{height:1.15em;width:auto;image-rendering:pixelated;vertical-align:-.2em;margin-right:.15em;display:inline-block}