:root {
  --bg:#f4f7fb;
  --surface:#ffffff;
  --ink:#0b1633;
  --muted:#64728b;
  --line:#e2e9f4;
  --blue:#1457ff;
  --blue2:#4c7dff;
  --mint:#23c7a5;
  --mint-soft:#def8f2;
  --soft:#f8fbff;
  --warning:#ff8a3d;
  --danger:#ef3e54;
  --shadow:0 10px 30px rgba(25, 52, 98, .08), 0 2px 8px rgba(25, 52, 98, .05);
  --shadow-soft:0 4px 14px rgba(25, 52, 98, .06);
  --radius:16px;
  --transition:all .18s ease;
}
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:'Pretendard Variable', Pretendard, 'Noto Sans KR', -apple-system, 'Segoe UI', 'Malgun Gothic', sans-serif; line-height:1.6; -webkit-font-smoothing:antialiased; }
a, button { transition:var(--transition); }
:focus-visible { outline:3px solid rgba(20,87,255,.35); outline-offset:2px; border-radius:6px; }
a { color:inherit; text-decoration:none; }
button, input, select { font:inherit; }
.site-shell { width:min(1440px, calc(100% - 56px)); margin:18px auto; background:var(--surface); border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow); overflow:hidden; }
.site-header { min-height:76px; display:flex; align-items:center; gap:24px; padding:0 32px; border-bottom:1px solid var(--line); background:rgba(255,255,255,.94); position:sticky; top:0; z-index:10; }
.brand { display:inline-flex; align-items:center; gap:9px; font-weight:900; color:var(--blue); }
.brand.compact { gap:7px; }
.brand-mark { width:30px; height:30px; border-radius:11px; display:inline-grid; place-items:center; background:linear-gradient(135deg, var(--blue), var(--mint)); color:#fff; font-size:12px; letter-spacing:0; }
.brand-name { font-size:20px; letter-spacing:0; }
.brand-sub { color:#273653; font-weight:700; font-size:14px; white-space:nowrap; }
.top-nav { margin-left:auto; display:flex; align-items:center; gap:26px; font-weight:800; font-size:14px; color:#17244a; }
.top-nav a { min-height:76px; display:inline-flex; align-items:center; border-bottom:3px solid transparent; }
.top-nav a.active { color:var(--blue); border-bottom-color:var(--blue); }
.start-button, .primary-button { min-height:44px; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; padding:0 22px; color:#fff; background:linear-gradient(135deg, var(--blue), var(--blue2)); box-shadow:0 8px 18px rgba(20,87,255,.22); border:0; font-weight:900; cursor:pointer; }
.start-button:hover, .primary-button:hover { transform:translateY(-1px); box-shadow:0 12px 24px rgba(20,87,255,.28); }
.locker-chip { display:inline-flex; align-items:center; min-height:36px; border-radius:999px; padding:0 14px; border:1px solid #b9c9e6; background:#fff; color:#1c2b54; font-weight:800; font-size:13px; white-space:nowrap; }
.locker-chip:hover { border-color:var(--blue); color:var(--blue); }
.locker-chip.open { border-color:#41c8a7; background:#effcf8; color:#078b62; }
.profile-menu { position:relative; display:inline-flex; align-items:center; }
.profile-button { min-height:42px; display:inline-flex; align-items:center; gap:9px; border:1px solid #cfe0ff; background:#f8fbff; color:#1c2b54; border-radius:999px; padding:4px 10px 4px 5px; font-weight:900; cursor:pointer; white-space:nowrap; }
.profile-button.open { border-color:#41c8a7; background:#f2fffb; }
.profile-avatar { width:32px; height:32px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(135deg,var(--blue),var(--mint)); color:#fff; font-size:12px; font-weight:900; letter-spacing:0; flex-shrink:0; }
.profile-avatar.large { width:44px; height:44px; font-size:15px; }
.profile-button-text { display:grid; gap:0; text-align:left; line-height:1.15; }
.profile-button-text small, .profile-dropdown small { color:#64728b; font-size:11px; font-weight:800; }
.profile-dropdown { position:absolute; top:calc(100% + 10px); right:0; width:300px; border:1px solid #dbe7f8; border-radius:16px; background:#fff; box-shadow:0 18px 42px rgba(25,52,98,.14); padding:10px; opacity:0; transform:translateY(-6px); pointer-events:none; z-index:50; }
.profile-menu:hover .profile-dropdown, .profile-menu:focus-within .profile-dropdown { opacity:1; transform:translateY(0); pointer-events:auto; }
.profile-dropdown::before { content:''; position:absolute; top:-12px; right:16px; width:100px; height:12px; }
.profile-dropdown-head { display:flex; align-items:center; gap:10px; padding:8px 8px 12px; border-bottom:1px solid #edf2f8; margin-bottom:6px; }
.profile-dropdown-head div { display:grid; line-height:1.25; }
.profile-storage-line { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:6px 4px 8px; border:1px solid #e6eef8; background:#f8fbff; border-radius:12px; padding:9px 10px; font-size:12px; color:#64728b; }
.profile-storage-line strong { color:#0b1633; font-variant-numeric:tabular-nums; }
.profile-dropdown a, .profile-logout-form button { width:100%; min-height:38px; display:flex; align-items:center; border-radius:10px; padding:0 10px; color:#1c2b54; font-weight:900; font-size:14px; background:#fff; border:0; cursor:pointer; text-align:left; }
.profile-dropdown a:hover, .profile-logout-form button:hover { background:#f4f8ff; color:var(--blue); }
.profile-logout-form { margin:8px 0 0; padding-top:8px; border-top:1px solid #edf2f8; }
.auth-gate-card { max-width:960px; margin:24px auto 0; border:1px solid #dbe7f8; background:linear-gradient(160deg,#fff,#f7fbff); border-radius:20px; box-shadow:var(--shadow-soft); padding:28px; display:grid; gap:18px; }
.auth-gate-copy { display:flex; gap:18px; align-items:center; min-width:0; }
.auth-gate-character { width:118px; height:118px; object-fit:contain; flex-shrink:0; }
.auth-gate-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; }
.profile-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:18px; }
.profile-summary-tile { border:1px solid var(--line); border-radius:14px; background:#fff; padding:15px; box-shadow:var(--shadow-soft); display:grid; gap:4px; }
.profile-summary-tile span { color:var(--muted); font-size:12px; font-weight:900; }
.profile-summary-tile strong { color:var(--ink); font-size:24px; }
.profile-panel-grid { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:18px; align-items:start; }
.profile-list { display:grid; gap:10px; }
.profile-list-row { display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid #e6eef8; background:#fbfdff; border-radius:12px; padding:12px 14px; }
.profile-list-row span { color:var(--muted); font-size:13px; font-weight:800; }
.profile-list-row strong { color:var(--ink); text-align:right; }
.convert-card { border-color:#bdebdc; background:linear-gradient(160deg,#f2fffb,#fff); }
@media (max-width:1100px) { .profile-button-text { display:none; } .profile-dropdown { right:-8px; } }
@media (max-width:720px) { .profile-menu { margin-left:auto; } .profile-dropdown { width:min(320px, calc(100vw - 24px)); right:0; } .auth-gate-copy { align-items:flex-start; } .auth-gate-character { width:82px; height:82px; } .auth-gate-actions, .auth-gate-actions .primary-button, .auth-gate-actions .secondary-button { width:100%; } .profile-summary-grid, .profile-panel-grid { grid-template-columns:1fr; } }
.secondary-button { min-height:44px; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; padding:0 20px; background:#fff; border:1px solid #b9c9e6; color:#1c2b54; font-weight:900; cursor:pointer; }
.secondary-button:hover { border-color:var(--blue); color:var(--blue); background:#f7faff; }
.page-main { padding:32px 38px 28px; }
.eyebrow { display:inline-flex; min-height:28px; align-items:center; border-radius:999px; padding:4px 13px; background:var(--mint-soft); color:#058a75; font-weight:900; font-size:13px; margin:0 0 14px; }
.hero-grid { display:grid; grid-template-columns:minmax(0, 1.1fr) minmax(380px, .9fr); gap:32px; align-items:center; }
.hero-copy h1, .page-title { margin:0; color:var(--ink); letter-spacing:0; line-height:1.15; font-size:48px; }
.hero-copy h1 strong, .accent { color:var(--blue); }
.hero-copy h1 em { color:#03a892; font-style:normal; }
.lead { max-width:620px; margin:18px 0 0; color:#3b4a66; font-size:17px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.dashboard-preview { position:relative; min-height:360px; border-radius:22px; padding:28px; background:linear-gradient(140deg, #f6fbff, #ffffff 55%, #eaf8f6); border:1px solid var(--line); overflow:hidden; }
.dashboard-preview::after { content:''; position:absolute; width:260px; height:260px; right:-48px; bottom:-76px; background:#dbeaff; border-radius:48% 52% 42% 58%; opacity:.85; }
.floating-panel { position:relative; z-index:1; background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); padding:18px; }
.metric-row, .feature-grid, .quick-grid, .program-grid, .content-grid, .report-grid { display:grid; gap:16px; }
.metric-row { grid-template-columns:repeat(3, 1fr); margin-top:16px; }
.metric-mini { border:1px solid var(--line); border-radius:14px; padding:16px; background:#fff; }
.metric-mini strong { display:block; font-size:28px; margin-top:8px; }
.muted { color:var(--muted); }
.section { margin-top:30px; }
.section-head { display:flex; justify-content:space-between; gap:16px; align-items:end; margin-bottom:14px; }
.section-head h2 { margin:0; font-size:22px; }
.feature-grid { grid-template-columns:repeat(5, 1fr); }
.feature-card, .card, .program-card, .resource-card { border:1px solid var(--line); border-radius:var(--radius); background:#fff; padding:18px; box-shadow:var(--shadow-soft); transition:var(--transition); }
a.feature-card:hover, a.card:hover, .program-card:hover, .resource-card:hover { transform:translateY(-2px); box-shadow:var(--shadow); border-color:#c8d8f2; }
.feature-icon { width:54px; height:54px; border-radius:14px; display:grid; place-items:center; background:linear-gradient(135deg, #4dd6c6, #1457ff); color:#fff; font-weight:900; margin-bottom:14px; }
.card-title { margin:0 0 8px; font-size:18px; }
.stat-card { min-height:118px; }
.asset-slot { min-height:150px; border-radius:16px; border:1px dashed #bad0eb; background:linear-gradient(135deg,#eef7ff,#f7fffd); display:grid; place-items:center; text-align:center; color:#42607e; font-weight:900; overflow:hidden; }
.asset-slot small { display:block; font-size:12px; margin-top:4px; color:#7890aa; }
.asset-image { display:block; width:100%; min-height:150px; object-fit:cover; border-radius:16px; }
.trust-strip { display:grid; grid-template-columns:repeat(4, 1fr); gap:0; border:1px solid var(--line); border-radius:16px; overflow:hidden; background:#f8fbff; }
.trust-item { padding:18px; border-right:1px solid var(--line); }
.trust-item:last-child { border-right:0; }
.mobile-tabbar { display:none; }
.page-kicker { max-width:640px; color:#3d4c68; margin:10px 0 0; }
.two-col { display:grid; grid-template-columns:minmax(0, 1.4fr) 360px; gap:22px; align-items:start; }
.check-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:26px 0; }
.step-card { border:1px solid var(--line); border-radius:14px; padding:18px; background:#fff; display:flex; gap:12px; align-items:flex-start; }
.step-no { width:26px; height:26px; border-radius:50%; display:grid; place-items:center; background:var(--blue); color:#fff; font-weight:900; }
.choice-row { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; }
.choice-tile { min-height:92px; border:1px solid var(--line); border-radius:14px; background:#fff; display:grid; place-items:center; cursor:pointer; }
.choice-tile.active { border-color:var(--blue); box-shadow:0 0 0 3px rgba(20,87,255,.10); }
.choice-face { font-size:34px; line-height:1; }
.range-card input[type=range] { width:100%; accent-color:var(--blue); }
.result-orb { width:134px; height:134px; border-radius:50%; margin:0 auto; display:grid; place-items:center; background:radial-gradient(#fff 35%, #9bf2d6 36%, #41c8a7 70%, #e9fff8 71%); color:#0f7b67; font-size:24px; font-weight:900; }
.program-grid { grid-template-columns:repeat(4, 1fr); }
.program-cover { height:112px; margin:-18px -18px 14px; border-radius:16px 16px 0 0; }
.tag { display:inline-flex; align-items:center; flex-shrink:0; white-space:nowrap; border-radius:999px; min-height:24px; padding:2px 9px; background:#eaf2ff; color:var(--blue); font-size:12px; font-weight:900; }
.signal-badge { display:inline-flex; align-items:center; flex-shrink:0; border-radius:999px; padding:2px 10px; font-size:12px; font-weight:900; white-space:nowrap; }
.signal-badge.danger { background:#ffe7ea; color:#c22440; }
.signal-badge.warn { background:#fff3dc; color:#a36a00; }
.signal-badge.good { background:#e3f8f2; color:#078b62; }
.signal-badge.soft { background:#eef2f8; color:#53647f; }
.calendar-card { display:grid; gap:10px; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:8px; text-align:center; font-size:13px; }
.calendar-grid span { min-height:30px; display:grid; place-items:center; border-radius:50%; }
.calendar-grid .today { background:var(--blue); color:#fff; }
.resource-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:22px; }
.search-box { display:flex; max-width:470px; border:1px solid var(--line); border-radius:13px; padding:12px 14px; background:#fff; }
.search-box input { border:0; outline:0; flex:1; }
.report-bars { display:grid; gap:12px; }
.bar-row { display:grid; grid-template-columns:90px 1fr 42px; align-items:center; gap:10px; }
.bar { height:12px; background:#e9eef7; border-radius:999px; overflow:hidden; }
.bar i { display:block; height:100%; background:linear-gradient(90deg,#53d2b2,#ffd873,#ff7b6d); }
.chat-shell { display:grid; grid-template-columns:300px minmax(0,1fr) 280px; gap:20px; align-items:start; }
.message-card { border:1px solid var(--line); border-radius:16px; padding:18px; background:#fff; min-height:520px; display:grid; grid-template-rows:auto 1fr auto; grid-template-columns:minmax(0,1fr); }
.chat-stream { display:grid; gap:12px; align-content:start; padding:16px 0; }
.bubble { max-width:78%; border:1px solid var(--line); border-radius:18px 18px 18px 6px; padding:13px 16px; background:linear-gradient(160deg, #f7fbff, #ffffff); box-shadow:0 2px 8px rgba(25,52,98,.05); font-size:15px; }
.bubble.user { justify-self:end; background:linear-gradient(135deg, var(--blue), var(--blue2)); color:#fff; border-color:transparent; border-radius:18px 18px 6px 18px; box-shadow:0 4px 12px rgba(20,87,255,.22); }
.bubble.subtle { font-size:13px; color:#65758f; background:#f5f8fc; border-style:dashed; box-shadow:none; }
.chat-input { display:flex; gap:10px; border:1px solid var(--line); border-radius:14px; padding:10px; }
.chat-input input { border:0; outline:0; flex:1; }
@media (max-width:1100px) {
  .site-shell { width:100%; min-height:100vh; margin:0; border-radius:0; }
  .site-header { padding:0 18px; }
  .brand-sub, .top-nav { display:none; }
  .hero-grid, .two-col, .resource-layout, .chat-shell { grid-template-columns:1fr; }
  .feature-grid, .program-grid, .report-grid, .metric-row { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:720px) {
  body { background:#fff; }
  .site-shell { padding-bottom:74px; border:0; }
  .site-header { min-height:64px; }
  .start-button { display:none; }
  .page-main { padding:22px 16px; }
  .hero-copy h1, .page-title { font-size:30px; }
  .lead { font-size:15px; }
  .dashboard-preview { min-height:0; padding:16px; }
  .feature-grid, .program-grid, .report-grid, .metric-row, .check-steps, .choice-row, .trust-strip { grid-template-columns:1fr; }
  .choice-row { grid-template-columns:repeat(3,1fr); }
  .section-head { align-items:start; flex-direction:column; }
  .site-footer { display:none; }
  .mobile-tabbar { position:fixed; left:0; right:0; bottom:0; display:grid; grid-template-columns:repeat(4,1fr); gap:0; min-height:66px; border-top:1px solid var(--line); background:#fff; z-index:30; }
  .mobile-tabbar a { display:grid; place-items:center; font-size:12px; font-weight:900; color:#53647f; }
  .mobile-tabbar a.active { color:var(--blue); }
  .page-main { padding-bottom:88px; }
  .locker-chip { display:none; }
}
.site-footer { padding:16px 32px 18px; border-top:1px solid var(--line); color:#65758f; font-size:13px; }
.site-footer .footer-links { display:flex; flex-wrap:wrap; align-items:center; gap:10px 24px; }
.site-footer .footer-policy { margin:10px 0 0; font-size:12px; color:#8794a8; }
.site-footer .songpa-mark { margin-left:auto; color:#078b62; font-size:20px; font-weight:900; }
.simple-list { display:grid; gap:10px; }
.simple-list p { margin:0; }
.voice-button { width:46px; min-width:46px; height:46px; border-radius:50%; border:1px solid #b9c9e6; background:#fff; color:var(--blue); font-weight:900; cursor:pointer; }
.voice-button.listening { background:var(--blue); color:#fff; box-shadow:0 0 0 5px rgba(20,87,255,.12); }
.voice-hint { margin:8px 0 0; font-size:13px; color:var(--muted); }
.audio-program-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.audio-card { border:1px solid var(--line); border-radius:16px; background:#fff; padding:18px; box-shadow:0 8px 24px rgba(32,57,101,.05); }
.audio-card audio { width:100%; margin-top:12px; }
.empty-state { border:1px dashed #bad0eb; border-radius:16px; background:#f8fbff; padding:22px; color:#42607e; }
.activity-list { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.activity-card { min-height:136px; }
@media (max-width:1100px) {
  .audio-program-grid, .activity-list { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:720px) {
  .chat-shell > section, .chat-shell > aside, .chat-shell > div { min-width:0; }
  .chat-input { align-items:center; }
  .chat-input input { min-width:0; }
  .chat-input .voice-button, .chat-input .chat-submit-button { flex-shrink:0; }
  .audio-program-grid, .activity-list { grid-template-columns:1fr; }
  .report-grid[style], .content-grid[style], .program-grid[style] { grid-template-columns:1fr !important; }
  .quick-grid[style], .message-card .report-grid { grid-template-columns:1fr !important; }
}
button.audio-card { text-align:left; cursor:pointer; color:inherit; }
button.audio-card.active { border-color:var(--blue); box-shadow:0 0 0 4px rgba(20,87,255,.10); }
.voice-conversation-form { align-items:center; }
.voice-conversation-form .voice-button { width:auto; min-width:86px; padding:0 15px; border-radius:999px; }
.voice-conversation-form .voice-button.listening { min-width:94px; }
.sr-only { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }

.fitmind-visual { display:block; width:100%; height:auto; object-fit:cover; }
.visual-story { border-top:1px solid var(--line); padding-top:26px; }
.visual-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.visual-grid.compact { grid-template-columns:repeat(6,1fr); }
.visual-card { border:1px solid var(--line); border-radius:16px; background:#fff; padding:14px; box-shadow:0 8px 24px rgba(32,57,101,.05); overflow:hidden; }
.visual-card > img { height:132px; border-radius:12px; margin-bottom:12px; background:#f5f8fd; }
.visual-card h3 { margin:0 0 6px; font-size:17px; }
.visual-card p { margin:0; }
.visual-card.horizontal { display:grid; grid-template-columns:128px minmax(0,1fr); gap:14px; align-items:center; }
.visual-card.horizontal > img { height:118px; margin:0; }
.visual-pair { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.side-visual { height:170px; border-radius:16px; margin:18px 0 6px; background:#f5f8fd; }
.wide-visual { max-height:260px; border-radius:18px; margin:0 0 16px; background:#f5f8fd; }
.ai-counsel-visual { margin-top:14px; }
.nature-visual { margin-bottom:16px; }
@media (max-width:1100px) {
  .visual-grid, .visual-grid.compact { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:720px) {
  .visual-grid, .visual-grid.compact, .visual-pair { grid-template-columns:1fr; }
  .visual-card.horizontal { grid-template-columns:92px minmax(0,1fr); }
  .visual-card.horizontal > img { height:92px; }
  .visual-card > img { height:150px; }
  .side-visual { height:150px; }
}

.dashboard-preview > .asset-image, .floating-panel .asset-image { height:100%; max-height:320px; }

/* FITMIND UX refinement */
.fitmind-icon-image { display:block; width:100%; height:100%; object-fit:contain; }
.fitmind-line-icon { display:inline-grid; place-items:center; width:100%; height:100%; border-radius:inherit; color:var(--blue); background:linear-gradient(135deg, #f8fbff, #eef4ff); }
.fitmind-line-icon svg { width:72%; height:72%; overflow:visible; }
.fitmind-line-icon svg * { fill:none; stroke:currentColor; stroke-width:2.8; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.fitmind-line-icon-chat, .fitmind-line-icon-mic { color:#1457ff; background:linear-gradient(135deg, #f7fbff, #e8f0ff); }
.fitmind-line-icon-recover { color:#078b62; background:linear-gradient(135deg, #f5fffb, #e3f8f2); }
.fitmind-line-icon-record { color:#5b4bc4; background:linear-gradient(135deg, #fbf9ff, #efedff); }
.fitmind-line-icon-expert { color:#0f7f95; background:linear-gradient(135deg, #f3fcff, #e5f7fb); }
.fitmind-line-icon-report { color:#ad6418; background:linear-gradient(135deg, #fffaf4, #fff0dc); }
.fitmind-line-icon-privacy { color:#0d6d5f; background:linear-gradient(135deg, #f5fffb, #e7f5f1); }
.feature-icon.image-icon, .feature-icon.line-icon { background:#f4f8ff; border:1px solid var(--line); overflow:hidden; padding:7px; }
.feature-icon.image-icon .fitmind-icon-image, .feature-icon.line-icon .fitmind-line-icon { border-radius:12px; }
.home-hero .floating-panel { min-height:320px; }
.mini-dashboard { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:16px; align-items:center; margin-top:18px; padding:16px; border:1px solid var(--line); border-radius:16px; background:#f8fbff; }
.mini-chart { display:grid; gap:12px; }
.mini-line { height:86px; display:flex; align-items:end; gap:9px; padding:10px; border-radius:14px; background:#fff; border:1px solid var(--line); }
.mini-line i { width:100%; min-height:18px; border-radius:999px 999px 4px 4px; background:linear-gradient(180deg, var(--blue2), var(--mint)); }
.icon-cluster { width:148px; display:grid; grid-template-columns:repeat(2, 1fr); gap:10px; }
.icon-cluster .fitmind-icon-image, .icon-cluster .fitmind-line-icon { aspect-ratio:1; border-radius:14px; background:#fff; border:1px solid var(--line); padding:6px; }
.icon-flow-grid { align-items:stretch; }
.icon-flow-card { min-height:188px; display:flex; flex-direction:column; align-items:flex-start; }
.visual-card.icon-flow-card > img.fitmind-icon-image, .visual-card.icon-flow-card > .fitmind-line-icon { width:72px; height:72px; margin:0 0 12px; border-radius:16px; background:#f5f8fd; padding:6px; }
.care-card { overflow:hidden; }
.care-balance-panel { display:grid; grid-template-columns:104px minmax(0,1fr); gap:18px; align-items:center; }
.care-main-icon { width:104px; height:104px; border-radius:24px; border:1px solid var(--line); background:#f5f8fd; padding:10px; }
.trust-strip.single-column .trust-item { border-right:0; border-bottom:1px solid var(--line); }
.trust-strip.single-column .trust-item:last-child { border-bottom:0; }
.choice-tile { padding:12px 8px; gap:6px; grid-template-rows:auto auto auto; }
.choice-symbol { width:52px; height:52px; border-radius:16px; background:#f5f8fd; display:grid; place-items:center; overflow:hidden; }
.choice-symbol .fitmind-icon-image { padding:4px; }
.choice-face { font-size:20px; font-weight:900; line-height:1.1; }
.choice-tile small { color:#354766; font-weight:800; }
.conversation-mode-panel { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; margin:0 0 14px; }
.mode-option { border:1px solid var(--line); border-radius:16px; background:#fff; padding:16px; text-align:left; cursor:pointer; color:var(--ink); display:grid; gap:6px; min-height:92px; }
.mode-option strong { font-size:16px; }
.mode-option span { color:var(--muted); font-size:13px; }
.mode-option.active { border-color:var(--blue); box-shadow:0 0 0 4px rgba(20,87,255,.10); }
.voice-conversation-form.voice-mode .chat-submit-button, .chat-submit-button[hidden] { display:none !important; }
.voice-conversation-form.chat-mode .voice-button { display:inline-flex; }
.bubble.assistant { background:#fff; }
.program-card { min-height:360px; display:flex; flex-direction:column; gap:8px; }
.program-card h3 { margin:4px 0 0; min-height:54px; display:flex; align-items:center; }
.program-card p { margin:0 0 12px; }
.program-card .program-apply { margin-top:auto; }
.asset-image.program-cover { height:156px; min-height:156px; object-fit:contain; object-position:center; background:#fff; padding:8px; }
.program-selection-notice { border:1px solid var(--line); border-radius:14px; background:#f8fbff; padding:14px 16px; margin-bottom:16px; color:#314562; font-weight:800; }
.program-selection-notice.active { border-color:var(--blue); background:#eef5ff; color:#123c9f; }
.schedule-actions .schedule-time.active { box-shadow:0 0 0 4px rgba(20,87,255,.10); }
.activity-card { display:grid; grid-template-columns:58px minmax(0,1fr); column-gap:12px; align-items:start; }
.activity-card .activity-icon { grid-row:1 / span 3; width:58px; height:58px; border-radius:16px; background:#f5f8fd; border:1px solid var(--line); padding:5px; }
.activity-card h3 { margin:0; }
.activity-card p { margin:2px 0 10px; }
.resource-search-box { align-items:center; gap:10px; }
.resource-search-box button { border:0; background:var(--blue); color:#fff; border-radius:9px; min-height:36px; padding:0 14px; font-weight:900; cursor:pointer; }
.resource-card { display:flex; flex-direction:column; gap:8px; }
.resource-card .asset-image { height:160px; min-height:160px; object-fit:cover; }
.resource-card .resource-save { margin-top:auto; }
.resource-card[hidden], .empty-state[hidden] { display:none !important; }
.report-grid.org-stat-grid { grid-template-columns:repeat(6, minmax(0,1fr)); }
.report-download-card { min-height:auto; }
@media (max-width:1100px) {
  .mini-dashboard { grid-template-columns:1fr; }
  .icon-cluster { width:100%; grid-template-columns:repeat(4, 1fr); }
  .conversation-mode-panel { grid-template-columns:1fr; }
  .report-grid.org-stat-grid { grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:720px) {
  .care-balance-panel { grid-template-columns:76px minmax(0,1fr); }
  .care-main-icon { width:76px; height:76px; border-radius:18px; }
  .icon-cluster { grid-template-columns:repeat(4, 1fr); }
  .choice-symbol { width:44px; height:44px; }
  .choice-face { font-size:17px; }
  .mode-option { min-height:auto; }
  .program-card { min-height:auto; }
  .asset-image.program-cover { height:138px; min-height:138px; }
  .activity-card { grid-template-columns:48px minmax(0,1fr); }
  .activity-card .activity-icon { width:48px; height:48px; }
  .report-grid.org-stat-grid { grid-template-columns:1fr; }
}
/* FITMIND music player refinement */
.music-guide { border:1px solid var(--line); border-radius:14px; background:#f8fbff; padding:14px 16px; margin-bottom:14px; }
.fitmind-music-player { border:1px solid var(--line); border-radius:18px; background:linear-gradient(135deg, #ffffff 0%, #f6fbff 52%, #eefdf9 100%); box-shadow:0 14px 36px rgba(32,57,101,.08); padding:20px; display:grid; gap:18px; }
.fitmind-music-player.empty { background:linear-gradient(135deg, #ffffff 0%, #f8fbff 62%, #f3fff9 100%); }
.music-now { display:grid; grid-template-columns:96px minmax(0,1fr); gap:18px; align-items:center; }
.music-art { width:96px; height:96px; border-radius:24px; border:1px solid var(--line); background:#fff; padding:10px; box-shadow:0 10px 24px rgba(20,87,255,.08); }
.music-now-copy h3 { margin:8px 0 4px; font-size:24px; }
.music-controls { display:grid; grid-template-columns:auto minmax(180px,1fr) 170px 170px; gap:14px; align-items:center; }
.music-play-button { min-width:84px; min-height:52px; border-radius:999px; border:0; background:var(--blue); color:#fff; font-weight:900; box-shadow:0 12px 24px rgba(20,87,255,.18); cursor:pointer; }
.music-play-button:disabled { background:#d8e3f2; color:#6c7b92; box-shadow:none; cursor:not-allowed; }
.music-play-button.active { background:#0f8f78; }
.music-progress-wrap { display:grid; gap:6px; }
.music-progress-wrap input[type=range], .music-volume input[type=range] { width:100%; accent-color:var(--blue); }
.music-time { display:flex; justify-content:space-between; color:var(--muted); font-size:12px; font-weight:800; }
.music-volume, .music-timer { display:grid; gap:6px; color:#273653; font-size:13px; font-weight:900; }
.music-timer select { min-height:38px; border:1px solid var(--line); border-radius:10px; padding:0 10px; background:#fff; color:var(--ink); }
.music-empty-actions { display:flex; flex-wrap:wrap; gap:10px; }
.music-empty-actions .active { border-color:var(--blue); box-shadow:0 0 0 4px rgba(20,87,255,.10); }
.music-queue { display:grid; gap:10px; }
.music-track { border:1px solid var(--line); border-radius:14px; background:#fff; padding:14px; text-align:left; color:var(--ink); cursor:pointer; display:grid; gap:4px; }
.music-track strong { font-size:16px; }
.music-track span { color:var(--muted); }
.music-track small { color:var(--blue); font-weight:900; }
.music-track.active { border-color:var(--blue); box-shadow:0 0 0 4px rgba(20,87,255,.10); }
.summary-refresh-button { min-height:34px; border-radius:999px; border:1px solid #b9c9e6; background:#fff; color:var(--blue); padding:0 12px; font-weight:900; cursor:pointer; }
.summary-refresh-button:hover { box-shadow:0 0 0 4px rgba(20,87,255,.08); }
@media (max-width:1100px) {
  .music-controls { grid-template-columns:auto minmax(0,1fr); }
  .music-volume, .music-timer { grid-column:span 1; }
}
@media (max-width:720px) {
  .music-now { grid-template-columns:72px minmax(0,1fr); }
  .music-art { width:72px; height:72px; border-radius:18px; }
  .music-now-copy h3 { font-size:19px; }
  .music-controls { grid-template-columns:1fr; }
  .music-play-button { width:100%; }
}

/* FITMIND nature sound refinement */
.nature-program { scroll-margin-top:96px; }
.nature-program-panel { display:grid; grid-template-columns:minmax(0, .92fr) minmax(360px, 1.08fr); gap:18px; align-items:stretch; border:1px solid var(--line); border-radius:20px; background:linear-gradient(135deg, #ffffff 0%, #f6fbff 56%, #eefdf7 100%); padding:20px; box-shadow:0 14px 34px rgba(32,57,101,.07); }
.nature-copy { display:flex; flex-direction:column; justify-content:center; gap:10px; min-height:250px; }
.nature-copy h2 { margin:0; font-size:32px; line-height:1.18; }
.nature-feature-list { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }
.nature-feature-list span { min-height:30px; display:inline-flex; align-items:center; border:1px solid #cce2f4; border-radius:999px; padding:0 12px; background:#fff; color:#284066; font-size:13px; font-weight:900; }
.nature-player-card { display:grid; grid-template-columns:minmax(190px, .9fr) minmax(0,1fr); gap:16px; align-items:center; border:1px solid rgba(186,208,235,.85); border-radius:18px; background:rgba(255,255,255,.82); padding:14px; overflow:hidden; }
.nature-visual-wrap { position:relative; min-height:220px; border-radius:16px; overflow:hidden; background:#f5f8fd; }
.nature-hero-image { width:100%; height:100%; min-height:220px; object-fit:cover; margin:0; border-radius:16px; }
.nature-visual-wrap .asset-slot.nature-hero-image { min-height:220px; height:100%; }
.nature-wave { position:absolute; left:18px; bottom:18px; display:flex; gap:6px; align-items:end; min-height:42px; padding:8px 10px; border-radius:999px; background:rgba(255,255,255,.78); border:1px solid rgba(220,230,243,.9); }
.nature-wave span { width:8px; height:18px; border-radius:999px; background:linear-gradient(180deg, var(--mint), var(--blue2)); opacity:.42; }
.nature-wave.playing span { animation:naturePulse 980ms ease-in-out infinite; opacity:.95; }
.nature-wave.playing span:nth-child(2) { animation-delay:140ms; }
.nature-wave.playing span:nth-child(3) { animation-delay:280ms; }
@keyframes naturePulse { 0%, 100% { height:16px; } 50% { height:36px; } }
.nature-now h3 { margin:10px 0 6px; font-size:24px; }
.nature-control-bar { display:grid; grid-template-columns:auto minmax(180px, 1fr) auto; gap:14px; align-items:center; margin-top:16px; border:1px solid var(--line); border-radius:16px; background:#fff; padding:14px; }
.nature-volume { display:grid; gap:6px; color:#273653; font-size:13px; font-weight:900; }
.nature-volume input[type=range] { width:100%; accent-color:var(--mint); }
.nature-timer-group { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.nature-timer { min-height:36px; border:1px solid #b9c9e6; border-radius:999px; background:#fff; color:#1c2b54; padding:0 12px; font-weight:900; cursor:pointer; }
.nature-timer.active { border-color:var(--blue); color:var(--blue); box-shadow:0 0 0 4px rgba(20,87,255,.08); }
.nature-sound-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; margin-top:16px; }
.nature-sound-card { position:relative; min-height:230px; display:flex; flex-direction:column; gap:8px; overflow:hidden; }
.nature-sound-card::after { content:''; position:absolute; inset:auto -36px -46px auto; width:130px; height:130px; border-radius:50%; background:rgba(35,199,165,.10); pointer-events:none; }
.nature-sound-card .tag { align-self:flex-start; }
.nature-sound-card h3 { margin:4px 0 0; font-size:22px; }
.nature-sound-card p { margin:0; }
.nature-sound-card small { margin-top:auto; color:#40536f; font-weight:800; }
.nature-sound-icon { width:64px; height:64px; border-radius:18px; background:#f5f8fd; border:1px solid var(--line); padding:6px; display:grid; place-items:center; }
button.nature-sound-card.active { border-color:var(--mint); box-shadow:0 0 0 4px rgba(35,199,165,.12), 0 14px 30px rgba(32,57,101,.08); }
.nature-status { min-height:24px; padding-left:2px; }
@media (max-width:1100px) {
  .nature-program-panel { grid-template-columns:1fr; }
  .nature-player-card { grid-template-columns:minmax(180px, .8fr) minmax(0,1fr); }
  .nature-control-bar { grid-template-columns:1fr; }
  .nature-timer-group { justify-content:flex-start; }
}
@media (max-width:720px) {
  .nature-program-panel { padding:14px; border-radius:16px; }
  .nature-copy { min-height:auto; }
  .nature-copy h2 { font-size:24px; }
  .nature-player-card { grid-template-columns:1fr; }
  .nature-visual-wrap, .nature-hero-image { min-height:180px; }
  .nature-sound-grid { grid-template-columns:1fr; }
  .nature-sound-card { min-height:0; }
}
/* ===== 마음돌봄 대화: 단일 집중 레이아웃 (2026-07 UX 고도화) ===== */
.chat-page { max-width:820px; margin:0 auto; display:grid; gap:14px; }
.chat-topbar { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.chat-title { display:flex; align-items:center; gap:14px; }
.chat-title h1 { margin:0; font-size:26px; letter-spacing:-0.3px; }
.chat-title p { margin:2px 0 0; font-size:13px; }
.chat-avatar { width:54px; height:54px; border-radius:18px; overflow:hidden; flex-shrink:0; background:linear-gradient(135deg,#e8f1ff,#e3f8f2); display:grid; place-items:center; box-shadow:var(--shadow-soft); }
.chat-avatar-img { width:100%; height:100%; object-fit:cover; }
.mode-toggle { display:inline-flex; border:1px solid var(--line); border-radius:999px; padding:4px; background:#fff; box-shadow:var(--shadow-soft); }
.mode-chip { border:0; background:transparent; border-radius:999px; min-height:36px; padding:0 18px; font-weight:800; font-size:14px; color:#53647f; cursor:pointer; }
.mode-chip.active { background:linear-gradient(135deg, var(--blue), var(--blue2)); color:#fff; box-shadow:0 4px 10px rgba(20,87,255,.25); }
.chat-note { border:1px solid #cfe0d9; background:#f2fbf7; border-radius:12px; padding:12px 16px; font-size:14px; }
.chat-note.danger { border-color:#ffd0d6; background:#fff5f6; }
.chat-panel { border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:var(--shadow); padding:20px; display:grid; gap:12px; grid-template-columns:minmax(0,1fr); }
.chat-panel .chat-stream { padding:4px 0 10px; min-height:280px; max-height:52vh; overflow-y:auto; }
.start-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }
.start-chips form { display:inline; }
.start-chip { border:1px solid #c7d8f5; background:#f4f8ff; color:#1c3f9e; border-radius:999px; min-height:38px; padding:6px 16px; font-weight:800; font-size:14px; cursor:pointer; }
.start-chip:hover { background:#e8f0ff; border-color:var(--blue); }
.chat-progress { font-size:13px; margin:0; }
.signal-strip { border:1px solid #e6ecf7; border-radius:14px; background:#f8fbff; padding:10px 14px; }
.signal-strip summary { cursor:pointer; font-weight:800; font-size:14px; }
.signal-strip summary .muted { font-weight:500; font-size:12px; margin-left:6px; }
.signal-strip.in-report { background:#fbfdff; margin-top:12px; }
.signal-rows { display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; }
.signal-row { display:flex; align-items:center; gap:8px; font-size:14px; }
.signal-row.detail { width:100%; align-items:flex-start; padding:8px 0; border-bottom:1px solid #edf1f8; }
.signal-row.detail p { margin:2px 0 0; font-size:13px; }
.chat-end-row { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; border-top:1px dashed var(--line); padding-top:14px; }
.save-toggle { display:flex; align-items:center; gap:8px; font-size:14px; font-weight:700; flex-wrap:wrap; }
.save-toggle .muted { font-weight:500; font-size:12px; }
.save-hint { margin:0; font-size:13px; }
.save-hint a { color:var(--blue); font-weight:800; }
.chat-footnote { text-align:center; font-size:13px; margin:2px 0 0; }

/* 종료 리포트 카드 */
.report-card { border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:var(--shadow); padding:24px; }
.crisis-banner { border:1px solid #ffd0d6; background:#fff5f6; border-radius:14px; padding:16px 18px; margin-bottom:16px; }
.crisis-banner h3 { margin:0 0 6px; }
.crisis-banner p { margin:4px 0; }
.report-lead { font-size:17px; font-weight:800; margin:8px 0 14px; }
.report-trio { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; }
.report-cell { border:1px solid #e9eef8; border-radius:14px; background:#fbfdff; padding:14px; }
.report-cell h3 { margin:0 0 6px; font-size:14px; }
.report-cell p { margin:0; font-size:13px; }
.rec-block { margin-top:14px; }
.rec-block h3 { margin:0 0 10px; font-size:15px; }
.rec-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:10px; }
.rec-card { display:grid; gap:4px; border:1px solid #d8e6d9; border-radius:14px; background:#f6fdf9; padding:14px; }
.rec-card:hover { border-color:var(--mint); transform:translateY(-2px); box-shadow:var(--shadow-soft); }
.rec-card strong { font-size:14px; }
.rec-card .muted { font-size:12px; }
.report-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.expert-line { border:1px solid #cfeee4; background:#f0fffa; border-radius:14px; padding:14px 16px; margin-top:14px; }
.expert-line p { margin:4px 0 0; font-size:13px; }

@media (max-width:720px) {
  .chat-title h1 { font-size:22px; }
  .chat-avatar { width:46px; height:46px; }
  .chat-panel { padding:14px; border-radius:18px; }
  .chat-panel .chat-stream { max-height:none; min-height:200px; }
  .report-trio { grid-template-columns:1fr; }
  .report-card { padding:18px; border-radius:18px; }
  .chat-end-row { flex-direction:column; align-items:stretch; }
  .chat-end-row .secondary-button { width:100%; }
}

/* ===== 대화 인트로 + UI 아이콘 + 전문기관 안내 (2026-07 2차 고도화) ===== */
.ui-icon { width:18px; height:18px; flex-shrink:0; }
.mode-chip, .chat-input .voice-button, .chat-submit-button { display:inline-flex; align-items:center; justify-content:center; gap:6px; }

.chat-intro { border:1px solid var(--line); border-radius:22px; background:linear-gradient(165deg, #f6fbff, #ffffff 55%, #effcf8); box-shadow:var(--shadow); padding:40px 24px 32px; text-align:center; display:grid; gap:14px; justify-items:center; }
.chat-intro .intro-avatar { width:96px; height:96px; border-radius:28px; overflow:hidden; background:#fff; box-shadow:var(--shadow-soft); }
.chat-intro .intro-avatar-img { width:100%; height:100%; object-fit:cover; display:block; }
.chat-intro h2 { margin:0; font-size:24px; letter-spacing:-0.3px; }
.chat-intro h2 strong { color:var(--blue); }
.chat-intro .intro-lead { max-width:440px; margin:0; }
.chat-intro .intro-points { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.chat-intro .intro-points span { border:1px solid #cfe6df; background:#f2fbf7; color:#0a7a5c; border-radius:999px; padding:4px 13px; font-size:13px; font-weight:800; }
.chat-intro .intro-start { min-width:220px; min-height:52px; font-size:16px; }
.chat-intro .intro-chips { justify-content:center; margin-top:0; }

.hotline-card { display:grid; align-content:start; }
.hotline-tel { font-size:26px; font-weight:900; color:var(--blue); letter-spacing:1px; display:block; margin-top:10px; }
.badge-status { display:inline-flex; align-items:center; border-radius:999px; padding:2px 10px; font-size:12px; font-weight:900; background:#e3f8f2; color:#078b62; white-space:nowrap; }
.badge-status.pending { background:#fff3dc; color:#a36a00; }
.org-card { display:grid; align-content:start; }
.org-contact { margin:12px 0 0; font-size:13px; font-weight:800; color:#1c3f9e; background:#f4f8ff; border:1px solid #d7e5fb; border-radius:10px; padding:9px 12px; }

@media (max-width:1100px) {
  .feature-grid[style] { grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:720px) {
  .feature-grid[style] { grid-template-columns:1fr !important; }
  .chat-submit-button .btn-label { display:none; }
  .chat-submit-button { padding:0 14px; }
  .chat-intro { padding:32px 18px 26px; border-radius:18px; }
  .chat-intro h2 { font-size:21px; }
  .chat-intro .intro-avatar { width:84px; height:84px; }
  .chat-intro .intro-start { width:100%; }
  .hotline-tel { font-size:24px; }
}

/* 마음돌봄 대화 안의 마음일기 */
.care-choice-grid { width:100%; max-width:640px; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; margin-top:2px; }
.care-choice-card { min-height:122px; border:1px solid #c9d9f4; border-radius:16px; background:linear-gradient(135deg,#f7fbff 0%,#eaf2ff 100%); color:var(--ink); padding:16px; display:grid; grid-template-columns:46px minmax(0,1fr); grid-template-rows:auto auto; gap:6px 12px; align-items:center; text-align:left; box-shadow:0 10px 24px rgba(20,87,255,.11); cursor:pointer; }
.care-choice-card:nth-child(2) { border-color:#bde9da; background:linear-gradient(135deg,#f4fffb 0%,#e4f8f1 100%); box-shadow:0 10px 24px rgba(15,143,120,.11); }
.care-choice-card:hover { transform:translateY(-2px); border-color:#8fb4f1; box-shadow:0 16px 32px rgba(20,87,255,.18); }
.care-choice-card:nth-child(2):hover { border-color:#6fd0b8; box-shadow:0 16px 32px rgba(15,143,120,.18); }
.care-choice-card strong { font-size:15px; line-height:1.35; }
.care-choice-card .muted { grid-column:2; font-size:12px; line-height:1.45; }
.care-choice-icon { grid-row:1 / span 2; width:46px; height:46px; border-radius:14px; display:grid; place-items:center; border:1px solid #bcd2fb; background:linear-gradient(135deg,#ffffff,#dfeaff); color:var(--blue); box-shadow:inset 0 1px 0 rgba(255,255,255,.86), 0 8px 16px rgba(20,87,255,.14); }
.care-choice-card:nth-child(2) .care-choice-icon { border-color:#a7decf; background:linear-gradient(135deg,#ffffff,#d9f5ed); color:#0f8f78; box-shadow:inset 0 1px 0 rgba(255,255,255,.86), 0 8px 16px rgba(15,143,120,.14); }
.care-choice-icon .ui-icon { width:22px; height:22px; }
.care-choice-card:first-child .care-choice-icon .ui-icon { animation:careIconFloat 1.9s ease-in-out infinite; }
.care-choice-card:nth-child(2) .care-choice-icon .ui-icon { animation:careIconSpin 2.4s linear infinite; }
@keyframes careIconFloat {
  0%, 100% { transform:translateY(0) scale(1); }
  50% { transform:translateY(-3px) scale(1.05); }
}
@keyframes careIconSpin {
  to { transform:rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  .care-choice-card .care-choice-icon .ui-icon { animation:none !important; }
}
.care-diary-panel { scroll-margin-top:96px; border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:var(--shadow); padding:22px; display:grid; gap:18px; }
.standalone-diary-panel { position:relative; overflow:hidden; border-color:#d7e3f5; background:linear-gradient(90deg,rgba(47,107,255,.08) 0 46px, transparent 46px), repeating-linear-gradient(to bottom,#fffdf8 0 37px,#edf4ff 38px), #fffdf8; padding:28px 28px 28px 70px; box-shadow:0 20px 44px rgba(22,48,91,.14); }
.standalone-diary-panel::before { content:''; position:absolute; left:46px; top:0; bottom:0; width:2px; background:#b8cdf3; }
.standalone-diary-panel::after { content:''; position:absolute; left:17px; top:30px; width:14px; height:14px; border-radius:50%; background:#fff; border:2px solid #b8cdf3; box-shadow:0 52px 0 -2px #fff, 0 52px 0 0 #b8cdf3, 0 104px 0 -2px #fff, 0 104px 0 0 #b8cdf3, 0 156px 0 -2px #fff, 0 156px 0 0 #b8cdf3, 0 208px 0 -2px #fff, 0 208px 0 0 #b8cdf3; }
.standalone-diary-panel .section-head, .standalone-diary-panel .care-diary-form, .standalone-diary-panel .care-diary-list, .standalone-diary-panel .care-diary-actions { position:relative; z-index:1; }
.standalone-diary-panel .section-head h2 { font-size:24px; }
.standalone-diary-panel .care-diary-form input, .standalone-diary-panel .care-diary-form textarea { background:rgba(255,255,255,.78); border-color:#c7d8f1; box-shadow:inset 0 1px 0 rgba(255,255,255,.8); }
.standalone-diary-panel .care-diary-form textarea { min-height:170px; line-height:1.75; }
.care-diary-form { display:grid; gap:10px; }
.care-diary-form label { font-size:13px; font-weight:900; color:#102247; }
.care-diary-form input, .care-diary-form textarea { width:100%; border:1px solid #d8e4f3; border-radius:12px; background:#fbfdff; color:var(--ink); font:inherit; padding:13px 14px; outline:0; }
.care-diary-form input:focus, .care-diary-form textarea:focus { border-color:var(--blue); box-shadow:0 0 0 4px rgba(20,87,255,.08); background:#fff; }
.care-diary-form textarea { min-height:132px; resize:vertical; }
.care-diary-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.care-diary-actions .secondary-button, .care-diary-actions .primary-button { gap:7px; }
.care-diary-actions .listening { border-color:var(--blue); color:#fff; background:var(--blue); box-shadow:0 0 0 5px rgba(20,87,255,.12); }
.care-diary-list { border-top:1px dashed var(--line); padding-top:16px; display:grid; gap:12px; }
.section-head.compact { align-items:center; margin-bottom:0; }
.section-head.compact h3 { margin:0; font-size:16px; }
.diary-all-link { min-height:36px; display:inline-flex; align-items:center; gap:8px; border:1px solid #cfe0fb; border-radius:999px; background:linear-gradient(135deg,#f8fbff,#eef5ff); color:var(--blue); padding:0 14px; font-size:13px; font-weight:900; box-shadow:0 8px 18px rgba(20,87,255,.10); }
.diary-all-link::before { content:''; width:8px; height:8px; border-radius:50%; background:var(--blue); box-shadow:0 0 0 4px rgba(20,87,255,.10); }
.diary-all-link::after { content:'›'; font-size:18px; line-height:1; transform:translateY(-1px); transition:transform .18s ease; }
.diary-all-link:hover { border-color:#9dbdf6; background:linear-gradient(135deg,#f2f7ff,#e4eeff); transform:translateY(-1px); box-shadow:0 12px 22px rgba(20,87,255,.16); }
.diary-all-link:hover::after { transform:translate(2px, -1px); }
.diary-reply-item { border:1px solid #e4edf8; border-radius:14px; background:#fbfdff; padding:14px; display:grid; gap:8px; }
.diary-reply-meta { display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:12px; color:#61718b; }
.diary-reply-meta span, .diary-reply-meta strong { min-height:24px; display:inline-flex; align-items:center; border-radius:999px; padding:2px 9px; background:#eef4fb; }
.diary-reply-meta strong.ready { background:#e3f8f2; color:#078b62; }
.diary-reply-meta strong.pending { background:#fff3dc; color:#a36a00; }
.diary-body-preview { margin:0; color:#1d2d4c; font-size:14px; }
.diary-reply-box { border:1px solid #cceee2; border-radius:12px; background:#f4fffb; padding:12px 14px; }
.diary-reply-box strong { color:#067a63; font-size:13px; }
.diary-reply-box p { margin:6px 0 0; white-space:pre-line; color:#17324a; font-size:14px; }
.diary-waiting { margin:0; font-size:13px; }
@media (max-width:720px) {
  .care-choice-grid { grid-template-columns:1fr; max-width:100%; }
  .care-choice-card { min-height:auto; }
  .care-diary-panel { padding:18px; border-radius:18px; }
  .standalone-diary-panel { background:linear-gradient(90deg,rgba(47,107,255,.08) 0 18px, transparent 18px), repeating-linear-gradient(to bottom,#fffdf8 0 39px,#edf4ff 40px), #fffdf8; padding:22px 16px 22px 30px; }
  .standalone-diary-panel::before { left:18px; opacity:.75; }
  .standalone-diary-panel::after { display:none; }
  .standalone-diary-panel .section-head { display:grid; gap:10px; }
  .standalone-diary-panel .section-head h2 { font-size:22px; }
  .care-diary-actions { align-items:stretch; }
  .care-diary-actions .secondary-button, .care-diary-actions .primary-button { width:100%; }
  .section-head.compact { align-items:flex-start; }
}
/* 공용 알약 탭 (programs 등) */
.pill-tabs { display:flex; gap:8px; border:1px solid var(--line); border-radius:999px; padding:4px; background:#fff; width:fit-content; max-width:100%; overflow-x:auto; box-shadow:var(--shadow-soft); margin:20px 0 18px; }
.pill-tabs .tab-btn { border:0; background:transparent; color:#53647f; border-radius:999px; min-height:42px; padding:0 20px; font-weight:800; font-size:14px; cursor:pointer; white-space:nowrap; flex-shrink:0; }
.pill-tabs .tab-btn.active { background:linear-gradient(135deg, var(--blue), var(--blue2)); color:#fff; box-shadow:0 4px 10px rgba(20,87,255,.25); }
@media (max-width:720px) {
  .pill-tabs { width:100%; }
  .pill-tabs .tab-btn { min-height:40px; padding:0 16px; }
}

/* 전문기관 디렉토리 + 홈 프로모 밴드 */
.dir-controls { display:flex; gap:14px; align-items:center; flex-wrap:wrap; margin-bottom:16px; }
.dir-grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; }
.dir-card { display:flex; gap:14px; align-items:flex-start; border:1px solid var(--line); border-radius:14px; background:#fff; padding:16px; box-shadow:var(--shadow-soft); transition:var(--transition); }
.dir-card:hover { transform:translateY(-2px); box-shadow:var(--shadow); border-color:#c8d8f2; }
.dir-avatar { width:52px; height:52px; border-radius:16px; display:grid; place-items:center; font-size:20px; font-weight:900; flex-shrink:0; }
.dir-avatar.photo { object-fit:cover; }
.dir-body { min-width:0; }
.dir-tags { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:6px; }
.dir-body h3 { margin:0 0 4px; font-size:15px; }
.dir-body p { margin:0; font-size:13px; }
.dir-tel { display:inline-flex; align-items:center; gap:4px; margin-top:8px; font-size:13px; font-weight:800; color:var(--blue); background:#f4f8ff; border:1px solid #d7e5fb; border-radius:999px; padding:4px 12px; }
.dir-tel:hover { background:#e8f0ff; }

.support-band { display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; border-radius:20px; padding:30px 34px; background:linear-gradient(120deg, #0e2a66, #1457ff 58%, #1b8f7c); color:#fff; box-shadow:var(--shadow); }
.support-band h2 { margin:0 0 8px; color:#fff; font-size:24px; }
.support-band p { margin:0; color:rgba(255,255,255,.88); font-size:14px; max-width:600px; }
.support-band-button { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 24px; border-radius:12px; background:#fff; color:#0e2a66; font-weight:900; box-shadow:0 6px 16px rgba(0,0,0,.18); }
.support-band-button:hover { transform:translateY(-1px); }

@media (max-width:1100px) {
  .dir-grid { grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:720px) {
  .dir-grid { grid-template-columns:1fr; }
  .dir-controls { align-items:stretch; flex-direction:column; }
  .support-band { padding:24px 20px; }
}

/* ===== 홈 히어로 비주얼 컴포지션 + 지표 밴드 (2026-07 메인 고도화) ===== */
.hero-visual { position:relative; min-height:400px; }
.hv-main { position:absolute; inset:24px 36px; border-radius:30px; background:linear-gradient(150deg, #e9f2ff, #f6fbff 45%, #e3f8f2); border:1px solid var(--line); box-shadow:var(--shadow); display:grid; place-items:center; overflow:hidden; }
.hv-main::after { content:''; position:absolute; width:280px; height:280px; right:-70px; bottom:-90px; background:rgba(76,125,255,.14); border-radius:48% 52% 42% 58%; }
.hv-main-img { width:min(66%, 280px); position:relative; z-index:1; filter:drop-shadow(0 18px 30px rgba(25,52,98,.18)); animation:charBob 6.5s ease-in-out infinite; }
.hv-card { position:absolute; background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); padding:12px 14px; z-index:2; will-change:transform; }
.hv-card p { margin:2px 0 0; font-size:12px; color:var(--muted); }
.hv-card strong { font-size:13px; display:block; }
/* 구름처럼 상하좌우로 천천히 떠다니는 3개 카드(각기 다른 궤적·속도) */
.hv-chat { top:6px; right:0; display:flex; gap:10px; align-items:center; max-width:250px; animation:cloudA 9s ease-in-out infinite; }
.hv-avatar { width:36px; height:36px; border-radius:12px; overflow:hidden; flex-shrink:0; background:#eef4ff; display:block; }
.hv-avatar-img { width:100%; height:100%; object-fit:cover; }
.hv-signal { left:-6px; top:44%; display:grid; gap:6px; justify-items:start; animation:cloudB 11s ease-in-out infinite; }
.hv-report { right:10px; bottom:0; max-width:240px; display:grid; gap:4px; justify-items:start; animation:cloudC 10s ease-in-out infinite; }
@keyframes charBob { 0%,100% { transform:translate(0,0) rotate(0); } 50% { transform:translate(-4px,-12px) rotate(-1.2deg); } }
@keyframes cloudA {
  0%   { transform:translate(0,0) rotate(0); }
  25%  { transform:translate(14px,-16px) rotate(1.2deg); }
  50%  { transform:translate(-8px,-26px) rotate(-1deg); }
  75%  { transform:translate(-16px,-10px) rotate(0.8deg); }
  100% { transform:translate(0,0) rotate(0); }
}
@keyframes cloudB {
  0%   { transform:translate(0,0) rotate(0); }
  30%  { transform:translate(-18px,14px) rotate(-1.4deg); }
  55%  { transform:translate(10px,24px) rotate(1deg); }
  80%  { transform:translate(16px,8px) rotate(-0.6deg); }
  100% { transform:translate(0,0) rotate(0); }
}
@keyframes cloudC {
  0%   { transform:translate(0,0) rotate(0); }
  25%  { transform:translate(-14px,16px) rotate(1deg); }
  50%  { transform:translate(12px,26px) rotate(-1.2deg); }
  75%  { transform:translate(18px,10px) rotate(0.8deg); }
  100% { transform:translate(0,0) rotate(0); }
}

.hero-copy, .hero-visual { animation:riseIn .6s ease both; }
.hero-visual { animation-delay:.12s; }
@keyframes riseIn { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:translateY(0); } }

.stats-band { display:grid; grid-template-columns:repeat(4, 1fr); gap:0; margin-top:34px; border:1px solid var(--line); border-radius:18px; background:linear-gradient(120deg, #f8fbff, #ffffff 60%, #f5fffb); overflow:hidden; }
.stat-item { padding:20px 24px; border-right:1px solid var(--line); display:grid; gap:2px; }
.stat-item:last-child { border-right:0; }
.stat-item strong { font-size:28px; letter-spacing:-0.5px; color:var(--blue); }
.stat-item span { font-size:13px; color:var(--muted); font-weight:600; }

@media (prefers-reduced-motion: reduce) {
  .hv-card, .hero-copy, .hero-visual { animation:none !important; }
}
@media (max-width:1100px) {
  .hero-visual { min-height:340px; }
  .stats-band { grid-template-columns:repeat(2, 1fr); }
  .stat-item:nth-child(2) { border-right:0; }
  .stat-item:nth-child(-n+2) { border-bottom:1px solid var(--line); }
}
@media (max-width:720px) {
  .hero-visual { min-height:250px; margin-top:6px; }
  .hv-main { inset:0 8px; }
  .hv-signal, .hv-report { display:none; }
  .hv-chat { top:auto; bottom:10px; right:10px; }
  .stats-band { grid-template-columns:repeat(2, 1fr); margin-top:24px; }
  .stat-item { padding:14px 16px; }
  .stat-item strong { font-size:22px; }
}

/* 이어서 하기: 한 줄 가로 카드 */
.continue-card { display:flex; align-items:center; gap:24px; flex-wrap:wrap; padding:18px 24px; }
.continue-copy { min-width:220px; }
.continue-stats { display:flex; gap:10px; flex:1; }
.continue-stat { border:1px solid var(--line); border-radius:12px; padding:10px 18px; background:#fbfdff; display:grid; gap:0; min-width:104px; }
.continue-stat .muted { font-size:12px; font-weight:600; }
.continue-stat strong { font-size:22px; letter-spacing:-0.3px; color:var(--blue); }
.continue-actions { display:flex; gap:10px; flex-wrap:wrap; }
@media (max-width:1100px) {
  .continue-card { align-items:flex-start; }
}
@media (max-width:720px) {
  .continue-card { flex-direction:column; align-items:stretch; gap:14px; }
  .continue-stats { width:100%; }
  .continue-stat { flex:1; min-width:0; padding:10px 12px; }
  .continue-actions { width:100%; }
  .continue-actions .primary-button, .continue-actions .secondary-button { flex:1; }
}

/* 대화 도우미 캐릭터 선택 */
.companion-picker { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.companion-picker form { display:inline; }
.companion-card { display:grid; gap:4px; justify-items:center; width:150px; padding:14px 10px; border:1px solid var(--line); border-radius:16px; background:#fff; cursor:pointer; transition:var(--transition); }
.companion-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-soft); border-color:#c8d8f2; }
.companion-card.active { border-color:var(--blue); box-shadow:0 0 0 3px rgba(20,87,255,.12); }
.companion-card strong { font-size:14px; }
.companion-card .muted { font-size:11px; line-height:1.4; }
.companion-face { width:52px; height:52px; border-radius:16px; overflow:hidden; background:transparent; display:grid; place-items:center; }
.companion-face-img { width:100%; height:100%; object-fit:cover; }
.companion-emoji { display:grid; place-items:center; width:100%; height:100%; font-size:26px; line-height:1; }
.chat-avatar .companion-emoji { font-size:30px; }
.intro-avatar .companion-emoji { font-size:52px; }
@media (max-width:720px) {
  .companion-card { width:calc(50% - 6px); }
}

/* 캐릭터 일러스트 반영 (2026-07-04) */
.chat-avatar img, .intro-avatar img, .companion-face img, .hv-avatar-img { object-fit:contain; }
.companion-face { background:transparent; }
.chat-avatar { background:linear-gradient(150deg,#f2f7ff,#eafaf4); }
.intro-avatar { width:112px; height:112px; background:linear-gradient(150deg,#f2f7ff,#eafaf4); }
.hv-main-img { width:min(72%, 300px); }

/* 생각 중 점 애니메이션 + 타자 커서 */
.bubble.thinking { display:inline-flex; align-items:center; }
.typing-dots { display:inline-flex; gap:5px; padding:2px 0; }
.typing-dots i { width:7px; height:7px; border-radius:50%; background:#9fb4d6; display:inline-block; animation:typingDot 1.2s infinite ease-in-out; }
.typing-dots i:nth-child(2) { animation-delay:.18s; }
.typing-dots i:nth-child(3) { animation-delay:.36s; }
@keyframes typingDot { 0%, 60%, 100% { transform:translateY(0); opacity:.45; } 30% { transform:translateY(-4px); opacity:1; } }
.bubble.assistant.typing::after { content:'▏'; display:inline; margin-left:1px; color:var(--blue); animation:caretBlink .9s steps(1) infinite; }
@keyframes caretBlink { 50% { opacity:0; } }
@media (prefers-reduced-motion: reduce) {
  .typing-dots i, .bubble.assistant.typing::after { animation:none !important; }
}

/* 전문기관 카드: 전화 + 길찾기 버튼 행 */
.dir-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.dir-map { display:inline-flex; align-items:center; gap:4px; font-size:13px; font-weight:800; color:#0a7a5c; background:#eefaf4; border:1px solid #cfeee0; border-radius:999px; padding:4px 12px; }
.dir-map:hover { background:#e2f6ec; border-color:var(--mint); }

/* 전문기관 카드: 본문이 공간을 채워 오른쪽 빈 영역 제거, 사진 있을 때만 썸네일 */
.dir-body { flex:1; }
.dir-photo { width:92px; height:92px; border-radius:12px; object-fit:cover; flex-shrink:0; align-self:center; border:1px solid var(--line); }
@media (max-width:720px) {
  .dir-photo { width:72px; height:72px; }
}

/* 인트로 '대화 시작하기' 버튼: 아이콘-이름 여백 + 캐릭터 이름 노랑 + 아이콘 천천히 회전 */
.intro-start { display:inline-flex; align-items:center; gap:12px; }
.intro-start .ui-icon { width:20px; height:20px; animation:introWait 3.2s linear infinite; transform-origin:center; }
.intro-start .intro-label { display:inline; }
.intro-start .companion-name { color:#ffd33f; font-weight:900; }
@keyframes introWait { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .intro-start .ui-icon { animation:none; } }

/* 마음이 표정·제스처 무드 이미지 공통 */
.mind-mood { display:block; object-fit:contain; }
.hv-main-img, .chat-avatar-img, .intro-avatar-img, .companion-face-img, .hv-avatar-img { object-fit:contain; }
/* 히어로 캐릭터가 투명 PNG라 안쪽 여백을 줄여 크게 보이게 */
.hero-visual .hv-main { padding:8px; }
/* 홈 여정 카드 무드 캐릭터 */
.step-mood { width:64px; height:64px; margin:0 auto 8px; display:block; }
/* 콘텐츠 섹션에 곁들이는 마스코트 */
.mood-aside { display:flex; align-items:center; gap:16px; }
.mood-aside .mind-mood { width:110px; height:110px; flex-shrink:0; }
@media (max-width:720px){ .mood-aside .mind-mood { width:84px; height:84px; } }

/* 지원 밴드 위로 캐릭터 — 흰 라운드 카드 + 그림자 */
.support-band-char { width:104px; height:104px; flex-shrink:0; padding:10px; background:#fff; border-radius:22px; box-shadow:0 12px 28px rgba(0,0,0,.22); object-fit:contain; }
@media (max-width:720px){ .support-band-char { width:84px; height:84px; border-radius:18px; } }

/* 앱 스타일 PNG 아이콘 */
.app-icon-img { width:58px; height:58px; object-fit:contain; display:block; margin-bottom:14px; border-radius:16px; box-shadow:0 6px 16px rgba(25,52,98,.12); }

/* 리포트 카드 헤더 마음이 */
.report-card .section-head .mind-mood { width:56px; height:56px; flex-shrink:0; }

/* 페이지별 마스코트 배치 크기 */
.floating-panel .section-head .mind-mood { width:52px; height:52px; flex-shrink:0; }
.dashboard-preview .mind-mood { width:180px; height:180px; }
.nature-char { width:88px; height:88px; margin-bottom:8px; }
#resultMood { object-fit:contain; }

/* 저장소 흐름 카드 마음이 */
.panel .mind-mood { width:56px; height:56px; flex-shrink:0; }

/* UX balance fixes 2026-07-04 */
.step-no { display:inline-grid; place-items:center; flex:0 0 26px; min-width:26px; line-height:1; vertical-align:middle; }
.choice-tile { min-height:132px; padding:14px 10px; gap:8px; grid-template-rows:auto auto; align-content:center; }
.choice-symbol { width:78px; height:78px; border-radius:22px; background:#f6f9ff; border:1px solid #e6eef9; display:grid; place-items:center; overflow:hidden; }
.choice-symbol .fitmind-icon-image, .choice-symbol .feeling-icon-img { width:100%; height:100%; object-fit:contain; padding:4px; }
.choice-face { font-size:18px; font-weight:900; line-height:1.15; }
.choice-tile small { display:none; }
.mobile-nav-icon { width:24px; height:24px; margin:0; border-radius:8px; box-shadow:none; object-fit:contain; }
.mobile-tabbar a { gap:3px; padding-top:6px; padding-bottom:4px; }
.program-layout { grid-template-columns:minmax(0, 1fr) 360px; }
.program-list-col { min-width:0; }
.program-card { display:grid; gap:10px; align-content:start; }
.program-card h3 { margin:0; font-size:18px; }
.program-card-head { display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap; }
.program-meta { display:grid; gap:7px; margin:0; }
.program-meta div { display:grid; grid-template-columns:42px minmax(0, 1fr); gap:8px; align-items:start; font-size:13px; }
.program-meta dt { color:var(--muted); font-weight:800; }
.program-meta dd { margin:0; color:#243653; font-weight:700; }
.program-application-panel { display:grid; gap:14px; border:1px solid #cfeee4; background:linear-gradient(150deg,#f7fffc,#ffffff); border-radius:16px; padding:16px; margin:12px 0 16px; box-shadow:var(--shadow-soft); }
.program-application-panel h3 { margin:8px 0 2px; }
.program-detail-grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; }
.program-detail-grid span { display:grid; gap:3px; border:1px solid #e4edf7; background:#fbfdff; border-radius:12px; padding:10px 12px; }
.program-detail-grid strong { font-size:12px; color:#5d6d87; }
.program-detail-grid em { font-style:normal; font-weight:900; color:#14213f; font-size:13px; }
.program-apply-flow { margin:0; padding-left:20px; color:#43536f; font-size:13px; }
.program-calendar-card { position:sticky; top:96px; }
.report-card { background:linear-gradient(180deg,#ffffff,#fbfdff); }
.report-lead { border-left:4px solid var(--blue); padding:10px 12px; background:#f6f9ff; border-radius:12px; }
.report-cell { position:relative; overflow:hidden; border-color:#dfe8f5; background:#fff; padding:16px 16px 16px 18px; }
.report-cell::before { content:''; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--blue); }
.report-cell:nth-child(2)::before { background:var(--mint); }
.report-cell:nth-child(3)::before { background:#ffb648; }
.report-cell h3 { font-size:15px; }
.rec-block { border:1px solid #e3ebf6; border-radius:16px; background:#fff; padding:14px; }
.rec-block + .rec-block { margin-top:12px; }
.rec-block h3 { display:flex; align-items:center; gap:8px; }
.rec-block h3::before { content:''; width:8px; height:8px; border-radius:50%; background:var(--blue); }
.rec-block:nth-of-type(odd) h3::before { background:var(--mint); }
.expert-line { border-color:#bceada; background:linear-gradient(150deg,#effcf8,#ffffff); box-shadow:0 8px 22px rgba(35,199,165,.10); }
@media (max-width:720px) {
  .hero-visual { min-height:364px; margin-top:14px; overflow:visible; }
  .hv-main { inset:38px 8px 60px; }
  .hv-main-img { width:min(74%, 230px); }
  .hv-card { padding:10px 12px; border-radius:14px; }
  .hv-card h3 { font-size:12px; }
  .hv-card p { font-size:11px; line-height:1.35; }
  .hv-chat { display:grid; top:4px; right:0; bottom:auto; max-width:220px; }
  .hv-signal { display:grid; left:0; top:46%; max-width:172px; }
  .hv-report { display:grid; right:0; bottom:0; max-width:216px; }
  .continue-actions .primary-button, .continue-actions .secondary-button { white-space:nowrap; padding:0 12px; }
  .feature-card { display:grid; grid-template-columns:72px minmax(0,1fr); align-items:center; gap:4px 14px; min-height:138px; padding:16px; }
  .feature-card .app-icon-img { grid-row:1 / span 2; width:62px; height:62px; margin:0; }
  .feature-card h3 { margin:0; font-size:18px; align-self:end; }
  .feature-card p { grid-column:2; margin:3px 0 0; align-self:start; }
  .choice-row { gap:10px; }
  .choice-tile { min-height:122px; padding:12px 8px; }
  .choice-symbol { width:64px; height:64px; border-radius:18px; }
  .mobile-tabbar { min-height:70px; }
  .mobile-tabbar a { font-size:11px; line-height:1.15; }
  .program-layout { grid-template-columns:1fr; }
  .program-calendar-card { order:-1; position:static; }
  .program-grid { grid-template-columns:1fr; }
  .program-detail-grid { grid-template-columns:1fr; }
  .program-application-panel { padding:14px; }
  .program-meta div { grid-template-columns:38px minmax(0,1fr); }
}
/* program-cover white centered */
.asset-image.program-cover, .asset-slot.program-cover {
  background:#fff !important;
  display:grid;
  place-items:center;
}
.asset-image.program-cover {
  object-fit:contain;
  object-position:center center;
}
/* program top planner layout */
.program-top-layout {
  display:grid;
  grid-template-columns:minmax(0, 1fr) 360px;
  gap:22px;
  align-items:start;
  margin-top:18px;
}
.program-top-layout .for-me-card {
  border-color:#cfeee4;
  background:#f7fffc;
  min-width:0;
}
.program-top-layout .rec-grid {
  grid-template-columns:repeat(2, minmax(0, 1fr));
}
.program-top-layout .program-calendar-card {
  align-self:start;
  position:sticky;
  top:96px;
}
.program-list-section {
  margin-top:0;
}
.program-list-section > div {
  min-width:0;
}
.program-list-section .program-grid {
  grid-template-columns:repeat(4, minmax(0, 1fr));
}

@media (max-width:1100px) {
  .program-top-layout {
    grid-template-columns:1fr;
  }
  .program-top-layout .program-calendar-card {
    position:static;
  }
  .program-list-section .program-grid {
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
@media (max-width:720px) {
  .program-top-layout {
    gap:14px;
  }
  .program-top-layout .rec-grid,
  .program-list-section .program-grid {
    grid-template-columns:1fr;
  }
}
/* program page side calendar layout */
.program-page-layout {
  display:grid;
  grid-template-columns:minmax(0, 1fr) 360px;
  gap:22px;
  align-items:start;
  margin-top:18px;
}
.program-left-flow {
  display:contents;
}
.program-left-flow .for-me-card {
  grid-column:1;
  grid-row:1;
  align-self:stretch;
  min-width:0;
  border-color:#cfeee4;
  background:#f7fffc;
}
.program-left-flow .rec-grid {
  grid-template-columns:repeat(2, minmax(0, 1fr));
}
.program-page-layout > .program-calendar-card {
  grid-column:2;
  grid-row:1;
  align-self:start;
  position:sticky;
  top:96px;
}
.program-left-flow .pill-tabs {
  grid-column:1 / -1;
  grid-row:2;
  margin:16px 0 18px;
}
.program-left-flow .ptab {
  grid-column:1 / -1;
  grid-row:3;
  min-width:0;
}
.program-left-flow .program-list-section {
  margin-top:0;
}
.program-left-flow .program-grid {
  grid-template-columns:repeat(4, minmax(0, 1fr));
  align-items:stretch;
}
.program-left-flow .program-card {
  min-width:0;
}
.program-page-layout > .program-calendar-card {
  padding:14px 16px;
  gap:8px;
}
.program-page-layout > .program-calendar-card .section-head {
  align-items:center;
  margin-bottom:2px;
}
.program-page-layout > .program-calendar-card .section-head h2 {
  font-size:18px;
}
.program-page-layout > .program-calendar-card .calendar-grid {
  gap:5px;
  font-size:12px;
}
.program-page-layout > .program-calendar-card .calendar-grid span {
  min-height:24px;
}
.program-page-layout > .program-calendar-card p {
  margin:0;
}
.program-page-layout > .program-calendar-card .schedule-actions {
  gap:8px;
  margin-top:4px;
}
.program-page-layout > .program-calendar-card .schedule-time {
  min-height:36px;
  padding:0 13px;
  border-radius:10px;
}
@media (max-width:1100px) {
  .program-page-layout {
    grid-template-columns:1fr;
  }
  .program-left-flow {
    display:block;
    min-width:0;
  }
  .program-left-flow .for-me-card,
  .program-left-flow .pill-tabs,
  .program-left-flow .ptab,
  .program-page-layout > .program-calendar-card {
    grid-column:auto;
    grid-row:auto;
  }
  .program-page-layout > .program-calendar-card {
    position:static;
  }
  .program-left-flow .program-grid {
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
@media (max-width:720px) {
  .program-page-layout > .program-calendar-card {
    order:-1;
  }
  .program-left-flow .rec-grid,
  .program-left-flow .program-grid {
    grid-template-columns:1fr;
  }
}
/* mobile balance alignment 2026-07-04 ux23 */
@media (max-width:720px) {
  .chat-intro .companion-picker {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
    width:min(100%, 316px);
    margin:0 auto;
    justify-content:center;
  }
  .chat-intro .companion-picker > p {
    grid-column:1 / -1;
    text-align:center;
  }
  .chat-intro .companion-picker form {
    display:block;
    min-width:0;
  }
  .chat-intro .companion-card {
    width:100%;
    min-height:134px;
    padding:14px 12px;
  }
  .chat-intro .companion-card .muted {
    max-width:96px;
    text-align:center;
  }
  .home-hero .hero-actions {
    justify-content:center;
    width:100%;
  }
  .home-hero .hero-copy > p.muted {
    text-align:center;
  }
  .home-hero .hero-copy > ul {
    width:fit-content;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
    text-align:left;
  }
  .chat-topbar {
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
  }
  .chat-title {
    width:100%;
    justify-content:center;
  }
  .chat-title > div {
    text-align:left;
  }
  .chat-topbar .mode-toggle {
    margin:0 auto;
  }
}
/* mobile home list center correction ux24 */
@media (max-width:720px) {
  .home-hero .hero-copy > ul {
    display:grid;
    width:max-content;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
    padding-left:0;
    list-style-position:inside;
    justify-items:start;
  }
}
/* mobile inline list margin override ux25 */
@media (max-width:720px) {
  .home-hero .hero-copy > ul {
    margin:12px auto 0 !important;
  }
}
/* Optional account login */
.account-chip { display:inline-flex; align-items:center; min-height:36px; border-radius:999px; padding:0 14px; border:1px solid #cfe0ff; background:#f8fbff; color:#1c2b54; font-weight:900; font-size:13px; white-space:nowrap; }
.account-chip:hover { border-color:var(--blue); color:var(--blue); }
.account-chip.open { border-color:#fee500; background:#fff9c7; color:#251d00; }
.header-logout-form { margin:0; }
.logout-button { min-height:36px; border-radius:999px; padding:0 13px; border:1px solid #d6e1f2; background:#fff; color:#53647f; font-weight:900; font-size:13px; cursor:pointer; white-space:nowrap; }
.logout-button:hover { color:var(--blue); border-color:var(--blue); background:#f7faff; }
.login-layout { max-width:980px; margin-inline:auto; }
.login-head { align-items:flex-start; }
.login-mode-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; margin:22px 0; }
.login-mode-card { border:1px solid var(--line); border-radius:16px; background:#fff; padding:18px; min-height:168px; box-shadow:var(--shadow-soft); display:flex; flex-direction:column; gap:8px; color:var(--ink); }
.login-mode-card.selected { border-color:#fee500; background:#fffdf0; }
.login-mode-card strong { font-size:17px; }
.login-mode-card span { color:var(--muted); font-size:14px; }
.login-mode-icon { width:54px; height:54px; object-fit:contain; border-radius:16px; background:#f5f8fd; border:1px solid var(--line); padding:6px; }
.login-panel { padding:24px; }
.login-kakao-box, .login-account-state { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:20px; align-items:center; }
.login-auth-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:16px; align-items:stretch; }
.login-auth-card { border:1px solid var(--line); border-radius:16px; background:#fff; padding:18px; display:grid; gap:12px; align-content:start; min-width:0; }
.login-auth-card h2 { margin:0 0 6px; color:var(--ink); font-size:20px; }
.login-auth-card label { display:grid; gap:6px; color:#25385f; font-size:13px; font-weight:900; }
.login-auth-card input[type=email], .login-auth-card input[type=password], .login-auth-card input[type=text] { width:100%; min-height:44px; border:1px solid #d7e3f5; border-radius:12px; padding:0 12px; font:inherit; color:var(--ink); background:#fbfdff; }
.login-auth-card input:focus { border-color:var(--blue); outline:none; box-shadow:0 0 0 3px rgba(20,87,255,.12); background:#fff; }
.login-check { grid-template-columns:auto minmax(0,1fr) !important; align-items:flex-start; font-weight:800 !important; line-height:1.45; }
.login-check input { margin-top:3px; }
.kakao-auth-card { background:#fffdf0; border-color:#f7e26d; }
.kakao-login-button { width:100%; max-width:100%; min-width:0; min-height:48px; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; padding:0 16px; border:1px solid #f4d800; background:#fee500; color:#191600; font-weight:900; box-shadow:0 8px 16px rgba(254,229,0,.22); white-space:normal; text-align:center; }
.kakao-login-button:hover { transform:translateY(-1px); box-shadow:0 12px 22px rgba(254,229,0,.30); }
.kakao-login-button.disabled { opacity:.55; cursor:not-allowed; box-shadow:none; }
.login-config-note { grid-column:1 / -1; min-width:0; max-width:100%; border:1px solid #fed7aa; background:#fff7ed; color:#9a3412; border-radius:12px; padding:12px 14px; display:grid; gap:4px; overflow-wrap:anywhere; word-break:break-word; }
.login-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; }
.notice { border:1px solid #bfe3d6; background:#f0fdf8; color:#067a57; border-radius:14px; padding:14px 16px; margin:0 0 16px; font-weight:800; }
.notice.danger { border-color:#fecaca; background:#fff1f2; color:#be123c; }
@media (max-width:1100px) { .header-logout-form { display:none; } }
@media (max-width:980px) {
  .login-mode-grid, .login-auth-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .kakao-auth-card { grid-column:1 / -1; }
}
@media (max-width:720px) {
  .account-chip { margin-left:auto; min-height:34px; padding:0 11px; font-size:12px; }
  .login-mode-grid, .login-auth-grid, .login-kakao-box, .login-account-state { grid-template-columns:1fr; }
  .login-panel { padding:18px; }
  .login-actions { justify-content:stretch; }
  .login-actions .primary-button, .login-actions .secondary-button, .login-actions form, .login-actions button, .kakao-login-button { width:100%; }
}
/* Mind check equal card layout */
.mind-check-scene { position:relative; isolation:isolate; padding-top:1px; }
.mind-check-scene .mood-aside, .mind-check-scene .chat-note, .mind-check-grid { position:relative; z-index:2; }
.mind-check-peek-character { position:absolute; right:7%; top:-58px; width:310px; height:auto; z-index:1; pointer-events:none; filter:drop-shadow(0 20px 32px rgba(20,87,255,.16)); }
.mind-check-grid { grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); align-items:stretch; }
.mind-check-grid > .card { min-height:228px; }
.mind-check-stress-card { position:relative; overflow:hidden; display:flex; align-items:stretch; background:#fff; }
.stress-card-content { position:relative; z-index:1; width:100%; display:flex; flex-direction:column; justify-content:center; }
.mind-check-stress-card input[type=range] { position:relative; z-index:1; }
@media (max-width:1100px) { .mind-check-peek-character { right:3%; top:-22px; width:230px; opacity:.95; } .mind-check-grid { grid-template-columns:1fr; } }
@media (max-width:720px) { .mind-check-peek-character { display:none; } .mind-check-grid > .card { min-height:0; } .mind-check-stress-card { min-height:220px; } }
/* Companion picker character scale */
.chat-intro .intro-avatar { width:128px; height:128px; border-radius:32px; padding:6px; }
.chat-intro .intro-avatar-img { transform:scale(1.08); transform-origin:center; }
.chat-intro .companion-card { min-height:174px; padding:16px 12px 15px; }
.chat-intro .companion-face { width:78px; height:78px; border-radius:22px; }
.chat-intro .companion-face-img { transform:scale(1.10); transform-origin:center; }
@media (max-width:720px) {
  .chat-intro .intro-avatar { width:108px; height:108px; border-radius:28px; }
  .chat-intro .companion-card { min-height:156px; padding:15px 10px 13px; }
  .chat-intro .companion-face { width:70px; height:70px; border-radius:20px; }
}
/* Chat bubble avatar rows */
.chat-message.assistant-message { display:flex; align-items:flex-start; gap:10px; max-width:86%; justify-self:start; }
.chat-message.assistant-message .bubble { max-width:100%; min-width:0; }
.message-avatar { flex:0 0 42px; width:42px; height:42px; border-radius:50%; overflow:hidden; background:linear-gradient(150deg,#f2f7ff,#eafaf4); border:1px solid #dce8fb; box-shadow:0 4px 12px rgba(20,87,255,.10); display:grid; place-items:center; }
.message-avatar-img { width:100%; height:100%; object-fit:contain; padding:4px; }
.message-avatar .companion-emoji { font-size:24px; line-height:1; }
@media (max-width:720px) {
  .chat-message.assistant-message { max-width:100%; gap:8px; }
  .message-avatar { flex-basis:36px; width:36px; height:36px; }
  .message-avatar-img { padding:3px; }
}
/* Mind check character reveal: show upper body above the card */
.mind-check-peek-character { right:6%; top:-62px; width:330px; }
.mind-check-scene .mind-check-grid { margin-top:54px !important; }
@media (max-width:1100px) {
  .mind-check-peek-character { right:4%; top:-44px; width:250px; }
  .mind-check-scene .mind-check-grid { margin-top:64px !important; }
}
@media (max-width:720px) {
  .mind-check-peek-character { display:none; }
  .mind-check-scene .mind-check-grid { margin-top:22px !important; }
}
/* Stress emotion slider icon */
.mind-check-peek-character { display:none !important; }
.mind-check-scene .mind-check-grid { margin-top:22px !important; }
.mind-check-grid > .mind-check-stress-card { min-height:0; }
.mind-check-stress-card { border:0; box-shadow:none; background:transparent; padding:0; overflow:visible; }
.stress-card-content { justify-content:start; gap:12px; }
.stress-emotion-stage { min-height:150px; display:grid; place-items:center; padding:0 0 2px; }
.stress-emotion-icon { width:168px; height:168px; object-fit:contain; filter:drop-shadow(0 16px 24px rgba(20,87,255,.16)); opacity:1; transform:translateY(0) scale(1); transition:opacity .18s ease, transform .18s ease; }
.stress-emotion-icon.is-changing { opacity:0; transform:translateY(8px) scale(.96); }
.stress-range-panel { border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:var(--shadow-soft); padding:20px 18px 18px; min-height:156px; display:grid; gap:12px; align-content:center; }
.stress-range-panel h2 { margin:0; }
.stress-range-panel p { margin:0; }
@media (max-width:1100px) {
  .mind-check-scene .mind-check-grid { margin-top:22px !important; }
}
@media (max-width:720px) {
  .stress-emotion-stage { min-height:128px; }
  .stress-emotion-icon { width:142px; height:142px; }
  .stress-range-panel { min-height:148px; padding:18px 16px; }
}
/* Mind check emotion layout balance 20260704-emotion02 */
.mind-check-grid { grid-template-columns:minmax(0, 1.28fr) minmax(360px, .82fr); gap:16px; }
.stress-emotion-stage { min-height:258px; padding:0; }
.stress-emotion-icon { width:256px; height:256px; filter:none; }
.stress-range-panel { min-height:132px; padding:16px 18px 15px; gap:10px; }
@media (max-width:1100px) {
  .mind-check-grid { grid-template-columns:1fr; gap:18px; }
  .stress-emotion-stage { min-height:210px; }
  .stress-emotion-icon { width:210px; height:210px; }
}
@media (max-width:720px) {
  .stress-emotion-stage { min-height:148px; }
  .stress-emotion-icon { width:148px; height:148px; }
  .stress-range-panel { min-height:144px; padding:16px 14px; }
}
/* Mind check vertical compact 20260704-emotion03 */
.mind-check-grid { align-items:start; }
.mind-check-grid > .card { min-height:0; }
.mind-check-grid > .card:not(.mind-check-stress-card) { align-self:start; }
.mind-check-stress-card { align-self:start; }
.stress-card-content { gap:8px; }
.stress-emotion-stage { min-height:196px; align-items:end; padding-bottom:2px; }
.stress-emotion-icon { width:228px; height:228px; }
.stress-range-panel { min-height:124px; padding:14px 16px 13px; gap:8px; }
@media (max-width:1100px) {
  .stress-emotion-stage { min-height:184px; }
  .stress-emotion-icon { width:196px; height:196px; }
}
@media (max-width:720px) {
  .stress-emotion-stage { min-height:138px; align-items:center; }
  .stress-emotion-icon { width:148px; height:148px; }
}
/* Mind check same height right stack 20260704-emotion04 */
@media (min-width:1101px) {
  .mind-check-stress-card { height:294px; }
  .stress-card-content { height:100%; display:grid; grid-template-rows:146px 140px; gap:8px; }
  .stress-emotion-stage { min-height:0; height:146px; align-items:end; overflow:visible; }
  .stress-emotion-icon { width:206px; height:206px; }
  .stress-range-panel { min-height:0; height:140px; padding:12px 16px; gap:6px; align-content:center; }
  .stress-range-panel h2 { font-size:20px; line-height:1.2; white-space:nowrap; }
  .stress-range-panel p { font-size:13px; }
}
/* Mind check right full width 20260704-emotion05 */
@media (min-width:1101px) {
  .stress-card-content { grid-template-columns:minmax(0, 1fr); justify-items:stretch; }
  .stress-emotion-stage, .stress-range-panel { width:100%; justify-self:stretch; }
}
/* Mind check right text no crop 20260704-emotion06 */
@media (min-width:1101px) {
  .stress-card-content { width:100%; grid-template-columns:minmax(0, 1fr); justify-items:stretch; }
  .stress-emotion-stage, .stress-range-panel { width:100%; max-width:100%; justify-self:stretch; }
  .stress-range-panel { overflow:visible; }
  .stress-range-panel h2 { white-space:normal; overflow:visible; word-break:keep-all; font-size:19px; }
}
/* Mind check raised stress icon 20260704-emotion07 */
@media (min-width:1101px) {
  .stress-emotion-stage { position:relative; overflow:visible; }
  .stress-emotion-icon { position:absolute; left:50%; bottom:-22px; width:224px; height:224px; transform:translateX(-50%); }
  .stress-emotion-icon.is-changing { transform:translateX(-50%) translateY(8px) scale(.96); }
}

/* Mobile five tab navigation 20260704-survey01 */
@media (max-width:720px) {
  .mobile-tabbar { grid-template-columns:repeat(5, minmax(0, 1fr)); }
  .mobile-tabbar a { min-width:0; }
  .mobile-tabbar span { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}