/* Hytale DB — dark wiki style */
.hdb{
  --hdb-bg:#0b1020; --hdb-panel:#121a2e; --hdb-panel2:#17213a; --hdb-line:#243152;
  --hdb-text:#e6ecff; --hdb-mute:#8f9bbd; --hdb-gold:#f5b83d; --hdb-gold2:#ffd57a;
  --hdb-heart:#ff5d73; --hdb-teal:#3ee0b5; --hdb-link:#7fb2ff;
  --hdb-r:12px;
  background:var(--hdb-bg); color:var(--hdb-text);
  font-family:"Inter","Hiragino Sans","Noto Sans JP","Yu Gothic",system-ui,sans-serif;
  font-size:15px; line-height:1.6; padding:20px; border-radius:16px; box-sizing:border-box;
  max-width:1200px; margin:0 auto 24px; container-type:inline-size;
}
.hdb *,.hdb *::before,.hdb *::after{box-sizing:border-box}
.hdb h1,.hdb h2,.hdb h3,.hdb button,.hdb input,.hdb select{font-family:inherit}
.hdb a{color:var(--hdb-link);text-decoration:none}
.hdb a:hover{text-decoration:underline}
.hdb code{font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:.85em;color:var(--hdb-gold2);background:none;padding:0}
/* ページタイトル(テーマ側)を詳細ページでは隠す */
body.hdb-mob .entry-title, body.hdb-item .entry-title,
body.hdb-mob .wp-block-post-title, body.hdb-item .wp-block-post-title,
body.hdb-mob .page-title, body.hdb-item .page-title{display:none}

.hdb-crumb{font-size:13px;color:var(--hdb-mute);margin:0 0 14px}
.hdb-crumb a{color:var(--hdb-mute)} .hdb-crumb a:hover{color:var(--hdb-text)}
.hdb-crumb i{font-style:normal;margin:0 8px;opacity:.5}

