/* ===== PHILOSOPHY AI / AI DREAM MENTOR — Design System v2 ===== */
:root{
  /* Base surfaces — deeper, richer near-black navy for premium feel */
  --navy:#0B1020; --navy2:#141d38; --obsidian:#070a14;
  --surface-1:rgba(255,255,255,0.035); --surface-2:rgba(255,255,255,0.06); --surface-3:rgba(255,255,255,0.09);
  /* Text */
  --silver:#CBD2E0; --silver-dim:#828da6; --ivory:#F5F2EA;
  /* Accents */
  --gold:#D8B673; --gold-soft:#EBD6A3; --gold-deep:#b5934f;
  --cyan:#63E3E3; --cyan-dim:#2a8f9a;
  --walnut:#5C4632;
  --accent:#63E3E3;
  --danger:#e8888c;
  /* Glass */
  --glass:rgba(255,255,255,0.045); --glass-brd:rgba(255,255,255,0.09);
  --glass-brd-strong:rgba(255,255,255,0.16);
  /* Radii — 8px grid */
  --radius:18px; --radius-sm:12px; --radius-xs:9px; --radius-pill:999px;
  /* Elevation scale */
  --sh-1:0 1px 2px rgba(0,0,0,0.3);
  --sh-2:0 4px 14px rgba(0,0,0,0.28);
  --sh-3:0 12px 34px rgba(0,0,0,0.42);
  --sh-4:0 24px 64px rgba(0,0,0,0.55);
  --shadow:var(--sh-3);
  --glow-cyan:0 0 0 1px rgba(99,227,227,0.35),0 8px 30px rgba(99,227,227,0.18);
  --glow-gold:0 0 0 1px rgba(216,182,115,0.35),0 8px 30px rgba(216,182,115,0.16);
  /* Motion */
  --ease:cubic-bezier(.22,.61,.36,1); --ease-out:cubic-bezier(.16,1,.3,1);
  /* Fonts */
  --font-serif:'Nanum Myeongjo','Gowun Batang',serif;
  --font-display:'Cormorant Garamond','Nanum Myeongjo',serif;
  --font-sans:'Noto Sans KR',system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:var(--font-sans); color:var(--silver); background:var(--obsidian);
  background-image:
    radial-gradient(1000px 640px at 78% -12%, rgba(99,227,227,0.12), transparent 58%),
    radial-gradient(820px 560px at 6% 112%, rgba(216,182,115,0.11), transparent 55%),
    radial-gradient(600px 400px at 50% 40%, rgba(70,90,160,0.05), transparent 70%),
    linear-gradient(158deg, #090d1a 0%, #0c1226 48%, #080c18 100%);
  background-attachment:fixed;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  line-height:1.62; letter-spacing:-0.003em;
  overflow-x:hidden;
}
/* subtle film-grain texture for depth */
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.025;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,textarea,select{font-family:inherit}
a{color:inherit;text-decoration:none}
::selection{background:rgba(99,227,227,0.28);color:#fff}

/* scrollbar */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:8px;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.2);background-clip:padding-box}
::-webkit-scrollbar-track{background:transparent}

/* ===== Utility ===== */
.glass{background:var(--glass);backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);
  border:1px solid var(--glass-brd);border-radius:var(--radius);
  box-shadow:var(--sh-2),inset 0 1px 0 rgba(255,255,255,0.05)}
.gold-text{color:var(--gold)}
.serif{font-family:var(--font-serif)}
.muted{color:var(--silver-dim)}
.center{display:flex;align-items:center;justify-content:center}
.hidden{display:none!important}

