:root{
  --c-bg:#f7f3ef;           /* 柔らかい生成り */
  --c-card:#fff;
  --c-text:#2a1f19;         /* 焙煎コーヒー */
  --c-accent:#c95f2a;       /* テラコッタ/焦がしオレンジ */
  --c-accent-2:#8b5e3c;     /* 木の樹皮ブラウン */
  --c-muted:#e9dfd7;
  --shadow:0 6px 20px rgba(0,0,0,.06);
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;color:var(--c-text);background:var(--c-bg)}
a{color:inherit;text-decoration:none}
.container{max-width:1100px;margin:0 auto;padding:16px}

/* Header */
.site-header{background:linear-gradient(180deg,#fff,rgba(255,255,255,.9));border-bottom:1px solid #eadfd6;position:sticky;top:0;z-index:10;backdrop-filter:saturate(1.2) blur(6px)}
.logo{font-size:20px;margin:0}
.top-tabs .tabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.top-tabs .tab{display:flex;gap:8px;align-items:center;background:#f3ebe4;padding:8px;border-radius:12px;border:1px solid #e6d8cd}
.top-tabs input, .top-tabs select{padding:7px 10px;border:1px solid #d9c8bb;border-radius:10px;background:#fff}
.top-tabs button{padding:8px 12px;border:0;background:var(--c-accent);color:#fff;border-radius:10px;cursor:pointer;box-shadow:var(--shadow)}
.top-tabs button:hover{filter:brightness(.95)}

/* Grid / Cards */
.section-title{margin:24px 0 8px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.card{background:var(--c-card);border-radius:16px;overflow:hidden;border:1px solid #eadfd6;display:flex;flex-direction:column;box-shadow:var(--shadow)}
.card .image-wrap{display:block;aspect-ratio:3/2;background:#f0e6dc}
.card img{width:100%;height:100%;object-fit:cover;transition:filter .4s ease, opacity .4s ease}
.card .meta{padding:12px}
.card .title{font-size:18px;margin:0 0 4px}
.card .sub{font-size:13px;color:#6b5446;margin:0}

/* LQIP/blur-up */
.lqip{filter:blur(18px);opacity:.85}
.lqip.is-loaded{filter:blur(0);opacity:1}

/* Detail */
.detail .detail-head{display:flex;gap:16px;align-items:center;margin:8px 0 16px}
.detail .kv{width:320px;max-width:45vw;border-radius:12px;border:1px solid #eadfd6;box-shadow:var(--shadow)}
.panel{background:#fff;border:1px solid #eadfd6;border-radius:14px;padding:14px 16px;margin:16px 0;box-shadow:var(--shadow)}
.cast{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.video-wrap{position:relative;padding-top:56.25%}
.video-wrap iframe{position:absolute;inset:0;width:100%;height:100%}

/* Episodes */
.episodes ul{list-style:none;padding-left:0;margin:0}
.episodes li{margin:8px 0}
.episode-toggle{background:#f3ebe4;border:1px solid #e6d8cd;padding:8px 10px;border-radius:10px;cursor:pointer}
.episode-body{background:#fcf8f4;border:1px dashed #e6d8cd;padding:10px;border-radius:10px;margin-top:6px}

/* Ads */
.ad{margin:12px 0}
.ad-placeholder{background:repeating-linear-gradient(45deg,#fbe7d6,#fbe7d6 10px,#f3d3bd 10px,#f3d3bd 20px);border:1px dashed #d6b299;color:#8b5e3c;border-radius:12px;padding:16px;text-align:center}

/* Footer */
.site-footer{margin-top:40px;background:#fff;border-top:1px solid #eadfd6}
.site-footer p{margin:8px 0;color:#6b5446}