/* Flat comic ink, a sunny chat room and replies with room to read. */
body[data-test="group-chat"] { --gc-yellow:#ffe45c; --gc-ink:#202020; --gc-blue:#5067ed; --gc-gray:#686868; }
body[data-test="group-chat"][data-page="test"],
body[data-test="group-chat"][data-page="quiz"],
body[data-test="group-chat"][data-page="result"] { background:#fff; color:#202020; font-family:Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",sans-serif; }
.gc-shell { color:#202020; background:#fff; min-height:100svh; }
.gc-cover,.gc-room { max-width:480px; margin:0 auto; }
.gc-nav { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; min-height:68px; color:#202020; }
.gc-nav > span { font-size:13px; font-weight:600; }
.gc-icon-button { width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; padding:0; border:0; background:transparent; color:#202020; border-radius:8px; flex:0 0 44px; }
.gc-icon-button:focus-visible,.gc-start:focus-visible,.gc-answer:focus-visible { outline:3px solid #5067ed; outline-offset:4px; }
.gc-nav-space { width:44px; flex:0 0 44px; }
.gc-cover-shell { background:#fff; }
.gc-cover { background:#fff; padding-bottom:24px; }
.gc-cover .gc-nav { background:#ffe45c; }
.gc-cover-heading { text-align:center; padding:12px 20px 24px; background:#ffe45c; }
.gc-cover-hook { margin:0 0 14px; font-size:14px; line-height:1.5; font-weight:500; }
.gc-cover-heading h1 { margin:0; font-size:40px; line-height:1.2; letter-spacing:-.02em; font-weight:850; word-break:keep-all; }
.gc-cover-heading h1 span { display:inline-block; padding-top:4px; }
.gc-cover-art { width:100%; height:clamp(260px,76vw,340px); margin:6px auto 0; }
.gc-cover-art img { width:100%; height:100%; object-fit:contain; }
.gc-cover-invitation { padding:0 24px; text-align:center; }
.gc-cover-invitation > p:first-child { margin:0 0 20px; font-size:16px; line-height:1.6; font-weight:500; }
.gc-cover-invitation > p:first-child strong { font-weight:600; }
.gc-cover-meta { display:flex; justify-content:center; gap:12px; font-size:12px; line-height:1.5; margin-bottom:16px; }
.gc-cover-meta span + span { border-left:1px solid #20202055; padding-left:12px; }
.gc-start { width:100%; min-height:60px; padding:16px 20px; border:2px solid #202020; border-radius:12px; background:#202020; color:#fff; font-size:18px; line-height:1.4; font-weight:700; display:flex; align-items:center; justify-content:center; gap:14px; }
.gc-start:active { transform:translateY(2px); }
.gc-resume { padding:12px 20px; min-height:48px; border:0; background:transparent; font-size:15px; font-weight:600; text-decoration:underline; text-underline-offset:4px; }
.gc-cover-note { margin:14px 0 0; color:#444; font-size:12px; line-height:1.5; }
.gc-room { padding-bottom:28px; }
.gc-room-nav { border-bottom:1px solid #202020; }
.gc-room-name { flex:1; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.gc-room-name strong { font-size:17px; font-weight:750; }
.gc-room-name > span { font-size:13px; font-weight:600; }
.gc-progress { display:flex; gap:5px; padding:14px 20px 0; }
.gc-progress > span { height:4px; background:#ececec; border-radius:0; flex:1; }
.gc-progress > span.is-filled { background:#5067ed; }
.gc-conversation { padding:0 20px 24px; }
.gc-scene { color:#686868; font-size:13px; line-height:1.5; text-align:center; margin:22px 0 24px; }
.gc-message-row { display:flex; align-items:flex-start; gap:10px; margin:0 0 18px; }
.gc-message-row:last-child { margin-bottom:0; }
.gc-avatar { flex:0 0 44px; width:44px; height:44px; overflow:hidden; background:#fff; border:1px solid #d9d9d9; border-radius:15px; }
.gc-avatar > .sprite-art { width:44px; height:44px; }
.gc-message-body { min-width:0; flex:1; }
.gc-sender { display:block; font-size:12px; line-height:1.4; margin-bottom:6px; color:#555; }
.gc-bubble { display:inline-block; position:relative; margin:0; padding:14px 16px; max-width:100%; border:1px solid #202020; border-radius:0 16px 16px; font-size:16px; line-height:1.55; word-break:keep-all; overflow-wrap:anywhere; color:#202020; background:#fff; }
.gc-my-turn { background:#ffe45c; padding:20px 20px 24px; border-top:1px solid #202020; border-bottom:1px solid #202020; }
.gc-my-turn-label { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; font-size:13px; line-height:1.5; font-weight:650; }
.gc-my-turn-label > span:last-child { font-size:24px; line-height:16px; letter-spacing:2px; }
.gc-my-turn h1 { margin:0 0 22px; font-size:24px; line-height:1.45; font-weight:750; letter-spacing:-.015em; word-break:keep-all; overflow-wrap:anywhere; }
.gc-answers { display:grid; gap:12px; }
.gc-answer { position:relative; width:100%; min-height:64px; padding:16px 18px; border:1.5px solid #202020; border-radius:14px 14px 0 14px; background:#fff; color:#202020; font-size:17px; font-weight:550; line-height:1.5; text-align:left; word-break:keep-all; overflow-wrap:anywhere; transition:background .12s,color .12s; }
@media (hover:hover) { .gc-answer:hover { background:#f7f7f7; } }
.gc-answer.is-selected,.gc-answer[aria-pressed="true"] { background:#5067ed; border-color:#5067ed; color:#fff; }
.gc-answer:disabled:not(.is-selected) { opacity:.55; }
/* Result: a character profile and one quotable message, not an ornate report. */
body[data-test="group-chat"][data-page="result"] .site-header { border-bottom:1px solid #e5e5e5; background:#fff; }
.themed-result--group-chat { --theme-ink:#202020; --theme-accent:#202020; max-width:560px; padding-top:24px; padding-left:20px; padding-right:20px; }
.themed-result--group-chat .result-heading { margin-bottom:20px; }
.themed-result--group-chat .result-heading > .eyebrow { font-size:13px; color:#505050; font-weight:600; }
.themed-result--group-chat .result-heading > p { font-size:14px; color:#686868; line-height:1.5; }
.gc-profile { border:1.5px solid #202020; border-radius:0; background:#fff; max-width:480px; margin:0 auto; overflow:hidden; }
.gc-profile-heading { padding:24px 20px 12px; text-align:center; background:#ffe45c; }
.gc-profile-heading > p { margin:0 0 8px; font-size:14px; line-height:1.5; }
.gc-profile-heading h1 { margin:0 0 10px; font-size:36px; line-height:1.25; font-weight:850; letter-spacing:-.02em; word-break:keep-all; }
.gc-profile-heading > span { font-size:14px; line-height:1.5; font-weight:500; }
.gc-profile-art { width:100%; aspect-ratio:1; background:#fff; }
.gc-profile-art > .sprite-art { width:100%; height:100%; }
.gc-profile-content { padding:0 20px 24px; }
.gc-profile-reply { padding:18px; background:#ffe45c; border-radius:16px 16px 0; }
.gc-profile-reply > span { display:block; font-size:12px; font-weight:550; color:#505050; margin-bottom:6px; }
.gc-profile-reply > p { margin:0; font-size:20px; line-height:1.5; font-weight:700; word-break:keep-all; }
.gc-profile-summary { margin:20px 0 16px; font-size:16px; line-height:1.65; font-weight:500; word-break:keep-all; }
.gc-profile-traits { display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none; }
.gc-profile-traits li { padding:6px 10px; font-size:13px; line-height:1.5; border:1px solid #cecece; border-radius:6px; color:#303030; }
.gc-profile-footer { display:flex; justify-content:space-between; align-items:center; gap:12px; border-top:1px solid #202020; padding:14px 20px; font-size:12px; line-height:1.5; background:#fff; }
.gc-profile-footer strong { font-size:16px; font-weight:800; }
.themed-result--group-chat .result-actions { grid-template-columns:1fr; gap:10px; }
.themed-result--group-chat .result-actions button { border:1.5px solid #202020; border-radius:10px; font-size:17px; min-height:58px; }
.themed-result--group-chat .result-actions .primary-button { background:#202020; color:#fff; }
.themed-result--group-chat .result-actions .secondary-button { background:#ffe45c; color:#202020; }
.themed-result--group-chat .result-section { border-color:#dcdcdc; margin-top:32px; }
.themed-result--group-chat .result-section-title { font-size:22px; font-weight:750; letter-spacing:-.015em; }
.themed-result--group-chat .result-description p,
.themed-result--group-chat .insight-card p { color:#404040; font-size:16px; line-height:1.75; }
.themed-result--group-chat .insight-card > span { color:#5067ed; font-size:14px; font-weight:650; }
.themed-result--group-chat .match-card { background:#fff; border:1px solid #202020; border-radius:12px; padding:12px; gap:12px; }
.themed-result--group-chat .match-copy > span { color:#686868; }
.themed-result--group-chat .match-copy h3 { color:#202020; margin:4px 0; }
.themed-result--group-chat .match-copy p { color:#555; }
.themed-result--group-chat .match-card > .sprite-art.match-image { width:84px; height:84px; flex-shrink:0; border-radius:0; }
.themed-result--group-chat .all-types { grid-template-columns:1fr 1fr; gap:24px 16px; }
.themed-result--group-chat .type-mini > .sprite-art { margin:0; border-radius:0; }
.themed-result--group-chat .type-mini.is-active > .sprite-art { outline-color:#5067ed; }
.themed-result--group-chat .type-mini > span { font-size:16px; font-weight:650; color:#202020; }
.themed-result--group-chat .type-mini > small { color:#5067ed; font-weight:600; }
.themed-result--group-chat .result-restart > * { color:#202020; min-height:54px; }
.themed-result--group-chat .result-restart .secondary-button { background:#fff; border:1px solid #202020; border-radius:10px; }
.themed-result--group-chat .section-heading .eyebrow { color:#686868; }
/* Share sheet keeps the same yellow chat reply and readable black controls. */
.themed-share--group-chat { --ink:#202020; color:#202020; background:#fff; border-radius:20px; padding:26px 20px; }
.themed-share--group-chat .sheet-handle { background:#d5d5d5; }
.themed-share--group-chat .sheet-close { color:#202020; }
.themed-share--group-chat .sheet-heading { font-size:25px; font-weight:750; letter-spacing:-.015em; }
.themed-share--group-chat > .eyebrow { color:#555; font-weight:600; }
.themed-share--group-chat .share-preview { border:1px solid #202020; background:#ffe45c; border-radius:12px; padding:12px; gap:12px; margin:20px 0; }
.themed-share--group-chat .share-preview > .sprite-art { width:88px; height:88px; flex:0 0 88px; border-radius:8px; margin:0; }
.themed-share--group-chat .share-preview > div > span { font-size:12px; color:#444; }
.themed-share--group-chat .share-preview strong { font-size:20px; font-weight:750; color:#202020; }
.themed-share--group-chat .share-preview p { color:#333; font-size:14px; }
.themed-share--group-chat .share-option { border:1px solid #202020; border-radius:10px; color:#202020; background:#fff; font-size:16px; }
.themed-share--group-chat .share-option:first-child { background:#202020; color:#fff; }
.themed-share--group-chat .share-url-label { color:#555; }
.themed-share--group-chat .share-url-input { color:#202020; border-color:#cfcfcf; border-radius:6px; font-size:13px; }
@media (max-width:375px) {
 .gc-cover-heading h1 { font-size:36px; }
 .gc-cover-invitation { padding-left:20px; padding-right:20px; }
 .gc-conversation { padding-left:18px; padding-right:18px; }
 .gc-my-turn { padding-left:18px; padding-right:18px; }
 .gc-my-turn h1 { font-size:23px; }
 .gc-profile-heading h1 { font-size:32px; }
 .gc-profile-content { padding-left:16px; padding-right:16px; }
 .gc-profile-reply { padding:16px; }
 .themed-share--group-chat .share-preview > .sprite-art { width:76px; height:76px; flex-basis:76px; }
}

/* A single observation sheet; six captions surround the character. */
.themed-result--group-chat { padding-top:16px; padding-left:12px; padding-right:12px; }
.themed-result--group-chat > .result-heading { display:none; }
.gc-observation-card { border:0; max-width:480px; overflow:hidden; }
.gc-observation-svg { display:block; width:100%; height:auto; }
.themed-result--group-chat .result-actions { margin-top:20px; }
.themed-share--group-chat .gc-share-poster { max-width:190px; margin:12px auto 18px; }
.themed-share--group-chat .gc-share-poster .gc-observation-svg { border:1px solid #202020; }
@media (max-width:375px) {
 .themed-result--group-chat { padding-left:8px; padding-right:8px; }
}
