/* Shrine interview: one visible question, a companion, and a clear next step. */
.shrine-interview { background: #f8f5ee; }
.shrine-container { max-width: 1180px; margin: 38px auto 0; }
.journey-heading { display:flex; justify-content:space-between; gap:20px; margin:0 0 30px; }
.eyebrow { font-size:10px; font-weight:700; letter-spacing:.16em; color:#a34537; line-height:1.7; margin:0 0 12px; }
.journey-heading h1 { font-family:"Yu Mincho","Hiragino Mincho ProN",serif; font-size:clamp(23px,3vw,33px); font-weight:600; letter-spacing:.05em; margin:0 0 12px; }
.journey-heading p:not(.eyebrow) { color:#7d7a6c; font-size:13px; line-height:1.8; margin:0; }
.shrine-seal { align-self:center; display:grid; place-items:center; width:59px; height:66px; color:#a94b3c; font-family:serif; font-size:18px; line-height:1.25; letter-spacing:.22em; padding-left:.22em; border:1px solid #b65b46; outline:1px solid #b65b46; outline-offset:-5px; transform:rotate(5deg); opacity:.8; }
.journey-steps { list-style:none; display:grid; grid-template-columns:repeat(3,1fr); border:1px solid #dfd9cb; background:#fbf9f3; padding:0; margin:0 0 25px; border-radius:12px; overflow:hidden; }
.journey-steps li { display:flex; align-items:center; gap:14px; padding:17px 24px; color:#99988a; position:relative; }
.journey-steps li + li { border-left:1px solid #e4dfd4; }
.journey-steps li > span { font-family:Georgia,serif; font-size:24px; color:#b9b4a7; }
.journey-steps b { display:block; font-size:13px; font-weight:600; }
.journey-steps small { display:block; margin-top:5px; font-size:10px; letter-spacing:.02em; }
.journey-steps .active { background:#f3e9df; color:#8c3e33; }
.journey-steps .active > span { color:#a54839; }
.journey-steps .done > span { color:#52705a; }
.journey-steps .done { color:#52705a; }
.page-loading { padding:70px 20px; text-align:center; color:#807969; }
.fortune-card { position:relative; border:1px solid #e2dacb; border-radius:18px; background:#fffcf6; overflow:hidden; box-shadow:0 10px 40px #53402205; }
.fortune-welcome { display:grid; grid-template-columns:1.1fr 1fr; min-height:424px; padding:42px 55px 20px; }
.fortune-intro { align-self:center; }
.fortune-intro h2 { font-family:"Yu Mincho","Hiragino Mincho ProN",serif; font-size:clamp(30px,3.7vw,43px); line-height:1.6; font-weight:600; letter-spacing:.06em; margin:8px 0 17px; }
.fortune-intro h2 em { font-style:normal; color:#a34737; }
.fortune-lead { color:#756f61; line-height:2; font-size:14px; }
.fortune-primary { padding:15px 27px; min-height:50px; margin-top:9px; font-size:14px; gap:36px; border-radius:9px; }
.fortune-note { color:#88806f; font-size:11px; margin:12px 0 0; }
.fortune-visual { display:flex; position:relative; align-items:center; justify-content:center; flex-direction:column; min-width:0; }
.mascot-sprite { background-size:500% 100%; background-repeat:no-repeat; background-position:0% 0%; aspect-ratio:3 / 5; flex-shrink:0; }
.welcome-mascot { height:326px; position:relative; z-index:2; mix-blend-mode:multiply; }
.orbit { position:absolute; width:290px; height:290px; border-radius:50%; background:#f2ebde; top:38px; }
.orbit-two { width:320px; height:320px; top:23px; border:1px solid #e5ddca; background:transparent; }
.mascot-caption { position:relative; z-index:3; color:#8c7658; font-family:"Yu Mincho",serif; font-size:13px; margin:8px 0; letter-spacing:.07em; }
.petal { position:absolute; font-size:24px; color:#b89d66; }
.petal-one { right:12%; top:26%; }.petal-two { left:12%; bottom:28%; font-size:16px; }
.fortune-disclaimer { margin:17px 30px 22px; padding-top:17px; border-top:1px solid #ebe5da; text-align:center; color:#908779; font-size:10px; line-height:1.8; }
.fortune-quiz { max-width:730px; margin:auto; padding:36px 38px 18px; min-height:434px; }
.quiz-top { display:flex; align-items:center; justify-content:space-between; color:#9b8b70; font-size:12px; margin-bottom:14px; }
.quiz-track { display:flex; gap:7px; margin-bottom:30px; }.quiz-track i { flex:1; height:4px; border-radius:5px; background:#e8e1d5; }.quiz-track i.on { background:#a34637; }
.fortune-quiz h2 { font-family:"Yu Mincho",serif; font-size:24px; line-height:1.6; margin:0 0 8px; }
.quiz-hint { font-size:12px; color:#827b6b; margin:0 0 20px; }
.fortune-options { display:grid; gap:10px; }
.fortune-option { display:flex; gap:13px; align-items:center; text-align:left; font-family:inherit; color:#433f35; background:#fffcf8; padding:15px 18px; min-height:65px; border:1px solid #ddd6c6; border-radius:10px; cursor:pointer; }
.fortune-option:hover,.fortune-option.selected { background:#f5e9dd; border-color:#ad5846; }
.fortune-option .option-mark { display:grid; place-items:center; border:1px solid #d0c4ae; border-radius:50%; width:23px; height:23px; flex-shrink:0; color:#a34637; font-size:12px; }
.fortune-option.selected .option-mark { background:#a34637; border-color:#a34637; color:white; }
.fortune-option b { font-size:14px; font-weight:600; }.fortune-option small { display:block; color:#8b806f; font-size:11px; margin-top:5px; line-height:1.5; }
.quiz-actions { display:flex; justify-content:space-between; align-items:center; margin-top:21px; gap:14px; }.quiz-actions .btn { min-height:43px; padding-inline:24px; }
.text-button { background:none; border:0; padding:5px 0; font-size:11px; font-family:inherit; text-underline-offset:4px; color:#8f4939; cursor:pointer; }.text-button:hover { text-decoration:underline; }.text-button:disabled { cursor:wait; opacity:.5; }
.fortune-result { padding:34px 45px 14px; }
.result-heading { text-align:center; }.result-heading h2 { font-family:"Yu Mincho",serif; font-size:27px; margin:8px 0 12px; color:#584c36; line-height:1.6; }
.result-body { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:35px; max-width:860px; margin:20px auto; }
.result-profile { font-size:15px; line-height:2; color:#665e4e; }.result-progress { border-top:1px solid #ded6c6; padding-top:18px; margin-top:20px; }.result-progress strong { display:block; color:#55705a; font-size:15px; margin-bottom:6px; }.result-progress span { font-size:12px; color:#8a8171; }
.recommended-guide { display:flex; align-items:center; gap:15px; background:#f5efe3; padding:12px 20px; border-radius:14px; }.recommended-guide .mascot-sprite { height:185px; mix-blend-mode:multiply; }.recommended-guide h3 { font-family:"Yu Mincho",serif; font-size:24px; margin:0 0 8px; }.recommended-guide p { font-size:12px; line-height:1.8; color:#7d715c; margin:0; }.result-actions { display:flex; flex-direction:column; align-items:center; gap:12px; margin:20px 0; }
.interview-grid { display:grid; grid-template-columns:minmax(0,1fr) 315px; gap:22px; align-items:start; }
.conversation-toolbar { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }.conversation-toolbar .btn.small { padding:7px 13px; }
.shrine-conversation { background:#fffdf8; border:1px solid #e1d9ca; border-radius:16px; overflow:hidden; }
.guide-topline { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:15px 22px; border-bottom:1px solid #eee7dc; }
#interviewer-head { display:flex; align-items:center; gap:8px; font-size:12px; min-width:0; }#interviewer-head .title { color:#71634c; }
.guide-scene { display:grid; grid-template-columns:190px minmax(0,1fr); min-height:286px; align-items:center; padding:10px 22px 6px; background:radial-gradient(ellipse at 16% 62%,#f3ecdf 0,transparent 55%); }
.guide-portrait { display:flex; align-items:center; justify-content:center; flex-direction:column; }
#guide-sprite { height:254px; max-width:100%; mix-blend-mode:multiply; }
#guide-sprite.is-resting { background-size:contain; background-position:center; }
.guide-rest-notice { margin:0 0 12px; border:1px solid #d7d4e0; border-radius:12px; padding:14px 18px; background:#f4f1f7; color:#645974; font-size:13px; line-height:1.8; }
.guide-rest-notice p { margin:4px 0 0; font-size:12px; }
.guide-rest-notice[data-stage="brief"] { background:#faf5e9; border-color:#e2d5b9; color:#887249; }
#chat-interview[data-state="sleeping"] .guide-scene { background:radial-gradient(ellipse at 16% 62%,#ece8f1 0,transparent 65%); }
#chat-interview[data-state="sleeping"] .shrine-composer { opacity:.6; }
#chat-interview[data-state="sleeping"] #guide-sprite { animation:guide-breathe 6s ease-in-out infinite; }
#guide-state { margin:0 0 8px; font-size:10px; color:#978368; min-height:16px; text-align:center; }
.guide-speech { align-self:center; padding:20px 0 20px 20px; position:relative; }.guide-speech .eyebrow { font-size:9px; }
#guide-message { font-size:16px; line-height:1.95; white-space:pre-wrap; overflow-wrap:anywhere; color:#474337; position:relative; z-index:1; }
.guide-flower { color:#ddd1ad; display:block; font-size:23px; margin-top:17px; }
#chat-interview[data-state="thinking"] #guide-sprite,#chat-interview[data-state="ponder"] #guide-sprite { animation:guide-breathe 3s ease-in-out infinite; }
@keyframes guide-breathe { 50% { transform:translateY(-3px); } }
.answer-options { padding:0 22px; }.answer-options .quick-replies { display:flex; flex-wrap:wrap; margin:4px 0 20px; max-width:none; gap:8px; }.answer-options .quick-reply { padding:11px 15px; background:#faf5eb; color:#756047; border:1px solid #dbcfbc; font-size:12px; border-radius:9px; }.answer-options .quick-reply:hover { background:#f0e4d4; border-color:#a34637; }
.card-row { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin:8px 0 16px; }.card-row.three { grid-template-columns:repeat(3,1fr); }
.scenario-card { text-align:left; padding:12px; border:1px solid #d8ccb8; border-radius:10px; background:#faf5eb; color:#60533f; font-size:12px; line-height:1.7; font-family:inherit; cursor:pointer; }.scenario-card:hover { border-color:#a34637; background:#f5eadb; }.scenario-card .key { display:inline-grid; place-items:center; border-radius:50%; width:21px; height:21px; background:#eae0ce; margin-right:7px; font-size:10px; }
.scenario-pass,.scenario-skip { grid-column:1/-1; background:none; border:0; padding:7px; color:#8d7c64; font-size:11px; cursor:pointer; font-family:inherit; }.scenario-skip { text-decoration:underline; }.scenario-pass { border:1px dashed #d9cebb; border-radius:7px; }
.shrine-composer { padding:18px 22px 16px; border-top:1px solid #eee7dc; }.shrine-composer label { display:block; font-size:11px; color:#8a7c66; margin-bottom:10px; }.composer-row { display:flex; gap:9px; align-items:stretch; }.composer-row textarea { resize:vertical; min-height:64px; max-height:160px; border-radius:9px; font-size:14px; background:#fffcf7; line-height:1.7; }.composer-row .btn { flex-shrink:0; padding:12px 17px; align-self:stretch; }.composer-foot { display:flex; gap:12px; align-items:center; justify-content:space-between; margin-top:8px; font-size:9px; color:#9d907c; }
.conversation-history { border-top:1px solid #eee7dc; }.conversation-history summary { padding:14px 22px; color:#8a7c66; font-size:11px; cursor:pointer; }.conversation-history .chat-area { max-height:350px; background:#f7f3eb; }.session-note { text-align:center; font-size:10px; line-height:1.8; color:#9c927f; padding:2px 10px; }
.profile-card { padding:23px; margin-top:44px; background:#fdfaf3; border-color:#ded5c3; }.profile-heading { display:flex; align-items:center; justify-content:space-between; color:#b69c67; margin-bottom:9px; }.profile-heading .eyebrow { margin:0; color:#847657; }.profile-card h2 { font-family:"Yu Mincho",serif; font-size:17px; line-height:1.7; margin-bottom:24px; font-weight:600; }.profile-progress-label { display:flex; justify-content:space-between; align-items:baseline; font-size:11px; color:#8c8069; margin-bottom:10px; }.profile-progress-label strong { font-family:Georgia,serif; font-size:28px; color:#a34637; font-weight:400; }.profile-card .coverage-bar { height:6px; background:#e7dfcf; }.profile-card .coverage-bar i { background:#aa5745; transition:width .6s; }.profile-card #progress-caption { font-size:10px; line-height:1.8; margin:9px 0 20px; }
.profile-summary { border-top:1px solid #e3dbc9; padding-top:20px; }.profile-summary .eyebrow { font-size:9px; color:#a28c66; }.profile-summary h3 { font-size:13px; line-height:1.7; font-family:"Yu Mincho",serif; margin:0 0 9px; }.profile-summary p:not(.eyebrow) { font-size:11px; color:#85765e; line-height:1.9; margin:0; }.profile-summary .text-button { font-size:10px; margin-top:5px; }
.profile-checklist { list-style:none; padding:15px 0 5px; margin:0; }.profile-checklist li { font-size:11px; color:#948975; padding:8px 0 8px 25px; position:relative; }.profile-checklist li::before { content:''; position:absolute; width:14px; height:14px; border:1px solid #d6cdb9; border-radius:50%; left:0; top:8px; }.profile-checklist .complete { color:#5b7057; }.profile-checklist .complete::before { content:'✓'; background:#627457; color:white; border-color:#627457; font-size:10px; display:grid; place-items:center; }
.profile-build { display:flex; width:100%; text-decoration:none; font-size:12px; padding:12px 8px; margin-top:14px; }.profile-card #twin-status { font-size:10px; line-height:1.8; margin:8px 0 16px; }.profile-detail { border-top:1px solid #e5ddce; padding:13px 0 0; margin-top:12px; }.profile-detail summary { font-size:10px; color:#92846d; cursor:pointer; }.profile-detail[open] summary { margin-bottom:15px; }.profile-detail .panel-section h3 { font-size:11px; }.profile-detail .target-dim { font-size:11px; line-height:1.8; }
.shrine-footer { text-align:center; color:#a0947e; font-size:10px; letter-spacing:.12em; padding:30px 10px; }.shrine-footer span { margin-right:7px; color:#b59a68; }
.inline-error { color:#a13830; background:#fff0e9; border:1px solid #ecc5b6; padding:12px; border-radius:8px; font-size:12px; line-height:1.7; margin:12px 0; }
#char-modal .modal { width:min(760px,94vw); }#char-modal .char-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }#char-modal .char-grid.busy { pointer-events:none; opacity:.5; }#char-modal .char-modal-foot .muted { margin-right:auto; }
.research-note { border:1px solid #ddcf9c; background:#fff5d7; border-radius:8px; padding:12px; font-size:12px; line-height:1.7; margin:10px 0; }.fidelity-controls { display:flex; align-items:center; gap:10px; padding:10px; background:#fffaf0; flex-wrap:wrap; }
button:focus-visible,a:focus-visible,summary:focus-visible { outline:3px solid #c99750; outline-offset:4px; }
@media (max-width:900px) { .interview-grid { grid-template-columns:minmax(0,1fr) 280px; gap:15px; }.guide-scene { grid-template-columns:145px minmax(0,1fr); padding-inline:15px; }#guide-sprite { height:215px; }.guide-speech { padding-left:10px; }#guide-message { font-size:14px; }.fortune-welcome { padding:30px 35px 20px; }.profile-card { padding:19px; }.journey-steps li { padding:15px; gap:10px; } }
@media (max-width:720px) { .shrine-container { margin-top:25px; }.journey-heading { margin-bottom:23px; }.journey-heading p:not(.eyebrow) { font-size:11px; }.shrine-seal { width:47px; height:54px; font-size:15px; flex-shrink:0; }.eyebrow { font-size:9px; }.journey-steps { margin-bottom:20px; }.journey-steps li { padding:13px 9px; gap:7px; }.journey-steps li > span { font-size:18px; }.journey-steps b { font-size:10px; }.journey-steps small { display:none; }.fortune-welcome { grid-template-columns:1fr; padding:25px 25px 15px; text-align:center; }.fortune-intro h2 { font-size:29px; line-height:1.55; }.fortune-intro h2 br { display:none; }.fortune-lead { font-size:12px; }.fortune-primary { margin-top:6px; min-width:230px; justify-content:space-between; }.fortune-visual { min-height:227px; margin-top:5px; }.welcome-mascot { height:212px; }.orbit { width:180px; height:180px; top:14px; }.orbit-two { width:204px; height:204px; top:2px; }.mascot-caption { font-size:11px; }.fortune-disclaimer { margin:10px 20px 18px; font-size:9px; }.fortune-quiz { padding:26px 23px 15px; }.fortune-quiz h2 { font-size:21px; }.fortune-option { padding:13px; }.fortune-option b { font-size:13px; }.fortune-result { padding:25px 22px 14px; }.result-heading h2 { font-size:22px; }.result-body { grid-template-columns:1fr; gap:20px; margin:12px auto; }.result-profile { font-size:13px; }.result-progress { margin-top:14px; padding-top:14px; }.recommended-guide { justify-content:center; }.recommended-guide .mascot-sprite { height:158px; }.recommended-guide h3 { font-size:22px; }.interview-grid { grid-template-columns:1fr; }.profile-card { margin-top:5px; }.guide-scene { grid-template-columns:125px minmax(0,1fr); min-height:220px; padding:7px 13px; }#guide-sprite { height:203px; }.guide-speech { padding:13px 0 13px 6px; }.guide-speech .eyebrow { font-size:8px; margin-bottom:7px; }#guide-message { font-size:14px; line-height:1.85; }.guide-flower { margin-top:9px; font-size:19px; }.guide-topline { padding:13px 15px; }#interviewer-head { font-size:11px; }.guide-topline .text-button { font-size:10px; }#guide-state { font-size:9px; }.shrine-composer { padding:16px; }.answer-options { padding-inline:16px; }.composer-row { gap:7px; }.composer-row .btn { padding-inline:13px; font-size:12px; }.composer-row textarea { font-size:16px; }.composer-foot { font-size:9px; align-items:start; }.composer-foot span { max-width:65%; line-height:1.8; }.composer-foot .text-button { font-size:10px; flex-shrink:0; padding-top:0; }.card-row.three { grid-template-columns:1fr; }.scenario-card { min-height:45px; }.shrine-footer { padding:22px 10px; }#char-modal .char-grid { grid-template-columns:1fr; }#char-modal .char-modal-foot .muted { display:none; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }

/* Keep the starting action visible on shorter laptops and soften the paper sprite edge. */
.shrine-conversation[data-state="sleeping"] .answer-options { display:none; }

@media (min-width:721px) {
  .shrine-container { margin-top:26px; }
  .journey-heading { margin-bottom:22px; }
  .journey-heading .eyebrow { margin-bottom:8px; }
  .journey-heading h1 { line-height:1.4; margin-bottom:9px; }
  .journey-steps li { padding-top:13px; padding-bottom:13px; }
  .fortune-welcome { padding-top:25px; min-height:360px; }
  .fortune-intro h2 { font-size:36px; line-height:1.5; margin-top:5px; margin-bottom:12px; }
  .fortune-lead { font-size:13px; line-height:1.85; }
  .welcome-mascot { height:300px; }
}

@media (max-width:720px) {
  .is-talking .journey-heading { display:none; }
  .shrine-interview .topbar #install-btn,.shrine-interview .topbar #notif-btn { display:none; }
  .is-talking .journey-steps { margin-bottom:16px; }
}

/* The summoner is a guest speaker; the selected shikigami stays in the header. */
.speaker-name { margin:0 0 8px; font-size:12px; font-weight:700; color:#756047; }
.obachan-speaking { border-color:#b994b0; }
.obachan-speaking .guide-scene { background:radial-gradient(ellipse at 16% 62%,#f0e2ef 0,transparent 65%); }
.obachan-speaking .speaker-name { color:#794e76; font-size:15px; }
.obachan-speaking .composer-foot { justify-content:flex-end; }
#guide-sprite.is-obachan { display:grid; place-items:center; width:170px; background-size:contain; background-repeat:no-repeat; mix-blend-mode:normal; }
@media (max-width:720px) { #guide-sprite.is-obachan { width:115px; }.speaker-name { font-size:11px; } }
