/* =========================================================
   LP 共有カード — 「共有カード UIデザイン.html（全9テンプレート）」より移植
   ds/plantory.css のトークン（--font-body 等）に依存
   ========================================================= */
:root{--font-hand:"Yomogi",cursive;--font-mono:"DM Mono",monospace}

/* ===== 共有カード基底（4:5）===== */
.scard{width:100%;aspect-ratio:4/5;border-radius:22px;overflow:hidden;position:relative;
  color:var(--ink);display:flex;flex-direction:column;box-shadow:0 24px 46px -28px rgba(44,58,46,.55)}
.scard .credit{display:flex;align-items:center;justify-content:center;gap:6px;
  font:700 8px var(--font-en);letter-spacing:.13em;white-space:nowrap}
.scard .credit .lf{width:12px;height:12px;display:inline-flex}
.scard .credit .lf svg{width:12px;height:12px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.scard .sc-name{font:700 16px var(--font-body);text-align:center;letter-spacing:-.01em}
.scard .sc-days{text-align:center;color:#5f6a60;font-size:9px;margin-top:3px}
.scard .sc-foot{text-align:center;font:700 8.5px var(--font-en);letter-spacing:.08em;color:#5f6a60;margin-top:auto;padding-top:14px;display:flex;align-items:center;justify-content:center;gap:6px}
.scard .sc-foot .lf{width:13px;height:13px;color:var(--accent)}
.scard .sc-foot .lf svg{width:13px;height:13px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* ===== 標準3種（J / K / L）===== */
.scard.j,.scard.k,.scard.l{background:linear-gradient(160deg,#fffdf7,#f1f2ea);border:1px solid var(--line);padding:20px 18px 16px}
/* J: シンプル */
.j .pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px;flex:1}
.j figure{margin:0;display:flex;flex-direction:column}
.j .ph{flex:1;min-height:0;border-radius:14px;background:center/cover #d7ddd2}
.j figcaption{margin-top:9px;text-align:center}
.j .en{font:700 8px var(--font-en);letter-spacing:.13em;color:var(--accent);display:block}
.j .dt{font-size:10px;margin-top:2px}
/* K: 写真大きめ — FIRST小→TODAY大。サイズ差で成長を語り、重なりはコーナーのみ */
.k .sc-stage{position:relative;flex:1;margin-top:16px}
.k .ph{position:absolute;border-radius:16px;background:center/cover #d7ddd2;box-shadow:0 12px 26px -16px rgba(20,28,22,.6)}
.k .ph-a{left:2%;top:0;width:44%;height:40%}
.k .ph-b{right:0;bottom:3%;width:76%;height:68%;border:3px solid #fffdf7}
.k .plab{position:absolute;left:8px;top:8px;z-index:2;padding:3px 8px;border-radius:999px;
  background:rgba(255,253,247,.92);color:var(--accent);font:700 7.5px var(--font-en);letter-spacing:.1em}
.k .range{text-align:center;font-size:10px;margin-top:12px;color:var(--ink)}
/* L: ストーリー */
.l .sc-title{text-align:center;font:700 19px var(--font-display);letter-spacing:-.02em;margin-bottom:13px}
.l .pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex:1}
.l .ph{border-radius:14px;background:center/cover #d7ddd2}
.l .sc-name{margin-top:14px}
.l .quote{text-align:center;font-size:10px;color:var(--accent);margin-top:5px}

/* ===== 成長ポスター（ボタニカル・レコード）===== */
.poster2{background:#f3eedf;border:1px solid #d9d1bd;padding:16px 16px 30px;color:#294436;isolation:isolate}
.poster2::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.34;
  background-image:radial-gradient(#796f5c .8px,transparent 1.1px);background-size:9px 9px}
.poster2 .ph-head{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:10px;border-bottom:1.5px solid #a8aa97}
.poster2 .eyebrow2{margin:0;color:#4f5d52;font:700 7px var(--font-en);letter-spacing:.18em}
.poster2 .pname{margin:5px 0 0;font-family:"Shippori Mincho","Hiragino Mincho ProN",serif;font-size:23px;font-weight:600;line-height:1;letter-spacing:-.03em}
.poster2 .subt{margin:4px 0 0;color:#5c665e;font-family:Georgia,serif;font-style:italic;font-size:8.5px}
.poster2 .recno{margin:0;color:#4f5d52;font:700 8px var(--font-en);letter-spacing:.08em}
.poster2 .stage2{position:relative;height:190px;margin-top:12px}
.poster2 .pimg{position:absolute;width:49%;height:65%;border:5px solid #fbf8ee;background:center/cover #d7ddd2;
  box-shadow:0 12px 18px -12px rgba(25,35,28,.7)}
.poster2 .p-first{left:0;top:0;transform:rotate(-2.5deg)}
.poster2 .p-now{right:0;bottom:0;transform:rotate(2deg)}
.poster2 .dlab{position:absolute;z-index:3;padding:4px 8px;border:1.5px solid #b8aa88;background:#f8f2df;color:#4c5c50;
  box-shadow:0 6px 10px -8px #111;font:700 7px var(--font-en);letter-spacing:.06em;white-space:nowrap}
.poster2 .l-first{left:6px;top:114px;transform:rotate(-2.5deg)}
.poster2 .l-now{right:6px;bottom:-3px;transform:rotate(2deg)}
.poster2 .gpath{position:absolute;z-index:1;left:48%;top:55px;width:48px;height:62px;
  border-right:2px dashed #79907c;border-bottom:2px dashed #79907c;border-radius:0 0 24px 0;transform:rotate(10deg)}
.poster2 .gpath::after{content:"";position:absolute;right:-4px;top:-2px;width:7px;height:7px;border-radius:50%;background:#496b57}
.poster2 .pfoot{display:flex;justify-content:space-between;align-items:flex-end;margin-top:12px}
.poster2 .days2 strong{display:block;font:700 19px var(--font-en);letter-spacing:-.04em;line-height:1;white-space:nowrap}
.poster2 .days2 span{display:block;margin-top:5px;color:#566156;font-size:8px;white-space:nowrap}
.poster2 .stamp2{width:56px;height:56px;display:grid;place-items:center;border:2.5px solid #496b57;border-radius:50%;
  color:#496b57;text-align:center;transform:rotate(-8deg);font:700 7px var(--font-en);line-height:1.35;letter-spacing:.06em}
.poster2 .brand2{position:absolute;left:50%;bottom:13px;display:flex;align-items:center;gap:7px;transform:translateX(-50%);
  color:#536158;font:700 8px var(--font-en);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.poster2 .brand2 .lf{width:11px;height:11px;display:inline-flex}
.poster2 .brand2 .lf svg{width:11px;height:11px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* ===== M — マガジン ===== */
.mag{background:#11160f}
.mag .bg{position:absolute;inset:0;background:center 38%/cover}
.mag .grad{position:absolute;inset:0;background:linear-gradient(rgba(10,16,11,.45),transparent 26%),linear-gradient(transparent 30%,rgba(12,18,12,.18) 48%,rgba(10,16,11,.9) 100%)}
.mag .top{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-start;padding:20px 20px 0;color:#fff}
.mag .mast{font:700 26px var(--font-en);letter-spacing:-.04em;line-height:.9}
.mag .mast em{display:block;font:600 9px var(--font-en);font-style:normal;letter-spacing:.34em;opacity:.82;margin-top:5px}
.mag .issue{text-align:right;font:700 8px var(--font-en);letter-spacing:.16em;opacity:.9;line-height:1.5}
.mag .inset{position:absolute;z-index:3;top:70px;right:20px;width:78px;height:96px;margin:0;
  border-radius:4px;background:center/cover;box-shadow:0 12px 26px -12px rgba(0,0,0,.7);border:4px solid #fff;transform:rotate(3deg)}
.mag .inset figcaption{position:absolute;top:-9px;left:-5px;background:var(--accent);color:#fff;
  font:700 7px var(--font-en);letter-spacing:.1em;padding:2px 7px;border-radius:3px;transform:rotate(-3deg)}
.mag .foot{position:relative;z-index:2;margin-top:auto;padding:0 20px 18px;color:#fff}
.mag .kicker{font:700 8px var(--font-en);letter-spacing:.22em;color:#bfe6cb;margin-bottom:7px}
.mag .bigname{font:700 40px/0.95 var(--font-display);letter-spacing:-.03em}
.mag .days{margin-top:8px;font-size:11px;font-weight:700;opacity:.95}
.mag .line2{margin-top:4px;font-size:9.5px;opacity:.82;line-height:1.5}
.mag .credit{margin-top:15px;color:rgba(255,255,255,.85);justify-content:flex-start}

/* ===== O — ポラロイド・コラージュ ===== */
.scrap{background:
    radial-gradient(120% 80% at 80% 0%,#fffdf6,rgba(255,253,246,0)),
    repeating-linear-gradient(102deg,#f4efe2 0 3px,#f1ece0 3px 6px),
    #f3eee1;padding:18px 16px 14px;justify-content:flex-start}
.scrap .sc-head{font:400 22px var(--font-hand);color:var(--accent);text-align:center;margin-bottom:4px;transform:rotate(-1deg)}
.scrap .sc-stage{position:relative;flex:1;margin:6px 0}
.scrap .pol{position:absolute;width:55%;background:#fffdf8;padding:7px 7px 30px;
  box-shadow:0 14px 26px -14px rgba(40,40,30,.55);margin:0}
.scrap .pol .img{aspect-ratio:1;background:center/cover #d7ddd2}
.scrap .pol figcaption{position:absolute;left:4px;right:4px;bottom:6px;text-align:center;
  font:400 9.5px/1.3 var(--font-hand);color:#5a5448}
.scrap .pol.a{left:2%;top:2%;transform:rotate(-5deg);z-index:2}
.scrap .pol.b{right:2%;bottom:0;transform:rotate(4deg);z-index:1}
.scrap .tape{position:absolute;width:54px;height:17px;background:rgba(150,178,150,.42);
  box-shadow:0 1px 2px rgba(0,0,0,.06);top:-7px;left:50%;transform:translateX(-50%) rotate(-3deg)}
.scrap .pol.b .tape{background:rgba(196,160,120,.4);transform:translateX(-50%) rotate(5deg)}
.scrap .foot{text-align:center;margin-top:6px}
.scrap .foot b{font:700 13px var(--font-display);color:var(--ink)}
.scrap .foot .meta{font-size:9px;color:#5f6a60;margin-top:1px}
.scrap .credit{margin-top:10px;color:#5f6a60}

/* ===== P — ジャーニー ===== */
.journey{background:linear-gradient(168deg,#f3f7ef,#e7efe4);padding:18px 18px 14px}
.journey .sc-head{text-align:center}
.journey .sc-head .k{font:700 8px var(--font-en);letter-spacing:.24em;color:var(--accent)}
.journey .sc-head b{display:block;font:700 19px var(--font-display);letter-spacing:-.02em;margin-top:4px;color:var(--ink)}
.journey .sc-stage{position:relative;flex:1;margin-top:6px}
.journey .vine{position:absolute;inset:0;width:100%;height:100%}
.journey .node{position:absolute;margin:0;width:112px;height:112px;border-radius:50%;
  background:center/cover #d7ddd2;border:5px solid #fffdf7;box-shadow:0 14px 26px -14px #304a38}
.journey .node figcaption{position:absolute;font:700 8px var(--font-en);letter-spacing:.08em;color:var(--ink);white-space:nowrap}
.journey .node.a{top:2%;left:2%}
.journey .node.a figcaption{bottom:-16px;left:6px}
.journey .node.b{bottom:4%;right:2%}
.journey .node.b figcaption{top:-16px;right:6px}
.journey .mile{position:absolute;display:flex;align-items:center;gap:5px;
  background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:999px;
  padding:3px 9px 3px 6px;font-size:8px;font-weight:700;color:var(--accent);white-space:nowrap;box-shadow:0 6px 14px -10px #304a38}
.journey .mile .lf{width:11px;height:11px;display:inline-flex}
.journey .mile .lf svg{width:11px;height:11px;fill:none;stroke:var(--accent);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.journey .mile.m1{top:30%;right:6%}
.journey .mile.m2{top:54%;left:4%}
.journey .foot{display:flex;align-items:center;justify-content:space-between;margin-top:8px}
.journey .foot .days{font-size:10px;font-weight:700;color:var(--ink)}
.journey .credit{color:#5f6a60}

/* ===== X — 今日のひとこと ===== */
.daily{padding:0}
.daily .ph{position:absolute;inset:0;background:center 38%/cover}
.daily .grad{position:absolute;inset:0;background:linear-gradient(rgba(8,14,9,.4),transparent 24%),linear-gradient(transparent 36%,rgba(10,16,11,.12) 52%,rgba(8,14,9,.88) 100%)}
.daily .top{position:relative;z-index:2;display:flex;align-items:center;gap:7px;padding:16px 18px 0;color:#fff}
.daily .top .wx{display:inline-flex;align-items:center;gap:5px;background:rgba(255,255,255,.2);
  backdrop-filter:blur(6px);padding:5px 11px 5px 9px;border-radius:999px;font:700 9px var(--font-body)}
.daily .top .wx svg{width:14px;height:14px;fill:none;stroke:#ffe6a3;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.daily .top time{font:700 9px var(--font-en);letter-spacing:.1em;opacity:.92}
.daily .foot{position:relative;z-index:2;margin-top:auto;padding:0 18px 17px;color:#fff}
.daily .note{font:400 19px var(--font-hand);line-height:1.5;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.daily .meta{display:flex;align-items:center;gap:9px;margin-top:11px}
.daily .meta .nm{font:700 13px var(--font-display)}
.daily .meta .cnd{display:inline-flex;align-items:center;gap:5px;background:rgba(255,255,255,.2);
  backdrop-filter:blur(6px);padding:3px 10px 3px 7px;border-radius:999px;font-size:8px;font-weight:700;white-space:nowrap}
.daily .meta .cnd .lf{width:12px;height:12px;display:inline-flex}
.daily .meta .cnd .lf svg{width:12px;height:12px;fill:none;stroke:#cfe7b8;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.daily .credit{margin-top:13px;color:rgba(255,255,255,.82);justify-content:flex-start}

/* ===== AE — 植物札（ネームタグ）：LPの .tag と衝突しないよう .scard スコープ ===== */
.scard.nametag{background:linear-gradient(165deg,#eaeee5,#dde4d9);align-items:center;justify-content:flex-start;padding-top:8px}
.scard.nametag .str{width:1.5px;height:54px;background:#9aa48f}
.scard.nametag .tg{position:relative;width:76%;margin-top:-2px;transform:rotate(-2.5deg);
  background:linear-gradient(160deg,#fbf6ea,#f3ecd9);border-radius:10px;
  padding:30px 16px 16px;box-shadow:0 18px 30px -18px rgba(50,45,25,.55),0 0 0 1px rgba(150,130,80,.22)}
.scard.nametag .hole{position:absolute;top:13px;left:50%;transform:translateX(-50%);width:15px;height:15px;border-radius:50%;
  background:#e7e1cf;box-shadow:inset 0 1px 3px rgba(0,0,0,.35)}
.scard.nametag .ph{width:100%;aspect-ratio:4/3.4;background:center 28%/cover #d7ddd2;border-radius:6px}
.scard.nametag .nm{font:700 18px var(--font-display);letter-spacing:-.01em;margin-top:12px;text-align:center}
.scard.nametag .sp{font:500 8.5px var(--font-mono);letter-spacing:.14em;color:#7a6c4c;text-align:center;margin-top:3px;text-transform:uppercase}
.scard.nametag .rows{margin-top:12px;border-top:1px dashed #cdbf9f;padding-top:11px;display:grid;grid-template-columns:auto 1fr;gap:6px 12px}
.scard.nametag .rows b{font:700 7.5px var(--font-en);letter-spacing:.08em;color:#6f6042;align-self:center}
.scard.nametag .rows span{font-size:10px;color:var(--ink)}
.scard.nametag .credit{margin-top:13px;color:#5f6a60;justify-content:center}

/* LP（カード幅246px）向けの詰め：元は300px幅基準のため縦がはみ出す */
/* ジャーニー: ステージが縦に縮むため、ノードを四隅に寄せ、ピルは衝突しない上右/下左へ再配置 */
.share-item .journey .node{width:92px;height:92px}
.share-item .journey .node.a{top:0;left:0}
.share-item .journey .node.b{bottom:2%;right:0}
.share-item .journey .mile{font-size:7.5px;padding:3px 8px 3px 5px}
.share-item .journey .mile.m1{top:10%;right:0}
.share-item .journey .mile.m2{top:auto;bottom:6%;left:0}
.share-item .journey .foot{flex-direction:column;align-items:center;gap:4px}
.share-item .scard.nametag .str{height:26px}
.share-item .scard.nametag .tg{padding:24px 14px 12px}
.share-item .scard.nametag .ph{aspect-ratio:4/2.9}
.share-item .scard.nametag .nm{margin-top:9px}
.share-item .scard.nametag .rows{margin-top:9px;padding-top:9px;gap:5px 12px}
.share-item .scard.nametag .credit{margin-top:10px}