/*
Theme Name: Dog Pound Three
Theme URI: https://blog.loveiznothin.com
Author: DogPound
Description: Minecraft-themed site for the DogPound 3 modpack — dirt & stone, pixel fonts, inventory-slot bevels, creative-inventory tabs, and main-menu buttons.
Version: 1.0
*/

:root{
  --stone:#2b2b2b; --stone2:#1d1d1d; --dirt:#6b4f34; --grass:#5b8731; --grass2:#74a83c;
  --panel:#c6c6c6; --panel-d:#8b8b8b; --slot:#8b8b8b; --btn:#9b9b9b; --btn-h:#a7c178;
  --ink:#ffffff; --ink-shadow:#3f3f3f; --splash:#ffff55; --xp:#7fbf2f;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{image-rendering:pixelated;}
body{
  font-family:'VT323','Noto Color Emoji','Apple Color Emoji','Segoe UI Emoji',monospace; font-size:22px; color:var(--ink);
  background:
    linear-gradient(rgba(10,12,18,.72),rgba(10,12,18,.86)),
    repeating-linear-gradient(45deg,#3a4a2a 0 8px,#34421f 8px 16px);
  background-attachment:fixed; min-height:100vh; line-height:1.25;
}
a{color:var(--btn-h);text-decoration:none;}
.pix{font-family:'Press Start 2P','Noto Color Emoji',monospace;}
.mcbtn,.tab,.invtitle,.slot .icn,.slot .px,.splash,.hcell{font-family:'VT323','Noto Color Emoji','Apple Color Emoji','Segoe UI Emoji',monospace;}
.tshadow{text-shadow:2px 2px 0 var(--ink-shadow), 3px 3px 0 #0008;}

/* grass top bar */
.grassbar{height:14px;background:
  linear-gradient(var(--grass2),var(--grass));
  border-bottom:4px solid #3f5e22;
  box-shadow:0 4px 0 #2c4418;}

.wrap{max-width:1000px;margin:0 auto;padding:28px 16px 64px;}

/* ── Hero / main-menu ── */
.hero{text-align:center;padding:46px 12px 30px;}
.logo{font-size:40px;line-height:1.5;color:#fff;letter-spacing:1px;}
.logo .lime{color:#6fd43f;}
.splash{display:inline-block;color:var(--splash);font-size:26px;transform:rotate(-12deg);
  position:relative;z-index:3;margin-top:-34px;left:120px;white-space:nowrap;
  animation:bob .9s ease-in-out infinite;text-shadow:2px 2px 0 #6b6b00;}
@media(max-width:560px){.splash{left:40px;margin-top:-26px;font-size:22px;}}
@keyframes bob{0%,100%{transform:rotate(-12deg) scale(1)}50%{transform:rotate(-12deg) scale(1.08)}}
.ver{color:#bdbdbd;font-size:18px;margin-top:14px;}

/* ── Minecraft buttons (main menu) ── */
.menu{max-width:520px;margin:26px auto 0;display:flex;flex-direction:column;gap:12px;}
.mcbtn{
  display:block;width:100%;padding:14px 10px;text-align:center;cursor:pointer;
  font-family:'VT323',monospace;font-size:24px;color:#fff;text-shadow:2px 2px 0 #000a;
  background:var(--btn); border:3px solid #000;
  box-shadow:inset 2px 2px 0 #ffffff66, inset -3px -5px 0 #00000066;
  transition:background .08s, transform .04s;
}
.mcbtn:hover{background:var(--btn-h);color:#1d2b10;text-shadow:2px 2px 0 #ffffff55;}
.mcbtn:active{transform:translateY(2px);box-shadow:inset 2px 2px 0 #00000055;}
.menu .row{display:flex;gap:12px;}
.menu .row .mcbtn{flex:1;}

/* ── Inventory panel + creative tabs ── */
.inv{max-width:880px;margin:48px auto 0;}
.tabs{display:flex;gap:6px;padding-left:8px;}
.tab{
  font-family:'VT323',monospace;font-size:22px;color:#3a3a3a;cursor:pointer;
  padding:10px 18px 6px;background:var(--panel-d);border:3px solid #000;border-bottom:none;
  box-shadow:inset 2px 2px 0 #ffffff77;
}
.tab.active{background:var(--panel);color:#222;transform:translateY(-2px);}
.invbody{
  background:var(--panel);border:3px solid #000;padding:18px;
  box-shadow:inset 3px 3px 0 #ffffffaa, inset -3px -3px 0 #00000044;
}
.invtitle{font-family:'Press Start 2P',monospace;font-size:13px;color:#3a3a3a;margin-bottom:14px;}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;}
.slot{
  background:var(--slot);border:3px solid #000;padding:14px 12px;color:#fff;
  box-shadow:inset 3px 3px 0 #00000055, inset -2px -2px 0 #ffffff44;
  min-height:118px;display:flex;flex-direction:column;gap:6px;transition:transform .06s;
}
.slot:hover{transform:translateY(-3px) scale(1.02);box-shadow:inset 3px 3px 0 #00000055, inset -2px -2px 0 #ffffff44, 0 0 0 2px #ffff55;}
.slot .icn{font-size:34px;text-shadow:2px 2px 0 #0007;}
.slot .nm{font-size:20px;color:#fff;text-shadow:1px 1px 0 #000;}
.slot .ds{font-size:16px;color:#e7e7e7;}
.slot .px{align-self:flex-start;margin-top:auto;font-size:17px;color:#ffe98a;text-shadow:1px 1px 0 #000;}

/* hotbar footer */
.hotbar{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:46px auto 10px;max-width:600px;}
.hcell{width:62px;height:62px;background:var(--slot);border:3px solid #000;
  box-shadow:inset 3px 3px 0 #00000055, inset -2px -2px 0 #ffffff44;
  display:flex;align-items:center;justify-content:center;font-size:30px;line-height:1;overflow:hidden;}
footer{text-align:center;color:#cfcfcf;font-size:18px;margin-top:24px;}
footer .heart{color:#ff5a5a;}
.hide{display:none;}

/* ── SVG icons (render everywhere, no fonts/emoji) ── */
.ic{display:inline-block;width:1em;height:1em;vertical-align:-.16em;fill:currentColor;image-rendering:auto;}
.slot .icn{width:46px;height:46px;vertical-align:0;filter:drop-shadow(2px 2px 0 rgba(0,0,0,.45));}
.tab .ic{width:22px;height:22px;vertical-align:-.22em;margin-right:4px;}
.mcbtn .ic{width:24px;height:24px;vertical-align:-.24em;margin-right:8px;}
.hcell .ic{width:36px;height:36px;}
.px-ic{width:18px;height:18px;vertical-align:-.18em;margin-right:2px;}
.ver-ic{width:20px;height:20px;vertical-align:-.2em;}
.rk-pup{color:#7fd43f;} .rk-hound{color:#cd8a3a;} .rk-alpha{color:#dfe6ee;}