/* 캠퍼스 디자인 토큰. 크기·간격·radius·그림자·서체는 PiGNiTO 허브(pignito_hub, Tailwind input.css·tailwind.config.cjs)를 따르고, 색은 캠퍼스 팔레트를 쓴다. */
@font-face{font-family:"Pretendard";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/pretendard/Pretendard-Regular.woff2") format("woff2")}
@font-face{font-family:"Pretendard";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/pretendard/Pretendard-SemiBold.woff2") format("woff2")}
@font-face{font-family:"Pretendard";font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/pretendard/Pretendard-Bold.woff2") format("woff2")}
:root{
  /* 색: 캠퍼스 팔레트를 허브 토큰 이름에 담는다 */
  --surface:#fffef9;--surface-subtle:#f2f4ed;--surface-inverse:#1b3a2c;--hairline:#e3e7de;--border-strong:#5c6b60;--border-hover:#b6c4ad;
  --ink:#263a2e;--ink-muted:#5c6b60;--ink-heading:#242c25;--on-inverse:#fffef9;
  --primary:#244c3a;--primary-strong:#1b3a2c;--primary-tint:#e8f1d4;--focus-ring:#244c3a;
  --danger:#7b3418;--danger-tint:#fbece4;
  --page-bg:#eeeede;--scene-bg:#e7e8db;--scrollbar-track:#c1d7c4;--backdrop:#0006;
  --glass:#fffdefcc;--glass-solid:#fffdef;--glass-strong:#fffdefed;--glass-hover:#f0eedf;--glass-ink:#244c3a;
  /* 밤·저녁 색 */
  --night-surface:#182438;--night-surface-glass:#182438f5;--night-surface-subtle:#223344;--night-raised:#223146;--night-hover:#304157;--night-hover-strong:#22314a;
  --night-hairline:#3b4b58;--night-border:#637789;--night-ink:#edf0e4;--night-muted:#aebeb9;--night-muted-cool:#bdcbd2;--night-accent:#d6e3d5;--night-accent-strong:#c3d8b7;
  --night-danger:#f3c9b8;--night-danger-tint:#3c2a28;--night-shadow:#080f1c40;--night-page-bg:#101a30;
  /* 서체 */
  --font-sans:"Pretendard",-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",sans-serif;
  /* 글자 크기: 허브 Tailwind fontSize(1440 너비 기준, 화면 폭에 맞춰 0.9~1.1배) */
  --text-micro:clamp(12px,.9vw,14px);--text-label:clamp(13px,.97vw,15px);--text-caption:clamp(14px,1.04vw,17px);--text-body:clamp(14px,1.11vw,18px);--text-body-lg:clamp(15px,1.18vw,19px);
  --text-lead:clamp(17px,1.32vw,21px);--text-title-sm:clamp(20px,1.53vw,24px);--text-title:clamp(22px,1.67vw,26px);--text-h3:clamp(29px,2.22vw,35px);
  /* 간격 */
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--space-12:48px;
  /* 모서리 */
  --radius-sm:2px;--radius-md:4px;--radius-lg:6px;--radius-xl:7px;--radius-full:9999px;--radius-control:8px;--radius-card:12px;--radius-panel:16px;
  /* 그림자: 허브 크기, 캠퍼스 초록 그림자 색 */
  --shadow-sm:0 10px 10px #183c2914;--shadow-md:0 5px 30px #183c291f;--shadow-lg:0 6px 50px #183c2924;--shadow-label:0 3px 12px #25492e30;
  /* 컨트롤 높이: 허브 .pg-btn 44 · .pg-btn--sm 32 · .pg-btn--lg 52 · .pg-input 40 */
  --control-h:44px;--control-h-sm:32px;--control-h-lg:52px;--input-h:40px;
}
:root{font-family:var(--font-sans);font-synthesis:none;color:var(--ink);background:var(--page-bg);--green:var(--primary);--muted:#62766a;--font-caption:var(--text-caption);--font-small:var(--text-body);--font-body:var(--text-lead);--font-subtitle:var(--text-title-sm);--font-title:var(--text-h3);font-size:16px;line-height:1.6}*{box-sizing:border-box}body{margin:0;overflow-x:hidden;overflow-y:auto}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}button:focus-visible,a:focus-visible{outline:none}a{color:inherit;text-decoration:none}[hidden]{display:none!important}html{scrollbar-width:thin;scrollbar-color:var(--green) var(--scrollbar-track)}main{position:fixed;inset:0;height:100svh;overflow:hidden;background:var(--scene-bg)}.header{position:fixed;z-index:30;pointer-events:none;top:0;left:0;right:0;height:63px;margin:0 40px;display:flex;align-items:center;gap:22px}.brand{pointer-events:auto;order:0;display:flex;align-items:center;gap:9px;font-size:var(--font-subtitle);font-weight:700;letter-spacing:-.02em}.brand>span{display:flex;flex-direction:column;justify-content:center;line-height:1.2;transform:translateY(4px)}.brand small{display:block;line-height:1.5;font-size:var(--font-caption);letter-spacing:1.8px;font-weight:600;margin-top:-5px}.crest{display:block;width:52px;height:52px;object-fit:contain;flex-shrink:0}.intro{position:absolute;z-index:5;top:12vh;left:40px;pointer-events:none;transition:opacity .35s,transform .35s}h1{font-family:var(--font-sans);font-size:clamp(44px,5vw,72px);font-weight:700;line-height:1.16;letter-spacing:-.03em;margin:0;max-width:650px;color:var(--ink-heading)}h1>span{color:var(--green)}.intro-copy{font-size:var(--font-body);line-height:1.95;color:var(--green);margin:29px 0 0}.on-walk .intro{opacity:0;transform:translateY(-15px);visibility:hidden}.world{position:absolute;inset:0;z-index:0;touch-action:pan-y}.world canvas{display:block;width:100%;height:100%;outline:none;cursor:default;touch-action:pan-y}.labels{position:absolute;inset:0;pointer-events:none}.label{position:absolute;transform:translate(-50%,-100%);pointer-events:none;opacity:0;white-space:nowrap;display:flex;align-items:center;gap:6px;padding:7px 11px 7px 7px;font-size:var(--font-small);font-weight:600;border:0;border-radius:var(--radius-lg);background:var(--green);color:var(--on-inverse);box-shadow:var(--shadow-label)}.label.hovered,.label:focus-visible{opacity:1}.loading,.webgl-error{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:var(--glass-strong);padding:var(--space-3) var(--space-6);border-radius:var(--radius-card);font-size:var(--text-body);line-height:1.5}.walk-stops{position:absolute;z-index:15;right:20px;top:19%;display:flex;flex-direction:column;gap:5px;align-items:flex-end}.walk-stop{display:flex;align-items:center;gap:8px;padding:3px 6px;min-height:19px}.walk-stop>span{font:var(--font-caption) var(--font-sans);color:var(--green);opacity:0;min-width:10px;text-align:right}.walk-stop i{display:block;width:6px;height:6px;border:1px solid var(--green);border-radius:50%;transition:background .2s,transform .2s}.walk-stop.active i{background:var(--green);border-color:var(--green);transform:scale(1.25)}.walk-stop.active>span,.walk-stop:hover>span{opacity:1}.detail{position:absolute;z-index:15;left:28px;top:76px;width:min(68vw,960px);height:calc(100svh - 160px);max-height:calc(100svh - 148px);overflow:auto;overscroll-behavior:contain;padding:22px 28px;border:1px solid var(--hairline);border-radius:var(--radius-card);background:var(--glass-strong);backdrop-filter:blur(12px);box-shadow:var(--shadow-md)}.detail h2{font-size:var(--font-title);letter-spacing:-.02em;margin:6px 0 10px;font-weight:700}
.label .label-name{display:block;width:auto;height:auto;background:none;color:inherit;font:inherit;border-radius:0}.walk-stop:focus-visible>span{opacity:1}.walk-stop>.stop-name{font:var(--font-caption) var(--font-sans);background:var(--glass-strong);border-radius:var(--radius-md);padding:2px var(--space-2);visibility:hidden}.walk-stop:hover>.stop-name,.walk-stop:focus-visible>.stop-name{visibility:visible}
@media(min-width:1600px){h1{font-size:94px}.intro{top:17vh}}
@media(max-height:700px) and (min-width:768px){.intro{top:14vh}h1{font-size:62px}.intro-copy{margin-top:22px}.detail{top:72px;max-height:calc(100svh - 140px);padding:18px 24px}.detail h2{font-size:var(--font-title)}}
@media(max-width:1000px) and (min-width:768px){.intro{left:36px}h1{font-size:60px}.header{margin:0 36px}.detail{left:24px;padding:22px}.detail h2{font-size:var(--font-title)}.walk-stops{right:16px}}
@media(max-width:767px){.header{height:61px;margin:0 20px;gap:12px}.brand{font-size:var(--font-body);gap:7px}.brand small{font-size:var(--font-caption);letter-spacing:.3px}.crest{width:48px;height:48px}.intro{top:14vh;left:20px}h1{font-size:clamp(36px,10.5vw,50px);line-height:1.2;max-width:calc(100vw - 40px)}.intro-copy{font-size:var(--font-body);line-height:1.8;margin-top:22px}.walk-stops{right:10px;top:19%;gap:3px}.walk-stop{min-height:15px;gap:4px;padding:3px}.walk-stop i{width:5px;height:5px}.walk-stop>span{font-size:var(--font-caption);min-width:9px}.detail{left:20px;right:20px;top:112px;bottom:74px;width:auto;height:auto;max-height:none;overflow:auto;padding:14px 17px;border-radius:var(--radius-card)}.detail h2{font-size:var(--font-title);margin:4px 0 8px}.label{font-size:var(--font-small);padding:5px 8px 5px 5px;gap:5px}.webgl-error{width:245px;text-align:center}}
@media(max-width:767px) and (max-height:720px){.intro{top:13vh}h1{font-size:35px}.intro-copy{font-size:var(--font-body);margin-top:17px}.detail{bottom:74px;max-height:none}.detail h2{font-size:var(--font-title)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

.intro h1{font-size:clamp(30px,3.4vw,56px);line-height:1.3;letter-spacing:-.03em;max-width:none;white-space:nowrap;word-break:keep-all}.intro-copy{max-width:none;word-break:keep-all;text-wrap:balance;margin-top:12px}
.intro-copy>span{display:inline-block}
@media(max-width:767px){.intro h1{font-size:clamp(16px,5.5vw,38px);max-width:calc(100vw - 48px)}.intro-copy{max-width:calc(100vw - 48px);margin-top:10px}}
.campus-night{color-scheme:dark;--green:var(--night-accent);--muted:var(--night-muted-cool);color:var(--night-ink);background:var(--night-page-bg);scrollbar-color:var(--night-border) var(--night-surface)}
/* 저녁·밤에도 제목 뒤에 장면 색 그라데이션을 깔아, 제목 영역과 겹치는 건물 이름표가 글자 뒤로 묻히게 한다. */
.intro h1,.intro-copy{text-shadow:0 0 1px var(--intro-backdrop,var(--scene-bg)),0 0 10px color-mix(in srgb,var(--intro-backdrop,var(--scene-bg)) 90%,transparent),0 0 26px color-mix(in srgb,var(--intro-backdrop,var(--scene-bg)) 75%,transparent)}
.campus-title-dark .intro h1,.campus-title-dark .intro-copy{text-shadow:0 1px 2px rgb(0 0 0/.5),0 0 18px rgb(0 0 0/.35)}
:is(.campus-evening,.campus-night) .header,:is(.campus-evening,.campus-night) .intro h1{color:var(--night-ink)}
.campus-title-dark .intro{--green:var(--night-accent);--ink-heading:var(--night-ink)}
.intro-line{display:block;text-wrap:balance}
.intro h1>.intro-line:first-child{color:inherit}
.intro-phrase{white-space:nowrap}

@media(max-width:767px){.intro{top:max(14vh,128px)}}
.campus-night .detail,.campus-night .loading,.campus-night .webgl-error{background:var(--night-surface-glass);border-color:var(--night-hairline);color:var(--night-ink);box-shadow:0 5px 30px var(--night-shadow)}
.campus-night .walk-stop>.stop-name,.campus-night .label{background:var(--night-raised);color:var(--night-ink)}
@media(max-width:767px){
  main{overflow:clip}
  .header{top:env(safe-area-inset-top);margin-left:max(24px,env(safe-area-inset-left));margin-right:max(24px,env(safe-area-inset-right))}
  .intro{left:max(24px,env(safe-area-inset-left));right:max(24px,env(safe-area-inset-right));top:max(14svh,calc(128px + env(safe-area-inset-top)))}
  .intro h1{font-size:clamp(24px,6.5vw,38px);max-width:100%;white-space:normal;overflow-wrap:break-word}
  .intro-copy{font-size:var(--text-body-lg);max-width:100%;line-height:1.7}
  .walk-stops{display:none}
  .detail{left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));top:auto;bottom:calc(76px + env(safe-area-inset-bottom));height:min(50svh,calc(100svh - 196px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));padding:0 16px 16px;scroll-padding-top:56px}
  .detail h2{font-size:var(--text-title)}
}

@media(max-width:767px) and (max-height:500px) and (orientation:landscape){
  .intro{top:calc(66px + env(safe-area-inset-top))}
  .intro h1{font-size:22px;line-height:1.2}
  .intro-copy{font-size:var(--text-caption);line-height:1.4;margin-top:6px}
  .detail{left:auto;width:48vw;height:calc(100svh - 136px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
}
@media(max-width:360px){
  .intro h1{font-size:22px}
  .intro-copy{font-size:var(--text-caption)}
}
.detail h2{margin:8px 0 0}

.label.campus-building-marker{opacity:0;pointer-events:none;flex-direction:column;gap:8px;padding:0 8px 10px;background:none;box-shadow:none;color:var(--green);cursor:pointer}
.campus-building-marker .entry-pyramid{display:block;width:56px;height:64px;transition:transform .2s;filter:drop-shadow(0 3px 3px #16382370)}
.entry-pyramid svg{display:block;width:100%;height:100%;overflow:visible;animation:entry-pyramid-float 1.8s ease-in-out infinite}
.campus-building-marker .label-name{display:flex;align-items:center;padding:var(--space-2) var(--space-3);border:0;border-radius:var(--radius-xl);background:rgb(255 255 255 / .1);-webkit-backdrop-filter:blur(10px) brightness(.82);backdrop-filter:blur(10px) brightness(.82);color:#fff;box-shadow:none;font:600 14px/1.43 var(--font-sans);transition:background .2s}
.campus-building-marker:hover .entry-pyramid,.campus-building-marker:focus-visible .entry-pyramid{transform:scale(1.15)}
.campus-building-marker:hover .label-name,.campus-building-marker:focus-visible .label-name{background:rgb(255 255 255 / .2)}
@keyframes entry-pyramid-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

.label.campus-building-marker.marker-visible{opacity:1;pointer-events:auto}
.marker-current .label-action{display:none}
.label.campus-building-marker.marker-name{opacity:1;pointer-events:auto;padding:0 4px 6px}
.marker-name .entry-pyramid,.marker-name .label-action{display:none}
.campus-building-marker.marker-name .label-name{padding:var(--space-1) 10px;font-size:13px;font-weight:600;line-height:1.5;box-shadow:none}
.campus-building-marker.marker-collapsed .label-name{width:12px;height:12px;padding:0;font-size:0;border:2px solid #fffef2;background:var(--primary)}
:is(.campus-evening,.campus-night) .campus-building-marker.marker-collapsed .label-name{border-color:var(--night-raised);background:var(--night-ink)}

/* Building conversations */
.detail.campus-chat{--chat-ink:var(--ink);--chat-muted:var(--ink-muted);--chat-line:var(--hairline);--chat-soft:var(--surface-subtle);--chat-chip:var(--primary-tint);--chat-strong:var(--border-strong);left:28px;top:24px;width:min(58vw,760px);height:calc(100svh - 48px);max-height:none;padding:0;overflow:hidden;border-radius:var(--radius-panel);background:var(--surface);color:var(--chat-ink);box-shadow:var(--shadow-lg)}
.chat-toolbar{position:absolute;z-index:1;top:12px;right:12px;color:var(--chat-muted)}#chat-building{display:none}
.chat-toolbar button{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius-full);font-size:14px}.chat-toolbar button:hover{background:var(--chat-soft)}.chat-toolbar #close-detail{margin-left:auto;font-size:18px}
.chat-layout{display:flex;flex-direction:column;height:100%}
.chat-profile{flex-shrink:0;padding:16px 64px 14px 32px}.chat-person{display:flex;align-items:center;gap:14px}.chat-avatar{display:block;flex-shrink:0;width:52px;height:52px;object-fit:cover;object-position:50% 12%;border-radius:50%;background:var(--primary-tint)}.chat-identity{min-width:0}.chat-eyebrow{margin:0 0 6px;color:var(--chat-muted)}.detail.campus-chat h2{margin:0;font-size:var(--chat-text-title);line-height:var(--chat-leading-title);letter-spacing:-.02em;font-weight:700}
.chat-asker{margin:8px 0 0;color:var(--chat-muted);font-size:12px;line-height:1.5}
.chat-conversation{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;padding:0 32px 12px}.chat-thread{flex:1;min-height:0;margin-right:-32px;padding-right:32px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;border-top:1px solid var(--chat-line)}.chat-welcome{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;min-height:100%;padding:20px 0}.chat-welcome>p{white-space:pre-wrap;margin:0 0 16px}
.chat-composer{position:relative;display:flex;flex-shrink:0;align-items:flex-end;gap:8px;padding:8px 8px 8px 16px;border:1px solid var(--chat-line);border-radius:var(--radius-panel);background:var(--chat-soft)}.chat-input-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.chat-composer:hover{border-color:var(--chat-strong)}.chat-composer:focus-within{outline:2px solid var(--focus-ring);outline-offset:-1px;border-color:transparent}.chat-composer textarea{resize:none;width:100%;min-width:0;max-height:140px;padding:7px 0;border:0;outline:none;background:transparent;color:inherit}.chat-composer textarea::placeholder{color:var(--chat-muted)}.chat-composer button{flex-shrink:0;display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius-full);background:var(--primary);color:var(--on-inverse);font-size:15px;transition:background-color .15s ease-out}.chat-composer button:not(:disabled):hover{background:var(--primary-strong)}.chat-composer button:disabled{border:1px solid var(--chat-line);background:transparent;color:var(--chat-muted);cursor:default}
.chat-messages{display:flex;flex-direction:column;gap:32px;padding:24px 0}.chat-messages:empty{display:none}.chat-message{max-width:90%}.chat-message-author{display:flex;align-items:center;gap:8px;margin-bottom:8px;color:var(--chat-muted)}.chat-message-author img{width:28px;height:28px;object-fit:cover;border-radius:var(--radius-full)}.chat-message p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.chat-message-user{align-self:flex-end}.chat-message-user .chat-message-author{justify-content:flex-end}.chat-message-user p{padding:var(--space-3) var(--space-4);border-radius:var(--radius-panel) var(--radius-panel) var(--radius-md) var(--radius-panel);background:var(--chat-soft)}.chat-message-assistant{align-self:stretch;max-width:100%}
:is(.campus-evening,.campus-night) .detail.campus-chat{--chat-ink:var(--night-ink);--chat-muted:var(--night-muted);--chat-line:var(--night-hairline);--chat-soft:var(--night-surface-subtle);--chat-chip:var(--night-surface-subtle);--chat-strong:var(--night-border);--focus-ring:var(--night-accent);background:var(--night-surface);border-color:var(--chat-line);color:var(--chat-ink)}:is(.campus-evening,.campus-night) .chat-composer button,:is(.campus-evening,.campus-night) .chat-composer button:not(:disabled):hover{background:var(--night-accent-strong);color:var(--night-surface)}:is(.campus-evening,.campus-night) .chat-composer button:disabled{background:transparent;color:var(--chat-muted)}

.chat-status{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:var(--space-2) var(--space-2) var(--space-2) var(--space-4);border-radius:var(--radius-xl);background:var(--danger-tint);color:var(--danger)}.chat-status[hidden]{display:none}.chat-status button{flex-shrink:0;margin-left:auto;min-height:var(--control-h-sm);padding:var(--space-1) var(--space-3);border:1px solid currentColor;border-radius:var(--radius-control)}
:is(.campus-evening,.campus-night) .chat-status{background:var(--night-danger-tint);color:var(--night-danger)}

/* 대화가 시작되면 프로필을 한 줄로 접는다 */
/* 담당자 소개는 대화 전후 같은 작은 헤더로 둔다(줄어드는 전환 없음). 패널이 어두운 시간대에는 아바타 원도 어두운 면으로 둔다. */
:is(.campus-evening,.campus-night) .chat-avatar{background:var(--night-surface-subtle)}
.chat-message .chat-reply>*{margin:0}.chat-message .chat-reply>*+*{margin-top:12px}.chat-reply ol,.chat-reply ul{padding-left:1.4em}.chat-reply li+li{margin-top:6px}.chat-reply li::marker{color:var(--chat-muted)}.chat-reply strong{font-weight:700}.chat-reply p{white-space:normal}
.chat-typing{display:flex;align-items:center;gap:10px;color:var(--chat-muted)}.chat-typing-dots{display:inline-flex;gap:4px}.chat-typing-dots i{width:6px;height:6px;border-radius:50%;background:currentColor;animation:chat-typing 1.2s ease-in-out infinite}.chat-typing-dots i:nth-child(2){animation-delay:.15s}.chat-typing-dots i:nth-child(3){animation-delay:.3s}
@keyframes chat-typing{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.chat-typing-dots i{animation:none;opacity:.6}}
/* Korean breaks between words, not inside them. */
.chat-message,.chat-welcome>p{word-break:keep-all;overflow-wrap:break-word}
.chat-quick{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}.chat-quick[hidden]{display:none}.chat-quick button{flex-shrink:0;min-height:36px;padding:0 var(--space-3);border:1px solid var(--chat-line);border-radius:var(--radius-full);white-space:nowrap;transition:background .15s,border-color .15s}.chat-quick button:hover{background:var(--chat-soft);border-color:var(--chat-strong)}.chat-quick button:disabled{opacity:.4;cursor:default}

.walk-stops,.time-switch{border:0;border-radius:var(--radius-card);background:var(--glass);color:var(--glass-ink);box-shadow:none}

/* Each press cycles 실시간 → 낮 → 밤. */
.time-switch{position:fixed;z-index:31;top:20px;right:20px;width:44px;height:44px}
.time-toggle{position:relative;display:grid;place-items:center;width:100%;height:100%;border-radius:var(--radius-xl);font-size:18px;color:inherit;transition:background .2s}
.time-toggle:hover,.time-toggle:focus-visible,.walk-stop:hover,.walk-stop:focus-visible{background:var(--glass-hover);border-radius:var(--radius-lg)}
.time-toggle:hover,.time-toggle:focus-visible{border-radius:var(--radius-xl)}
.time-toggle:disabled{cursor:default;opacity:.6}
.is-turning .time-icon,.is-turning .time-now{animation:time-turn .35s ease}
@keyframes time-turn{from{opacity:0;transform:rotate(-90deg) scale(.6)}to{opacity:1;transform:none}}
/* In 실시간 mode the main icon follows the real hour (sun or moon) and the real time (HH:MM) sits beside it, so the button widens. */
.time-now{display:none}.time-toggle[data-mode="auto"] .time-icon{display:none}.time-toggle[data-mode="auto"] .time-now{display:block;line-height:1}
.time-clock{display:none;font:600 14px/1 var(--font-sans);font-variant-numeric:tabular-nums;letter-spacing:0}
.time-toggle[data-mode="auto"]{display:flex;align-items:center;justify-content:center;gap:6px}
.time-toggle[data-mode="auto"] .time-clock{display:block}
.time-switch:has(.time-toggle[data-mode="auto"]){width:var(--time-switch-auto-w,88px)}
/* The evening sky is already dark, so 실시간 shows the moon from 18:00 with the evening lighting. */
.time-now .fa-moon,:is(.campus-evening,.campus-night) .time-now .fa-sun{display:none}
:is(.campus-evening,.campus-night) .time-now .fa-moon{display:block}
.time-toast{position:absolute;top:calc(100% + 8px);right:0;margin:0;padding:var(--space-2) var(--space-3);border-radius:var(--radius-lg);background:var(--primary);color:var(--glass-solid);font:400 14px/1.43 var(--font-sans);box-shadow:var(--shadow-md);white-space:nowrap;pointer-events:none;opacity:0;transform:translateY(-4px);transition:opacity .2s,transform .2s}
.time-toast.is-visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.is-turning .time-icon,.is-turning .time-now{animation:none}.time-toast{transition:none}}
.campus-night .walk-stops,.campus-night .time-switch{background:var(--night-surface-glass);color:var(--night-ink);box-shadow:0 3px 12px var(--night-shadow)}
.campus-night .time-toast{background:var(--night-accent);color:var(--night-surface)}
.campus-night .time-toggle:hover,.campus-night .time-toggle:focus-visible,.campus-night .walk-stop:hover,.campus-night .walk-stop:focus-visible{background:var(--night-hover-strong);border-radius:var(--radius-lg)}
.campus-night .time-toggle:hover,.campus-night .time-toggle:focus-visible{border-radius:var(--radius-xl)}

.walk-stops{align-items:center;gap:2px;padding:6px}
.walk-stop{position:relative;justify-content:center;min-width:40px;min-height:32px}
.walk-stop i{width:8px;height:8px}
.walk-stop>.stop-name{position:absolute;right:100%;white-space:nowrap;margin-right:6px}
.walk-stop[data-stop="0"] i{display:none}
.walk-stop[data-stop="0"]>span:not(.stop-name){min-width:0;opacity:.5;font-size:18px}
.walk-stop[data-stop="0"].active>span:not(.stop-name),.walk-stop[data-stop="0"]:hover>span:not(.stop-name){opacity:1}

@media (max-width: 767px), (max-height: 500px) {
  main { height: 100dvh; }
  .detail.campus-chat { inset: calc(72px + env(safe-area-inset-top)) 0 0; width: auto; height: auto; border: 0; border-radius: 0; }
  .chat-toolbar { top: 8px; right: 8px; }
  .chat-modal-open .time-switch { visibility: hidden; }
  body.chat-modal-open { overflow: hidden; }
  .chat-modal-open .world, .chat-modal-open .walk-stops { pointer-events: none; }
  .detail.campus-chat { overscroll-behavior: contain; }
  .chat-toolbar button { width: 44px; height: 44px; }
  .chat-layout { min-height: 0; }
  .chat-profile { padding: 16px 56px 12px 16px; max-height: 40%; overflow-y: auto; }
  /* One swipeable row of quick questions that runs to the panel edges. */
  .chat-quick { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -16px 8px; padding: 0 16px; }
  .chat-quick button { min-height: 44px; }
  .chat-person { gap: 12px; }
  .chat-avatar { width: 56px; height: 64px; border-radius: var(--radius-card); }
  .detail.campus-chat h2 { font-size: var(--text-title); }
  .chat-conversation { padding: 0 16px max(12px, env(safe-area-inset-bottom)); }
  .chat-thread { margin-right: -16px; padding-right: 16px; scrollbar-width: thin; scrollbar-color: var(--chat-line) transparent; }
  .chat-messages { gap: 24px; padding-right: 8px; }
  /* The header already names the advisor; keep the name for screen readers only. */
  .chat-message-author { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .chat-started .chat-profile { padding: 14px 56px 12px 16px; }
  .chat-composer { gap: 8px; padding: 8px 8px 8px 16px; }
  .chat-composer textarea { height: calc(1.7em + 16px); padding: 8px 0; font-size: 16px; }
  .chat-composer button { width: 44px; height: 44px; }
  .walk-stops { top: 16px; right: 8px; gap: 0; max-height: calc(100% - 32px); overflow-y: auto; }

  .walk-stop { min-width: 44px; min-height: 44px; }
}

.campus-purpose-panel{position:absolute;z-index:8;left:24px;bottom:20px;width:min(520px,calc(100% - 120px));padding:0;background:none;color:#fff;text-shadow:0 1px 3px rgb(0 0 0 / .35)}
.campus-purpose-panel h2{margin:0 0 0 4px;font:600 13px/1.5 var(--font-sans)}
.campus-purpose-hint{margin:0 0 6px 4px;font-size:11px;line-height:1.5;opacity:.75}
.campus-purposes{display:flex;flex-wrap:wrap;gap:6px}
.campus-purpose{flex-shrink:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:1px;min-height:44px;padding:5px 12px;border:0;border-radius:var(--radius-xl);background:rgb(255 255 255 / .1);-webkit-backdrop-filter:blur(10px) brightness(.82);backdrop-filter:blur(10px) brightness(.82);color:#fff;font-size:13px;line-height:1.3;transition:background .2s}
.campus-purpose-text{font-weight:600}
.campus-purpose-building{font-size:11px;opacity:.7}
.campus-purpose:hover{background:rgb(255 255 255 / .2)}
.campus-purpose:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.on-walk .campus-purpose-panel,.in-transit .campus-purpose-panel{visibility:hidden}
@media(max-width:767px){.campus-purpose-panel{left:16px;right:16px;bottom:calc(12px + env(safe-area-inset-bottom));width:auto;max-width:none}.campus-purpose-panel h2{font-size:12px}.campus-purpose-hint{font-size:11px}}
/* 오른쪽 경유지 내비도 상단바 버튼처럼 흰 반투명 바탕에 흰 글자로 둔다(시간대와 관계없이). */
.walk-stops,.campus-night .walk-stops{border-radius:var(--radius-xl);background:rgb(255 255 255 / .1);-webkit-backdrop-filter:blur(10px) brightness(.82);backdrop-filter:blur(10px) brightness(.82);color:#fff;box-shadow:none}
.walk-stops .walk-stop>span{color:#fff}
.walk-stops .walk-stop i{border-color:#fff}
.walk-stops .walk-stop.active i{background:#fff;border-color:#fff}
.walk-stops .walk-stop:is(:hover,:focus-visible),.campus-night .walk-stops .walk-stop:is(:hover,:focus-visible){background:rgb(255 255 255 / .2);border-radius:var(--radius-lg)}
.walk-stops .walk-stop>.stop-name,.campus-night .walk-stops .walk-stop>.stop-name{background:rgb(0 0 0 / .45);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;border-radius:var(--radius-md)}
.walk-stops .walk-stop:focus-visible{outline:2px solid #fff;outline-offset:2px}

.on-walk .header{visibility:hidden}
.on-walk .header-actions{visibility:visible}

/* 계정 메뉴: 시간대 버튼과 같은 줄·같은 높이에 둔다 */
.header-actions{position:fixed;z-index:31;top:20px;right:72px;display:flex;gap:8px;pointer-events:auto}
.header-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:44px;height:44px;padding:0 16px;border-radius:var(--radius-xl);background:var(--glass);color:var(--glass-ink);font:600 15px/1 var(--font-sans);text-decoration:none;transition:background .2s}
.header-link:hover{background:var(--glass-solid)}
.header-link:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.header-link--primary{background:var(--primary);color:var(--glass-solid)}
.header-link--primary:hover{background:var(--primary-strong)}
.campus-night .header-link{background:var(--night-surface-glass);color:var(--night-ink);box-shadow:0 3px 12px var(--night-shadow)}
.campus-night .header-link:hover{background:var(--night-hover-strong)}
.campus-night .header-link--primary{background:var(--night-ink);color:var(--night-surface)}
.campus-night .header-link--primary:hover{background:var(--glass-solid)}
@media(max-width:767px){
  .header-actions{right:72px}
  .header-link{padding:0;width:44px}
  .header-link span{display:none}
}

/* 공통 상단바. 3D 장면 위에 투명하게 올리고, 위쪽 그라데이션으로 글자를 받친다. 배경은 검정 반투명, 텍스트는 시간대와 관계없이 흰색으로 유지한다. */
.campus-nav{--nav-surface:var(--surface);--nav-surface-subtle:var(--surface-subtle);--nav-hairline:var(--hairline);--nav-border-strong:var(--border-strong);--nav-ink:var(--ink);--nav-ink-muted:var(--ink-muted);--nav-accent:var(--green);--nav-accent-tint:var(--primary-tint);--nav-shadow:#183c291f;--bar-ink:#fff;--bar-accent:#fff;--bar-fade:0 0 0;--pg-font:var(--font-sans)}
.campus-night .campus-nav{--nav-surface:var(--night-surface);--nav-surface-subtle:var(--night-surface-subtle);--nav-hairline:var(--night-hairline);--nav-border-strong:var(--muted);--nav-ink:var(--night-ink);--nav-ink-muted:var(--muted);--nav-accent-tint:var(--night-hover);--nav-shadow:var(--night-shadow)}
.header.campus-nav,:is(.campus-evening,.campus-night) .header.campus-nav{margin:0;height:72px;padding:0 20px 0 32px;gap:32px;pointer-events:none;color:var(--bar-ink);font-family:var(--pg-font);word-break:keep-all}
.header.campus-nav::before{content:"";position:absolute;z-index:-1;left:0;right:0;top:calc(-1 * env(safe-area-inset-top));height:calc(var(--bar-fade-height,120px) + env(safe-area-inset-top));background:linear-gradient(to bottom,rgb(var(--bar-fade) / .18) 0,rgb(var(--bar-fade) / .06) 50%,rgb(var(--bar-fade) / 0) 100%);pointer-events:none}
.campus-nav .time-switch{pointer-events:auto}
.campus-nav .brand{gap:10px;font-size:20px;letter-spacing:-.02em}
.campus-nav .brand>span{transform:none;gap:2px}
.campus-nav .brand small{margin:0;font-size:12px;line-height:1.4;letter-spacing:0;font-weight:600}
.campus-nav .crest{width:44px;height:44px}
.campus-nav :is(.group-switch__toggle,.header-link):focus-visible{outline:2px solid currentColor;outline-offset:2px}
.group-option input:focus-visible+span{outline:2px solid var(--nav-accent);outline-offset:2px}
.campus-nav .header-actions{position:static;margin-left:auto;margin-right:56px;align-items:center}
/* Keep the header links clear of the time button, which widens in 실시간 mode. */
@media(min-width:768px){.campus-nav:has(.time-toggle[data-mode="auto"]) .header-actions{margin-right:calc(var(--time-switch-auto-w,88px) + 12px)}}
.campus-nav .header-link{height:40px;border-radius:var(--radius-xl);font:600 15px/1 var(--pg-font)}
.time-switch{top:14px;border-radius:var(--radius-xl)}
.group-switch{position:relative}
.group-switch__toggle{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px;border:1px solid transparent;border-radius:var(--radius-xl);background:var(--glass);color:var(--glass-ink);font:600 15px/1 var(--pg-font);white-space:nowrap;transition:background .2s}
.group-switch__toggle:hover{background:var(--glass-solid)}
.group-switch__toggle[aria-expanded="true"]{border-color:currentColor}
.campus-night .group-switch__toggle{background:var(--night-surface-glass);color:var(--night-ink);box-shadow:0 3px 12px var(--night-shadow)}
.campus-night .group-switch__toggle:hover{background:var(--night-hover-strong)}
.header.campus-nav :is(.header-link,.group-switch__toggle,.time-switch){background:rgb(255 255 255 / .1);color:var(--bar-ink);box-shadow:none}
.header.campus-nav :is(.header-link,.group-switch__toggle):hover{background:rgb(255 255 255 / .2)}
/* The time button keeps its white icon in the bar, so its hover follows the bar instead of the light glass. */
.header.campus-nav .time-toggle:is(:hover,:focus-visible){background:rgb(255 255 255 / .1)}
.group-switch__toggle i{font-size:12px;transition:transform .15s ease-out}
.group-switch__toggle[aria-expanded="true"] i{transform:rotate(180deg)}
.group-panel{position:absolute;z-index:40;top:calc(100% + 8px);right:0;width:min(400px,calc(100vw - 32px));padding:var(--space-4);border:1px solid var(--nav-hairline);border-radius:var(--radius-xl);background:var(--nav-surface);box-shadow:0 5px 30px var(--nav-shadow);color:var(--nav-ink);text-align:left}
.group-panel__title{margin:0 8px;font:600 15px/1.35 var(--pg-font)}
.group-panel__desc{margin:4px 8px 12px;font:400 14px/1.43 var(--pg-font);color:var(--nav-ink-muted)}
.group-options{display:flex;flex-direction:column;gap:4px;margin:0;padding:0;border:0}
.group-options__legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.group-option{display:block;cursor:pointer}
.group-option input{position:absolute;opacity:0;pointer-events:none}
.group-option>span{display:flex;flex-direction:column;gap:2px;padding:var(--space-3) var(--space-3) var(--space-3) 42px;border-radius:var(--radius-lg);position:relative}
.group-option>span::before{content:"";position:absolute;left:14px;top:15px;width:18px;height:18px;box-sizing:border-box;border:2px solid var(--nav-border-strong);border-radius:var(--radius-full);background:var(--nav-surface)}
.group-option:hover>span{background:var(--nav-surface-subtle)}
.group-option input:checked+span{background:var(--nav-accent-tint)}
.group-option input:checked+span::before{border:5px solid var(--nav-accent)}
.group-option strong{font:600 15px/1.35 var(--pg-font)}
.group-option small{font:400 14px/1.43 var(--pg-font);color:var(--nav-ink-muted)}
.group-panel__note{margin:0;padding:12px 8px 0;font:400 14px/1.43 var(--pg-font);color:var(--nav-ink-muted)}
.group-panel__note:first-of-type{margin-top:8px;border-top:1px solid var(--nav-hairline)}
.group-panel__note+.group-panel__note{padding-top:4px}
@media(max-width:1000px) and (min-width:768px){.header.campus-nav{padding-left:24px;gap:20px}}
@media(max-width:767px){
  .header.campus-nav,:is(.campus-evening,.campus-night) .header.campus-nav{flex-wrap:wrap;height:auto;row-gap:0;padding:8px 16px 0 max(16px,env(safe-area-inset-left));top:env(safe-area-inset-top)}
  .header.campus-nav{--bar-fade-height:150px}
  .detail.campus-chat{top:calc(96px + env(safe-area-inset-top))}
  .campus-nav .crest{width:40px;height:40px}
  .campus-nav .brand{font-size:17px}
  .campus-nav .brand{flex:1 0 100%}
  .campus-nav .header-actions{order:3;margin:0 0 0 auto;gap:4px}
  .group-switch__toggle{padding:0 10px}
  .group-switch__suffix{display:none}
  /* 모바일에서는 토글이 화면 오른쪽 끝에 있지 않으므로 패널을 상단바(화면 폭) 기준으로 펼친다. */
  .group-switch{position:static}
  .group-panel{top:calc(100% + 8px);left:16px;right:16px;width:auto;max-height:calc(100dvh - 132px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain}
  .time-switch{top:calc(10px + env(safe-area-inset-top))}
}
@media(max-width:400px){
  .header.campus-nav,:is(.campus-evening,.campus-night) .header.campus-nav{column-gap:10px}
}
@media(max-width:360px){
  .header.campus-nav,:is(.campus-evening,.campus-night) .header.campus-nav{column-gap:4px}
}
/* 둘러보기 중에는 상단바를 숨기지만 시간대 버튼은 계속 보인다. */
.on-walk .header .time-switch{visibility:visible}
@media (max-width: 767px), (max-height: 500px) {
  .chat-modal-open .header .time-switch { visibility: hidden; }
}

/* 대화 답변을 캠퍼스 문서로 가져오기. */
.chat-document-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.chat-document-actions button{min-height:var(--control-h-sm);padding:var(--space-1) var(--space-3);border:1px solid var(--border-strong);border-radius:var(--radius-control);background:var(--surface);color:var(--ink);transition:background-color .15s ease-out}.chat-document-actions button:hover{background:var(--surface-subtle)}.chat-document-actions button:disabled{cursor:wait}.chat-document-actions button:focus-visible{outline:2px solid currentColor;outline-offset:2px}:is(.campus-night,.campus-evening) .chat-document-actions button{background:var(--night-surface);color:var(--night-ink);border-color:var(--night-accent)}:is(.campus-night,.campus-evening) .chat-document-actions button:hover{background:var(--night-surface-subtle)}

/* 답변 근거: API 응답에 정보가 있을 때만 표시한다. */
.detail.campus-chat{font-family:var(--font-sans)}
.campus-chat .chat-composer textarea{font-family:inherit}
.chat-scope{display:flex;flex-shrink:0;align-items:center;gap:8px;min-width:0;margin-bottom:12px;padding:var(--space-2) var(--space-3);border-radius:var(--radius-xl);background:var(--chat-soft);color:var(--chat-muted)}
.chat-scope>span{min-width:0;overflow-wrap:anywhere}
.chat-message{min-width:0;overflow-wrap:anywhere}
.chat-evidence,.chat-staff-note,.chat-message .chat-no-evidence{margin-top:16px}
.chat-message .chat-evidence-title{margin-bottom:8px;color:var(--chat-muted)}
.chat-source-chips{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.chat-source-chip{display:inline-flex;flex-wrap:wrap;gap:2px 8px;max-width:100%;min-width:0;padding:var(--space-1) var(--space-3);border:1px solid transparent;border-radius:var(--radius-lg);background:var(--chat-chip);color:var(--chat-ink);overflow-wrap:anywhere}
.chat-source-chip>span{min-width:0;max-width:100%;overflow-wrap:anywhere}
.chat-source-location,.chat-source-excluded{color:var(--chat-muted)}
.chat-source-excluded{background:var(--chat-soft)}
.chat-staff-note{padding:var(--space-3) var(--space-4);border-radius:var(--radius-xl);background:var(--chat-soft)}
.chat-staff-note>strong{display:block;margin-bottom:4px;font-weight:700}
.chat-message .chat-no-evidence{display:flex;align-items:baseline;gap:8px;color:var(--chat-muted)}
.chat-group-change{align-self:stretch;border-top:1px solid var(--chat-line);padding-top:12px;color:var(--chat-muted);text-align:center;word-break:keep-all;overflow-wrap:anywhere}

.header-link[hidden]{display:none}
/* 다른 부처 담당자로 이어서 묻기 · 근거 문서 내려받기 · 상담 내용 메일 받기 */
.chat-handoff{display:inline-flex;align-items:center;gap:8px;margin-top:12px;min-height:var(--control-h-sm);padding:var(--space-1) var(--space-3);border:1px solid var(--border-strong);border-radius:var(--radius-control);background:var(--surface);color:var(--ink);transition:background-color .15s ease-out}.chat-handoff:not(:disabled):hover{background:var(--surface-subtle)}.chat-handoff:disabled{opacity:.5;cursor:default}.chat-handoff:focus-visible{outline:2px solid currentColor;outline-offset:2px}
:is(.campus-night,.campus-evening) .chat-handoff{background:var(--night-surface);color:var(--night-ink);border-color:var(--night-accent)}:is(.campus-night,.campus-evening) .chat-handoff:not(:disabled):hover{background:var(--night-surface-subtle)}
a.chat-source-download{align-items:center;text-decoration:none;transition:border-color .15s}a.chat-source-download>i{font-size:12px;color:var(--chat-muted)}a.chat-source-download:hover{border-color:var(--chat-strong)}a.chat-source-download:hover>span:not(.chat-source-location){text-decoration:underline}a.chat-source-download:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
/* 교직원 계정 고르기: 그룹 목록의 교직원 바로 아래. 고르면 그 부서 담당자로 로그인한다. */
.group-staff{display:flex;flex-direction:column;gap:4px;margin:2px 0 0;padding:0 var(--space-3) var(--space-2) 42px}
.group-staff>span{font:400 13px/1.4 var(--pg-font);color:var(--nav-ink-muted)}
.group-staff select{width:100%;min-height:36px;padding:6px 10px;border:1px solid var(--nav-border-strong);border-radius:var(--radius-lg);background:var(--nav-surface);font:400 14px/1.4 var(--pg-font);color:inherit}
.group-staff select:focus-visible{outline:2px solid var(--nav-accent);outline-offset:2px}

/* 이스터에그: 고양이를 누르면 뜨는 말풍선(CampusCat.js). */
.cat-bubble{position:fixed;z-index:40;margin:0;padding:2px 8px;transform:translate(-50%,-100%);border-radius:var(--radius-panel);background:var(--surface);color:var(--ink);box-shadow:var(--shadow-md);font:600 12px/1.5 var(--font-sans);white-space:nowrap;pointer-events:none}
.cat-bubble::after{content:'';position:absolute;left:50%;bottom:-3px;width:6px;height:6px;background:inherit;transform:translateX(-50%) rotate(45deg)}
.cat-bubble.is-showing{animation:cat-bubble 2.2s ease-out forwards}
:is(.campus-evening,.campus-night) .cat-bubble{background:var(--night-surface);color:var(--night-ink)}
@keyframes cat-bubble{0%{opacity:0;translate:0 6px}10%,75%{opacity:1;translate:0 0}100%{opacity:0;translate:0 -8px}}
@media(prefers-reduced-motion:reduce){.cat-bubble.is-showing{animation:none}}
/* 대화 패널 헤더 도구: 그룹 선택 · 새 대화 · 닫기 */
.chat-toolbar{display:flex;align-items:center;gap:4px}
@media (min-width:768px) and (min-height:501px){.chat-toolbar{top:20px}}
.chat-toolbar .chat-tool-text{display:inline-flex;align-items:center;gap:6px;width:auto;height:36px;padding:0 var(--space-3);border-radius:var(--radius-control);color:var(--chat-muted);white-space:nowrap}
.chat-toolbar button:hover{color:var(--chat-ink)}
.chat-toolbar button:disabled{opacity:.45;cursor:default}.chat-toolbar button:disabled:hover{background:none;color:var(--chat-muted)}
.chat-toolbar button:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}
/* 새 대화: 닫기(X)와 다른 행동 버튼. 옅은 초록 바탕·초록 글자, 닫기와는 8px 띄운다(툴바 gap 4px + 4px). */
.chat-toolbar .chat-tool-text{padding:0 14px 0 12px;border-radius:var(--radius-full);background:var(--primary-tint);color:var(--primary)}
.chat-toolbar .chat-tool-text:hover{background:var(--primary-tint);color:var(--primary-strong);box-shadow:inset 0 0 0 1px var(--border-hover)}
.chat-toolbar .chat-tool-text:focus-visible{outline-offset:2px}
.chat-toolbar #chat-new+#close-detail{margin-left:4px}
:is(.campus-evening,.campus-night) .chat-toolbar .chat-tool-text{background:var(--night-surface-subtle);color:var(--night-accent)}
:is(.campus-evening,.campus-night) .chat-toolbar .chat-tool-text:hover{color:var(--night-accent-strong);box-shadow:inset 0 0 0 1px var(--night-border)}
.detail .chat-toolbar .chat-tool-text:disabled,.detail .chat-toolbar .chat-tool-text:disabled:hover{opacity:.6;background:none;color:var(--chat-muted);box-shadow:inset 0 0 0 1px var(--chat-line)}
.chat-identity{flex:1}
.chat-identity>.chat-affiliation,.detail.campus-chat .chat-identity>h2{padding-right:var(--chat-tools-space,0px)}
/* 헤더: 이름 아래에 소속 · 담당 업무를 흐리게 쓴다. */
.chat-affiliation{margin:2px 0 0;color:var(--chat-muted);word-break:keep-all}

/* 답변 본문: 문단과 목록 간격 · 중첩 목록 · 구분선. 답변은 패널 내용 폭 전체를 쓴다 */
.chat-message .chat-reply>p+:is(ul,ol){margin-top:6px}
.chat-message .chat-reply>*+.chat-reply-heading{margin-top:20px}
.chat-reply li>:is(ul,ol){margin:6px 0 2px;padding-left:1.25em}
.chat-reply ul ul{list-style-type:circle}
.chat-reply li>ul li+li,.chat-reply li>ol li+li{margin-top:4px}
.chat-message .chat-reply>.chat-reply-rule{height:0;margin:20px 0;border:0;border-top:1px solid var(--chat-line)}

/* 답변 대기: 단계 문구와 지난 초 */

/* 답변 복사 */
.chat-copy{display:inline-flex;align-items:center;gap:6px;min-height:32px;margin-left:calc(var(--space-2) * -1);padding:0 var(--space-2);border-radius:var(--radius-control);color:var(--chat-muted);font:600 13px/1.35 var(--font-sans);transition:background-color .15s,color .15s}
.chat-copy:hover{background:var(--chat-soft);color:var(--chat-ink)}.chat-copy:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.chat-copy.is-done{color:var(--primary)}:is(.campus-night,.campus-evening) .chat-copy.is-done{color:var(--night-accent)}
.chat-copy-status{color:var(--danger)}.chat-copy-status:empty{display:none}:is(.campus-night,.campus-evening) .chat-copy-status{color:var(--night-danger)}

/* 근거 문서 쪽수: 파일명과 세로선으로 나눈다 */
.chat-source-chip>.chat-source-location{position:relative;padding-left:9px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.chat-source-chip>.chat-source-location::before{content:"";position:absolute;left:0;top:.3em;bottom:.3em;border-left:1px solid currentColor;opacity:.4}


/* 맵의 교수 캐릭터와 과목 AI 조교 대화 */

/* 첫 인사 아래 메일 전달 안내 */

/* 답변 속 표: 패널 폭을 넘으면 표만 가로로 스크롤한다 */
.chat-message .chat-reply>.chat-reply-table{max-width:100%;overflow-x:auto;border:1px solid var(--chat-line);border-radius:var(--radius-card)}
.chat-reply-table table{width:100%;border-collapse:collapse}
.chat-reply-table :is(th,td){padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--chat-line);text-align:left;vertical-align:top;word-break:keep-all;overflow-wrap:break-word}
.chat-reply-table th{background:var(--chat-soft);font-weight:700;white-space:nowrap}
.chat-reply-table tbody tr:last-child td{border-bottom:0}

/* ── pulse 채팅 방식: 중립 회색 면, 녹색은 보내기·포인트에만 ── */
.detail.campus-chat{--chat-ink:#222623;--chat-muted:#6b706c;--chat-line:rgb(30 34 31 / 12%);--chat-soft:rgb(30 34 31 / 5%);--chat-chip:rgb(30 34 31 / 6%);--chat-strong:rgb(30 34 31 / 24%);--chat-panel:var(--surface);--chat-field:rgb(255 255 255 / 60%);background:var(--chat-panel)}
.detail.campus-chat .chat-thread{border-top-color:var(--chat-line)}

/* 헤더: 근거 범위는 제목 아래 작은 보조 문구 */
.detail.campus-chat .chat-identity>.chat-scope{display:block;margin:2px 0 0;padding:0 var(--chat-tools-space,0px) 0 0;border-radius:0;background:none;color:var(--chat-muted)}

/* 메시지: 본문 16px/26px, 문단 아래 8px, 제목 16px 600, 목록 왼쪽 20px */
.detail.campus-chat .chat-message-user>p:not(.chat-failed){padding:12px 16px;border-radius:16px;background:var(--chat-soft)}
.detail.campus-chat .chat-message-author{gap:6px;margin-bottom:6px;color:var(--chat-ink)}
.detail.campus-chat .chat-message-author img{width:20px;height:20px;background:var(--chat-soft)}
.chat-elapsed{margin-left:4px;color:var(--chat-muted);font-variant-numeric:tabular-nums}
.detail.campus-chat .chat-reply>*{margin:0 0 8px}
.detail.campus-chat .chat-reply>*:last-child{margin-bottom:0}
.detail.campus-chat .chat-reply>.chat-reply-heading{margin:16px 0 6px}
.detail.campus-chat .chat-reply>.chat-reply-heading:first-child{margin-top:0}
.detail.campus-chat .chat-reply :is(ul,ol){padding-left:20px}
.detail.campus-chat .chat-reply li+li{margin-top:2px}
.detail.campus-chat .chat-reply li>:is(ul,ol){margin:2px 0 0}
.detail.campus-chat .chat-reply>.chat-reply-rule{margin:16px 0}

/* 대기: 한 문구 + 은은한 빛 흐름 */
.detail.campus-chat .chat-typing{color:var(--chat-muted)}
.chat-message-pending .chat-typing-text{background:linear-gradient(90deg,var(--chat-muted) 35%,var(--chat-ink) 50%,var(--chat-muted) 65%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:chat-shimmer 2.4s linear infinite}
@keyframes chat-shimmer{from{background-position:100% 0}to{background-position:-150% 0}}
@media(prefers-reduced-motion:reduce){.chat-message-pending .chat-typing-text{animation:none;background:none;color:var(--chat-muted)}}

/* 답변 하단 한 줄: 왼쪽 근거 칩, 오른쪽 끝 복사 */
.chat-reply-footer{display:flex;align-items:flex-start;gap:8px;margin-top:12px}
.chat-reply-sources{flex:1;min-width:0}
.chat-reply-sources .chat-evidence{margin:0}
.chat-reply-sources .chat-source-chips{gap:6px}
.detail.campus-chat .chat-source-chip{padding:2px 8px;border-radius:var(--radius-lg);background:var(--chat-chip);color:var(--chat-ink)}
.detail.campus-chat .chat-source-chip>.chat-source-location{color:var(--chat-muted)}
.detail.campus-chat a.chat-source-download{gap:2px 8px;padding:5px 12px 5px 10px}.detail.campus-chat a.chat-source-download>i{font-size:15px;color:var(--chat-ink)}
.detail.campus-chat :is(.chat-staff-note,.chat-no-evidence){margin-top:12px}
.chat-copy-wrap{display:flex;flex-shrink:0;align-items:center;gap:6px;margin-left:auto}
.detail.campus-chat .chat-copy{display:grid;place-items:center;width:36px;min-height:36px;height:36px;margin:0;padding:0;border-radius:var(--radius-control);color:var(--chat-muted);font-size:17px}
.detail.campus-chat .chat-copy.is-done{color:var(--primary)}
.chat-copy-status{color:var(--chat-muted)}.chat-copy-status.is-error{color:var(--danger)}
:is(.campus-night,.campus-evening) .detail.campus-chat .chat-copy.is-done{color:var(--night-accent)}
.detail.campus-chat :is(.chat-document-actions button,.chat-handoff){border-color:var(--chat-strong)}

/* 오류: 실패한 질문 바로 아래 */
.detail.campus-chat .chat-failed{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:4px 6px;margin:8px 0 0;padding:0;border-radius:0;background:none;color:var(--danger)}
.detail.campus-chat .chat-failed-general{align-self:stretch;justify-content:center}
.chat-failed-detail{color:var(--chat-muted)}
.chat-failed-retry{margin-left:2px;padding:2px 6px;border-radius:var(--radius-control);color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.chat-failed-retry:hover{background:var(--chat-soft)}.chat-failed-retry:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
:is(.campus-night,.campus-evening) .detail.campus-chat .chat-failed{color:var(--night-danger)}

/* 추천 질문: 첫 화면 인사말 아래 세로 목록 */
.chat-starters{display:flex;flex-direction:column;gap:6px;width:100%;max-width:560px}
.chat-starter{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:10px 14px;border:1px solid var(--chat-line);border-radius:12px;background:#fff;color:var(--chat-ink);text-align:left;transition:background .15s,border-color .15s}
.chat-starter>i{flex-shrink:0;color:var(--chat-muted);font-size:12px;transition:color .15s,transform .15s}
.chat-starter:enabled:hover{border-color:var(--chat-strong);background:var(--chat-soft)}.chat-starter:enabled:hover>i{color:var(--primary);transform:translateX(2px)}
.chat-starter:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.chat-starter:disabled{opacity:.45;cursor:default;box-shadow:none}
:is(.campus-night,.campus-evening) .chat-starter{background:var(--night-surface)}

/* 새 답변 버튼: 대화 영역 아래 가운데 */
.chat-thread-wrap{position:relative;display:flex;flex:1;flex-direction:column;min-height:0}
.chat-latest{position:absolute;z-index:1;bottom:12px;left:50%;display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 14px;border:1px solid var(--chat-line);border-radius:var(--radius-full);background:#fff;color:var(--chat-ink);white-space:nowrap;box-shadow:0 2px 8px rgb(30 34 31 / 12%);transform:translateX(-50%)}
.chat-latest>i{font-size:11px}.chat-latest:hover{background:#f7f7f6}.chat-latest:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
:is(.campus-night,.campus-evening) .chat-latest{background:var(--night-surface)}

/* 입력창: 흰 바탕, 얇은 선, 16px 모서리, 포커스는 옅은 3px 링. 보내기는 늘 같은 진한 원 */
.detail.campus-chat .chat-composer{padding:8px 8px 8px 16px;border:1px solid var(--chat-line);border-radius:16px;background:#fff}
.detail.campus-chat .chat-composer:hover{border-color:var(--chat-strong)}
.detail.campus-chat .chat-composer:focus-within{outline:0;border-color:var(--chat-strong);box-shadow:0 0 0 3px rgb(30 34 31 / 10%)}
.detail.campus-chat .chat-composer button,.detail.campus-chat .chat-composer button:disabled{width:36px;height:36px;border:0;background:var(--primary);color:var(--on-inverse);font-size:14px}
.detail.campus-chat .chat-composer button:disabled{opacity:.35;cursor:not-allowed}
:is(.campus-evening,.campus-night) .detail.campus-chat .chat-composer{background:var(--night-surface)}
:is(.campus-evening,.campus-night) .detail.campus-chat .chat-composer:focus-within{box-shadow:0 0 0 3px rgb(214 227 213 / 18%)}
:is(.campus-evening,.campus-night) .detail.campus-chat .chat-composer button,:is(.campus-evening,.campus-night) .detail.campus-chat .chat-composer button:disabled{background:var(--night-accent-strong);color:var(--night-surface)}

/* 면 통일: 패널은 가장 연한 미색, 버튼·입력창은 패널 위에 살짝 밝은 면 + 같은 얇은 선. 밤·저녁도 같은 규칙 */
:is(.campus-evening,.campus-night) .detail.campus-chat{--chat-panel:var(--night-surface);--chat-field:rgb(255 255 255 / 4%);background:var(--chat-panel)}
.detail.campus-chat :is(.chat-starter,.chat-composer,.chat-document-actions button,.chat-handoff){border-color:var(--chat-line);background:var(--chat-field);color:var(--chat-ink)}
.detail.campus-chat :is(.chat-starter:enabled:hover,.chat-document-actions button:hover,.chat-handoff:not(:disabled):hover,.chat-composer:hover){border-color:var(--chat-strong);background:var(--chat-soft)}
.detail.campus-chat .chat-composer:focus-within{background:var(--chat-field)}
.detail.campus-chat .chat-latest{border-color:var(--chat-line);background:var(--chat-panel);color:var(--chat-ink)}
.detail.campus-chat .chat-latest:hover{background:color-mix(in srgb,var(--chat-ink) 5%,var(--chat-panel))}
:is(.campus-evening,.campus-night) .detail.campus-chat .chat-latest{box-shadow:0 2px 8px var(--night-shadow)}

/* 패널 글자 위계: 패널 폭이 최대 760px로 고정이라 화면 폭 비례 토큰 대신 고정 px 4단계만 쓴다.
   제목 20/28 · 본문 16/26 · 보조 14/20 · 작은 글 13/20. 굵기는 400(본문)·600(버튼·라벨·작성자·소제목)·700(이름·strong·th)만 쓴다.
   이름(h2)은 모바일 규칙이 덮을 수 있도록 앞쪽 .detail.campus-chat h2에 둔다. 아이콘 글리프 크기는 여기서 다루지 않는다. */
.detail.campus-chat{--chat-text-title:20px;--chat-leading-title:28px;--chat-text-body:16px;--chat-leading-body:26px;--chat-text-sm:14px;--chat-leading-sm:20px;--chat-text-xs:13px;--chat-leading-xs:20px}
.detail.campus-chat :is(.chat-welcome>p,.chat-message,.chat-reply,.chat-reply-table,.chat-typing,.chat-composer textarea,.chat-starter){font-size:var(--chat-text-body);line-height:var(--chat-leading-body);font-weight:400}
.detail.campus-chat .chat-reply>.chat-reply-heading{font-size:var(--chat-text-body);line-height:var(--chat-leading-body);font-weight:600}
.detail.campus-chat :is(.chat-affiliation,.chat-eyebrow,.chat-staff-note,.chat-no-evidence,.chat-status,.chat-status button,.chat-quick button,.chat-toolbar .chat-tool-text,.chat-handoff,.chat-document-actions button){font-size:var(--chat-text-sm);line-height:var(--chat-leading-sm);font-weight:400}
.detail.campus-chat :is(.chat-message-author,.chat-elapsed,.chat-evidence-title,.chat-source-chip,.chat-scope,.chat-copy-status,.chat-failed,.chat-group-change,.chat-latest){font-size:var(--chat-text-xs);line-height:var(--chat-leading-xs);font-weight:400}
.detail.campus-chat :is(.chat-eyebrow,.chat-status button,.chat-quick button,.chat-toolbar .chat-tool-text,.chat-handoff,.chat-document-actions button,.chat-message-author,.chat-evidence-title,.chat-latest){font-weight:600}

/* 로그인 화면(campus/login.html). 업무 화면(shell.css)의 무채색 토큰을 그대로 쓰고, 녹색(--primary)은 로그인 버튼에만 둔다.
   캠퍼스 맵의 저녁·밤 테마를 따르지 않고 늘 밝게 둔다. 다른 화면에 닿지 않도록 .campus-login-page 아래로만 건다. */
.campus-login-page.campus-documents,:is(.campus-night,.campus-evening) .campus-login-page.campus-documents{--nt-ink:#232624;--nt-muted:#646a67;--nt-subtle:#f4f4f3;--nt-hover:#eeeeed;--nt-line:rgb(32 36 34 / 12%);--nt-strong:rgb(32 36 34 / 45%);
  --ink:var(--nt-ink);--ink-muted:var(--nt-muted);--doc-ink:var(--nt-ink);--doc-muted:var(--nt-muted);--doc-paper:#fff;--doc-bg:var(--nt-subtle);--doc-line:var(--nt-line);--doc-strong:var(--nt-strong);
  --doc-accent:var(--primary);--doc-accent-hover:var(--primary-strong);--doc-on-accent:#fff;--focus-ring:var(--primary);color:var(--nt-ink);background:var(--nt-subtle)}
.campus-login-page .header.campus-nav{--bar-ink:var(--nt-ink)}
.campus-login-page .header.campus-nav::before{background:none}
.campus-login-page .header.campus-nav :is(.header-link,.group-switch__toggle){border:1px solid var(--nt-line);background:#fff;color:var(--nt-ink)}
.campus-login-page .header.campus-nav :is(.header-link,.group-switch__toggle):hover{background:var(--nt-hover)}
.campus-login-page main.campus-login{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;margin-top:72px;min-height:calc(100svh - 72px);padding:24px 20px 96px;background:var(--nt-subtle)}
.campus-login-page .login-card{width:min(100%,400px);padding:32px;gap:6px;border:1px solid var(--nt-line);border-radius:12px;background:#fff;box-shadow:0 1px 2px rgb(32 36 34 / 4%)}
.campus-login-page .login-card h1{margin:0;font:700 24px/1.35 var(--font-sans);letter-spacing:-.02em}
.campus-login-page .login-card__desc{margin:0 0 18px;font:400 14px/1.55 var(--font-sans);color:var(--nt-muted)}
.campus-login-page .login-card label{font:600 13px/1.5 var(--font-sans);color:var(--nt-ink)}
.campus-login-page .login-card input:not([type=hidden]){min-height:44px;padding:0 14px;border-color:var(--nt-strong);border-radius:8px;font-size:15px}
.campus-login-page .login-card input:not([type=hidden]):hover{border-color:var(--nt-ink)}
.campus-login-page .login-card input:not([type=hidden]):focus{outline:2px solid var(--primary);outline-offset:-1px;border-color:transparent}
.campus-login-page .login-card button{margin-top:20px;min-height:46px;border-radius:8px;font:600 15px/1.35 var(--font-sans)}
.campus-login-page .login-card button:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.login-back{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px;border-radius:8px;font:500 14px/1.4 var(--font-sans);color:var(--nt-muted)}
.login-back:hover{background:var(--nt-hover);color:var(--nt-ink)}
.login-back:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.login-back i{font-size:12px}