/* hero */
.hdb-hero{position:relative;border:1px solid var(--hdb-line);border-radius:var(--hdb-r);overflow:hidden;background:var(--hdb-panel)}
.hdb-hero-bg{position:absolute;inset:0 0 auto 0;height:150px;
  background:radial-gradient(600px 180px at 80% 0%,rgba(150,90,255,.35),transparent 70%),
             radial-gradient(500px 160px at 20% 0%,rgba(40,170,140,.25),transparent 70%),
             linear-gradient(180deg,#1b2747,#121a2e)}
.hdb-hero-in{position:relative;display:flex;gap:24px;align-items:flex-end;padding:56px 24px 20px}
.hdb-hero-img{flex:0 0 132px;height:132px;border-radius:14px;background:#0f1730;border:1px solid #2c3a63;
  box-shadow:0 10px 30px rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;overflow:hidden}
.hdb-hero-img img{max-width:92%;max-height:92%;image-rendering:auto}
.hdb-icon img{image-rendering:pixelated}
.hdb-tags{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.hdb-tag{color:var(--hdb-gold)} a.hdb-tag{color:var(--hdb-gold)}
.hdb-title{font-size:clamp(26px,4vw,40px);line-height:1.15;margin:6px 0 2px;font-weight:900;letter-spacing:.01em;color:#fff;border:0;padding:0}
.hdb-en{color:var(--hdb-mute);font-size:13px;margin-bottom:12px}
.hdb-chips{display:flex;flex-wrap:wrap;gap:8px}
.hdb-chip{display:inline-flex;align-items:center;gap:10px;background:#0e1529;border:1px solid var(--hdb-line);border-radius:8px;
  padding:7px 10px;color:var(--hdb-mute);font-size:10px;font-weight:700;letter-spacing:.06em;cursor:pointer;font-family:inherit}
.hdb-chip:hover{border-color:#3a4c7d}
.hdb-chip-i{opacity:.6}
.hdb-chip.copied{border-color:var(--hdb-teal)} .hdb-chip.copied .hdb-chip-i::after{content:" コピー済";color:var(--hdb-teal)}

/* hero内のstatsもコンテナ基準 */
.hdb-stats{position:relative;display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid var(--hdb-line)}
.hdb-stat{padding:14px 10px;text-align:center;border-right:1px solid var(--hdb-line)}
.hdb-stat:last-child{border-right:0}
.hdb-stat-v{font-size:20px;font-weight:800;color:#fff}
.hdb-stat-l{font-size:10px;font-weight:700;letter-spacing:.12em;color:var(--hdb-mute)}
.hdb-heart{color:var(--hdb-heart);font-weight:400}
.hdb-bar{display:block;height:4px;border-radius:4px;background:#26304d;margin:6px 10px 0;overflow:hidden}
.hdb-bar span{display:block;height:100%;background:linear-gradient(90deg,#ff5d73,#ff8a5d)}

/* tabs */
.hdb-tabs{display:flex;gap:4px;overflow-x:auto;margin:18px 0;padding:6px;background:var(--hdb-panel);border:1px solid var(--hdb-line);border-radius:10px;
  position:sticky;top:0;z-index:5}
.hdb-tabs a{flex:0 0 auto;padding:8px 14px;border-radius:7px;color:var(--hdb-mute);font-size:12px;font-weight:700;letter-spacing:.06em}
.hdb-tabs a:hover,.hdb-tabs a.on{background:var(--hdb-panel2);color:#fff;text-decoration:none}

/* layout */
.hdb-cols{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start}
.hdb-side{position:sticky;top:64px}
.hdb-panel{background:var(--hdb-panel);border:1px solid var(--hdb-line);border-radius:var(--hdb-r);padding:18px;margin-bottom:20px;
  border-top:2px solid rgba(245,184,61,.55);scroll-margin-top:70px}
.hdb-h2{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:900;letter-spacing:.04em;margin:0 0 14px;color:#fff;border:0;padding:0;background:none}
.hdb-h2 i{color:var(--hdb-gold);font-style:normal;font-size:12px}
.hdb-h2 small{color:var(--hdb-mute);font-size:12px;font-weight:700}
.hdb-empty,.hdb-note{color:var(--hdb-mute);font-size:13px;margin:0}
.hdb-note{margin-top:8px;text-align:center;font-size:11px;opacity:.7}

/* viewer */
.hdb-viewer-stage{position:relative;height:460px;border-radius:10px;border:1px solid #2a3964;overflow:hidden;
  background:radial-gradient(ellipse at 50% 35%,#2b4470 0%,#1a2747 55%,#121a30 100%);cursor:grab}
.hdb-viewer-stage:active{cursor:grabbing}
.hdb-viewer-stage canvas{display:block;width:100%!important;height:100%!important}
.hdb-viewer-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--hdb-mute);font-size:13px}
.hdb-viewer.is-ready .hdb-viewer-loading{display:none}
.hdb-viewer.is-error .hdb-viewer-loading{color:var(--hdb-heart)}
.hdb-viewer.is-error .hdb-viewer-loading::after{content:"(読み込みに失敗しました)"}
.hdb-viewer-bar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:12px;font-size:13px;font-weight:700}
.hdb-viewer-bar select{background:#0e1529;color:#fff;border:1px solid var(--hdb-line);border-radius:8px;padding:8px 10px;min-width:150px;font-size:13px}
.hdb-viewer-bar label{display:inline-flex;align-items:center;gap:6px;color:var(--hdb-text);margin:0}
.hdb-viewer-bar input{accent-color:#4d8bff;margin:0}
.hdb-btn{background:#0e1529;color:#fff;border:1px solid #3a4c7d;border-radius:8px;padding:8px 14px;font-size:11px;font-weight:800;letter-spacing:.08em;cursor:pointer;font-family:inherit}
.hdb-btn:hover{border-color:var(--hdb-gold)}

/* cards */
.hdb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px}
.hdb-grid-drops{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.hdb-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:12px 10px;background:var(--hdb-panel2);
  border:1px solid var(--hdb-line);border-radius:10px;color:var(--hdb-text)!important;transition:transform .12s,border-color .12s}
a.hdb-card:hover{transform:translateY(-2px);border-color:#4061a8;text-decoration:none}
.hdb-card-img{width:84px;height:84px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:#0f1730}
.hdb-card-img img{max-width:100%;max-height:100%}
.hdb-item-card .hdb-card-img{width:64px;height:64px;border:2px solid #34405f}
.hdb-card-name{font-size:13px;font-weight:700;line-height:1.3;color:#fff}
.hdb-card-sub{font-size:12px;color:var(--hdb-mute)}
.hdb-pct{color:var(--hdb-teal);font-weight:800}
.hdb-qty{color:var(--hdb-mute)}

/* quality */
.hdb-q-common .hdb-card-img,.hdb-hero-img.hdb-q-common{border-color:#8b93a7}
.hdb-q-uncommon .hdb-card-img,.hdb-hero-img.hdb-q-uncommon{border-color:#3fcf6b;box-shadow:0 0 14px rgba(63,207,107,.25)}
.hdb-q-rare .hdb-card-img,.hdb-hero-img.hdb-q-rare{border-color:#3f8cff;box-shadow:0 0 14px rgba(63,140,255,.3)}
.hdb-q-epic .hdb-card-img,.hdb-hero-img.hdb-q-epic{border-color:#b05cff;box-shadow:0 0 14px rgba(176,92,255,.3)}
.hdb-q-legendary .hdb-card-img,.hdb-hero-img.hdb-q-legendary{border-color:#ffa53d;box-shadow:0 0 16px rgba(255,165,61,.35)}
span.hdb-q-common{color:#b7bfd3} span.hdb-q-uncommon,.hdb-tag.hdb-q-uncommon{color:#3fcf6b} span.hdb-q-rare,.hdb-tag.hdb-q-rare{color:#5c9dff}
span.hdb-q-epic,.hdb-tag.hdb-q-epic{color:#c27dff} span.hdb-q-legendary,.hdb-tag.hdb-q-legendary{color:#ffb34d} span.hdb-q-junk{color:#8a8f99}

/* sheet */
.hdb-sheet{display:grid;grid-template-columns:auto 1fr;margin:0}
.hdb-sheet dt,.hdb-sheet dd{padding:10px 0;border-bottom:1px solid var(--hdb-line);margin:0;font-size:13px}
.hdb-sheet dt{color:var(--hdb-mute);font-weight:600;padding-right:12px}
.hdb-sheet dd{text-align:right;font-weight:800;color:#fff;word-break:break-all}
.hdb-sheet dt:last-of-type,.hdb-sheet dd:last-of-type{border-bottom:0}

/* spawns */
.hdb-spawns{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.hdb-spawns li{background:var(--hdb-panel2);border:1px solid var(--hdb-line);border-radius:10px;padding:12px;margin:0}
.hdb-badge{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.08em;background:#24345e;color:var(--hdb-gold2);border-radius:5px;padding:2px 7px;margin-right:6px}
.hdb-envs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;font-size:11px;color:var(--hdb-mute)}
.hdb-envs span{background:#0e1529;border:1px solid var(--hdb-line);border-radius:20px;padding:2px 9px;color:var(--hdb-text)}
.hdb-desc{margin:0;color:#cdd6f4;font-style:italic}

/* video */
.hdb-video{position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;margin-bottom:12px;background:#000}
.hdb-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* list */
.hdb-search{display:flex;gap:8px;margin:0 0 14px}
.hdb-search input{flex:1;min-width:0;background:#0e1529;color:#fff;border:1px solid var(--hdb-line);border-radius:10px;padding:12px 14px;font-size:15px}
.hdb-search input:focus{outline:none;border-color:var(--hdb-gold)}
.hdb-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.hdb-filters a{padding:6px 12px;border:1px solid var(--hdb-line);border-radius:30px;color:var(--hdb-text);font-size:13px;font-weight:700;background:var(--hdb-panel)}
.hdb-filters a small{color:var(--hdb-mute);font-weight:600;margin-left:3px}
.hdb-filters a.on,.hdb-filters a:hover{border-color:var(--hdb-gold);color:var(--hdb-gold2);text-decoration:none}
.hdb-filters-sub a{font-size:12px;padding:4px 10px}
.hdb-count{color:var(--hdb-mute);font-size:13px;margin:10px 0}
.hdb-pager{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:20px 0}
.hdb-pager a,.hdb-pager b,.hdb-pager span{min-width:36px;text-align:center;padding:7px 10px;border-radius:8px;border:1px solid var(--hdb-line);font-size:13px}
.hdb-pager b{background:var(--hdb-gold);color:#1a1300;border-color:var(--hdb-gold)}
.hdb-pager span{border:0;color:var(--hdb-mute)}

/* embed */
.hdb-embed{padding:14px}
.hdb-embed-head{display:flex;gap:14px;align-items:center;margin-bottom:12px}
.hdb-embed-img{width:72px;height:72px;flex:0 0 72px;background:#0f1730;border-radius:10px;display:flex;align-items:center;justify-content:center}
.hdb-embed-img img{max-width:92%;max-height:92%}
.hdb-embed-name{font-size:20px;font-weight:900;color:#fff!important}
.hdb-embed .hdb-en{margin:0 0 6px}
.hdb-mini-stats{display:flex;flex-wrap:wrap;gap:12px;font-size:13px;font-weight:700}
.hdb-embed .hdb-viewer-stage{height:360px}
.hdb-embed-item{display:inline-block;padding:10px;max-width:220px}

@container (max-width:860px){
  .hdb-cols{grid-template-columns:1fr}
  .hdb-side{position:static}
  .hdb-stats{grid-template-columns:repeat(3,1fr)}
  .hdb-stat:nth-child(3){border-right:0}
  .hdb-stat:nth-child(-n+3){border-bottom:1px solid var(--hdb-line)}
}
@media (max-width:600px){
  .hdb{padding:12px;border-radius:10px}
}
@container (max-width:600px){
  .hdb-hero-in{flex-direction:column;align-items:flex-start;padding:40px 16px 16px;gap:14px}
  .hdb-hero-img{flex-basis:auto;width:104px;height:104px}
  .hdb-viewer-stage{height:340px}
  .hdb-grid{grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}
  .hdb-card-img{width:64px;height:64px}
  .hdb-panel{padding:14px}
}
.hdb-card-id{font-family:ui-monospace,Menlo,monospace;font-size:9px;color:#6d7aa0;word-break:break-all;line-height:1.2;margin-top:-3px}

/* テーマ干渉対策 */
.hdb .hdb-h2{border:0!important;background:none!important;padding:0!important;box-shadow:none!important}
.hdb .hdb-h2::before,.hdb .hdb-h2::after{display:none!important}
.hdb img{border:0;box-shadow:none;margin:0}
.hdb dl,.hdb dd,.hdb dt{background:none}
.hdb ul,.hdb li{list-style:none}
.hdb-page .article .toc,.hdb-page .toc{display:none}
body.hdb-mob .article-header,body.hdb-item .article-header{display:none}

/* recipes */
.hdb-recipes{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.hdb-recipe{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:6px 12px;align-items:center;background:var(--hdb-panel2);border:1px solid var(--hdb-line);border-radius:10px;padding:10px}
.hdb-recipe-out{grid-row:1/3;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:92px;max-width:110px;text-align:center}
.hdb-recipe-more{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}
.hdb-recipe-in{display:flex;flex-wrap:wrap;gap:6px}
.hdb-recipe-meta{display:flex;flex-wrap:wrap;gap:8px;font-size:11px;color:var(--hdb-mute);align-items:center}
.hdb-ing{display:inline-flex;flex-direction:column;align-items:center;gap:3px;color:var(--hdb-text)!important;text-decoration:none!important}
.hdb-ing-ic{position:relative;width:42px;height:42px;border-radius:8px;background:#0f1730;border:2px solid #34405f;display:flex;align-items:center;justify-content:center}
.hdb-ing.big .hdb-ing-ic{width:58px;height:58px}
.hdb-ing-ic img{max-width:86%;max-height:86%;image-rendering:pixelated}
.hdb-ing-ic b{position:absolute;right:-4px;bottom:-6px;background:#0b1020;border:1px solid var(--hdb-line);border-radius:6px;font-size:10px;line-height:1;padding:2px 4px;color:#fff}
.hdb-ing.res .hdb-ing-ic{border-style:dashed}
.hdb-ing-name{font-size:12px;font-weight:700;line-height:1.25;color:#fff}
a.hdb-ing:hover .hdb-ing-ic{border-color:var(--hdb-gold)}
.hdb-ing-ic.hdb-q-uncommon{border-color:#3fcf6b}.hdb-ing-ic.hdb-q-rare{border-color:#3f8cff}.hdb-ing-ic.hdb-q-epic{border-color:#b05cff}.hdb-ing-ic.hdb-q-legendary{border-color:#ffa53d}
.hdb-bench-chip{display:inline-flex;align-items:center;gap:5px;background:#0e1529;border:1px solid var(--hdb-line);border-radius:20px;padding:2px 9px 2px 3px;font-weight:700;color:var(--hdb-gold2)!important}
.hdb-bench-chip img{width:20px;height:20px;image-rendering:pixelated}
.hdb-bench-mini{font-size:11px;color:var(--hdb-gold2)}
.hdb-cat-tabs a{display:inline-flex;align-items:center;gap:6px}
.hdb-cat-tabs img{width:20px;height:20px;image-rendering:pixelated}
.hdb-cat-tabs small{opacity:.6}
.hdb-grid-bench{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.hdb-hand{font-size:40px}
.hdb-tiers{margin:0;padding:0;display:grid;gap:10px}
.hdb-tiers li{background:var(--hdb-panel2);border:1px solid var(--hdb-line);border-radius:10px;padding:10px}
.hdb-tier-h{font-size:12px;font-weight:800;color:var(--hdb-gold2);margin-bottom:8px}
.hdb-embed-item{container-type:normal;width:220px}
.hdb-tag-var{color:var(--hdb-teal)!important}
.hdb-variant .hdb-card-name{color:var(--hdb-gold2)}
.hdb-summary{margin:16px 2px 0;color:#c9d3f2;font-size:14px;line-height:1.85}