/* 右下の問い合わせチャット窓（contact-chat.mjs）。会員ページは行内のスタイルを禁じているので、見た目はすべてここに置く。 */
.juku-chat{--juku-chat-bottom:16px;font-family:"Inter","Noto Sans JP",system-ui,sans-serif;line-height:1.5;text-align:start}
.juku-chat *{box-sizing:border-box}
.juku-chat-fab{position:fixed;right:16px;bottom:var(--juku-chat-bottom);z-index:80;display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;padding:0;border:0;border-radius:50%;background:#c8381f;color:#fff;cursor:pointer;box-shadow:0 8px 22px rgba(51,39,17,.28);transition:background .15s,transform .15s}
.juku-chat-fab:hover{background:#a92c16;transform:translateY(-1px)}
.juku-chat-fab:focus-visible,.juku-chat-x:focus-visible,.juku-chat-send:focus-visible{outline:2px solid #1f3a6b;outline-offset:3px}
.juku-chat-panel{position:fixed;right:16px;bottom:calc(var(--juku-chat-bottom) + 66px);z-index:80;display:flex;flex-direction:column;width:min(360px,calc(100vw - 24px));max-height:min(560px,calc(100dvh - var(--juku-chat-bottom) - 86px));overflow:hidden;border:1px solid #d6cbbc;border-radius:14px;background:#fffdf9;color:#1f1b16;box-shadow:0 24px 60px rgba(51,39,17,.3)}
.juku-chat-panel[hidden]{display:none}
.juku-chat-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 10px 12px 16px;background:#1f1b16;color:#fbf7ef}
.juku-chat-title{margin:0;font-size:15px;font-weight:700;letter-spacing:.02em}
.juku-chat-x{border:0;background:transparent;color:#d9cfbf;font-size:22px;line-height:1;padding:2px 8px;border-radius:6px;cursor:pointer}
.juku-chat-x:hover{color:#fff}
.juku-chat-log{flex:1 1 auto;min-height:72px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:14px 14px 6px;background:#fbf7ef}
.juku-chat-msg{margin:0;max-width:88%;padding:9px 12px;border-radius:14px;font-size:13.5px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
.juku-chat-msg.is-them{align-self:flex-start;border:1px solid #e3d9c8;border-bottom-left-radius:4px;background:#fff;color:#2c261f}
.juku-chat-msg.is-me{align-self:flex-end;border-bottom-right-radius:4px;background:#1f3a6b;color:#fff}
.juku-chat-form{flex:0 0 auto;display:flex;flex-direction:column;gap:8px;margin:0;padding:10px 14px 14px;border-top:1px solid #e8dfd0;background:#fffdf9}
.juku-chat-field{display:flex;flex-direction:column;gap:3px;margin:0}
.juku-chat-field[hidden],.juku-chat-note[hidden]{display:none}
/* ログイン中の人に、メール欄の代わりに出す一言。 */
.juku-chat-note{margin:0;padding:7px 10px;border-radius:9px;background:#f3ecdf;color:#5b5348;font-size:12.5px;line-height:1.5}
.juku-chat-field>span{font-size:11.5px;font-weight:700;color:#5b5348}
.juku-chat-field input,.juku-chat-field textarea{width:100%;margin:0;padding:8px 10px;border:1px solid #cfc5b5;border-radius:9px;background:#fff;color:#1f1b16;font:400 16px/1.45 "Inter","Noto Sans JP",system-ui,sans-serif}
.juku-chat-field textarea{min-height:74px;max-height:160px;resize:vertical}
.juku-chat-field input:focus,.juku-chat-field textarea:focus{outline:2px solid #1f3a6b;outline-offset:0;border-color:#1f3a6b}
/* 人には見えない欄（自動投稿よけ）。 */
.juku-chat-trap{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.juku-chat-err{margin:0;font-size:12.5px;color:#a92c16}
.juku-chat-err[hidden]{display:none}
.juku-chat-send{align-self:flex-end;min-height:38px;padding:0 22px;border:0;border-radius:999px;background:#c8381f;color:#fff;font:700 13.5px "Inter","Noto Sans JP",system-ui,sans-serif;cursor:pointer;transition:background .15s,opacity .15s}
.juku-chat-send:hover{background:#a92c16}
.juku-chat-send:disabled{opacity:.55;cursor:progress}
/* 翻訳の結果を知らせる札は同じ角に出るので、チャットのボタンの上へずらす。 */
body .juku-language-status:not(.is-loading){bottom:84px}
/* 呼びかけの吹き出し：ボタンの左に出す。右下の角をボタンへ向ける。 */
.juku-chat-nudge{position:fixed;right:80px;bottom:calc(var(--juku-chat-bottom) + 4px);z-index:80;display:flex;align-items:flex-start;gap:2px;max-width:min(300px,calc(100vw - 96px));padding:4px 4px 4px 0;border:1px solid #d6cbbc;border-radius:14px 14px 4px 14px;background:#fffdf9;color:#1f1b16;box-shadow:0 12px 32px rgba(51,39,17,.24);animation:juku-chat-nudge-in .35s cubic-bezier(.2,.9,.3,1.2) both}
.juku-chat-nudge[hidden],.juku-chat.is-open .juku-chat-nudge{display:none}
.juku-chat-nudge-text{flex:1;min-width:0;margin:0;padding:8px 4px 8px 14px;border:0;background:transparent;color:inherit;font:inherit;font-size:14px;font-weight:700;line-height:1.45;text-align:start;overflow-wrap:anywhere;cursor:pointer}
.juku-chat-nudge-text:hover{color:#a92c16}
.juku-chat-nudge-x{flex:none;border:0;background:transparent;color:#8a7f70;font-size:18px;line-height:1;padding:6px 8px;border-radius:6px;cursor:pointer}
.juku-chat-nudge-x:hover{color:#1f1b16}
.juku-chat-nudge-text:focus-visible,.juku-chat-nudge-x:focus-visible{outline:2px solid #1f3a6b;outline-offset:2px}
@keyframes juku-chat-nudge-in{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}
@media(max-width:520px){.juku-chat-fab{width:50px;height:50px}.juku-chat-nudge{right:72px;max-width:calc(100vw - 86px)}.juku-chat-panel{right:12px;bottom:calc(var(--juku-chat-bottom) + 60px);max-height:calc(100dvh - var(--juku-chat-bottom) - 76px)}}
@media(prefers-reduced-motion:reduce){.juku-chat-fab{transition:none}.juku-chat-nudge{animation:none}}
