/* ============================================================
   LIGHT UP COFFEE テーマ（base.css の緑/クリームを上書き）
   白背景・ソフトグレー本文・システムsans・角丸なし・中央見出し
   ============================================================ */
:root{
  --cream:#ffffff; --surface:#ffffff; --surface2:#fafaf9;
  --green:#3a3a3a; --green-mid:#6f6f6f; --leaf:#9a9a9a;
  --coffee:#5c5c5c; --cherry:#c0503f;
  --ink:#4a4a4a; --muted:#9a9a9a; --line:#e9e7e3;
  --shadow:0 1px 2px rgba(0,0,0,.03),0 10px 30px rgba(0,0,0,.045);
}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",
  "Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,Arial,sans-serif;
  background:#fff;color:var(--ink);letter-spacing:.01em}
.wrap{max-width:1000px}

/* ヘッダー：白・中央ロゴ風・薄い下線 */
.top{background:#fff;color:var(--ink);box-shadow:none;border-bottom:1px solid var(--line);
  padding:20px 0 18px}
.top .brand{justify-content:center;color:var(--ink);font-weight:700;letter-spacing:.14em;font-size:13px}
.top .brand .dot{background:var(--cherry);box-shadow:none}
.top .plot-h{justify-content:center;text-align:center;margin-top:12px}
.top .plot-h h1{color:var(--ink);font-weight:700;letter-spacing:.04em}
.top .chips{justify-content:center}
.top .chip{background:#f4f2ee;border:1px solid var(--line);color:#6a6a6a}
.top .banner{background:#f7f5f1;color:#5c5c5c;border:1px solid var(--line)}

/* セクション見出し：中央・レター spacing・細い区切り */
.sec-h{flex-direction:column;align-items:center;text-align:center;gap:6px;margin-bottom:20px}
.sec-h h2{color:var(--ink);font-size:16px;font-weight:700;letter-spacing:.12em}
.sec-h .ln{display:none}
.sec-h .sub{color:var(--muted)}

/* 角丸なしの四角い要素（LIGHT UP流） */
.badge,.date,.chip,.book,.an-link,.lcard,.tile,.stage,.report,.learn-feat,.tour,
.photo,.frame .photo,.planphoto,.mapwrap,.announce{border-radius:2px}
.badge{background:var(--cherry);box-shadow:none}

/* リンク下線色など控えめに */
a{color:inherit}

/* 知識カードをリンク化しても見た目を保つ */
a.lcard{display:block;text-decoration:none;color:inherit;transition:transform .12s ease, box-shadow .12s ease}
a.lcard:hover{transform:translateY(-2px);box-shadow:0 4px 14px rgba(50,40,20,.10),0 10px 34px rgba(50,40,20,.07)}
a.lcard .t{color:var(--ink)}

/* コーヒーが届くまでの道のり（全体像＋現在地を常に読めるように） */
.stage .lab-prog{display:block;margin-top:4px;font-size:12px;color:var(--green-mid);font-weight:700}
.step .st-num{font-weight:700;opacity:.45;margin-right:2px}
.step.now .st-num,.step.done .st-num{opacity:1}
.nowtag{display:inline-block;margin-left:5px;background:var(--cherry);color:#fff;font-size:9.5px;
  font-weight:700;padding:1px 6px;border-radius:100px;vertical-align:middle;letter-spacing:.02em}
@media(max-width:720px){
  /* モバイルは縦のタイムラインにして、全ステップのラベルを必ず見せる */
  .steps{flex-direction:column;align-items:stretch;gap:0}
  .step{flex:none;display:flex;align-items:flex-start;gap:12px;text-align:left;
    font-size:12.5px;padding:0 0 15px 0}
  .step .node{margin:2px 0 0;flex:none}
  .step .bar{display:block;left:6px;top:16px;width:3px;height:100%}
  .step.now .node{margin-left:-1px}
  .step.now .bar{left:7px}
  .step:first-child .bar{display:none}
  .step .st-t{display:block !important;line-height:1.5}
  .step .st-t small{margin-left:6px}
}

/* Markdown由来のレポート内引用を .quote 相当に */
.report blockquote.quote p{font-size:13.5px;color:#5b5648;font-style:italic;margin:0 0 9px}
.report blockquote.quote p:first-child{font-size:11px;color:var(--green-mid);font-weight:700;font-style:normal;margin-bottom:6px}
.report blockquote.quote p:last-child{margin-bottom:0}
.report blockquote.quote a{font-size:12.5px;color:var(--coffee);font-weight:700;text-decoration:none;font-style:normal}

/* 記事ページ */
.article-page{background:var(--surface);border:1px solid var(--line);border-radius:14px;
  padding:26px 28px;box-shadow:var(--shadow);margin-top:22px}
.article-page .cat{font-size:11.5px;color:var(--green);font-weight:700;letter-spacing:.03em}
.article-page h1{font-size:24px;margin:8px 0 4px;color:var(--ink);line-height:1.35}
.article-page .sub{font-size:13px;color:var(--muted);margin-bottom:18px}
.article-page p{font-size:14.5px;color:#4d4941;margin:0 0 15px;line-height:1.9}
.article-page blockquote{margin:16px 0;background:#FBF7EE;border-left:3px solid var(--leaf);
  border-radius:0 10px 10px 0;padding:12px 16px;color:#5b5648;font-size:13.5px}
.article-page blockquote p{margin:0}
.article-page .prov{background:#FBF3E4;border:1px solid #E8D9B8;border-radius:10px;
  padding:11px 14px;font-size:12.5px;color:#8a6a2f;margin:0 0 16px}
/* SPEC 3.2: 覚えておきたい一言 */
.article-page .takeaway{margin:22px 0 4px;background:linear-gradient(135deg,#fff,#FCF7EC);
  border:1px solid var(--line);border-left:4px solid var(--coffee);border-radius:12px;padding:14px 18px}
.article-page .takeaway .tk-lab{font-size:11px;color:var(--coffee);font-weight:700;letter-spacing:.04em;margin-bottom:6px}
.article-page .takeaway p{margin:0;font-size:15px;font-weight:700;color:var(--ink);line-height:1.7}
/* SPEC 3.2: 関連記事 */
.article-page .related{margin-top:24px;border-top:1px solid var(--line);padding-top:16px}
.article-page .related .rel-lab{font-size:11.5px;color:var(--green);font-weight:700;letter-spacing:.03em;margin-bottom:10px}
.relcard{display:flex;align-items:center;gap:10px;padding:11px 13px;margin-bottom:8px;
  background:var(--surface2);border:1px solid var(--line);border-radius:10px;text-decoration:none;
  transition:transform .12s ease,box-shadow .12s ease}
.relcard:hover{transform:translateY(-1px);box-shadow:var(--shadow)}
.relcard .rid{font-size:10.5px;color:var(--leaf);font-weight:700;flex:none}
.relcard .rt{font-size:13.5px;color:var(--ink);font-weight:700}
.backlink{display:inline-block;margin-top:18px;font-size:13px;color:var(--coffee);
  font-weight:700;text-decoration:none}
.crumb{display:inline-block;margin-top:4px;font-size:12.5px;color:var(--coffee);
  font-weight:700;text-decoration:none}
@media(max-width:720px){.article-page{padding:20px 18px}}

/* オンラインイベント（マイページ） */
.ev-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.ev-card{background:var(--surface);border:1px solid var(--line);border-radius:2px;
  padding:16px 18px;box-shadow:var(--shadow)}
.ev-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ev-date{font-size:12px;color:var(--coffee);font-weight:700}
.ev-badge{font-size:10.5px;color:var(--muted);border:1px solid var(--line);border-radius:100px;padding:2px 9px}
.ev-badge.ev-open{color:#fff;background:var(--cherry);border-color:var(--cherry)}
.ev-title{font-size:16px;font-weight:700;color:var(--ink);margin:8px 0 5px}
.ev-desc{font-size:12.5px;color:#5b5648;line-height:1.7}
.ev-apply{display:inline-block;margin-top:12px;background:var(--ink);color:#fff;border:0;border-radius:2px;
  font-weight:700;font-size:13px;letter-spacing:.05em;padding:9px 22px;text-decoration:none;cursor:pointer}
.ev-apply:hover{filter:brightness(1.12)}
.ev-apply-soon{opacity:.6;cursor:default}
.ev-zoom{font-size:11px;color:var(--muted);margin-top:8px}
@media(max-width:720px){.ev-grid{grid-template-columns:1fr}}

/* 豆の送り先 */
.ship-card{background:var(--surface);border:1px solid var(--line);border-radius:2px;
  padding:18px 20px;box-shadow:var(--shadow);display:flex;flex-wrap:wrap;align-items:center;
  justify-content:space-between;gap:14px}
.ship-cur{display:flex;flex-direction:column;gap:3px}
.ship-k{font-size:11.5px;color:var(--muted)}
.ship-v{font-size:14.5px;color:var(--ink);font-weight:700}
.ship-btn{display:inline-block;background:#fff;color:var(--ink);border:1px solid var(--ink);
  border-radius:2px;font-weight:700;font-size:13px;letter-spacing:.04em;padding:9px 20px;
  text-decoration:none;cursor:pointer}
.ship-btn:hover{background:var(--ink);color:#fff}

/* 仮イラスト（後日、空撮/ラフ地図に差し替え）にマーカーを付ける */
.lp-provisional{position:relative}
.lp-provisional::after{content:"仮";position:absolute;top:8px;right:8px;z-index:5;
  background:rgba(74,74,74,.82);color:#fff;font-size:10.5px;font-weight:700;
  letter-spacing:.1em;padding:2px 9px;border-radius:2px}