
:root{--ink:#392930;--muted:#66736c;--green:#99004d;--paper:#fffaf6;--line:#e9d9df;--warm:#eee9df;--mouth:0}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'FOT-スーラ ProN','Yu Gothic UI','Meiryo',sans-serif}button,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}a{color:inherit}header{max-width:1370px;margin:auto;padding:27px 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{text-decoration:none;font-size:24px;font-weight:800;letter-spacing:-1px}.brand>span{margin-left:6px}.brand small{display:block;font-size:9px;letter-spacing:2px;font-weight:500;margin-top:5px}.live{font-size:12px;display:flex;align-items:center;gap:8px}.live i{width:7px;height:7px;background:#99004d;border-radius:50%}main{max-width:1280px;margin:auto;display:grid;grid-template-columns:46% 54%;padding:44px 30px 36px;gap:0}.stage{padding:0 48px 0 20px;border-right:1px solid var(--line)}.eyebrow{font-size:11px;letter-spacing:2px;color:#738577;font-weight:700}h1{font-size:clamp(32px,3.2vw,48px);line-height:1.4;letter-spacing:1px;margin:18px 0 12px;font-weight:700}h1 em{font-style:normal;color:#99004d}.intro p{color:var(--muted);font-size:14px;line-height:1.8;margin:0}.portrait-wrap{position:relative;margin:22px auto 0;max-width:380px;aspect-ratio:1;overflow:hidden;border-radius:48% 48% 22px 22px;background:#f5f2eb;isolation:isolate}#portrait{position:absolute;inset:0;background-image:url('/avatar.png');background-size:200% 200%;background-position:0% 0%;transform-origin:center bottom;transition:transform 120ms ease}.portrait-caption{position:absolute;bottom:16px;left:18px;color:white;text-shadow:0 1px 6px #0008;display:flex;flex-direction:column;gap:3px}.portrait-caption span{font-size:9px;letter-spacing:3px}.portrait-caption b{font-size:22px;letter-spacing:4px}.voice-state{display:flex;align-items:center;justify-content:center;gap:13px;margin:20px 0 14px;font-size:12px;color:var(--muted)}#wave{height:22px;display:flex;align-items:center;gap:3px}#wave i{width:3px;height:5px;border-radius:2px;background:#b8487d;transition:height 90ms}.disclosure{max-width:380px;font-size:10px;color:#778178;line-height:1.8;margin:0 auto;text-align:center}.conversation{padding:0 0 0 48px;min-width:0}.chat-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}h2{font-size:24px;margin:9px 0 18px}.text-button{background:none;border:0;font-size:10px;color:var(--muted);white-space:nowrap}#messages{min-height:185px;max-height:380px;overflow:auto;scroll-behavior:smooth;padding:0 4px 6px 0}.message{padding:20px 23px;margin:8px 0 16px;border-radius:14px;background:#f9edf2;font-size:14px;line-height:1.9}.message p{margin:8px 0 0;white-space:pre-wrap}.message-label{font-size:10px;color:#99004d;font-weight:700;letter-spacing:1px}.message.user{margin-left:45px;background:white;border:1px solid var(--line)}.message audio{width:100%;height:36px;margin-top:16px}.citations{font-size:11px;margin-top:14px;padding-top:12px;border-top:1px solid #ccd6cc;display:grid;gap:8px}.citations a{line-height:1.6;text-underline-offset:3px}.suggestions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 20px}.suggestions button{background:transparent;border:1px solid #dcb6c7;border-radius:99px;padding:9px 13px;font-size:11px;color:#80435e;text-align:left}form{border:1px solid #c99aaf;border-radius:14px;padding:15px;background:white;box-shadow:0 4px 20px #26433405}textarea{border:0;resize:vertical;width:100%;background:transparent;outline:none;color:var(--ink);font-size:14px;line-height:1.7;min-height:78px}textarea::placeholder{color:#9ca59d}.composer-bottom{display:flex;align-items:center;gap:12px;padding-top:10px}.mic{border:0;background:#f8eaf1;color:#99004d;padding:10px 12px;border-radius:8px;font-size:12px}.mic[aria-pressed=true]{background:#fae2dd;color:#973c2c}#count{font-size:10px;color:#919a91;margin-left:auto}.send{background:var(--green);color:white;border:0;padding:11px 18px;border-radius:8px;font-size:13px}.send span{margin-left:12px}#notice{font-size:11px;color:var(--muted);min-height:32px;line-height:1.7;margin:11px 3px}.sources-info{border-top:1px solid var(--line);padding-top:17px;color:#718073;font-size:11px;line-height:1.8}.sources-info b{font-size:12px;font-weight:600}.sources-info p{margin:5px 0}.sources-info a{font-size:10px;text-underline-offset:3px}footer{border-top:1px solid var(--line);display:flex;gap:24px;justify-content:space-between;max-width:1280px;margin:auto;padding:20px 30px;color:#8a938b;font-size:9px;line-height:1.8}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:focus-visible{outline:3px solid #d39a4b;outline-offset:4px}@media(max-width:850px){header{padding:18px 22px}.brand{font-size:20px}main{grid-template-columns:1fr;padding:24px 20px;gap:26px}.stage{border:0;padding:0;display:grid;grid-template-columns:1fr 150px;align-items:center;gap:6px}.intro h1{font-size:28px;margin:10px 0}.intro p{font-size:11px}.portrait-wrap{width:150px;margin:0}.portrait-caption{left:10px;bottom:8px}.portrait-caption b{font-size:13px}.portrait-caption span{font-size:7px}.voice-state{grid-column:1/-1;margin:8px 0 2px}.disclosure{grid-column:1/-1;font-size:9px;max-width:none}.conversation{padding:0}h2{font-size:21px}#messages{min-height:100px;max-height:370px}.message{font-size:13px;padding:15px 18px}.suggestions{margin-bottom:15px}.suggestions button{font-size:10px}footer{display:block;padding:16px 20px}footer span{display:block;margin-bottom:5px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* 奈良なおし公式サイトのえんじ色を基調にした相談窓口 */
header{border-top:7px solid #99004d;padding-top:21px}.brand{display:flex;flex-direction:column;align-items:flex-start;letter-spacing:1px}.brand small{font-size:13px;letter-spacing:1px;color:#99004d;font-weight:700;margin:0 0 3px}.brand>span{font-size:34px;line-height:1.2;margin:0;letter-spacing:3px;font-weight:900}.live{font-size:11px;color:#8a5d73}.eyebrow{font-size:13px;letter-spacing:1px;color:#99004d}.intro h1{font-size:clamp(30px,3vw,43px);letter-spacing:0}.intro p{line-height:1.9}.portrait-wrap{border-radius:20px 20px 5px 5px;box-shadow:9px 9px 0 #f0dce5}.portrait-caption{background:#99004de8;padding:7px 15px;text-shadow:none;left:0;bottom:15px;border-radius:0 4px 4px 0}.portrait-caption span{letter-spacing:1px;font-size:10px}.portrait-caption b{letter-spacing:3px}.disclosure{font-size:11px}.message-label{letter-spacing:0}.message{border-radius:5px 18px 18px 18px}.message.user{border-radius:18px 5px 18px 18px}.suggestions button{border-radius:6px}.local-links{display:flex;gap:20px;font-size:12px;color:#99004d;margin:14px 0 20px;text-underline-offset:4px}h2{font-size:22px}.sources-info{font-size:11px}@media(max-width:850px){.brand>span{font-size:28px}.brand small{font-size:11px}.live{font-size:9px;max-width:140px;text-align:right}.intro h1{font-size:27px}.portrait-caption{padding:4px 9px;bottom:9px}.portrait-caption span{font-size:8px}.portrait-caption b{font-size:14px}.disclosure{font-size:10px}.chat-heading h2{font-size:19px}}

/* Speaking avatar beside the current answer. */
.message.assistant{display:flow-root}
.message .portrait-wrap{float:left;width:76px;height:76px;max-width:76px;aspect-ratio:1;margin:2px 14px 8px 0;border-radius:50%;box-shadow:none;flex-shrink:0}
.message .portrait-caption{display:none}
.message .citations,.message .preparation-progress,.message audio{clear:both}
.message .preparation-progress{padding-top:10px}
@media(max-width:850px){.stage{grid-template-columns:1fr}.message .portrait-wrap{width:60px;height:60px;max-width:60px;margin-right:10px}}
