/* ============================================================
   css/annainin.css — 亀の案内人 (Annainin) v1
   Phase 46-A/C. Site tokens shared with kid.css (ink/parchment/gold/moss/clay).
   Mobile-first. Chat-style foundation, no real AI backend.
   ============================================================ */
:root{
  --ink:#0b1713;--ink-soft:#122019;--line:rgba(212,169,106,.16);
  --parchment:#efe9da;--parchment-dim:rgba(239,233,218,.62);
  --gold:#d4a96a;--gold-deep:#8f5f2c;--moss:#7a9e6e;--clay:#c96f5a;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:"Noto Serif JP",serif;background:var(--ink);color:var(--parchment);line-height:1.8;-webkit-font-smoothing:antialiased;height:100%;}
a{color:inherit;}
.an-wrap{max-width:760px;margin:0 auto;padding:0 20px;}

/* ── top / hero ── */
.an-top{padding:22px 0 0;font-size:.78rem;letter-spacing:.14em;color:var(--parchment-dim);}
.an-top a{border-bottom:1px solid var(--line);padding-bottom:2px;text-decoration:none;}
.an-hero{padding:36px 0 22px;border-bottom:1px solid var(--line);}
.an-hero .eyebrow{font-family:"Playfair Display",serif;font-size:.72rem;letter-spacing:.3em;color:var(--gold);text-transform:uppercase;display:block;margin-bottom:14px;}
.an-hero h1{font-size:1.5rem;font-weight:700;line-height:1.5;letter-spacing:.04em;}
.an-hero .lede{margin-top:14px;font-size:.88rem;color:var(--parchment-dim);}

/* ── chat shell ── */
.an-chat-shell{display:flex;flex-direction:column;height:min(72vh,640px);min-height:420px;margin:26px 0 30px;border:1px solid var(--line);border-radius:16px;background:var(--ink-soft);overflow:hidden;}

.an-history{flex:1 1 auto;overflow-y:auto;padding:20px 16px;display:flex;flex-direction:column;gap:14px;}
.an-history::-webkit-scrollbar{width:6px;}
.an-history::-webkit-scrollbar-thumb{background:var(--line);border-radius:999px;}

.an-msg{display:flex;gap:10px;max-width:88%;}
.an-msg-bot{align-self:flex-start;}
.an-msg-user{align-self:flex-end;flex-direction:row-reverse;}

.an-avatar{flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.95rem;background:rgba(212,169,106,.14);border:1px solid var(--line);}
.an-msg-user .an-avatar{background:rgba(122,158,110,.14);border-color:rgba(122,158,110,.4);}

.an-bubble{font-size:.88rem;padding:11px 14px;border-radius:14px;white-space:pre-wrap;line-height:1.7;}
.an-msg-bot .an-bubble{background:rgba(0,0,0,.18);border:1px solid var(--line);border-top-left-radius:4px;}
.an-msg-user .an-bubble{background:rgba(212,169,106,.16);border:1px solid rgba(212,169,106,.4);color:var(--parchment);border-top-right-radius:4px;}

/* ── quick replies / linked feature ── */
.an-quick-replies{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 0 40px;}
.an-quick-btn{font-family:"Noto Serif JP",serif;font-size:.78rem;color:var(--gold);background:rgba(212,169,106,.08);border:1px solid rgba(212,169,106,.4);border-radius:999px;padding:7px 13px;cursor:pointer;transition:background .2s,border-color .2s;}
.an-quick-btn:hover{background:rgba(212,169,106,.18);border-color:var(--gold);}

.an-linked-features{display:flex;flex-direction:column;gap:6px;margin:2px 0 0 40px;}
.an-linked-feature a{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;color:var(--ink);background:var(--gold);border-radius:10px;padding:9px 14px;text-decoration:none;font-weight:700;letter-spacing:.02em;}
.an-linked-feature a:hover{background:#e0b87c;}

/* ── typing indicator ── */
.an-typing .an-bubble{display:flex;align-items:center;gap:4px;padding:13px 16px;}
.an-typing-dot{width:6px;height:6px;border-radius:50%;background:var(--parchment-dim);animation:an-blink 1.2s infinite ease-in-out;}
.an-typing-dot:nth-child(2){animation-delay:.2s;}
.an-typing-dot:nth-child(3){animation-delay:.4s;}
@keyframes an-blink{0%,80%,100%{opacity:.25;}40%{opacity:1;}}

/* ── input row ── */
.an-input-row{display:flex;gap:10px;padding:14px 16px;border-top:1px solid var(--line);background:var(--ink-soft);}
.an-input{flex:1 1 auto;font-family:"Noto Serif JP",serif;font-size:.9rem;color:var(--parchment);background:rgba(0,0,0,.2);border:1px solid var(--line);border-radius:12px;padding:11px 14px;resize:none;}
.an-input:focus{outline:none;border-color:var(--gold-deep);}
.an-input::placeholder{color:var(--parchment-dim);}
.an-send-btn{flex:0 0 auto;font-family:"Noto Serif JP",serif;font-size:.86rem;font-weight:700;color:var(--ink);background:var(--gold);border:none;border-radius:12px;padding:0 20px;cursor:pointer;transition:background .2s;}
.an-send-btn:hover{background:#e0b87c;}
.an-send-btn:disabled{background:rgba(212,169,106,.3);cursor:not-allowed;}

/* ── intro note ── */
.an-intro-note{font-size:.78rem;color:var(--parchment-dim);margin:14px 0 0;}

/* ── topic chips (Phase 46-C) ── */
.an-topics{margin:18px 0 0;}
.an-topics-label{font-size:.76rem;color:var(--parchment-dim);margin-bottom:8px;}
.an-topics-row{display:flex;flex-wrap:wrap;gap:7px;}
.an-topic-btn{font-family:"Noto Serif JP",serif;font-size:.74rem;color:var(--parchment-dim);background:rgba(0,0,0,.16);border:1px solid var(--line);border-radius:999px;padding:6px 11px;cursor:pointer;transition:border-color .2s,color .2s;}
.an-topic-btn:hover{border-color:var(--gold-deep);color:var(--gold);}

/* ── footer ── */
.an-footer{padding:26px 0 40px;border-top:1px solid var(--line);margin-top:10px;}
.an-footer p{font-size:.72rem;color:var(--parchment-dim);line-height:1.85;margin-bottom:10px;}
.an-footer a{text-decoration:underline;}

@media (max-width:480px){
  .an-hero h1{font-size:1.3rem;}
  .an-chat-shell{height:min(78vh,600px);}
  .an-quick-replies,.an-linked-features{margin-left:0;}
}