/* ===== Buttons ===== */
.btn{
  display:inline-flex;align-items:center;gap:8px;justify-content:center;
  padding:12px 24px;border-radius:var(--radius-sm);font-weight:600;font-size:15px;letter-spacing:-0.01em;
  background:linear-gradient(180deg,rgba(255,255,255,0.09),rgba(255,255,255,0.03));
  border:1px solid var(--glass-brd-strong);
  box-shadow:var(--sh-1),inset 0 1px 0 rgba(255,255,255,0.09);
  transition:transform .16s var(--ease),box-shadow .22s var(--ease),background .22s,border-color .22s; color:var(--ivory);
  min-height:46px;position:relative;overflow:hidden;
}
.btn:hover{transform:translateY(-1px);background:linear-gradient(180deg,rgba(255,255,255,0.14),rgba(255,255,255,0.05));box-shadow:var(--sh-2),inset 0 1px 0 rgba(255,255,255,0.12)}
.btn:active{transform:translateY(0);box-shadow:inset 0 2px 6px rgba(0,0,0,0.4)}
.btn-primary{background:linear-gradient(180deg,#EBD6A3,#c99f5c);color:#241a06;font-weight:700;border-color:rgba(255,255,255,0.3);box-shadow:var(--sh-2),0 6px 20px rgba(216,182,115,0.2),inset 0 1px 0 rgba(255,255,255,0.4)}
.btn-primary:hover{background:linear-gradient(180deg,#f4e4bd,#d8b06a);box-shadow:var(--sh-3),0 10px 28px rgba(216,182,115,0.32),inset 0 1px 0 rgba(255,255,255,0.5)}
.btn-cyan{background:linear-gradient(180deg,#3fb8c4,#1d6a73);color:#eafdff;border-color:rgba(99,227,227,0.45);box-shadow:var(--sh-2),0 6px 20px rgba(99,227,227,0.18)}
.btn-cyan:hover{background:linear-gradient(180deg,#54cdd9,#258089);box-shadow:var(--sh-3),0 10px 26px rgba(99,227,227,0.3)}
.btn-ghost{background:rgba(255,255,255,0.02);border:1px solid var(--glass-brd);box-shadow:none}
.btn-ghost:hover{background:rgba(255,255,255,0.06)}
.btn-sm{padding:8px 15px;font-size:13px;min-height:38px;border-radius:var(--radius-xs)}
.btn-block{width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}

/* ===== Form ===== */
.field{margin-bottom:15px}
.field label{display:block;font-size:13px;font-weight:500;color:var(--silver-dim);margin-bottom:7px;letter-spacing:.01em}
.input,.select,.textarea{
  width:100%;padding:13px 15px;border-radius:var(--radius-xs);font-size:15px;
  background:rgba(0,0,0,0.28);border:1px solid var(--glass-brd);color:var(--ivory);
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease),background .2s;
}
.input::placeholder,.textarea::placeholder{color:var(--silver-dim);opacity:.7}
.input:hover,.select:hover,.textarea:hover{border-color:var(--glass-brd-strong)}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--cyan);background:rgba(0,0,0,0.35);box-shadow:0 0 0 3.5px rgba(99,227,227,0.14)}
.textarea{resize:vertical;min-height:72px;line-height:1.6}

/* ===== Landing ===== */
.landing{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:56px 24px;position:relative;overflow:hidden}
#hero-canvas{position:fixed;inset:0;z-index:0;opacity:.85;pointer-events:none}
.landing-inner{position:relative;z-index:1;max-width:800px;width:100%}
.landing-inner > *{opacity:0;animation:riseIn .9s var(--ease-out) forwards}
.landing-inner > *:nth-child(1){animation-delay:.05s}
.landing-inner > *:nth-child(2){animation-delay:.16s}
.landing-inner > *:nth-child(3){animation-delay:.27s}
.landing-inner > *:nth-child(4){animation-delay:.38s}
.landing-inner > *:nth-child(5){animation-delay:.49s}
.landing-inner > *:nth-child(6){animation-delay:.6s}
.landing-inner > *:nth-child(7){animation-delay:.7s}
@keyframes riseIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
.reduce-motion .landing-inner > *{opacity:1;animation:none}
.brand-tag{letter-spacing:.5em;font-size:11.5px;color:var(--gold);font-weight:700;margin-bottom:22px;
  display:inline-block;padding:7px 18px;border-radius:var(--radius-pill);text-transform:uppercase;
  background:rgba(216,182,115,0.06);border:1px solid rgba(216,182,115,0.22);box-shadow:inset 0 1px 0 rgba(255,255,255,0.06)}
.hero-title{font-family:var(--font-display);font-size:clamp(44px,8vw,92px);font-weight:600;
  background:linear-gradient(176deg,#ffffff 0%,#fbf5e6 42%,var(--gold-soft) 72%,var(--gold));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  line-height:1.02;letter-spacing:-0.01em;margin-bottom:16px;
  text-shadow:0 2px 40px rgba(216,182,115,0.12)}
.hero-sub{font-size:clamp(16px,2.4vw,21px);color:var(--silver);margin-bottom:8px;font-weight:400;letter-spacing:-0.01em}
.hero-quote{font-family:var(--font-display);font-style:italic;color:var(--gold-soft);
  font-size:clamp(19px,3vw,27px);margin:22px auto 34px;max-width:640px;line-height:1.35;position:relative}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-bottom:42px}
.hero-actions .btn{padding:15px 32px;font-size:16px;min-height:54px}
.hero-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;text-align:left}
.hero-card{padding:20px 22px;border-radius:var(--radius-sm);transition:transform .3s var(--ease-out),border-color .3s,box-shadow .3s}
.hero-card:hover{transform:translateY(-4px);border-color:var(--glass-brd-strong);box-shadow:var(--sh-3)}
.hero-card h4{color:var(--gold);font-size:14px;margin-bottom:8px;font-weight:700;display:flex;align-items:center;gap:8px}
.hero-card p{font-size:14px;color:var(--silver);line-height:1.6}
.ai-notice{margin-top:32px;font-size:12px;color:var(--silver-dim);max-width:560px;margin-left:auto;margin-right:auto;line-height:1.6}

/* ===== App layout ===== */
.app-shell{display:grid;grid-template-columns:288px 1fr 328px;height:100vh;height:100dvh}
.sidebar{background:linear-gradient(180deg,rgba(9,13,26,0.86),rgba(6,9,20,0.9));backdrop-filter:blur(20px) saturate(140%);
  border-right:1px solid var(--glass-brd);display:flex;flex-direction:column;overflow:hidden}
.sb-head{padding:20px 18px 14px;border-bottom:1px solid var(--glass-brd);display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.sb-head .icon-btn{width:34px;height:34px;flex:none}
.sb-logo{font-family:var(--font-display);font-size:23px;color:var(--gold);font-weight:600;letter-spacing:.01em}
.sb-logo small{display:block;font-family:var(--font-sans);font-size:9.5px;letter-spacing:.36em;color:var(--silver-dim);margin-top:4px;text-transform:uppercase}
.sb-scroll{flex:1;overflow-y:auto;padding:12px}
.sb-section-title{font-size:10.5px;letter-spacing:.18em;color:var(--silver-dim);margin:16px 8px 7px;text-transform:uppercase;font-weight:600}
.sb-item{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:var(--radius-sm);font-size:14px;
  color:var(--silver);transition:background .18s var(--ease),color .18s;cursor:pointer;position:relative}
.sb-item:hover{background:var(--surface-2)}
.sb-item.active{background:rgba(99,227,227,0.1);color:var(--ivory)}
.sb-item.active::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:18px;border-radius:3px;background:var(--cyan);box-shadow:0 0 10px var(--cyan)}
.sb-item i{width:18px;text-align:center;color:var(--silver-dim);transition:color .18s}
.sb-item.active i{color:var(--cyan)}
.mentor-pick{display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:var(--radius-sm);cursor:pointer;transition:background .18s}
.mentor-pick:hover{background:var(--surface-2)}
.mentor-pick.active{background:var(--surface-3)}
.m-avatar{width:38px;height:38px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  font-size:16px;color:#fff;position:relative;box-shadow:var(--sh-1),inset 0 0 0 1px rgba(255,255,255,0.08)}
.m-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.m-meta{min-width:0}
.m-meta .nm{font-size:14px;color:var(--ivory);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-meta .fl{font-size:11px;color:var(--silver-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);flex:none}
.sb-foot{padding:12px;border-top:1px solid var(--glass-brd);font-size:12px;color:var(--silver-dim)}

/* ===== 멘토 얼굴 스테이지 + 비주얼라이저 ===== */
.sb-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:20px 16px;overflow:hidden;position:relative}
.sb-controls{padding:12px 14px 14px;border-top:1px solid var(--glass-brd);display:flex;flex-direction:column;gap:10px}
.stage-empty{text-align:center;color:var(--silver-dim)}
.stage-empty i{font-size:44px;color:var(--gold);margin-bottom:12px;display:block;opacity:.7}
.stage-empty p{font-size:13px}

.mentor-stage{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;gap:0;animation:riseIn .6s var(--ease-out)}
.reduce-motion .mentor-stage{animation:none}

/* 배경 글로우 */
.stage-glow{position:absolute;top:6%;left:50%;transform:translateX(-50%);width:230px;height:230px;border-radius:50%;
  background:radial-gradient(circle,var(--m-color,var(--cyan)),transparent 66%);opacity:.22;filter:blur(34px);pointer-events:none;
  transition:opacity .5s var(--ease),transform .5s var(--ease)}

/* 얼굴 링(파동) */
.stage-ring{position:absolute;top:6%;left:50%;width:180px;height:180px;margin-left:-90px;border-radius:50%;
  border:1.5px solid rgba(99,227,227,0.3);opacity:0;pointer-events:none}
.stage-face{position:relative;width:180px;height:180px;border-radius:50%;overflow:hidden;flex:none;z-index:2;
  box-shadow:var(--sh-4),0 0 0 1px rgba(255,255,255,0.12),inset 0 0 0 3px rgba(255,255,255,0.05);
  transition:transform .18s var(--ease),box-shadow .4s var(--ease)}
.stage-face img{width:100%;height:100%;object-fit:cover;display:block}
.stage-face-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:64px;color:#fff}
/* 감정 얼굴 2-레이어 크로스페이드 (안젤리나) — 기준점 정렬 유지 */
.emotion-face .emotion-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .5s var(--ease);will-change:opacity;backface-visibility:hidden}
.emotion-face .emotion-layer.is-active{opacity:1}
.reduce-motion .emotion-face .emotion-layer{transition:none!important}
.stage-face-sheen{position:absolute;inset:0;border-radius:50%;pointer-events:none;
  background:linear-gradient(155deg,rgba(255,255,255,0.22),transparent 42%);mix-blend-mode:screen}

/* 이름/필드/상태 */
.stage-name{z-index:2;margin-top:20px;font-family:var(--font-display);font-size:25px;font-weight:600;color:var(--ivory);letter-spacing:.01em;text-align:center;line-height:1.15}
.stage-field{z-index:2;margin-top:4px;font-size:12.5px;color:var(--gold);text-align:center}
.stage-status{z-index:2;margin-top:12px;font-size:11px;color:var(--silver-dim);display:flex;align-items:center;gap:7px;letter-spacing:.04em;text-transform:uppercase}
.stage-status .status-dot{width:8px;height:8px}

/* ===== 친밀도 위젯 (비주얼라이저 아래, 안젤리나 전용) ===== */
.intimacy-box{z-index:2;margin-top:18px;width:100%;max-width:240px;padding:13px 15px 14px;
  border-radius:14px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);
  transition:box-shadow .4s var(--ease),border-color .4s var(--ease)}
.intimacy-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
.intimacy-title{font-size:11px;letter-spacing:.03em;color:var(--silver-dim);display:flex;align-items:center;gap:5px}
.intimacy-title .fa-heart{color:#ff6b9d}
.intimacy-level{font-size:11px;font-weight:600;color:var(--ivory)}
.intimacy-pips{display:flex;gap:6px;justify-content:center;margin-bottom:9px}
.intimacy-pip{font-size:14px;color:rgba(255,255,255,0.15);transition:color .35s var(--ease),transform .35s var(--ease)}
.intimacy-pip.on{color:#ff6b9d;text-shadow:0 0 8px rgba(255,107,157,0.55)}
.intimacy-bar{height:6px;border-radius:6px;background:rgba(255,255,255,0.08);overflow:hidden}
.intimacy-fill{height:100%;border-radius:6px;
  background:linear-gradient(90deg,#ff6b9d,#ffa26b);transition:width .7s var(--ease-out)}
.intimacy-desc{margin-top:8px;font-size:10.5px;color:var(--silver-dim);text-align:center;letter-spacing:.01em}
/* 레벨업 연출 */
.intimacy-box.leveled{animation:intimacyPulse 1.1s var(--ease)}
@keyframes intimacyPulse{
  0%{box-shadow:0 0 0 0 rgba(255,107,157,0);border-color:rgba(255,255,255,0.08)}
  35%{box-shadow:0 0 26px 3px rgba(255,107,157,0.55);border-color:rgba(255,107,157,0.6)}
  100%{box-shadow:0 0 0 0 rgba(255,107,157,0);border-color:rgba(255,255,255,0.08)}}
.intimacy-box.leveled .intimacy-pip.on{animation:pipPop .5s var(--ease)}
@keyframes pipPop{0%{transform:scale(1)}50%{transform:scale(1.5)}100%{transform:scale(1)}}
.reduce-motion .intimacy-box.leveled,.reduce-motion .intimacy-fill,.reduce-motion .intimacy-pip{animation:none!important;transition:none!important}
/* 레벨업 토스트 */
.intimacy-toast{position:fixed;left:50%;bottom:32px;transform:translateX(-50%) translateY(20px);
  z-index:9999;padding:12px 20px;border-radius:999px;font-size:13px;color:#fff;
  background:linear-gradient(90deg,#ff6b9d,#ff8f6b);box-shadow:0 8px 30px rgba(255,107,157,0.4);
  opacity:0;pointer-events:none;transition:opacity .4s var(--ease),transform .4s var(--ease)}
.intimacy-toast .fa-heart{margin-right:6px}
.intimacy-toast .fa-unlock{margin-right:6px}
.intimacy-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.reduce-motion .intimacy-toast{transition:opacity .2s}

/* 잠긴 하트 pip (Lv.4/5 미인증) */
.intimacy-pip.locked{color:rgba(255,255,255,0.28)}
.intimacy-pip.locked.on{color:#c9a86b}

/* 잠금 해제 영역/버튼 */
.intimacy-unlock{margin-top:10px;display:flex;justify-content:center}
.intimacy-unlock:empty{margin-top:0}
.intimacy-unlock-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;
  font-size:11px;font-weight:600;color:#fff;cursor:pointer;border:1px solid rgba(255,143,107,0.5);
  background:linear-gradient(90deg,rgba(255,107,157,0.22),rgba(255,143,107,0.22));
  transition:filter .2s var(--ease),transform .15s var(--ease)}
.intimacy-unlock-btn:hover{filter:brightness(1.18);transform:translateY(-1px)}
.intimacy-unlock-btn .fa-lock{font-size:10px}
.intimacy-unlock-done{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;color:#c9a86b;letter-spacing:.01em}

/* 성인 인증 모달 */
.adult-modal-overlay{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;
  background:rgba(8,8,14,0.72);backdrop-filter:blur(6px);opacity:0;pointer-events:none;
  transition:opacity .28s var(--ease)}
.adult-modal-overlay.show{opacity:1;pointer-events:auto}
.adult-modal{position:relative;width:min(92vw,380px);padding:28px 24px 22px;border-radius:20px;
  background:linear-gradient(160deg,#1c1b25,#141019);border:1px solid rgba(255,143,107,0.25);
  box-shadow:0 24px 70px rgba(0,0,0,0.6);transform:translateY(14px) scale(.98);
  transition:transform .28s var(--ease)}
.adult-modal-overlay.show .adult-modal{transform:translateY(0) scale(1)}
.adult-modal-close{position:absolute;top:12px;right:14px;background:none;border:none;color:var(--silver-dim);
  font-size:16px;cursor:pointer;line-height:1}
.adult-modal-close:hover{color:#fff}
.adult-modal-icon{text-align:center;font-size:34px;margin-bottom:10px;
  background:linear-gradient(90deg,#ff6b9d,#ff8f6b);-webkit-background-clip:text;background-clip:text;color:transparent}
.adult-modal-title{margin:0 0 10px;text-align:center;font-size:16px;font-weight:700;color:#fff}
.adult-modal-desc{margin:0 0 16px;text-align:center;font-size:12px;line-height:1.7;color:var(--silver-dim)}
.adult-modal-desc b{color:#ff8f6b}
.adult-modal-input{width:100%;box-sizing:border-box;padding:12px 14px;border-radius:12px;text-align:center;
  font-size:18px;letter-spacing:.4em;color:#fff;background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.14);outline:none;transition:border-color .2s}
.adult-modal-input:focus{border-color:#ff8f6b}
.adult-modal-error{min-height:18px;margin:8px 2px 4px;font-size:11.5px;color:#ff7b7b;text-align:center}
.adult-modal-actions{display:flex;gap:10px;margin-top:8px}
.adult-modal-cancel,.adult-modal-submit{flex:1;padding:11px 0;border-radius:12px;font-size:13px;font-weight:600;cursor:pointer;border:none}
.adult-modal-cancel{color:var(--silver-dim);background:rgba(255,255,255,0.07)}
.adult-modal-cancel:hover{color:#fff;background:rgba(255,255,255,0.12)}
.adult-modal-submit{display:inline-flex;align-items:center;justify-content:center;gap:6px;color:#fff;
  background:linear-gradient(90deg,#ff6b9d,#ff8f6b);transition:filter .2s}
.adult-modal-submit:hover{filter:brightness(1.15)}
.adult-modal-submit.loading{opacity:.6;cursor:wait}
.reduce-motion .adult-modal-overlay,.reduce-motion .adult-modal{transition:opacity .15s}

/* 비주얼라이저 이퀄라이저 바 */
.stage-visualizer{z-index:2;margin-top:18px;display:flex;align-items:flex-end;justify-content:center;gap:3px;height:34px;width:100%;max-width:220px}
.viz-bar{width:4px;height:6px;border-radius:3px;flex:none;
  background:linear-gradient(180deg,var(--cyan),var(--cyan-dim));
  opacity:.4;transform-origin:bottom;transition:opacity .3s}

/* 유휴 상태: 잔잔한 숨쉬기 */
.mentor-stage[data-speaking="false"] .viz-bar{
  animation:vizIdle 3.2s var(--ease) infinite;
  animation-delay:calc(var(--i) * 0.06s)}
@keyframes vizIdle{0%,100%{transform:scaleY(1)}50%{transform:scaleY(2.2)}}

/* 말하는 중: 활발한 오디오 비주얼라이저 */
.mentor-stage[data-speaking="true"] .stage-face{animation:faceTalk 1.6s var(--ease) infinite}
@keyframes faceTalk{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
.mentor-stage[data-speaking="true"] .stage-glow{opacity:.4;animation:glowPulse 1.4s var(--ease) infinite}
@keyframes glowPulse{0%,100%{transform:translateX(-50%) scale(1);opacity:.32}50%{transform:translateX(-50%) scale(1.18);opacity:.5}}
.mentor-stage[data-speaking="true"] .stage-ring{animation:stageWave 2s var(--ease-out) infinite}
.mentor-stage[data-speaking="true"] .stage-ring-2{animation-delay:.66s}
.mentor-stage[data-speaking="true"] .stage-ring-3{animation-delay:1.33s}
@keyframes stageWave{0%{transform:scale(.86);opacity:.55}100%{transform:scale(1.35);opacity:0}}
.mentor-stage[data-speaking="true"] .viz-bar{opacity:1;
  animation:vizTalk .62s var(--ease) infinite;
  animation-delay:calc(var(--i) * 0.045s)}
@keyframes vizTalk{
  0%{transform:scaleY(.6)}
  20%{transform:scaleY(4.2)}
  40%{transform:scaleY(1.6)}
  60%{transform:scaleY(5.2)}
  80%{transform:scaleY(2.2)}
  100%{transform:scaleY(.6)}}
/* 바마다 다른 높이감을 주기 위해 nth 변주 */
.mentor-stage[data-speaking="true"] .viz-bar:nth-child(3n){animation-duration:.5s}
.mentor-stage[data-speaking="true"] .viz-bar:nth-child(4n){animation-duration:.72s}
.mentor-stage[data-speaking="true"] .viz-bar:nth-child(5n){animation-duration:.58s}
.mentor-stage[data-speaking="true"] .status-dot{box-shadow:0 0 14px var(--cyan);animation:dotPulse 1s infinite}
@keyframes dotPulse{0%,100%{opacity:1}50%{opacity:.4}}

.reduce-motion .viz-bar,.reduce-motion .stage-face,.reduce-motion .stage-glow,.reduce-motion .stage-ring{animation:none!important}
.reduce-motion .mentor-stage[data-speaking="true"] .viz-bar{opacity:.85;transform:scaleY(2)}

/* main chat */
.chat-main{display:flex;flex-direction:column;min-width:0;height:100vh;height:100dvh;position:relative}
.chat-head{display:flex;align-items:center;gap:14px;padding:15px 22px;border-bottom:1px solid var(--glass-brd);
  background:rgba(8,11,22,0.55);backdrop-filter:blur(16px) saturate(130%);z-index:5}
.chat-head .m-avatar{width:47px;height:47px;font-size:18px}
.chat-head-info{flex:1;min-width:0}
.chat-head-info .nm{font-size:17px;color:var(--ivory);font-weight:700;letter-spacing:-0.01em}
.chat-head-info .fl{font-size:12px;color:var(--gold)}
.sim-badge{font-size:10px;background:rgba(99,227,227,0.12);color:var(--cyan);padding:3px 9px;border-radius:var(--radius-pill);border:1px solid rgba(99,227,227,0.28)}
.icon-btn{width:40px;height:40px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;
  background:var(--glass);border:1px solid var(--glass-brd);color:var(--silver);transition:.18s var(--ease)}
.icon-btn:hover{background:var(--surface-3);color:var(--ivory);transform:translateY(-1px)}
.icon-btn.icon-gold{color:var(--gold);border-color:rgba(216,182,115,0.4)}
.icon-btn.icon-gold:hover{background:rgba(216,182,115,0.14);color:var(--gold)}

.messages{flex:1;overflow-y:auto;padding:28px 20px;display:flex;flex-direction:column;gap:22px}
.msg{display:flex;gap:13px;max-width:820px;width:100%;margin:0 auto;align-items:flex-start;animation:msgIn .45s var(--ease-out)}
@keyframes msgIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.reduce-motion .msg{animation:none}
.msg-avatar{width:36px;height:36px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:14px;color:#fff;box-shadow:var(--sh-1),inset 0 0 0 1px rgba(255,255,255,0.08)}
.msg-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.msg-body{flex:1;min-width:0}
.msg-name{font-size:12.5px;color:var(--gold);font-weight:600;margin-bottom:5px;letter-spacing:.01em}
.msg.user .msg-name{color:var(--cyan)}
.msg-content{background:var(--glass);border:1px solid var(--glass-brd);border-radius:4px 16px 16px 16px;padding:14px 18px;
  font-size:15px;line-height:1.75;color:var(--ivory);white-space:pre-wrap;word-break:break-word;
  box-shadow:var(--sh-1),inset 0 1px 0 rgba(255,255,255,0.04)}
.msg.user{flex-direction:row-reverse}
.msg.user .msg-body{display:flex;flex-direction:column;align-items:flex-end}
.msg.user .msg-content{background:linear-gradient(180deg,rgba(99,227,227,0.13),rgba(99,227,227,0.06));border-color:rgba(99,227,227,0.24);border-radius:16px 4px 16px 16px;max-width:88%}
.msg-tools{display:flex;gap:6px;margin-top:8px;opacity:0;transition:opacity .18s;flex-wrap:wrap}
.msg:hover .msg-tools{opacity:1}
.msg-tool{font-size:12px;color:var(--silver-dim);padding:4px 10px;border-radius:var(--radius-xs);background:var(--surface-1);border:1px solid var(--glass-brd);transition:.15s}
.msg-tool:hover{color:var(--ivory);background:var(--surface-3)}
.sources-box{margin-top:9px;font-size:12px;color:var(--silver-dim);background:rgba(0,0,0,0.25);border-radius:var(--radius-xs);padding:10px 13px;border:1px solid var(--glass-brd)}
.sources-box b{color:var(--gold)}

.chat-disclaimer{font-size:11px;color:var(--silver-dim);text-align:center;padding:6px 20px;background:rgba(0,0,0,0.2)}

.composer{padding:16px 20px 20px;border-top:1px solid var(--glass-brd);background:rgba(8,11,22,0.65);backdrop-filter:blur(16px) saturate(130%)}
.composer-inner{max-width:820px;margin:0 auto;display:flex;gap:10px;align-items:flex-end}
.composer-input{flex:1;background:rgba(0,0,0,0.34);border:1px solid var(--glass-brd);border-radius:var(--radius-sm);
  padding:13px 17px;color:var(--ivory);font-size:15px;resize:none;max-height:160px;line-height:1.55;transition:border-color .2s,box-shadow .2s}
.composer-input:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 3.5px rgba(99,227,227,0.13)}
.composer-btns{display:flex;gap:8px}
.send-btn{width:50px;height:50px;border-radius:var(--radius-sm);background:linear-gradient(180deg,#EBD6A3,#c99f5c);
  color:#241a06;font-size:18px;display:flex;align-items:center;justify-content:center;transition:.16s var(--ease);
  box-shadow:var(--sh-2),0 4px 16px rgba(216,182,115,0.22)}
.send-btn:hover{background:linear-gradient(180deg,#f4e4bd,#d8b06a);transform:translateY(-1px);box-shadow:var(--sh-3),0 8px 22px rgba(216,182,115,0.3)}
.send-btn:active{transform:translateY(1px)}
.send-btn:disabled{opacity:.5;box-shadow:none;transform:none}
.prompt-chips{display:flex;gap:8px;flex-wrap:wrap;max-width:820px;margin:0 auto 10px}
.chip{font-size:13px;padding:8px 14px;border-radius:var(--radius-pill);background:var(--glass);border:1px solid var(--glass-brd);color:var(--silver);transition:.18s var(--ease)}
.chip:hover{background:rgba(99,227,227,0.1);color:var(--ivory);border-color:rgba(99,227,227,0.3);transform:translateY(-1px)}

/* insight panel */
.insight{background:linear-gradient(180deg,rgba(9,13,26,0.86),rgba(6,9,20,0.9));backdrop-filter:blur(20px) saturate(140%);border-left:1px solid var(--glass-brd);
  overflow-y:auto;padding:18px}
.insight-card{padding:17px;margin-bottom:14px;border-radius:var(--radius-sm);transition:border-color .25s,box-shadow .25s}
.insight-card:hover{border-color:var(--glass-brd-strong);box-shadow:var(--sh-2)}
.insight-card h4{font-size:13px;color:var(--gold);margin-bottom:10px;display:flex;align-items:center;gap:8px;font-weight:700;letter-spacing:.01em}
.insight-card p,.insight-card li{font-size:13px;color:var(--silver);line-height:1.65}
.insight-card ul{list-style:none;display:flex;flex-direction:column;gap:7px}
.insight-card li:before{content:'◆';color:var(--cyan);margin-right:7px;font-size:9px}
.kw-tag{display:inline-block;font-size:12px;background:rgba(99,227,227,0.1);color:var(--cyan);padding:4px 11px;border-radius:var(--radius-pill);margin:3px 3px 0 0;border:1px solid rgba(99,227,227,0.18)}

/* voice wave */
.wave-wrap{position:relative;width:120px;height:120px;margin:0 auto}
.wave-core{position:absolute;inset:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:26px}
.wave-ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--cyan);opacity:0;animation:wave 2.4s ease-out infinite}
.wave-ring:nth-child(2){animation-delay:.8s}
.wave-ring:nth-child(3){animation-delay:1.6s}
@keyframes wave{0%{transform:scale(.55);opacity:.7}100%{transform:scale(1);opacity:0}}
.thinking-dots{display:inline-flex;gap:5px}
.thinking-dots span{width:7px;height:7px;border-radius:50%;background:var(--cyan);animation:tdot 1.2s infinite}
.thinking-dots span:nth-child(2){animation-delay:.2s}
.thinking-dots span:nth-child(3){animation-delay:.4s}
@keyframes tdot{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-5px)}}

/* modal */
.modal-overlay{position:fixed;inset:0;background:rgba(3,5,12,0.72);backdrop-filter:blur(8px);z-index:1000;
  display:flex;align-items:center;justify-content:center;padding:20px;animation:fadeIn .25s var(--ease-out)}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal{width:100%;max-width:460px;max-height:90vh;overflow-y:auto;padding:34px;box-shadow:var(--sh-4);animation:popIn .32s var(--ease-out)}
@keyframes popIn{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.reduce-motion .modal,.reduce-motion .modal-overlay{animation:none}
.modal h2{font-family:var(--font-display);font-size:28px;color:var(--ivory);margin-bottom:6px;font-weight:600;letter-spacing:.01em}
.modal .sub{font-size:13px;color:var(--silver-dim);margin-bottom:24px;line-height:1.6}
.modal-close{position:absolute;top:16px;right:16px}
.tab-switch{display:flex;gap:6px;margin-bottom:22px;background:rgba(0,0,0,0.3);padding:5px;border-radius:var(--radius-sm)}
.tab-switch button{flex:1;padding:10px;border-radius:var(--radius-xs);font-size:14px;color:var(--silver-dim);transition:.18s}
.tab-switch button.active{background:rgba(99,227,227,0.14);color:var(--ivory)}
.form-err{color:#ff8585;font-size:13px;margin-bottom:12px;min-height:18px}

/* mobile bits */
.mobile-bar{display:none}
.drawer-overlay{display:none}

/* voice modal */
.voice-modal{position:fixed;inset:0;background:rgba(5,8,16,0.96);z-index:1100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;padding:30px}
.voice-modal .wave-wrap{width:200px;height:200px}
.voice-modal .wave-core{inset:50px;font-size:40px}
.voice-subtitle{max-width:600px;text-align:center;font-size:17px;color:var(--ivory);min-height:60px;line-height:1.7}
.voice-status{color:var(--gold);font-size:14px;letter-spacing:.1em}

/* admin */
.admin-shell{min-height:100vh;display:grid;grid-template-columns:244px 1fr}
.admin-nav{background:linear-gradient(180deg,rgba(9,13,26,0.9),rgba(6,9,20,0.94));border-right:1px solid var(--glass-brd);padding:18px 12px;overflow-y:auto}
.admin-main{padding:32px;overflow-y:auto;height:100vh}
.admin-main > *{animation:riseIn .5s var(--ease-out)}
.reduce-motion .admin-main > *{animation:none}
.admin-nav .sb-item{font-size:13px}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:16px;margin-bottom:26px}
.stat-card{padding:22px;border-radius:var(--radius-sm);position:relative;overflow:hidden;transition:transform .3s var(--ease-out),border-color .3s,box-shadow .3s}
.stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--gold),transparent 70%);opacity:.5}
.stat-card:hover{transform:translateY(-3px);border-color:var(--glass-brd-strong);box-shadow:var(--sh-3)}
.stat-card .v{font-size:34px;font-weight:700;color:var(--gold);font-family:var(--font-display);line-height:1;letter-spacing:.01em}
.stat-card .l{font-size:12px;color:var(--silver-dim);margin-top:7px;letter-spacing:.01em}
.data-table{width:100%;border-collapse:collapse;font-size:13px}
.data-table th{text-align:left;padding:11px;color:var(--silver-dim);border-bottom:1px solid var(--glass-brd);font-weight:600;font-size:12px;letter-spacing:.02em}
.data-table td{padding:11px;border-bottom:1px solid rgba(255,255,255,0.05);color:var(--silver)}
.badge{font-size:11px;padding:3px 9px;border-radius:var(--radius-pill);background:rgba(99,227,227,0.12);color:var(--cyan)}
.badge.gold{background:rgba(216,182,115,0.15);color:var(--gold)}
.section-title{font-family:var(--font-display);font-size:30px;color:var(--ivory);margin-bottom:6px;font-weight:600;letter-spacing:.01em}
.section-sub{font-size:13px;color:var(--silver-dim);margin-bottom:24px;line-height:1.6}

/* spinner & toast */
.spinner{width:36px;height:36px;border:3px solid rgba(255,255,255,0.1);border-top-color:var(--cyan);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:2000;
  background:rgba(20,28,50,0.95);border:1px solid var(--glass-brd);color:var(--ivory);
  padding:13px 22px;border-radius:12px;font-size:14px;box-shadow:var(--shadow);animation:toastin .3s}
@keyframes toastin{from{opacity:0;transform:translate(-50%,16px)}to{opacity:1;transform:translate(-50%,0)}}

/* ===== Responsive ===== */
@media (max-width:1100px){
  .app-shell{grid-template-columns:260px 1fr}
  .insight{display:none}
  .insight.show{display:block;position:fixed;right:0;top:0;bottom:0;width:300px;z-index:500;box-shadow:var(--shadow)}
}
@media (max-width:760px){
  .app-shell{grid-template-columns:1fr}
  .sidebar{position:fixed;left:0;top:0;bottom:0;width:280px;z-index:600;transform:translateX(-100%);transition:transform .25s}
  .sidebar.show{transform:translateX(0)}
  .drawer-overlay.show{display:block;position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:550}
  .insight.show{width:88%;max-width:320px}
  .mobile-bar{display:flex;align-items:center;gap:10px}
  .hero-cards{grid-template-columns:1fr}
  .admin-shell{grid-template-columns:1fr}
  .admin-nav{position:fixed;left:0;top:0;bottom:0;width:240px;z-index:600;transform:translateX(-100%);transition:transform .25s}
  .admin-nav.show{transform:translateX(0)}
  .messages{padding:16px 12px}
  .composer{padding:10px 12px 14px}
}

/* ===== login page (첫 화면) ===== */
.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;position:relative;z-index:2}
.auth-card{width:100%;max-width:430px;padding:40px 34px;border-radius:var(--radius);position:relative;
  box-shadow:var(--sh-4),inset 0 1px 0 rgba(255,255,255,0.06);animation:riseIn .7s var(--ease-out)}
.auth-back{position:absolute;top:18px;left:18px;font-size:12.5px}

/* hub (메뉴 허브) */
.auth-hub{width:100%;max-width:700px;text-align:center;animation:riseIn .7s var(--ease-out)}
.hub-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:34px}
.hub-card{display:flex;flex-direction:column;align-items:center;gap:10px;padding:34px 22px;border-radius:var(--radius);cursor:pointer;
  background:linear-gradient(180deg,var(--surface-2),var(--surface-1));border:1px solid var(--glass-brd);color:var(--ivory);
  transition:transform .32s var(--ease-out),border-color .3s,box-shadow .32s;backdrop-filter:blur(12px);position:relative;overflow:hidden}
.hub-card::after{content:'';position:absolute;inset:0;background:radial-gradient(120% 90% at 50% -20%,rgba(99,227,227,0.14),transparent 60%);opacity:0;transition:opacity .32s}
.hub-card i{font-size:36px;color:var(--cyan);margin-bottom:6px;transition:transform .32s var(--ease-out),color .3s}
.hub-card-title{font-size:19px;font-weight:700;font-family:var(--font-display);letter-spacing:.01em}
.hub-card-sub{font-size:12.5px;color:var(--silver-dim);line-height:1.5}
.hub-card:hover{transform:translateY(-6px);border-color:var(--cyan);box-shadow:var(--sh-4),0 0 0 1px rgba(99,227,227,0.2)}
.hub-card:hover i{transform:scale(1.12) translateY(-2px)}
.hub-card:hover::after{opacity:1}
.hub-card.hub-gold i{color:var(--gold)}
.hub-card.hub-gold::after{background:radial-gradient(120% 90% at 50% -20%,rgba(216,182,115,0.16),transparent 60%)}
.hub-card.hub-gold:hover{border-color:var(--gold);box-shadow:var(--sh-4),0 0 0 1px rgba(216,182,115,0.22)}
.hub-card.hub-cyan i{color:var(--cyan)}
@media (max-width:560px){.hub-grid{grid-template-columns:1fr}}
.auth-brand{text-align:center;margin-bottom:26px}
.auth-logo{font-family:var(--font-display);font-size:38px;font-weight:600;margin:10px 0 8px;letter-spacing:.01em;
  background:linear-gradient(176deg,#fff,var(--gold-soft) 70%,var(--gold));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.auth-tagline{font-size:13.5px;color:var(--silver-dim);font-family:var(--font-display);font-style:italic;letter-spacing:.02em}
.auth-divider{display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--silver-dim);font-size:12px}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:var(--glass-brd)}
.auth-foot{margin-top:20px;padding-top:16px;border-top:1px solid var(--glass-brd);display:flex;flex-direction:column;gap:8px;align-items:center}
.link-btn{background:none;border:none;color:var(--silver-dim);cursor:pointer;font-size:12.5px;display:inline-flex;align-items:center;gap:6px;transition:.15s}
.link-btn:hover{color:var(--cyan)}
.auth-staff{margin-top:14px;display:flex;justify-content:center;align-items:center;gap:10px;opacity:.55;transition:opacity .2s}
.auth-staff:hover{opacity:.9}
.staff-link{background:none;border:none;color:var(--silver-dim);cursor:pointer;font-size:11px;letter-spacing:.2px;display:inline-flex;align-items:center;gap:4px;padding:2px 4px;transition:color .15s}
.staff-link:hover{color:var(--gold)}
.staff-link i{font-size:10px;opacity:.8}
.staff-sep{color:var(--silver-dim);opacity:.4;font-size:10px}

/* ===== master entry ===== */
.btn-gold{background:rgba(216,182,115,0.12);color:var(--gold-soft);border:1px solid var(--gold);font-weight:600}
.btn-gold:hover{background:rgba(216,182,115,0.22);box-shadow:0 0 0 3px rgba(216,182,115,0.12)}
.master-badge{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-display);font-size:19px;color:var(--gold);font-weight:600;letter-spacing:.04em;padding:9px 16px;border:1px solid var(--gold);border-radius:var(--radius-sm);background:rgba(216,182,115,0.08);box-shadow:var(--glow-gold)}
.master-tag{display:inline-block;font-size:9px;font-weight:800;letter-spacing:.1em;color:#1a1305;background:linear-gradient(180deg,#E8D3A0,#bb965a);padding:1px 6px;border-radius:6px;vertical-align:middle;margin-left:4px}

/* ===== admin extras ===== */
.field-label{display:block;font-size:13px;color:var(--silver-dim);margin:10px 0 6px}
.range-input{width:100%;accent-color:var(--cyan);margin-bottom:8px}
.link{color:var(--cyan);text-decoration:none;border-bottom:1px solid transparent}
.link:hover{border-bottom-color:var(--cyan)}
.loading-pad{padding:60px 0;text-align:center;color:var(--silver-dim);font-size:15px}
.empty-state{padding:60px 20px;text-align:center;color:var(--silver-dim)}
.empty-state i{font-size:34px;color:var(--gold);margin-bottom:12px;display:block}
.admin-title{font-family:var(--font-display);font-size:32px;color:var(--ivory);font-weight:600;letter-spacing:.01em}
.admin-sub{color:var(--silver-dim);font-size:14px;margin:5px 0 24px;line-height:1.6}
.admin-table-wrap{overflow-x:auto;border-radius:var(--radius-sm);border:1px solid var(--glass-brd);background:rgba(8,11,22,0.5);box-shadow:var(--sh-2)}
.admin-table{width:100%;border-collapse:collapse;font-size:13px}
.admin-table th{text-align:left;padding:12px 14px;color:var(--silver-dim);font-weight:500;border-bottom:1px solid var(--glass-brd);white-space:nowrap}
.admin-table td{padding:12px 14px;border-bottom:1px solid rgba(255,255,255,0.04);color:var(--silver);vertical-align:top}
.admin-table tr:last-child td{border-bottom:none}
.admin-table code{font-size:12px;color:var(--cyan);background:rgba(95,224,224,0.08);padding:2px 6px;border-radius:5px}
.badge.ok{background:rgba(95,224,224,0.14);color:var(--cyan)}
.badge.off{background:rgba(255,255,255,0.06);color:var(--silver-dim)}
.btn-mini{font-size:12px;padding:5px 10px;border-radius:8px;border:1px solid var(--glass-brd);background:rgba(255,255,255,0.04);color:var(--ivory);cursor:pointer;transition:.15s;white-space:nowrap}
.btn-mini:hover{border-color:var(--cyan);color:var(--cyan)}
.btn-mini.danger:hover{border-color:#e06868;color:#e06868}
.edit-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
.edit-col{padding:20px;border-radius:var(--radius-sm)}
.edit-col.span2{grid-column:1/-1}
.kb-result{background:rgba(255,255,255,0.03);border:1px solid var(--glass-brd);border-radius:10px;padding:14px;margin-bottom:10px}
.kb-result .kb-head{font-size:13px;color:var(--gold);font-weight:600;margin-bottom:6px}
.kb-result p{font-size:13px;color:var(--silver);line-height:1.6}
@media (max-width:760px){.edit-grid{grid-template-columns:1fr}}

/* ===== admin console layout v2 ===== */
.admin-brand{padding:4px 8px 14px;border-bottom:1px solid var(--glass-brd);margin-bottom:12px}
.admin-brand-title{font-family:var(--font-display);font-size:20px;color:var(--ivory);font-weight:600;letter-spacing:.04em;margin-top:4px}
.admin-who{display:flex;align-items:center;gap:10px;padding:10px;background:rgba(255,255,255,0.03);border:1px solid var(--glass-brd);border-radius:10px;margin-bottom:14px}
.admin-who i{font-size:22px;color:var(--gold)}
.admin-who-name{font-size:13px;color:var(--ivory);font-weight:600}
.admin-who-role{font-size:11px;color:var(--silver-dim);margin-top:1px}
.admin-nav-group{display:flex;flex-direction:column;gap:2px}
.admin-nav .sb-item{width:100%;text-align:left;background:none;border:none;cursor:pointer;color:var(--silver);display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;font-size:13px;transition:.15s;text-decoration:none}
.admin-nav .sb-item i{width:18px;text-align:center;color:var(--silver-dim)}
.admin-nav .sb-item:hover{background:rgba(255,255,255,0.05);color:var(--ivory)}
.admin-nav .sb-item.active{background:rgba(95,224,224,0.12);color:var(--cyan)}
.admin-nav .sb-item.active i{color:var(--cyan)}
.admin-nav-foot{margin-top:auto;border-top:1px solid var(--glass-brd);padding-top:12px;display:flex;flex-direction:column;gap:2px}
.admin-nav{display:flex;flex-direction:column}
.admin-menu-btn{display:none;position:fixed;top:14px;left:14px;z-index:700;width:42px;height:42px;border-radius:10px;background:var(--navy2);border:1px solid var(--glass-brd);color:var(--ivory);font-size:16px;cursor:pointer}
.admin-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap}

.dash-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;margin-top:22px}
.dash-panel{padding:22px;border-radius:var(--radius-sm);transition:border-color .25s,box-shadow .25s}
.dash-panel:hover{border-color:var(--glass-brd-strong);box-shadow:var(--sh-2)}
.dash-h{font-family:var(--font-display);color:var(--ivory);font-size:18px;margin-bottom:16px;display:flex;align-items:center;gap:9px;font-weight:600;letter-spacing:.01em}
.dash-h i{color:var(--gold)}
.bar-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.bar-label{font-size:13px;color:var(--silver);width:90px;flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-track{flex:1;height:8px;background:rgba(255,255,255,0.06);border-radius:6px;overflow:hidden}
.bar-fill{height:100%;border-radius:6px;transition:width .4s}
.bar-val{font-size:12px;color:var(--silver-dim);width:32px;text-align:right}
.ai-status-row{display:flex;align-items:center;gap:10px}
.status-dot{width:11px;height:11px;border-radius:50%;display:inline-block;box-shadow:0 0 8px currentColor}
.quick-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.quick-btn{display:flex;flex-direction:column;align-items:center;gap:9px;padding:18px 10px;background:var(--surface-1);border:1px solid var(--glass-brd);border-radius:var(--radius-sm);color:var(--silver);cursor:pointer;transition:.22s var(--ease-out);font-size:13px}
.quick-btn i{font-size:21px;color:var(--cyan);transition:transform .22s var(--ease-out)}
.quick-btn:hover{border-color:var(--cyan);color:var(--ivory);transform:translateY(-3px);box-shadow:var(--sh-2)}
.quick-btn:hover i{transform:scale(1.1)}

.edit-h{font-family:var(--font-serif);color:var(--gold);font-size:14px;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--glass-brd)}
.cell-input{width:64px;padding:5px 8px;border-radius:7px;background:rgba(0,0,0,0.3);border:1px solid var(--glass-brd);color:var(--ivory);font-size:12px}
.cell-input:focus{outline:none;border-color:var(--cyan)}

.toggle{width:42px;height:23px;border-radius:14px;background:rgba(255,255,255,0.12);border:none;cursor:pointer;position:relative;transition:.2s;padding:0}
.toggle span{position:absolute;top:2px;left:2px;width:19px;height:19px;border-radius:50%;background:#fff;transition:.2s}
.toggle.on{background:var(--cyan)}
.toggle.on span{left:21px}

/* ===== AI key panel ===== */
.ai-key-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:820px){.ai-key-row{grid-template-columns:1fr}}
.ai-key-panel{padding:20px}
.ai-key-title{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.ai-key-state{display:flex;align-items:center;gap:6px}
.ai-key-status{display:flex;align-items:center;gap:8px}
.ai-key-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.ai-test-result{display:none;margin-top:14px;padding:12px 14px;border-radius:10px;font-size:13px;line-height:1.5}
.ai-test-result.show{display:block}
.ai-test-result.ok{background:rgba(95,224,224,0.1);border:1px solid rgba(95,224,224,0.35);color:var(--cyan)}
.ai-test-result.err{background:rgba(224,104,104,0.1);border:1px solid rgba(224,104,104,0.35);color:#e08a8a}

/* ===== Model catalog ===== */
.catalog-tabs{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.cat-tab{font-size:13px;padding:7px 16px;border-radius:20px;border:1px solid var(--glass-brd);background:rgba(255,255,255,0.03);color:var(--silver);cursor:pointer;transition:.15s}
.cat-tab:hover{color:var(--ivory);border-color:var(--silver)}
.cat-tab.active{background:rgba(95,224,224,0.14);border-color:var(--cyan);color:var(--cyan)}
.catalog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(265px,1fr));gap:14px}
.cat-card{position:relative;padding:20px;border-radius:var(--radius-sm);background:linear-gradient(180deg,var(--surface-2),var(--surface-1));border:1px solid var(--glass-brd);transition:transform .28s var(--ease-out),border-color .28s,box-shadow .28s;display:flex;flex-direction:column}
.cat-card:hover{transform:translateY(-4px);border-color:var(--cyan);box-shadow:var(--sh-3)}
.cat-card.cat-rec{border-color:rgba(216,182,115,0.4)}
.cat-card.cat-registered{background:rgba(95,224,224,0.05)}
.cat-rec-badge{position:absolute;top:-9px;right:14px;background:var(--gold);color:#1a1407;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:12px}
.cat-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.cat-fam{font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:8px}
.cat-fam.fam-gpt{background:rgba(16,163,127,0.16);color:#3dd7b0}
.cat-fam.fam-gem{background:rgba(120,150,255,0.16);color:#9bb4ff}
.cat-fam.fam-fal{background:rgba(236,72,153,.16);color:#f19ac5}
.cat-name{font-family:var(--font-display);font-size:20px;color:var(--ivory);font-weight:600;letter-spacing:.01em}
.cat-id{display:inline-block;font-size:11px;color:var(--silver-dim);margin:3px 0 8px}
.cat-feat{font-size:12.5px;color:var(--silver);line-height:1.55;min-height:54px}
.cat-specs{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;margin:12px 0;padding:10px 0;border-top:1px solid var(--glass-brd);border-bottom:1px solid var(--glass-brd)}
.cat-specs > div{display:flex;justify-content:space-between;font-size:12px}
.cat-specs span{color:var(--silver-dim)}
.cat-specs b{color:var(--ivory);font-weight:600}
.cat-price{font-size:12px;color:var(--gold-soft);margin-bottom:12px}
.cat-price i{margin-right:4px}
.cat-actions{display:flex;gap:8px;margin-top:auto}
.cat-actions .btn-mini{flex:1;text-align:center}
.btn-mini.gold:hover{border-color:var(--gold);color:var(--gold)}
.btn-mini:disabled{opacity:.5;cursor:default}

@media (max-width:760px){
  .dash-grid{grid-template-columns:1fr}
  .admin-menu-btn{display:block}
  .admin-main{padding:64px 16px 24px}
}

/* reduce motion */
.reduce-motion *{animation:none!important;transition:none!important}
.reduce-motion #hero-canvas{display:none}
:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}

/* ============ 언어 선택 풀다운 (좌측 상단, 모든 화면 공통) ============ */
.lang-switcher{position:fixed;top:16px;left:16px;z-index:1200}
.lang-btn{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:10px;cursor:pointer;
  background:rgba(12,16,30,0.72);border:1px solid var(--glass-brd);color:var(--ivory);font-size:13px;
  backdrop-filter:blur(10px);transition:.18s}
.lang-btn:hover{border-color:var(--gold);background:rgba(20,26,44,0.85)}
.lang-btn i.fa-globe{color:var(--gold)}
.lang-cur{font-weight:600;white-space:nowrap}
.lang-caret{font-size:10px;color:var(--silver-dim);transition:transform .2s}
.lang-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:190px;padding:8px;border-radius:12px;
  background:rgba(14,18,32,0.97);border:1px solid var(--glass-brd);box-shadow:0 14px 38px rgba(0,0,0,0.5);
  backdrop-filter:blur(14px);opacity:0;visibility:hidden;transform:translateY(-6px);transition:.16s;z-index:1201}
.lang-menu.open{opacity:1;visibility:visible;transform:translateY(0)}
.lang-menu-title{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--silver-dim);padding:4px 10px 8px}
.lang-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border-radius:9px;cursor:pointer;
  background:transparent;border:none;color:var(--silver);font-size:14px;text-align:left;transition:background .14s}
.lang-item:hover{background:rgba(255,255,255,0.07);color:var(--ivory)}
.lang-item.active{background:rgba(216,182,115,0.14);color:var(--gold)}
.lang-item .fa-check{margin-left:auto;font-size:12px;color:var(--cyan)}
.lang-flag{font-size:16px}

/* 로그인/랜딩 화면에서 언어 풀다운이 브랜드와 겹치지 않도록 상단 여백 보정 */
.auth-page,.landing{padding-top:64px}

/* ============ 멘토 드롭다운(풀다운) — 클릭 시에만 열림 ============ */
.mentor-dd{position:relative;margin:6px 0 4px}
.mentor-dd-trigger{display:flex;align-items:center;gap:11px;width:100%;padding:10px 12px;border-radius:11px;cursor:pointer;
  background:rgba(255,255,255,0.05);border:1px solid var(--glass-brd);color:var(--ivory);transition:.16s;text-align:left}
.mentor-dd-trigger:hover{background:rgba(255,255,255,0.09);border-color:var(--cyan)}
.mentor-dd-trigger .m-meta{flex:1;min-width:0}
.dd-caret{margin-left:auto;font-size:11px;color:var(--silver-dim);transition:transform .2s}
.mentor-dd.open .dd-caret{transform:rotate(180deg)}
.mentor-dd-menu{display:none;margin-top:6px;padding:8px;border-radius:12px;
  background:rgba(10,14,26,0.96);border:1px solid var(--glass-brd);box-shadow:0 12px 30px rgba(0,0,0,0.4);
  max-height:340px;overflow-y:auto}
.mentor-dd-menu.open{display:block;animation:ddFade .16s ease}
@keyframes ddFade{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.mentor-dd-menu #mentor-search{margin-bottom:8px;font-size:13px;padding:8px 12px}
.reduce-motion .mentor-dd-menu.open{animation:none}

/* ============ 반응형 보강 ============ */
/* 태블릿: 인사이트 숨김(토글), 사이드바 유지 */
@media (max-width:980px){
  .app-shell{grid-template-columns:240px 1fr}
}
/* 모바일 가로/세로 작은 화면 */
@media (max-width:560px){
  .lang-switcher{top:10px;left:10px}
  .lang-btn{padding:7px 10px;font-size:12px}
  .lang-cur{max-width:78px;overflow:hidden;text-overflow:ellipsis}
  .auth-page,.landing{padding-top:58px}
  .auth-card{padding:26px 20px}
  .hero-title{font-size:34px}
  .chat-head{gap:8px;padding:12px 12px}
  .chat-head-info .nm{font-size:15px}
  .sim-badge{display:none}
}
/* 아주 작은 화면 (스마트폰 세로) */
@media (max-width:380px){
  .hub-card{padding:22px 14px}
  .hub-card-title{font-size:16px}
  .hero-actions{flex-direction:column}
  .hero-actions .btn{width:100%}
}
/* 큰 화면: 가독성 위해 메시지 영역 최대 폭 제한 */
@media (min-width:1500px){
  .messages{max-width:1100px;margin:0 auto;width:100%}
  .composer-inner,.prompt-chips{max-width:1100px;margin-left:auto;margin-right:auto}
}
/* 가로 모드 낮은 높이 대응 */
@media (max-height:480px) and (orientation:landscape){
  .auth-page,.landing{padding-top:48px;align-items:flex-start}
}

/* 채팅 화면에서는 언어 풀다운을 우측 상단으로 (좌측 사이드바와 겹침 방지) */
body:has(.app-shell) .lang-switcher{left:auto;right:16px}
body:has(.app-shell) .lang-menu{left:auto;right:0}
/* 관리자 화면도 동일 */
body:has(.admin-shell) .lang-switcher{left:auto;right:16px}
body:has(.admin-shell) .lang-menu{left:auto;right:0}
@media (max-width:560px){
  body:has(.app-shell) .lang-switcher{right:10px}
}

/* ===== 관리자 진입 기어/게이트 모달 (Req 7) ===== */
.icon-btn.icon-gear{color:var(--silver-dim);border-color:var(--glass-brd)}
.icon-btn.icon-gear:hover{color:var(--gold);border-color:rgba(216,182,115,0.4);background:rgba(216,182,115,0.10);transform:rotate(30deg)}
.modal-card{position:relative;width:100%;max-width:390px;background:linear-gradient(180deg,var(--navy2),var(--navy));
  border:1px solid var(--glass-brd);border-radius:var(--radius);box-shadow:var(--sh-4),inset 0 1px 0 rgba(255,255,255,0.06);padding:30px 28px 28px;animation:popIn .32s var(--ease-out)}
.reduce-motion .modal-card{animation:none}
.admin-gate-card h2{font-family:var(--font-display);font-size:26px;color:var(--ivory);font-weight:600;letter-spacing:.01em}
.modal-x{position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:9px;border:1px solid var(--glass-brd);
  background:rgba(255,255,255,0.04);color:var(--silver-dim);cursor:pointer;font-size:15px;transition:.15s}
.modal-x:hover{color:var(--ivory);border-color:var(--cyan);background:rgba(95,224,224,0.08)}
.admin-gate-card .field{margin-bottom:12px}
.admin-gate-card .input{text-align:center;letter-spacing:.35em;font-size:18px}
.err-msg{color:#e88;font-size:13px;text-align:center;margin:0 0 12px;background:rgba(224,104,104,0.08);
  border:1px solid rgba(224,104,104,0.28);border-radius:8px;padding:8px 10px}

/* ===== 멘토 이미지(외모) 에디터 ===== */
.mentor-img-editor{display:flex;gap:16px;align-items:center;margin-bottom:16px;padding:14px;
  background:rgba(255,255,255,0.03);border:1px solid var(--glass-brd);border-radius:12px}
.mentor-img-preview{width:92px;height:92px;border-radius:16px;flex:none;overflow:hidden;display:flex;
  align-items:center;justify-content:center;background:rgba(95,224,224,0.10);border:1px solid var(--glass-brd);
  color:var(--cyan);font-size:34px}
.mentor-img-preview img{width:100%;height:100%;object-fit:cover;display:block}
.mentor-img-actions{display:flex;flex-direction:column;gap:8px;align-items:flex-start;min-width:0}
.mentor-img-actions .btn-mini{width:auto}

/* ===== 멘토 목록: 카운트 뱃지 / 썸네일 / 삭제 버튼 ===== */
.count-badge{display:inline-block;font-size:13px;font-weight:600;color:var(--cyan);
  background:rgba(95,224,224,0.12);border:1px solid rgba(95,224,224,0.3);border-radius:20px;padding:2px 12px;
  vertical-align:middle;margin-left:8px}
.mentor-thumb{width:42px;height:42px;border-radius:11px;flex:none;overflow:hidden;display:flex;
  align-items:center;justify-content:center;font-size:18px;color:#fff}
.mentor-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.btn-mini.btn-danger,.btn-danger{border-color:rgba(224,104,104,0.4);color:#e88;background:rgba(224,104,104,0.06)}
.btn-mini.btn-danger:hover,.btn-danger:hover{border-color:#e06868;color:#fff;background:rgba(224,104,104,0.7)}

/* ===== 사용 분석: SVG 라인차트 & 범례 ===== */
.chart-legend{display:flex;gap:18px;margin:2px 0 10px;font-size:12px;color:var(--silver-dim)}
.chart-legend .dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px;vertical-align:middle}
.chart-wrap{width:100%;overflow-x:auto}
.line-chart{width:100%;min-width:420px;height:auto;display:block}
.bar-val small{font-weight:400;font-size:11px}

/* ===== 멘토 드래그 정렬 ===== */
.drag-cell{cursor:grab;color:var(--silver-dim);text-align:center;user-select:none}
.drag-cell:active{cursor:grabbing}
.admin-table tr[draggable="true"]{transition:background .12s}
.admin-table tr.dragging{opacity:.5;background:rgba(95,224,224,0.08)}
.admin-table tr[draggable="true"]:hover .drag-cell{color:var(--cyan)}

/* ===== 브랜딩 설정: 컬러 입력 & 미리보기 ===== */
.color-input{width:52px;height:40px;padding:2px;border:1px solid var(--glass-brd);border-radius:8px;background:transparent;cursor:pointer}
.brand-preview{margin-top:16px;padding:22px;border-radius:14px;text-align:center;
  background:radial-gradient(120% 140% at 50% 0%, rgba(255,255,255,0.04), rgba(0,0,0,0.25));
  border:1px solid var(--glass-brd)}
.brand-preview .bp-tag{letter-spacing:.42em;font-size:11px;color:var(--acc,var(--cyan));font-weight:700;margin-bottom:8px}
.brand-preview .bp-title{font-family:var(--font-display);font-size:30px;font-weight:600;letter-spacing:.01em;
  background:linear-gradient(180deg,#fff,var(--gold-soft) 70%,var(--gold));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.brand-preview .bp-sub{font-size:13px;color:var(--silver-dim);margin-top:6px}

/* ══════════════════════════════════════════════════════════════
   EDU GUARDIAN ACADEMY — 아카데미(이론/퀴즈/시험/룸) & 수료증
══════════════════════════════════════════════════════════════ */
.glass-dark{background:linear-gradient(180deg,rgba(20,29,56,0.55),rgba(11,16,32,0.6));
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid var(--glass-brd);border-radius:var(--radius);box-shadow:var(--sh-3)}

/* 버튼 보강 */
.btn-gold{background:linear-gradient(135deg,var(--gold-soft),var(--gold) 55%,var(--gold-deep));
  color:#211a06;border:none;font-weight:700;padding:12px 24px;border-radius:var(--radius-sm);
  cursor:pointer;letter-spacing:-.01em;font-size:15px;box-shadow:0 6px 20px rgba(216,182,115,.25);transition:.18s var(--ease)}
.btn-gold:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(216,182,115,.34)}
.btn-gold:disabled{opacity:.55;cursor:default;transform:none}
.btn-gold.lg{padding:15px 30px;font-size:16px;width:100%;justify-content:center;display:inline-flex;align-items:center;gap:8px}
.btn-gold.sm{padding:8px 15px;font-size:13px}
.btn-ghost.sm{padding:8px 14px;font-size:13px}
.btn-cyan{background:linear-gradient(135deg,var(--cyan),var(--cyan-dim));color:#04211f;border:none;font-weight:700}

/* ── 상단바 ── */
.ac-topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;
  padding:12px 22px;background:linear-gradient(180deg,rgba(7,10,20,.92),rgba(7,10,20,.72));
  backdrop-filter:blur(14px);border-bottom:1px solid var(--glass-brd)}
.ac-brand{display:flex;align-items:center;gap:12px;cursor:pointer}
.ac-logo-badge{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--gold-soft),var(--gold-deep));color:#1a1405;font-size:19px;
  box-shadow:0 4px 14px rgba(216,182,115,.3),inset 0 1px 2px rgba(255,255,255,.5)}
.ac-brand-title{font-family:var(--font-display);font-size:19px;font-weight:600;color:var(--ivory);letter-spacing:.01em;line-height:1.15}
.ac-brand-sub{font-size:9.5px;letter-spacing:.28em;color:var(--gold);text-transform:uppercase;margin-top:2px}
.ac-top-actions{display:flex;gap:9px}
.icon-gear{color:var(--silver-dim)}
.icon-gear:hover{color:var(--gold)}

/* ── 허브(개인 룸) ── */
.ac-hub{max-width:1000px;margin:0 auto;padding:28px 20px 70px;position:relative}
.ac-loading{text-align:center;color:var(--silver-dim);padding:70px 0;font-size:15px}
.room-aura{position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(60% 50% at 50% 0%,var(--roomglow,rgba(74,144,217,.25)),transparent 70%);opacity:.7}
.room-hero{position:relative;z-index:1;display:flex;align-items:center;gap:24px;padding:30px 30px;margin-bottom:18px;
  border-color:color-mix(in srgb,var(--room,#4a90d9) 30%,var(--glass-brd))}
.room-rank-badge{width:88px;height:88px;border-radius:22px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:#fff;font-size:34px;box-shadow:0 8px 26px var(--roomglow),inset 0 1px 3px rgba(255,255,255,.4)}
.rank-stars{font-size:11px;margin-top:2px;letter-spacing:1px}
.room-welcome{font-size:13px;color:var(--silver-dim)}
.room-rank-title{font-family:var(--font-display);font-size:34px;font-weight:700;line-height:1.1;margin:2px 0}
.room-rank-en{font-size:13px;color:var(--silver);letter-spacing:.04em}
.room-cert-no{margin-top:8px;font-size:12.5px;color:var(--gold);display:inline-flex;gap:6px;align-items:center}
.room-hint{margin-top:8px;font-size:12.5px;color:var(--silver-dim)}

.room-progress{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:22px;margin-bottom:22px;text-align:center}
.rp-item{display:flex;flex-direction:column;align-items:center;gap:10px}
.rp-ring{--pct:0;width:74px;height:74px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--room,#4a90d9);
  background:conic-gradient(var(--room,#4a90d9) calc(var(--pct)*1%),rgba(255,255,255,.08) 0)}
.rp-ring span{width:56px;height:56px;border-radius:50%;background:var(--obsidian);display:flex;align-items:center;justify-content:center;font-size:15px}
.rp-num{font-size:24px;font-weight:800;font-family:var(--font-display)}
.rp-label{font-size:13px;color:var(--silver);line-height:1.5}
.rp-label small{color:var(--silver-dim);font-size:11px}

/* ── 단계 카드 ── */
.ac-steps{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.step-card{padding:22px;display:flex;flex-direction:column;gap:12px;position:relative;transition:.18s var(--ease)}
.step-card:not(.locked):hover{transform:translateY(-2px);border-color:var(--glass-brd-strong)}
.step-card.locked{opacity:.55}
.step-num{position:absolute;top:16px;right:18px;font-family:var(--font-display);font-size:40px;font-weight:700;color:rgba(255,255,255,.06)}
.step-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:22px;
  background:linear-gradient(135deg,rgba(216,182,115,.2),rgba(216,182,115,.05));color:var(--gold);border:1px solid rgba(216,182,115,.25)}
.step-card h3{font-size:17px;color:var(--ivory);font-weight:700}
.step-body{font-size:13.5px;color:var(--silver);line-height:1.65;flex:1}
.step-status{font-size:12px;color:var(--gold);display:flex;align-items:center;gap:6px}
.step-btn{margin-top:4px;display:inline-flex;align-items:center;justify-content:center;gap:8px}

/* ── 공통 페이지 레이아웃 ── */
.ac-page{max-width:920px;margin:0 auto;padding:26px 20px 80px}
.ac-page-head{display:flex;align-items:center;gap:14px;margin-bottom:22px;flex-wrap:wrap}
.ac-page-title{font-family:var(--font-display);font-size:26px;font-weight:700;color:var(--ivory);display:flex;align-items:center;gap:10px}
.ac-page-title i{color:var(--gold)}
.ac-foot-note{margin-top:24px;font-size:12px;color:var(--silver-dim);text-align:center;line-height:1.6}

/* ── 이론(챕터 목록/본문) ── */
.theory-page{max-width:900px;margin:0 auto}
.chapter-list{display:flex;flex-direction:column;gap:12px}
.chapter-row{display:flex;align-items:center;gap:16px;padding:18px 20px;cursor:pointer;transition:.16s var(--ease)}
.chapter-row:hover{transform:translateX(3px);border-color:var(--glass-brd-strong)}
.chapter-row.passed{border-color:rgba(216,182,115,.35)}
.chapter-idx{width:44px;height:44px;flex:none;border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-size:20px;font-weight:700;background:var(--surface-2);color:var(--gold)}
.chapter-row.passed .chapter-idx{background:linear-gradient(135deg,var(--gold-soft),var(--gold-deep));color:#1a1405}
.chapter-info{flex:1}
.chapter-info h3{font-size:16px;color:var(--ivory);font-weight:700}
.chapter-info p{font-size:12.5px;color:var(--silver-dim);margin-top:3px}
.chapter-tags{display:flex;gap:6px;margin-top:8px}
.ctag{font-size:10.5px;padding:3px 9px;border-radius:var(--radius-pill);background:var(--surface-1);color:var(--silver-dim);border:1px solid var(--glass-brd)}
.ctag.on{background:rgba(216,182,115,.16);color:var(--gold);border-color:rgba(216,182,115,.35)}

.chapter-body{padding:30px 32px;line-height:1.8}
.chapter-body h1,.chapter-body h2,.chapter-body h3{font-family:var(--font-display);color:var(--ivory);margin:22px 0 10px;line-height:1.3}
.chapter-body h1{font-size:26px;color:var(--gold)}
.chapter-body h2{font-size:21px;border-bottom:1px solid var(--glass-brd);padding-bottom:6px}
.chapter-body h3{font-size:17px;color:var(--gold-soft)}
.chapter-body p{font-size:14.5px;color:var(--silver);margin:10px 0}
.chapter-body ul,.chapter-body ol{margin:10px 0 10px 22px;color:var(--silver);font-size:14px}
.chapter-body li{margin:5px 0}
.chapter-body strong{color:var(--ivory)}
.chapter-body blockquote{border-left:3px solid var(--gold);padding:6px 16px;margin:14px 0;background:var(--surface-1);color:var(--silver);border-radius:0 8px 8px 0}
.chapter-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px;flex-wrap:wrap}
.chapter-read{color:var(--gold);font-size:13px;display:inline-flex;align-items:center;gap:7px}
.theory-done{padding:24px;text-align:center;margin-top:18px}
.theory-done i{font-size:34px;color:var(--gold);margin-bottom:10px}

/* ── 문항 카드(퀴즈/시험 공용) ── */
.quiz-page,.exam-page{max-width:820px;margin:0 auto}
.q-card{padding:22px 24px;margin-bottom:14px;transition:.2s var(--ease)}
.q-title{font-size:15.5px;color:var(--ivory);font-weight:600;line-height:1.6;margin-bottom:16px;display:flex;gap:10px}
.q-no{flex:none;background:linear-gradient(135deg,var(--gold-soft),var(--gold-deep));color:#1a1405;font-weight:800;
  border-radius:8px;padding:2px 9px;font-size:13px;height:fit-content}
.q-opts{display:flex;flex-direction:column;gap:9px}
.q-opt{display:flex;align-items:center;gap:12px;padding:13px 15px;border-radius:var(--radius-sm);cursor:pointer;
  background:var(--surface-1);border:1px solid var(--glass-brd);transition:.14s var(--ease)}
.q-opt:hover{background:var(--surface-2);border-color:var(--glass-brd-strong)}
.q-opt input{accent-color:var(--gold);width:16px;height:16px;flex:none}
.q-opt-num{width:24px;height:24px;flex:none;border-radius:6px;background:var(--surface-3);color:var(--silver);
  display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}
.q-opt-text{font-size:14px;color:var(--silver);line-height:1.5}
.q-opt:has(input:checked){background:rgba(216,182,115,.14);border-color:rgba(216,182,115,.5)}
.q-opt:has(input:checked) .q-opt-num{background:var(--gold);color:#1a1405}
.q-opt:has(input:checked) .q-opt-text{color:var(--ivory)}
.q-card.q-correct{border-color:#5bbf7a;box-shadow:0 0 0 1px rgba(91,191,122,.4)}
.q-card.q-wrong{border-color:var(--danger);box-shadow:0 0 0 1px rgba(232,136,140,.4)}
.quiz-submit{display:flex;justify-content:center;margin:18px 0}

/* ── 퀴즈 결과 ── */
.quiz-pass,.quiz-fail{display:flex;align-items:center;gap:16px;padding:22px 24px;margin-top:6px}
.quiz-pass{border-color:rgba(91,191,122,.4)}
.quiz-pass i{font-size:32px;color:#5bbf7a}
.quiz-fail{border-color:rgba(232,136,140,.4)}
.quiz-fail i{font-size:32px;color:var(--danger)}
.quiz-pass b,.quiz-fail b{color:var(--ivory);font-size:16px}
.quiz-pass button,.quiz-fail button{margin-left:auto}

/* ── 시험 헤더/잠금 ── */
.exam-bar{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;margin-bottom:16px;position:sticky;top:66px;z-index:20}
.exam-count{font-size:14px;color:var(--gold);font-weight:700}
.exam-locked{padding:36px;text-align:center}
.exam-locked i{font-size:40px;color:var(--silver-dim);margin-bottom:14px}
.exam-locked h2{color:var(--ivory);margin-bottom:8px}
.exam-locked p{color:var(--silver-dim);font-size:14px;line-height:1.6;margin-bottom:18px}

/* ── 시험 결과 ── */
.exam-result-page{max-width:640px;margin:0 auto;text-align:center}
.exam-result{padding:40px 32px}
.exam-result .er-score{font-family:var(--font-display);font-size:64px;font-weight:800;line-height:1}
.exam-result .er-grade{font-size:26px;font-weight:700;margin:8px 0}
.exam-result .er-en{font-size:14px;color:var(--silver);letter-spacing:.04em;margin-bottom:20px}
.exam-result .er-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:10px}

/* ══════════════════════════════════════════════════════════════
   수료증 신청/입금/발급 화면
══════════════════════════════════════════════════════════════ */
.cert-page{max-width:760px}
.cert-lock{padding:44px 32px;text-align:center}
.cert-lock-ico{font-size:44px;color:var(--silver-dim);margin-bottom:14px}
.cert-lock h2{color:var(--ivory);margin-bottom:10px}
.cert-lock p{color:var(--silver);font-size:14px;line-height:1.7;margin-bottom:22px}
.cert-lock button{margin:0 6px}

.cert-hero{display:flex;align-items:center;gap:20px;padding:26px 28px;margin-bottom:18px;
  border-color:color-mix(in srgb,var(--room,#D4AF37) 30%,var(--glass-brd))}
.cert-hero-badge{width:72px;height:72px;border-radius:18px;flex:none;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:30px;box-shadow:0 8px 24px var(--roomglow),inset 0 1px 3px rgba(255,255,255,.4)}
.cert-hero-eyebrow{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.cert-hero h1{font-family:var(--font-display);font-size:30px;font-weight:700;line-height:1.1}
.cert-hero-en{font-size:13px;color:var(--silver);margin-top:3px}

.cert-apply,.cert-pending,.cert-issued{padding:26px 28px;margin-bottom:16px}
.cert-sec-title{font-size:18px;color:var(--ivory);font-weight:700;display:flex;align-items:center;gap:9px;margin-bottom:8px}
.cert-sec-title i{color:var(--gold)}
.cert-sec-desc{font-size:13px;color:var(--silver-dim);line-height:1.6;margin-bottom:14px}
.cert-fee-tag{display:inline-block;background:rgba(216,182,115,.14);border:1px solid rgba(216,182,115,.35);
  color:var(--gold);padding:7px 15px;border-radius:var(--radius-pill);font-size:13.5px;margin-bottom:18px}
.cert-fee-tag b{font-size:15px}

.cert-form{display:flex;flex-direction:column;gap:14px;margin-bottom:20px}
.cert-form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cert-form label{display:block;font-size:13px;color:var(--silver);font-weight:600}
.cert-form .req{color:var(--gold)}
.cert-form input,.cert-form textarea,.cert-deposit-form input{width:100%;margin-top:6px;padding:11px 14px;
  background:var(--surface-1);border:1px solid var(--glass-brd);border-radius:var(--radius-sm);color:var(--ivory);
  font-size:14px;font-family:inherit;transition:.15s}
.cert-form input:focus,.cert-form textarea:focus,.cert-deposit-form input:focus{outline:none;border-color:var(--gold);background:var(--surface-2)}
.cert-form textarea{resize:vertical;line-height:1.5}

/* 입금 진행 단계 */
.cert-steps{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:4px}
.cert-step{display:flex;flex-direction:column;align-items:center;gap:7px;flex:none;color:var(--silver-dim);font-size:11.5px;text-align:center}
.cert-step-dot{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--surface-2);border:1px solid var(--glass-brd);font-size:13px;font-weight:700}
.cert-step.done{color:var(--gold)}
.cert-step.done .cert-step-dot{background:linear-gradient(135deg,var(--gold-soft),var(--gold-deep));color:#1a1405;border:none}
.cert-step.cur .cert-step-dot{box-shadow:0 0 0 4px rgba(216,182,115,.2)}
.cert-step-line{flex:1;height:2px;background:var(--glass-brd);margin:0 2px;margin-bottom:22px}
.cert-status-line{text-align:center;font-size:14px;color:var(--silver);margin-bottom:18px}
.cert-status-line b{color:var(--gold)}

.cert-bank{background:var(--surface-1);border:1px solid var(--glass-brd);border-radius:var(--radius-sm);padding:20px;margin-bottom:18px}
.cert-bank-title{font-size:15px;color:var(--ivory);font-weight:700;display:flex;align-items:center;gap:8px;margin-bottom:12px}
.cert-bank-title i{color:var(--gold)}
.cert-bank-tbl{width:100%;border-collapse:collapse}
.cert-bank-tbl th{text-align:left;width:90px;padding:8px 0;color:var(--silver-dim);font-size:13px;font-weight:500;vertical-align:top}
.cert-bank-tbl td{padding:8px 0;color:var(--ivory);font-size:14px;font-weight:600}
.cert-bank-tbl td.mono{font-family:'Courier New',monospace;letter-spacing:.02em}
.cert-fee-amt{color:var(--gold)!important;font-size:16px!important}
.copy-btn{background:var(--surface-2);border:1px solid var(--glass-brd);color:var(--silver);border-radius:6px;
  padding:3px 9px;margin-left:8px;cursor:pointer;font-size:12px}
.copy-btn:hover{color:var(--gold);border-color:var(--gold)}
.cert-bank-note{margin-top:12px;font-size:12px;color:var(--silver-dim);line-height:1.6}
.cert-bank-note b{color:var(--gold)}

.cert-deposit-form{display:flex;flex-direction:column;gap:12px}
.cert-deposit-form h4{font-size:15px;color:var(--ivory);display:flex;align-items:center;gap:8px}
.cert-deposit-form h4 i{color:var(--gold)}
.cert-deposit-form label{font-size:13px;color:var(--silver);font-weight:600}
.cert-deposit-form .req{color:var(--gold)}
.cert-wait-note{font-size:13px;color:var(--gold);display:flex;align-items:center;gap:8px;margin-top:4px}
.cert-wait-note.big{font-size:15px;padding:16px;background:rgba(216,182,115,.1);border-radius:var(--radius-sm);justify-content:center}

.cert-issued{text-align:center}
.cert-issued-ico{font-size:48px;color:var(--gold);margin-bottom:12px}
.cert-issued h3{color:var(--ivory);font-size:20px;margin-bottom:8px}
.cert-issued-no{font-size:15px;color:var(--silver);margin-bottom:8px}
.cert-issued-no b{color:var(--gold)}
.cert-issued-desc{font-size:13px;color:var(--silver-dim);line-height:1.6;margin-bottom:20px}

/* ══════════════════════════════════════════════════════════════
   고급 수료증 문서 (Certificate of Qualification) — 인쇄/PDF
══════════════════════════════════════════════════════════════ */
.cert-modal{position:fixed;inset:0;z-index:200;background:rgba(4,6,12,.9);backdrop-filter:blur(6px);
  display:flex;flex-direction:column;animation:fadeIn .2s}
.cert-modal-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;
  background:rgba(7,10,20,.85);border-bottom:1px solid var(--glass-brd);flex:none}
.cert-modal-title{font-family:var(--font-display);color:var(--gold);font-size:16px;letter-spacing:.05em}
.cert-modal-scroll{flex:1;overflow:auto;padding:26px 16px;display:flex;justify-content:center;align-items:flex-start}

/* A4 세로 비율 문서 */
.cert-doc{position:relative;width:100%;max-width:720px;aspect-ratio:1/1.414;
  background:
    radial-gradient(120% 80% at 50% 0%,#fffdf5 0%,#fbf6e6 55%,#f4ecd6 100%);
  color:#2a2416;border-radius:6px;box-shadow:0 30px 80px rgba(0,0,0,.6);
  padding:6.2% 7%;display:flex;flex-direction:column;overflow:hidden;font-family:var(--font-sans)}
.doc-border-outer{position:absolute;inset:2.4%;border:2px solid var(--c-main,#D4AF37);border-radius:4px;pointer-events:none}
.doc-border-inner{position:absolute;inset:6px;border:1px solid color-mix(in srgb,var(--c-main,#D4AF37) 55%,transparent);border-radius:2px}
.doc-guilloche{position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:
    repeating-radial-gradient(circle at 15% 12%,transparent 0 14px,color-mix(in srgb,var(--c-main) 8%,transparent) 14px 15px),
    repeating-radial-gradient(circle at 85% 88%,transparent 0 14px,color-mix(in srgb,var(--c-main) 8%,transparent) 14px 15px)}

.doc-head,.doc-title-wrap,.doc-recipient,.doc-grade,.doc-body,.doc-body-en,.doc-careers,.doc-foot{position:relative;z-index:2}
.doc-head{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;margin-top:4px}

/* 3D 입체 로고 */
.doc-logo-3d{perspective:600px}
.logo-shield{width:88px;height:88px;transform:rotateX(14deg);transform-style:preserve-3d;
  filter:drop-shadow(0 10px 12px rgba(0,0,0,.3))}
.logo-shield-inner{width:100%;height:100%;border-radius:20px 20px 26px 26px/20px 20px 40px 40px;
  background:linear-gradient(150deg,var(--c-light,#f6e7a8) 0%,var(--c-main,#D4AF37) 45%,var(--c-deep,#8a6d1c) 100%);
  box-shadow:inset 0 3px 6px rgba(255,255,255,.7),inset 0 -6px 12px rgba(0,0,0,.28),0 2px 3px rgba(0,0,0,.2);
  display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;position:relative}
.logo-shield-inner i{font-size:34px;text-shadow:0 2px 3px rgba(0,0,0,.35),0 -1px 0 rgba(255,255,255,.4)}
.logo-eg{font-family:var(--font-display);font-weight:800;font-size:16px;letter-spacing:.08em;margin-top:-2px;
  color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.doc-org-ko{font-family:var(--font-display);font-size:20px;font-weight:700;color:#3a3113;letter-spacing:.02em}
.doc-org-en{font-size:9.5px;letter-spacing:.14em;color:#8a7a42;text-transform:uppercase;margin-top:2px}

.doc-title-wrap{text-align:center;margin:3% 0 2%}
.doc-title-en{font-family:var(--font-display);font-size:30px;font-weight:700;letter-spacing:.03em;
  color:var(--c-deep,#8a6d1c)}
.doc-title-ko{font-family:var(--font-serif);font-size:16px;color:#5b4e28;letter-spacing:.35em;margin-top:2px}
.doc-serial{font-size:12px;letter-spacing:.05em;margin-top:8px;font-weight:600}
.doc-serial b{font-size:15px}

.doc-recipient{text-align:center;margin:2% 0}
.doc-name-ko{font-family:var(--font-serif);font-size:30px;font-weight:700;color:#241f12;
  border-bottom:2px solid var(--c-main,#D4AF37);display:inline-block;padding:0 24px 6px;letter-spacing:.06em}
.doc-name-en{font-size:13px;color:#6b5d33;margin-top:6px;letter-spacing:.08em;text-transform:uppercase}

.doc-grade{display:flex;align-items:center;justify-content:center;gap:10px;margin:2.5% 0}
.doc-grade-badge{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:15px;box-shadow:inset 0 1px 2px rgba(255,255,255,.5),0 2px 4px rgba(0,0,0,.2)}
.doc-grade-ko{font-family:var(--font-display);font-size:24px;font-weight:700}
.doc-grade-en{font-size:13px;color:#6b5d33;font-style:italic}

.doc-body{font-size:12.5px;line-height:1.9;color:#3d3520;text-align:center;margin:1.5% 4% 0}
.doc-body b{color:#2a2416}
.doc-body-en{font-size:10px;line-height:1.7;color:#7a6c40;text-align:center;margin:6px 6% 0;font-style:italic}

.doc-careers{margin:3% 4% 0;background:rgba(255,255,255,.4);border:1px solid color-mix(in srgb,var(--c-main) 30%,transparent);
  border-radius:6px;padding:14px 18px}
.doc-careers-title{font-family:var(--font-display);font-size:13px;font-weight:700;color:var(--c-deep,#8a6d1c);
  text-align:center;letter-spacing:.1em;margin-bottom:10px}
.doc-career-row{display:flex;gap:12px;padding:4px 0;font-size:11px;line-height:1.5;border-bottom:1px dotted color-mix(in srgb,var(--c-main) 30%,transparent)}
.doc-career-row:last-child{border-bottom:none}
.doc-career-label{flex:none;width:80px;font-weight:700;color:#5b4e28}
.doc-career-label small{display:block;font-weight:400;font-size:8.5px;color:#9a8a55;text-transform:uppercase}
.doc-career-val{color:#3d3520;flex:1}

.doc-foot{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:10px;padding-top:3%}
.doc-foot-left,.doc-foot-right{flex:1;font-size:10px;line-height:1.5}
.doc-foot-right{text-align:right}
.doc-date{color:#9a8a55;letter-spacing:.08em;text-transform:uppercase;font-size:8.5px}
.doc-date-val{font-family:var(--font-display);font-size:16px;font-weight:700;color:#3a3113;margin-top:2px}
.doc-date-en{color:#8a7a42;font-size:9px}
.doc-issuer-title{color:#9a8a55;letter-spacing:.08em;text-transform:uppercase;font-size:8.5px}
.doc-issuer-en{font-family:var(--font-display);font-size:13px;font-weight:700;color:#3a3113;margin-top:2px;line-height:1.25}
.doc-issuer-loc{color:#8a7a42;font-size:9.5px;margin-top:2px}

.doc-seal{flex:none}
.doc-seal-ring{width:78px;height:78px;border:3px double;border-radius:50%;display:flex;align-items:center;justify-content:center;
  transform:rotate(-8deg);opacity:.9;box-shadow:0 2px 6px rgba(0,0,0,.15)}
.doc-seal-inner{display:flex;flex-direction:column;align-items:center;font-weight:700;gap:1px}
.doc-seal-inner i{font-size:20px}
.seal-top{font-size:11px;letter-spacing:.12em;font-family:var(--font-display)}
.seal-bot{font-size:6.5px;letter-spacing:.14em}

/* 인쇄/PDF: 문서만 남기고 배경/툴바 제거 */
@media print{
  body *{visibility:hidden!important}
  #cert-modal,#cert-modal *{visibility:visible!important}
  .no-print{display:none!important}
  #cert-modal{position:absolute;inset:0;background:#fff;padding:0}
  .cert-modal-scroll{overflow:visible;padding:0;display:block}
  .cert-doc{max-width:100%;width:100%;box-shadow:none;border-radius:0;aspect-ratio:auto;min-height:100vh;
    page-break-after:avoid}
  @page{size:A4 portrait;margin:8mm}
}

/* 반응형 */
@media (max-width:720px){
  .ac-steps{grid-template-columns:1fr}
  .room-hero{flex-direction:column;text-align:center;gap:16px}
  .cert-form-row{grid-template-columns:1fr}
  .room-progress{grid-template-columns:1fr;gap:16px}
}

/* ============================================================
   3단계 · 실기 훈련 (Practical Training)
   ============================================================ */

/* 대상 선택 그리드 */
.practical-page .pt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-top:8px}
.pt-card{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:22px;border-radius:18px;
  text-align:left;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
  border:1px solid var(--glass-brd);position:relative;overflow:hidden}
.pt-card:hover{transform:translateY(-4px);border-color:rgba(216,182,115,.4);box-shadow:0 18px 40px rgba(0,0,0,.4)}
.pt-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,#c0392b,#e07,#c0392b);opacity:.85}
.pt-avatar{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:24px;box-shadow:0 8px 20px rgba(0,0,0,.35);flex:none}
.pt-avatar.sm{width:44px;height:44px;font-size:19px;border-radius:13px}
.pt-card-body{width:100%}
.pt-card-name{font-size:19px;font-weight:800;color:var(--ivory)}
.pt-card-type{font-size:12.5px;color:var(--gold-soft);margin-top:2px;font-weight:600}
.pt-card-desc{font-size:13.5px;color:var(--silver);line-height:1.55;margin-top:10px;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pt-card-go{margin-top:6px;font-size:13px;font-weight:700;color:var(--gold);display:inline-flex;align-items:center;gap:6px}

.pt-guide{margin-top:24px;padding:20px 24px;border-radius:16px}
.pt-guide h3{font-size:15px;color:var(--gold);margin:0 0 10px;display:flex;align-items:center;gap:8px}
.pt-guide ul{margin:0;padding-left:18px;color:var(--silver);font-size:13.5px;line-height:1.9}
.pt-guide b{color:var(--gold-soft)}

/* 실기 대화 화면 */
.pt-chat-page{display:flex;flex-direction:column;gap:12px;max-width:860px;margin:0 auto;
  height:calc(100vh - 78px);padding-bottom:12px}
.pt-chat-head{display:flex;align-items:center;gap:16px;padding:12px 18px;border-radius:16px;flex-wrap:wrap}
.pt-chat-target{display:flex;align-items:center;gap:12px;flex:1;min-width:180px}
.pt-chat-name{font-size:16px;font-weight:800;color:var(--ivory)}
.pt-chat-type{font-size:12px;color:var(--gold-soft);font-weight:600}
.pt-score{display:flex;gap:14px;font-size:14px;font-weight:700}
.pt-score-good{color:#4ade80}.pt-score-bad{color:#f87171}

.pt-scenario{padding:12px 18px;border-radius:14px;font-size:13.5px;color:var(--silver);line-height:1.6}
.pt-scenario i{color:var(--gold);margin-right:6px}
.pt-scenario b{color:var(--gold-soft);margin-right:6px}

.pt-messages{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:14px;padding:8px 4px}
.pt-msg{display:flex;flex-direction:column;max-width:82%}
.pt-msg.user{align-self:flex-end;align-items:flex-end}
.pt-msg.mentor{align-self:flex-start;align-items:flex-start}
.pt-msg.system{align-self:center;max-width:92%}
.pt-msg-who{font-size:11.5px;font-weight:700;color:var(--gold-soft);margin-bottom:4px;padding:0 4px}
.pt-msg.user .pt-msg-who{color:var(--silver)}
.pt-msg-bubble{padding:12px 16px;border-radius:16px;font-size:14.5px;line-height:1.6;white-space:pre-wrap;word-break:break-word}
.pt-msg.mentor .pt-msg-bubble{background:rgba(192,57,43,.14);border:1px solid rgba(224,0,119,.22);color:var(--ivory);border-top-left-radius:5px}
.pt-msg.user .pt-msg-bubble{background:linear-gradient(135deg,var(--gold-deep),var(--gold));color:#1a1206;font-weight:600;border-top-right-radius:5px}
.pt-sys{background:rgba(255,255,255,.05);border:1px dashed var(--glass-brd);color:var(--gold-soft);
  font-size:12.5px;padding:8px 14px;border-radius:12px;text-align:center;font-weight:600}

.pt-composer{display:flex;gap:10px;align-items:flex-end;padding:12px;border-radius:16px}
.pt-composer textarea{flex:1;background:transparent;border:none;outline:none;resize:none;color:var(--ivory);
  font-size:15px;line-height:1.5;max-height:140px;font-family:inherit}
.pt-composer textarea::placeholder{color:rgba(203,210,224,.45)}
.pt-send{width:46px;height:46px;border-radius:12px;flex:none;font-size:16px}

/* 돌발 상황 오버레이 */
.pt-sit-overlay{position:fixed;inset:0;z-index:9000;background:rgba(5,7,16,.82);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;padding:20px;animation:sitIn .25s ease}
@keyframes sitIn{from{opacity:0}to{opacity:1}}
.pt-sit-card{width:100%;max-width:520px;padding:28px;border-radius:22px;text-align:center;
  border:1px solid rgba(224,0,119,.35);box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 60px rgba(224,0,119,.15)}
.pt-sit-loading{font-size:18px;color:var(--gold);font-weight:700;padding:30px 0}
.pt-sit-loading i{margin-right:10px}
.pt-sit-flash{font-size:22px;font-weight:900;color:#ff3d7f;letter-spacing:.03em;
  text-shadow:0 0 18px rgba(255,61,127,.55);animation:flash .8s ease-in-out infinite alternate}
@keyframes flash{from{opacity:.75}to{opacity:1}}
.pt-sit-flash i{margin-right:8px}
.pt-sit-timer{display:flex;flex-direction:column;align-items:center;gap:6px;margin:16px 0}
.pt-sit-ring{width:74px;height:74px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:conic-gradient(#ff3d7f calc(var(--rem)/var(--sec)*100%),rgba(255,255,255,.08) 0);
  position:relative;transition:background .9s linear}
.pt-sit-ring::before{content:'';position:absolute;inset:6px;border-radius:50%;background:var(--obsidian)}
.pt-sit-ring span{position:relative;font-size:30px;font-weight:900;color:var(--ivory)}
.pt-sit-ring span.urgent{color:#ff3d7f;animation:pulse .5s ease-in-out infinite alternate}
@keyframes pulse{from{transform:scale(1)}to{transform:scale(1.18)}}
.pt-sit-timer-label{font-size:12px;color:var(--silver)}
.pt-sit-text{font-size:15.5px;color:var(--ivory);line-height:1.65;margin:8px 0 18px;font-weight:600}
.pt-sit-choices{display:flex;flex-direction:column;gap:10px}
.pt-sit-choice{display:flex;align-items:center;gap:12px;padding:13px 16px;border-radius:13px;text-align:left;
  background:rgba(255,255,255,.05);border:1px solid var(--glass-brd);color:var(--ivory);font-size:14px;
  cursor:pointer;transition:all .15s ease;line-height:1.45}
.pt-sit-choice:hover:not(:disabled){background:rgba(216,182,115,.14);border-color:var(--gold);transform:translateX(3px)}
.pt-sit-choice:disabled{cursor:default;opacity:.85}
.pt-sit-choice-num{width:26px;height:26px;border-radius:8px;background:rgba(255,255,255,.09);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;flex:none;color:var(--gold-soft)}
.pt-sit-choice.correct{background:rgba(74,222,128,.16);border-color:#4ade80}
.pt-sit-choice.correct .pt-sit-choice-num{background:#4ade80;color:#06210f}
.pt-sit-choice.wrong{background:rgba(248,113,113,.16);border-color:#f87171}
.pt-sit-choice.wrong .pt-sit-choice-num{background:#f87171;color:#2a0808}

/* 돌발 상황 결과 */
.pt-sit-result{text-align:center;padding:8px 0}
.pt-sit-result i{font-size:44px;margin-bottom:10px}
.pt-sit-result.good i{color:#4ade80}
.pt-sit-result.bad i{color:#f87171}
.pt-sit-result h3{font-size:19px;font-weight:800;margin:0 0 8px;color:var(--ivory)}
.pt-sit-result.good h3{color:#4ade80}.pt-sit-result.bad h3{color:#f87171}
.pt-sit-result p{font-size:14px;color:var(--gold-soft);font-style:italic;margin:0 0 14px}
.pt-sit-feedback{font-size:13.5px;color:var(--silver);line-height:1.65;background:rgba(255,255,255,.04);
  padding:14px;border-radius:12px;margin-bottom:18px}

@media (max-width:720px){
  .practical-page .pt-grid{grid-template-columns:1fr}
  .pt-chat-page{height:calc(100vh - 64px)}
  .pt-msg{max-width:92%}
}

/* ============================================================
   관리자 콘솔 · 아카데미 운영 UI + 안젤리나 진입 카드
   ============================================================ */

/* 사이드바 섹션 구분 라벨 */
.admin-nav-sec{font-size:10.5px;font-weight:800;letter-spacing:.08em;color:var(--gold,#D8B673);
  opacity:.7;padding:14px 14px 4px;text-transform:uppercase}

/* 문제은행 카드(퀴즈/시험 공용) */
.qbank-row{background:rgba(255,255,255,.04);border:1px solid var(--glass-brd,rgba(255,255,255,.09));
  border-radius:12px;padding:14px 16px;margin-bottom:10px}
.qbank-q{font-size:14px;color:var(--ivory,#f5f2ea);font-weight:600;line-height:1.5;margin-bottom:8px}
.qbank-opts{margin:0;padding-left:22px;color:var(--silver,#cbd2e0);font-size:13px;line-height:1.7}
.qbank-opts li.ans{color:#4ade80;font-weight:700}
.qbank-exp{margin-top:8px;font-size:12px;color:var(--gold-soft,#EBD6A3);background:rgba(216,182,115,.08);
  padding:8px 10px;border-radius:8px;line-height:1.5}
.qbank-tools{display:flex;align-items:center;justify-content:space-between;margin-top:10px;font-size:11.5px}

.badge-ok{background:rgba(74,222,128,.15);color:#4ade80;padding:3px 9px;border-radius:8px;font-size:11.5px;font-weight:700}
.btn-mini.gold{background:linear-gradient(135deg,var(--gold-deep,#b5934f),var(--gold,#D8B673));color:#1a1206;border:none}
.btn-mini.danger{color:#f87171}

/* 실기 대상 관리 그리드 */
.pt-admin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}

/* 토글 스위치 (안젤리나 on/off) */
.switch{position:relative;display:inline-block;width:56px;height:30px}
.switch input{opacity:0;width:0;height:0}
.switch-slider{position:absolute;cursor:pointer;inset:0;background:rgba(255,255,255,.15);
  border-radius:30px;transition:.25s}
.switch-slider::before{content:'';position:absolute;height:22px;width:22px;left:4px;bottom:4px;
  background:#fff;border-radius:50%;transition:.25s}
.switch input:checked + .switch-slider{background:linear-gradient(135deg,#e0507a,#c0392b)}
.switch input:checked + .switch-slider::before{transform:translateX(26px)}

/* 안젤리나 진입 카드 (개인 룸 최종 단계) */
.angelina-entry{display:flex;align-items:center;gap:18px;padding:20px 24px;border-radius:18px;
  margin-top:20px;cursor:pointer;position:relative;overflow:hidden;
  border:1px solid rgba(224,80,122,.3);transition:transform .18s ease,box-shadow .18s ease}
.angelina-entry:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(224,80,122,.2)}
.angelina-entry::before{content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 12% 50%,rgba(224,80,122,.18),transparent 60%);pointer-events:none}
.ang-icon{width:54px;height:54px;border-radius:16px;flex:none;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#e0507a,#8a1f3d);color:#fff;font-size:22px;
  box-shadow:0 8px 24px rgba(224,80,122,.4)}
.ang-body{flex:1;position:relative;z-index:1}
.ang-tag{font-size:10px;font-weight:800;letter-spacing:.1em;color:#e0507a}
.ang-body h3{margin:2px 0 4px;font-size:18px;color:var(--ivory,#f5f2ea);font-weight:800}
.ang-body p{margin:0;font-size:12.5px;color:var(--silver,#cbd2e0);line-height:1.55}
.ang-go{color:#e0507a;font-size:18px;position:relative;z-index:1}

/* ===== Source workspace + Notebook-style Studio ===== */
.source-panel,.studio-panel{background:#f7f8fc!important;color:#1f2937;border-color:#e2e6ef!important}
.angelina-notebook-brand{flex:none;height:62px;display:flex;align-items:center;justify-content:center;padding:0 12px;background:#091124;color:#fff;border-bottom:1px solid rgba(255,255,255,.12);font-size:17px;font-weight:900;letter-spacing:-.02em;white-space:nowrap}
.angelina-notebook-brand span{margin-left:5px;color:#77e6df;font-weight:900}
.source-mentor-stage{flex:none!important;height:420px;min-height:420px;padding:36px 10px 12px!important;background:linear-gradient(180deg,#0b1326 0%,#0a1020 100%);border-bottom:1px solid rgba(255,255,255,.1);overflow:hidden}
.source-mentor-stage .mentor-stage{width:100%;margin:0}
.source-mentor-stage .stage-face{overflow:hidden}
.source-mentor-stage .stage-ring,.source-mentor-stage .stage-glow{pointer-events:none}
.source-mentor-stage .stage-name{color:var(--ivory)}
.source-mentor-stage .stage-field,.source-mentor-stage .stage-status{color:var(--gold-soft)}
.panel-title{height:64px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dde2eb;font-size:19px;font-weight:800;color:#192235}
.panel-title span{display:flex;align-items:center;gap:9px}.panel-title .icon-btn{color:#34405a;border-color:#d7dce6}
.source-add-top{display:inline-flex;align-items:center;gap:6px;border:1px solid #d7dce6;background:#fff;color:#34405a;border-radius:9px;padding:7px 10px;font-size:11px;font-weight:800;cursor:pointer}.source-add-top:hover{border-color:#667eea;color:#4c5fc4}
.labeled-icon-btn{position:relative}
@media(min-width:1100px){.chat-head .labeled-icon-btn{width:auto;min-width:42px;padding:0 10px;gap:6px}.chat-head .labeled-icon-btn::after{content:attr(title);font-size:10px;font-weight:700;white-space:nowrap;color:var(--silver)}}
.icon-btn[title]:focus-visible,.send-btn[title]:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.source-actions{padding:14px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.source-add-btn{display:flex;align-items:center;gap:9px;text-align:left;border:1px solid #dce2ec;background:#fff;color:#28344a;border-radius:12px;padding:11px;cursor:pointer;transition:.15s}
.source-add-btn:hover{border-color:#667eea;box-shadow:0 6px 18px rgba(70,88,150,.12)}.source-add-btn i{color:#5268c9;font-size:18px}.source-add-btn span{font-size:12px;font-weight:800}.source-add-btn small{display:block;font-weight:400;color:#768197;margin-top:2px;font-size:9px}
.source-select-row{display:flex;justify-content:space-between;padding:8px 16px;font-size:12px;color:#596579;border-top:1px solid #e5e8ef;border-bottom:1px solid #e5e8ef}.source-select-row label{display:flex;gap:7px;align-items:center}
.source-list{flex:1;overflow:auto;padding:8px}.source-empty{height:100%;min-height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#8a94a5;line-height:1.6}.source-empty i{font-size:28px;color:#9ba5b6;margin-bottom:10px}.source-empty.error{color:#b42318}
.source-item{display:flex;align-items:center;gap:9px;padding:10px 8px;border:1px solid transparent;border-radius:10px;margin-bottom:5px;background:#fff;color:#263247}.source-item.selected{background:#eef2ff;border-color:#cbd5ff}.source-type{width:22px;text-align:center;color:#6575c8}.source-meta{min-width:0;flex:1}.source-meta b{font-size:11.5px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.source-meta small{font-size:9.5px;color:#8791a2}.source-item input{accent-color:#566be2}.source-delete{border:0;background:none;color:#a1a8b4;cursor:pointer;padding:3px}.source-delete:hover{color:#d34848}
.source-help{padding:11px 14px;border-top:1px solid #e1e5ed;color:#69758b;font-size:10.5px;line-height:1.5}.source-help i{color:#4b68c5;margin-right:5px}
.source-format-help{margin-top:7px;border:0;background:none;color:#455fc5;text-decoration:underline;font-size:9.5px;font-weight:800;cursor:pointer;padding:0}
.studio-panel{padding:0!important;display:flex;flex-direction:column;overflow:auto}.studio-how{margin:12px 16px 6px;padding:11px;border:1px solid #dce3ef;border-radius:12px;background:#f8faff;color:#536176;font-size:9.5px;display:grid;gap:6px}.studio-how>b{font-size:11px;color:#26344d}.studio-how span{display:flex;align-items:center;gap:6px}.studio-how i{width:17px;height:17px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#5d6fce;color:#fff;font-style:normal;font-weight:800}.studio-summary{margin:8px 16px 4px;border:0;border-radius:12px;padding:12px;color:#fff;background:linear-gradient(135deg,#5368d6,#7958c9);font-weight:800;cursor:pointer;display:flex;align-items:center;gap:9px;text-align:left}.studio-summary>i{font-size:17px}.studio-summary span{display:flex;flex-direction:column}.studio-summary small{font-size:9px;font-weight:500;opacity:.84;margin-top:2px}
.studio-grid{padding:10px 16px 14px;display:grid;grid-template-columns:1fr 1fr;gap:9px}.studio-card{min-height:106px;border:2px solid transparent;border-radius:14px;padding:11px;display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:start;text-align:left;cursor:pointer;color:#26344d;transition:.16s}.studio-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(39,50,85,.14)}.studio-card.active{border-color:#6575d5;box-shadow:0 0 0 3px rgba(101,117,213,.12)}.studio-card>i{font-size:17px;margin-top:2px}.studio-card>span{min-width:0;display:flex;flex-direction:column}.studio-card>span>b{font-size:11.5px;line-height:1.2}.studio-card>span>small{font-size:9px;line-height:1.35;color:#667085;margin-top:4px}.studio-card>span>em{font-size:8.5px;font-style:normal;font-weight:800;color:#5363a8;margin-top:7px}.studio-card>strong{font-size:20px;font-weight:400;opacity:.65}
.studio-blue{background:#e9edff}.studio-olive{background:#ecece2}.studio-green{background:#e3f3e9}.studio-purple{background:#f0e8f4}.studio-cream{background:#f4f2e8}.studio-red{background:#f8eaea}.studio-cyan{background:#e1f3f8}.studio-violet{background:#f1e8f2}.studio-indigo{background:#e7ecfa}
.studio-output-hint{margin:auto 16px 18px;padding:24px 10px;text-align:center;border-top:1px solid #dde2eb;color:#626e82}.studio-output-hint>i{display:block;font-size:28px;margin-bottom:10px;color:#7b8290}.studio-output-hint b{font-size:13px;color:#2d3748}.studio-output-hint p{font-size:10.5px;line-height:1.55;margin-top:6px}
.studio-action-panel{margin:0 16px 16px;padding:15px;border:1px dashed #cbd3e3;border-radius:14px;background:#fafbfe;color:#657087;text-align:center}.studio-action-panel>i{font-size:20px;color:#7583c8}.studio-action-panel>p{font-size:9.5px;line-height:1.5;margin-top:5px}.studio-action-head{display:flex;align-items:center;gap:10px;text-align:left}.studio-action-head>i{width:34px;height:34px;border-radius:10px;background:#e9edff;color:#576bc8;display:flex;align-items:center;justify-content:center}.studio-action-head span{display:flex;flex-direction:column}.studio-action-head b{font-size:13px;color:#29364d}.studio-action-head small{font-size:9.5px;margin-top:2px}.studio-uses{display:flex;gap:5px;flex-wrap:wrap;margin:11px 0}.studio-uses span{font-size:8.5px;background:#edf1f8;color:#526078;padding:5px 7px;border-radius:20px}.studio-plan-btn{width:100%;justify-content:center}.studio-media-step{margin-top:12px;padding-top:12px;border-top:1px solid #e0e5ee;text-align:left}.studio-media-step>b{display:block;font-size:11px;color:#344158}.studio-media-step>b small{font-size:8px;font-weight:500;color:#8a6177}.studio-media-step label{display:block;font-size:9px;font-weight:800;margin-top:8px}.studio-media-step .select,.studio-media-step .input{width:100%;margin-top:4px;background:#fff;color:#273449;border:1px solid #d9dfea}.studio-media-step .fal-generate-btn{margin-top:10px}.studio-result-title{display:flex;gap:10px;align-items:center;margin-bottom:9px}.studio-result-title>i{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:rgba(99,102,241,.16);color:#a5b4fc}.studio-result-title span{display:flex;flex-direction:column}.studio-result-title small{font-size:9px;color:var(--silver-dim)}.studio-result-title b{font-size:15px;color:var(--ivory)}.studio-result-badges{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}.studio-result-badges span{font-size:9px;padding:4px 7px;border-radius:20px;background:rgba(255,255,255,.08);color:var(--silver)}.studio-generated-text{white-space:pre-wrap;line-height:1.75;color:var(--silver);font-size:13px}.studio-result-media{margin-top:14px}.studio-error{display:grid;gap:8px}.studio-error>i{color:#fca5a5;font-size:24px}.studio-error p{color:#fca5a5}
.fal-studio-box{margin:0 16px 16px;padding:14px;border:1px solid #ead7e4;border-radius:16px;background:linear-gradient(145deg,#fff8fc,#f7f4ff);color:#334155}.fal-studio-title{display:flex;gap:10px;align-items:center;margin-bottom:12px}.fal-studio-title>i{color:#c0267d;font-size:20px}.fal-studio-title span{display:flex;flex-direction:column}.fal-studio-title b{font-size:13px}.fal-studio-title small{font-size:10px;color:#718096;margin-top:2px}.fal-studio-box label{display:block;font-size:10px;font-weight:800;color:#64748b;margin-top:9px}.fal-studio-box .select,.fal-studio-box .input{width:100%;margin-top:5px;background:#fff;color:#273449;border:1px solid #d9dfea}.fal-cost-note{font-size:9.5px;line-height:1.45;color:#8a5b72;margin:10px 0}.fal-generate-btn{width:100%;justify-content:center}.fal-media{margin:12px 0;padding:10px;border:1px solid rgba(255,255,255,.14);border-radius:14px;background:rgba(0,0,0,.14)}.fal-media img,.fal-media video{display:block;width:100%;max-height:520px;object-fit:contain;border-radius:10px;background:#07101f}.fal-media audio{display:block;width:100%}.fal-media a{display:inline-flex;margin-top:9px;color:var(--cyan);font-size:12px;font-weight:700}
.msg.error .msg-content{color:#fca5a5}
.chat-step-kicker{display:inline-flex;align-items:center;border:1px solid rgba(87,216,255,.34);background:rgba(87,216,255,.1);color:var(--cyan);border-radius:999px;padding:6px 11px;font-size:12px;font-weight:800;letter-spacing:.02em;margin-top:16px}
.chat-flow-guide{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:16px auto 0;color:var(--muted);font-size:12px}.chat-flow-guide span{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.1);padding:7px 10px;border-radius:10px}.chat-flow-guide b{display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:var(--cyan);color:#06222a;font-size:11px}.chat-flow-guide i{font-size:10px;color:rgba(255,255,255,.35)}
@media(max-width:1100px){.studio-grid{grid-template-columns:1fr}.studio-card{min-height:76px}}