:root{
  --paper:#F6F3EC; --paper2:#EFEBE0; --ink:#1C1B19; --ink2:#57534a; --ink3:#726d61;
  --line:#E1DBCE; --line2:#D3CCBC; --white:#FFFDF8; --accent:#8a5a3c; --good:#2E7167;
  /* --ink3 はクリーム地でのコントラスト確保のためやや暗めに調整 */
  --serif:Georgia,"Times New Roman","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:system-ui,-apple-system,"Hiragino Sans","Yu Gothic UI","Noto Sans JP",sans-serif;
  --maxw:640px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.75;
  background-image:radial-gradient(var(--line) .5px,transparent .5px);background-size:22px 22px}
img,svg{display:block;max-width:100%}
button{font-family:inherit;cursor:pointer}
:focus-visible{outline:2.5px solid var(--ink);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 18px}
.screen{display:none;animation:rise .4s ease}
.screen.active{display:block}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* header */
header{position:sticky;top:0;z-index:40;background:rgba(246,243,236,.9);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.hd{max-width:var(--maxw);margin:0 auto;padding:11px 18px;display:flex;align-items:center;gap:12px}
.brand{font-family:var(--serif);font-size:17px;background:none;border:none;color:inherit;padding:0}
.brand b{font-weight:700}
.hd .sp{flex:1}
.hd a,.hd button.lk{font-size:13px;color:var(--ink2);text-decoration:none;background:none;border:none;padding:6px 4px}
.badge-beta{font-size:11px;color:var(--accent);border:1px solid var(--line2);border-radius:999px;padding:3px 9px;background:var(--white)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--ink);color:var(--paper);
  border:none;padding:16px 26px;border-radius:999px;font-size:17px;font-weight:700;width:100%;transition:transform .15s}
.btn:active{transform:scale(.98)}
.btn.ghost{background:none;border:1px solid var(--line2);color:var(--ink);font-weight:600}
.btn.sm{padding:11px 18px;font-size:14px;width:auto}
.btnrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.btnrow .btn{width:auto;flex:1;min-width:130px}

/* home */
.hero{padding:46px 0 26px;text-align:center}
.hero .ey{font-size:12px;letter-spacing:.28em;color:var(--accent);text-transform:uppercase}
.hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(20px,5.7vw,36px);line-height:1.32;letter-spacing:-.02em;margin:14px 0 0;overflow-wrap:break-word}
.copy{font-family:var(--serif);font-size:clamp(13px,3.6vw,17px);line-height:1.95;color:var(--ink2);text-align:center;margin:26px 0}
.copy p{margin:0 0 18px}
.lead-fig{display:flex;justify-content:center;margin:2px 0 16px}
.lead-fig img{width:clamp(84px,22vw,120px);height:auto;filter:drop-shadow(0 8px 14px rgba(28,27,25,.18));animation:floaty 5.5s ease-in-out infinite alternate;will-change:transform}
@media (prefers-reduced-motion: reduce){.lead-fig img{animation:none}}
.copy .em{color:var(--ink);font-weight:700}
.homecta{position:sticky;bottom:0;background:linear-gradient(180deg,transparent,var(--paper) 30%);padding:18px 0 20px;margin-top:8px}
.meta{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:12px}
.meta span{font-size:12px;color:var(--ink2);background:var(--white);border:1px solid var(--line);border-radius:999px;padding:4px 12px}
.sample{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:18px;margin:22px 0}
.sample .q{font-size:12px;color:var(--accent);letter-spacing:.1em}
.sample p{font-family:var(--serif);font-size:16px;margin:8px 0 0}
.sect-h{font-family:var(--serif);font-size:22px;font-weight:700;margin:30px 0 10px}
.notes{list-style:none;padding:0;margin:14px 0}
.notes li{padding:8px 0 8px 24px;position:relative;font-size:14.5px;color:var(--ink2);border-bottom:1px solid var(--line)}
.notes li::before{content:"—";position:absolute;left:4px;color:var(--ink3)}

