@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;400;700&family=Cinzel:wght@400;600&display=swap');

:root > * {
  --md-text-font: "Noto Serif JP", serif;
  --md-default-fg-color: #b0a898;
  --md-default-bg-color: #141414;
  --md-primary-fg-color: #c8a96e;
  --md-accent-fg-color: #c8a96e;
  --md-typeset-a-color: #c8a96e;
}

.md-header {
  background-color: #141414;
  border-bottom: 1px solid #3a3020;
}

.top-content-badge, .gls-badge {
    display: inline-block;
    font-size: 9px;
    color: #5a5a5a !important;
    border: 1px solid #333333;
    padding: 2px 8px;
    letter-spacing: 0.2em;
    margin-bottom: 24px;
}

.top-content-eyebrow, .gls-eyebrow {
    font-size: 11px;
    color: #555555 !important;
    letter-spacing: 0.4em;
    margin-bottom: 16px;
    font-family: 'Cinzel', serif;
}

h1.top-content-hero, h1.gls-hero {
    font-size: 24px;
    color: #e8e0d0 !important;
    font-weight: 300;
    line-height: 1.8;
    margin: 0 0 8px;
    letter-spacing: 0.05em;
}

.accent { color: #c8a96e !important; }

.top-content-hero-sub, .gls-hero-sub {
    font-size: 12px;
    color: #888888 !important;
    letter-spacing: 0.2em;
    font-style: italic;
    margin-bottom: 28px;
    font-family: 'Cinzel', serif;
}

.top-content-divider, .gls-divider {
    width: 60px;
    height: 1px;
    background: #c8a96e;
    margin-bottom: 28px;
    opacity: 0.5;
}

.top-guide-card, .gls-card {
    background: #1e1e1e;
    border: 1px solid #2c2c2c;
    border-left: 3px solid #3a3020;
    padding: 14px 18px;
    transition: border-left-color 0.2s, padding-left 0.2s;
    cursor: pointer;
    margin-bottom: 8px;
}

.top-guide-card:hover, .gls-card:hover {
    border-left-color: #c8a96e;
    padding-left: 22px;
}

.top-guide-card-title, .gls-card-title {
    font-size: 15px;
    color: #e8e0d0 !important;
    letter-spacing: 0.05em;
}

.top-guide-arrow, .gls-arrow {
    color: #c8a96e !important;
    margin-right: 8px;
}

.top-guide-card-desc, .gls-card-desc {
    font-size: 12px;
    color: #b0a898 !important;
    line-height: 1.8;
}

/* ========== サイドバーの魔改造 ========== */
.md-sidebar--primary .md-sidebar__scrollwrap {
  background: #161616;
  border-right: 1px solid #2c2c2c;
}
.md-nav__title, .md-nav__title[for="__drawer"] {
  font-family: 'Cinzel', serif !important;
  font-size: 12px;
  letter-spacing: 0.2em;
  color: #bbbbbb;
  text-transform: uppercase;
  border-bottom: 1px solid #2a2a2a;
}
.md-nav__link {
  font-family: 'Noto Serif JP', serif;
  font-size: 13px;
  color: #888888;
  transition: all 0.2s ease;
  padding: 10px 20px;
  border-left: 2px solid transparent;
}
.md-nav__link:hover, .md-nav__item:hover > .md-nav__link {
  color: #c8a96e;
  border-left-color: #c8a96e;
  background: rgba(200, 169, 110, 0.05);
}
.md-nav__item--active > .md-nav__link {
  color: #e8e0d0 !important;
  border-left: 3px solid #c8a96e !important;
  font-weight: 700;
  letter-spacing: 0.05em;
  background: rgba(200, 169, 110, 0.08);
}

/* ========== イントロアニメーション用CSS ========== */
#intro-overlay {
    position: fixed; inset: 0; z-index: 9999;
    overflow-y: scroll; overflow-x: hidden;
    background: #0e0e0e; scrollbar-width: none;
}
#intro-overlay::-webkit-scrollbar { display: none; }
#intro-progress {
    position: fixed; top: 0; left: 0; height: 1px; width: 0%;
    background: #c8a96e; z-index: 10000; transition: width 0.1s;
}
.i-scroll-hint {
    position: sticky; bottom: 16px; display: flex; justify-content: center; pointer-events: none;
}
.i-scroll-hint span {
    font-size: 9px; color: #555; letter-spacing: 0.4em;
    animation: iHintBounce 1.5s ease-in-out infinite;
}
@keyframes iHintBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(5px); }
}
.intro-inner { min-height: 400vh; }
.i-sec {
    height: 100vh; display: flex; align-items: center; justify-content: center;
    position: relative; overflow: hidden; opacity: 0; transform: translateY(30px) scale(0.97);
    transition: opacity 1.2s cubic-bezier(0.2, 0.8, 0.2, 1), transform 1.2s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.i-sec.i-visible { opacity: 1; transform: translateY(0) scale(1); }

.i-parallax {
    will-change: transform;
}
#i-sec1 { background: #0e0e0e; flex-direction: column; align-items: flex-end; padding-right: 10%; }
.i-text-right { text-align: right; }
.i-small { font-size: 14px; color: #bbb; letter-spacing: 0.2em; margin-bottom: 8px; font-family: 'Noto Serif JP', serif;}
.i-large { font-size: 32px; color: #f5f0e8; font-weight: 700; letter-spacing: 0.15em; border-bottom: 1px solid #333; padding-bottom: 10px; font-family: 'Noto Serif JP', serif;}
.i-eng { font-size: 9px; color: #888; letter-spacing: 0.1em; font-style: italic; margin-top: 8px; font-family: 'Cinzel', serif;}
#i-sec2 { background: #0c0c0c; gap: 24px; align-items: flex-end; padding-bottom: 10%; }
.i-text-vert { writing-mode: vertical-rl; font-size: 20px; color: #f0ebe0; line-height: 2; letter-spacing: 0.3em; font-family: 'Noto Serif JP', serif;}
.i-accent { font-size: 30px; font-weight: 700; color: #f5f0e8; }
.i-from { font-size: 10px; color: #888; letter-spacing: 0.3em; font-style: italic; align-self: flex-end; margin-bottom: 8px; font-family: 'Cinzel', serif;}
#i-sec3 { background: #0e0e0e; flex-direction: column; gap: 16px; }
.i-catch { font-size: 14px; color: #aaa; letter-spacing: 0.3em; text-align: center; font-family: 'Noto Serif JP', serif;}
.i-dots { display: flex; gap: 6px; justify-content: center; }
.i-dot { width: 4px; height: 4px; background: #666; border-radius: 50%; animation: iDotPulse 1.5s ease-in-out infinite; }
.i-dot:nth-child(2) { animation-delay: 0.2s; } .i-dot:nth-child(3) { animation-delay: 0.4s; }
@keyframes iDotPulse { 0%, 100% { opacity: 0.2; } 50% { opacity: 1; } }
#i-sec4 { background: #0a0a0a; flex-direction: column; gap: 16px; }
.i-logo-sub { font-size: 14px; color: #aaa; letter-spacing: 0.4em; text-align: center; font-family: 'Cinzel', serif;}
.i-enter { font-size: 11px; color: #c8a96e; letter-spacing: 0.5em; border: 1px solid #c8a96e; padding: 10px 32px; cursor: pointer; margin-top: 12px; opacity: 0.7; transition: all 0.3s; font-family: 'Cinzel', serif;}
.i-enter:hover { opacity: 1; background: rgba(200, 169, 110, 0.1); }

/* ========== スマホ・タブレット用レスポンシブ調整 ========== */
@media screen and (max-width: 768px) {
    /* トップページ見出し */
    h1.top-content-hero, h1.gls-hero { font-size: 18px !important; }
    .top-content-hero-sub, .gls-hero-sub { font-size: 10px !important; margin-bottom: 20px; }
    
    /* イントロアニメーションの文字サイズ調整 */
    #i-sec1 { padding-right: 5%; }
    .i-large { font-size: 24px; }
    .i-small { font-size: 12px; }
    .i-text-vert { font-size: 16px; }
    .i-accent { font-size: 24px; }
    .i-logo-sub { font-size: 11px; }
    .i-catch { font-size: 12px; }
}

/* ========== 用語集・索引ページ用CSS ========== */
.idx-badge{display:inline-block;font-size:9px;color:#5a5a5a !important;border:1px solid #333;padding:2px 8px;letter-spacing:0.2em;margin-bottom:16px;}
.idx-eyebrow{font-size:11px;color:#555 !important;letter-spacing:0.4em;margin-bottom:12px;}
h1.idx-hero{font-size:24px;color:#e8e0d0 !important;font-weight:300;line-height:1.8;margin:0 0 6px;letter-spacing:0.05em;}
.idx-hero-sub{font-size:12px;color:#888 !important;letter-spacing:0.2em;font-style:italic;margin-bottom:24px;}
.idx-divider{width:60px;height:1px;background:#c8a96e;opacity:0.5;margin-bottom:24px;}
.idx-search-bar{display:flex;gap:8px;margin-bottom:12px;align-items:center;}
.idx-search-input{flex:1;background:#1a1a1a;border:1px solid #333;color:#e8e0d0 !important;padding:8px 12px;font-family:'Noto Serif JP',serif;font-size:12px;outline:none;}
.idx-search-input:focus{border-color:#c8a96e;}
.idx-detail-btn{background:#1a1a1a;border:1px solid #333;color:#888 !important;padding:8px 14px;font-size:11px;cursor:pointer;letter-spacing:0.1em;white-space:nowrap;}
.idx-detail-btn.open{border-color:#c8a96e;color:#c8a96e !important;}
.idx-tag-panel{display:none;background:#161616;border:1px solid #2a2a2a;padding:14px;margin-bottom:12px;}
.idx-tag-panel.open{display:block;}
.idx-tag-group-label{font-size:9px;color:#555 !important;letter-spacing:0.2em;margin-bottom:8px;}
.idx-tag-list{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px;}
.idx-tag{font-size:10px;color:#666 !important;border:1px solid #2a2a2a;padding:3px 10px;cursor:pointer;letter-spacing:0.05em;}
.idx-tag.on{color:#c8a96e !important;border-color:#c8a96e;background:rgba(200,169,110,0.06);}
.idx-tag-reset{font-size:10px;color:#555 !important;cursor:pointer;letter-spacing:0.1em;}
.idx-tag-reset:hover{color:#888 !important;}
.idx-kana-bar{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:20px;}
.idx-kana{font-size:11px;color:#555 !important;background:#1a1a1a;border:1px solid #222;padding:4px 10px;cursor:pointer;}
.idx-kana.has{color:#b0a898 !important;}
.idx-kana:hover{color:#c8a96e !important;border-color:#3a3020;}
.idx-section{margin-bottom:24px;}
.idx-section-head{font-size:11px;color:#555 !important;letter-spacing:0.3em;border-bottom:1px solid #222;padding-bottom:6px;margin-bottom:12px;}
.idx-entry{padding:14px 16px;border-bottom:none;background:#1e1e1e;margin-bottom:4px;cursor:pointer;transition:border-left 0.2s;}
.idx-entry:hover{border-left:2px solid #c8a96e;padding-left:14px;}
.idx-entry:last-child{border-bottom:none;}
.idx-level{font-size:9px;padding:1px 6px;letter-spacing:0.1em;margin-right:4px;}
.lv-basic,.lv-intermediate,.lv-advanced{color:#8aaabb !important;border:1px solid #2a4a55;}
.idx-entry.hidden{display:none;}
.idx-head{display:flex;align-items:baseline;gap:10px;margin-bottom:6px;flex-wrap:wrap;}
.idx-term{font-size:15px;color:#e8e0d0 !important;font-weight:700;letter-spacing:0.05em;}
.idx-kana-label{font-size:11px;color:#555 !important;letter-spacing:0.15em;}
.idx-article{font-size:9px;color:#8aaabb !important;border:1px solid #2a4a55;padding:1px 6px;cursor:pointer;}
.idx-article:hover{color:#c8a96e !important;border-color:#c8a96e;}
.idx-tags{margin-bottom:6px;}
.dict-list{display:flex;flex-direction:column;gap:4px;}
.dict-entry{background:#1e1e1e;padding:16px 20px;cursor:pointer;transition:border-left 0.2s;}
.dict-entry:hover{border-left:2px solid #c8a96e;padding-left:18px;}
.dict-head{display:flex;align-items:baseline;gap:10px;margin-bottom:6px;flex-wrap:wrap;}
.dict-term{font-size:16px;color:#e8e0d0 !important;font-weight:700;letter-spacing:0.05em;}
.dict-reading{font-size:11px;color:#555 !important;letter-spacing:0.15em;}
.dict-tags{margin-bottom:8px;}
.dict-tag-label{display:inline-block;font-size:9px;color:#c8a96e !important;border:1px solid #3a3020;padding:1px 6px;margin-right:4px;}
.dict-body{font-size:12px;color:#b0a898 !important;line-height:2.2;padding-left:12px;border-left:2px solid #3a3020;}
.dict-article{font-size:9px;color:#8aaabb !important;border:1px solid #2a4a55;padding:1px 6px;cursor:pointer;}
.dict-article:hover{color:#c8a96e !important;border-color:#c8a96e;}
.idx-tag-label{display:inline-block;font-size:9px;color:#c8a96e !important;border:1px solid #3a3020;padding:1px 6px;margin-right:4px;}
.idx-body{font-size:12px;color:#888 !important;line-height:2;padding-left:12px;border-left:2px solid #2a2a2a;}
.idx-no-result{font-size:12px;color:#555 !important;text-align:center;padding:32px 0;display:none;}
.dict-badge{display:inline-block;font-size:9px;color:#5a5a5a !important;border:1px solid #333;padding:2px 8px;letter-spacing:0.2em;margin-bottom:16px;}
.dict-eyebrow{font-size:11px;color:#555 !important;letter-spacing:0.4em;margin-bottom:12px;}
h1.dict-hero{font-size:24px;color:#e8e0d0 !important;font-weight:300;line-height:1.8;margin:0 0 6px;letter-spacing:0.05em;}
.dict-hero-sub{font-size:12px;color:#888 !important;letter-spacing:0.2em;font-style:italic;margin-bottom:24px;}
.dict-divider{width:60px;height:1px;background:#c8a96e;opacity:0.5;margin-bottom:20px;}
.dict-lead{font-size:12px;color:#888 !important;line-height:2;margin-bottom:28px;border-left:2px solid #3a3020;padding-left:16px;}
.dict-section-label{font-size:10px;color:#555 !important;letter-spacing:0.3em;border-bottom:1px solid #222;padding-bottom:6px;margin:28px 0 12px;}
.dict-entry{background:#1e1e1e;padding:16px 20px;margin-bottom:4px;cursor:default;}
.dict-head{display:flex;align-items:baseline;gap:10px;margin-bottom:6px;flex-wrap:wrap;}
.dict-term{font-size:16px;color:#e8e0d0 !important;font-weight:700;letter-spacing:0.05em;}
.dict-reading{font-size:11px;color:#555 !important;letter-spacing:0.15em;}
.dict-article{font-size:9px;color:#8aaabb !important;border:1px solid #2a4a55;padding:1px 6px;cursor:pointer;}
.dict-article:hover{color:#c8a96e !important;border-color:#c8a96e;}
.dict-tags{margin-bottom:8px;}
.dict-tag{display:inline-block;font-size:9px;color:#c8a96e !important;border:1px solid #3a3020;padding:1px 6px;margin-right:4px;}
.dict-body{font-size:13px;color:#b0a898 !important;line-height:2.3;border-left:2px solid #2a2a2a;padding-left:14px;}

/* ========== エリア一覧ページ用CSS ========== */
.area-legend{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:14px;}
.area-legend-item{display:flex;align-items:center;gap:5px;font-size:10px;color:#666 !important;}
.area-legend-dot{width:7px;height:7px;border-radius:50%;}
.area-map-wrap{background:#0e0e0e;border:1px solid #222;margin-bottom:20px;padding:8px;}
.area-map-label{font-size:8px;letter-spacing:.3em;color:#333 !important;margin-bottom:4px;}
.area-list{display:flex;flex-direction:column;gap:3px;}
.area-row{display:grid;grid-template-columns:80px 1fr 64px;align-items:center;gap:12px;padding:12px 16px;background:#1a1a1a;border-left:2px solid transparent;cursor:pointer;transition:border-left-color .2s,background .2s;}
.area-row:hover{border-left-color:#c8a96e !important;background:#1e1c18 !important;}
.area-world-row{background:#161616 !important;border-left:2px solid #c8a96e !important;margin-bottom:8px;cursor:default;}
.area-world-row:hover{background:#161616 !important;}
.area-row-disabled{opacity:.35;cursor:default;pointer-events:none;}
.area-row-num{font-size:9px;color:#444 !important;letter-spacing:.15em;}
.area-row-name{font-size:13px;color:#e8e0d0 !important;font-weight:700;margin-bottom:3px;}
.area-row-reading{font-size:10px;font-weight:400;color:#555 !important;}
.area-row-desc{font-size:11px;color:#5a5248 !important;line-height:1.9;}
.area-row-status{text-align:right;}
.area-status{font-size:9px;padding:2px 7px;letter-spacing:.1em;display:inline-block;}
.s-city{color:#8aaabb !important;border:1px solid #2a4a55;}
.s-unrest{color:#c8906e !important;border:1px solid #553020;}
.s-decay{color:#8a9e7a !important;border:1px solid #2a3a20;}
.s-gate{color:#888 !important;border:1px solid #444;}
.s-tbd{color:#555 !important;border:1px solid #333;}