/* quiz */
.qtop{padding:16px 0 8px}
.qbar{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--ink2);margin-bottom:8px}
.qbar .th{font-family:var(--serif);font-style:italic;color:var(--ink3)}
.qtrack{height:6px;background:var(--line2);border-radius:99px;overflow:hidden}
.qtrack>i{display:block;height:100%;width:0;background:var(--ink);transition:width .4s}
.scenario{font-family:var(--serif);font-size:clamp(19px,5vw,23px);line-height:1.6;margin:22px 0 20px}
.opt{display:block;width:100%;text-align:left;background:var(--white);border:1.5px solid var(--line2);border-radius:14px;
  padding:16px 16px;margin:11px 0;font-size:15.5px;line-height:1.65;color:var(--ink);transition:all .12s}
.opt:active{transform:scale(.99)}
.opt.selected{border-color:var(--ink);background:var(--paper2);box-shadow:0 0 0 2px var(--ink) inset}
.opt .mk{display:inline-block;width:22px;color:var(--ink3);font-family:var(--serif)}
.opt.selected .mk{color:var(--ink)}
.qnav{display:flex;gap:10px;margin:18px 0 30px;align-items:center}
.qnav .back{background:none;border:1px solid var(--line2);color:var(--ink2);border-radius:999px;padding:13px 18px;font-size:14px}
.qnav .next{flex:1}
.qnav .next:disabled{opacity:.4}
.saved{font-size:12px;color:var(--ink3);text-align:center;margin-top:6px}
.loading,.errbox{text-align:center;padding:40px 0;color:var(--ink2)}
.errbox .btn{width:auto;margin-top:12px}
.spinner{width:34px;height:34px;border:3px solid var(--line2);border-top-color:var(--ink);border-radius:50%;margin:0 auto 14px;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* reveal */
.reveal{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:18px}
.reveal .msg{font-family:var(--serif);font-size:19px;color:var(--ink2);min-height:1.6em;transition:opacity .4s}
.reveal .dots{display:flex;gap:6px}
.reveal .dots i{width:8px;height:8px;border-radius:50%;background:var(--ink3);animation:pulse 1.2s infinite}
.reveal .dots i:nth-child(2){animation-delay:.2s}.reveal .dots i:nth-child(3){animation-delay:.4s}
@keyframes pulse{0%,100%{opacity:.3}50%{opacity:1}}

/* result */
.res-head{text-align:center;padding:26px 20px 26px;border-radius:22px;color:#fff;position:relative;overflow:hidden}
.res-head .disc{font-size:12px;opacity:.9;margin:0 0 14px}
/* 哲学者カード画像: 1080×1350(4:5)。切り抜かず全体表示（object-fit:contain）。 */
.portrait{width:min(92vw,520px);margin:0 auto 8px;border-radius:12px;overflow:hidden;background:var(--paper);
  box-shadow:0 8px 24px rgba(28,27,25,.12)}
.portrait.detail{width:min(72vw,320px)}
.portrait picture{display:block}
.card-img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:contain;background:var(--paper)}
.portrait.sil{aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;background:var(--paper2);color:var(--ink3)}
.portrait.sil svg{width:46%;opacity:.4}
.res-label{text-align:center;font-size:13px;color:var(--ink2);margin:6px 0 10px}
.res-name{font-family:var(--serif);font-size:clamp(26px,7.5vw,38px);font-weight:700;text-align:center;margin:10px 0 2px;line-height:1.15}
.res-title{text-align:center;color:var(--ink2);font-size:15px;font-weight:600}
.res-name .accent{display:block;width:44px;height:3px;border-radius:3px;margin:12px auto 0}
.res-body{font-family:var(--serif);font-size:17px;line-height:1.9;margin:26px 4px;text-align:center}
.disc-note{margin-top:22px;padding:14px 16px;background:var(--paper2);border:1px solid var(--line);border-radius:12px;font-size:12.5px;color:var(--ink2);line-height:1.7}
.discovered{text-align:center;font-size:13px;color:var(--good);margin:16px 0;font-weight:600}
.share{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:16px 0}
.share button{background:var(--white);border:1px solid var(--line2);border-radius:999px;padding:9px 15px;font-size:13px;color:var(--ink)}

/* mock ad */
.admask{position:fixed;inset:0;background:rgba(28,27,25,.72);z-index:80;display:flex;align-items:center;justify-content:center;padding:20px}
.adbox{background:var(--white);border-radius:18px;max-width:340px;width:100%;overflow:hidden}
.adlabel{background:var(--ink3);color:#fff;font-size:11px;letter-spacing:.15em;padding:5px 12px;display:flex;justify-content:space-between;align-items:center}
.adlabel button{background:rgba(255,255,255,.25);border:none;color:#fff;border-radius:50%;width:24px;height:24px;font-size:14px}
.adbody{padding:26px 20px;text-align:center}
.adbody .ph{font-size:44px}
.adbody p{color:var(--ink2);font-size:14px;margin:10px 0 0}
.adbody .prog{height:4px;background:var(--line2);border-radius:99px;margin-top:16px;overflow:hidden}
.adbody .prog>i{display:block;height:100%;width:0;background:var(--ink);transition:width .1s linear}
.adproceed{padding:0 20px 20px}

/* detail */
.d-sec{margin:22px 0}
.d-sec h3{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin:0 0 8px}
.d-sec p{margin:0;font-size:15.5px;color:var(--ink)}
.d-card{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:16px}
.ph-hd{text-align:center;margin:8px 0 18px}
.ph-hd .nm{font-family:var(--serif);font-size:26px;font-weight:700}
.ph-hd .tt{color:var(--ink2);font-size:14px}
.chip{display:inline-block;font-size:12px;background:var(--paper2);border:1px solid var(--line);border-radius:999px;padding:4px 12px;margin:3px 4px 0 0}
.ph-holder{border:1px dashed var(--line2);background:var(--paper2);border-radius:12px;padding:14px;font-size:13px;color:var(--ink3)}

/* collection */
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:16px}
.cell{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:8px;text-align:center}
.cell .p{width:100%;border-radius:10px;overflow:hidden;background:var(--paper2);margin-bottom:8px}
.cell .p.sil{aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;color:var(--ink3)}
.cell .p.sil svg{width:46%;opacity:.35}
.cell .nm{font-family:var(--serif);font-size:13px;font-weight:700;line-height:1.3}
.cell .nm.hidden{color:var(--ink3);font-family:var(--sans);font-weight:400}
.collbar{display:flex;justify-content:space-between;align-items:center;margin:14px 0 4px;font-size:14px;color:var(--ink2)}

/* chat */
.chat-hd{display:flex;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.chat-hd .p{width:40px;border-radius:8px;overflow:hidden;background:var(--paper2);flex:none;display:flex;align-items:center;justify-content:center}
.chat-hd .p .card-img{aspect-ratio:4/5}
.chat-hd .p svg{width:70%;opacity:.4}
.chat-note{background:var(--paper2);border:1px dashed var(--line2);border-radius:10px;padding:10px 12px;font-size:12px;color:var(--ink2);margin:12px 0}
.log{display:flex;flex-direction:column;gap:10px;padding:8px 0 12px;min-height:40vh}
.msg{max-width:84%;padding:11px 14px;border-radius:15px;font-size:15px;line-height:1.7;white-space:pre-wrap}
.msg.ai{align-self:flex-start;background:var(--white);border:1px solid var(--line);border-bottom-left-radius:5px}
.msg.me{align-self:flex-end;background:var(--ink);color:var(--paper);border-bottom-right-radius:5px}
.msg .cite{font-size:11px;color:var(--ink3);margin-top:6px}
.chat-in{display:flex;gap:8px;position:sticky;bottom:0;background:var(--paper);padding:10px 0}
.chat-in input{flex:1;padding:13px 15px;border:1px solid var(--line2);border-radius:999px;font-size:15px;background:var(--white)}
.chat-in button{background:var(--ink);color:var(--paper);border:none;border-radius:999px;padding:0 20px;font-weight:600}
.chat-in button:disabled{opacity:.4}
.usage{font-size:12px;color:var(--ink3);text-align:right;margin-top:4px}

/* dev */
.dev{background:#14140f;color:#cfc9b8;border-radius:12px;padding:14px;font-family:ui-monospace,Menlo,monospace;font-size:12px;overflow-x:auto;line-height:1.6}
.dev h4{color:#e3c777;margin:14px 0 6px;font-family:var(--sans)}
.dev .bar{display:inline-block;height:8px;background:#e3c777;border-radius:2px;vertical-align:middle}
.devwarn{background:#3a2a1a;color:#f0c98a;border:1px solid #6b4b2b;border-radius:10px;padding:10px 12px;font-size:12px;margin:10px 0}

.backlink{background:none;border:none;color:var(--ink3);font-size:14px;padding:12px 0}
footer{border-top:1px solid var(--line);margin-top:40px;padding:24px 0;color:var(--ink3);font-size:12px;text-align:center;line-height:1.9}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:var(--ink);color:var(--paper);
  padding:11px 20px;border-radius:999px;font-size:14px;opacity:0;transition:.3s;z-index:100;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.hide{display:none!important}

/* ---- β feedback UI ---- */
.fbcard{background:var(--white);border:1px solid var(--line2);border-radius:16px;padding:18px 16px;margin:16px 0}
.fbq{font-family:var(--serif);font-size:16.5px;line-height:1.6;margin:0 0 14px}
.scalerow{display:flex;gap:6px;justify-content:space-between}
.scalerow .sc{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;background:var(--paper2);
  border:1.5px solid var(--line2);border-radius:12px;padding:10px 4px;font-size:10.5px;color:var(--ink2);line-height:1.3;text-align:center;transition:all .12s}
.scalerow .sc b{font-family:var(--serif);font-size:17px;color:var(--ink)}
.scalerow .sc.on,.scalerow .sc:active{border-color:var(--ink);background:var(--paper);box-shadow:0 0 0 2px var(--ink) inset}
.choicecol{display:flex;flex-direction:column;gap:0}
.reason3{margin:0;padding:0 0 0 4px;list-style:none;counter-reset:rz}
.reason3>li{counter-increment:rz;position:relative;padding:12px 0 12px 30px;border-bottom:1px dashed var(--line2)}
.reason3>li:last-child{border-bottom:none}
.reason3>li::before{content:counter(rz);position:absolute;left:0;top:12px;width:22px;height:22px;border-radius:50%;
  background:var(--ink);color:var(--paper);font-size:12px;display:flex;align-items:center;justify-content:center;font-family:var(--serif)}
.reason3 .rz-a{display:block;font-weight:600}
.reason3 .rz-t{display:block;color:var(--ink2);font-size:14px;margin-top:3px}
.reason3 .rz-m{display:block;color:var(--ink3);font-size:13.5px;margin-top:3px}
.rz-note{font-size:12px;color:var(--ink3);margin-top:12px;line-height:1.7}
.hardlist{display:flex;flex-direction:column;gap:8px;max-height:280px;overflow:auto;margin-bottom:12px}
.hardq{display:flex;gap:9px;align-items:flex-start;font-size:13.5px;color:var(--ink2);line-height:1.5}
.hardq input{margin-top:3px}
.fbcard textarea{width:100%;border:1.5px solid var(--line2);border-radius:12px;padding:12px;font:inherit;font-size:15px;resize:vertical;box-sizing:border-box}
.retest-note{font-size:12px;color:var(--ink3);text-align:center;margin:14px 0;line-height:1.8}
.retest-note code{background:var(--paper2);border:1px solid var(--line2);border-radius:6px;padding:2px 8px;font-size:12px}

/* ---- 18タイプ・9軸: 5段階Likert UI（横並び） ---- */
.likert{margin:28px 0 8px}
.likert-poles{display:flex;justify-content:space-between;align-items:baseline;font-size:12.5px;color:var(--ink3);font-family:var(--serif);margin:0 2px 10px}
.likert-dots{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:6px;padding:4px 0}
.ldot{border-radius:50%;border:2px solid var(--line2);background:var(--white);transition:all .12s;padding:0;flex:none}
.ldot:nth-child(1),.ldot:nth-child(5){width:54px;height:54px}
.ldot:nth-child(2),.ldot:nth-child(4){width:46px;height:46px}
.ldot:nth-child(3){width:44px;height:44px}
.ldot:active{transform:scale(.94)}
.ldot.on{background:var(--ink);border-color:var(--ink);box-shadow:0 0 0 4px var(--paper2)}
.likert-current{text-align:center;margin-top:14px;font-family:var(--serif);font-size:15px;color:var(--ink3);min-height:22px}
.likert-current.chosen{color:var(--ink)}
@media(max-width:360px){.ldot:nth-child(1),.ldot:nth-child(5){width:48px;height:48px}.ldot:nth-child(2),.ldot:nth-child(4){width:42px;height:42px}.ldot:nth-child(3){width:34px;height:34px}}

/* ---- 結果: 9軸スコアバー ---- */
.rz-lead{font-size:14px;color:var(--ink2);margin:0 0 12px;line-height:1.7}
.axlist .axrow{display:flex;align-items:center;gap:10px;margin:9px 0;font-size:12px}
.axname{width:104px;color:var(--ink2);flex:none}
.axbar{flex:1;height:6px;background:var(--line2);border-radius:99px;position:relative}
.axbar>i{position:absolute;top:50%;width:13px;height:13px;border-radius:50%;background:var(--ink);transform:translate(-50%,-50%)}
.axval{width:26px;text-align:right;color:var(--ink3);flex:none;font-variant-numeric:tabular-nums}
.near-row{display:flex;gap:10px;flex-wrap:wrap}
.near-chip{display:flex;flex-direction:column;gap:2px;background:var(--paper2);border:1px solid var(--line2);border-radius:12px;padding:9px 13px;font-family:var(--serif);font-size:14.5px}
.near-chip i{font-style:normal;font-size:11px;color:var(--ink3)}

/* ---- 共有リンク着地（友達の結果） ---- */
.friend-landing{margin:0 0 22px}
.fl-card{background:var(--white);border:1px solid var(--line2);border-radius:16px;padding:20px 16px;text-align:center}
.fl-label{font-size:12px;color:var(--ink3)}
.portrait.fl{width:min(60vw,240px);margin:10px auto}
.fl-name{font-family:var(--serif);font-size:22px;font-weight:700}
.fl-title{font-family:var(--serif);font-size:13px;color:var(--ink2)}
.fl-lead{font-size:14.5px;color:var(--ink2);margin:14px 0 16px}
.fl-card .btn{margin-bottom:10px}
.share-main{background:var(--ink)!important;color:var(--paper)!important;border-color:var(--ink)!important;font-weight:700}
.share button{min-height:44px}

/* ---- パンくず / ほかの哲学者 / 一覧ハブ ---- */
.crumb{font-size:12px;color:var(--ink3);margin:6px 0 16px}
.crumb a{color:var(--ink2);text-decoration:none}
.crumb a:hover{text-decoration:underline}
.other-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:420px){.other-grid{grid-template-columns:repeat(2,1fr)}}
.other-grid.list{gap:12px}
.other{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;background:var(--white);border:1px solid var(--line2);border-radius:12px;padding:10px 8px;text-decoration:none;color:var(--ink)}
.other img{width:100%;max-width:120px;aspect-ratio:4/5;object-fit:contain;border-radius:8px;background:var(--paper2)}
.other span{font-family:var(--serif);font-size:14px}
.other small{font-size:11px;color:var(--ink3);line-height:1.5}

/* ---- 哲学者詳細ページ（SSR） ---- */
.art{padding-bottom:40px}
.art-hero{text-align:center;margin:8px 0 28px}
.art-hero-img{width:min(78vw,360px);margin:0 auto 16px;border-radius:14px;overflow:hidden;background:var(--paper2)}
.art-hero-img img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:contain}
.art-hero-img.sil{aspect-ratio:4/5}
.art-en{font-size:12px;letter-spacing:.14em;color:var(--ink3);text-transform:uppercase}
.art-name{font-family:var(--serif);font-size:clamp(28px,8vw,40px);margin:4px 0 2px}
.art-life{font-size:13px;color:var(--ink2)}
.art-catch{font-family:var(--serif);font-size:18px;line-height:1.7;margin:14px auto 0;max-width:32em}
.art-sec{margin:30px 0}
.art-sec>h2{font-family:var(--serif);font-size:20px;border-bottom:1px solid var(--line2);padding-bottom:8px;margin-bottom:16px}
.art-card{background:var(--white);border:1px solid var(--line2);border-radius:12px;padding:16px 16px}
.art-card+.art-card{margin-top:12px}
.art-card h3{font-family:var(--serif);font-size:16px;margin:0 0 8px}
.art-card p,.art-sec p{line-height:1.9;font-size:15.5px}
.cert{font-size:11px;color:var(--ink3);border:1px solid var(--line2);border-radius:999px;padding:2px 8px;margin-left:6px;font-weight:400}
.tl{list-style:none;margin:0;padding:0}
.tl>li{display:flex;gap:14px;padding:10px 0;border-bottom:1px dashed var(--line2)}
.tl>li:last-child{border-bottom:none}
.tl-year{flex:none;width:64px;font-family:var(--serif);font-weight:700;color:var(--accent)}
.tl-body b{font-size:15px}
.tl-body p{margin:4px 0 0;font-size:14px;color:var(--ink2)}
.topic-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:520px){.topic-grid{grid-template-columns:1fr 1fr}}
.topic{background:var(--white);border:1px solid var(--line2);border-radius:12px;padding:14px}
.topic h3{font-family:var(--serif);font-size:16px;margin:0 0 6px}
.topic-sub{font-size:13px;color:var(--ink2);margin:0 0 6px}
.art-quote{font-family:var(--serif);font-size:17px;line-height:1.9;background:var(--white);border-left:3px solid var(--ink);border-radius:0;padding:12px 16px;margin:0 0 12px}
.art-quote cite{display:block;font-size:12px;color:var(--ink3);font-style:normal;margin-top:6px}
.art-quote .q-note{display:block;font-size:11px;color:var(--ink3);margin-top:2px}
.yt-title{font-family:var(--serif);font-size:16px;margin:0 0 10px}
.yt-embed{position:relative;width:100%;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000}
.yt-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt-desc{font-size:14px;color:var(--ink2);margin-top:10px}
.art-cta{text-align:center;background:var(--paper2);border-radius:16px;padding:24px 16px}
.art-cta h2{border:none}
.art-cta .btn{max-width:320px;margin:8px auto 0}

/* ---- CMS 管理画面 ---- */
.adm{max-width:820px;margin:0 auto;padding:16px}
.adm h1{font-family:var(--serif);font-size:22px}
.adm-login{max-width:360px;margin:60px auto;text-align:center}
.adm-row{display:flex;align-items:center;gap:12px;background:var(--white);border:1px solid var(--line2);border-radius:12px;padding:10px 12px;margin:8px 0;text-decoration:none;color:inherit}
.adm-row img,.adm-row .sil{width:44px;height:55px;object-fit:contain;border-radius:6px;background:var(--paper2);flex:none}
.adm-row .an{flex:1}
.adm-row .an b{font-size:15px}
.adm-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:3px}
.pill{font-size:11px;border-radius:999px;padding:2px 8px;border:1px solid var(--line2);color:var(--ink2)}
.pill.on{background:var(--good);color:#fff;border-color:var(--good)}
.pill.off{background:var(--paper2);color:var(--ink3)}
.pill.yt{background:#c4302b;color:#fff;border-color:#c4302b}
.adm-form label{display:block;font-size:12px;color:var(--ink2);margin:14px 0 4px;font-weight:600}
.adm-form input[type=text],.adm-form input[type=url],.adm-form textarea{width:100%;border:1.5px solid var(--line2);border-radius:10px;padding:10px;font:inherit;font-size:14px;box-sizing:border-box;background:var(--white)}
.adm-form textarea{resize:vertical;min-height:70px}
.adm-item{border:1px solid var(--line2);border-radius:10px;padding:10px;margin:8px 0;background:var(--paper2)}
.adm-item .rm{background:none;border:1px solid var(--line2);border-radius:8px;font-size:12px;padding:4px 10px;color:var(--ink2)}
.adm-add{background:none;border:1px dashed var(--line2);border-radius:10px;padding:8px 14px;font-size:13px;color:var(--ink2);width:100%}
.adm-bar{position:sticky;bottom:0;background:rgba(246,243,236,.95);backdrop-filter:blur(6px);border-top:1px solid var(--line2);padding:12px;display:flex;gap:10px;align-items:center;margin-top:16px}
.adm-bar .sp{flex:1}
.adm-toggle{display:flex;align-items:center;gap:8px;font-size:13px}
.adm-msg{font-size:12px;color:var(--ink3)}

/* 自己分析“問いかけ層” */
.reflect-cap{background:var(--card,#fff);border:1px solid var(--line,#e7e2d8);border-left:3px solid var(--accent,#7a6cff);border-radius:10px;padding:12px 14px;margin:0 0 14px;font-size:13.5px;line-height:1.7;color:var(--ink2,#5b564d)}
.case-title{font-family:var(--serif);font-size:15px;font-weight:700;color:var(--accent,#7a6cff);letter-spacing:.02em;margin:2px 0 -6px}
.choices{display:flex;flex-direction:column;gap:10px;margin:18px 0 8px}
.choice{text-align:left;background:var(--card,#fff);border:1px solid var(--line2,#ddd6c9);border-radius:12px;padding:15px 16px;font-size:15px;line-height:1.55;color:var(--ink,#2b2822);transition:border-color .15s,background .15s,transform .05s}
.choice:hover{border-color:var(--accent,#7a6cff)}
.choice:active{transform:scale(.995)}
.choice.on{border-color:var(--accent,#7a6cff);background:color-mix(in srgb,var(--accent,#7a6cff) 8%,var(--card,#fff));box-shadow:0 0 0 1px var(--accent,#7a6cff) inset}
.emp-line{font-family:var(--serif);font-size:16px;line-height:1.8;color:var(--ink,#2b2822);margin:0}
.map-legend{display:flex;flex-wrap:wrap;gap:6px 12px;margin:12px 2px 0;padding-top:12px;border-top:1px solid var(--line,#e7e2d8)}
.map-legend .mlg{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;color:var(--ink2,#5b564d);line-height:1.5}
.map-legend .mlg .n{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:#EAE4D8;border:1px solid #C7C0B2;font-size:10.5px;font-style:normal;color:#6b6459;flex:0 0 auto}
.map-legend .mlg.me{font-weight:700;color:var(--accent,#8a5a3c)}
.map-legend .mlg.me .n{background:var(--accent,#8a5a3c);border-color:var(--accent,#8a5a3c);color:#fff}
.act-links{display:flex;gap:10px;flex-wrap:wrap}
.act-links .btn{flex:1 1 160px}
.saved a#skipReflect,#skipReflect{color:var(--ink3,#726d61);text-decoration:underline;font-size:13px}
.pn-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.pn-tag{display:inline-block;background:var(--chip,#f2efe8);border:1px solid var(--line,#e7e2d8);border-radius:999px;padding:5px 12px;font-size:13px;color:var(--ink,#3a362f)}
.pn-line{margin:12px 0 0;padding:10px 14px;border-left:3px solid var(--accent,#7a6cff);background:var(--card2,#faf8f3);border-radius:8px;font-size:14px;line-height:1.75;color:var(--ink,#3a362f)}
.pn-line cite{display:block;margin-top:6px;font-style:normal;font-size:12.5px;color:var(--ink3,#726d61)}

/* 低シグナル注記（中立回答が多いとき） */
.lowsig{background:#fbf6e9;border:1px solid #ecdca8;border-left:3px solid #caa53a;border-radius:10px;padding:12px 14px;margin:0 0 16px;font-size:13.5px;line-height:1.75;color:#6b5f37}

/* ホームの浮遊キャラ */
#home{position:relative}
#home .wrap{position:relative;z-index:1}
.char-layer{position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:1120px;overflow:visible;pointer-events:none;z-index:4}
.floatchar{position:absolute;pointer-events:auto;opacity:.9;filter:drop-shadow(0 8px 14px rgba(28,27,25,.18));animation-name:floaty;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate;will-change:transform;text-decoration:none;-webkit-tap-highlight-color:transparent}
.floatchar img{display:block;width:100%;height:auto}
.floatchar:hover,.floatchar:active{opacity:1;transform:scale(1.06)}
@keyframes floaty{from{transform:translateY(6px) rotate(-2deg)}to{transform:translateY(-12px) rotate(2deg)}}
@media (prefers-reduced-motion: reduce){.floatchar{animation:none}}

/* 考える姿勢マップ（結果） */
.mind-map{width:100%;height:auto;display:block;background:var(--card2,#faf8f3);border-radius:10px}
.map-note{font-size:12px;color:var(--ink3,#726d61);margin:8px 2px 0;line-height:1.6}
.map-note a{color:var(--accent,#7a6cff)}

/* 相性（良い/悪い） */
.cmp-list{display:flex;flex-direction:column;gap:12px}
.cmp-item{display:flex;gap:12px;align-items:flex-start}
.cmp-p{width:56px;min-width:56px;border-radius:8px;overflow:hidden;background:var(--paper2);aspect-ratio:4/5}
.cmp-p .card-img{width:100%;height:100%;object-fit:contain}
.cmp-p.sil{display:flex;align-items:center;justify-content:center;color:var(--ink3)}.cmp-p.sil svg{width:50%}
.cmp-nm{font-weight:700;font-size:15px;display:flex;align-items:center;gap:8px}
.cmp-fact{font-size:10.5px;color:var(--accent);border:1px solid var(--line2);border-radius:999px;padding:1px 8px;font-weight:600}
.cmp-rz{font-size:13px;color:var(--ink2);line-height:1.65;margin-top:3px}
.cmp-list.good{border-left:3px solid var(--good,#2E7167);padding-left:12px}
.cmp-list.bad{border-left:3px solid var(--accent,#8a5a3c);padding-left:12px}

/* 2人の相性 */
.couple-h{font-family:var(--serif);font-size:24px;font-weight:700;text-align:center;margin:14px 0 18px}
.couple-pair{display:flex;align-items:center;justify-content:center;gap:14px;margin:6px 0 18px}
.cp-side{flex:1;max-width:180px;text-align:center}
.portrait.cp{width:min(38vw,150px);margin:0 auto 8px}
.cp-nm{font-weight:700;font-size:14px;line-height:1.35}.cp-nm span{display:block;font-weight:400;font-size:11px;color:var(--ink3)}
.cp-vs{font-family:var(--serif);font-size:22px;color:var(--ink3)}
.couple-score{text-align:center;background:var(--white);border:1px solid var(--line);border-radius:16px;padding:18px;margin:8px 0 18px}
.cs-pct{font-family:var(--serif);font-weight:700;font-size:52px;line-height:1;color:var(--accent)}
.cs-pct span{font-size:24px}
.cs-cap{font-size:12px;color:var(--ink2);margin:4px 0 12px}
.cs-bar{height:10px;background:var(--line2);border-radius:99px;overflow:hidden}
.cs-bar>i{display:block;height:100%;background:var(--accent);border-radius:99px}

/* マップ下のあなたの位置の説明 */
.map-desc{font-size:14px;line-height:1.7;color:var(--ink);background:var(--paper2);border-radius:10px;padding:11px 13px;margin:10px 2px 0}
